@cypress-design/react-tooltip 0.10.1 → 1.0.0

package/dist/index.es.mjs

@@ -7057,7 +7057,7 @@ function requireReactDom_development () {
 	  return a !== 0 && a < b ? a : b;
 	}
 	function lowerEventPriority(a, b) {
-	  return a === 0 || a > b ? a : b;
+	  return a > b ? a : b;
 	}
 	function isHigherEventPriority(a, b) {
 	  return a !== 0 && a < b;
@@ -10178,7 +10178,7 @@ function requireReactDom_development () {
 
 	  var isCapturePhaseListener = false;
 	  var listenerSet = getEventListenerSet(targetElement);
-	  var listenerSetKey = getListenerSetKey(domEventName, isCapturePhaseListener);
+	  var listenerSetKey = getListenerSetKey(domEventName);
 
 	  if (!listenerSet.has(listenerSetKey)) {
 	    addTrappedEventListener(targetElement, domEventName, IS_NON_DELEGATED, isCapturePhaseListener);
@@ -10575,7 +10575,7 @@ function requireReactDom_development () {
 	  }
 	}
 	function getListenerSetKey(domEventName, capture) {
-	  return domEventName + "__" + (capture ? 'capture' : 'bubble');
+	  return domEventName + "__" + ('bubble');
 	}
 
 	var didWarnInvalidHydration = false;
@@ -31164,7 +31164,7 @@ function isMouseLikePointerType(pointerType, strict) {
   // On some Linux machines with Chromium, mouse inputs return a `pointerType`
   // of "pen": https://github.com/floating-ui/floating-ui/issues/2015
   const values = ['mouse', 'pen'];
-  if (!strict) {
+  {
     values.push('', undefined);
   }
   return values.includes(pointerType);
@@ -31545,7 +31545,7 @@ async function detectOverflow(state, options) {
  * appears centered to the reference element.
  * @see https://floating-ui.com/docs/arrow
  */
-const arrow$2 = options => ({
+const arrow$3 = options => ({
   name: 'arrow',
   options,
   async fn(state) {
@@ -31628,7 +31628,7 @@ const arrow$2 = options => ({
  * clipping boundary. Alternative to `autoPlacement`.
  * @see https://floating-ui.com/docs/flip
  */
-const flip$1 = function (options) {
+const flip$2 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -31786,7 +31786,7 @@ async function convertValueToCoords(state, options) {
  * object may be passed.
  * @see https://floating-ui.com/docs/offset
  */
-const offset = function (options) {
+const offset$2 = function (options) {
   if (options === void 0) {
     options = 0;
   }
@@ -31825,7 +31825,7 @@ const offset = function (options) {
  * keep it in view when it will overflow the clipping boundary.
  * @see https://floating-ui.com/docs/shift
  */
-const shift$1 = function (options) {
+const shift$2 = function (options) {
   if (options === void 0) {
     options = {};
   }
@@ -31995,8 +31995,9 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
   if (domElement) {
     const win = getWindow(domElement);
     const offsetWin = offsetParent && isElement(offsetParent) ? getWindow(offsetParent) : offsetParent;
-    let currentIFrame = win.frameElement;
-    while (currentIFrame && offsetParent && offsetWin !== win) {
+    let currentWin = win;
+    let currentIFrame = currentWin.frameElement;
+    while (currentIFrame && offsetParent && offsetWin !== currentWin) {
       const iframeScale = getScale(currentIFrame);
       const iframeRect = currentIFrame.getBoundingClientRect();
       const css = getComputedStyle(currentIFrame);
@@ -32008,7 +32009,8 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
       height *= iframeScale.y;
       x += left;
       y += top;
-      currentIFrame = getWindow(currentIFrame).frameElement;
+      currentWin = getWindow(currentIFrame);
+      currentIFrame = currentWin.frameElement;
     }
   }
   return rectToClientRect({
@@ -32020,27 +32022,14 @@ function getBoundingClientRect(element, includeScale, isFixedStrategy, offsetPar
 }
 
 const topLayerSelectors = [':popover-open', ':modal'];
-function topLayer(floating) {
-  let isTopLayer = false;
-  let x = 0;
-  let y = 0;
-  function setIsTopLayer(selector) {
+function isTopLayer(element) {
+  return topLayerSelectors.some(selector => {
     try {
-      isTopLayer = isTopLayer || floating.matches(selector);
-    } catch (e) {}
-  }
-  topLayerSelectors.forEach(selector => {
-    setIsTopLayer(selector);
-  });
-  if (isTopLayer) {
-    const containingBlock = getContainingBlock(floating);
-    if (containingBlock) {
-      const rect = containingBlock.getBoundingClientRect();
-      x = rect.x;
-      y = rect.y;
+      return element.matches(selector);
+    } catch (e) {
+      return false;
     }
-  }
-  return [isTopLayer, x, y];
+  });
 }
 
 function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
@@ -32050,9 +32039,10 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
     offsetParent,
     strategy
   } = _ref;
+  const isFixed = strategy === 'fixed';
   const documentElement = getDocumentElement(offsetParent);
-  const [isTopLayer] = elements ? topLayer(elements.floating) : [false];
-  if (offsetParent === documentElement || isTopLayer) {
+  const topLayer = elements ? isTopLayer(elements.floating) : false;
+  if (offsetParent === documentElement || topLayer && isFixed) {
     return rect;
   }
   let scroll = {
@@ -32062,7 +32052,7 @@ function convertOffsetParentRelativeRectToViewportRelativeRect(_ref) {
   let scale = createCoords(1);
   const offsets = createCoords(0);
   const isOffsetParentAnElement = isHTMLElement(offsetParent);
-  if (isOffsetParentAnElement || !isOffsetParentAnElement && strategy !== 'fixed') {
+  if (isOffsetParentAnElement || !isOffsetParentAnElement && !isFixed) {
     if (getNodeName(offsetParent) !== 'body' || isOverflowElement(documentElement)) {
       scroll = getNodeScroll(offsetParent);
     }
@@ -32223,7 +32213,7 @@ function getClippingRect(_ref) {
     rootBoundary,
     strategy
   } = _ref;
-  const elementClippingAncestors = boundary === 'clippingAncestors' ? getClippingElementAncestors(element, this._c) : [].concat(boundary);
+  const elementClippingAncestors = boundary === 'clippingAncestors' ? isTopLayer(element) ? [] : getClippingElementAncestors(element, this._c) : [].concat(boundary);
   const clippingAncestors = [...elementClippingAncestors, rootBoundary];
   const firstClippingAncestor = clippingAncestors[0];
   const clippingRect = clippingAncestors.reduce((accRect, clippingAncestor) => {
@@ -32253,7 +32243,7 @@ function getDimensions(element) {
   };
 }
 
-function getRectRelativeToOffsetParent(element, offsetParent, strategy, floating) {
+function getRectRelativeToOffsetParent(element, offsetParent, strategy) {
   const isOffsetParentAnElement = isHTMLElement(offsetParent);
   const documentElement = getDocumentElement(offsetParent);
   const isFixed = strategy === 'fixed';
@@ -32275,17 +32265,8 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy, floating
       offsets.x = getWindowScrollBarX(documentElement);
     }
   }
-  let x = rect.left + scroll.scrollLeft - offsets.x;
-  let y = rect.top + scroll.scrollTop - offsets.y;
-  const [isTopLayer, topLayerX, topLayerY] = topLayer(floating);
-  if (isTopLayer) {
-    x += topLayerX;
-    y += topLayerY;
-    if (isOffsetParentAnElement) {
-      x += offsetParent.clientLeft;
-      y += offsetParent.clientTop;
-    }
-  }
+  const x = rect.left + scroll.scrollLeft - offsets.x;
+  const y = rect.top + scroll.scrollTop - offsets.y;
   return {
     x,
     y,
@@ -32294,6 +32275,10 @@ function getRectRelativeToOffsetParent(element, offsetParent, strategy, floating
   };
 }
 
+function isStaticPositioned(element) {
+  return getComputedStyle(element).position === 'static';
+}
+
 function getTrueOffsetParent(element, polyfill) {
   if (!isHTMLElement(element) || getComputedStyle(element).position === 'fixed') {
     return null;
@@ -32307,29 +32292,41 @@ function getTrueOffsetParent(element, polyfill) {
 // Gets the closest ancestor positioned element. Handles some edge cases,
 // such as table ancestors and cross browser bugs.
 function getOffsetParent(element, polyfill) {
-  const window = getWindow(element);
+  const win = getWindow(element);
+  if (isTopLayer(element)) {
+    return win;
+  }
   if (!isHTMLElement(element)) {
-    return window;
+    let svgOffsetParent = getParentNode(element);
+    while (svgOffsetParent && !isLastTraversableNode(svgOffsetParent)) {
+      if (isElement(svgOffsetParent) && !isStaticPositioned(svgOffsetParent)) {
+        return svgOffsetParent;
+      }
+      svgOffsetParent = getParentNode(svgOffsetParent);
+    }
+    return win;
   }
   let offsetParent = getTrueOffsetParent(element, polyfill);
-  while (offsetParent && isTableElement(offsetParent) && getComputedStyle(offsetParent).position === 'static') {
+  while (offsetParent && isTableElement(offsetParent) && isStaticPositioned(offsetParent)) {
     offsetParent = getTrueOffsetParent(offsetParent, polyfill);
   }
-  if (offsetParent && (getNodeName(offsetParent) === 'html' || getNodeName(offsetParent) === 'body' && getComputedStyle(offsetParent).position === 'static' && !isContainingBlock(offsetParent))) {
-    return window;
+  if (offsetParent && isLastTraversableNode(offsetParent) && isStaticPositioned(offsetParent) && !isContainingBlock(offsetParent)) {
+    return win;
   }
-  return offsetParent || getContainingBlock(element) || window;
+  return offsetParent || getContainingBlock(element) || win;
 }
 
 const getElementRects = async function (data) {
   const getOffsetParentFn = this.getOffsetParent || getOffsetParent;
   const getDimensionsFn = this.getDimensions;
+  const floatingDimensions = await getDimensionsFn(data.floating);
   return {
-    reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy, data.floating),
+    reference: getRectRelativeToOffsetParent(data.reference, await getOffsetParentFn(data.floating), data.strategy),
     floating: {
       x: 0,
       y: 0,
-      ...(await getDimensionsFn(data.floating))
+      width: floatingDimensions.width,
+      height: floatingDimensions.height
     }
   };
 };
@@ -32399,9 +32396,11 @@ function observeMove(element, onMove) {
           return refresh();
         }
         if (!ratio) {
+          // If the reference is clipped, the ratio is 0. Throttle the refresh
+          // to prevent an infinite loop of updates.
           timeoutId = setTimeout(() => {
             refresh(false, 1e-7);
-          }, 100);
+          }, 1000);
         } else {
           refresh(false, ratio);
         }
@@ -32505,12 +32504,21 @@ function autoUpdate(reference, floating, update, options) {
   };
 }
 
+/**
+ * Modifies the placement by translating the floating element along the
+ * specified axes.
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
+ * object may be passed.
+ * @see https://floating-ui.com/docs/offset
+ */
+const offset$1 = offset$2;
+
 /**
  * Optimizes the visibility of the floating element by shifting it in order to
  * keep it in view when it will overflow the clipping boundary.
  * @see https://floating-ui.com/docs/shift
  */
-const shift = shift$1;
+const shift$1 = shift$2;
 
 /**
  * Optimizes the visibility of the floating element by flipping the `placement`
@@ -32518,14 +32526,14 @@ const shift = shift$1;
  * clipping boundary. Alternative to `autoPlacement`.
  * @see https://floating-ui.com/docs/flip
  */
-const flip = flip$1;
+const flip$1 = flip$2;
 
 /**
  * Provides data to position an inner element of the floating element so that it
  * appears centered to the reference element.
  * @see https://floating-ui.com/docs/arrow
  */
-const arrow$1 = arrow$2;
+const arrow$2 = arrow$3;
 
 /**
  * Computes the `x` and `y` coordinates that will place the floating element
@@ -32550,44 +32558,6 @@ const computePosition = (reference, floating, options) => {
   });
 };
 
-/**
- * Provides data to position an inner element of the floating element so that it
- * appears centered to the reference element.
- * This wraps the core `arrow` middleware to allow React refs as the element.
- * @see https://floating-ui.com/docs/arrow
- */
-const arrow = options => {
-  function isRef(value) {
-    return {}.hasOwnProperty.call(value, 'current');
-  }
-  return {
-    name: 'arrow',
-    options,
-    fn(state) {
-      const {
-        element,
-        padding
-      } = typeof options === 'function' ? options(state) : options;
-      if (element && isRef(element)) {
-        if (element.current != null) {
-          return arrow$1({
-            element: element.current,
-            padding
-          }).fn(state);
-        }
-        return {};
-      }
-      if (element) {
-        return arrow$1({
-          element,
-          padding
-        }).fn(state);
-      }
-      return {};
-    }
-  };
-};
-
 var index$1 = typeof document !== 'undefined' ? useLayoutEffect : useEffect;
 
 // Fork of `fast-deep-equal` that only does the comparisons we need and compares
@@ -32637,8 +32607,6 @@ function deepEqual(a, b) {
     }
     return true;
   }
-
-  // biome-ignore lint/suspicious/noSelfCompare: in source
   return a !== a && b !== b;
 }
 
@@ -32759,8 +32727,6 @@ function useFloating$1(options) {
       isMountedRef.current = false;
     };
   }, []);
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: `hasWhileElementsMounted` is intentionally included.
   index$1(() => {
     if (referenceEl) referenceRef.current = referenceEl;
     if (floatingEl) floatingRef.current = floatingEl;
@@ -32816,8 +32782,94 @@ function useFloating$1(options) {
   }), [data, update, refs, elements, floatingStyles]);
 }
 
-// `toString()` prevents bundlers from trying to `import { useInsertionEffect } from 'react'`
-const useInsertionEffect = React[/*#__PURE__*/'useInsertionEffect'.toString()];
+/**
+ * Provides data to position an inner element of the floating element so that it
+ * appears centered to the reference element.
+ * This wraps the core `arrow` middleware to allow React refs as the element.
+ * @see https://floating-ui.com/docs/arrow
+ */
+const arrow$1 = options => {
+  function isRef(value) {
+    return {}.hasOwnProperty.call(value, 'current');
+  }
+  return {
+    name: 'arrow',
+    options,
+    fn(state) {
+      const {
+        element,
+        padding
+      } = typeof options === 'function' ? options(state) : options;
+      if (element && isRef(element)) {
+        if (element.current != null) {
+          return arrow$2({
+            element: element.current,
+            padding
+          }).fn(state);
+        }
+        return {};
+      }
+      if (element) {
+        return arrow$2({
+          element,
+          padding
+        }).fn(state);
+      }
+      return {};
+    }
+  };
+};
+
+/**
+ * Modifies the placement by translating the floating element along the
+ * specified axes.
+ * A number (shorthand for `mainAxis` or distance), or an axes configuration
+ * object may be passed.
+ * @see https://floating-ui.com/docs/offset
+ */
+const offset = (options, deps) => ({
+  ...offset$1(options),
+  options: [options, deps]
+});
+
+/**
+ * Optimizes the visibility of the floating element by shifting it in order to
+ * keep it in view when it will overflow the clipping boundary.
+ * @see https://floating-ui.com/docs/shift
+ */
+const shift = (options, deps) => ({
+  ...shift$1(options),
+  options: [options, deps]
+});
+
+/**
+ * Optimizes the visibility of the floating element by flipping the `placement`
+ * in order to keep it in view when the preferred placement(s) will overflow the
+ * clipping boundary. Alternative to `autoPlacement`.
+ * @see https://floating-ui.com/docs/flip
+ */
+const flip = (options, deps) => ({
+  ...flip$1(options),
+  options: [options, deps]
+});
+
+/**
+ * Provides data to position an inner element of the floating element so that it
+ * appears centered to the reference element.
+ * This wraps the core `arrow` middleware to allow React refs as the element.
+ * @see https://floating-ui.com/docs/arrow
+ */
+const arrow = (options, deps) => ({
+  ...arrow$1(options),
+  options: [options, deps]
+});
+
+// https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379
+const SafeReact = {
+  ...React
+};
+
+const useInsertionEffect = SafeReact.useInsertionEffect;
 const useSafeInsertionEffect = useInsertionEffect || (fn => fn());
 function useEffectEvent(callback) {
   const ref = React.useRef(() => {
@@ -32840,26 +32892,23 @@ var index = typeof document !== 'undefined' ? useLayoutEffect : useEffect;
 
 let serverHandoffComplete = false;
 let count = 0;
-const genId = () => "floating-ui-" + count++;
+const genId = () => // Ensure the id is unique with multiple independent versions of Floating UI
+// on <React 18
+"floating-ui-" + Math.random().toString(36).slice(2, 6) + count++;
 function useFloatingId() {
   const [id, setId] = React.useState(() => serverHandoffComplete ? genId() : undefined);
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentional
   index(() => {
     if (id == null) {
       setId(genId());
     }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
   React.useEffect(() => {
-    if (!serverHandoffComplete) {
-      serverHandoffComplete = true;
-    }
+    serverHandoffComplete = true;
   }, []);
   return id;
 }
-
-// `toString()` prevents bundlers from trying to `import { useId } from 'react'`
-const useReactId = React[/*#__PURE__*/'useId'.toString()];
+const useReactId = SafeReact.useId;
 
 /**
  * Uses React 18's built-in `useId()` when available, or falls back to a
@@ -32869,6 +32918,23 @@ const useReactId = React[/*#__PURE__*/'useId'.toString()];
  */
 const useId = useReactId || useFloatingId;
 
+let devMessageSet;
+if (process.env.NODE_ENV !== "production") {
+  devMessageSet = /*#__PURE__*/new Set();
+}
+function error() {
+  var _devMessageSet3;
+  for (var _len2 = arguments.length, messages = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+    messages[_key2] = arguments[_key2];
+  }
+  const message = "Floating UI: " + messages.join(' ');
+  if (!((_devMessageSet3 = devMessageSet) != null && _devMessageSet3.has(message))) {
+    var _devMessageSet4;
+    (_devMessageSet4 = devMessageSet) == null || _devMessageSet4.add(message);
+    console.error(message);
+  }
+}
+
 function createPubSub() {
   const map = new Map();
   return {
@@ -32942,8 +33008,7 @@ function useHover(context, props) {
     elements: {
       domReference,
       floating
-    },
-    refs
+    }
   } = context;
   const {
     enabled = true,
@@ -32958,9 +33023,9 @@ function useHover(context, props) {
   const handleCloseRef = useLatestRef(handleClose);
   const delayRef = useLatestRef(delay);
   const pointerTypeRef = React.useRef();
-  const timeoutRef = React.useRef();
+  const timeoutRef = React.useRef(-1);
   const handlerRef = React.useRef();
-  const restTimeoutRef = React.useRef();
+  const restTimeoutRef = React.useRef(-1);
   const blockMouseMoveRef = React.useRef(true);
   const performedPointerEventsMutationRef = React.useRef(false);
   const unbindMouseMoveRef = React.useRef(() => {});
@@ -33016,24 +33081,24 @@ function useHover(context, props) {
     const closeDelay = getDelay(delayRef.current, 'close', pointerTypeRef.current);
     if (closeDelay && !handlerRef.current) {
       clearTimeout(timeoutRef.current);
-      timeoutRef.current = setTimeout(() => onOpenChange(false, event, reason), closeDelay);
+      timeoutRef.current = window.setTimeout(() => onOpenChange(false, event, reason), closeDelay);
     } else if (runElseBranch) {
       clearTimeout(timeoutRef.current);
       onOpenChange(false, event, reason);
     }
   }, [delayRef, onOpenChange]);
-  const cleanupMouseMoveHandler = React.useCallback(() => {
+  const cleanupMouseMoveHandler = useEffectEvent(() => {
     unbindMouseMoveRef.current();
     handlerRef.current = undefined;
-  }, []);
-  const clearPointerEvents = React.useCallback(() => {
+  });
+  const clearPointerEvents = useEffectEvent(() => {
     if (performedPointerEventsMutationRef.current) {
-      const body = getDocument(refs.floating.current).body;
+      const body = getDocument(floating).body;
       body.style.pointerEvents = '';
       body.removeAttribute(safePolygonIdentifier);
       performedPointerEventsMutationRef.current = false;
     }
-  }, [refs]);
+  });
 
   // Registering the mouse events on the reference directly to bypass React's
   // delegation system. If the cursor was on a disabled element and then entered
@@ -33048,12 +33113,12 @@ function useHover(context, props) {
     function onMouseEnter(event) {
       clearTimeout(timeoutRef.current);
       blockMouseMoveRef.current = false;
-      if (mouseOnly && !isMouseLikePointerType(pointerTypeRef.current) || restMs > 0 && getDelay(delayRef.current, 'open') === 0) {
+      if (mouseOnly && !isMouseLikePointerType(pointerTypeRef.current) || restMs > 0 && !getDelay(delayRef.current, 'open')) {
         return;
       }
       const openDelay = getDelay(delayRef.current, 'open', pointerTypeRef.current);
       if (openDelay) {
-        timeoutRef.current = setTimeout(() => {
+        timeoutRef.current = window.setTimeout(() => {
           onOpenChange(true, event, 'hover');
         }, openDelay);
       } else {
@@ -33061,19 +33126,17 @@ function useHover(context, props) {
       }
     }
     function onMouseLeave(event) {
-      if (isClickLikeOpenEvent()) {
-        return;
-      }
+      if (isClickLikeOpenEvent()) return;
       unbindMouseMoveRef.current();
       const doc = getDocument(floating);
       clearTimeout(restTimeoutRef.current);
-      if (handleCloseRef.current) {
+      if (handleCloseRef.current && dataRef.current.floatingContext) {
         // Prevent clearing `onScrollMouseLeave` timeout.
         if (!open) {
           clearTimeout(timeoutRef.current);
         }
         handlerRef.current = handleCloseRef.current({
-          ...context,
+          ...dataRef.current.floatingContext,
           tree,
           x: event.clientX,
           y: event.clientY,
@@ -33104,11 +33167,10 @@ function useHover(context, props) {
     // did not move.
     // https://github.com/floating-ui/floating-ui/discussions/1692
     function onScrollMouseLeave(event) {
-      if (isClickLikeOpenEvent()) {
-        return;
-      }
+      if (isClickLikeOpenEvent()) return;
+      if (!dataRef.current.floatingContext) return;
       handleCloseRef.current == null || handleCloseRef.current({
-        ...context,
+        ...dataRef.current.floatingContext,
         tree,
         x: event.clientX,
         y: event.clientY,
@@ -33175,8 +33237,6 @@ function useHover(context, props) {
       clearPointerEvents();
     }
   }, [open, cleanupMouseMoveHandler, clearPointerEvents]);
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentional
   React.useEffect(() => {
     return () => {
       cleanupMouseMoveHandler();
@@ -33197,15 +33257,23 @@ function useHover(context, props) {
         onPointerDown: setPointerRef,
         onPointerEnter: setPointerRef,
         onMouseMove(event) {
+          function handleMouseMove() {
+            if (!blockMouseMoveRef.current) {
+              onOpenChange(true, event.nativeEvent, 'hover');
+            }
+          }
+          if (mouseOnly && !isMouseLikePointerType(pointerTypeRef.current)) {
+            return;
+          }
           if (open || restMs === 0) {
             return;
           }
           clearTimeout(restTimeoutRef.current);
-          restTimeoutRef.current = setTimeout(() => {
-            if (!blockMouseMoveRef.current) {
-              onOpenChange(true, event.nativeEvent, 'hover');
-            }
-          }, restMs);
+          if (pointerTypeRef.current === 'touch') {
+            handleMouseMove();
+          } else {
+            restTimeoutRef.current = window.setTimeout(handleMouseMove, restMs);
+          }
         }
       },
       floating: {
@@ -33217,7 +33285,7 @@ function useHover(context, props) {
         }
       }
     };
-  }, [enabled, restMs, open, onOpenChange, closeWithDelay]);
+  }, [enabled, mouseOnly, open, restMs, onOpenChange, closeWithDelay]);
 }
 
 function getChildren(nodes, id) {
@@ -33268,7 +33336,6 @@ function useDismiss(context, props) {
   const {
     open,
     onOpenChange,
-    nodeId,
     elements: {
       reference,
       domReference,
@@ -33301,9 +33368,11 @@ function useDismiss(context, props) {
     outsidePress: outsidePressCapture
   } = normalizeProp(capture);
   const closeOnEscapeKeyDown = useEffectEvent(event => {
+    var _dataRef$current$floa;
     if (!open || !enabled || !escapeKey || event.key !== 'Escape') {
       return;
     }
+    const nodeId = (_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.nodeId;
     const children = tree ? getChildren(tree.nodesRef.current, nodeId) : [];
     if (!escapeKeyBubbles) {
       event.stopPropagation();
@@ -33333,6 +33402,7 @@ function useDismiss(context, props) {
     (_getTarget2 = getTarget(event)) == null || _getTarget2.addEventListener('keydown', callback);
   });
   const closeOnPressOutside = useEffectEvent(event => {
+    var _dataRef$current$floa2;
     // Given developers can stop the propagation of the synthetic event,
     // we can only be confident with a positive value.
     const insideReactTree = insideReactTreeRef.current;
@@ -33398,6 +33468,7 @@ function useDismiss(context, props) {
         return;
       }
     }
+    const nodeId = (_dataRef$current$floa2 = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa2.nodeId;
     const targetIsInsideChildren = tree && getChildren(tree.nodesRef.current, nodeId).some(node => {
       var _node$context;
       return isEventTargetWithin(event, (_node$context = node.context) == null ? void 0 : _node$context.elements.floating);
@@ -33473,8 +33544,6 @@ function useDismiss(context, props) {
       });
     };
   }, [dataRef, floating, domReference, reference, escapeKey, outsidePress, outsidePressEvent, open, onOpenChange, ancestorScroll, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, escapeKeyCapture, closeOnEscapeKeyDownCapture, closeOnPressOutside, outsidePressCapture, closeOnPressOutsideCapture]);
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentional
   React.useEffect(() => {
     insideReactTreeRef.current = false;
   }, [outsidePress, outsidePressEvent]);
@@ -33507,9 +33576,50 @@ function useDismiss(context, props) {
   }, [enabled, referencePress, outsidePressEvent, referencePressEvent, onOpenChange, closeOnEscapeKeyDown]);
 }
 
-let devMessageSet;
-if (process.env.NODE_ENV !== "production") {
-  devMessageSet = /*#__PURE__*/new Set();
+function useFloatingRootContext(options) {
+  const {
+    open = false,
+    onOpenChange: onOpenChangeProp,
+    elements: elementsProp
+  } = options;
+  const floatingId = useId();
+  const dataRef = React.useRef({});
+  const [events] = React.useState(() => createPubSub());
+  const nested = useFloatingParentNodeId() != null;
+  if (process.env.NODE_ENV !== "production") {
+    const optionDomReference = elementsProp.reference;
+    if (optionDomReference && !isElement(optionDomReference)) {
+      error('Cannot pass a virtual element to the `elements.reference` option,', 'as it must be a real DOM element. Use `refs.setPositionReference()`', 'instead.');
+    }
+  }
+  const [positionReference, setPositionReference] = React.useState(elementsProp.reference);
+  const onOpenChange = useEffectEvent((open, event, reason) => {
+    dataRef.current.openEvent = open ? event : undefined;
+    events.emit('openchange', {
+      open,
+      event,
+      reason,
+      nested
+    });
+    onOpenChangeProp == null || onOpenChangeProp(open, event, reason);
+  });
+  const refs = React.useMemo(() => ({
+    setPositionReference
+  }), []);
+  const elements = React.useMemo(() => ({
+    reference: positionReference || elementsProp.reference || null,
+    floating: elementsProp.floating || null,
+    domReference: elementsProp.reference
+  }), [positionReference, elementsProp.reference, elementsProp.floating]);
+  return React.useMemo(() => ({
+    dataRef,
+    open,
+    onOpenChange,
+    elements,
+    events,
+    floatingId,
+    refs
+  }), [open, onOpenChange, elements, events, floatingId, refs]);
 }
 
 /**
@@ -33517,54 +33627,51 @@ if (process.env.NODE_ENV !== "production") {
  * @see https://floating-ui.com/docs/useFloating
  */
 function useFloating(options) {
-  var _options$elements2;
   if (options === void 0) {
     options = {};
   }
   const {
-    open = false,
-    onOpenChange: unstable_onOpenChange,
     nodeId
   } = options;
-  if (process.env.NODE_ENV !== "production") {
-    var _options$elements;
-    const err = 'Floating UI: Cannot pass a virtual element to the ' + '`elements.reference` option, as it must be a real DOM element. ' + 'Use `refs.setPositionReference` instead.';
-    if ((_options$elements = options.elements) != null && _options$elements.reference && !isElement(options.elements.reference)) {
-      var _devMessageSet;
-      if (!((_devMessageSet = devMessageSet) != null && _devMessageSet.has(err))) {
-        var _devMessageSet2;
-        (_devMessageSet2 = devMessageSet) == null || _devMessageSet2.add(err);
-        console.error(err);
-      }
+  const internalRootContext = useFloatingRootContext({
+    ...options,
+    elements: {
+      reference: null,
+      floating: null,
+      ...options.elements
     }
-  }
+  });
+  const rootContext = options.rootContext || internalRootContext;
+  const computedElements = rootContext.elements;
   const [_domReference, setDomReference] = React.useState(null);
-  const domReference = ((_options$elements2 = options.elements) == null ? void 0 : _options$elements2.reference) || _domReference;
-  const position = useFloating$1(options);
+  const [positionReference, _setPositionReference] = React.useState(null);
+  const optionDomReference = computedElements == null ? void 0 : computedElements.reference;
+  const domReference = optionDomReference || _domReference;
+  const domReferenceRef = React.useRef(null);
   const tree = useFloatingTree();
-  const nested = useFloatingParentNodeId() != null;
-  const onOpenChange = useEffectEvent((open, event, reason) => {
-    if (open) {
-      dataRef.current.openEvent = event;
+  index(() => {
+    if (domReference) {
+      domReferenceRef.current = domReference;
+    }
+  }, [domReference]);
+  const position = useFloating$1({
+    ...options,
+    elements: {
+      ...computedElements,
+      ...(positionReference && {
+        reference: positionReference
+      })
     }
-    events.emit('openchange', {
-      open,
-      event,
-      reason,
-      nested
-    });
-    unstable_onOpenChange == null || unstable_onOpenChange(open, event, reason);
   });
-  const domReferenceRef = React.useRef(null);
-  const dataRef = React.useRef({});
-  const events = React.useState(() => createPubSub())[0];
-  const floatingId = useId();
   const setPositionReference = React.useCallback(node => {
-    const positionReference = isElement(node) ? {
+    const computedPositionReference = isElement(node) ? {
       getBoundingClientRect: () => node.getBoundingClientRect(),
       contextElement: node
     } : node;
-    position.refs.setReference(positionReference);
+    // Store the positionReference in state if the DOM reference is specified externally via the
+    // `elements.reference` option. This ensures that it won't be overridden on future renders.
+    _setPositionReference(computedPositionReference);
+    position.refs.setReference(computedPositionReference);
   }, [position.refs]);
   const setReference = React.useCallback(node => {
     if (isElement(node) || node === null) {
@@ -33594,16 +33701,13 @@ function useFloating(options) {
   }), [position.elements, domReference]);
   const context = React.useMemo(() => ({
     ...position,
+    ...rootContext,
     refs,
     elements,
-    dataRef,
-    nodeId,
-    floatingId,
-    events,
-    open,
-    onOpenChange
-  }), [position, nodeId, floatingId, events, open, onOpenChange, refs, elements]);
+    nodeId
+  }), [position, refs, elements, nodeId, rootContext]);
   index(() => {
+    rootContext.dataRef.current.floatingContext = context;
     const node = tree == null ? void 0 : tree.nodesRef.current.find(node => node.id === nodeId);
     if (node) {
       node.context = context;
@@ -33630,7 +33734,7 @@ function useFocus(context, props) {
     open,
     onOpenChange,
     events,
-    refs,
+    dataRef,
     elements: {
       domReference
     }
@@ -33730,6 +33834,7 @@ function useFocus(context, props) {
 
           // Wait for the window blur listener to fire.
           timeoutRef.current = window.setTimeout(() => {
+            var _dataRef$current$floa;
             const activeEl = activeElement(domReference ? domReference.ownerDocument : document);
 
             // Focus left the page, keep it open.
@@ -33742,7 +33847,7 @@ function useFocus(context, props) {
             // as it will only point to the shadow host of the newly focused element
             // and not the element that actually has received focus if it is located
             // inside a shadow root.
-            if (contains(refs.floating.current, activeEl) || contains(domReference, activeEl) || movedToFocusGuard) {
+            if (contains((_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.refs.floating.current, activeEl) || contains(domReference, activeEl) || movedToFocusGuard) {
               return;
             }
             onOpenChange(false, event.nativeEvent, 'focus');
@@ -33750,7 +33855,7 @@ function useFocus(context, props) {
         }
       }
     };
-  }, [enabled, visibleOnly, domReference, refs, onOpenChange]);
+  }, [enabled, visibleOnly, dataRef, domReference, onOpenChange]);
 }
 
 const ACTIVE_KEY = 'active';
@@ -33810,7 +33915,6 @@ function mergeProps(userProps, propsList, elementKey) {
     }, {})
   };
 }
-
 /**
  * Merges an array of interaction hooks' props into prop getters, allowing
  * event handler functions to be composed together without overwriting one
@@ -33824,19 +33928,18 @@ function useInteractions(propsList) {
   // The dependencies are a dynamic array, so we can't use the linter's
   // suggestion to add it to the deps array.
   const deps = propsList;
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentional
-  const getReferenceProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'reference'), deps);
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentional
-  const getFloatingProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'floating'), deps);
-
-  // biome-ignore lint/correctness/useExhaustiveDependencies: intentional
+  const getReferenceProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'reference'),
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  deps);
+  const getFloatingProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'floating'),
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  deps);
   const getItemProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'item'),
   // Granularly check for `item` changes, because the `getItemProps` getter
   // should be as referentially stable as possible since it may be passed as
   // a prop to many components. All `item` key values must therefore be
   // memoized.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
   propsList.map(key => key == null ? void 0 : key.item));
   return React.useMemo(() => ({
     getReferenceProps,