From d7d19c14dc898762fb1b552eaf0eb4664e3b6f6a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Kacper=20Miko=C5=82ajczak?= <kacpermikolajczak10@gmail.com>
Date: Thu, 26 Oct 2023 21:19:17 +0200
Subject: [PATCH] hijack ref without hover support

---
 src/components/Hoverable/index.js | 16 +++++++++++-----
 1 file changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/Hoverable/index.js b/src/components/Hoverable/index.js
index 2ded0e52e94d..62f42a9b4b93 100644
--- a/src/components/Hoverable/index.js
+++ b/src/components/Hoverable/index.js
@@ -194,15 +194,21 @@ const Hoverable = React.forwardRef(({disabled, onHoverIn, onHoverOut, onMouseEnt
         [child.props],
     );
 
+    // We need to access the ref of a children from both parent and current component
+    // So we pass it to current ref and assign it once again to the child ref prop
+    const hijackRef = (el) => {
+        ref.current = el;
+        assignRef(child.ref, el);
+    };
+
     if (!DeviceCapabilities.hasHoverSupport()) {
-        return child;
+        return React.cloneElement(child, {
+            ref: hijackRef,
+        });
     }
 
     return React.cloneElement(child, {
-        ref: (el) => {
-            ref.current = el;
-            assignRef(child.ref, el);
-        },
+        ref: hijackRef,
         onMouseEnter: enableHoveredOnMouseEnter,
         onMouseLeave: disableHoveredOnMouseLeave,
         onBlur: disableHoveredOnBlur,