@floating-ui/react-dom-interactions - npm Package Compare versions

Comparing version 0.0.1 to 0.0.2

dist/floating-ui.react-dom-interactions.esm.js

@@ -1,2 +0,2 @@
-import { useLayoutEffect, useEffect, useState, useRef, useContext, useCallback, createContext, useMemo } from 'react';
+import React$1, { useLayoutEffect, useEffect, useMemo, useContext, useRef, useCallback, createContext, useState, forwardRef } from 'react';
 import { getOverflowAncestors, useFloating as useFloating$1 } from '@floating-ui/react-dom';
@@ -8,2 +8,106 @@ export * from '@floating-ui/react-dom';
 
+function createPubSub() {
+  const map = new Map();
+  return {
+    emit(event, data) {
+      var _map$get;
+
+      (_map$get = map.get(event)) == null ? void 0 : _map$get.forEach(handler => handler(data));
+    },
+
+    on(event, listener) {
+      map.set(event, [...(map.get(event) || []), listener]);
+    },
+
+    off(event, listener) {
+      map.set(event, (map.get(event) || []).filter(l => l !== listener));
+    }
+
+  };
+}
+
+let globalId = 0;
+
+function genId() {
+  return "floating-ui-" + globalId++;
+}
+
+function useFloatingId() {
+  return useMemo(genId, []);
+}
+
+const FloatingNodeContext = /*#__PURE__*/createContext(null);
+const FloatingTreeContext = /*#__PURE__*/createContext(null);
+const useFloatingParentNodeId = () => {
+  var _useContext$id, _useContext;
+
+  return (_useContext$id = (_useContext = useContext(FloatingNodeContext)) == null ? void 0 : _useContext.id) != null ? _useContext$id : null;
+};
+const useFloatingTree = () => useContext(FloatingTreeContext);
+/**
+ * Registers a node into the floating tree, returning its id.
+ */
+
+const useFloatingNodeId = () => {
+  const id = useFloatingId();
+  const tree = useFloatingTree();
+  const parentId = useFloatingParentNodeId();
+  index(() => {
+    const node = {
+      id,
+      parentId
+    };
+    tree == null ? void 0 : tree.addNode(node);
+    return () => {
+      tree == null ? void 0 : tree.removeNode(node);
+    };
+  }, [tree, id, parentId]);
+  return id;
+};
+/**
+ * Provides parent node context for nested floating elements.
+ * @see https://floating-ui.com/docs/FloatingTree
+ */
+
+const FloatingNode = _ref => {
+  let {
+    children,
+    id
+  } = _ref;
+  const parentId = useFloatingParentNodeId();
+  return /*#__PURE__*/React.createElement(FloatingNodeContext.Provider, {
+    value: {
+      id,
+      parentId
+    }
+  }, children);
+};
+/**
+ * Provides context for nested floating elements when they are not children of
+ * each other on the DOM (i.e. portalled to a common node, rather than their
+ * respective parent).
+ * @see https://floating-ui.com/docs/FloatingTree
+ */
+
+const FloatingTree = _ref2 => {
+  let {
+    children
+  } = _ref2;
+  const nodesRef = useRef([]);
+  const addNode = useCallback(node => {
+    nodesRef.current = [...nodesRef.current, node];
+  }, []);
+  const removeNode = useCallback(node => {
+    nodesRef.current = nodesRef.current.filter(n => n !== node);
+  }, []);
+  return /*#__PURE__*/React.createElement(FloatingTreeContext.Provider, {
+    value: {
+      nodesRef,
+      addNode,
+      removeNode,
+      events: createPubSub()
+    }
+  }, children);
+};
+
 function reducePropsToArrayWithInitValue(userProps) {
@@ -75,24 +179,2 @@ return Object.entries(userProps != null ? userProps : {}).reduce((acc, _ref) => {
 
-function createTree(nodes) {
-  const map = new Map();
-  return {
-    nodes,
-
-    emit(event, data) {
-      var _map$get;
-
-      (_map$get = map.get(event)) == null ? void 0 : _map$get.forEach(handler => handler(data));
-    },
-
-    on(event, listener) {
-      map.set(event, [...(map.get(event) || []), listener]);
-    },
-
-    off(event, listener) {
-      map.set(event, (map.get(event) || []).filter(l => l !== listener));
-    }
-
-  };
-}
-
 var pointInPolygon$1 = {exports: {}};
@@ -169,2 +251,30 @@
 
+function getChildren(tree, id) {
+  var _tree$nodesRef$curren;
+
+  let allChildren = (_tree$nodesRef$curren = tree == null ? void 0 : tree.nodesRef.current.filter(node => {
+    var _node$context;
+
+    return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open);
+  })) != null ? _tree$nodesRef$curren : [];
+  let currentChildren = allChildren;
+
+  while (currentChildren.length) {
+    var _tree$nodesRef$curren2;
+
+    currentChildren = (_tree$nodesRef$curren2 = tree == null ? void 0 : tree.nodesRef.current.filter(node => {
+      var _currentChildren;
+
+      return (_currentChildren = currentChildren) == null ? void 0 : _currentChildren.some(n => {
+        var _node$context2;
+
+        return node.parentId === n.id && ((_node$context2 = node.context) == null ? void 0 : _node$context2.open);
+      });
+    })) != null ? _tree$nodesRef$curren2 : [];
+    allChildren = allChildren.concat(currentChildren);
+  }
+
+  return allChildren;
+}
+
 function safePolygon(_temp) {
@@ -183,4 +293,4 @@ let {
       onClose,
-      treeRef,
-      nodeRef
+      nodeId,
+      tree
     } = _ref;
@@ -206,12 +316,7 @@ return function onPointerMove(event) {
 
-      if (treeRef != null && treeRef.current.nodes.filter(_ref2 => {
+      if (tree && getChildren(tree, nodeId).some(_ref2 => {
         let {
-          current
+          context
         } = _ref2;
-        return current.parentId === (nodeRef == null ? void 0 : nodeRef.current.id);
-      }).some(_ref3 => {
-        let {
-          current
-        } = _ref3;
-        return current.open;
+        return context == null ? void 0 : context.open;
       })) {
@@ -262,4 +367,6 @@ return;
 
-      function getPolygon(_ref4) {
-        let [x, y] = _ref4;
+      function getPolygon(_ref3) {
+        let [x, y] = _ref3;
+        const isFloatingWider = rect.width > refRect.width;
+        const isFloatingTaller = rect.height > refRect.height;
 
@@ -269,11 +376,11 @@ switch (side) {
             {
-              const cursorPointOne = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y + BUFFER];
-              const cursorPointTwo = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y - BUFFER];
-              const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.bottom : rect.width > refRect.width ? rect.bottom : rect.top], [rect.right, cursorLeaveFromRight ? rect.width > refRect.width ? rect.bottom : rect.top : rect.bottom]];
+              const cursorPointOne = [isFloatingWider ? x : cursorLeaveFromRight ? x + BUFFER : x - BUFFER, y + BUFFER];
+              const cursorPointTwo = [isFloatingWider ? x : cursorLeaveFromRight ? x - BUFFER : x + BUFFER, y + BUFFER];
+              const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.bottom - BUFFER : isFloatingWider ? rect.bottom - BUFFER : rect.top], [rect.right, cursorLeaveFromRight ? isFloatingWider ? rect.bottom - BUFFER : rect.top : rect.bottom - BUFFER]];
 
-              if (rect.width < refRect.width) {
-                return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+              if (cursorLeaveFromRight) {
+                return [cursorPointOne, cursorPointTwo, ...commonPoints];
               }
 
-              return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+              return [cursorPointOne, ...commonPoints, cursorPointTwo];
             }
@@ -283,11 +390,11 @@
             {
-              const cursorPointOne = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y - BUFFER];
-              const cursorPointTwo = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y + BUFFER];
-              const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.top : rect.width > refRect.width ? rect.top : rect.bottom], [rect.right, cursorLeaveFromRight ? rect.width > refRect.width ? rect.top : rect.bottom : rect.top]];
+              const cursorPointOne = [isFloatingWider ? x : cursorLeaveFromRight ? x + BUFFER : x - BUFFER, y - BUFFER];
+              const cursorPointTwo = [isFloatingWider ? x : cursorLeaveFromRight ? x - BUFFER : x + BUFFER, y - BUFFER];
+              const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.top + BUFFER : isFloatingWider ? rect.top + BUFFER : rect.bottom], [rect.right, cursorLeaveFromRight ? isFloatingWider ? rect.top + BUFFER : rect.bottom : rect.top + BUFFER]];
 
-              if (rect.width < refRect.width) {
-                return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+              if (cursorLeaveFromRight) {
+                return [cursorPointOne, cursorPointTwo, ...commonPoints];
               }
 
-              return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+              return [cursorPointOne, ...commonPoints, cursorPointTwo];
             }
@@ -297,11 +404,11 @@
             {
-              const cursorPointOne = [x + BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-              const cursorPointTwo = [x - BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-              const commonPoints = [[cursorLeaveFromBottom ? rect.right - BUFFER : rect.height > refRect.height ? rect.right - BUFFER : rect.left, rect.top], [cursorLeaveFromBottom ? rect.height > refRect.height ? rect.right - BUFFER : rect.left : rect.right - BUFFER, rect.bottom]];
+              const cursorPointOne = [x + BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y - BUFFER : y + BUFFER];
+              const cursorPointTwo = [x + BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y + BUFFER : y - BUFFER];
+              const commonPoints = [[cursorLeaveFromBottom ? rect.right - BUFFER : isFloatingTaller ? rect.right - BUFFER : rect.left, rect.top], [cursorLeaveFromBottom ? isFloatingTaller ? rect.right - BUFFER : rect.left : rect.right - BUFFER, rect.bottom]];
 
-              if (rect.height < refRect.height) {
-                return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+              if (cursorLeaveFromBottom) {
+                return [cursorPointOne, ...commonPoints, cursorPointTwo];
               }
 
-              return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+              return [...commonPoints, cursorPointOne, cursorPointTwo];
             }
@@ -311,11 +418,11 @@
             {
-              const cursorPointOne = [x - BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-              const cursorPointTwo = [x + BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-              const commonPoints = [[cursorLeaveFromBottom ? rect.left + BUFFER : rect.height > refRect.height ? rect.left + BUFFER : rect.right, rect.top], [cursorLeaveFromBottom ? rect.height > refRect.height ? rect.left + BUFFER : rect.right : rect.left + BUFFER, rect.bottom]];
+              const cursorPointOne = [x - BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y + BUFFER : y - BUFFER];
+              const cursorPointTwo = [x - BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y - BUFFER : y + BUFFER];
+              const commonPoints = [[cursorLeaveFromBottom ? rect.left + BUFFER : isFloatingTaller ? rect.left + BUFFER : rect.right, rect.top], [cursorLeaveFromBottom ? isFloatingTaller ? rect.left + BUFFER : rect.right : rect.left + BUFFER, rect.bottom]];
 
-              if (rect.height < refRect.height) {
-                return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+              if (cursorLeaveFromBottom) {
+                return [cursorPointOne, cursorPointTwo, ...commonPoints];
               }
 
-              return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+              return [cursorPointOne, ...commonPoints, cursorPointTwo];
             }
@@ -327,3 +434,3 @@ }
 
-      if (process.env.NODE_ENV !== "production") {
+      if (process.env.NODE_ENV !== 'production') {
         debug == null ? void 0 : debug(getPolygon([x, y]).slice(0, 4).join(', '));
@@ -342,5 +449,14 @@ }
 
-function FloatingPortal(_ref) {
+const DEFAULT_ID = 'floating-ui-root';
+const FloatingPortalContext = /*#__PURE__*/createContext(DEFAULT_ID);
+const useFloatingPortalId = () => useContext(FloatingPortalContext);
+/**
+ * Portals your floating element outside of the main app node.
+ * @see https://floating-ui.com/docs/FloatingPortal
+ */
+
+const FloatingPortal = _ref => {
   let {
-    children
+    children,
+    id = DEFAULT_ID
   } = _ref;
@@ -350,3 +466,3 @@ const [mounted, setMounted] = useState(false);
   index(() => {
-    const root = document.getElementById('floating-ui-root');
+    const root = document.getElementById(id);
 
@@ -357,3 +473,3 @@ if (root) {
       portalRef.current = document.createElement('div');
-      portalRef.current.id = 'floating-ui-root';
+      portalRef.current.id = id;
     }
@@ -368,16 +484,55 @@
     setMounted(true);
-    return () => {
-      if (document.body.contains(el)) {
-        document.body.removeChild(el);
-      }
-    };
   }, []);
 
   if (mounted && portalRef.current) {
-    return /*#__PURE__*/createPortal(children, portalRef.current);
+    return /*#__PURE__*/React$1.createElement(FloatingPortalContext.Provider, {
+      value: id
+    }, /*#__PURE__*/createPortal(children, portalRef.current));
   }
 
   return null;
+};
+
+function _extends() {
+  _extends = Object.assign || function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+
+    return target;
+  };
+
+  return _extends.apply(this, arguments);
 }
 
+/**
+ * Provides base styling for a fixed overlay element to dim content or block
+ * pointer events behind a floating element.
+ * It's a regular `<div>`, so it can be styled via any CSS solution you prefer.
+ * @see https://floating-ui.com/docs/FloatingOverlay
+ */
+
+const FloatingOverlay = /*#__PURE__*/forwardRef(function FloatingOverlay(props, ref) {
+  return /*#__PURE__*/React.createElement("div", _extends({
+    ref: ref
+  }, props, {
+    style: {
+      position: 'fixed',
+      top: 0,
+      right: 0,
+      bottom: 0,
+      left: 0,
+      width: '100%',
+      height: '100%',
+      ...props.style
+    }
+  }));
+});
+
 function getDelay(value, prop) {
@@ -388,6 +543,12 @@ if (typeof value === 'number') {
 
-  return value[prop];
+  return value == null ? void 0 : value[prop];
 }
+
+/**
+ * Adds hover event listeners that change the open state, like CSS :hover.
+ * @see https://floating-ui.com/docs/useHover
+ */
 const useHover = function (context, _temp) {
   let {
+    enabled = true,
     delay = 0,
@@ -399,39 +560,48 @@ handleLeave = null,
   const {
-    onOpenChange = () => {},
     open,
+    onOpenChange,
     dataRef,
+    events,
     refs
   } = context;
-  const enterEventRef = useRef(null);
-  const hoveredThenClickedRef = useRef(false);
+  const tree = useFloatingTree();
   const timeoutRef = useRef();
   const handlerRef = useRef();
+  const pointerRestTimeoutRef = useRef();
+  const blockPointerMoveRef = useRef(true);
   index(() => {
-    if (!handleLeave) {
-      return;
+    if (!open) {
+      dataRef.current.hoveredThenClicked = false;
     }
+  }, [open]);
+  useEffect(() => {
+    function onDismiss() {
+      clearTimeout(timeoutRef.current);
+      clearTimeout(pointerRestTimeoutRef.current);
+      blockPointerMoveRef.current = true;
+    }
 
-    if (!open) {
-      hoveredThenClickedRef.current = false;
-      return;
-    } // If the cursor is moving quickly off the page, the `pointermove` event
-    // to check if the cursor is outside of the "safe triangle" area will not
-    // fire, resulting in the floating element remaining open.
+    events.on('dismiss', onDismiss);
+    return () => {
+      events.off('dismiss', onDismiss);
+    };
+  }, [events]);
 
+  function closeWithDelay(runElseBranch) {
+    if (runElseBranch === void 0) {
+      runElseBranch = true;
+    }
 
-    function onHTMLPointerLeave() {
-      var _enterEventRef$curren;
-
-      if (((_enterEventRef$curren = enterEventRef.current) == null ? void 0 : _enterEventRef$curren.type) === 'pointerover') {
-        onOpenChange(false);
-      }
+    if (delay) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = setTimeout(() => onOpenChange(false), getDelay(delay, 'close'));
+    } else if (runElseBranch) {
+      onOpenChange(false);
     }
+  }
 
-    const html = getDocument(refs.floating.current).documentElement;
-    html.addEventListener('pointerleave', onHTMLPointerLeave);
-    return () => {
-      html.removeEventListener('pointerleave', onHTMLPointerLeave);
-    };
-  }, [open, onOpenChange, handleLeave]);
-  const pointerRestTimeoutRef = useRef();
+  if (!enabled) {
+    return {};
+  }
+
   return {
@@ -446,3 +616,3 @@ reference: {
         pointerRestTimeoutRef.current = setTimeout(() => {
-          if (!dataRef.current.dismiss) {
+          if (!blockPointerMoveRef.current) {
             onOpenChange(true);
@@ -458,3 +628,4 @@ }
 
-        enterEventRef.current = event.nativeEvent;
+        blockPointerMoveRef.current = false;
+        dataRef.current.openEvent = event.nativeEvent;
 
@@ -464,5 +635,3 @@ if (delay) {
           timeoutRef.current = setTimeout(() => {
-            if (!dataRef.current.dismiss) {
-              onOpenChange(true);
-            }
+            onOpenChange(true);
           }, getDelay(delay, 'open'));
@@ -475,5 +644,5 @@ } else {
       onPointerLeave(event) {
-        var _enterEventRef$curren2;
+        var _dataRef$current$open;
 
-        if (hoveredThenClickedRef.current || ((_enterEventRef$curren2 = enterEventRef.current) == null ? void 0 : _enterEventRef$curren2.type) === 'click') {
+        if (dataRef.current.hoveredThenClicked || ((_dataRef$current$open = dataRef.current.openEvent) == null ? void 0 : _dataRef$current$open.type) === 'click') {
           return;
@@ -483,2 +652,3 @@ }
         const doc = getDocument(refs.floating.current);
+        clearTimeout(pointerRestTimeoutRef.current);
 
@@ -489,2 +659,3 @@ if (handleLeave) {
           handlerRef.current = handleLeave({ ...context,
+            tree,
             x: event.clientX,
@@ -495,6 +666,7 @@ y: event.clientY,
               handlerRef.current && doc.removeEventListener('pointermove', handlerRef.current);
-              onOpenChange(false);
+              closeWithDelay();
             }
 
           });
+          handlerRef.current(event.nativeEvent);
           doc.addEventListener('pointermove', handlerRef.current);
@@ -504,14 +676,12 @@ return;
 
-        dataRef.current.dismiss = false;
-
-        if (delay) {
-          clearTimeout(pointerRestTimeoutRef.current);
-          clearTimeout(timeoutRef.current);
-          timeoutRef.current = setTimeout(() => onOpenChange(false), getDelay(delay, 'close'));
-        } else {
-          hoveredThenClickedRef.current = false;
-          onOpenChange(false);
-        }
+        closeWithDelay();
       }
 
+    },
+    floating: {
+      onPointerEnter() {
+        clearTimeout(timeoutRef.current);
+      },
+
+      onPointerLeave: () => closeWithDelay(false)
     }
@@ -521,3 +691,3 @@ };
 
-const FloatingGroupContext = /*#__PURE__*/createContext({
+const FloatingDelayGroupContext = /*#__PURE__*/createContext({
   delay: 1000,
@@ -529,12 +699,10 @@ initialDelay: 1000,
 });
-const useGroupContext = () => {
-  const context = useContext(FloatingGroupContext);
+const useDelayGroupContext = () => useContext(FloatingDelayGroupContext);
+/**
+ * Provides context for a group of floating elements that should share a
+ * `delay`.
+ * @see https://floating-ui.com/docs/FloatingDelayGroup
+ */
 
-  if (!context) {
-    throw new Error('useGroupContext() must be used within a <FloatingGroup />');
-  }
-
-  return context;
-};
-const FloatingGroup = _ref => {
+const FloatingDelayGroup = _ref => {
   let {
@@ -554,3 +722,3 @@ children,
   }, []);
-  return /*#__PURE__*/React.createElement(FloatingGroupContext.Provider, {
+  return /*#__PURE__*/React.createElement(FloatingDelayGroupContext.Provider, {
     value: { ...state,
@@ -562,3 +730,3 @@ setState,
 };
-const useGroup = (_ref2, _ref3) => {
+const useDelayGroup = (_ref2, _ref3) => {
   let {
@@ -575,3 +743,3 @@ open,
     setState
-  } = useGroupContext();
+  } = useDelayGroupContext();
   useEffect(() => {
@@ -602,12 +770,5 @@ if (currentId && onOpenChange) {
 
-let globalId = 0;
-
-function genId() {
-  return "floating-ui-" + globalId++;
-}
-
-function useFloatingId() {
-  return useMemo(genId, []);
-}
-
+/**
+ * Adds relevant screen reader props for a given element `role`.
+ */
 const useAria = function (_ref, _temp) {
@@ -618,2 +779,3 @@ let {
   let {
+    enabled = true,
     role = 'dialog',
@@ -629,2 +791,6 @@ titleId,
 
+  if (!enabled) {
+    return {};
+  }
+
   if (role === 'tooltip') {
@@ -657,8 +823,20 @@ return {
 
-const useClick = _ref => {
+/**
+ * Adds click event listeners that change the open state (toggle behavior).
+ * @see https://floating-ui.com/docs/useClick
+ */
+const useClick = function (_ref, _temp) {
   let {
     open,
-    onOpenChange = () => {},
+    onOpenChange,
     dataRef
   } = _ref;
+  let {
+    enabled = true
+  } = _temp === void 0 ? {} : _temp;
+
+  if (!enabled) {
+    return {};
+  }
+
   return {
@@ -687,12 +865,16 @@ reference: {
 
+/**
+ * Adds listeners that dismiss (close) the floating element.
+ * @see https://floating-ui.com/docs/useDismiss
+ */
 const useDismiss = function (_ref, _temp) {
   let {
-    onOpenChange = () => {},
+    open,
+    onOpenChange,
     refs,
-    open,
-    treeRef,
-    nodeRef,
-    dataRef
+    events,
+    nodeId
   } = _ref;
   let {
+    enabled = true,
     escapeKey = true,
@@ -703,2 +885,3 @@ outsidePointerDown = true,
   } = _temp === void 0 ? {} : _temp;
+  const tree = useFloatingTree();
   const focusReference = useCallback(() => {
@@ -711,42 +894,11 @@ if (isHTMLElement(refs.reference.current)) {
   useEffect(() => {
-    function onClose() {
-      onOpenChange(false);
-      focusReference();
-    }
-
-    const tree = treeRef == null ? void 0 : treeRef.current;
-    tree == null ? void 0 : tree.on('close', onClose);
-    return () => {
-      tree == null ? void 0 : tree.off('close', onClose);
-    };
-  }, [treeRef, onOpenChange, focusReference]);
-  useEffect(() => {
-    if (!open) {
+    if (!open || !enabled) {
       return;
     }
 
-    function isAnyChildNodeOpen() {
-      return treeRef == null ? void 0 : treeRef.current.nodes.filter(_ref2 => {
-        let {
-          current
-        } = _ref2;
-        return current.parentId === (nodeRef == null ? void 0 : nodeRef.current.id);
-      }).some(_ref3 => {
-        let {
-          current
-        } = _ref3;
-        return current.open;
-      });
-    }
-
     function onKeyDown(event) {
-      if (event.key === 'Escape' && !isAnyChildNodeOpen()) {
-        dataRef.current.dismiss = true;
-
-        if (treeRef) {
-          treeRef.current.emit('close');
-        } else {
-          onOpenChange(false);
-          focusReference();
-        }
+      if (event.key === 'Escape') {
+        events.emit('dismiss');
+        onOpenChange(false);
+        focusReference();
       }
@@ -758,12 +910,15 @@ }
 
-      if ((_refs$floating$curren = refs.floating.current) != null && _refs$floating$curren.contains(event.target) || isElement(refs.reference.current) && refs.reference.current.contains(event.target) || isAnyChildNodeOpen()) {
+      const targetIsInsideChildren = tree && getChildren(tree, nodeId).some(node => {
+        var _node$context, _node$context$refs$fl;
+
+        return (_node$context = node.context) == null ? void 0 : (_node$context$refs$fl = _node$context.refs.floating.current) == null ? void 0 : _node$context$refs$fl.contains(event.target);
+      });
+
+      if ((_refs$floating$curren = refs.floating.current) != null && _refs$floating$curren.contains(event.target) || isElement(refs.reference.current) && refs.reference.current.contains(event.target) || targetIsInsideChildren) {
         return;
       }
 
-      if (treeRef) {
-        treeRef.current.emit('close');
-      } else {
-        onOpenChange(false);
-        focusReference();
-      }
+      events.emit('dismiss');
+      onOpenChange(false);
+      focusReference();
     }
@@ -787,3 +942,8 @@
     };
-  }, [escapeKey, outsidePointerDown, treeRef, nodeRef, open, onOpenChange, dataRef, focusReference, ancestorScroll, refs.floating, refs.reference]);
+  }, [escapeKey, outsidePointerDown, events, tree, nodeId, open, onOpenChange, focusReference, ancestorScroll, enabled, refs.floating, refs.reference]);
+
+  if (!enabled) {
+    return {};
+  }
+
   return {
@@ -793,3 +953,3 @@ reference: {
         if (referencePointerDown) {
-          dataRef.current.dismiss = true;
+          events.emit('dismiss');
           onOpenChange(false);
@@ -803,18 +963,65 @@ }
 
+/**
+ * Adds hover event listeners that change the open state, like CSS :focus.
+ * @see https://floating-ui.com/docs/useFocus
+ */
 const useFocus = function (_ref, _temp) {
   let {
     open,
-    onOpenChange = () => {},
+    onOpenChange,
     dataRef,
-    refs
+    refs,
+    events
   } = _ref;
   let {
+    enabled = true,
     keyboardOnly = true
   } = _temp === void 0 ? {} : _temp;
-  const pointerTypeRef = useRef();
-  index(() => {
-    if (!open) {
-      pointerTypeRef.current = undefined;
+  const blockFocusRef = useRef(false);
+  useEffect(() => {
+    var _doc$defaultView;
+
+    if (!enabled) {
+      return;
     }
-  });
+
+    const doc = getDocument(refs.floating.current);
+    const win = (_doc$defaultView = doc.defaultView) != null ? _doc$defaultView : window;
+
+    function onBlur() {
+      blockFocusRef.current = !open;
+    }
+
+    function onFocus() {
+      setTimeout(() => {
+        blockFocusRef.current = false;
+      });
+    }
+
+    win.addEventListener('focus', onFocus);
+    win.addEventListener('blur', onBlur);
+    return () => {
+      win.addEventListener('focus', onFocus);
+      win.removeEventListener('blur', onBlur);
+    };
+  }, [refs.floating, open, enabled]);
+  useEffect(() => {
+    if (!enabled) {
+      return;
+    }
+
+    function onDismiss() {
+      blockFocusRef.current = true;
+    }
+
+    events.on('dismiss', onDismiss);
+    return () => {
+      events.off('dismiss', onDismiss);
+    };
+  }, [events, enabled]);
+
+  if (!enabled) {
+    return {};
+  }
+
   return {
@@ -826,4 +1033,3 @@ reference: {
         } = _ref2;
-        // undefined or "" depending on the browser
-        pointerTypeRef.current = pointerType;
+        blockFocusRef.current = !!(pointerType && keyboardOnly);
       },
@@ -834,3 +1040,6 @@
 
-        if (keyboardOnly && pointerTypeRef.current) {
+        // Note: due to the `window` focus/blur listeners, switching between
+        // DevTools touch/normal mode may cause this to fail on the first
+        // focus of the window/touch of the element as it gets set to `false`.
+        if (blockFocusRef.current) {
           return;
@@ -845,6 +1054,4 @@ } // Dismiss with click should ignore the subsequent `focus` trigger, but
 
-        if (!dataRef.current.dismiss) {
-          dataRef.current.openEvent = event.nativeEvent;
-          onOpenChange(true);
-        }
+        dataRef.current.openEvent = event.nativeEvent;
+        onOpenChange(true);
       },
@@ -863,3 +1070,3 @@
 
-        dataRef.current.dismiss = false;
+        blockFocusRef.current = false;
         dataRef.current.hoveredThenClicked = false;
@@ -874,11 +1081,17 @@ onOpenChange(false);
 const FOCUSABLE_ELEMENT_SELECTOR = 'a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,*[tabindex],*[contenteditable]';
+
+/**
+ * Traps focus in a loop of focusable elements while the floating element is
+ * open.
+ * @see https://floating-ui.com/docs/useFocusTrap
+ */
 const useFocusTrap = function (_ref, _temp) {
   let {
     open,
+    onOpenChange,
     refs,
-    treeRef,
-    nodeRef,
-    onOpenChange
+    nodeId
   } = _ref;
   let {
+    enabled = true,
     initialContentFocus = 0,
@@ -888,4 +1101,6 @@ order = ['content'],
     inert = false,
-    scrollLock = 'auto'
+    scrollLock = false
   } = _temp === void 0 ? {} : _temp;
+  const portalId = useFloatingPortalId();
+  const tree = useFloatingTree();
   const indexRef = useRef(0);
@@ -912,3 +1127,3 @@ const getFocusableElements = useCallback(() => {
   useEffect(() => {
-    if (inert) {
+    if (inert || !enabled) {
       return;
@@ -934,11 +1149,16 @@ }
     } else if (modal && isHTMLElement(refs.reference.current)) {
-      refs.reference.current.focus();
+      refs.reference.current.focus({
+        preventScroll: true
+      });
     }
-  }, [getFocusableElements, open, inert, modal, initialContentFocus, refs.reference]);
+  }, [getFocusableElements, open, inert, modal, initialContentFocus, enabled, refs.reference]);
   useEffect(() => {
-    if (!modal) {
+    if (!modal || !enabled) {
       return;
     }
 
+    const doc = getDocument(refs.floating.current);
+
     if (!open) {
+      doc.removeEventListener('keydown', onKeyDown);
       indexRef.current = 0;
@@ -949,12 +1169,14 @@ return;
     function onKeyDown(event) {
-      if (treeRef != null && treeRef.current.nodes.filter(_ref2 => {
+      var _tree$nodesRef$curren;
+
+      if (tree != null && (_tree$nodesRef$curren = tree.nodesRef.current) != null && _tree$nodesRef$curren.filter(_ref2 => {
         let {
-          current
+          parentId
         } = _ref2;
-        return current.parentId === (nodeRef == null ? void 0 : nodeRef.current.id);
+        return parentId === nodeId;
       }).some(_ref3 => {
         let {
-          current
+          context
         } = _ref3;
-        return current.open;
+        return context == null ? void 0 : context.open;
       })) {
@@ -988,3 +1210,2 @@ return;
 
-    const doc = getDocument(refs.floating.current);
     doc.addEventListener('keydown', onKeyDown);
@@ -994,3 +1215,3 @@ return () => {
     };
-  }, [getFocusableElements, nodeRef, open, modal, treeRef, inert, refs.floating]);
+  }, [getFocusableElements, tree == null ? void 0 : tree.nodesRef, nodeId, open, modal, inert, enabled, refs.floating]);
 
@@ -1003,3 +1224,3 @@ function onBlur(event) {
     if (target && !((_refs$floating$curren3 = refs.floating.current) != null && _refs$floating$curren3.contains(target)) && isElement(refs.reference.current) && !refs.reference.current.contains(target)) {
-      onOpenChange == null ? void 0 : onOpenChange(false);
+      onOpenChange(false);
     }
@@ -1009,3 +1230,3 @@ }
   useEffect(() => {
-    if (!open || !modal) {
+    if (!open || !modal || !enabled) {
       return;
@@ -1015,3 +1236,4 @@ }
     const doc = getDocument(refs.floating.current);
-    const nodes = doc.querySelectorAll('body > *:not(#floating-ui-root)');
+    const portal = doc.querySelector("#" + portalId);
+    const nodes = doc.querySelectorAll("body > *:not(#" + portalId + ")");
     nodes.forEach(node => {
@@ -1021,16 +1243,17 @@ node.setAttribute('aria-hidden', 'true');
     return () => {
-      nodes.forEach(node => {
-        node.removeAttribute('aria-hidden');
-      });
+      if ((portal == null ? void 0 : portal.firstElementChild) === refs.floating.current) {
+        nodes.forEach(node => {
+          node.removeAttribute('aria-hidden');
+        });
+      }
     };
-  }, [open, modal, scrollLock, refs.floating]);
+  }, [open, modal, scrollLock, portalId, enabled, refs.floating]);
   index(() => {
-    if (!open) {
+    if (!open || !enabled) {
       return;
     }
 
-    const applyScrollLock = scrollLock === true || scrollLock === 'auto' && modal;
     const doc = getDocument(refs.floating.current);
 
-    if (applyScrollLock) {
+    if (scrollLock) {
       var _doc$defaultView;
@@ -1044,3 +1267,3 @@
     return () => {
-      if (applyScrollLock) {
+      if (scrollLock) {
         doc.documentElement.style.overflow = '';
@@ -1050,4 +1273,8 @@ doc.body.style.paddingRight = '';
     };
-  }, [open, scrollLock]);
+  }, [open, scrollLock, enabled]);
 
+  if (!enabled) {
+    return {};
+  }
+
   if (modal) {
@@ -1092,10 +1319,18 @@ return {
 
-const useListNavigation = (_ref, _ref2) => {
+/**
+ * Adds focus-managed indexed navigation via arrow keys to a list of items
+ * within the floating element.
+ * @see https://floating-ui.com/docs/useListNavigation
+ */
+const useListNavigation = function (_ref, _temp2) {
   let {
     open,
-    onOpenChange = () => {},
+    onOpenChange,
     refs
   } = _ref;
   let {
-    listRef,
+    enabled = true,
+    listRef = {
+      current: []
+    },
     activeIndex = null,
@@ -1106,5 +1341,4 @@ selectedIndex = null,
     rtl = false,
-    preventScroll = true,
     onNavigate = () => {}
-  } = _ref2;
+  } = _temp2 === void 0 ? {} : _temp2;
   const focusOnOpenRef = useRef(true);
@@ -1117,6 +1351,10 @@ const indexRef = useRef(selectedIndex != null ? selectedIndex : 0);
     (_listRef$current$inde3 = listRef.current[indexRef.current]) == null ? void 0 : _listRef$current$inde3.focus({
-      preventScroll
+      preventScroll: true
     });
-  }, [preventScroll]);
+  }, []);
   index(() => {
+    if (!enabled) {
+      return;
+    }
+
     if (selectedIndex != null) {
@@ -1130,4 +1368,8 @@ indexRef.current = selectedIndex;
     }
-  }, [open, selectedIndex, listRef, onNavigate, focusItem]);
+  }, [open, selectedIndex, listRef, onNavigate, focusItem, enabled]);
   index(() => {
+    if (!enabled) {
+      return;
+    }
+
     if (open && activeIndex != null) {
@@ -1138,5 +1380,5 @@ indexRef.current = activeIndex;
     }
-  }, [open, activeIndex, listRef, onNavigate, focusItem]);
+  }, [open, activeIndex, listRef, onNavigate, focusItem, enabled]);
   index(() => {
-    if (selectedIndex != null) {
+    if (selectedIndex != null || !enabled) {
       return;
@@ -1157,4 +1399,8 @@ }
     keyRef.current = '';
-  }, [open, listRef, selectedIndex, onNavigate, focusItem]);
+  }, [open, listRef, selectedIndex, onNavigate, focusItem, enabled]);
   index(() => {
+    if (!enabled) {
+      return;
+    }
+
     if (!open && selectedIndex != null) {
@@ -1164,22 +1410,36 @@ var _refs$reference$curre;
       (_refs$reference$curre = refs.reference.current) == null ? void 0 : _refs$reference$curre.focus({
-        preventScroll
+        preventScroll: true
       });
     }
-  }, [refs.reference, preventScroll, selectedIndex, open]);
+  }, [refs.reference, selectedIndex, open, enabled]);
   index(() => {
+    if (!enabled) {
+      return;
+    }
+
     if (!open) {
       focusOnOpenRef.current = true;
+      onNavigate(null);
     }
-  }, [open]);
+  }, [open, enabled]);
+
+  function pointerCheck(event) {
+    // undefined or '' depending on the browser
+    focusOnOpenRef.current = !event.pointerType;
+  }
+
+  if (!enabled) {
+    return {};
+  }
+
   return {
     reference: {
-      onPointerDown(event) {
-        // undefined or '' depending on the browser
-        focusOnOpenRef.current = !event.pointerType;
-      },
+      onPointerEnter: pointerCheck,
+      onPointerDown: pointerCheck,
 
       onKeyDown(event) {
+        focusOnOpenRef.current = true;
         keyRef.current = event.key;
 
-        if (refs.reference.current instanceof Element && refs.reference.current.tagName !== 'BUTTON') {
+        if (isElement(refs.reference.current) && refs.reference.current.tagName !== 'BUTTON') {
           if (event.key === 'Enter' || event.key === ' ') {
@@ -1196,3 +1456,2 @@ onOpenChange(true);
             onNavigate(indexRef.current);
-            focusItem(listRef, indexRef);
           }
@@ -1216,3 +1475,2 @@
           onNavigate(indexRef.current);
-          focusItem(listRef, indexRef);
         }
@@ -1297,9 +1555,21 @@ }
 
-const useTypeahead = (context, _ref) => {
+/**
+ * Provides a transient string via a callback as the user types, often used in
+ * tandem with `useListNavigation()`.
+ * @see https://floating-ui.com/docs/useTypeahead
+ */
+const useTypeahead = function (_ref, _temp) {
   let {
-    listRef,
-    onMatch,
+    open
+  } = _ref;
+  let {
+    enabled = true,
+    listRef = {
+      current: []
+    },
+    onMatch = () => {},
+    onFind = null,
     debounceMs = 500,
     ignoreKeys = []
-  } = _ref;
+  } = _temp === void 0 ? {} : _temp;
   const timeoutIdRef = useRef();
@@ -1309,4 +1579,16 @@ const stringRef = useRef('');
   const matchIndexRef = useRef(null);
+  index(() => {
+    if (open) {
+      clearTimeout(timeoutIdRef.current);
+      prevIndexRef.current = null;
+      matchIndexRef.current = null;
+      stringRef.current = '';
+    }
+  }, [open]);
 
   function onKeyDown(event) {
+    if (!event.currentTarget.contains(getDocument(event.currentTarget).activeElement)) {
+      return;
+    }
+
     if (event.key === ' ' && stringRef.current.length > 0) {
@@ -1321,2 +1603,16 @@ event.preventDefault();
       return;
+    } // Bail out if the list contains a word like "llama" or "aaron". TODO:
+    // allow it in this case, too.
+
+
+    const allowRapidSuccessionOfFirstLetter = listContent.every(text => {
+      var _text$, _text$2;
+
+      return text ? ((_text$ = text[0]) == null ? void 0 : _text$.toLowerCase()) !== ((_text$2 = text[1]) == null ? void 0 : _text$2.toLowerCase()) : true;
+    }); // Allows the user to cycle through items that start with the same letter
+    // in rapid succession
+
+    if (allowRapidSuccessionOfFirstLetter && stringRef.current === event.key) {
+      stringRef.current = '';
+      prevIndexRef.current = matchIndexRef.current;
     }
@@ -1331,3 +1627,3 @@
     const prevIndex = prevIndexRef.current;
-    const str = [...listContent.slice((prevIndex != null ? prevIndex : -1) + 1), ...listContent.slice(0, prevIndex != null ? prevIndex : 0)].find(txt => (txt == null ? void 0 : txt.toLowerCase().indexOf(stringRef.current)) === 0);
+    const str = [...listContent.slice((prevIndex != null ? prevIndex : 0) + 1), ...listContent.slice(0, prevIndex != null ? prevIndex : 0)].find(text => onFind ? onFind(text, stringRef.current) : (text == null ? void 0 : text.toLowerCase().indexOf(stringRef.current)) === 0);
     const index = str ? listContent.indexOf(str) : -1;
@@ -1341,2 +1637,6 @@
 
+  if (!enabled) {
+    return {};
+  }
+
   return {
@@ -1355,15 +1655,11 @@ reference: {
     open = false,
-    onOpenChange,
+    onOpenChange = () => {},
     placement,
     middleware,
     strategy,
-    treeRef,
-    nodeRef
+    nodeId
   } = _temp === void 0 ? {} : _temp;
-  index(() => {
-    if (nodeRef) {
-      nodeRef.current.open = open;
-    }
-  });
+  const tree = useFloatingTree();
   const dataRef = useRef({});
+  const events = useState(() => createPubSub())[0];
   const floating = useFloating$1({
@@ -1375,8 +1671,15 @@ placement,
   const context = useMemo(() => ({ ...floating,
-    treeRef,
-    nodeRef,
+    dataRef,
+    nodeId,
+    events,
     open,
-    onOpenChange,
-    dataRef
-  }), [floating, nodeRef, treeRef, open, onOpenChange]);
+    onOpenChange
+  }), [floating, dataRef, nodeId, events, open, onOpenChange]);
+  index(() => {
+    const node = tree == null ? void 0 : tree.nodesRef.current.find(node => node.id === nodeId);
+
+    if (node) {
+      node.context = context;
+    }
+  });
   return useMemo(() => ({
@@ -1388,2 +1691,2 @@ context,
 
-export { FloatingGroup, FloatingPortal, createTree, safePolygon, useAria, useClick, useDismiss, useFloating, useFloatingId, useFocus, useFocusTrap, useGroup, useGroupContext, useHover, useInteractions, useListNavigation, useTypeahead };
+export { FloatingDelayGroup, FloatingNode, FloatingOverlay, FloatingPortal, FloatingTree, safePolygon, useAria, useClick, useDelayGroup, useDelayGroupContext, useDismiss, useFloating, useFloatingId, useFloatingNodeId, useFloatingParentNodeId, useFloatingTree, useFocus, useFocusTrap, useHover, useInteractions, useListNavigation, useTypeahead };

dist/floating-ui.react-dom-interactions.esm.min.js

@@ -1,1 +0,1 @@
-import{useLayoutEffect as e,useEffect as r,useState as n,useRef as t,useContext as o,useCallback as c,createContext as u,useMemo as i}from"react";import{getOverflowAncestors as l,useFloating as a}from"@floating-ui/react-dom";export*from"@floating-ui/react-dom";import{createPortal as f}from"react-dom";var d="undefined"!=typeof document?e:r;function s(e){return Object.entries(null!=e?e:{}).reduce(((e,r)=>{let[n,t]=r;return e[n]=[t],e}),{})}function g(e,r,n){const t={reference:"reference"===n?s(e):{},floating:"floating"===n?s(e):{}};return r.forEach((e=>{var r;const o=null!=(r=null==e?void 0:e[n])?r:{};Object.keys(o).forEach((e=>{var r;"function"==typeof o[e]&&(null==t[n][e]&&(t[n][e]=[]),null==(r=t[n][e])||r.push(o[e]))}))})),{..."floating"===n&&{tabIndex:-1},...e,...r.reduce(((e,r)=>(Object.assign(e,null==r?void 0:r[n]),e)),{}),...Object.entries(t[n]).reduce(((e,r)=>{let[n,t]=r;return 0===n.indexOf("on")&&(e[n]=function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];t.forEach((e=>e(...r)))}),e}),{})}}const v=function(e){return void 0===e&&(e=[]),{getReferenceProps:r=>g(r,e,"reference"),getFloatingProps:r=>g(r,e,"floating")}};function p(e){const r=new Map;return{nodes:e,emit(e,n){var t;null==(t=r.get(e))||t.forEach((e=>e(n)))},on(e,n){r.set(e,[...r.get(e)||[],n])},off(e,n){r.set(e,(r.get(e)||[]).filter((e=>e!==n)))}}}var h={exports:{}},m=function(e,r,n,t){var o=e[0],c=e[1],u=!1;void 0===n&&(n=0),void 0===t&&(t=r.length);for(var i=(t-n)/2,l=0,a=i-1;l<i;a=l++){var f=r[n+2*l+0],d=r[n+2*l+1],s=r[n+2*a+0],g=r[n+2*a+1];d>c!=g>c&&o<(s-f)*(c-d)/(g-d)+f&&(u=!u)}return u},y=function(e,r,n,t){var o=e[0],c=e[1],u=!1;void 0===n&&(n=0),void 0===t&&(t=r.length);for(var i=t-n,l=0,a=i-1;l<i;a=l++){var f=r[l+n][0],d=r[l+n][1],s=r[a+n][0],g=r[a+n][1];d>c!=g>c&&o<(s-f)*(c-d)/(g-d)+f&&(u=!u)}return u};h.exports=function(e,r,n,t){return r.length>0&&Array.isArray(r[0])?y(e,r,n,t):m(e,r,n,t)},h.exports.nested=y,h.exports.flat=m;var w=h.exports;function b(e){var r;return null!=(r=null==e?void 0:e.ownerDocument)?r:document}function E(e){var r;return null!=(r=b(e).defaultView)?r:window}function k(e){return!!e&&e instanceof E(e).Element}function x(e){return!!e&&e instanceof E(e).HTMLElement}function T(e){let r,{timeout:n=0,debug:t=null}=void 0===e?{}:e;return e=>{let{x:t,y:o,placement:c,refs:u,onClose:i,treeRef:l,nodeRef:a}=e;return function(e){var f;if("touch"===e.pointerType)return;const{target:d,clientX:s,clientY:g}=e,v=d;if("pointermove"===e.type&&k(u.reference.current)&&u.reference.current.contains(v)||null!=(f=u.floating.current)&&f.contains(v))return;if(null!=l&&l.current.nodes.filter((e=>{let{current:r}=e;return r.parentId===(null==a?void 0:a.current.id)})).some((e=>{let{current:r}=e;return r.open})))return;if(!u.reference.current||!u.floating.current||null==c||null==t||null==o)return;const p=u.reference.current.getBoundingClientRect(),h=u.floating.current.getBoundingClientRect(),m=c.split("-")[0],y=t>h.right-h.width/2,b=o>h.bottom-h.height/2;switch(m){case"top":if(s>=h.left&&s<=h.right&&g>=h.bottom&&g<=p.top)return;break;case"bottom":if(s>=h.left&&s<=h.right&&g>=p.bottom&&g<=h.top)return;break;case"left":if(s>=h.right&&s<=p.left&&g>=h.left&&g<=h.right)return;break;case"right":if(s>=h.right&&s<=p.left&&g>=h.right&&g<=p.left)return}const E=function(e){let[r,n]=e;switch(m){case"top":{const e=[r-(y?-1:1),n+1],t=[r-(y?-1:1),n-1],o=[[h.left,y||h.width>p.width?h.bottom:h.top],[h.right,y?h.width>p.width?h.bottom:h.top:h.bottom]];return h.width<p.width?y?[e,...o,t]:[e,t,...o]:[e,...o]}case"bottom":{const e=[r-(y?-1:1),n-1],t=[r-(y?-1:1),n+1],o=[[h.left,y||h.width>p.width?h.top:h.bottom],[h.right,y?h.width>p.width?h.top:h.bottom:h.top]];return h.width<p.width?y?[e,...o,t]:[e,t,...o]:[e,...o]}case"left":{const e=[r+1,n-(b?-1:1)],t=[r-1,n-(b?-1:1)],o=[[b||h.height>p.height?h.right-1:h.left,h.top],[b?h.height>p.height?h.right-1:h.left:h.right-1,h.bottom]];return h.height<p.height?b?[e,...o,t]:[e,t,...o]:[e,...o]}case"right":{const e=[r-1,n-(b?-1:1)],t=[r+1,n-(b?-1:1)],o=[[b||h.height>p.height?h.left+1:h.right,h.top],[b?h.height>p.height?h.left+1:h.right:h.left+1,h.bottom]];return h.height<p.height?b?[e,...o,t]:[e,t,...o]:[e,...o]}}}([t,o]);w([s,g],E)?n&&(r=setTimeout(i,n)):(clearTimeout(r),i())}}}function A(e){let{children:r}=e;const[o,c]=n(!1),u=t(null);return d((()=>{const e=document.getElementById("floating-ui-root");e?u.current=e:(u.current=document.createElement("div"),u.current.id="floating-ui-root");const r=u.current;return document.body.contains(r)||document.body.appendChild(r),c(!0),()=>{document.body.contains(r)&&document.body.removeChild(r)}}),[]),o&&u.current?f(r,u.current):null}function R(e,r){return"number"==typeof e?e:e[r]}const C=function(e,r){let{delay:n=0,handleLeave:o=null,mouseOnly:c=!1,pointerRestMs:u=0}=void 0===r?{}:r;const{onOpenChange:i=(()=>{}),open:l,dataRef:a,refs:f}=e,s=t(null),g=t(!1),v=t(),p=t();d((()=>{if(!o)return;if(!l)return void(g.current=!1);function e(){var e;"pointerover"===(null==(e=s.current)?void 0:e.type)&&i(!1)}const r=b(f.floating.current).documentElement;return r.addEventListener("pointerleave",e),()=>{r.removeEventListener("pointerleave",e)}}),[l,i,o]);const h=t();return{reference:{onPointerMove(){0===u||l||(clearTimeout(h.current),h.current=setTimeout((()=>{a.current.dismiss||i(!0)}),u))},onPointerEnter(e){c&&"mouse"!==e.pointerType||(s.current=e.nativeEvent,n?(clearTimeout(v.current),v.current=setTimeout((()=>{a.current.dismiss||i(!0)}),R(n,"open"))):i(!0))},onPointerLeave(r){var t;if(g.current||"click"===(null==(t=s.current)?void 0:t.type))return;const c=b(f.floating.current);if(o)return clearTimeout(v.current),p.current&&c.removeEventListener("pointermove",p.current),p.current=o({...e,x:r.clientX,y:r.clientY,onClose(){p.current&&c.removeEventListener("pointermove",p.current),i(!1)}}),void c.addEventListener("pointermove",p.current);a.current.dismiss=!1,n?(clearTimeout(h.current),clearTimeout(v.current),v.current=setTimeout((()=>i(!1)),R(n,"close"))):(g.current=!1,i(!1))}}}},I=u({delay:1e3,initialDelay:1e3,currentId:null,setCurrentId:()=>{},setState:()=>{}}),D=()=>{const e=o(I);if(!e)throw new Error("useGroupContext() must be used within a <FloatingGroup />");return e},L=e=>{let{children:r,delay:t}=e;const[o,u]=n({delay:t,initialDelay:t,currentId:null}),i=c((e=>{u((r=>({...r,currentId:e})))}),[]);return React.createElement(I.Provider,{value:{...o,setState:u,setCurrentId:i}},r)},O=(e,n)=>{let{open:t,onOpenChange:o}=e,{id:c}=n;const{currentId:u,initialDelay:i,setState:l}=D();r((()=>{u&&o&&(l((e=>({...e,delay:{open:0,close:R(i,"close")}}))),u!==c&&o(!1))}),[c,o,l,u,i]),r((()=>{!t&&u===c&&o&&(o(!1),l((e=>({...e,delay:i,currentId:null}))))}),[t,l,u,c,o,i])};let P=0;function S(){return"floating-ui-"+P++}function B(){return i(S,[])}const M=function(e,r){let{open:n}=e,{role:t="dialog",titleId:o,descriptionId:c}=void 0===r?{}:r;const u=B(),i={id:u,role:t};return"tooltip"===t?{reference:{"aria-describedby":n?u:void 0},floating:i}:{reference:{"aria-expanded":n?"true":"false","aria-haspopup":t,"aria-controls":n?u:void 0,..."listbox"===t&&{role:"combobox"}},floating:{...i,..."dialog"===t&&{"aria-labelledby":o,"aria-describedby":c}}}},K=e=>{let{open:r,onOpenChange:n=(()=>{}),dataRef:t}=e;return{reference:{onClick(e){var o;r?"click"===(null==(o=t.current.openEvent)?void 0:o.type)||t.current.hoveredThenClicked?(t.current.hoveredThenClicked=!1,n(!1)):t.current.hoveredThenClicked=!0:(t.current.openEvent=e.nativeEvent,n(!0))}}}},U=function(e,n){let{onOpenChange:t=(()=>{}),refs:o,open:u,treeRef:i,nodeRef:a,dataRef:f}=e,{escapeKey:d=!0,outsidePointerDown:s=!0,referencePointerDown:g=!1,ancestorScroll:v=!1}=void 0===n?{}:n;const p=c((()=>{x(o.reference.current)&&o.reference.current.focus()}),[o.reference.current]);return r((()=>{function e(){t(!1),p()}const r=null==i?void 0:i.current;return null==r||r.on("close",e),()=>{null==r||r.off("close",e)}}),[i,t,p]),r((()=>{if(!u)return;function e(){return null==i?void 0:i.current.nodes.filter((e=>{let{current:r}=e;return r.parentId===(null==a?void 0:a.current.id)})).some((e=>{let{current:r}=e;return r.open}))}function r(r){"Escape"!==r.key||e()||(f.current.dismiss=!0,i?i.current.emit("close"):(t(!1),p()))}function n(r){var n;null!=(n=o.floating.current)&&n.contains(r.target)||k(o.reference.current)&&o.reference.current.contains(r.target)||e()||(i?i.current.emit("close"):(t(!1),p()))}function c(){t(!1)}const g=b(o.floating.current);d&&g.addEventListener("keydown",r),s&&g.addEventListener("pointerdown",n);const h=v?[...k(o.reference.current)?l(o.reference.current):[],...k(o.floating.current)?l(o.floating.current):[]]:[];return h.forEach((e=>e.addEventListener("scroll",c,{passive:!0}))),()=>{d&&g.removeEventListener("keydown",r),s&&g.removeEventListener("pointerdown",n),h.forEach((e=>e.removeEventListener("scroll",c)))}}),[d,s,i,a,u,t,f,p,v,o.floating,o.reference]),{reference:{onPointerDown(){g&&(f.current.dismiss=!0,t(!1))}}}},j=function(e,r){let{open:n,onOpenChange:o=(()=>{}),dataRef:c,refs:u}=e,{keyboardOnly:i=!0}=void 0===r?{}:r;const l=t();return d((()=>{n||(l.current=void 0)})),{reference:{onPointerDown(e){let{pointerType:r}=e;l.current=r},onFocus(e){var r,n;i&&l.current||"focus"===e.type&&"mousedown"===c.current.openEvent&&k(u.reference.current)&&null!=(r=u.reference.current)&&r.contains(null==(n=c.current.openEvent)?void 0:n.target)||c.current.dismiss||(c.current.openEvent=e.nativeEvent,o(!0))},onBlur(e){var r;const n=e.relatedTarget;null!=(r=u.floating.current)&&r.contains(n)||k(u.reference.current)&&u.reference.current.contains(n)||(c.current.dismiss=!1,c.current.hoveredThenClicked=!1,o(!1))}}}},F=function(e,n){let{open:o,refs:u,treeRef:i,nodeRef:l,onOpenChange:a}=e,{initialContentFocus:f=0,order:s=["content"],modal:g=!0,inert:v=!1,scrollLock:p="auto"}=void 0===n?{}:n;const h=t(0),m=c((()=>s.map((e=>{return x(u.reference.current)&&"reference"===e?u.reference.current:u.floating.current&&"floating"===e?u.floating.current:"content"===e?Array.from(null!=(r=null==(n=u.floating.current)?void 0:n.querySelectorAll("a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,*[tabindex],*[contenteditable]"))?r:[]):null;var r,n})).filter(Boolean).flat()),[u.floating,u.reference,s]);function y(e){var r;const n=e.relatedTarget;!n||null!=(r=u.floating.current)&&r.contains(n)||!k(u.reference.current)||u.reference.current.contains(n)||null==a||a(!1)}return r((()=>{if(!v)if(o){const n=m();var e;if("number"==typeof f)null==(e=n[f])||e.focus({preventScroll:!0});else if(f.current){var r;null==(r=n.find((e=>e===f.current)))||r.focus({preventScroll:!0})}}else g&&x(u.reference.current)&&u.reference.current.focus()}),[m,o,v,g,f,u.reference]),r((()=>{if(!g)return;if(!o)return void(h.current=0);function e(e){if((null==i||!i.current.nodes.filter((e=>{let{current:r}=e;return r.parentId===(null==l?void 0:l.current.id)})).some((e=>{let{current:r}=e;return r.open})))&&"Tab"===e.key){var r;if(e.preventDefault(),e.stopPropagation(),v)return;const n=m();e.shiftKey?h.current=0===h.current?n.length-1:h.current-1:h.current=h.current===n.length-1?0:h.current+1,null==(r=n[h.current])||r.focus({preventScroll:!0})}}const r=b(u.floating.current);return r.addEventListener("keydown",e),()=>{r.removeEventListener("keydown",e)}}),[m,l,o,g,i,v,u.floating]),r((()=>{if(!o||!g)return;const e=b(u.floating.current).querySelectorAll("body > *:not(#floating-ui-root)");return e.forEach((e=>{e.setAttribute("aria-hidden","true")})),()=>{e.forEach((e=>{e.removeAttribute("aria-hidden")}))}}),[o,g,p,u.floating]),d((()=>{if(!o)return;const e=!0===p||"auto"===p&&g,r=b(u.floating.current);if(e){var n;const e=(null!=(n=r.defaultView)?n:window).innerWidth-r.documentElement.offsetWidth;r.documentElement.style.overflow="hidden",r.body.style.paddingRight=e+"px"}return()=>{e&&(r.documentElement.style.overflow="",r.body.style.paddingRight="")}}),[o,p]),g?{floating:{"aria-modal":"true"}}:{reference:{onBlur:y},floating:{onBlur:y}}};function H(e){e.preventDefault(),e.stopPropagation()}function N(e,r){let{startingIndex:n=-1,decrement:t=!1}=void 0===r?{}:r,o=n;do{var c,u;o+=t?-1:1}while(null!=(c=e.current[o])&&c.hasAttribute("disabled")||"true"===(null==(u=e.current[o])?void 0:u.getAttribute("aria-disabled")));return-1===o?0:o}const q=(e,r)=>{let{open:n,onOpenChange:o=(()=>{}),refs:u}=e,{listRef:i,activeIndex:l=null,selectedIndex:a=null,loop:f=!1,nested:s=!1,rtl:g=!1,preventScroll:v=!0,onNavigate:p=(()=>{})}=r;const h=t(!0),m=t(null!=a?a:0),y=t(""),w=c(((e,r)=>{var n;null==(n=e.current[r.current])||n.focus({preventScroll:v})}),[v]);return d((()=>{null!=a&&(m.current=a),n&&h.current&&(p(m.current),w(i,m))}),[n,a,i,p,w]),d((()=>{n&&null!=l&&(m.current=l,p(m.current),w(i,m))}),[n,l,i,p,w]),d((()=>{null==a&&(n&&("ArrowDown"===y.current||"ArrowUp"===y.current||h.current&&(" "===y.current||"Enter"===y.current))&&(m.current="ArrowUp"===y.current?N(i,{startingIndex:i.current.length,decrement:!0}):N(i),p(m.current),w(i,m)),y.current="")}),[n,i,a,p,w]),d((()=>{var e;n||null==a||(null==(e=u.reference.current)||e.focus({preventScroll:v}))}),[u.reference,v,a,n]),d((()=>{n||(h.current=!0)}),[n]),{reference:{onPointerDown(e){h.current=!e.pointerType},onKeyDown(e){y.current=e.key,u.reference.current instanceof Element&&"BUTTON"!==u.reference.current.tagName&&("Enter"!==e.key&&" "!==e.key||o(!0)),s?e.key===(g?"ArrowLeft":"ArrowRight")&&(m.current=N(i),H(e),o(!0),p(m.current),w(i,m)):"ArrowDown"!==e.key&&"ArrowUp"!==e.key||(m.current=null==a?"ArrowDown"===e.key?N(i):N(i,{startingIndex:i.current.length,decrement:!0}):a,H(e),o(!0),p(m.current),w(i,m))}},floating:{onKeyDown(e){if(s&&e.key===(g?"ArrowRight":"ArrowLeft"))return H(e),o(!1),void(x(u.reference.current)&&u.reference.current.focus());const r=m.current,n=N(i),t=N(i,{decrement:!0,startingIndex:i.current.length});if("Home"===e.key&&(m.current=n,p(m.current),w(i,m)),"End"===e.key&&(m.current=t,p(m.current),w(i,m)),"ArrowDown"===e.key||"ArrowUp"===e.key){if(H(e),e.currentTarget.ownerDocument.activeElement===e.currentTarget&&null!=a)return m.current=a,p(m.current),void w(i,m);"ArrowDown"===e.key?m.current=f?r===t?n:N(i,{startingIndex:r}):Math.min(t,N(i,{startingIndex:r})):m.current=f?r===n?t:N(i,{startingIndex:r,decrement:!0}):Math.max(n,N(i,{startingIndex:r,decrement:!0})),p(m.current),w(i,m)}}}}},G=(e,r)=>{let{listRef:n,onMatch:o,debounceMs:c=500,ignoreKeys:u=[]}=r;const i=t(),l=t(""),a=t(null),f=t(null);function d(e){" "===e.key&&l.current.length>0&&(e.preventDefault(),e.stopPropagation());const r=n.current;if(null==r||["Home","End","Escape","Enter","Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight",...u].includes(e.key))return;l.current+=e.key,clearTimeout(i.current),i.current=setTimeout((()=>{l.current="",a.current=f.current}),c);const t=a.current,d=[...r.slice((null!=t?t:-1)+1),...r.slice(0,null!=t?t:0)].find((e=>0===(null==e?void 0:e.toLowerCase().indexOf(l.current)))),s=d?r.indexOf(d):-1;-1!==s&&(o(s),f.current=s)}return{reference:{onKeyDown:d},floating:{onKeyDown:d}}};function V(e){let{open:r=!1,onOpenChange:n,placement:o,middleware:c,strategy:u,treeRef:l,nodeRef:f}=void 0===e?{}:e;d((()=>{f&&(f.current.open=r)}));const s=t({}),g=a({placement:o,middleware:c,strategy:u}),v=i((()=>({...g,treeRef:l,nodeRef:f,open:r,onOpenChange:n,dataRef:s})),[g,f,l,r,n]);return i((()=>({context:v,...g})),[g,v])}export{L as FloatingGroup,A as FloatingPortal,p as createTree,T as safePolygon,M as useAria,K as useClick,U as useDismiss,V as useFloating,B as useFloatingId,j as useFocus,F as useFocusTrap,O as useGroup,D as useGroupContext,C as useHover,v as useInteractions,q as useListNavigation,G as useTypeahead};
+import e,{useLayoutEffect as n,useEffect as r,useMemo as t,useContext as o,useRef as c,useCallback as u,createContext as i,useState as l,forwardRef as a}from"react";import{getOverflowAncestors as d,useFloating as f}from"@floating-ui/react-dom";export*from"@floating-ui/react-dom";import{createPortal as s}from"react-dom";var v="undefined"!=typeof document?n:r;function p(){const e=new Map;return{emit(n,r){var t;null==(t=e.get(n))||t.forEach((e=>e(r)))},on(n,r){e.set(n,[...e.get(n)||[],r])},off(n,r){e.set(n,(e.get(n)||[]).filter((e=>e!==r)))}}}let g=0;function m(){return"floating-ui-"+g++}function h(){return t(m,[])}const y=i(null),b=i(null),w=()=>{var e,n;return null!=(e=null==(n=o(y))?void 0:n.id)?e:null},E=()=>o(b),k=()=>{const e=h(),n=E(),r=w();return v((()=>{const t={id:e,parentId:r};return null==n||n.addNode(t),()=>{null==n||n.removeNode(t)}}),[n,e,r]),e},x=e=>{let{children:n,id:r}=e;const t=w();return React.createElement(y.Provider,{value:{id:r,parentId:t}},n)},T=e=>{let{children:n}=e;const r=c([]),t=u((e=>{r.current=[...r.current,e]}),[]),o=u((e=>{r.current=r.current.filter((n=>n!==e))}),[]);return React.createElement(b.Provider,{value:{nodesRef:r,addNode:t,removeNode:o,events:p()}},n)};function I(e){return Object.entries(null!=e?e:{}).reduce(((e,n)=>{let[r,t]=n;return e[r]=[t],e}),{})}function C(e,n,r){const t={reference:"reference"===r?I(e):{},floating:"floating"===r?I(e):{}};return n.forEach((e=>{var n;const o=null!=(n=null==e?void 0:e[r])?n:{};Object.keys(o).forEach((e=>{var n;"function"==typeof o[e]&&(null==t[r][e]&&(t[r][e]=[]),null==(n=t[r][e])||n.push(o[e]))}))})),{..."floating"===r&&{tabIndex:-1},...e,...n.reduce(((e,n)=>(Object.assign(e,null==n?void 0:n[r]),e)),{}),...Object.entries(t[r]).reduce(((e,n)=>{let[r,t]=n;return 0===r.indexOf("on")&&(e[r]=function(){for(var e=arguments.length,n=new Array(e),r=0;r<e;r++)n[r]=arguments[r];t.forEach((e=>e(...n)))}),e}),{})}}const A=function(e){return void 0===e&&(e=[]),{getReferenceProps:n=>C(n,e,"reference"),getFloatingProps:n=>C(n,e,"floating")}};var L={exports:{}},R=function(e,n,r,t){var o=e[0],c=e[1],u=!1;void 0===r&&(r=0),void 0===t&&(t=n.length);for(var i=(t-r)/2,l=0,a=i-1;l<i;a=l++){var d=n[r+2*l+0],f=n[r+2*l+1],s=n[r+2*a+0],v=n[r+2*a+1];f>c!=v>c&&o<(s-d)*(c-f)/(v-f)+d&&(u=!u)}return u},D=function(e,n,r,t){var o=e[0],c=e[1],u=!1;void 0===r&&(r=0),void 0===t&&(t=n.length);for(var i=t-r,l=0,a=i-1;l<i;a=l++){var d=n[l+r][0],f=n[l+r][1],s=n[a+r][0],v=n[a+r][1];f>c!=v>c&&o<(s-d)*(c-f)/(v-f)+d&&(u=!u)}return u};L.exports=function(e,n,r,t){return n.length>0&&Array.isArray(n[0])?D(e,n,r,t):R(e,n,r,t)},L.exports.nested=D,L.exports.flat=R;var O=L.exports;function P(e){var n;return null!=(n=null==e?void 0:e.ownerDocument)?n:document}function S(e){var n;return null!=(n=P(e).defaultView)?n:window}function N(e){return!!e&&e instanceof S(e).Element}function j(e){return!!e&&e instanceof S(e).HTMLElement}function B(e,n){var r;let t=null!=(r=null==e?void 0:e.nodesRef.current.filter((e=>{var r;return e.parentId===n&&(null==(r=e.context)?void 0:r.open)})))?r:[],o=t;for(;o.length;){var c;o=null!=(c=null==e?void 0:e.nodesRef.current.filter((e=>{var n;return null==(n=o)?void 0:n.some((n=>{var r;return e.parentId===n.id&&(null==(r=e.context)?void 0:r.open)}))})))?c:[],t=t.concat(o)}return t}function M(e){let n,{timeout:r=0,debug:t=null}=void 0===e?{}:e;return e=>{let{x:o,y:c,placement:u,refs:i,onClose:l,nodeId:a,tree:d}=e;return function(e){var f;if("touch"===e.pointerType)return;const{target:s,clientX:v,clientY:p}=e,g=s;if("pointermove"===e.type&&N(i.reference.current)&&i.reference.current.contains(g)||null!=(f=i.floating.current)&&f.contains(g))return;if(d&&B(d,a).some((e=>{let{context:n}=e;return null==n?void 0:n.open})))return;if(!i.reference.current||!i.floating.current||null==u||null==o||null==c)return;const m=i.reference.current.getBoundingClientRect(),h=i.floating.current.getBoundingClientRect(),y=u.split("-")[0],b=o>h.right-h.width/2,w=c>h.bottom-h.height/2;switch(y){case"top":if(v>=h.left&&v<=h.right&&p>=h.bottom&&p<=m.top)return;break;case"bottom":if(v>=h.left&&v<=h.right&&p>=m.bottom&&p<=h.top)return;break;case"left":if(v>=h.right&&v<=m.left&&p>=h.left&&p<=h.right)return;break;case"right":if(v>=h.right&&v<=m.left&&p>=h.right&&p<=m.left)return}function E(e){let[n,r]=e;const t=h.width>m.width,o=h.height>m.height;switch(y){case"top":{const e=[t?n:b?n+1:n-1,r+1],o=[t?n:b?n-1:n+1,r+1],c=[[h.left,b||t?h.bottom-1:h.top],[h.right,b?t?h.bottom-1:h.top:h.bottom-1]];return b?[e,o,...c]:[e,...c,o]}case"bottom":{const e=[t?n:b?n+1:n-1,r-1],o=[t?n:b?n-1:n+1,r-1],c=[[h.left,b||t?h.top+1:h.bottom],[h.right,b?t?h.top+1:h.bottom:h.top+1]];return b?[e,o,...c]:[e,...c,o]}case"left":{const e=[n+1,o?r:w?r-1:r+1],t=[n+1,o?r:w?r+1:r-1],c=[[w||o?h.right-1:h.left,h.top],[w?o?h.right-1:h.left:h.right-1,h.bottom]];return w?[e,...c,t]:[...c,e,t]}case"right":{const e=[n-1,o?r:w?r+1:r-1],t=[n-1,o?r:w?r-1:r+1],c=[[w||o?h.left+1:h.right,h.top],[w?o?h.left+1:h.right:h.left+1,h.bottom]];return w?[e,t,...c]:[e,...c,t]}}}const k=E([o,c]);"production"!==process.env.NODE_ENV&&(null==t||t(E([o,c]).slice(0,4).join(", "))),O([v,p],k)?r&&(n=setTimeout(l,r)):(clearTimeout(n),l())}}}const K="floating-ui-root",U=i(K),F=n=>{let{children:r,id:t=K}=n;const[o,u]=l(!1),i=c(null);return v((()=>{const e=document.getElementById(t);e?i.current=e:(i.current=document.createElement("div"),i.current.id=t);const n=i.current;document.body.contains(n)||document.body.appendChild(n),u(!0)}),[]),o&&i.current?e.createElement(U.Provider,{value:t},s(r,i.current)):null};function V(){return V=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var r=arguments[n];for(var t in r)Object.prototype.hasOwnProperty.call(r,t)&&(e[t]=r[t])}return e},V.apply(this,arguments)}const q=a((function(e,n){return React.createElement("div",V({ref:n},e,{style:{position:"fixed",top:0,right:0,bottom:0,left:0,width:"100%",height:"100%",...e.style}}))}));function H(e,n){return"number"==typeof e?e:null==e?void 0:e[n]}const W=function(e,n){let{enabled:t=!0,delay:o=0,handleLeave:u=null,mouseOnly:i=!1,pointerRestMs:l=0}=void 0===n?{}:n;const{open:a,onOpenChange:d,dataRef:f,events:s,refs:p}=e,g=E(),m=c(),h=c(),y=c(),b=c(!0);function w(e){void 0===e&&(e=!0),o?(clearTimeout(m.current),m.current=setTimeout((()=>d(!1)),H(o,"close"))):e&&d(!1)}return v((()=>{a||(f.current.hoveredThenClicked=!1)}),[a]),r((()=>{function e(){clearTimeout(m.current),clearTimeout(y.current),b.current=!0}return s.on("dismiss",e),()=>{s.off("dismiss",e)}}),[s]),t?{reference:{onPointerMove(){0===l||a||(clearTimeout(y.current),y.current=setTimeout((()=>{b.current||d(!0)}),l))},onPointerEnter(e){i&&"mouse"!==e.pointerType||(b.current=!1,f.current.openEvent=e.nativeEvent,o?(clearTimeout(m.current),m.current=setTimeout((()=>{d(!0)}),H(o,"open"))):d(!0))},onPointerLeave(n){var r;if(f.current.hoveredThenClicked||"click"===(null==(r=f.current.openEvent)?void 0:r.type))return;const t=P(p.floating.current);if(clearTimeout(y.current),u)return clearTimeout(m.current),h.current&&t.removeEventListener("pointermove",h.current),h.current=u({...e,tree:g,x:n.clientX,y:n.clientY,onClose(){h.current&&t.removeEventListener("pointermove",h.current),w()}}),h.current(n.nativeEvent),void t.addEventListener("pointermove",h.current);w()}},floating:{onPointerEnter(){clearTimeout(m.current)},onPointerLeave:()=>w(!1)}}:{}},X=i({delay:1e3,initialDelay:1e3,currentId:null,setCurrentId:()=>{},setState:()=>{}}),Y=()=>o(X),_=e=>{let{children:n,delay:r}=e;const[t,o]=l({delay:r,initialDelay:r,currentId:null}),c=u((e=>{o((n=>({...n,currentId:e})))}),[]);return React.createElement(X.Provider,{value:{...t,setState:o,setCurrentId:c}},n)},z=(e,n)=>{let{open:t,onOpenChange:o}=e,{id:c}=n;const{currentId:u,initialDelay:i,setState:l}=Y();r((()=>{u&&o&&(l((e=>({...e,delay:{open:0,close:H(i,"close")}}))),u!==c&&o(!1))}),[c,o,l,u,i]),r((()=>{!t&&u===c&&o&&(o(!1),l((e=>({...e,delay:i,currentId:null}))))}),[t,l,u,c,o,i])},G=function(e,n){let{open:r}=e,{enabled:t=!0,role:o="dialog",titleId:c,descriptionId:u}=void 0===n?{}:n;const i=h(),l={id:i,role:o};return t?"tooltip"===o?{reference:{"aria-describedby":r?i:void 0},floating:l}:{reference:{"aria-expanded":r?"true":"false","aria-haspopup":o,"aria-controls":r?i:void 0,..."listbox"===o&&{role:"combobox"}},floating:{...l,..."dialog"===o&&{"aria-labelledby":c,"aria-describedby":u}}}:{}},J=function(e,n){let{open:r,onOpenChange:t,dataRef:o}=e,{enabled:c=!0}=void 0===n?{}:n;return c?{reference:{onClick(e){var n;r?"click"===(null==(n=o.current.openEvent)?void 0:n.type)||o.current.hoveredThenClicked?(o.current.hoveredThenClicked=!1,t(!1)):o.current.hoveredThenClicked=!0:(o.current.openEvent=e.nativeEvent,t(!0))}}}:{}},Q=function(e,n){let{open:t,onOpenChange:o,refs:c,events:i,nodeId:l}=e,{enabled:a=!0,escapeKey:f=!0,outsidePointerDown:s=!0,referencePointerDown:v=!1,ancestorScroll:p=!1}=void 0===n?{}:n;const g=E(),m=u((()=>{j(c.reference.current)&&c.reference.current.focus()}),[c.reference.current]);return r((()=>{if(!t||!a)return;function e(e){"Escape"===e.key&&(i.emit("dismiss"),o(!1),m())}function n(e){var n;const r=g&&B(g,l).some((n=>{var r,t;return null==(r=n.context)||null==(t=r.refs.floating.current)?void 0:t.contains(e.target)}));null!=(n=c.floating.current)&&n.contains(e.target)||N(c.reference.current)&&c.reference.current.contains(e.target)||r||(i.emit("dismiss"),o(!1),m())}function r(){o(!1)}const u=P(c.floating.current);f&&u.addEventListener("keydown",e),s&&u.addEventListener("pointerdown",n);const v=p?[...N(c.reference.current)?d(c.reference.current):[],...N(c.floating.current)?d(c.floating.current):[]]:[];return v.forEach((e=>e.addEventListener("scroll",r,{passive:!0}))),()=>{f&&u.removeEventListener("keydown",e),s&&u.removeEventListener("pointerdown",n),v.forEach((e=>e.removeEventListener("scroll",r)))}}),[f,s,i,g,l,t,o,m,p,a,c.floating,c.reference]),a?{reference:{onPointerDown(){v&&(i.emit("dismiss"),o(!1))}}}:{}},Z=function(e,n){let{open:t,onOpenChange:o,dataRef:u,refs:i,events:l}=e,{enabled:a=!0,keyboardOnly:d=!0}=void 0===n?{}:n;const f=c(!1);return r((()=>{var e;if(!a)return;const n=null!=(e=P(i.floating.current).defaultView)?e:window;function r(){f.current=!t}function o(){setTimeout((()=>{f.current=!1}))}return n.addEventListener("focus",o),n.addEventListener("blur",r),()=>{n.addEventListener("focus",o),n.removeEventListener("blur",r)}}),[i.floating,t,a]),r((()=>{if(a)return l.on("dismiss",e),()=>{l.off("dismiss",e)};function e(){f.current=!0}}),[l,a]),a?{reference:{onPointerDown(e){let{pointerType:n}=e;f.current=!(!n||!d)},onFocus(e){var n,r;f.current||"focus"===e.type&&"mousedown"===u.current.openEvent&&N(i.reference.current)&&null!=(n=i.reference.current)&&n.contains(null==(r=u.current.openEvent)?void 0:r.target)||(u.current.openEvent=e.nativeEvent,o(!0))},onBlur(e){var n;const r=e.relatedTarget;null!=(n=i.floating.current)&&n.contains(r)||N(i.reference.current)&&i.reference.current.contains(r)||(f.current=!1,u.current.hoveredThenClicked=!1,o(!1))}}}:{}},$=function(e,n){let{open:t,onOpenChange:i,refs:l,nodeId:a}=e,{enabled:d=!0,initialContentFocus:f=0,order:s=["content"],modal:p=!0,inert:g=!1,scrollLock:m=!1}=void 0===n?{}:n;const h=o(U),y=E(),b=c(0),w=u((()=>s.map((e=>{return j(l.reference.current)&&"reference"===e?l.reference.current:l.floating.current&&"floating"===e?l.floating.current:"content"===e?Array.from(null!=(n=null==(r=l.floating.current)?void 0:r.querySelectorAll("a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,*[tabindex],*[contenteditable]"))?n:[]):null;var n,r})).filter(Boolean).flat()),[l.floating,l.reference,s]);function k(e){var n;const r=e.relatedTarget;!r||null!=(n=l.floating.current)&&n.contains(r)||!N(l.reference.current)||l.reference.current.contains(r)||i(!1)}return r((()=>{if(!g&&d)if(t){const r=w();var e;if("number"==typeof f)null==(e=r[f])||e.focus({preventScroll:!0});else if(f.current){var n;null==(n=r.find((e=>e===f.current)))||n.focus({preventScroll:!0})}}else p&&j(l.reference.current)&&l.reference.current.focus({preventScroll:!0})}),[w,t,g,p,f,d,l.reference]),r((()=>{if(!p||!d)return;const e=P(l.floating.current);if(!t)return e.removeEventListener("keydown",n),void(b.current=0);function n(e){var n;if((null==y||null==(n=y.nodesRef.current)||!n.filter((e=>{let{parentId:n}=e;return n===a})).some((e=>{let{context:n}=e;return null==n?void 0:n.open})))&&"Tab"===e.key){var r;if(e.preventDefault(),e.stopPropagation(),g)return;const n=w();e.shiftKey?b.current=0===b.current?n.length-1:b.current-1:b.current=b.current===n.length-1?0:b.current+1,null==(r=n[b.current])||r.focus({preventScroll:!0})}}return e.addEventListener("keydown",n),()=>{e.removeEventListener("keydown",n)}}),[w,null==y?void 0:y.nodesRef,a,t,p,g,d,l.floating]),r((()=>{if(!t||!p||!d)return;const e=P(l.floating.current),n=e.querySelector("#"+h),r=e.querySelectorAll("body > *:not(#"+h+")");return r.forEach((e=>{e.setAttribute("aria-hidden","true")})),()=>{(null==n?void 0:n.firstElementChild)===l.floating.current&&r.forEach((e=>{e.removeAttribute("aria-hidden")}))}}),[t,p,m,h,d,l.floating]),v((()=>{if(!t||!d)return;const e=P(l.floating.current);if(m){var n;const r=(null!=(n=e.defaultView)?n:window).innerWidth-e.documentElement.offsetWidth;e.documentElement.style.overflow="hidden",e.body.style.paddingRight=r+"px"}return()=>{m&&(e.documentElement.style.overflow="",e.body.style.paddingRight="")}}),[t,m,d]),d?p?{floating:{"aria-modal":"true"}}:{reference:{onBlur:k},floating:{onBlur:k}}:{}};function ee(e){e.preventDefault(),e.stopPropagation()}function ne(e,n){let{startingIndex:r=-1,decrement:t=!1}=void 0===n?{}:n,o=r;do{var c,u;o+=t?-1:1}while(null!=(c=e.current[o])&&c.hasAttribute("disabled")||"true"===(null==(u=e.current[o])?void 0:u.getAttribute("aria-disabled")));return-1===o?0:o}const re=function(e,n){let{open:r,onOpenChange:t,refs:o}=e,{enabled:i=!0,listRef:l={current:[]},activeIndex:a=null,selectedIndex:d=null,loop:f=!1,nested:s=!1,rtl:p=!1,onNavigate:g=(()=>{})}=void 0===n?{}:n;const m=c(!0),h=c(null!=d?d:0),y=c(""),b=u(((e,n)=>{var r;null==(r=e.current[n.current])||r.focus({preventScroll:!0})}),[]);function w(e){m.current=!e.pointerType}return v((()=>{i&&(null!=d&&(h.current=d),r&&m.current&&(g(h.current),b(l,h)))}),[r,d,l,g,b,i]),v((()=>{i&&r&&null!=a&&(h.current=a,g(h.current),b(l,h))}),[r,a,l,g,b,i]),v((()=>{null==d&&i&&(r&&("ArrowDown"===y.current||"ArrowUp"===y.current||m.current&&(" "===y.current||"Enter"===y.current))&&(h.current="ArrowUp"===y.current?ne(l,{startingIndex:l.current.length,decrement:!0}):ne(l),g(h.current),b(l,h)),y.current="")}),[r,l,d,g,b,i]),v((()=>{var e;i&&(r||null==d||null==(e=o.reference.current)||e.focus({preventScroll:!0}))}),[o.reference,d,r,i]),v((()=>{i&&(r||(m.current=!0,g(null)))}),[r,i]),i?{reference:{onPointerEnter:w,onPointerDown:w,onKeyDown(e){m.current=!0,y.current=e.key,N(o.reference.current)&&"BUTTON"!==o.reference.current.tagName&&("Enter"!==e.key&&" "!==e.key||t(!0)),s?e.key===(p?"ArrowLeft":"ArrowRight")&&(h.current=ne(l),ee(e),t(!0),g(h.current)):"ArrowDown"!==e.key&&"ArrowUp"!==e.key||(h.current=null==d?"ArrowDown"===e.key?ne(l):ne(l,{startingIndex:l.current.length,decrement:!0}):d,ee(e),t(!0),g(h.current))}},floating:{onKeyDown(e){if(s&&e.key===(p?"ArrowRight":"ArrowLeft"))return ee(e),t(!1),void(j(o.reference.current)&&o.reference.current.focus());const n=h.current,r=ne(l),c=ne(l,{decrement:!0,startingIndex:l.current.length});if("Home"===e.key&&(h.current=r,g(h.current),b(l,h)),"End"===e.key&&(h.current=c,g(h.current),b(l,h)),"ArrowDown"===e.key||"ArrowUp"===e.key){if(ee(e),e.currentTarget.ownerDocument.activeElement===e.currentTarget&&null!=d)return h.current=d,g(h.current),void b(l,h);"ArrowDown"===e.key?h.current=f?n===c?r:ne(l,{startingIndex:n}):Math.min(c,ne(l,{startingIndex:n})):h.current=f?n===r?c:ne(l,{startingIndex:n,decrement:!0}):Math.max(r,ne(l,{startingIndex:n,decrement:!0})),g(h.current),b(l,h)}}}}:{}},te=function(e,n){let{open:r}=e,{enabled:t=!0,listRef:o={current:[]},onMatch:u=(()=>{}),onFind:i=null,debounceMs:l=500,ignoreKeys:a=[]}=void 0===n?{}:n;const d=c(),f=c(""),s=c(null),p=c(null);function g(e){if(!e.currentTarget.contains(P(e.currentTarget).activeElement))return;" "===e.key&&f.current.length>0&&(e.preventDefault(),e.stopPropagation());const n=o.current;if(null==n||["Home","End","Escape","Enter","Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight",...a].includes(e.key))return;n.every((e=>{var n,r;return!e||(null==(n=e[0])?void 0:n.toLowerCase())!==(null==(r=e[1])?void 0:r.toLowerCase())}))&&f.current===e.key&&(f.current="",s.current=p.current),f.current+=e.key,clearTimeout(d.current),d.current=setTimeout((()=>{f.current="",s.current=p.current}),l);const r=s.current,t=[...n.slice((null!=r?r:0)+1),...n.slice(0,null!=r?r:0)].find((e=>i?i(e,f.current):0===(null==e?void 0:e.toLowerCase().indexOf(f.current)))),c=t?n.indexOf(t):-1;-1!==c&&(u(c),p.current=c)}return v((()=>{r&&(clearTimeout(d.current),s.current=null,p.current=null,f.current="")}),[r]),t?{reference:{onKeyDown:g},floating:{onKeyDown:g}}:{}};function oe(e){let{open:n=!1,onOpenChange:r=(()=>{}),placement:o,middleware:u,strategy:i,nodeId:a}=void 0===e?{}:e;const d=E(),s=c({}),g=l((()=>p()))[0],m=f({placement:o,middleware:u,strategy:i}),h=t((()=>({...m,dataRef:s,nodeId:a,events:g,open:n,onOpenChange:r})),[m,s,a,g,n,r]);return v((()=>{const e=null==d?void 0:d.nodesRef.current.find((e=>e.id===a));e&&(e.context=h)})),t((()=>({context:h,...m})),[m,h])}export{_ as FloatingDelayGroup,x as FloatingNode,q as FloatingOverlay,F as FloatingPortal,T as FloatingTree,M as safePolygon,G as useAria,J as useClick,z as useDelayGroup,Y as useDelayGroupContext,Q as useDismiss,oe as useFloating,h as useFloatingId,k as useFloatingNodeId,w as useFloatingParentNodeId,E as useFloatingTree,Z as useFocus,$ as useFocusTrap,W as useHover,A as useInteractions,re as useListNavigation,te as useTypeahead};

dist/floating-ui.react-dom-interactions.js

@@ -5,6 +5,114 @@ (function (global, factory) {
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.FloatingUIReactDOM = {}, global.React, global.FloatingUIReactDOM, global.ReactDOM));
-})(this, (function (exports, react, reactDom, reactDom$1) { 'use strict';
+})(this, (function (exports, React$1, reactDom, reactDom$1) { 'use strict';
 
-  var index = typeof document !== 'undefined' ? react.useLayoutEffect : react.useEffect;
+  function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+  var React__default = /*#__PURE__*/_interopDefaultLegacy(React$1);
+
+  var index = typeof document !== 'undefined' ? React$1.useLayoutEffect : React$1.useEffect;
+
+  function createPubSub() {
+    const map = new Map();
+    return {
+      emit(event, data) {
+        var _map$get;
+
+        (_map$get = map.get(event)) == null ? void 0 : _map$get.forEach(handler => handler(data));
+      },
+
+      on(event, listener) {
+        map.set(event, [...(map.get(event) || []), listener]);
+      },
+
+      off(event, listener) {
+        map.set(event, (map.get(event) || []).filter(l => l !== listener));
+      }
+
+    };
+  }
+
+  let globalId = 0;
+
+  function genId() {
+    return "floating-ui-" + globalId++;
+  }
+
+  function useFloatingId() {
+    return React$1.useMemo(genId, []);
+  }
+
+  const FloatingNodeContext = /*#__PURE__*/React$1.createContext(null);
+  const FloatingTreeContext = /*#__PURE__*/React$1.createContext(null);
+  const useFloatingParentNodeId = () => {
+    var _useContext$id, _useContext;
+
+    return (_useContext$id = (_useContext = React$1.useContext(FloatingNodeContext)) == null ? void 0 : _useContext.id) != null ? _useContext$id : null;
+  };
+  const useFloatingTree = () => React$1.useContext(FloatingTreeContext);
+  /**
+   * Registers a node into the floating tree, returning its id.
+   */
+
+  const useFloatingNodeId = () => {
+    const id = useFloatingId();
+    const tree = useFloatingTree();
+    const parentId = useFloatingParentNodeId();
+    index(() => {
+      const node = {
+        id,
+        parentId
+      };
+      tree == null ? void 0 : tree.addNode(node);
+      return () => {
+        tree == null ? void 0 : tree.removeNode(node);
+      };
+    }, [tree, id, parentId]);
+    return id;
+  };
+  /**
+   * Provides parent node context for nested floating elements.
+   * @see https://floating-ui.com/docs/FloatingTree
+   */
+
+  const FloatingNode = _ref => {
+    let {
+      children,
+      id
+    } = _ref;
+    const parentId = useFloatingParentNodeId();
+    return /*#__PURE__*/React.createElement(FloatingNodeContext.Provider, {
+      value: {
+        id,
+        parentId
+      }
+    }, children);
+  };
+  /**
+   * Provides context for nested floating elements when they are not children of
+   * each other on the DOM (i.e. portalled to a common node, rather than their
+   * respective parent).
+   * @see https://floating-ui.com/docs/FloatingTree
+   */
+
+  const FloatingTree = _ref2 => {
+    let {
+      children
+    } = _ref2;
+    const nodesRef = React$1.useRef([]);
+    const addNode = React$1.useCallback(node => {
+      nodesRef.current = [...nodesRef.current, node];
+    }, []);
+    const removeNode = React$1.useCallback(node => {
+      nodesRef.current = nodesRef.current.filter(n => n !== node);
+    }, []);
+    return /*#__PURE__*/React.createElement(FloatingTreeContext.Provider, {
+      value: {
+        nodesRef,
+        addNode,
+        removeNode,
+        events: createPubSub()
+      }
+    }, children);
+  };
+
   function reducePropsToArrayWithInitValue(userProps) {
@@ -76,24 +184,2 @@ return Object.entries(userProps != null ? userProps : {}).reduce((acc, _ref) => {
 
-  function createTree(nodes) {
-    const map = new Map();
-    return {
-      nodes,
-
-      emit(event, data) {
-        var _map$get;
-
-        (_map$get = map.get(event)) == null ? void 0 : _map$get.forEach(handler => handler(data));
-      },
-
-      on(event, listener) {
-        map.set(event, [...(map.get(event) || []), listener]);
-      },
-
-      off(event, listener) {
-        map.set(event, (map.get(event) || []).filter(l => l !== listener));
-      }
-
-    };
-  }
-
   var pointInPolygon$1 = {exports: {}};
@@ -170,2 +256,30 @@
 
+  function getChildren(tree, id) {
+    var _tree$nodesRef$curren;
+
+    let allChildren = (_tree$nodesRef$curren = tree == null ? void 0 : tree.nodesRef.current.filter(node => {
+      var _node$context;
+
+      return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open);
+    })) != null ? _tree$nodesRef$curren : [];
+    let currentChildren = allChildren;
+
+    while (currentChildren.length) {
+      var _tree$nodesRef$curren2;
+
+      currentChildren = (_tree$nodesRef$curren2 = tree == null ? void 0 : tree.nodesRef.current.filter(node => {
+        var _currentChildren;
+
+        return (_currentChildren = currentChildren) == null ? void 0 : _currentChildren.some(n => {
+          var _node$context2;
+
+          return node.parentId === n.id && ((_node$context2 = node.context) == null ? void 0 : _node$context2.open);
+        });
+      })) != null ? _tree$nodesRef$curren2 : [];
+      allChildren = allChildren.concat(currentChildren);
+    }
+
+    return allChildren;
+  }
+
   function safePolygon(_temp) {
@@ -184,4 +298,4 @@ let {
         onClose,
-        treeRef,
-        nodeRef
+        nodeId,
+        tree
       } = _ref;
@@ -207,12 +321,7 @@ return function onPointerMove(event) {
 
-        if (treeRef != null && treeRef.current.nodes.filter(_ref2 => {
+        if (tree && getChildren(tree, nodeId).some(_ref2 => {
           let {
-            current
+            context
           } = _ref2;
-          return current.parentId === (nodeRef == null ? void 0 : nodeRef.current.id);
-        }).some(_ref3 => {
-          let {
-            current
-          } = _ref3;
-          return current.open;
+          return context == null ? void 0 : context.open;
         })) {
@@ -263,4 +372,6 @@ return;
 
-        function getPolygon(_ref4) {
-          let [x, y] = _ref4;
+        function getPolygon(_ref3) {
+          let [x, y] = _ref3;
+          const isFloatingWider = rect.width > refRect.width;
+          const isFloatingTaller = rect.height > refRect.height;
 
@@ -270,11 +381,11 @@ switch (side) {
               {
-                const cursorPointOne = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y + BUFFER];
-                const cursorPointTwo = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y - BUFFER];
-                const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.bottom : rect.width > refRect.width ? rect.bottom : rect.top], [rect.right, cursorLeaveFromRight ? rect.width > refRect.width ? rect.bottom : rect.top : rect.bottom]];
+                const cursorPointOne = [isFloatingWider ? x : cursorLeaveFromRight ? x + BUFFER : x - BUFFER, y + BUFFER];
+                const cursorPointTwo = [isFloatingWider ? x : cursorLeaveFromRight ? x - BUFFER : x + BUFFER, y + BUFFER];
+                const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.bottom - BUFFER : isFloatingWider ? rect.bottom - BUFFER : rect.top], [rect.right, cursorLeaveFromRight ? isFloatingWider ? rect.bottom - BUFFER : rect.top : rect.bottom - BUFFER]];
 
-                if (rect.width < refRect.width) {
-                  return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+                if (cursorLeaveFromRight) {
+                  return [cursorPointOne, cursorPointTwo, ...commonPoints];
                 }
 
-                return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+                return [cursorPointOne, ...commonPoints, cursorPointTwo];
               }
@@ -284,11 +395,11 @@
               {
-                const cursorPointOne = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y - BUFFER];
-                const cursorPointTwo = [x - (cursorLeaveFromRight ? -BUFFER : BUFFER), y + BUFFER];
-                const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.top : rect.width > refRect.width ? rect.top : rect.bottom], [rect.right, cursorLeaveFromRight ? rect.width > refRect.width ? rect.top : rect.bottom : rect.top]];
+                const cursorPointOne = [isFloatingWider ? x : cursorLeaveFromRight ? x + BUFFER : x - BUFFER, y - BUFFER];
+                const cursorPointTwo = [isFloatingWider ? x : cursorLeaveFromRight ? x - BUFFER : x + BUFFER, y - BUFFER];
+                const commonPoints = [[rect.left, cursorLeaveFromRight ? rect.top + BUFFER : isFloatingWider ? rect.top + BUFFER : rect.bottom], [rect.right, cursorLeaveFromRight ? isFloatingWider ? rect.top + BUFFER : rect.bottom : rect.top + BUFFER]];
 
-                if (rect.width < refRect.width) {
-                  return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+                if (cursorLeaveFromRight) {
+                  return [cursorPointOne, cursorPointTwo, ...commonPoints];
                 }
 
-                return cursorLeaveFromRight ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+                return [cursorPointOne, ...commonPoints, cursorPointTwo];
               }
@@ -298,11 +409,11 @@
               {
-                const cursorPointOne = [x + BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-                const cursorPointTwo = [x - BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-                const commonPoints = [[cursorLeaveFromBottom ? rect.right - BUFFER : rect.height > refRect.height ? rect.right - BUFFER : rect.left, rect.top], [cursorLeaveFromBottom ? rect.height > refRect.height ? rect.right - BUFFER : rect.left : rect.right - BUFFER, rect.bottom]];
+                const cursorPointOne = [x + BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y - BUFFER : y + BUFFER];
+                const cursorPointTwo = [x + BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y + BUFFER : y - BUFFER];
+                const commonPoints = [[cursorLeaveFromBottom ? rect.right - BUFFER : isFloatingTaller ? rect.right - BUFFER : rect.left, rect.top], [cursorLeaveFromBottom ? isFloatingTaller ? rect.right - BUFFER : rect.left : rect.right - BUFFER, rect.bottom]];
 
-                if (rect.height < refRect.height) {
-                  return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+                if (cursorLeaveFromBottom) {
+                  return [cursorPointOne, ...commonPoints, cursorPointTwo];
                 }
 
-                return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+                return [...commonPoints, cursorPointOne, cursorPointTwo];
               }
@@ -312,11 +423,11 @@
               {
-                const cursorPointOne = [x - BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-                const cursorPointTwo = [x + BUFFER, y - (cursorLeaveFromBottom ? -BUFFER : BUFFER)];
-                const commonPoints = [[cursorLeaveFromBottom ? rect.left + BUFFER : rect.height > refRect.height ? rect.left + BUFFER : rect.right, rect.top], [cursorLeaveFromBottom ? rect.height > refRect.height ? rect.left + BUFFER : rect.right : rect.left + BUFFER, rect.bottom]];
+                const cursorPointOne = [x - BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y + BUFFER : y - BUFFER];
+                const cursorPointTwo = [x - BUFFER, isFloatingTaller ? y : cursorLeaveFromBottom ? y - BUFFER : y + BUFFER];
+                const commonPoints = [[cursorLeaveFromBottom ? rect.left + BUFFER : isFloatingTaller ? rect.left + BUFFER : rect.right, rect.top], [cursorLeaveFromBottom ? isFloatingTaller ? rect.left + BUFFER : rect.right : rect.left + BUFFER, rect.bottom]];
 
-                if (rect.height < refRect.height) {
-                  return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints, cursorPointTwo] : [cursorPointOne, cursorPointTwo, ...commonPoints];
+                if (cursorLeaveFromBottom) {
+                  return [cursorPointOne, cursorPointTwo, ...commonPoints];
                 }
 
-                return cursorLeaveFromBottom ? [cursorPointOne, ...commonPoints] : [cursorPointOne, ...commonPoints];
+                return [cursorPointOne, ...commonPoints, cursorPointTwo];
               }
@@ -328,3 +439,3 @@ }
 
-        if (process.env.NODE_ENV !== "production") {
+        if (process.env.NODE_ENV !== 'production') {
           debug == null ? void 0 : debug(getPolygon([x, y]).slice(0, 4).join(', '));
@@ -343,10 +454,19 @@ }
 
-  function FloatingPortal(_ref) {
+  const DEFAULT_ID = 'floating-ui-root';
+  const FloatingPortalContext = /*#__PURE__*/React$1.createContext(DEFAULT_ID);
+  const useFloatingPortalId = () => React$1.useContext(FloatingPortalContext);
+  /**
+   * Portals your floating element outside of the main app node.
+   * @see https://floating-ui.com/docs/FloatingPortal
+   */
+
+  const FloatingPortal = _ref => {
     let {
-      children
+      children,
+      id = DEFAULT_ID
     } = _ref;
-    const [mounted, setMounted] = react.useState(false);
-    const portalRef = react.useRef(null);
+    const [mounted, setMounted] = React$1.useState(false);
+    const portalRef = React$1.useRef(null);
     index(() => {
-      const root = document.getElementById('floating-ui-root');
+      const root = document.getElementById(id);
 
@@ -357,3 +477,3 @@ if (root) {
         portalRef.current = document.createElement('div');
-        portalRef.current.id = 'floating-ui-root';
+        portalRef.current.id = id;
       }
@@ -368,16 +488,55 @@
       setMounted(true);
-      return () => {
-        if (document.body.contains(el)) {
-          document.body.removeChild(el);
-        }
-      };
     }, []);
 
     if (mounted && portalRef.current) {
-      return /*#__PURE__*/reactDom$1.createPortal(children, portalRef.current);
+      return /*#__PURE__*/React__default["default"].createElement(FloatingPortalContext.Provider, {
+        value: id
+      }, /*#__PURE__*/reactDom$1.createPortal(children, portalRef.current));
     }
 
     return null;
+  };
+
+  function _extends() {
+    _extends = Object.assign || function (target) {
+      for (var i = 1; i < arguments.length; i++) {
+        var source = arguments[i];
+
+        for (var key in source) {
+          if (Object.prototype.hasOwnProperty.call(source, key)) {
+            target[key] = source[key];
+          }
+        }
+      }
+
+      return target;
+    };
+
+    return _extends.apply(this, arguments);
   }
 
+  /**
+   * Provides base styling for a fixed overlay element to dim content or block
+   * pointer events behind a floating element.
+   * It's a regular `<div>`, so it can be styled via any CSS solution you prefer.
+   * @see https://floating-ui.com/docs/FloatingOverlay
+   */
+
+  const FloatingOverlay = /*#__PURE__*/React$1.forwardRef(function FloatingOverlay(props, ref) {
+    return /*#__PURE__*/React.createElement("div", _extends({
+      ref: ref
+    }, props, {
+      style: {
+        position: 'fixed',
+        top: 0,
+        right: 0,
+        bottom: 0,
+        left: 0,
+        width: '100%',
+        height: '100%',
+        ...props.style
+      }
+    }));
+  });
+
   function getDelay(value, prop) {
@@ -388,6 +547,12 @@ if (typeof value === 'number') {
 
-    return value[prop];
+    return value == null ? void 0 : value[prop];
   }
+
+  /**
+   * Adds hover event listeners that change the open state, like CSS :hover.
+   * @see https://floating-ui.com/docs/useHover
+   */
   const useHover = function (context, _temp) {
     let {
+      enabled = true,
       delay = 0,
@@ -399,39 +564,48 @@ handleLeave = null,
     const {
-      onOpenChange = () => {},
       open,
+      onOpenChange,
       dataRef,
+      events,
       refs
     } = context;
-    const enterEventRef = react.useRef(null);
-    const hoveredThenClickedRef = react.useRef(false);
-    const timeoutRef = react.useRef();
-    const handlerRef = react.useRef();
+    const tree = useFloatingTree();
+    const timeoutRef = React$1.useRef();
+    const handlerRef = React$1.useRef();
+    const pointerRestTimeoutRef = React$1.useRef();
+    const blockPointerMoveRef = React$1.useRef(true);
     index(() => {
-      if (!handleLeave) {
-        return;
+      if (!open) {
+        dataRef.current.hoveredThenClicked = false;
       }
+    }, [open]);
+    React$1.useEffect(() => {
+      function onDismiss() {
+        clearTimeout(timeoutRef.current);
+        clearTimeout(pointerRestTimeoutRef.current);
+        blockPointerMoveRef.current = true;
+      }
 
-      if (!open) {
-        hoveredThenClickedRef.current = false;
-        return;
-      } // If the cursor is moving quickly off the page, the `pointermove` event
-      // to check if the cursor is outside of the "safe triangle" area will not
-      // fire, resulting in the floating element remaining open.
+      events.on('dismiss', onDismiss);
+      return () => {
+        events.off('dismiss', onDismiss);
+      };
+    }, [events]);
 
+    function closeWithDelay(runElseBranch) {
+      if (runElseBranch === void 0) {
+        runElseBranch = true;
+      }
 
-      function onHTMLPointerLeave() {
-        var _enterEventRef$curren;
-
-        if (((_enterEventRef$curren = enterEventRef.current) == null ? void 0 : _enterEventRef$curren.type) === 'pointerover') {
-          onOpenChange(false);
-        }
+      if (delay) {
+        clearTimeout(timeoutRef.current);
+        timeoutRef.current = setTimeout(() => onOpenChange(false), getDelay(delay, 'close'));
+      } else if (runElseBranch) {
+        onOpenChange(false);
       }
+    }
 
-      const html = getDocument(refs.floating.current).documentElement;
-      html.addEventListener('pointerleave', onHTMLPointerLeave);
-      return () => {
-        html.removeEventListener('pointerleave', onHTMLPointerLeave);
-      };
-    }, [open, onOpenChange, handleLeave]);
-    const pointerRestTimeoutRef = react.useRef();
+    if (!enabled) {
+      return {};
+    }
+
     return {
@@ -446,3 +620,3 @@ reference: {
           pointerRestTimeoutRef.current = setTimeout(() => {
-            if (!dataRef.current.dismiss) {
+            if (!blockPointerMoveRef.current) {
               onOpenChange(true);
@@ -458,3 +632,4 @@ }
 
-          enterEventRef.current = event.nativeEvent;
+          blockPointerMoveRef.current = false;
+          dataRef.current.openEvent = event.nativeEvent;
 
@@ -464,5 +639,3 @@ if (delay) {
             timeoutRef.current = setTimeout(() => {
-              if (!dataRef.current.dismiss) {
-                onOpenChange(true);
-              }
+              onOpenChange(true);
             }, getDelay(delay, 'open'));
@@ -475,5 +648,5 @@ } else {
         onPointerLeave(event) {
-          var _enterEventRef$curren2;
+          var _dataRef$current$open;
 
-          if (hoveredThenClickedRef.current || ((_enterEventRef$curren2 = enterEventRef.current) == null ? void 0 : _enterEventRef$curren2.type) === 'click') {
+          if (dataRef.current.hoveredThenClicked || ((_dataRef$current$open = dataRef.current.openEvent) == null ? void 0 : _dataRef$current$open.type) === 'click') {
             return;
@@ -483,2 +656,3 @@ }
           const doc = getDocument(refs.floating.current);
+          clearTimeout(pointerRestTimeoutRef.current);
 
@@ -489,2 +663,3 @@ if (handleLeave) {
             handlerRef.current = handleLeave({ ...context,
+              tree,
               x: event.clientX,
@@ -495,6 +670,7 @@ y: event.clientY,
                 handlerRef.current && doc.removeEventListener('pointermove', handlerRef.current);
-                onOpenChange(false);
+                closeWithDelay();
               }
 
             });
+            handlerRef.current(event.nativeEvent);
             doc.addEventListener('pointermove', handlerRef.current);
@@ -504,14 +680,12 @@ return;
 
-          dataRef.current.dismiss = false;
-
-          if (delay) {
-            clearTimeout(pointerRestTimeoutRef.current);
-            clearTimeout(timeoutRef.current);
-            timeoutRef.current = setTimeout(() => onOpenChange(false), getDelay(delay, 'close'));
-          } else {
-            hoveredThenClickedRef.current = false;
-            onOpenChange(false);
-          }
+          closeWithDelay();
         }
 
+      },
+      floating: {
+        onPointerEnter() {
+          clearTimeout(timeoutRef.current);
+        },
+
+        onPointerLeave: () => closeWithDelay(false)
       }
@@ -521,3 +695,3 @@ };
 
-  const FloatingGroupContext = /*#__PURE__*/react.createContext({
+  const FloatingDelayGroupContext = /*#__PURE__*/React$1.createContext({
     delay: 1000,
@@ -529,12 +703,10 @@ initialDelay: 1000,
   });
-  const useGroupContext = () => {
-    const context = react.useContext(FloatingGroupContext);
+  const useDelayGroupContext = () => React$1.useContext(FloatingDelayGroupContext);
+  /**
+   * Provides context for a group of floating elements that should share a
+   * `delay`.
+   * @see https://floating-ui.com/docs/FloatingDelayGroup
+   */
 
-    if (!context) {
-      throw new Error('useGroupContext() must be used within a <FloatingGroup />');
-    }
-
-    return context;
-  };
-  const FloatingGroup = _ref => {
+  const FloatingDelayGroup = _ref => {
     let {
@@ -544,3 +716,3 @@ children,
     } = _ref;
-    const [state, setState] = react.useState({
+    const [state, setState] = React$1.useState({
       delay,
@@ -550,3 +722,3 @@ initialDelay: delay,
     });
-    const setCurrentId = react.useCallback(currentId => {
+    const setCurrentId = React$1.useCallback(currentId => {
       setState(state => ({ ...state,
@@ -556,3 +728,3 @@ currentId
     }, []);
-    return /*#__PURE__*/React.createElement(FloatingGroupContext.Provider, {
+    return /*#__PURE__*/React.createElement(FloatingDelayGroupContext.Provider, {
       value: { ...state,
@@ -564,3 +736,3 @@ setState,
   };
-  const useGroup = (_ref2, _ref3) => {
+  const useDelayGroup = (_ref2, _ref3) => {
     let {
@@ -577,4 +749,4 @@ open,
       setState
-    } = useGroupContext();
-    react.useEffect(() => {
+    } = useDelayGroupContext();
+    React$1.useEffect(() => {
       if (currentId && onOpenChange) {
@@ -593,3 +765,3 @@ setState(state => ({ ...state,
     }, [id, onOpenChange, setState, currentId, initialDelay]);
-    react.useEffect(() => {
+    React$1.useEffect(() => {
       if (!open && currentId === id && onOpenChange) {
@@ -605,12 +777,5 @@ onOpenChange(false);
 
-  let globalId = 0;
-
-  function genId() {
-    return "floating-ui-" + globalId++;
-  }
-
-  function useFloatingId() {
-    return react.useMemo(genId, []);
-  }
-
+  /**
+   * Adds relevant screen reader props for a given element `role`.
+   */
   const useAria = function (_ref, _temp) {
@@ -621,2 +786,3 @@ let {
     let {
+      enabled = true,
       role = 'dialog',
@@ -632,2 +798,6 @@ titleId,
 
+    if (!enabled) {
+      return {};
+    }
+
     if (role === 'tooltip') {
@@ -660,8 +830,20 @@ return {
 
-  const useClick = _ref => {
+  /**
+   * Adds click event listeners that change the open state (toggle behavior).
+   * @see https://floating-ui.com/docs/useClick
+   */
+  const useClick = function (_ref, _temp) {
     let {
       open,
-      onOpenChange = () => {},
+      onOpenChange,
       dataRef
     } = _ref;
+    let {
+      enabled = true
+    } = _temp === void 0 ? {} : _temp;
+
+    if (!enabled) {
+      return {};
+    }
+
     return {
@@ -690,12 +872,16 @@ reference: {
 
+  /**
+   * Adds listeners that dismiss (close) the floating element.
+   * @see https://floating-ui.com/docs/useDismiss
+   */
   const useDismiss = function (_ref, _temp) {
     let {
-      onOpenChange = () => {},
+      open,
+      onOpenChange,
       refs,
-      open,
-      treeRef,
-      nodeRef,
-      dataRef
+      events,
+      nodeId
     } = _ref;
     let {
+      enabled = true,
       escapeKey = true,
@@ -706,3 +892,4 @@ outsidePointerDown = true,
     } = _temp === void 0 ? {} : _temp;
-    const focusReference = react.useCallback(() => {
+    const tree = useFloatingTree();
+    const focusReference = React$1.useCallback(() => {
       if (isHTMLElement(refs.reference.current)) {
@@ -713,43 +900,12 @@ refs.reference.current.focus();
     }, [refs.reference.current]);
-    react.useEffect(() => {
-      function onClose() {
-        onOpenChange(false);
-        focusReference();
-      }
-
-      const tree = treeRef == null ? void 0 : treeRef.current;
-      tree == null ? void 0 : tree.on('close', onClose);
-      return () => {
-        tree == null ? void 0 : tree.off('close', onClose);
-      };
-    }, [treeRef, onOpenChange, focusReference]);
-    react.useEffect(() => {
-      if (!open) {
+    React$1.useEffect(() => {
+      if (!open || !enabled) {
         return;
       }
 
-      function isAnyChildNodeOpen() {
-        return treeRef == null ? void 0 : treeRef.current.nodes.filter(_ref2 => {
-          let {
-            current
-          } = _ref2;
-          return current.parentId === (nodeRef == null ? void 0 : nodeRef.current.id);
-        }).some(_ref3 => {
-          let {
-            current
-          } = _ref3;
-          return current.open;
-        });
-      }
-
       function onKeyDown(event) {
-        if (event.key === 'Escape' && !isAnyChildNodeOpen()) {
-          dataRef.current.dismiss = true;
-
-          if (treeRef) {
-            treeRef.current.emit('close');
-          } else {
-            onOpenChange(false);
-            focusReference();
-          }
+        if (event.key === 'Escape') {
+          events.emit('dismiss');
+          onOpenChange(false);
+          focusReference();
         }
@@ -761,12 +917,15 @@ }
 
-        if ((_refs$floating$curren = refs.floating.current) != null && _refs$floating$curren.contains(event.target) || isElement(refs.reference.current) && refs.reference.current.contains(event.target) || isAnyChildNodeOpen()) {
+        const targetIsInsideChildren = tree && getChildren(tree, nodeId).some(node => {
+          var _node$context, _node$context$refs$fl;
+
+          return (_node$context = node.context) == null ? void 0 : (_node$context$refs$fl = _node$context.refs.floating.current) == null ? void 0 : _node$context$refs$fl.contains(event.target);
+        });
+
+        if ((_refs$floating$curren = refs.floating.current) != null && _refs$floating$curren.contains(event.target) || isElement(refs.reference.current) && refs.reference.current.contains(event.target) || targetIsInsideChildren) {
           return;
         }
 
-        if (treeRef) {
-          treeRef.current.emit('close');
-        } else {
-          onOpenChange(false);
-          focusReference();
-        }
+        events.emit('dismiss');
+        onOpenChange(false);
+        focusReference();
       }
@@ -790,3 +949,8 @@
       };
-    }, [escapeKey, outsidePointerDown, treeRef, nodeRef, open, onOpenChange, dataRef, focusReference, ancestorScroll, refs.floating, refs.reference]);
+    }, [escapeKey, outsidePointerDown, events, tree, nodeId, open, onOpenChange, focusReference, ancestorScroll, enabled, refs.floating, refs.reference]);
+
+    if (!enabled) {
+      return {};
+    }
+
     return {
@@ -796,3 +960,3 @@ reference: {
           if (referencePointerDown) {
-            dataRef.current.dismiss = true;
+            events.emit('dismiss');
             onOpenChange(false);
@@ -806,18 +970,65 @@ }
 
+  /**
+   * Adds hover event listeners that change the open state, like CSS :focus.
+   * @see https://floating-ui.com/docs/useFocus
+   */
   const useFocus = function (_ref, _temp) {
     let {
       open,
-      onOpenChange = () => {},
+      onOpenChange,
       dataRef,
-      refs
+      refs,
+      events
     } = _ref;
     let {
+      enabled = true,
       keyboardOnly = true
     } = _temp === void 0 ? {} : _temp;
-    const pointerTypeRef = react.useRef();
-    index(() => {
-      if (!open) {
-        pointerTypeRef.current = undefined;
+    const blockFocusRef = React$1.useRef(false);
+    React$1.useEffect(() => {
+      var _doc$defaultView;
+
+      if (!enabled) {
+        return;
       }
-    });
+
+      const doc = getDocument(refs.floating.current);
+      const win = (_doc$defaultView = doc.defaultView) != null ? _doc$defaultView : window;
+
+      function onBlur() {
+        blockFocusRef.current = !open;
+      }
+
+      function onFocus() {
+        setTimeout(() => {
+          blockFocusRef.current = false;
+        });
+      }
+
+      win.addEventListener('focus', onFocus);
+      win.addEventListener('blur', onBlur);
+      return () => {
+        win.addEventListener('focus', onFocus);
+        win.removeEventListener('blur', onBlur);
+      };
+    }, [refs.floating, open, enabled]);
+    React$1.useEffect(() => {
+      if (!enabled) {
+        return;
+      }
+
+      function onDismiss() {
+        blockFocusRef.current = true;
+      }
+
+      events.on('dismiss', onDismiss);
+      return () => {
+        events.off('dismiss', onDismiss);
+      };
+    }, [events, enabled]);
+
+    if (!enabled) {
+      return {};
+    }
+
     return {
@@ -829,4 +1040,3 @@ reference: {
           } = _ref2;
-          // undefined or "" depending on the browser
-          pointerTypeRef.current = pointerType;
+          blockFocusRef.current = !!(pointerType && keyboardOnly);
         },
@@ -837,3 +1047,6 @@
 
-          if (keyboardOnly && pointerTypeRef.current) {
+          // Note: due to the `window` focus/blur listeners, switching between
+          // DevTools touch/normal mode may cause this to fail on the first
+          // focus of the window/touch of the element as it gets set to `false`.
+          if (blockFocusRef.current) {
             return;
@@ -848,6 +1061,4 @@ } // Dismiss with click should ignore the subsequent `focus` trigger, but
 
-          if (!dataRef.current.dismiss) {
-            dataRef.current.openEvent = event.nativeEvent;
-            onOpenChange(true);
-          }
+          dataRef.current.openEvent = event.nativeEvent;
+          onOpenChange(true);
         },
@@ -866,3 +1077,3 @@
 
-          dataRef.current.dismiss = false;
+          blockFocusRef.current = false;
           dataRef.current.hoveredThenClicked = false;
@@ -877,11 +1088,17 @@ onOpenChange(false);
   const FOCUSABLE_ELEMENT_SELECTOR = 'a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,*[tabindex],*[contenteditable]';
+
+  /**
+   * Traps focus in a loop of focusable elements while the floating element is
+   * open.
+   * @see https://floating-ui.com/docs/useFocusTrap
+   */
   const useFocusTrap = function (_ref, _temp) {
     let {
       open,
+      onOpenChange,
       refs,
-      treeRef,
-      nodeRef,
-      onOpenChange
+      nodeId
     } = _ref;
     let {
+      enabled = true,
       initialContentFocus = 0,
@@ -891,6 +1108,8 @@ order = ['content'],
       inert = false,
-      scrollLock = 'auto'
+      scrollLock = false
     } = _temp === void 0 ? {} : _temp;
-    const indexRef = react.useRef(0);
-    const getFocusableElements = react.useCallback(() => {
+    const portalId = useFloatingPortalId();
+    const tree = useFloatingTree();
+    const indexRef = React$1.useRef(0);
+    const getFocusableElements = React$1.useCallback(() => {
       return order.map(type => {
@@ -914,4 +1133,4 @@ if (isHTMLElement(refs.reference.current) && type === 'reference') {
     }, [refs.floating, refs.reference, order]);
-    react.useEffect(() => {
-      if (inert) {
+    React$1.useEffect(() => {
+      if (inert || !enabled) {
         return;
@@ -937,11 +1156,16 @@ }
       } else if (modal && isHTMLElement(refs.reference.current)) {
-        refs.reference.current.focus();
+        refs.reference.current.focus({
+          preventScroll: true
+        });
       }
-    }, [getFocusableElements, open, inert, modal, initialContentFocus, refs.reference]);
-    react.useEffect(() => {
-      if (!modal) {
+    }, [getFocusableElements, open, inert, modal, initialContentFocus, enabled, refs.reference]);
+    React$1.useEffect(() => {
+      if (!modal || !enabled) {
         return;
       }
 
+      const doc = getDocument(refs.floating.current);
+
       if (!open) {
+        doc.removeEventListener('keydown', onKeyDown);
         indexRef.current = 0;
@@ -952,12 +1176,14 @@ return;
       function onKeyDown(event) {
-        if (treeRef != null && treeRef.current.nodes.filter(_ref2 => {
+        var _tree$nodesRef$curren;
+
+        if (tree != null && (_tree$nodesRef$curren = tree.nodesRef.current) != null && _tree$nodesRef$curren.filter(_ref2 => {
           let {
-            current
+            parentId
           } = _ref2;
-          return current.parentId === (nodeRef == null ? void 0 : nodeRef.current.id);
+          return parentId === nodeId;
         }).some(_ref3 => {
           let {
-            current
+            context
           } = _ref3;
-          return current.open;
+          return context == null ? void 0 : context.open;
         })) {
@@ -991,3 +1217,2 @@ return;
 
-      const doc = getDocument(refs.floating.current);
       doc.addEventListener('keydown', onKeyDown);
@@ -997,3 +1222,3 @@ return () => {
       };
-    }, [getFocusableElements, nodeRef, open, modal, treeRef, inert, refs.floating]);
+    }, [getFocusableElements, tree == null ? void 0 : tree.nodesRef, nodeId, open, modal, inert, enabled, refs.floating]);
 
@@ -1006,8 +1231,8 @@ function onBlur(event) {
       if (target && !((_refs$floating$curren3 = refs.floating.current) != null && _refs$floating$curren3.contains(target)) && isElement(refs.reference.current) && !refs.reference.current.contains(target)) {
-        onOpenChange == null ? void 0 : onOpenChange(false);
+        onOpenChange(false);
       }
     }
 
-    react.useEffect(() => {
-      if (!open || !modal) {
+    React$1.useEffect(() => {
+      if (!open || !modal || !enabled) {
         return;
@@ -1017,3 +1242,4 @@ }
       const doc = getDocument(refs.floating.current);
-      const nodes = doc.querySelectorAll('body > *:not(#floating-ui-root)');
+      const portal = doc.querySelector("#" + portalId);
+      const nodes = doc.querySelectorAll("body > *:not(#" + portalId + ")");
       nodes.forEach(node => {
@@ -1023,16 +1249,17 @@ node.setAttribute('aria-hidden', 'true');
       return () => {
-        nodes.forEach(node => {
-          node.removeAttribute('aria-hidden');
-        });
+        if ((portal == null ? void 0 : portal.firstElementChild) === refs.floating.current) {
+          nodes.forEach(node => {
+            node.removeAttribute('aria-hidden');
+          });
+        }
       };
-    }, [open, modal, scrollLock, refs.floating]);
+    }, [open, modal, scrollLock, portalId, enabled, refs.floating]);
     index(() => {
-      if (!open) {
+      if (!open || !enabled) {
         return;
       }
 
-      const applyScrollLock = scrollLock === true || scrollLock === 'auto' && modal;
       const doc = getDocument(refs.floating.current);
 
-      if (applyScrollLock) {
+      if (scrollLock) {
         var _doc$defaultView;
@@ -1046,3 +1273,3 @@
       return () => {
-        if (applyScrollLock) {
+        if (scrollLock) {
           doc.documentElement.style.overflow = '';
@@ -1052,4 +1279,8 @@ doc.body.style.paddingRight = '';
       };
-    }, [open, scrollLock]);
+    }, [open, scrollLock, enabled]);
 
+    if (!enabled) {
+      return {};
+    }
+
     if (modal) {
@@ -1094,10 +1325,18 @@ return {
 
-  const useListNavigation = (_ref, _ref2) => {
+  /**
+   * Adds focus-managed indexed navigation via arrow keys to a list of items
+   * within the floating element.
+   * @see https://floating-ui.com/docs/useListNavigation
+   */
+  const useListNavigation = function (_ref, _temp2) {
     let {
       open,
-      onOpenChange = () => {},
+      onOpenChange,
       refs
     } = _ref;
     let {
-      listRef,
+      enabled = true,
+      listRef = {
+        current: []
+      },
       activeIndex = null,
@@ -1108,16 +1347,19 @@ selectedIndex = null,
       rtl = false,
-      preventScroll = true,
       onNavigate = () => {}
-    } = _ref2;
-    const focusOnOpenRef = react.useRef(true);
-    const indexRef = react.useRef(selectedIndex != null ? selectedIndex : 0);
-    const keyRef = react.useRef('');
-    const focusItem = react.useCallback((listRef, indexRef) => {
+    } = _temp2 === void 0 ? {} : _temp2;
+    const focusOnOpenRef = React$1.useRef(true);
+    const indexRef = React$1.useRef(selectedIndex != null ? selectedIndex : 0);
+    const keyRef = React$1.useRef('');
+    const focusItem = React$1.useCallback((listRef, indexRef) => {
       var _listRef$current$inde3;
 
       (_listRef$current$inde3 = listRef.current[indexRef.current]) == null ? void 0 : _listRef$current$inde3.focus({
-        preventScroll
+        preventScroll: true
       });
-    }, [preventScroll]);
+    }, []);
     index(() => {
+      if (!enabled) {
+        return;
+      }
+
       if (selectedIndex != null) {
@@ -1131,4 +1373,8 @@ indexRef.current = selectedIndex;
       }
-    }, [open, selectedIndex, listRef, onNavigate, focusItem]);
+    }, [open, selectedIndex, listRef, onNavigate, focusItem, enabled]);
     index(() => {
+      if (!enabled) {
+        return;
+      }
+
       if (open && activeIndex != null) {
@@ -1139,5 +1385,5 @@ indexRef.current = activeIndex;
       }
-    }, [open, activeIndex, listRef, onNavigate, focusItem]);
+    }, [open, activeIndex, listRef, onNavigate, focusItem, enabled]);
     index(() => {
-      if (selectedIndex != null) {
+      if (selectedIndex != null || !enabled) {
         return;
@@ -1158,4 +1404,8 @@ }
       keyRef.current = '';
-    }, [open, listRef, selectedIndex, onNavigate, focusItem]);
+    }, [open, listRef, selectedIndex, onNavigate, focusItem, enabled]);
     index(() => {
+      if (!enabled) {
+        return;
+      }
+
       if (!open && selectedIndex != null) {
@@ -1165,22 +1415,36 @@ var _refs$reference$curre;
         (_refs$reference$curre = refs.reference.current) == null ? void 0 : _refs$reference$curre.focus({
-          preventScroll
+          preventScroll: true
         });
       }
-    }, [refs.reference, preventScroll, selectedIndex, open]);
+    }, [refs.reference, selectedIndex, open, enabled]);
     index(() => {
+      if (!enabled) {
+        return;
+      }
+
       if (!open) {
         focusOnOpenRef.current = true;
+        onNavigate(null);
       }
-    }, [open]);
+    }, [open, enabled]);
+
+    function pointerCheck(event) {
+      // undefined or '' depending on the browser
+      focusOnOpenRef.current = !event.pointerType;
+    }
+
+    if (!enabled) {
+      return {};
+    }
+
     return {
       reference: {
-        onPointerDown(event) {
-          // undefined or '' depending on the browser
-          focusOnOpenRef.current = !event.pointerType;
-        },
+        onPointerEnter: pointerCheck,
+        onPointerDown: pointerCheck,
 
         onKeyDown(event) {
+          focusOnOpenRef.current = true;
           keyRef.current = event.key;
 
-          if (refs.reference.current instanceof Element && refs.reference.current.tagName !== 'BUTTON') {
+          if (isElement(refs.reference.current) && refs.reference.current.tagName !== 'BUTTON') {
             if (event.key === 'Enter' || event.key === ' ') {
@@ -1197,3 +1461,2 @@ onOpenChange(true);
               onNavigate(indexRef.current);
-              focusItem(listRef, indexRef);
             }
@@ -1217,3 +1480,2 @@
             onNavigate(indexRef.current);
-            focusItem(listRef, indexRef);
           }
@@ -1298,15 +1560,39 @@ }
 
-  const useTypeahead = (context, _ref) => {
+  /**
+   * Provides a transient string via a callback as the user types, often used in
+   * tandem with `useListNavigation()`.
+   * @see https://floating-ui.com/docs/useTypeahead
+   */
+  const useTypeahead = function (_ref, _temp) {
     let {
-      listRef,
-      onMatch,
+      open
+    } = _ref;
+    let {
+      enabled = true,
+      listRef = {
+        current: []
+      },
+      onMatch = () => {},
+      onFind = null,
       debounceMs = 500,
       ignoreKeys = []
-    } = _ref;
-    const timeoutIdRef = react.useRef();
-    const stringRef = react.useRef('');
-    const prevIndexRef = react.useRef(null);
-    const matchIndexRef = react.useRef(null);
+    } = _temp === void 0 ? {} : _temp;
+    const timeoutIdRef = React$1.useRef();
+    const stringRef = React$1.useRef('');
+    const prevIndexRef = React$1.useRef(null);
+    const matchIndexRef = React$1.useRef(null);
+    index(() => {
+      if (open) {
+        clearTimeout(timeoutIdRef.current);
+        prevIndexRef.current = null;
+        matchIndexRef.current = null;
+        stringRef.current = '';
+      }
+    }, [open]);
 
     function onKeyDown(event) {
+      if (!event.currentTarget.contains(getDocument(event.currentTarget).activeElement)) {
+        return;
+      }
+
       if (event.key === ' ' && stringRef.current.length > 0) {
@@ -1321,2 +1607,16 @@ event.preventDefault();
         return;
+      } // Bail out if the list contains a word like "llama" or "aaron". TODO:
+      // allow it in this case, too.
+
+
+      const allowRapidSuccessionOfFirstLetter = listContent.every(text => {
+        var _text$, _text$2;
+
+        return text ? ((_text$ = text[0]) == null ? void 0 : _text$.toLowerCase()) !== ((_text$2 = text[1]) == null ? void 0 : _text$2.toLowerCase()) : true;
+      }); // Allows the user to cycle through items that start with the same letter
+      // in rapid succession
+
+      if (allowRapidSuccessionOfFirstLetter && stringRef.current === event.key) {
+        stringRef.current = '';
+        prevIndexRef.current = matchIndexRef.current;
       }
@@ -1331,3 +1631,3 @@
       const prevIndex = prevIndexRef.current;
-      const str = [...listContent.slice((prevIndex != null ? prevIndex : -1) + 1), ...listContent.slice(0, prevIndex != null ? prevIndex : 0)].find(txt => (txt == null ? void 0 : txt.toLowerCase().indexOf(stringRef.current)) === 0);
+      const str = [...listContent.slice((prevIndex != null ? prevIndex : 0) + 1), ...listContent.slice(0, prevIndex != null ? prevIndex : 0)].find(text => onFind ? onFind(text, stringRef.current) : (text == null ? void 0 : text.toLowerCase().indexOf(stringRef.current)) === 0);
       const index = str ? listContent.indexOf(str) : -1;
@@ -1341,2 +1641,6 @@
 
+    if (!enabled) {
+      return {};
+    }
+
     return {
@@ -1355,15 +1659,11 @@ reference: {
       open = false,
-      onOpenChange,
+      onOpenChange = () => {},
       placement,
       middleware,
       strategy,
-      treeRef,
-      nodeRef
+      nodeId
     } = _temp === void 0 ? {} : _temp;
-    index(() => {
-      if (nodeRef) {
-        nodeRef.current.open = open;
-      }
-    });
-    const dataRef = react.useRef({});
+    const tree = useFloatingTree();
+    const dataRef = React$1.useRef({});
+    const events = React$1.useState(() => createPubSub())[0];
     const floating = reactDom.useFloating({
@@ -1374,10 +1674,17 @@ placement,
     });
-    const context = react.useMemo(() => ({ ...floating,
-      treeRef,
-      nodeRef,
+    const context = React$1.useMemo(() => ({ ...floating,
+      dataRef,
+      nodeId,
+      events,
       open,
-      onOpenChange,
-      dataRef
-    }), [floating, nodeRef, treeRef, open, onOpenChange]);
-    return react.useMemo(() => ({
+      onOpenChange
+    }), [floating, dataRef, nodeId, events, open, onOpenChange]);
+    index(() => {
+      const node = tree == null ? void 0 : tree.nodesRef.current.find(node => node.id === nodeId);
+
+      if (node) {
+        node.context = context;
+      }
+    });
+    return React$1.useMemo(() => ({
       context,
@@ -1388,15 +1695,20 @@ ...floating
 
-  exports.FloatingGroup = FloatingGroup;
+  exports.FloatingDelayGroup = FloatingDelayGroup;
+  exports.FloatingNode = FloatingNode;
+  exports.FloatingOverlay = FloatingOverlay;
   exports.FloatingPortal = FloatingPortal;
-  exports.createTree = createTree;
+  exports.FloatingTree = FloatingTree;
   exports.safePolygon = safePolygon;
   exports.useAria = useAria;
   exports.useClick = useClick;
+  exports.useDelayGroup = useDelayGroup;
+  exports.useDelayGroupContext = useDelayGroupContext;
   exports.useDismiss = useDismiss;
   exports.useFloating = useFloating;
   exports.useFloatingId = useFloatingId;
+  exports.useFloatingNodeId = useFloatingNodeId;
+  exports.useFloatingParentNodeId = useFloatingParentNodeId;
+  exports.useFloatingTree = useFloatingTree;
   exports.useFocus = useFocus;
   exports.useFocusTrap = useFocusTrap;
-  exports.useGroup = useGroup;
-  exports.useGroupContext = useGroupContext;
   exports.useHover = useHover;
@@ -1403,0 +1715,0 @@ exports.useInteractions = useInteractions;

dist/floating-ui.react-dom-interactions.min.js

@@ -1,1 +0,1 @@
-!function(e,r){"object"==typeof exports&&"undefined"!=typeof module?r(exports,require("react"),require("@floating-ui/react-dom"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","@floating-ui/react-dom","react-dom"],r):r((e="undefined"!=typeof globalThis?globalThis:e||self).FloatingUIReactDOM={},e.React,e.FloatingUIReactDOM,e.ReactDOM)}(this,(function(e,r,t,n){"use strict";var o="undefined"!=typeof document?r.useLayoutEffect:r.useEffect;function u(e){return Object.entries(null!=e?e:{}).reduce(((e,r)=>{let[t,n]=r;return e[t]=[n],e}),{})}function c(e,r,t){const n={reference:"reference"===t?u(e):{},floating:"floating"===t?u(e):{}};return r.forEach((e=>{var r;const o=null!=(r=null==e?void 0:e[t])?r:{};Object.keys(o).forEach((e=>{var r;"function"==typeof o[e]&&(null==n[t][e]&&(n[t][e]=[]),null==(r=n[t][e])||r.push(o[e]))}))})),{..."floating"===t&&{tabIndex:-1},...e,...r.reduce(((e,r)=>(Object.assign(e,null==r?void 0:r[t]),e)),{}),...Object.entries(n[t]).reduce(((e,r)=>{let[t,n]=r;return 0===t.indexOf("on")&&(e[t]=function(){for(var e=arguments.length,r=new Array(e),t=0;t<e;t++)r[t]=arguments[t];n.forEach((e=>e(...r)))}),e}),{})}}var i={exports:{}},l=function(e,r,t,n){var o=e[0],u=e[1],c=!1;void 0===t&&(t=0),void 0===n&&(n=r.length);for(var i=(n-t)/2,l=0,a=i-1;l<i;a=l++){var f=r[t+2*l+0],s=r[t+2*l+1],d=r[t+2*a+0],g=r[t+2*a+1];s>u!=g>u&&o<(d-f)*(u-s)/(g-s)+f&&(c=!c)}return c},a=function(e,r,t,n){var o=e[0],u=e[1],c=!1;void 0===t&&(t=0),void 0===n&&(n=r.length);for(var i=n-t,l=0,a=i-1;l<i;a=l++){var f=r[l+t][0],s=r[l+t][1],d=r[a+t][0],g=r[a+t][1];s>u!=g>u&&o<(d-f)*(u-s)/(g-s)+f&&(c=!c)}return c};i.exports=function(e,r,t,n){return r.length>0&&Array.isArray(r[0])?a(e,r,t,n):l(e,r,t,n)},i.exports.nested=a,i.exports.flat=l;var f=i.exports;function s(e){var r;return null!=(r=null==e?void 0:e.ownerDocument)?r:document}function d(e){var r;return null!=(r=s(e).defaultView)?r:window}function g(e){return!!e&&e instanceof d(e).Element}function p(e){return!!e&&e instanceof d(e).HTMLElement}function v(e,r){return"number"==typeof e?e:e[r]}const h=r.createContext({delay:1e3,initialDelay:1e3,currentId:null,setCurrentId:()=>{},setState:()=>{}}),m=()=>{const e=r.useContext(h);if(!e)throw new Error("useGroupContext() must be used within a <FloatingGroup />");return e};let y=0;function w(){return"floating-ui-"+y++}function b(){return r.useMemo(w,[])}function E(e){e.preventDefault(),e.stopPropagation()}function R(e,r){let{startingIndex:t=-1,decrement:n=!1}=void 0===r?{}:r,o=t;do{var u,c;o+=n?-1:1}while(null!=(u=e.current[o])&&u.hasAttribute("disabled")||"true"===(null==(c=e.current[o])?void 0:c.getAttribute("aria-disabled")));return-1===o?0:o}e.FloatingGroup=e=>{let{children:t,delay:n}=e;const[o,u]=r.useState({delay:n,initialDelay:n,currentId:null}),c=r.useCallback((e=>{u((r=>({...r,currentId:e})))}),[]);return React.createElement(h.Provider,{value:{...o,setState:u,setCurrentId:c}},t)},e.FloatingPortal=function(e){let{children:t}=e;const[u,c]=r.useState(!1),i=r.useRef(null);return o((()=>{const e=document.getElementById("floating-ui-root");e?i.current=e:(i.current=document.createElement("div"),i.current.id="floating-ui-root");const r=i.current;return document.body.contains(r)||document.body.appendChild(r),c(!0),()=>{document.body.contains(r)&&document.body.removeChild(r)}}),[]),u&&i.current?n.createPortal(t,i.current):null},e.createTree=function(e){const r=new Map;return{nodes:e,emit(e,t){var n;null==(n=r.get(e))||n.forEach((e=>e(t)))},on(e,t){r.set(e,[...r.get(e)||[],t])},off(e,t){r.set(e,(r.get(e)||[]).filter((e=>e!==t)))}}},e.safePolygon=function(e){let r,{timeout:t=0,debug:n=null}=void 0===e?{}:e;return e=>{let{x:n,y:o,placement:u,refs:c,onClose:i,treeRef:l,nodeRef:a}=e;return function(e){var s;if("touch"===e.pointerType)return;const{target:d,clientX:p,clientY:v}=e,h=d;if("pointermove"===e.type&&g(c.reference.current)&&c.reference.current.contains(h)||null!=(s=c.floating.current)&&s.contains(h))return;if(null!=l&&l.current.nodes.filter((e=>{let{current:r}=e;return r.parentId===(null==a?void 0:a.current.id)})).some((e=>{let{current:r}=e;return r.open})))return;if(!c.reference.current||!c.floating.current||null==u||null==n||null==o)return;const m=c.reference.current.getBoundingClientRect(),y=c.floating.current.getBoundingClientRect(),w=u.split("-")[0],b=n>y.right-y.width/2,E=o>y.bottom-y.height/2;switch(w){case"top":if(p>=y.left&&p<=y.right&&v>=y.bottom&&v<=m.top)return;break;case"bottom":if(p>=y.left&&p<=y.right&&v>=m.bottom&&v<=y.top)return;break;case"left":if(p>=y.right&&p<=m.left&&v>=y.left&&v<=y.right)return;break;case"right":if(p>=y.right&&p<=m.left&&v>=y.right&&v<=m.left)return}const R=function(e){let[r,t]=e;switch(w){case"top":{const e=[r-(b?-1:1),t+1],n=[r-(b?-1:1),t-1],o=[[y.left,b||y.width>m.width?y.bottom:y.top],[y.right,b?y.width>m.width?y.bottom:y.top:y.bottom]];return y.width<m.width?b?[e,...o,n]:[e,n,...o]:[e,...o]}case"bottom":{const e=[r-(b?-1:1),t-1],n=[r-(b?-1:1),t+1],o=[[y.left,b||y.width>m.width?y.top:y.bottom],[y.right,b?y.width>m.width?y.top:y.bottom:y.top]];return y.width<m.width?b?[e,...o,n]:[e,n,...o]:[e,...o]}case"left":{const e=[r+1,t-(E?-1:1)],n=[r-1,t-(E?-1:1)],o=[[E||y.height>m.height?y.right-1:y.left,y.top],[E?y.height>m.height?y.right-1:y.left:y.right-1,y.bottom]];return y.height<m.height?E?[e,...o,n]:[e,n,...o]:[e,...o]}case"right":{const e=[r-1,t-(E?-1:1)],n=[r+1,t-(E?-1:1)],o=[[E||y.height>m.height?y.left+1:y.right,y.top],[E?y.height>m.height?y.left+1:y.right:y.left+1,y.bottom]];return y.height<m.height?E?[e,...o,n]:[e,n,...o]:[e,...o]}}}([n,o]);f([p,v],R)?t&&(r=setTimeout(i,t)):(clearTimeout(r),i())}}},e.useAria=function(e,r){let{open:t}=e,{role:n="dialog",titleId:o,descriptionId:u}=void 0===r?{}:r;const c=b(),i={id:c,role:n};return"tooltip"===n?{reference:{"aria-describedby":t?c:void 0},floating:i}:{reference:{"aria-expanded":t?"true":"false","aria-haspopup":n,"aria-controls":t?c:void 0,..."listbox"===n&&{role:"combobox"}},floating:{...i,..."dialog"===n&&{"aria-labelledby":o,"aria-describedby":u}}}},e.useClick=e=>{let{open:r,onOpenChange:t=(()=>{}),dataRef:n}=e;return{reference:{onClick(e){var o;r?"click"===(null==(o=n.current.openEvent)?void 0:o.type)||n.current.hoveredThenClicked?(n.current.hoveredThenClicked=!1,t(!1)):n.current.hoveredThenClicked=!0:(n.current.openEvent=e.nativeEvent,t(!0))}}}},e.useDismiss=function(e,n){let{onOpenChange:o=(()=>{}),refs:u,open:c,treeRef:i,nodeRef:l,dataRef:a}=e,{escapeKey:f=!0,outsidePointerDown:d=!0,referencePointerDown:v=!1,ancestorScroll:h=!1}=void 0===n?{}:n;const m=r.useCallback((()=>{p(u.reference.current)&&u.reference.current.focus()}),[u.reference.current]);return r.useEffect((()=>{function e(){o(!1),m()}const r=null==i?void 0:i.current;return null==r||r.on("close",e),()=>{null==r||r.off("close",e)}}),[i,o,m]),r.useEffect((()=>{if(!c)return;function e(){return null==i?void 0:i.current.nodes.filter((e=>{let{current:r}=e;return r.parentId===(null==l?void 0:l.current.id)})).some((e=>{let{current:r}=e;return r.open}))}function r(r){"Escape"!==r.key||e()||(a.current.dismiss=!0,i?i.current.emit("close"):(o(!1),m()))}function n(r){var t;null!=(t=u.floating.current)&&t.contains(r.target)||g(u.reference.current)&&u.reference.current.contains(r.target)||e()||(i?i.current.emit("close"):(o(!1),m()))}function p(){o(!1)}const v=s(u.floating.current);f&&v.addEventListener("keydown",r),d&&v.addEventListener("pointerdown",n);const y=h?[...g(u.reference.current)?t.getOverflowAncestors(u.reference.current):[],...g(u.floating.current)?t.getOverflowAncestors(u.floating.current):[]]:[];return y.forEach((e=>e.addEventListener("scroll",p,{passive:!0}))),()=>{f&&v.removeEventListener("keydown",r),d&&v.removeEventListener("pointerdown",n),y.forEach((e=>e.removeEventListener("scroll",p)))}}),[f,d,i,l,c,o,a,m,h,u.floating,u.reference]),{reference:{onPointerDown(){v&&(a.current.dismiss=!0,o(!1))}}}},e.useFloating=function(e){let{open:n=!1,onOpenChange:u,placement:c,middleware:i,strategy:l,treeRef:a,nodeRef:f}=void 0===e?{}:e;o((()=>{f&&(f.current.open=n)}));const s=r.useRef({}),d=t.useFloating({placement:c,middleware:i,strategy:l}),g=r.useMemo((()=>({...d,treeRef:a,nodeRef:f,open:n,onOpenChange:u,dataRef:s})),[d,f,a,n,u]);return r.useMemo((()=>({context:g,...d})),[d,g])},e.useFloatingId=b,e.useFocus=function(e,t){let{open:n,onOpenChange:u=(()=>{}),dataRef:c,refs:i}=e,{keyboardOnly:l=!0}=void 0===t?{}:t;const a=r.useRef();return o((()=>{n||(a.current=void 0)})),{reference:{onPointerDown(e){let{pointerType:r}=e;a.current=r},onFocus(e){var r,t;l&&a.current||"focus"===e.type&&"mousedown"===c.current.openEvent&&g(i.reference.current)&&null!=(r=i.reference.current)&&r.contains(null==(t=c.current.openEvent)?void 0:t.target)||c.current.dismiss||(c.current.openEvent=e.nativeEvent,u(!0))},onBlur(e){var r;const t=e.relatedTarget;null!=(r=i.floating.current)&&r.contains(t)||g(i.reference.current)&&i.reference.current.contains(t)||(c.current.dismiss=!1,c.current.hoveredThenClicked=!1,u(!1))}}}},e.useFocusTrap=function(e,t){let{open:n,refs:u,treeRef:c,nodeRef:i,onOpenChange:l}=e,{initialContentFocus:a=0,order:f=["content"],modal:d=!0,inert:v=!1,scrollLock:h="auto"}=void 0===t?{}:t;const m=r.useRef(0),y=r.useCallback((()=>f.map((e=>{return p(u.reference.current)&&"reference"===e?u.reference.current:u.floating.current&&"floating"===e?u.floating.current:"content"===e?Array.from(null!=(r=null==(t=u.floating.current)?void 0:t.querySelectorAll("a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,*[tabindex],*[contenteditable]"))?r:[]):null;var r,t})).filter(Boolean).flat()),[u.floating,u.reference,f]);function w(e){var r;const t=e.relatedTarget;!t||null!=(r=u.floating.current)&&r.contains(t)||!g(u.reference.current)||u.reference.current.contains(t)||null==l||l(!1)}return r.useEffect((()=>{if(!v)if(n){const t=y();var e;if("number"==typeof a)null==(e=t[a])||e.focus({preventScroll:!0});else if(a.current){var r;null==(r=t.find((e=>e===a.current)))||r.focus({preventScroll:!0})}}else d&&p(u.reference.current)&&u.reference.current.focus()}),[y,n,v,d,a,u.reference]),r.useEffect((()=>{if(!d)return;if(!n)return void(m.current=0);function e(e){if((null==c||!c.current.nodes.filter((e=>{let{current:r}=e;return r.parentId===(null==i?void 0:i.current.id)})).some((e=>{let{current:r}=e;return r.open})))&&"Tab"===e.key){var r;if(e.preventDefault(),e.stopPropagation(),v)return;const t=y();e.shiftKey?m.current=0===m.current?t.length-1:m.current-1:m.current=m.current===t.length-1?0:m.current+1,null==(r=t[m.current])||r.focus({preventScroll:!0})}}const r=s(u.floating.current);return r.addEventListener("keydown",e),()=>{r.removeEventListener("keydown",e)}}),[y,i,n,d,c,v,u.floating]),r.useEffect((()=>{if(!n||!d)return;const e=s(u.floating.current).querySelectorAll("body > *:not(#floating-ui-root)");return e.forEach((e=>{e.setAttribute("aria-hidden","true")})),()=>{e.forEach((e=>{e.removeAttribute("aria-hidden")}))}}),[n,d,h,u.floating]),o((()=>{if(!n)return;const e=!0===h||"auto"===h&&d,r=s(u.floating.current);if(e){var t;const e=(null!=(t=r.defaultView)?t:window).innerWidth-r.documentElement.offsetWidth;r.documentElement.style.overflow="hidden",r.body.style.paddingRight=e+"px"}return()=>{e&&(r.documentElement.style.overflow="",r.body.style.paddingRight="")}}),[n,h]),d?{floating:{"aria-modal":"true"}}:{reference:{onBlur:w},floating:{onBlur:w}}},e.useGroup=(e,t)=>{let{open:n,onOpenChange:o}=e,{id:u}=t;const{currentId:c,initialDelay:i,setState:l}=m();r.useEffect((()=>{c&&o&&(l((e=>({...e,delay:{open:0,close:v(i,"close")}}))),c!==u&&o(!1))}),[u,o,l,c,i]),r.useEffect((()=>{!n&&c===u&&o&&(o(!1),l((e=>({...e,delay:i,currentId:null}))))}),[n,l,c,u,o,i])},e.useGroupContext=m,e.useHover=function(e,t){let{delay:n=0,handleLeave:u=null,mouseOnly:c=!1,pointerRestMs:i=0}=void 0===t?{}:t;const{onOpenChange:l=(()=>{}),open:a,dataRef:f,refs:d}=e,g=r.useRef(null),p=r.useRef(!1),h=r.useRef(),m=r.useRef();o((()=>{if(!u)return;if(!a)return void(p.current=!1);function e(){var e;"pointerover"===(null==(e=g.current)?void 0:e.type)&&l(!1)}const r=s(d.floating.current).documentElement;return r.addEventListener("pointerleave",e),()=>{r.removeEventListener("pointerleave",e)}}),[a,l,u]);const y=r.useRef();return{reference:{onPointerMove(){0===i||a||(clearTimeout(y.current),y.current=setTimeout((()=>{f.current.dismiss||l(!0)}),i))},onPointerEnter(e){c&&"mouse"!==e.pointerType||(g.current=e.nativeEvent,n?(clearTimeout(h.current),h.current=setTimeout((()=>{f.current.dismiss||l(!0)}),v(n,"open"))):l(!0))},onPointerLeave(r){var t;if(p.current||"click"===(null==(t=g.current)?void 0:t.type))return;const o=s(d.floating.current);if(u)return clearTimeout(h.current),m.current&&o.removeEventListener("pointermove",m.current),m.current=u({...e,x:r.clientX,y:r.clientY,onClose(){m.current&&o.removeEventListener("pointermove",m.current),l(!1)}}),void o.addEventListener("pointermove",m.current);f.current.dismiss=!1,n?(clearTimeout(y.current),clearTimeout(h.current),h.current=setTimeout((()=>l(!1)),v(n,"close"))):(p.current=!1,l(!1))}}}},e.useInteractions=function(e){return void 0===e&&(e=[]),{getReferenceProps:r=>c(r,e,"reference"),getFloatingProps:r=>c(r,e,"floating")}},e.useListNavigation=(e,t)=>{let{open:n,onOpenChange:u=(()=>{}),refs:c}=e,{listRef:i,activeIndex:l=null,selectedIndex:a=null,loop:f=!1,nested:s=!1,rtl:d=!1,preventScroll:g=!0,onNavigate:v=(()=>{})}=t;const h=r.useRef(!0),m=r.useRef(null!=a?a:0),y=r.useRef(""),w=r.useCallback(((e,r)=>{var t;null==(t=e.current[r.current])||t.focus({preventScroll:g})}),[g]);return o((()=>{null!=a&&(m.current=a),n&&h.current&&(v(m.current),w(i,m))}),[n,a,i,v,w]),o((()=>{n&&null!=l&&(m.current=l,v(m.current),w(i,m))}),[n,l,i,v,w]),o((()=>{null==a&&(n&&("ArrowDown"===y.current||"ArrowUp"===y.current||h.current&&(" "===y.current||"Enter"===y.current))&&(m.current="ArrowUp"===y.current?R(i,{startingIndex:i.current.length,decrement:!0}):R(i),v(m.current),w(i,m)),y.current="")}),[n,i,a,v,w]),o((()=>{var e;n||null==a||(null==(e=c.reference.current)||e.focus({preventScroll:g}))}),[c.reference,g,a,n]),o((()=>{n||(h.current=!0)}),[n]),{reference:{onPointerDown(e){h.current=!e.pointerType},onKeyDown(e){y.current=e.key,c.reference.current instanceof Element&&"BUTTON"!==c.reference.current.tagName&&("Enter"!==e.key&&" "!==e.key||u(!0)),s?e.key===(d?"ArrowLeft":"ArrowRight")&&(m.current=R(i),E(e),u(!0),v(m.current),w(i,m)):"ArrowDown"!==e.key&&"ArrowUp"!==e.key||(m.current=null==a?"ArrowDown"===e.key?R(i):R(i,{startingIndex:i.current.length,decrement:!0}):a,E(e),u(!0),v(m.current),w(i,m))}},floating:{onKeyDown(e){if(s&&e.key===(d?"ArrowRight":"ArrowLeft"))return E(e),u(!1),void(p(c.reference.current)&&c.reference.current.focus());const r=m.current,t=R(i),n=R(i,{decrement:!0,startingIndex:i.current.length});if("Home"===e.key&&(m.current=t,v(m.current),w(i,m)),"End"===e.key&&(m.current=n,v(m.current),w(i,m)),"ArrowDown"===e.key||"ArrowUp"===e.key){if(E(e),e.currentTarget.ownerDocument.activeElement===e.currentTarget&&null!=a)return m.current=a,v(m.current),void w(i,m);"ArrowDown"===e.key?m.current=f?r===n?t:R(i,{startingIndex:r}):Math.min(n,R(i,{startingIndex:r})):m.current=f?r===t?n:R(i,{startingIndex:r,decrement:!0}):Math.max(t,R(i,{startingIndex:r,decrement:!0})),v(m.current),w(i,m)}}}}},e.useTypeahead=(e,t)=>{let{listRef:n,onMatch:o,debounceMs:u=500,ignoreKeys:c=[]}=t;const i=r.useRef(),l=r.useRef(""),a=r.useRef(null),f=r.useRef(null);function s(e){" "===e.key&&l.current.length>0&&(e.preventDefault(),e.stopPropagation());const r=n.current;if(null==r||["Home","End","Escape","Enter","Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight",...c].includes(e.key))return;l.current+=e.key,clearTimeout(i.current),i.current=setTimeout((()=>{l.current="",a.current=f.current}),u);const t=a.current,s=[...r.slice((null!=t?t:-1)+1),...r.slice(0,null!=t?t:0)].find((e=>0===(null==e?void 0:e.toLowerCase().indexOf(l.current)))),d=s?r.indexOf(s):-1;-1!==d&&(o(d),f.current=d)}return{reference:{onKeyDown:s},floating:{onKeyDown:s}}},Object.keys(t).forEach((function(r){"default"===r||e.hasOwnProperty(r)||Object.defineProperty(e,r,{enumerable:!0,get:function(){return t[r]}})})),Object.defineProperty(e,"__esModule",{value:!0})}));
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("@floating-ui/react-dom"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","@floating-ui/react-dom","react-dom"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).FloatingUIReactDOM={},e.React,e.FloatingUIReactDOM,e.ReactDOM)}(this,(function(e,n,t,r){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var u=o(n),c="undefined"!=typeof document?n.useLayoutEffect:n.useEffect;function l(){const e=new Map;return{emit(n,t){var r;null==(r=e.get(n))||r.forEach((e=>e(t)))},on(n,t){e.set(n,[...e.get(n)||[],t])},off(n,t){e.set(n,(e.get(n)||[]).filter((e=>e!==t)))}}}let i=0;function a(){return"floating-ui-"+i++}function s(){return n.useMemo(a,[])}const f=n.createContext(null),d=n.createContext(null),v=()=>{var e,t;return null!=(e=null==(t=n.useContext(f))?void 0:t.id)?e:null},g=()=>n.useContext(d);function p(e){return Object.entries(null!=e?e:{}).reduce(((e,n)=>{let[t,r]=n;return e[t]=[r],e}),{})}function m(e,n,t){const r={reference:"reference"===t?p(e):{},floating:"floating"===t?p(e):{}};return n.forEach((e=>{var n;const o=null!=(n=null==e?void 0:e[t])?n:{};Object.keys(o).forEach((e=>{var n;"function"==typeof o[e]&&(null==r[t][e]&&(r[t][e]=[]),null==(n=r[t][e])||n.push(o[e]))}))})),{..."floating"===t&&{tabIndex:-1},...e,...n.reduce(((e,n)=>(Object.assign(e,null==n?void 0:n[t]),e)),{}),...Object.entries(r[t]).reduce(((e,n)=>{let[t,r]=n;return 0===t.indexOf("on")&&(e[t]=function(){for(var e=arguments.length,n=new Array(e),t=0;t<e;t++)n[t]=arguments[t];r.forEach((e=>e(...n)))}),e}),{})}}var h={exports:{}},y=function(e,n,t,r){var o=e[0],u=e[1],c=!1;void 0===t&&(t=0),void 0===r&&(r=n.length);for(var l=(r-t)/2,i=0,a=l-1;i<l;a=i++){var s=n[t+2*i+0],f=n[t+2*i+1],d=n[t+2*a+0],v=n[t+2*a+1];f>u!=v>u&&o<(d-s)*(u-f)/(v-f)+s&&(c=!c)}return c},b=function(e,n,t,r){var o=e[0],u=e[1],c=!1;void 0===t&&(t=0),void 0===r&&(r=n.length);for(var l=r-t,i=0,a=l-1;i<l;a=i++){var s=n[i+t][0],f=n[i+t][1],d=n[a+t][0],v=n[a+t][1];f>u!=v>u&&o<(d-s)*(u-f)/(v-f)+s&&(c=!c)}return c};h.exports=function(e,n,t,r){return n.length>0&&Array.isArray(n[0])?b(e,n,t,r):y(e,n,t,r)},h.exports.nested=b,h.exports.flat=y;var E=h.exports;function w(e){var n;return null!=(n=null==e?void 0:e.ownerDocument)?n:document}function x(e){var n;return null!=(n=w(e).defaultView)?n:window}function k(e){return!!e&&e instanceof x(e).Element}function R(e){return!!e&&e instanceof x(e).HTMLElement}function C(e,n){var t;let r=null!=(t=null==e?void 0:e.nodesRef.current.filter((e=>{var t;return e.parentId===n&&(null==(t=e.context)?void 0:t.open)})))?t:[],o=r;for(;o.length;){var u;o=null!=(u=null==e?void 0:e.nodesRef.current.filter((e=>{var n;return null==(n=o)?void 0:n.some((n=>{var t;return e.parentId===n.id&&(null==(t=e.context)?void 0:t.open)}))})))?u:[],r=r.concat(o)}return r}const T="floating-ui-root",I=n.createContext(T);function O(){return O=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e},O.apply(this,arguments)}const D=n.forwardRef((function(e,n){return React.createElement("div",O({ref:n},e,{style:{position:"fixed",top:0,right:0,bottom:0,left:0,width:"100%",height:"100%",...e.style}}))}));function A(e,n){return"number"==typeof e?e:null==e?void 0:e[n]}const L=n.createContext({delay:1e3,initialDelay:1e3,currentId:null,setCurrentId:()=>{},setState:()=>{}}),P=()=>n.useContext(L);function F(e){e.preventDefault(),e.stopPropagation()}function S(e,n){let{startingIndex:t=-1,decrement:r=!1}=void 0===n?{}:n,o=t;do{var u,c;o+=r?-1:1}while(null!=(u=e.current[o])&&u.hasAttribute("disabled")||"true"===(null==(c=e.current[o])?void 0:c.getAttribute("aria-disabled")));return-1===o?0:o}e.FloatingDelayGroup=e=>{let{children:t,delay:r}=e;const[o,u]=n.useState({delay:r,initialDelay:r,currentId:null}),c=n.useCallback((e=>{u((n=>({...n,currentId:e})))}),[]);return React.createElement(L.Provider,{value:{...o,setState:u,setCurrentId:c}},t)},e.FloatingNode=e=>{let{children:n,id:t}=e;const r=v();return React.createElement(f.Provider,{value:{id:t,parentId:r}},n)},e.FloatingOverlay=D,e.FloatingPortal=e=>{let{children:t,id:o=T}=e;const[l,i]=n.useState(!1),a=n.useRef(null);return c((()=>{const e=document.getElementById(o);e?a.current=e:(a.current=document.createElement("div"),a.current.id=o);const n=a.current;document.body.contains(n)||document.body.appendChild(n),i(!0)}),[]),l&&a.current?u.default.createElement(I.Provider,{value:o},r.createPortal(t,a.current)):null},e.FloatingTree=e=>{let{children:t}=e;const r=n.useRef([]),o=n.useCallback((e=>{r.current=[...r.current,e]}),[]),u=n.useCallback((e=>{r.current=r.current.filter((n=>n!==e))}),[]);return React.createElement(d.Provider,{value:{nodesRef:r,addNode:o,removeNode:u,events:l()}},t)},e.safePolygon=function(e){let n,{timeout:t=0,debug:r=null}=void 0===e?{}:e;return e=>{let{x:o,y:u,placement:c,refs:l,onClose:i,nodeId:a,tree:s}=e;return function(e){var f;if("touch"===e.pointerType)return;const{target:d,clientX:v,clientY:g}=e,p=d;if("pointermove"===e.type&&k(l.reference.current)&&l.reference.current.contains(p)||null!=(f=l.floating.current)&&f.contains(p))return;if(s&&C(s,a).some((e=>{let{context:n}=e;return null==n?void 0:n.open})))return;if(!l.reference.current||!l.floating.current||null==c||null==o||null==u)return;const m=l.reference.current.getBoundingClientRect(),h=l.floating.current.getBoundingClientRect(),y=c.split("-")[0],b=o>h.right-h.width/2,w=u>h.bottom-h.height/2;switch(y){case"top":if(v>=h.left&&v<=h.right&&g>=h.bottom&&g<=m.top)return;break;case"bottom":if(v>=h.left&&v<=h.right&&g>=m.bottom&&g<=h.top)return;break;case"left":if(v>=h.right&&v<=m.left&&g>=h.left&&g<=h.right)return;break;case"right":if(v>=h.right&&v<=m.left&&g>=h.right&&g<=m.left)return}function x(e){let[n,t]=e;const r=h.width>m.width,o=h.height>m.height;switch(y){case"top":{const e=[r?n:b?n+1:n-1,t+1],o=[r?n:b?n-1:n+1,t+1],u=[[h.left,b||r?h.bottom-1:h.top],[h.right,b?r?h.bottom-1:h.top:h.bottom-1]];return b?[e,o,...u]:[e,...u,o]}case"bottom":{const e=[r?n:b?n+1:n-1,t-1],o=[r?n:b?n-1:n+1,t-1],u=[[h.left,b||r?h.top+1:h.bottom],[h.right,b?r?h.top+1:h.bottom:h.top+1]];return b?[e,o,...u]:[e,...u,o]}case"left":{const e=[n+1,o?t:w?t-1:t+1],r=[n+1,o?t:w?t+1:t-1],u=[[w||o?h.right-1:h.left,h.top],[w?o?h.right-1:h.left:h.right-1,h.bottom]];return w?[e,...u,r]:[...u,e,r]}case"right":{const e=[n-1,o?t:w?t+1:t-1],r=[n-1,o?t:w?t-1:t+1],u=[[w||o?h.left+1:h.right,h.top],[w?o?h.left+1:h.right:h.left+1,h.bottom]];return w?[e,r,...u]:[e,...u,r]}}}const R=x([o,u]);"production"!==process.env.NODE_ENV&&(null==r||r(x([o,u]).slice(0,4).join(", "))),E([v,g],R)?t&&(n=setTimeout(i,t)):(clearTimeout(n),i())}}},e.useAria=function(e,n){let{open:t}=e,{enabled:r=!0,role:o="dialog",titleId:u,descriptionId:c}=void 0===n?{}:n;const l=s(),i={id:l,role:o};return r?"tooltip"===o?{reference:{"aria-describedby":t?l:void 0},floating:i}:{reference:{"aria-expanded":t?"true":"false","aria-haspopup":o,"aria-controls":t?l:void 0,..."listbox"===o&&{role:"combobox"}},floating:{...i,..."dialog"===o&&{"aria-labelledby":u,"aria-describedby":c}}}:{}},e.useClick=function(e,n){let{open:t,onOpenChange:r,dataRef:o}=e,{enabled:u=!0}=void 0===n?{}:n;return u?{reference:{onClick(e){var n;t?"click"===(null==(n=o.current.openEvent)?void 0:n.type)||o.current.hoveredThenClicked?(o.current.hoveredThenClicked=!1,r(!1)):o.current.hoveredThenClicked=!0:(o.current.openEvent=e.nativeEvent,r(!0))}}}:{}},e.useDelayGroup=(e,t)=>{let{open:r,onOpenChange:o}=e,{id:u}=t;const{currentId:c,initialDelay:l,setState:i}=P();n.useEffect((()=>{c&&o&&(i((e=>({...e,delay:{open:0,close:A(l,"close")}}))),c!==u&&o(!1))}),[u,o,i,c,l]),n.useEffect((()=>{!r&&c===u&&o&&(o(!1),i((e=>({...e,delay:l,currentId:null}))))}),[r,i,c,u,o,l])},e.useDelayGroupContext=P,e.useDismiss=function(e,r){let{open:o,onOpenChange:u,refs:c,events:l,nodeId:i}=e,{enabled:a=!0,escapeKey:s=!0,outsidePointerDown:f=!0,referencePointerDown:d=!1,ancestorScroll:v=!1}=void 0===r?{}:r;const p=g(),m=n.useCallback((()=>{R(c.reference.current)&&c.reference.current.focus()}),[c.reference.current]);return n.useEffect((()=>{if(!o||!a)return;function e(e){"Escape"===e.key&&(l.emit("dismiss"),u(!1),m())}function n(e){var n;const t=p&&C(p,i).some((n=>{var t,r;return null==(t=n.context)||null==(r=t.refs.floating.current)?void 0:r.contains(e.target)}));null!=(n=c.floating.current)&&n.contains(e.target)||k(c.reference.current)&&c.reference.current.contains(e.target)||t||(l.emit("dismiss"),u(!1),m())}function r(){u(!1)}const d=w(c.floating.current);s&&d.addEventListener("keydown",e),f&&d.addEventListener("pointerdown",n);const g=v?[...k(c.reference.current)?t.getOverflowAncestors(c.reference.current):[],...k(c.floating.current)?t.getOverflowAncestors(c.floating.current):[]]:[];return g.forEach((e=>e.addEventListener("scroll",r,{passive:!0}))),()=>{s&&d.removeEventListener("keydown",e),f&&d.removeEventListener("pointerdown",n),g.forEach((e=>e.removeEventListener("scroll",r)))}}),[s,f,l,p,i,o,u,m,v,a,c.floating,c.reference]),a?{reference:{onPointerDown(){d&&(l.emit("dismiss"),u(!1))}}}:{}},e.useFloating=function(e){let{open:r=!1,onOpenChange:o=(()=>{}),placement:u,middleware:i,strategy:a,nodeId:s}=void 0===e?{}:e;const f=g(),d=n.useRef({}),v=n.useState((()=>l()))[0],p=t.useFloating({placement:u,middleware:i,strategy:a}),m=n.useMemo((()=>({...p,dataRef:d,nodeId:s,events:v,open:r,onOpenChange:o})),[p,d,s,v,r,o]);return c((()=>{const e=null==f?void 0:f.nodesRef.current.find((e=>e.id===s));e&&(e.context=m)})),n.useMemo((()=>({context:m,...p})),[p,m])},e.useFloatingId=s,e.useFloatingNodeId=()=>{const e=s(),n=g(),t=v();return c((()=>{const r={id:e,parentId:t};return null==n||n.addNode(r),()=>{null==n||n.removeNode(r)}}),[n,e,t]),e},e.useFloatingParentNodeId=v,e.useFloatingTree=g,e.useFocus=function(e,t){let{open:r,onOpenChange:o,dataRef:u,refs:c,events:l}=e,{enabled:i=!0,keyboardOnly:a=!0}=void 0===t?{}:t;const s=n.useRef(!1);return n.useEffect((()=>{var e;if(!i)return;const n=null!=(e=w(c.floating.current).defaultView)?e:window;function t(){s.current=!r}function o(){setTimeout((()=>{s.current=!1}))}return n.addEventListener("focus",o),n.addEventListener("blur",t),()=>{n.addEventListener("focus",o),n.removeEventListener("blur",t)}}),[c.floating,r,i]),n.useEffect((()=>{if(i)return l.on("dismiss",e),()=>{l.off("dismiss",e)};function e(){s.current=!0}}),[l,i]),i?{reference:{onPointerDown(e){let{pointerType:n}=e;s.current=!(!n||!a)},onFocus(e){var n,t;s.current||"focus"===e.type&&"mousedown"===u.current.openEvent&&k(c.reference.current)&&null!=(n=c.reference.current)&&n.contains(null==(t=u.current.openEvent)?void 0:t.target)||(u.current.openEvent=e.nativeEvent,o(!0))},onBlur(e){var n;const t=e.relatedTarget;null!=(n=c.floating.current)&&n.contains(t)||k(c.reference.current)&&c.reference.current.contains(t)||(s.current=!1,u.current.hoveredThenClicked=!1,o(!1))}}}:{}},e.useFocusTrap=function(e,t){let{open:r,onOpenChange:o,refs:u,nodeId:l}=e,{enabled:i=!0,initialContentFocus:a=0,order:s=["content"],modal:f=!0,inert:d=!1,scrollLock:v=!1}=void 0===t?{}:t;const p=n.useContext(I),m=g(),h=n.useRef(0),y=n.useCallback((()=>s.map((e=>{return R(u.reference.current)&&"reference"===e?u.reference.current:u.floating.current&&"floating"===e?u.floating.current:"content"===e?Array.from(null!=(n=null==(t=u.floating.current)?void 0:t.querySelectorAll("a[href],area[href],input:not([disabled]),select:not([disabled]),textarea:not([disabled]),button:not([disabled]),iframe,object,embed,*[tabindex],*[contenteditable]"))?n:[]):null;var n,t})).filter(Boolean).flat()),[u.floating,u.reference,s]);function b(e){var n;const t=e.relatedTarget;!t||null!=(n=u.floating.current)&&n.contains(t)||!k(u.reference.current)||u.reference.current.contains(t)||o(!1)}return n.useEffect((()=>{if(!d&&i)if(r){const t=y();var e;if("number"==typeof a)null==(e=t[a])||e.focus({preventScroll:!0});else if(a.current){var n;null==(n=t.find((e=>e===a.current)))||n.focus({preventScroll:!0})}}else f&&R(u.reference.current)&&u.reference.current.focus({preventScroll:!0})}),[y,r,d,f,a,i,u.reference]),n.useEffect((()=>{if(!f||!i)return;const e=w(u.floating.current);if(!r)return e.removeEventListener("keydown",n),void(h.current=0);function n(e){var n;if((null==m||null==(n=m.nodesRef.current)||!n.filter((e=>{let{parentId:n}=e;return n===l})).some((e=>{let{context:n}=e;return null==n?void 0:n.open})))&&"Tab"===e.key){var t;if(e.preventDefault(),e.stopPropagation(),d)return;const n=y();e.shiftKey?h.current=0===h.current?n.length-1:h.current-1:h.current=h.current===n.length-1?0:h.current+1,null==(t=n[h.current])||t.focus({preventScroll:!0})}}return e.addEventListener("keydown",n),()=>{e.removeEventListener("keydown",n)}}),[y,null==m?void 0:m.nodesRef,l,r,f,d,i,u.floating]),n.useEffect((()=>{if(!r||!f||!i)return;const e=w(u.floating.current),n=e.querySelector("#"+p),t=e.querySelectorAll("body > *:not(#"+p+")");return t.forEach((e=>{e.setAttribute("aria-hidden","true")})),()=>{(null==n?void 0:n.firstElementChild)===u.floating.current&&t.forEach((e=>{e.removeAttribute("aria-hidden")}))}}),[r,f,v,p,i,u.floating]),c((()=>{if(!r||!i)return;const e=w(u.floating.current);if(v){var n;const t=(null!=(n=e.defaultView)?n:window).innerWidth-e.documentElement.offsetWidth;e.documentElement.style.overflow="hidden",e.body.style.paddingRight=t+"px"}return()=>{v&&(e.documentElement.style.overflow="",e.body.style.paddingRight="")}}),[r,v,i]),i?f?{floating:{"aria-modal":"true"}}:{reference:{onBlur:b},floating:{onBlur:b}}:{}},e.useHover=function(e,t){let{enabled:r=!0,delay:o=0,handleLeave:u=null,mouseOnly:l=!1,pointerRestMs:i=0}=void 0===t?{}:t;const{open:a,onOpenChange:s,dataRef:f,events:d,refs:v}=e,p=g(),m=n.useRef(),h=n.useRef(),y=n.useRef(),b=n.useRef(!0);function E(e){void 0===e&&(e=!0),o?(clearTimeout(m.current),m.current=setTimeout((()=>s(!1)),A(o,"close"))):e&&s(!1)}return c((()=>{a||(f.current.hoveredThenClicked=!1)}),[a]),n.useEffect((()=>{function e(){clearTimeout(m.current),clearTimeout(y.current),b.current=!0}return d.on("dismiss",e),()=>{d.off("dismiss",e)}}),[d]),r?{reference:{onPointerMove(){0===i||a||(clearTimeout(y.current),y.current=setTimeout((()=>{b.current||s(!0)}),i))},onPointerEnter(e){l&&"mouse"!==e.pointerType||(b.current=!1,f.current.openEvent=e.nativeEvent,o?(clearTimeout(m.current),m.current=setTimeout((()=>{s(!0)}),A(o,"open"))):s(!0))},onPointerLeave(n){var t;if(f.current.hoveredThenClicked||"click"===(null==(t=f.current.openEvent)?void 0:t.type))return;const r=w(v.floating.current);if(clearTimeout(y.current),u)return clearTimeout(m.current),h.current&&r.removeEventListener("pointermove",h.current),h.current=u({...e,tree:p,x:n.clientX,y:n.clientY,onClose(){h.current&&r.removeEventListener("pointermove",h.current),E()}}),h.current(n.nativeEvent),void r.addEventListener("pointermove",h.current);E()}},floating:{onPointerEnter(){clearTimeout(m.current)},onPointerLeave:()=>E(!1)}}:{}},e.useInteractions=function(e){return void 0===e&&(e=[]),{getReferenceProps:n=>m(n,e,"reference"),getFloatingProps:n=>m(n,e,"floating")}},e.useListNavigation=function(e,t){let{open:r,onOpenChange:o,refs:u}=e,{enabled:l=!0,listRef:i={current:[]},activeIndex:a=null,selectedIndex:s=null,loop:f=!1,nested:d=!1,rtl:v=!1,onNavigate:g=(()=>{})}=void 0===t?{}:t;const p=n.useRef(!0),m=n.useRef(null!=s?s:0),h=n.useRef(""),y=n.useCallback(((e,n)=>{var t;null==(t=e.current[n.current])||t.focus({preventScroll:!0})}),[]);function b(e){p.current=!e.pointerType}return c((()=>{l&&(null!=s&&(m.current=s),r&&p.current&&(g(m.current),y(i,m)))}),[r,s,i,g,y,l]),c((()=>{l&&r&&null!=a&&(m.current=a,g(m.current),y(i,m))}),[r,a,i,g,y,l]),c((()=>{null==s&&l&&(r&&("ArrowDown"===h.current||"ArrowUp"===h.current||p.current&&(" "===h.current||"Enter"===h.current))&&(m.current="ArrowUp"===h.current?S(i,{startingIndex:i.current.length,decrement:!0}):S(i),g(m.current),y(i,m)),h.current="")}),[r,i,s,g,y,l]),c((()=>{var e;l&&(r||null==s||null==(e=u.reference.current)||e.focus({preventScroll:!0}))}),[u.reference,s,r,l]),c((()=>{l&&(r||(p.current=!0,g(null)))}),[r,l]),l?{reference:{onPointerEnter:b,onPointerDown:b,onKeyDown(e){p.current=!0,h.current=e.key,k(u.reference.current)&&"BUTTON"!==u.reference.current.tagName&&("Enter"!==e.key&&" "!==e.key||o(!0)),d?e.key===(v?"ArrowLeft":"ArrowRight")&&(m.current=S(i),F(e),o(!0),g(m.current)):"ArrowDown"!==e.key&&"ArrowUp"!==e.key||(m.current=null==s?"ArrowDown"===e.key?S(i):S(i,{startingIndex:i.current.length,decrement:!0}):s,F(e),o(!0),g(m.current))}},floating:{onKeyDown(e){if(d&&e.key===(v?"ArrowRight":"ArrowLeft"))return F(e),o(!1),void(R(u.reference.current)&&u.reference.current.focus());const n=m.current,t=S(i),r=S(i,{decrement:!0,startingIndex:i.current.length});if("Home"===e.key&&(m.current=t,g(m.current),y(i,m)),"End"===e.key&&(m.current=r,g(m.current),y(i,m)),"ArrowDown"===e.key||"ArrowUp"===e.key){if(F(e),e.currentTarget.ownerDocument.activeElement===e.currentTarget&&null!=s)return m.current=s,g(m.current),void y(i,m);"ArrowDown"===e.key?m.current=f?n===r?t:S(i,{startingIndex:n}):Math.min(r,S(i,{startingIndex:n})):m.current=f?n===t?r:S(i,{startingIndex:n,decrement:!0}):Math.max(t,S(i,{startingIndex:n,decrement:!0})),g(m.current),y(i,m)}}}}:{}},e.useTypeahead=function(e,t){let{open:r}=e,{enabled:o=!0,listRef:u={current:[]},onMatch:l=(()=>{}),onFind:i=null,debounceMs:a=500,ignoreKeys:s=[]}=void 0===t?{}:t;const f=n.useRef(),d=n.useRef(""),v=n.useRef(null),g=n.useRef(null);function p(e){if(!e.currentTarget.contains(w(e.currentTarget).activeElement))return;" "===e.key&&d.current.length>0&&(e.preventDefault(),e.stopPropagation());const n=u.current;if(null==n||["Home","End","Escape","Enter","Tab","ArrowUp","ArrowDown","ArrowLeft","ArrowRight",...s].includes(e.key))return;n.every((e=>{var n,t;return!e||(null==(n=e[0])?void 0:n.toLowerCase())!==(null==(t=e[1])?void 0:t.toLowerCase())}))&&d.current===e.key&&(d.current="",v.current=g.current),d.current+=e.key,clearTimeout(f.current),f.current=setTimeout((()=>{d.current="",v.current=g.current}),a);const t=v.current,r=[...n.slice((null!=t?t:0)+1),...n.slice(0,null!=t?t:0)].find((e=>i?i(e,d.current):0===(null==e?void 0:e.toLowerCase().indexOf(d.current)))),o=r?n.indexOf(r):-1;-1!==o&&(l(o),g.current=o)}return c((()=>{r&&(clearTimeout(f.current),v.current=null,g.current=null,d.current="")}),[r]),o?{reference:{onKeyDown:p},floating:{onKeyDown:p}}:{}},Object.keys(t).forEach((function(n){"default"===n||e.hasOwnProperty(n)||Object.defineProperty(e,n,{enumerable:!0,get:function(){return t[n]}})})),Object.defineProperty(e,"__esModule",{value:!0})}));

package.json

 {
   "name": "@floating-ui/react-dom-interactions",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "@rollingversions": {
@@ -5,0 +5,0 @@ "baseVersion": [

src/FloatingPortal.d.ts

 import React from 'react';
-export declare function FloatingPortal({ children }: {
-    children: React.ReactNode;
-}): import("react").ReactPortal;
+export declare const useFloatingPortalId: () => string;
+/**
+ * Portals your floating element outside of the main app node.
+ * @see https://floating-ui.com/docs/FloatingPortal
+ */
+export declare const FloatingPortal: React.FC<{
+    id?: string;
+}>;

src/hooks/useAria.d.ts

 import type { ElementProps, FloatingContext } from '../types';
-export interface Options {
-    role: 'tooltip' | 'dialog' | 'menu' | 'listbox';
-    titleId: string;
-    descriptionId: string;
+export interface Props {
+    enabled?: boolean;
+    role?: 'tooltip' | 'dialog' | 'menu' | 'listbox';
+    titleId?: string;
+    descriptionId?: string;
 }
-export declare const useAria: ({ open }: FloatingContext, { role, titleId, descriptionId }?: Partial<Options>) => ElementProps;
+/**
+ * Adds relevant screen reader props for a given element `role`.
+ */
+export declare const useAria: ({ open }: FloatingContext, { enabled, role, titleId, descriptionId }?: Partial<Props>) => ElementProps;

src/hooks/useClick.d.ts

 import type { ElementProps, FloatingContext } from '../types';
-export declare const useClick: ({ open, onOpenChange, dataRef, }: FloatingContext) => ElementProps;
+export interface Props {
+    enabled?: boolean;
+}
+/**
+ * Adds click event listeners that change the open state (toggle behavior).
+ * @see https://floating-ui.com/docs/useClick
+ */
+export declare const useClick: ({ open, onOpenChange, dataRef }: FloatingContext, { enabled }?: Props) => ElementProps;

src/hooks/useDismiss.d.ts

 import type { ElementProps, FloatingContext } from '../types';
-export interface Options {
-    escapeKey: boolean;
-    referencePointerDown: boolean;
-    outsidePointerDown: boolean;
-    ancestorScroll: boolean;
+export interface Props {
+    enabled?: boolean;
+    escapeKey?: boolean;
+    referencePointerDown?: boolean;
+    outsidePointerDown?: boolean;
+    ancestorScroll?: boolean;
 }
-export declare const useDismiss: ({ onOpenChange, refs, open, treeRef, nodeRef, dataRef, }: FloatingContext, { escapeKey, outsidePointerDown, referencePointerDown, ancestorScroll, }?: Partial<Options>) => ElementProps;
+/**
+ * Adds listeners that dismiss (close) the floating element.
+ * @see https://floating-ui.com/docs/useDismiss
+ */
+export declare const useDismiss: ({ open, onOpenChange, refs, events, nodeId }: FloatingContext, { enabled, escapeKey, outsidePointerDown, referencePointerDown, ancestorScroll, }?: Props) => ElementProps;

src/hooks/useFocus.d.ts

 import type { ElementProps, FloatingContext } from '../types';
-export interface Options {
-    keyboardOnly: boolean;
+export interface Props {
+    enabled?: boolean;
+    keyboardOnly?: boolean;
 }
-export declare const useFocus: ({ open, onOpenChange, dataRef, refs }: FloatingContext, { keyboardOnly }?: Partial<Options>) => ElementProps;
+/**
+ * Adds hover event listeners that change the open state, like CSS :focus.
+ * @see https://floating-ui.com/docs/useFocus
+ */
+export declare const useFocus: ({ open, onOpenChange, dataRef, refs, events }: FloatingContext, { enabled, keyboardOnly }?: Props) => ElementProps;

src/hooks/useFocusTrap.d.ts

 import { MutableRefObject } from 'react';
 import type { ElementProps, FloatingContext } from '../types';
-interface Options {
-    modal: boolean;
-    order: Array<'reference' | 'floating' | 'content'>;
-    initialContentFocus: number | MutableRefObject<HTMLElement | null>;
-    inert: boolean;
-    scrollLock: 'auto' | boolean;
+export interface Props {
+    enabled?: boolean;
+    modal?: boolean;
+    order?: Array<'reference' | 'floating' | 'content'>;
+    initialContentFocus?: number | MutableRefObject<HTMLElement | null>;
+    inert?: boolean;
+    scrollLock?: boolean;
 }
-export declare const useFocusTrap: ({ open, refs, treeRef, nodeRef, onOpenChange }: FloatingContext, { initialContentFocus, order, modal, inert, scrollLock, }?: Partial<Options>) => ElementProps;
-export {};
+/**
+ * Traps focus in a loop of focusable elements while the floating element is
+ * open.
+ * @see https://floating-ui.com/docs/useFocusTrap
+ */
+export declare const useFocusTrap: ({ open, onOpenChange, refs, nodeId }: FloatingContext, { enabled, initialContentFocus, order, modal, inert, scrollLock, }?: Props) => ElementProps;

src/hooks/useHover.d.ts

@@ -1,14 +0,20 @@
-import type { ElementProps, FloatingContext } from '../types';
-export declare function getDelay(value: Options['delay'], prop: 'open' | 'close'): number;
-export interface Options {
-    handleLeave: null | ((context: FloatingContext & {
+import type { ElementProps, FloatingContext, FloatingTreeType } from '../types';
+export declare function getDelay(value: Props['delay'], prop: 'open' | 'close'): number;
+export interface Props {
+    enabled?: boolean;
+    handleLeave?: null | ((context: FloatingContext & {
         onClose: () => void;
+        tree?: FloatingTreeType | null;
     }) => (event: PointerEvent) => void);
-    pointerRestMs: number;
-    delay: number | Partial<{
+    pointerRestMs?: number;
+    delay?: number | Partial<{
         open: number;
         close: number;
     }>;
-    mouseOnly: boolean;
+    mouseOnly?: boolean;
 }
-export declare const useHover: (context: FloatingContext, { delay, handleLeave, mouseOnly, pointerRestMs, }?: Partial<Options>) => ElementProps;
+/**
+ * Adds hover event listeners that change the open state, like CSS :hover.
+ * @see https://floating-ui.com/docs/useHover
+ */
+export declare const useHover: (context: FloatingContext, { enabled, delay, handleLeave, mouseOnly, pointerRestMs, }?: Props) => ElementProps;

src/hooks/useListNavigation.d.ts

 import React from 'react';
 import type { ElementProps, FloatingContext } from '../types';
-interface Options {
+export interface Props {
     listRef: React.MutableRefObject<Array<HTMLElement | null>>;
-    activeIndex?: number | null;
+    activeIndex: number | null;
+    onNavigate: (index: number | null) => void;
+    enabled?: boolean;
     selectedIndex?: number | null;
@@ -10,6 +12,8 @@ loop?: boolean;
     rtl?: boolean;
-    preventScroll?: boolean;
-    onNavigate?: (index: number) => void;
 }
-export declare const useListNavigation: ({ open, onOpenChange, refs }: FloatingContext, { listRef, activeIndex, selectedIndex, loop, nested, rtl, preventScroll, onNavigate, }: Options) => ElementProps;
-export {};
+/**
+ * Adds focus-managed indexed navigation via arrow keys to a list of items
+ * within the floating element.
+ * @see https://floating-ui.com/docs/useListNavigation
+ */
+export declare const useListNavigation: ({ open, onOpenChange, refs }: FloatingContext, { enabled, listRef, activeIndex, selectedIndex, loop, nested, rtl, onNavigate, }?: Partial<Props>) => ElementProps;

src/hooks/useTypeahead.d.ts

 import React from 'react';
 import type { ElementProps, FloatingContext } from '../types';
-export interface Options {
+export interface Props {
     listRef: React.MutableRefObject<Array<string | null>>;
     onMatch: (index: number) => void;
+    enabled?: boolean;
+    onFind?: null | ((itemString: string | null, typedString: string) => boolean);
     debounceMs?: number;
     ignoreKeys?: Array<string>;
 }
-export declare const useTypeahead: (context: FloatingContext, { listRef, onMatch, debounceMs, ignoreKeys }: Options) => ElementProps;
+/**
+ * Provides a transient string via a callback as the user types, often used in
+ * tandem with `useListNavigation()`.
+ * @see https://floating-ui.com/docs/useTypeahead
+ */
+export declare const useTypeahead: ({ open }: FloatingContext, { enabled, listRef, onMatch, onFind, debounceMs, ignoreKeys, }?: Partial<Props>) => ElementProps;

src/index.d.ts

@@ -1,9 +0,21 @@
-import React from 'react';
-import type { FloatingNode, FloatingTree, FloatingContext, Middleware, Placement, Strategy } from './types';
+import { UseFloatingReturn } from '@floating-ui/react-dom';
+import type { FloatingContext, Middleware, Placement, Strategy } from './types';
+export interface Props {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    placement: Placement;
+    middleware: Array<Middleware>;
+    strategy: Strategy;
+    nodeId: string;
+}
+export declare function useFloating({ open, onOpenChange, placement, middleware, strategy, nodeId, }?: Partial<Props>): UseFloatingReturn & {
+    context: FloatingContext;
+};
 export * from '@floating-ui/react-dom';
 export { useInteractions } from './useInteractions';
-export { createTree } from './createTree';
 export { safePolygon } from './safePolygon';
 export { FloatingPortal } from './FloatingPortal';
-export { FloatingGroup, useGroup, useGroupContext } from './FloatingGroup';
+export { FloatingOverlay } from './FloatingOverlay';
+export { FloatingTree, FloatingNode, useFloatingNodeId, useFloatingParentNodeId, useFloatingTree, } from './FloatingTree';
+export { FloatingDelayGroup, useDelayGroup, useDelayGroupContext, } from './FloatingDelayGroup';
 export { useAria } from './hooks/useAria';
@@ -18,25 +30,1 @@ export { useClick } from './hooks/useClick';
 export { useTypeahead } from './hooks/useTypeahead';
-interface Props {
-    open: boolean;
-    onOpenChange: (open: boolean) => void;
-    placement: Placement;
-    middleware: Array<Middleware>;
-    strategy: Strategy;
-    treeRef: React.MutableRefObject<FloatingTree>;
-    nodeRef: React.MutableRefObject<FloatingNode>;
-}
-export declare function useFloating({ open, onOpenChange, placement, middleware, strategy, treeRef, nodeRef, }?: Partial<Props>): {
-    placement: Placement;
-    strategy: Strategy;
-    middlewareData: import("@floating-ui/react-dom").MiddlewareData;
-    x: number;
-    y: number;
-    update: () => void;
-    reference: (node: import("@floating-ui/core").VirtualElement | Element) => void;
-    floating: (node: HTMLElement) => void;
-    refs: {
-        reference: import("react").MutableRefObject<import("@floating-ui/core").VirtualElement | Element>;
-        floating: import("react").MutableRefObject<HTMLElement>;
-    };
-    context: FloatingContext;
-};

src/safePolygon.d.ts

@@ -1,7 +0,8 @@
-import type { FloatingContext } from './types';
+import type { FloatingContext, FloatingTreeType } from './types';
 export declare function safePolygon({ timeout, debug, }?: Partial<{
     timeout: number;
     debug: null | ((points: string | null) => void);
-}>): ({ x, y, placement, refs, onClose, treeRef, nodeRef, }: FloatingContext & {
+}>): ({ x, y, placement, refs, onClose, nodeId, tree, }: FloatingContext & {
     onClose: () => void;
+    tree?: FloatingTreeType | null;
 }) => (event: PointerEvent) => void;

src/types.d.ts

@@ -1,23 +0,28 @@
-import React, { MutableRefObject } from 'react';
 import type { UseFloatingReturn } from '@floating-ui/react-dom';
+import React from 'react';
 export * from './';
 export * from '@floating-ui/dom';
 export { arrow } from '@floating-ui/react-dom';
+export interface FloatingEvents {
+    emit(event: string, data?: any): void;
+    on(event: string, handler: (data?: any) => void): void;
+    off(event: string, handler: (data?: any) => void): void;
+}
 export interface FloatingContext extends UseFloatingReturn {
     open: boolean;
-    onOpenChange?: (open: boolean) => void;
+    onOpenChange: (open: boolean) => void;
+    events: FloatingEvents;
     dataRef: React.MutableRefObject<Record<string, any>>;
-    treeRef?: React.MutableRefObject<FloatingTree>;
-    nodeRef?: React.MutableRefObject<FloatingNode>;
+    nodeId: string | undefined;
 }
-export interface FloatingNode {
+export interface FloatingNodeType {
     id: string;
     parentId: string | null;
-    open: boolean;
+    context?: FloatingContext;
 }
-export interface FloatingTree {
-    nodes: Array<MutableRefObject<FloatingNode>>;
-    on(event: string, listener: (data: any) => void): void;
-    off(event: string, listener: (data: any) => void): void;
-    emit(event: string, data?: any): void;
+export interface FloatingTreeType {
+    nodesRef: React.MutableRefObject<Array<FloatingNodeType>>;
+    events: FloatingEvents;
+    addNode: (node: FloatingNodeType) => void;
+    removeNode: (node: FloatingNodeType) => void;
 }
@@ -24,0 +29,0 @@ export interface ElementProps {

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

200891

increased by23.53%

Number of package files

31

increased by10.71%

Lines of code

4628

increased by23.91%

Worsened metrics

Number of low supply chain risk alerts

5

increased by66.67%

No dependency changes