@servicetitan/anvil2 3.0.3 → 3.0.5

package/dist/AiMark-DjOf60tj.js

@@ -0,0 +1,3137 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import * as React from 'react';
+import { forwardRef, useLayoutEffect, useEffect, useRef, createContext, useContext, useCallback, useId as useId$1, useImperativeHandle, useMemo, useState } from 'react';
+import { I as Icon } from './Icon-feeG7gXA.js';
+import { c as cx } from './index-De1g9FRV.js';
+import { L as Link } from './Link-D8A_WT94.js';
+import { T as Tooltip } from './Tooltip-DGo3OWqL.js';
+import { B as Button, A as AiMarkIconAnimated } from './Button-C_V2xQAs.js';
+import { i as isShadowRoot, h as isHTMLElement, u as useFloating$1, j as isElement, k as getWindow, m as getOverflowAncestors, n as isWebKit, p as isLastTraversableNode, q as getParentNode, r as getComputedStyle, t as getNodeName, s as safeShowPopover, b as safeHidePopover, a as autoUpdate, o as offset, g as size, v as autoPlacement, f as flip, d as shift, e as arrow$1, l as limitShift } from './floating-ui.react-dom-CHrYz13o.js';
+import { t as tabbable, i as isTabbable, a as usePopoverTransitionStates } from './usePopoverTransitionStates-CDXCdyKa.js';
+import 'react-dom';
+import { useTrackingId } from './useTrackingId.js';
+import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
+import { u as useMergeRefs$1 } from './useMergeRefs-Dfmtq9cI.js';
+import { D as DialogContext } from './DialogContext-DBgtApl9.js';
+import { u as useOptionallyControlledState } from './useOptionallyControlledState-DbDuos5L.js';
+
+import './AiMark.css';const SvgAiMark = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "m10.5 4.5 2.387 6.614 6.613 2.385-6.613 2.387-2.388 6.614-2.386-6.613L1.5 13.499l6.613-2.386zm7.5-3 1.193 3.307L22.5 6l-3.307 1.193L18 10.5l-1.193-3.307L13.5 6l3.307-1.193z" }));
+
+const SvgAiMarkGradient = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, fill: "none", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { fill: "url(#a)", d: "m10.5 4.5 2.387 6.614 6.613 2.385-6.613 2.387-2.388 6.614-2.386-6.613L1.5 13.499l6.613-2.386z" }), /* @__PURE__ */ React.createElement("path", { fill: "url(#b)", d: "m18 1.5 1.193 3.307L22.5 6l-3.307 1.193L18 10.5l-1.193-3.307L13.5 6l3.307-1.193z" }), /* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("linearGradient", { id: "a", x1: 19.5, x2: 3.604, y1: 14.583, y2: 20.367, gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { stopColor: "light-dark(#026EE4, #77C5EA)" }), /* @__PURE__ */ React.createElement("stop", { offset: 1, stopColor: "light-dark(#27AEEE, #D0D8E1)" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "b", x1: 22.5, x2: 14.552, y1: 6.542, y2: 9.433, gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { stopColor: "light-dark(#026EE4, #77C5EA)" }), /* @__PURE__ */ React.createElement("stop", { offset: 1, stopColor: "light-dark(#27AEEE, #D0D8E1)" }))));
+
+const fieldLabelButtonStyles = {
+	"field-label-button": "_field-label-button_1jrqp_1",
+	"field-label-button__inner": "_field-label-button__inner_1jrqp_65",
+	"field-label-button-scaled": "_field-label-button-scaled_1jrqp_77"
+};
+
+const FieldLabelButton = forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(
+  "button",
+  {
+    ref,
+    type: "button",
+    className: cx(fieldLabelButtonStyles["field-label-button"], className),
+    ...props,
+    children: /* @__PURE__ */ jsx("span", { className: fieldLabelButtonStyles["field-label-button__inner"], children })
+  }
+));
+FieldLabelButton.displayName = "FieldLabelButton";
+
+function activeElement(doc) {
+  let activeElement = doc.activeElement;
+  while (((_activeElement = activeElement) == null || (_activeElement = _activeElement.shadowRoot) == null ? void 0 : _activeElement.activeElement) != null) {
+    var _activeElement;
+    activeElement = activeElement.shadowRoot.activeElement;
+  }
+  return activeElement;
+}
+function contains(parent, child) {
+  if (!parent || !child) {
+    return false;
+  }
+  const rootNode = child.getRootNode == null ? void 0 : child.getRootNode();
+
+  // First, attempt with faster native method
+  if (parent.contains(child)) {
+    return true;
+  }
+
+  // then fallback to custom implementation with Shadow DOM support
+  if (rootNode && isShadowRoot(rootNode)) {
+    let next = child;
+    while (next) {
+      if (parent === next) {
+        return true;
+      }
+      // @ts-ignore
+      next = next.parentNode || next.host;
+    }
+  }
+
+  // Give up, the result is false
+  return false;
+}
+// Avoid Chrome DevTools blue warning.
+function getPlatform() {
+  const uaData = navigator.userAgentData;
+  if (uaData != null && uaData.platform) {
+    return uaData.platform;
+  }
+  return navigator.platform;
+}
+function getUserAgent() {
+  const uaData = navigator.userAgentData;
+  if (uaData && Array.isArray(uaData.brands)) {
+    return uaData.brands.map(_ref => {
+      let {
+        brand,
+        version
+      } = _ref;
+      return brand + "/" + version;
+    }).join(' ');
+  }
+  return navigator.userAgent;
+}
+
+// License: https://github.com/adobe/react-spectrum/blob/b35d5c02fe900badccd0cf1a8f23bb593419f238/packages/@react-aria/utils/src/isVirtualEvent.ts
+function isVirtualClick(event) {
+  // FIXME: Firefox is now emitting a deprecation warning for `mozInputSource`.
+  // Try to find a workaround for this. `react-aria` source still has the check.
+  if (event.mozInputSource === 0 && event.isTrusted) {
+    return true;
+  }
+  if (isAndroid() && event.pointerType) {
+    return event.type === 'click' && event.buttons === 1;
+  }
+  return event.detail === 0 && !event.pointerType;
+}
+function isVirtualPointerEvent(event) {
+  if (isJSDOM()) return false;
+  return !isAndroid() && event.width === 0 && event.height === 0 || isAndroid() && event.width === 1 && event.height === 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'mouse' ||
+  // iOS VoiceOver returns 0.333• for width/height.
+  event.width < 1 && event.height < 1 && event.pressure === 0 && event.detail === 0 && event.pointerType === 'touch';
+}
+function isSafari() {
+  // Chrome DevTools does not complain about navigator.vendor
+  return /apple/i.test(navigator.vendor);
+}
+function isAndroid() {
+  const re = /android/i;
+  return re.test(getPlatform()) || re.test(getUserAgent());
+}
+function isMac() {
+  return getPlatform().toLowerCase().startsWith('mac') && !navigator.maxTouchPoints;
+}
+function isJSDOM() {
+  return getUserAgent().includes('jsdom/');
+}
+function isMouseLikePointerType(pointerType, strict) {
+  // On some Linux machines with Chromium, mouse inputs return a `pointerType`
+  // of "pen": https://github.com/floating-ui/floating-ui/issues/2015
+  const values = ['mouse', 'pen'];
+  if (!strict) {
+    values.push('', undefined);
+  }
+  return values.includes(pointerType);
+}
+function isReactEvent(event) {
+  return 'nativeEvent' in event;
+}
+function isRootElement(element) {
+  return element.matches('html,body');
+}
+function getDocument(node) {
+  return (node == null ? void 0 : node.ownerDocument) || document;
+}
+function isEventTargetWithin(event, node) {
+  if (node == null) {
+    return false;
+  }
+  if ('composedPath' in event) {
+    return event.composedPath().includes(node);
+  }
+
+  // TS thinks `event` is of type never as it assumes all browsers support composedPath, but browsers without shadow dom don't
+  const e = event;
+  return e.target != null && node.contains(e.target);
+}
+function getTarget(event) {
+  if ('composedPath' in event) {
+    return event.composedPath()[0];
+  }
+
+  // TS thinks `event` is of type never as it assumes all browsers support
+  // `composedPath()`, but browsers without shadow DOM don't.
+  return event.target;
+}
+const TYPEABLE_SELECTOR = "input:not([type='hidden']):not([disabled])," + "[contenteditable]:not([contenteditable='false']),textarea:not([disabled])";
+function isTypeableElement(element) {
+  return isHTMLElement(element) && element.matches(TYPEABLE_SELECTOR);
+}
+function stopEvent(event) {
+  event.preventDefault();
+  event.stopPropagation();
+}
+function isTypeableCombobox(element) {
+  if (!element) return false;
+  return element.getAttribute('role') === 'combobox' && isTypeableElement(element);
+}
+
+/**
+ * Merges an array of refs into a single memoized callback ref or `null`.
+ * @see https://floating-ui.com/docs/react-utils#usemergerefs
+ */
+function useMergeRefs(refs) {
+  return React.useMemo(() => {
+    if (refs.every(ref => ref == null)) {
+      return null;
+    }
+    return value => {
+      refs.forEach(ref => {
+        if (typeof ref === 'function') {
+          ref(value);
+        } else if (ref != null) {
+          ref.current = value;
+        }
+      });
+    };
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, refs);
+}
+
+// https://github.com/mui/material-ui/issues/41190#issuecomment-2040873379
+const SafeReact = {
+  ...React
+};
+
+const useInsertionEffect = SafeReact.useInsertionEffect;
+const useSafeInsertionEffect = useInsertionEffect || (fn => fn());
+function useEffectEvent(callback) {
+  const ref = React.useRef(() => {
+    if (process.env.NODE_ENV !== "production") {
+      throw new Error('Cannot call an event handler while rendering.');
+    }
+  });
+  useSafeInsertionEffect(() => {
+    ref.current = callback;
+  });
+  return React.useCallback(function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+    return ref.current == null ? void 0 : ref.current(...args);
+  }, []);
+}
+
+var index = typeof document !== 'undefined' ? useLayoutEffect : useEffect;
+
+function _extends() {
+  _extends = Object.assign ? Object.assign.bind() : 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);
+}
+
+let serverHandoffComplete = false;
+let count = 0;
+const genId = () => // Ensure the id is unique with multiple independent versions of Floating UI
+// on <React 18
+"floating-ui-" + Math.random().toString(36).slice(2, 6) + count++;
+function useFloatingId() {
+  const [id, setId] = React.useState(() => serverHandoffComplete ? genId() : undefined);
+  index(() => {
+    if (id == null) {
+      setId(genId());
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  React.useEffect(() => {
+    serverHandoffComplete = true;
+  }, []);
+  return id;
+}
+const useReactId = SafeReact.useId;
+
+/**
+ * Uses React 18's built-in `useId()` when available, or falls back to a
+ * slightly less performant (requiring a double render) implementation for
+ * earlier React versions.
+ * @see https://floating-ui.com/docs/react-utils#useid
+ */
+const useId = useReactId || useFloatingId;
+
+let devMessageSet;
+if (process.env.NODE_ENV !== "production") {
+  devMessageSet = /*#__PURE__*/new Set();
+}
+function error() {
+  var _devMessageSet3;
+  for (var _len2 = arguments.length, messages = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+    messages[_key2] = arguments[_key2];
+  }
+  const message = "Floating UI: " + messages.join(' ');
+  if (!((_devMessageSet3 = devMessageSet) != null && _devMessageSet3.has(message))) {
+    var _devMessageSet4;
+    (_devMessageSet4 = devMessageSet) == null || _devMessageSet4.add(message);
+    console.error(message);
+  }
+}
+
+function createPubSub() {
+  const map = new Map();
+  return {
+    emit(event, data) {
+      var _map$get;
+      (_map$get = map.get(event)) == null || _map$get.forEach(handler => handler(data));
+    },
+    on(event, listener) {
+      map.set(event, [...(map.get(event) || []), listener]);
+    },
+    off(event, listener) {
+      var _map$get2;
+      map.set(event, ((_map$get2 = map.get(event)) == null ? void 0 : _map$get2.filter(l => l !== listener)) || []);
+    }
+  };
+}
+
+const FloatingNodeContext = /*#__PURE__*/React.createContext(null);
+const FloatingTreeContext = /*#__PURE__*/React.createContext(null);
+
+/**
+ * Returns the parent node id for nested floating elements, if available.
+ * Returns `null` for top-level floating elements.
+ */
+const useFloatingParentNodeId = () => {
+  var _React$useContext;
+  return ((_React$useContext = React.useContext(FloatingNodeContext)) == null ? void 0 : _React$useContext.id) || null;
+};
+
+/**
+ * Returns the nearest floating tree context, if available.
+ */
+const useFloatingTree = () => React.useContext(FloatingTreeContext);
+
+function createAttribute(name) {
+  return "data-floating-ui-" + name;
+}
+
+function useLatestRef(value) {
+  const ref = useRef(value);
+  index(() => {
+    ref.current = value;
+  });
+  return ref;
+}
+
+const safePolygonIdentifier = /*#__PURE__*/createAttribute('safe-polygon');
+function getDelay(value, prop, pointerType) {
+  if (pointerType && !isMouseLikePointerType(pointerType)) {
+    return 0;
+  }
+  if (typeof value === 'number') {
+    return value;
+  }
+  return value == null ? void 0 : value[prop];
+}
+/**
+ * Opens the floating element while hovering over the reference element, like
+ * CSS `:hover`.
+ * @see https://floating-ui.com/docs/useHover
+ */
+function useHover(context, props) {
+  if (props === void 0) {
+    props = {};
+  }
+  const {
+    open,
+    onOpenChange,
+    dataRef,
+    events,
+    elements
+  } = context;
+  const {
+    enabled = true,
+    delay = 0,
+    handleClose = null,
+    mouseOnly = false,
+    restMs = 0,
+    move = true
+  } = props;
+  const tree = useFloatingTree();
+  const parentId = useFloatingParentNodeId();
+  const handleCloseRef = useLatestRef(handleClose);
+  const delayRef = useLatestRef(delay);
+  const openRef = useLatestRef(open);
+  const pointerTypeRef = React.useRef();
+  const timeoutRef = React.useRef(-1);
+  const handlerRef = React.useRef();
+  const restTimeoutRef = React.useRef(-1);
+  const blockMouseMoveRef = React.useRef(true);
+  const performedPointerEventsMutationRef = React.useRef(false);
+  const unbindMouseMoveRef = React.useRef(() => {});
+  const restTimeoutPendingRef = React.useRef(false);
+  const isHoverOpen = React.useCallback(() => {
+    var _dataRef$current$open;
+    const type = (_dataRef$current$open = dataRef.current.openEvent) == null ? void 0 : _dataRef$current$open.type;
+    return (type == null ? void 0 : type.includes('mouse')) && type !== 'mousedown';
+  }, [dataRef]);
+
+  // When closing before opening, clear the delay timeouts to cancel it
+  // from showing.
+  React.useEffect(() => {
+    if (!enabled) return;
+    function onOpenChange(_ref) {
+      let {
+        open
+      } = _ref;
+      if (!open) {
+        clearTimeout(timeoutRef.current);
+        clearTimeout(restTimeoutRef.current);
+        blockMouseMoveRef.current = true;
+        restTimeoutPendingRef.current = false;
+      }
+    }
+    events.on('openchange', onOpenChange);
+    return () => {
+      events.off('openchange', onOpenChange);
+    };
+  }, [enabled, events]);
+  React.useEffect(() => {
+    if (!enabled) return;
+    if (!handleCloseRef.current) return;
+    if (!open) return;
+    function onLeave(event) {
+      if (isHoverOpen()) {
+        onOpenChange(false, event, 'hover');
+      }
+    }
+    const html = getDocument(elements.floating).documentElement;
+    html.addEventListener('mouseleave', onLeave);
+    return () => {
+      html.removeEventListener('mouseleave', onLeave);
+    };
+  }, [elements.floating, open, onOpenChange, enabled, handleCloseRef, isHoverOpen]);
+  const closeWithDelay = React.useCallback(function (event, runElseBranch, reason) {
+    if (runElseBranch === void 0) {
+      runElseBranch = true;
+    }
+    if (reason === void 0) {
+      reason = 'hover';
+    }
+    const closeDelay = getDelay(delayRef.current, 'close', pointerTypeRef.current);
+    if (closeDelay && !handlerRef.current) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = window.setTimeout(() => onOpenChange(false, event, reason), closeDelay);
+    } else if (runElseBranch) {
+      clearTimeout(timeoutRef.current);
+      onOpenChange(false, event, reason);
+    }
+  }, [delayRef, onOpenChange]);
+  const cleanupMouseMoveHandler = useEffectEvent(() => {
+    unbindMouseMoveRef.current();
+    handlerRef.current = undefined;
+  });
+  const clearPointerEvents = useEffectEvent(() => {
+    if (performedPointerEventsMutationRef.current) {
+      const body = getDocument(elements.floating).body;
+      body.style.pointerEvents = '';
+      body.removeAttribute(safePolygonIdentifier);
+      performedPointerEventsMutationRef.current = false;
+    }
+  });
+  const isClickLikeOpenEvent = useEffectEvent(() => {
+    return dataRef.current.openEvent ? ['click', 'mousedown'].includes(dataRef.current.openEvent.type) : false;
+  });
+
+  // Registering the mouse events on the reference directly to bypass React's
+  // delegation system. If the cursor was on a disabled element and then entered
+  // the reference (no gap), `mouseenter` doesn't fire in the delegation system.
+  React.useEffect(() => {
+    if (!enabled) return;
+    function onMouseEnter(event) {
+      clearTimeout(timeoutRef.current);
+      blockMouseMoveRef.current = false;
+      if (mouseOnly && !isMouseLikePointerType(pointerTypeRef.current) || restMs > 0 && !getDelay(delayRef.current, 'open')) {
+        return;
+      }
+      const openDelay = getDelay(delayRef.current, 'open', pointerTypeRef.current);
+      if (openDelay) {
+        timeoutRef.current = window.setTimeout(() => {
+          if (!openRef.current) {
+            onOpenChange(true, event, 'hover');
+          }
+        }, openDelay);
+      } else if (!open) {
+        onOpenChange(true, event, 'hover');
+      }
+    }
+    function onMouseLeave(event) {
+      if (isClickLikeOpenEvent()) return;
+      unbindMouseMoveRef.current();
+      const doc = getDocument(elements.floating);
+      clearTimeout(restTimeoutRef.current);
+      restTimeoutPendingRef.current = false;
+      if (handleCloseRef.current && dataRef.current.floatingContext) {
+        // Prevent clearing `onScrollMouseLeave` timeout.
+        if (!open) {
+          clearTimeout(timeoutRef.current);
+        }
+        handlerRef.current = handleCloseRef.current({
+          ...dataRef.current.floatingContext,
+          tree,
+          x: event.clientX,
+          y: event.clientY,
+          onClose() {
+            clearPointerEvents();
+            cleanupMouseMoveHandler();
+            if (!isClickLikeOpenEvent()) {
+              closeWithDelay(event, true, 'safe-polygon');
+            }
+          }
+        });
+        const handler = handlerRef.current;
+        doc.addEventListener('mousemove', handler);
+        unbindMouseMoveRef.current = () => {
+          doc.removeEventListener('mousemove', handler);
+        };
+        return;
+      }
+
+      // Allow interactivity without `safePolygon` on touch devices. With a
+      // pointer, a short close delay is an alternative, so it should work
+      // consistently.
+      const shouldClose = pointerTypeRef.current === 'touch' ? !contains(elements.floating, event.relatedTarget) : true;
+      if (shouldClose) {
+        closeWithDelay(event);
+      }
+    }
+
+    // Ensure the floating element closes after scrolling even if the pointer
+    // did not move.
+    // https://github.com/floating-ui/floating-ui/discussions/1692
+    function onScrollMouseLeave(event) {
+      if (isClickLikeOpenEvent()) return;
+      if (!dataRef.current.floatingContext) return;
+      handleCloseRef.current == null || handleCloseRef.current({
+        ...dataRef.current.floatingContext,
+        tree,
+        x: event.clientX,
+        y: event.clientY,
+        onClose() {
+          clearPointerEvents();
+          cleanupMouseMoveHandler();
+          if (!isClickLikeOpenEvent()) {
+            closeWithDelay(event);
+          }
+        }
+      })(event);
+    }
+    if (isElement(elements.domReference)) {
+      var _elements$floating;
+      const ref = elements.domReference;
+      open && ref.addEventListener('mouseleave', onScrollMouseLeave);
+      (_elements$floating = elements.floating) == null || _elements$floating.addEventListener('mouseleave', onScrollMouseLeave);
+      move && ref.addEventListener('mousemove', onMouseEnter, {
+        once: true
+      });
+      ref.addEventListener('mouseenter', onMouseEnter);
+      ref.addEventListener('mouseleave', onMouseLeave);
+      return () => {
+        var _elements$floating2;
+        open && ref.removeEventListener('mouseleave', onScrollMouseLeave);
+        (_elements$floating2 = elements.floating) == null || _elements$floating2.removeEventListener('mouseleave', onScrollMouseLeave);
+        move && ref.removeEventListener('mousemove', onMouseEnter);
+        ref.removeEventListener('mouseenter', onMouseEnter);
+        ref.removeEventListener('mouseleave', onMouseLeave);
+      };
+    }
+  }, [elements, enabled, context, mouseOnly, restMs, move, closeWithDelay, cleanupMouseMoveHandler, clearPointerEvents, onOpenChange, open, openRef, tree, delayRef, handleCloseRef, dataRef, isClickLikeOpenEvent]);
+
+  // Block pointer-events of every element other than the reference and floating
+  // while the floating element is open and has a `handleClose` handler. Also
+  // handles nested floating elements.
+  // https://github.com/floating-ui/floating-ui/issues/1722
+  index(() => {
+    var _handleCloseRef$curre;
+    if (!enabled) return;
+    if (open && (_handleCloseRef$curre = handleCloseRef.current) != null && _handleCloseRef$curre.__options.blockPointerEvents && isHoverOpen()) {
+      performedPointerEventsMutationRef.current = true;
+      const floatingEl = elements.floating;
+      if (isElement(elements.domReference) && floatingEl) {
+        var _tree$nodesRef$curren;
+        const body = getDocument(elements.floating).body;
+        body.setAttribute(safePolygonIdentifier, '');
+        const ref = elements.domReference;
+        const parentFloating = tree == null || (_tree$nodesRef$curren = tree.nodesRef.current.find(node => node.id === parentId)) == null || (_tree$nodesRef$curren = _tree$nodesRef$curren.context) == null ? void 0 : _tree$nodesRef$curren.elements.floating;
+        if (parentFloating) {
+          parentFloating.style.pointerEvents = '';
+        }
+        body.style.pointerEvents = 'none';
+        ref.style.pointerEvents = 'auto';
+        floatingEl.style.pointerEvents = 'auto';
+        return () => {
+          body.style.pointerEvents = '';
+          ref.style.pointerEvents = '';
+          floatingEl.style.pointerEvents = '';
+        };
+      }
+    }
+  }, [enabled, open, parentId, elements, tree, handleCloseRef, isHoverOpen]);
+  index(() => {
+    if (!open) {
+      pointerTypeRef.current = undefined;
+      restTimeoutPendingRef.current = false;
+      cleanupMouseMoveHandler();
+      clearPointerEvents();
+    }
+  }, [open, cleanupMouseMoveHandler, clearPointerEvents]);
+  React.useEffect(() => {
+    return () => {
+      cleanupMouseMoveHandler();
+      clearTimeout(timeoutRef.current);
+      clearTimeout(restTimeoutRef.current);
+      clearPointerEvents();
+    };
+  }, [enabled, elements.domReference, cleanupMouseMoveHandler, clearPointerEvents]);
+  const reference = React.useMemo(() => {
+    function setPointerRef(event) {
+      pointerTypeRef.current = event.pointerType;
+    }
+    return {
+      onPointerDown: setPointerRef,
+      onPointerEnter: setPointerRef,
+      onMouseMove(event) {
+        const {
+          nativeEvent
+        } = event;
+        function handleMouseMove() {
+          if (!blockMouseMoveRef.current && !openRef.current) {
+            onOpenChange(true, nativeEvent, 'hover');
+          }
+        }
+        if (mouseOnly && !isMouseLikePointerType(pointerTypeRef.current)) {
+          return;
+        }
+        if (open || restMs === 0) {
+          return;
+        }
+
+        // Ignore insignificant movements to account for tremors.
+        if (restTimeoutPendingRef.current && event.movementX ** 2 + event.movementY ** 2 < 2) {
+          return;
+        }
+        clearTimeout(restTimeoutRef.current);
+        if (pointerTypeRef.current === 'touch') {
+          handleMouseMove();
+        } else {
+          restTimeoutPendingRef.current = true;
+          restTimeoutRef.current = window.setTimeout(handleMouseMove, restMs);
+        }
+      }
+    };
+  }, [mouseOnly, onOpenChange, open, openRef, restMs]);
+  const floating = React.useMemo(() => ({
+    onMouseEnter() {
+      clearTimeout(timeoutRef.current);
+    },
+    onMouseLeave(event) {
+      if (!isClickLikeOpenEvent()) {
+        closeWithDelay(event.nativeEvent, false);
+      }
+    }
+  }), [closeWithDelay, isClickLikeOpenEvent]);
+  return React.useMemo(() => enabled ? {
+    reference,
+    floating
+  } : {}, [enabled, reference, floating]);
+}
+
+let rafId = 0;
+function enqueueFocus(el, options) {
+  if (options === void 0) {
+    options = {};
+  }
+  const {
+    preventScroll = false,
+    cancelPrevious = true,
+    sync = false
+  } = options;
+  cancelPrevious && cancelAnimationFrame(rafId);
+  const exec = () => el == null ? void 0 : el.focus({
+    preventScroll
+  });
+  if (sync) {
+    exec();
+  } else {
+    rafId = requestAnimationFrame(exec);
+  }
+}
+
+function getAncestors(nodes, id) {
+  var _nodes$find;
+  let allAncestors = [];
+  let currentParentId = (_nodes$find = nodes.find(node => node.id === id)) == null ? void 0 : _nodes$find.parentId;
+  while (currentParentId) {
+    const currentNode = nodes.find(node => node.id === currentParentId);
+    currentParentId = currentNode == null ? void 0 : currentNode.parentId;
+    if (currentNode) {
+      allAncestors = allAncestors.concat(currentNode);
+    }
+  }
+  return allAncestors;
+}
+
+function getChildren(nodes, id) {
+  let allChildren = nodes.filter(node => {
+    var _node$context;
+    return node.parentId === id && ((_node$context = node.context) == null ? void 0 : _node$context.open);
+  });
+  let currentChildren = allChildren;
+  while (currentChildren.length) {
+    currentChildren = nodes.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);
+      });
+    });
+    allChildren = allChildren.concat(currentChildren);
+  }
+  return allChildren;
+}
+
+// Modified to add conditional `aria-hidden` support:
+// https://github.com/theKashey/aria-hidden/blob/9220c8f4a4fd35f63bee5510a9f41a37264382d4/src/index.ts
+let counterMap = /*#__PURE__*/new WeakMap();
+let uncontrolledElementsSet = /*#__PURE__*/new WeakSet();
+let markerMap = {};
+let lockCount$1 = 0;
+const supportsInert = () => typeof HTMLElement !== 'undefined' && 'inert' in HTMLElement.prototype;
+const unwrapHost = node => node && (node.host || unwrapHost(node.parentNode));
+const correctElements = (parent, targets) => targets.map(target => {
+  if (parent.contains(target)) {
+    return target;
+  }
+  const correctedTarget = unwrapHost(target);
+  if (parent.contains(correctedTarget)) {
+    return correctedTarget;
+  }
+  return null;
+}).filter(x => x != null);
+function applyAttributeToOthers(uncorrectedAvoidElements, body, ariaHidden, inert) {
+  const markerName = 'data-floating-ui-inert';
+  const controlAttribute = inert ? 'inert' : ariaHidden ? 'aria-hidden' : null;
+  const avoidElements = correctElements(body, uncorrectedAvoidElements);
+  const elementsToKeep = new Set();
+  const elementsToStop = new Set(avoidElements);
+  const hiddenElements = [];
+  if (!markerMap[markerName]) {
+    markerMap[markerName] = new WeakMap();
+  }
+  const markerCounter = markerMap[markerName];
+  avoidElements.forEach(keep);
+  deep(body);
+  elementsToKeep.clear();
+  function keep(el) {
+    if (!el || elementsToKeep.has(el)) {
+      return;
+    }
+    elementsToKeep.add(el);
+    el.parentNode && keep(el.parentNode);
+  }
+  function deep(parent) {
+    if (!parent || elementsToStop.has(parent)) {
+      return;
+    }
+    [].forEach.call(parent.children, node => {
+      if (getNodeName(node) === 'script') return;
+      if (elementsToKeep.has(node)) {
+        deep(node);
+      } else {
+        const attr = controlAttribute ? node.getAttribute(controlAttribute) : null;
+        const alreadyHidden = attr !== null && attr !== 'false';
+        const counterValue = (counterMap.get(node) || 0) + 1;
+        const markerValue = (markerCounter.get(node) || 0) + 1;
+        counterMap.set(node, counterValue);
+        markerCounter.set(node, markerValue);
+        hiddenElements.push(node);
+        if (counterValue === 1 && alreadyHidden) {
+          uncontrolledElementsSet.add(node);
+        }
+        if (markerValue === 1) {
+          node.setAttribute(markerName, '');
+        }
+        if (!alreadyHidden && controlAttribute) {
+          node.setAttribute(controlAttribute, 'true');
+        }
+      }
+    });
+  }
+  lockCount$1++;
+  return () => {
+    hiddenElements.forEach(element => {
+      const counterValue = (counterMap.get(element) || 0) - 1;
+      const markerValue = (markerCounter.get(element) || 0) - 1;
+      counterMap.set(element, counterValue);
+      markerCounter.set(element, markerValue);
+      if (!counterValue) {
+        if (!uncontrolledElementsSet.has(element) && controlAttribute) {
+          element.removeAttribute(controlAttribute);
+        }
+        uncontrolledElementsSet.delete(element);
+      }
+      if (!markerValue) {
+        element.removeAttribute(markerName);
+      }
+    });
+    lockCount$1--;
+    if (!lockCount$1) {
+      counterMap = new WeakMap();
+      counterMap = new WeakMap();
+      uncontrolledElementsSet = new WeakSet();
+      markerMap = {};
+    }
+  };
+}
+function markOthers(avoidElements, ariaHidden, inert) {
+  if (ariaHidden === void 0) {
+    ariaHidden = false;
+  }
+  if (inert === void 0) {
+    inert = false;
+  }
+  const body = getDocument(avoidElements[0]).body;
+  return applyAttributeToOthers(avoidElements.concat(Array.from(body.querySelectorAll('[aria-live]'))), body, ariaHidden, inert);
+}
+
+const getTabbableOptions = () => ({
+  getShadowRoot: true,
+  displayCheck:
+  // JSDOM does not support the `tabbable` library. To solve this we can
+  // check if `ResizeObserver` is a real function (not polyfilled), which
+  // determines if the current environment is JSDOM-like.
+  typeof ResizeObserver === 'function' && ResizeObserver.toString().includes('[native code]') ? 'full' : 'none'
+});
+function getTabbableIn(container, direction) {
+  const allTabbable = tabbable(container, getTabbableOptions());
+  if (direction === 'prev') {
+    allTabbable.reverse();
+  }
+  const activeIndex = allTabbable.indexOf(activeElement(getDocument(container)));
+  const nextTabbableElements = allTabbable.slice(activeIndex + 1);
+  return nextTabbableElements[0];
+}
+function getNextTabbable() {
+  return getTabbableIn(document.body, 'next');
+}
+function getPreviousTabbable() {
+  return getTabbableIn(document.body, 'prev');
+}
+function isOutsideEvent(event, container) {
+  const containerElement = container || event.currentTarget;
+  const relatedTarget = event.relatedTarget;
+  return !relatedTarget || !contains(containerElement, relatedTarget);
+}
+
+// See Diego Haz's Sandbox for making this logic work well on Safari/iOS:
+// https://codesandbox.io/s/tabbable-portal-f4tng?file=/src/FocusTrap.tsx
+
+const HIDDEN_STYLES = {
+  border: 0,
+  clip: 'rect(0 0 0 0)',
+  height: '1px',
+  margin: '-1px',
+  overflow: 'hidden',
+  padding: 0,
+  position: 'fixed',
+  whiteSpace: 'nowrap',
+  width: '1px',
+  top: 0,
+  left: 0
+};
+let timeoutId;
+function setActiveElementOnTab(event) {
+  if (event.key === 'Tab') {
+    event.target;
+    clearTimeout(timeoutId);
+  }
+}
+const FocusGuard = /*#__PURE__*/React.forwardRef(function FocusGuard(props, ref) {
+  const [role, setRole] = React.useState();
+  index(() => {
+    if (isSafari()) {
+      // Unlike other screen readers such as NVDA and JAWS, the virtual cursor
+      // on VoiceOver does trigger the onFocus event, so we can use the focus
+      // trap element. On Safari, only buttons trigger the onFocus event.
+      // NB: "group" role in the Sandbox no longer appears to work, must be a
+      // button role.
+      setRole('button');
+    }
+    document.addEventListener('keydown', setActiveElementOnTab);
+    return () => {
+      document.removeEventListener('keydown', setActiveElementOnTab);
+    };
+  }, []);
+  const restProps = {
+    ref,
+    tabIndex: 0,
+    // Role is only for VoiceOver
+    role,
+    'aria-hidden': role ? undefined : true,
+    [createAttribute('focus-guard')]: '',
+    style: HIDDEN_STYLES
+  };
+  return /*#__PURE__*/React.createElement("span", _extends({}, props, restProps));
+});
+
+const PortalContext = /*#__PURE__*/React.createContext(null);
+const usePortalContext = () => React.useContext(PortalContext);
+
+const FOCUSABLE_ATTRIBUTE = 'data-floating-ui-focusable';
+function getFloatingFocusElement(floatingElement) {
+  if (!floatingElement) {
+    return null;
+  }
+  // Try to find the element that has `{...getFloatingProps()}` spread on it.
+  // This indicates the floating element is acting as a positioning wrapper, and
+  // so focus should be managed on the child element with the event handlers and
+  // aria props.
+  return floatingElement.hasAttribute(FOCUSABLE_ATTRIBUTE) ? floatingElement : floatingElement.querySelector("[" + FOCUSABLE_ATTRIBUTE + "]") || floatingElement;
+}
+
+const LIST_LIMIT = 20;
+let previouslyFocusedElements = [];
+function addPreviouslyFocusedElement(element) {
+  previouslyFocusedElements = previouslyFocusedElements.filter(el => el.isConnected);
+  let tabbableEl = element;
+  if (!tabbableEl || getNodeName(tabbableEl) === 'body') return;
+  if (!isTabbable(tabbableEl, getTabbableOptions())) {
+    const tabbableChild = tabbable(tabbableEl, getTabbableOptions())[0];
+    if (tabbableChild) {
+      tabbableEl = tabbableChild;
+    }
+  }
+  previouslyFocusedElements.push(tabbableEl);
+  if (previouslyFocusedElements.length > LIST_LIMIT) {
+    previouslyFocusedElements = previouslyFocusedElements.slice(-LIST_LIMIT);
+  }
+}
+function getPreviouslyFocusedElement() {
+  return previouslyFocusedElements.slice().reverse().find(el => el.isConnected);
+}
+const VisuallyHiddenDismiss = /*#__PURE__*/React.forwardRef(function VisuallyHiddenDismiss(props, ref) {
+  return /*#__PURE__*/React.createElement("button", _extends({}, props, {
+    type: "button",
+    ref: ref,
+    tabIndex: -1,
+    style: HIDDEN_STYLES
+  }));
+});
+/**
+ * Provides focus management for the floating element.
+ * @see https://floating-ui.com/docs/FloatingFocusManager
+ */
+function FloatingFocusManager(props) {
+  const {
+    context,
+    children,
+    disabled = false,
+    order = ['content'],
+    guards: _guards = true,
+    initialFocus = 0,
+    returnFocus = true,
+    restoreFocus = false,
+    modal = true,
+    visuallyHiddenDismiss = false,
+    closeOnFocusOut = true
+  } = props;
+  const {
+    open,
+    refs,
+    nodeId,
+    onOpenChange,
+    events,
+    dataRef,
+    floatingId,
+    elements: {
+      domReference,
+      floating
+    }
+  } = context;
+  const ignoreInitialFocus = typeof initialFocus === 'number' && initialFocus < 0;
+  // If the reference is a combobox and is typeable (e.g. input/textarea),
+  // there are different focus semantics. The guards should not be rendered, but
+  // aria-hidden should be applied to all nodes still. Further, the visually
+  // hidden dismiss button should only appear at the end of the list, not the
+  // start.
+  const isUntrappedTypeableCombobox = isTypeableCombobox(domReference) && ignoreInitialFocus;
+
+  // Force the guards to be rendered if the `inert` attribute is not supported.
+  const guards = supportsInert() ? _guards : true;
+  const orderRef = useLatestRef(order);
+  const initialFocusRef = useLatestRef(initialFocus);
+  const returnFocusRef = useLatestRef(returnFocus);
+  const tree = useFloatingTree();
+  const portalContext = usePortalContext();
+  const startDismissButtonRef = React.useRef(null);
+  const endDismissButtonRef = React.useRef(null);
+  const preventReturnFocusRef = React.useRef(false);
+  const isPointerDownRef = React.useRef(false);
+  const tabbableIndexRef = React.useRef(-1);
+  const isInsidePortal = portalContext != null;
+  const floatingFocusElement = getFloatingFocusElement(floating);
+  const getTabbableContent = useEffectEvent(function (container) {
+    if (container === void 0) {
+      container = floatingFocusElement;
+    }
+    return container ? tabbable(container, getTabbableOptions()) : [];
+  });
+  const getTabbableElements = useEffectEvent(container => {
+    const content = getTabbableContent(container);
+    return orderRef.current.map(type => {
+      if (domReference && type === 'reference') {
+        return domReference;
+      }
+      if (floatingFocusElement && type === 'floating') {
+        return floatingFocusElement;
+      }
+      return content;
+    }).filter(Boolean).flat();
+  });
+  React.useEffect(() => {
+    if (disabled) return;
+    if (!modal) return;
+    function onKeyDown(event) {
+      if (event.key === 'Tab') {
+        // The focus guards have nothing to focus, so we need to stop the event.
+        if (contains(floatingFocusElement, activeElement(getDocument(floatingFocusElement))) && getTabbableContent().length === 0 && !isUntrappedTypeableCombobox) {
+          stopEvent(event);
+        }
+        const els = getTabbableElements();
+        const target = getTarget(event);
+        if (orderRef.current[0] === 'reference' && target === domReference) {
+          stopEvent(event);
+          if (event.shiftKey) {
+            enqueueFocus(els[els.length - 1]);
+          } else {
+            enqueueFocus(els[1]);
+          }
+        }
+        if (orderRef.current[1] === 'floating' && target === floatingFocusElement && event.shiftKey) {
+          stopEvent(event);
+          enqueueFocus(els[0]);
+        }
+      }
+    }
+    const doc = getDocument(floatingFocusElement);
+    doc.addEventListener('keydown', onKeyDown);
+    return () => {
+      doc.removeEventListener('keydown', onKeyDown);
+    };
+  }, [disabled, domReference, floatingFocusElement, modal, orderRef, isUntrappedTypeableCombobox, getTabbableContent, getTabbableElements]);
+  React.useEffect(() => {
+    if (disabled) return;
+    if (!floating) return;
+    function handleFocusIn(event) {
+      const target = getTarget(event);
+      const tabbableContent = getTabbableContent();
+      const tabbableIndex = tabbableContent.indexOf(target);
+      if (tabbableIndex !== -1) {
+        tabbableIndexRef.current = tabbableIndex;
+      }
+    }
+    floating.addEventListener('focusin', handleFocusIn);
+    return () => {
+      floating.removeEventListener('focusin', handleFocusIn);
+    };
+  }, [disabled, floating, getTabbableContent]);
+  React.useEffect(() => {
+    if (disabled) return;
+    if (!closeOnFocusOut) return;
+
+    // In Safari, buttons lose focus when pressing them.
+    function handlePointerDown() {
+      isPointerDownRef.current = true;
+      setTimeout(() => {
+        isPointerDownRef.current = false;
+      });
+    }
+    function handleFocusOutside(event) {
+      const relatedTarget = event.relatedTarget;
+      queueMicrotask(() => {
+        const movedToUnrelatedNode = !(contains(domReference, relatedTarget) || contains(floating, relatedTarget) || contains(relatedTarget, floating) || contains(portalContext == null ? void 0 : portalContext.portalNode, relatedTarget) || relatedTarget != null && relatedTarget.hasAttribute(createAttribute('focus-guard')) || tree && (getChildren(tree.nodesRef.current, nodeId).find(node => {
+          var _node$context, _node$context2;
+          return contains((_node$context = node.context) == null ? void 0 : _node$context.elements.floating, relatedTarget) || contains((_node$context2 = node.context) == null ? void 0 : _node$context2.elements.domReference, relatedTarget);
+        }) || getAncestors(tree.nodesRef.current, nodeId).find(node => {
+          var _node$context3, _node$context4;
+          return ((_node$context3 = node.context) == null ? void 0 : _node$context3.elements.floating) === relatedTarget || ((_node$context4 = node.context) == null ? void 0 : _node$context4.elements.domReference) === relatedTarget;
+        })));
+
+        // Restore focus to the previous tabbable element index to prevent
+        // focus from being lost outside the floating tree.
+        if (restoreFocus && movedToUnrelatedNode && activeElement(getDocument(floatingFocusElement)) === getDocument(floatingFocusElement).body) {
+          // Let `FloatingPortal` effect knows that focus is still inside the
+          // floating tree.
+          if (isHTMLElement(floatingFocusElement)) {
+            floatingFocusElement.focus();
+          }
+          const prevTabbableIndex = tabbableIndexRef.current;
+          const tabbableContent = getTabbableContent();
+          const nodeToFocus = tabbableContent[prevTabbableIndex] || tabbableContent[tabbableContent.length - 1] || floatingFocusElement;
+          if (isHTMLElement(nodeToFocus)) {
+            nodeToFocus.focus();
+          }
+        }
+
+        // Focus did not move inside the floating tree, and there are no tabbable
+        // portal guards to handle closing.
+        if ((isUntrappedTypeableCombobox ? true : !modal) && relatedTarget && movedToUnrelatedNode && !isPointerDownRef.current &&
+        // Fix React 18 Strict Mode returnFocus due to double rendering.
+        relatedTarget !== getPreviouslyFocusedElement()) {
+          preventReturnFocusRef.current = true;
+          onOpenChange(false, event, 'focus-out');
+        }
+      });
+    }
+    if (floating && isHTMLElement(domReference)) {
+      domReference.addEventListener('focusout', handleFocusOutside);
+      domReference.addEventListener('pointerdown', handlePointerDown);
+      floating.addEventListener('focusout', handleFocusOutside);
+      return () => {
+        domReference.removeEventListener('focusout', handleFocusOutside);
+        domReference.removeEventListener('pointerdown', handlePointerDown);
+        floating.removeEventListener('focusout', handleFocusOutside);
+      };
+    }
+  }, [disabled, domReference, floating, floatingFocusElement, modal, nodeId, tree, portalContext, onOpenChange, closeOnFocusOut, restoreFocus, getTabbableContent, isUntrappedTypeableCombobox]);
+  React.useEffect(() => {
+    var _portalContext$portal;
+    if (disabled) return;
+
+    // Don't hide portals nested within the parent portal.
+    const portalNodes = Array.from((portalContext == null || (_portalContext$portal = portalContext.portalNode) == null ? void 0 : _portalContext$portal.querySelectorAll("[" + createAttribute('portal') + "]")) || []);
+    if (floating) {
+      const insideElements = [floating, ...portalNodes, startDismissButtonRef.current, endDismissButtonRef.current, orderRef.current.includes('reference') || isUntrappedTypeableCombobox ? domReference : null].filter(x => x != null);
+      const cleanup = modal || isUntrappedTypeableCombobox ? markOthers(insideElements, guards, !guards) : markOthers(insideElements);
+      return () => {
+        cleanup();
+      };
+    }
+  }, [disabled, domReference, floating, modal, orderRef, portalContext, isUntrappedTypeableCombobox, guards]);
+  index(() => {
+    if (disabled || !isHTMLElement(floatingFocusElement)) return;
+    const doc = getDocument(floatingFocusElement);
+    const previouslyFocusedElement = activeElement(doc);
+
+    // Wait for any layout effect state setters to execute to set `tabIndex`.
+    queueMicrotask(() => {
+      const focusableElements = getTabbableElements(floatingFocusElement);
+      const initialFocusValue = initialFocusRef.current;
+      const elToFocus = (typeof initialFocusValue === 'number' ? focusableElements[initialFocusValue] : initialFocusValue.current) || floatingFocusElement;
+      const focusAlreadyInsideFloatingEl = contains(floatingFocusElement, previouslyFocusedElement);
+      if (!ignoreInitialFocus && !focusAlreadyInsideFloatingEl && open) {
+        enqueueFocus(elToFocus, {
+          preventScroll: elToFocus === floatingFocusElement
+        });
+      }
+    });
+  }, [disabled, open, floatingFocusElement, ignoreInitialFocus, getTabbableElements, initialFocusRef]);
+  index(() => {
+    if (disabled || !floatingFocusElement) return;
+    let preventReturnFocusScroll = false;
+    const doc = getDocument(floatingFocusElement);
+    const previouslyFocusedElement = activeElement(doc);
+    const contextData = dataRef.current;
+    let openEvent = contextData.openEvent;
+    addPreviouslyFocusedElement(previouslyFocusedElement);
+
+    // Dismissing via outside press should always ignore `returnFocus` to
+    // prevent unwanted scrolling.
+    function onOpenChange(_ref) {
+      let {
+        open,
+        reason,
+        event,
+        nested
+      } = _ref;
+      if (open) {
+        openEvent = event;
+      }
+      if (reason === 'escape-key' && refs.domReference.current) {
+        addPreviouslyFocusedElement(refs.domReference.current);
+      }
+      if (reason === 'hover' && event.type === 'mouseleave') {
+        preventReturnFocusRef.current = true;
+      }
+      if (reason !== 'outside-press') return;
+      if (nested) {
+        preventReturnFocusRef.current = false;
+        preventReturnFocusScroll = true;
+      } else {
+        preventReturnFocusRef.current = !(isVirtualClick(event) || isVirtualPointerEvent(event));
+      }
+    }
+    events.on('openchange', onOpenChange);
+    const fallbackEl = doc.createElement('span');
+    fallbackEl.setAttribute('tabindex', '-1');
+    fallbackEl.setAttribute('aria-hidden', 'true');
+    Object.assign(fallbackEl.style, HIDDEN_STYLES);
+    if (isInsidePortal && domReference) {
+      domReference.insertAdjacentElement('afterend', fallbackEl);
+    }
+    function getReturnElement() {
+      if (typeof returnFocusRef.current === 'boolean') {
+        return getPreviouslyFocusedElement() || fallbackEl;
+      }
+      return returnFocusRef.current.current || fallbackEl;
+    }
+    return () => {
+      events.off('openchange', onOpenChange);
+      const activeEl = activeElement(doc);
+      const isFocusInsideFloatingTree = contains(floating, activeEl) || tree && getChildren(tree.nodesRef.current, nodeId).some(node => {
+        var _node$context5;
+        return contains((_node$context5 = node.context) == null ? void 0 : _node$context5.elements.floating, activeEl);
+      });
+      const shouldFocusReference = isFocusInsideFloatingTree || openEvent && ['click', 'mousedown'].includes(openEvent.type);
+      if (shouldFocusReference && refs.domReference.current) {
+        addPreviouslyFocusedElement(refs.domReference.current);
+      }
+      const returnElement = getReturnElement();
+      queueMicrotask(() => {
+        if (
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+        returnFocusRef.current && !preventReturnFocusRef.current && isHTMLElement(returnElement) && (
+        // If the focus moved somewhere else after mount, avoid returning focus
+        // since it likely entered a different element which should be
+        // respected: https://github.com/floating-ui/floating-ui/issues/2607
+        returnElement !== activeEl && activeEl !== doc.body ? isFocusInsideFloatingTree : true)) {
+          returnElement.focus({
+            preventScroll: preventReturnFocusScroll
+          });
+        }
+        fallbackEl.remove();
+      });
+    };
+  }, [disabled, floating, floatingFocusElement, returnFocusRef, dataRef, refs, events, tree, nodeId, isInsidePortal, domReference]);
+  React.useEffect(() => {
+    // The `returnFocus` cleanup behavior is inside a microtask; ensure we
+    // wait for it to complete before resetting the flag.
+    queueMicrotask(() => {
+      preventReturnFocusRef.current = false;
+    });
+  }, [disabled]);
+
+  // Synchronize the `context` & `modal` value to the FloatingPortal context.
+  // It will decide whether or not it needs to render its own guards.
+  index(() => {
+    if (disabled) return;
+    if (!portalContext) return;
+    portalContext.setFocusManagerState({
+      modal,
+      closeOnFocusOut,
+      open,
+      onOpenChange,
+      refs
+    });
+    return () => {
+      portalContext.setFocusManagerState(null);
+    };
+  }, [disabled, portalContext, modal, open, onOpenChange, refs, closeOnFocusOut]);
+  index(() => {
+    if (disabled) return;
+    if (!floatingFocusElement) return;
+    if (typeof MutationObserver !== 'function') return;
+    if (ignoreInitialFocus) return;
+    const handleMutation = () => {
+      const tabIndex = floatingFocusElement.getAttribute('tabindex');
+      const tabbableContent = getTabbableContent();
+      const activeEl = activeElement(getDocument(floating));
+      const tabbableIndex = tabbableContent.indexOf(activeEl);
+      if (tabbableIndex !== -1) {
+        tabbableIndexRef.current = tabbableIndex;
+      }
+      if (orderRef.current.includes('floating') || activeEl !== refs.domReference.current && tabbableContent.length === 0) {
+        if (tabIndex !== '0') {
+          floatingFocusElement.setAttribute('tabindex', '0');
+        }
+      } else if (tabIndex !== '-1') {
+        floatingFocusElement.setAttribute('tabindex', '-1');
+      }
+    };
+    handleMutation();
+    const observer = new MutationObserver(handleMutation);
+    observer.observe(floatingFocusElement, {
+      childList: true,
+      subtree: true,
+      attributes: true
+    });
+    return () => {
+      observer.disconnect();
+    };
+  }, [disabled, floating, floatingFocusElement, refs, orderRef, getTabbableContent, ignoreInitialFocus]);
+  function renderDismissButton(location) {
+    if (disabled || !visuallyHiddenDismiss || !modal) {
+      return null;
+    }
+    return /*#__PURE__*/React.createElement(VisuallyHiddenDismiss, {
+      ref: location === 'start' ? startDismissButtonRef : endDismissButtonRef,
+      onClick: event => onOpenChange(false, event.nativeEvent)
+    }, typeof visuallyHiddenDismiss === 'string' ? visuallyHiddenDismiss : 'Dismiss');
+  }
+  const shouldRenderGuards = !disabled && guards && (modal ? !isUntrappedTypeableCombobox : true) && (isInsidePortal || modal);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, shouldRenderGuards && /*#__PURE__*/React.createElement(FocusGuard, {
+    "data-type": "inside",
+    ref: portalContext == null ? void 0 : portalContext.beforeInsideRef,
+    onFocus: event => {
+      if (modal) {
+        const els = getTabbableElements();
+        enqueueFocus(order[0] === 'reference' ? els[0] : els[els.length - 1]);
+      } else if (portalContext != null && portalContext.preserveTabOrder && portalContext.portalNode) {
+        preventReturnFocusRef.current = false;
+        if (isOutsideEvent(event, portalContext.portalNode)) {
+          const nextTabbable = getNextTabbable() || domReference;
+          nextTabbable == null || nextTabbable.focus();
+        } else {
+          var _portalContext$before;
+          (_portalContext$before = portalContext.beforeOutsideRef.current) == null || _portalContext$before.focus();
+        }
+      }
+    }
+  }), !isUntrappedTypeableCombobox && renderDismissButton('start'), children, renderDismissButton('end'), shouldRenderGuards && /*#__PURE__*/React.createElement(FocusGuard, {
+    "data-type": "inside",
+    ref: portalContext == null ? void 0 : portalContext.afterInsideRef,
+    onFocus: event => {
+      if (modal) {
+        enqueueFocus(getTabbableElements()[0]);
+      } else if (portalContext != null && portalContext.preserveTabOrder && portalContext.portalNode) {
+        if (closeOnFocusOut) {
+          preventReturnFocusRef.current = true;
+        }
+        if (isOutsideEvent(event, portalContext.portalNode)) {
+          const prevTabbable = getPreviousTabbable() || domReference;
+          prevTabbable == null || prevTabbable.focus();
+        } else {
+          var _portalContext$afterO;
+          (_portalContext$afterO = portalContext.afterOutsideRef.current) == null || _portalContext$afterO.focus();
+        }
+      }
+    }
+  }));
+}
+
+function isButtonTarget(event) {
+  return isHTMLElement(event.target) && event.target.tagName === 'BUTTON';
+}
+function isSpaceIgnored(element) {
+  return isTypeableElement(element);
+}
+/**
+ * Opens or closes the floating element when clicking the reference element.
+ * @see https://floating-ui.com/docs/useClick
+ */
+function useClick(context, props) {
+  if (props === void 0) {
+    props = {};
+  }
+  const {
+    open,
+    onOpenChange,
+    dataRef,
+    elements: {
+      domReference
+    }
+  } = context;
+  const {
+    enabled = true,
+    event: eventOption = 'click',
+    toggle = true,
+    ignoreMouse = false,
+    keyboardHandlers = true,
+    stickIfOpen = true
+  } = props;
+  const pointerTypeRef = React.useRef();
+  const didKeyDownRef = React.useRef(false);
+  const reference = React.useMemo(() => ({
+    onPointerDown(event) {
+      pointerTypeRef.current = event.pointerType;
+    },
+    onMouseDown(event) {
+      const pointerType = pointerTypeRef.current;
+
+      // Ignore all buttons except for the "main" button.
+      // https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
+      if (event.button !== 0) return;
+      if (eventOption === 'click') return;
+      if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
+      if (open && toggle && (dataRef.current.openEvent && stickIfOpen ? dataRef.current.openEvent.type === 'mousedown' : true)) {
+        onOpenChange(false, event.nativeEvent, 'click');
+      } else {
+        // Prevent stealing focus from the floating element
+        event.preventDefault();
+        onOpenChange(true, event.nativeEvent, 'click');
+      }
+    },
+    onClick(event) {
+      const pointerType = pointerTypeRef.current;
+      if (eventOption === 'mousedown' && pointerTypeRef.current) {
+        pointerTypeRef.current = undefined;
+        return;
+      }
+      if (isMouseLikePointerType(pointerType, true) && ignoreMouse) return;
+      if (open && toggle && (dataRef.current.openEvent && stickIfOpen ? dataRef.current.openEvent.type === 'click' : true)) {
+        onOpenChange(false, event.nativeEvent, 'click');
+      } else {
+        onOpenChange(true, event.nativeEvent, 'click');
+      }
+    },
+    onKeyDown(event) {
+      pointerTypeRef.current = undefined;
+      if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event)) {
+        return;
+      }
+      if (event.key === ' ' && !isSpaceIgnored(domReference)) {
+        // Prevent scrolling
+        event.preventDefault();
+        didKeyDownRef.current = true;
+      }
+      if (event.key === 'Enter') {
+        if (open && toggle) {
+          onOpenChange(false, event.nativeEvent, 'click');
+        } else {
+          onOpenChange(true, event.nativeEvent, 'click');
+        }
+      }
+    },
+    onKeyUp(event) {
+      if (event.defaultPrevented || !keyboardHandlers || isButtonTarget(event) || isSpaceIgnored(domReference)) {
+        return;
+      }
+      if (event.key === ' ' && didKeyDownRef.current) {
+        didKeyDownRef.current = false;
+        if (open && toggle) {
+          onOpenChange(false, event.nativeEvent, 'click');
+        } else {
+          onOpenChange(true, event.nativeEvent, 'click');
+        }
+      }
+    }
+  }), [dataRef, domReference, eventOption, ignoreMouse, keyboardHandlers, onOpenChange, open, stickIfOpen, toggle]);
+  return React.useMemo(() => enabled ? {
+    reference
+  } : {}, [enabled, reference]);
+}
+
+const bubbleHandlerKeys = {
+  pointerdown: 'onPointerDown',
+  mousedown: 'onMouseDown',
+  click: 'onClick'
+};
+const captureHandlerKeys = {
+  pointerdown: 'onPointerDownCapture',
+  mousedown: 'onMouseDownCapture',
+  click: 'onClickCapture'
+};
+const normalizeProp = normalizable => {
+  var _normalizable$escapeK, _normalizable$outside;
+  return {
+    escapeKey: typeof normalizable === 'boolean' ? normalizable : (_normalizable$escapeK = normalizable == null ? void 0 : normalizable.escapeKey) != null ? _normalizable$escapeK : false,
+    outsidePress: typeof normalizable === 'boolean' ? normalizable : (_normalizable$outside = normalizable == null ? void 0 : normalizable.outsidePress) != null ? _normalizable$outside : true
+  };
+};
+/**
+ * Closes the floating element when a dismissal is requested — by default, when
+ * the user presses the `escape` key or outside of the floating element.
+ * @see https://floating-ui.com/docs/useDismiss
+ */
+function useDismiss(context, props) {
+  if (props === void 0) {
+    props = {};
+  }
+  const {
+    open,
+    onOpenChange,
+    elements,
+    dataRef
+  } = context;
+  const {
+    enabled = true,
+    escapeKey = true,
+    outsidePress: unstable_outsidePress = true,
+    outsidePressEvent = 'pointerdown',
+    referencePress = false,
+    referencePressEvent = 'pointerdown',
+    ancestorScroll = false,
+    bubbles,
+    capture
+  } = props;
+  const tree = useFloatingTree();
+  const outsidePressFn = useEffectEvent(typeof unstable_outsidePress === 'function' ? unstable_outsidePress : () => false);
+  const outsidePress = typeof unstable_outsidePress === 'function' ? outsidePressFn : unstable_outsidePress;
+  const insideReactTreeRef = React.useRef(false);
+  const endedOrStartedInsideRef = React.useRef(false);
+  const {
+    escapeKey: escapeKeyBubbles,
+    outsidePress: outsidePressBubbles
+  } = normalizeProp(bubbles);
+  const {
+    escapeKey: escapeKeyCapture,
+    outsidePress: outsidePressCapture
+  } = normalizeProp(capture);
+  const isComposingRef = React.useRef(false);
+  const closeOnEscapeKeyDown = useEffectEvent(event => {
+    var _dataRef$current$floa;
+    if (!open || !enabled || !escapeKey || event.key !== 'Escape') {
+      return;
+    }
+
+    // Wait until IME is settled. Pressing `Escape` while composing should
+    // close the compose menu, but not the floating element.
+    if (isComposingRef.current) {
+      return;
+    }
+    const nodeId = (_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.nodeId;
+    const children = tree ? getChildren(tree.nodesRef.current, nodeId) : [];
+    if (!escapeKeyBubbles) {
+      event.stopPropagation();
+      if (children.length > 0) {
+        let shouldDismiss = true;
+        children.forEach(child => {
+          var _child$context;
+          if ((_child$context = child.context) != null && _child$context.open && !child.context.dataRef.current.__escapeKeyBubbles) {
+            shouldDismiss = false;
+            return;
+          }
+        });
+        if (!shouldDismiss) {
+          return;
+        }
+      }
+    }
+    onOpenChange(false, isReactEvent(event) ? event.nativeEvent : event, 'escape-key');
+  });
+  const closeOnEscapeKeyDownCapture = useEffectEvent(event => {
+    var _getTarget2;
+    const callback = () => {
+      var _getTarget;
+      closeOnEscapeKeyDown(event);
+      (_getTarget = getTarget(event)) == null || _getTarget.removeEventListener('keydown', callback);
+    };
+    (_getTarget2 = getTarget(event)) == null || _getTarget2.addEventListener('keydown', callback);
+  });
+  const closeOnPressOutside = useEffectEvent(event => {
+    var _dataRef$current$floa2;
+    // Given developers can stop the propagation of the synthetic event,
+    // we can only be confident with a positive value.
+    const insideReactTree = insideReactTreeRef.current;
+    insideReactTreeRef.current = false;
+
+    // When click outside is lazy (`click` event), handle dragging.
+    // Don't close if:
+    // - The click started inside the floating element.
+    // - The click ended inside the floating element.
+    const endedOrStartedInside = endedOrStartedInsideRef.current;
+    endedOrStartedInsideRef.current = false;
+    if (outsidePressEvent === 'click' && endedOrStartedInside) {
+      return;
+    }
+    if (insideReactTree) {
+      return;
+    }
+    if (typeof outsidePress === 'function' && !outsidePress(event)) {
+      return;
+    }
+    const target = getTarget(event);
+    const inertSelector = "[" + createAttribute('inert') + "]";
+    const markers = getDocument(elements.floating).querySelectorAll(inertSelector);
+    let targetRootAncestor = isElement(target) ? target : null;
+    while (targetRootAncestor && !isLastTraversableNode(targetRootAncestor)) {
+      const nextParent = getParentNode(targetRootAncestor);
+      if (isLastTraversableNode(nextParent) || !isElement(nextParent)) {
+        break;
+      }
+      targetRootAncestor = nextParent;
+    }
+
+    // Check if the click occurred on a third-party element injected after the
+    // floating element rendered.
+    if (markers.length && isElement(target) && !isRootElement(target) &&
+    // Clicked on a direct ancestor (e.g. FloatingOverlay).
+    !contains(target, elements.floating) &&
+    // If the target root element contains none of the markers, then the
+    // element was injected after the floating element rendered.
+    Array.from(markers).every(marker => !contains(targetRootAncestor, marker))) {
+      return;
+    }
+
+    // Check if the click occurred on the scrollbar
+    if (isHTMLElement(target) && floating) {
+      // In Firefox, `target.scrollWidth > target.clientWidth` for inline
+      // elements.
+      const canScrollX = target.clientWidth > 0 && target.scrollWidth > target.clientWidth;
+      const canScrollY = target.clientHeight > 0 && target.scrollHeight > target.clientHeight;
+      let xCond = canScrollY && event.offsetX > target.clientWidth;
+
+      // In some browsers it is possible to change the <body> (or window)
+      // scrollbar to the left side, but is very rare and is difficult to
+      // check for. Plus, for modal dialogs with backdrops, it is more
+      // important that the backdrop is checked but not so much the window.
+      if (canScrollY) {
+        const isRTL = getComputedStyle(target).direction === 'rtl';
+        if (isRTL) {
+          xCond = event.offsetX <= target.offsetWidth - target.clientWidth;
+        }
+      }
+      if (xCond || canScrollX && event.offsetY > target.clientHeight) {
+        return;
+      }
+    }
+    const nodeId = (_dataRef$current$floa2 = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa2.nodeId;
+    const targetIsInsideChildren = tree && getChildren(tree.nodesRef.current, nodeId).some(node => {
+      var _node$context;
+      return isEventTargetWithin(event, (_node$context = node.context) == null ? void 0 : _node$context.elements.floating);
+    });
+    if (isEventTargetWithin(event, elements.floating) || isEventTargetWithin(event, elements.domReference) || targetIsInsideChildren) {
+      return;
+    }
+    const children = tree ? getChildren(tree.nodesRef.current, nodeId) : [];
+    if (children.length > 0) {
+      let shouldDismiss = true;
+      children.forEach(child => {
+        var _child$context2;
+        if ((_child$context2 = child.context) != null && _child$context2.open && !child.context.dataRef.current.__outsidePressBubbles) {
+          shouldDismiss = false;
+          return;
+        }
+      });
+      if (!shouldDismiss) {
+        return;
+      }
+    }
+    onOpenChange(false, event, 'outside-press');
+  });
+  const closeOnPressOutsideCapture = useEffectEvent(event => {
+    var _getTarget4;
+    const callback = () => {
+      var _getTarget3;
+      closeOnPressOutside(event);
+      (_getTarget3 = getTarget(event)) == null || _getTarget3.removeEventListener(outsidePressEvent, callback);
+    };
+    (_getTarget4 = getTarget(event)) == null || _getTarget4.addEventListener(outsidePressEvent, callback);
+  });
+  React.useEffect(() => {
+    if (!open || !enabled) {
+      return;
+    }
+    dataRef.current.__escapeKeyBubbles = escapeKeyBubbles;
+    dataRef.current.__outsidePressBubbles = outsidePressBubbles;
+    let compositionTimeout = -1;
+    function onScroll(event) {
+      onOpenChange(false, event, 'ancestor-scroll');
+    }
+    function handleCompositionStart() {
+      window.clearTimeout(compositionTimeout);
+      isComposingRef.current = true;
+    }
+    function handleCompositionEnd() {
+      // Safari fires `compositionend` before `keydown`, so we need to wait
+      // until the next tick to set `isComposing` to `false`.
+      // https://bugs.webkit.org/show_bug.cgi?id=165004
+      compositionTimeout = window.setTimeout(() => {
+        isComposingRef.current = false;
+      },
+      // 0ms or 1ms don't work in Safari. 5ms appears to consistently work.
+      // Only apply to WebKit for the test to remain 0ms.
+      isWebKit() ? 5 : 0);
+    }
+    const doc = getDocument(elements.floating);
+    if (escapeKey) {
+      doc.addEventListener('keydown', escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture);
+      doc.addEventListener('compositionstart', handleCompositionStart);
+      doc.addEventListener('compositionend', handleCompositionEnd);
+    }
+    outsidePress && doc.addEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
+    let ancestors = [];
+    if (ancestorScroll) {
+      if (isElement(elements.domReference)) {
+        ancestors = getOverflowAncestors(elements.domReference);
+      }
+      if (isElement(elements.floating)) {
+        ancestors = ancestors.concat(getOverflowAncestors(elements.floating));
+      }
+      if (!isElement(elements.reference) && elements.reference && elements.reference.contextElement) {
+        ancestors = ancestors.concat(getOverflowAncestors(elements.reference.contextElement));
+      }
+    }
+
+    // Ignore the visual viewport for scrolling dismissal (allow pinch-zoom)
+    ancestors = ancestors.filter(ancestor => {
+      var _doc$defaultView;
+      return ancestor !== ((_doc$defaultView = doc.defaultView) == null ? void 0 : _doc$defaultView.visualViewport);
+    });
+    ancestors.forEach(ancestor => {
+      ancestor.addEventListener('scroll', onScroll, {
+        passive: true
+      });
+    });
+    return () => {
+      if (escapeKey) {
+        doc.removeEventListener('keydown', escapeKeyCapture ? closeOnEscapeKeyDownCapture : closeOnEscapeKeyDown, escapeKeyCapture);
+        doc.removeEventListener('compositionstart', handleCompositionStart);
+        doc.removeEventListener('compositionend', handleCompositionEnd);
+      }
+      outsidePress && doc.removeEventListener(outsidePressEvent, outsidePressCapture ? closeOnPressOutsideCapture : closeOnPressOutside, outsidePressCapture);
+      ancestors.forEach(ancestor => {
+        ancestor.removeEventListener('scroll', onScroll);
+      });
+      window.clearTimeout(compositionTimeout);
+    };
+  }, [dataRef, elements, escapeKey, outsidePress, outsidePressEvent, open, onOpenChange, ancestorScroll, enabled, escapeKeyBubbles, outsidePressBubbles, closeOnEscapeKeyDown, escapeKeyCapture, closeOnEscapeKeyDownCapture, closeOnPressOutside, outsidePressCapture, closeOnPressOutsideCapture]);
+  React.useEffect(() => {
+    insideReactTreeRef.current = false;
+  }, [outsidePress, outsidePressEvent]);
+  const reference = React.useMemo(() => ({
+    onKeyDown: closeOnEscapeKeyDown,
+    [bubbleHandlerKeys[referencePressEvent]]: event => {
+      if (referencePress) {
+        onOpenChange(false, event.nativeEvent, 'reference-press');
+      }
+    }
+  }), [closeOnEscapeKeyDown, onOpenChange, referencePress, referencePressEvent]);
+  const floating = React.useMemo(() => ({
+    onKeyDown: closeOnEscapeKeyDown,
+    onMouseDown() {
+      endedOrStartedInsideRef.current = true;
+    },
+    onMouseUp() {
+      endedOrStartedInsideRef.current = true;
+    },
+    [captureHandlerKeys[outsidePressEvent]]: () => {
+      insideReactTreeRef.current = true;
+    }
+  }), [closeOnEscapeKeyDown, outsidePressEvent]);
+  return React.useMemo(() => enabled ? {
+    reference,
+    floating
+  } : {}, [enabled, reference, floating]);
+}
+
+function useFloatingRootContext(options) {
+  const {
+    open = false,
+    onOpenChange: onOpenChangeProp,
+    elements: elementsProp
+  } = options;
+  const floatingId = useId();
+  const dataRef = React.useRef({});
+  const [events] = React.useState(() => createPubSub());
+  const nested = useFloatingParentNodeId() != null;
+  if (process.env.NODE_ENV !== "production") {
+    const optionDomReference = elementsProp.reference;
+    if (optionDomReference && !isElement(optionDomReference)) {
+      error('Cannot pass a virtual element to the `elements.reference` option,', 'as it must be a real DOM element. Use `refs.setPositionReference()`', 'instead.');
+    }
+  }
+  const [positionReference, setPositionReference] = React.useState(elementsProp.reference);
+  const onOpenChange = useEffectEvent((open, event, reason) => {
+    dataRef.current.openEvent = open ? event : undefined;
+    events.emit('openchange', {
+      open,
+      event,
+      reason,
+      nested
+    });
+    onOpenChangeProp == null || onOpenChangeProp(open, event, reason);
+  });
+  const refs = React.useMemo(() => ({
+    setPositionReference
+  }), []);
+  const elements = React.useMemo(() => ({
+    reference: positionReference || elementsProp.reference || null,
+    floating: elementsProp.floating || null,
+    domReference: elementsProp.reference
+  }), [positionReference, elementsProp.reference, elementsProp.floating]);
+  return React.useMemo(() => ({
+    dataRef,
+    open,
+    onOpenChange,
+    elements,
+    events,
+    floatingId,
+    refs
+  }), [open, onOpenChange, elements, events, floatingId, refs]);
+}
+
+/**
+ * Provides data to position a floating element and context to add interactions.
+ * @see https://floating-ui.com/docs/useFloating
+ */
+function useFloating(options) {
+  if (options === void 0) {
+    options = {};
+  }
+  const {
+    nodeId
+  } = options;
+  const internalRootContext = useFloatingRootContext({
+    ...options,
+    elements: {
+      reference: null,
+      floating: null,
+      ...options.elements
+    }
+  });
+  const rootContext = options.rootContext || internalRootContext;
+  const computedElements = rootContext.elements;
+  const [_domReference, setDomReference] = React.useState(null);
+  const [positionReference, _setPositionReference] = React.useState(null);
+  const optionDomReference = computedElements == null ? void 0 : computedElements.domReference;
+  const domReference = optionDomReference || _domReference;
+  const domReferenceRef = React.useRef(null);
+  const tree = useFloatingTree();
+  index(() => {
+    if (domReference) {
+      domReferenceRef.current = domReference;
+    }
+  }, [domReference]);
+  const position = useFloating$1({
+    ...options,
+    elements: {
+      ...computedElements,
+      ...(positionReference && {
+        reference: positionReference
+      })
+    }
+  });
+  const setPositionReference = React.useCallback(node => {
+    const computedPositionReference = isElement(node) ? {
+      getBoundingClientRect: () => node.getBoundingClientRect(),
+      contextElement: node
+    } : node;
+    // Store the positionReference in state if the DOM reference is specified externally via the
+    // `elements.reference` option. This ensures that it won't be overridden on future renders.
+    _setPositionReference(computedPositionReference);
+    position.refs.setReference(computedPositionReference);
+  }, [position.refs]);
+  const setReference = React.useCallback(node => {
+    if (isElement(node) || node === null) {
+      domReferenceRef.current = node;
+      setDomReference(node);
+    }
+
+    // Backwards-compatibility for passing a virtual element to `reference`
+    // after it has set the DOM reference.
+    if (isElement(position.refs.reference.current) || position.refs.reference.current === null ||
+    // Don't allow setting virtual elements using the old technique back to
+    // `null` to support `positionReference` + an unstable `reference`
+    // callback ref.
+    node !== null && !isElement(node)) {
+      position.refs.setReference(node);
+    }
+  }, [position.refs]);
+  const refs = React.useMemo(() => ({
+    ...position.refs,
+    setReference,
+    setPositionReference,
+    domReference: domReferenceRef
+  }), [position.refs, setReference, setPositionReference]);
+  const elements = React.useMemo(() => ({
+    ...position.elements,
+    domReference: domReference
+  }), [position.elements, domReference]);
+  const context = React.useMemo(() => ({
+    ...position,
+    ...rootContext,
+    refs,
+    elements,
+    nodeId
+  }), [position, refs, elements, nodeId, rootContext]);
+  index(() => {
+    rootContext.dataRef.current.floatingContext = context;
+    const node = tree == null ? void 0 : tree.nodesRef.current.find(node => node.id === nodeId);
+    if (node) {
+      node.context = context;
+    }
+  });
+  return React.useMemo(() => ({
+    ...position,
+    context,
+    refs,
+    elements
+  }), [position, refs, elements, context]);
+}
+
+/**
+ * Opens the floating element while the reference element has focus, like CSS
+ * `:focus`.
+ * @see https://floating-ui.com/docs/useFocus
+ */
+function useFocus(context, props) {
+  if (props === void 0) {
+    props = {};
+  }
+  const {
+    open,
+    onOpenChange,
+    events,
+    dataRef,
+    elements
+  } = context;
+  const {
+    enabled = true,
+    visibleOnly = true
+  } = props;
+  const blockFocusRef = React.useRef(false);
+  const timeoutRef = React.useRef();
+  const keyboardModalityRef = React.useRef(true);
+  React.useEffect(() => {
+    if (!enabled) return;
+    const win = getWindow(elements.domReference);
+
+    // If the reference was focused and the user left the tab/window, and the
+    // floating element was not open, the focus should be blocked when they
+    // return to the tab/window.
+    function onBlur() {
+      if (!open && isHTMLElement(elements.domReference) && elements.domReference === activeElement(getDocument(elements.domReference))) {
+        blockFocusRef.current = true;
+      }
+    }
+    function onKeyDown() {
+      keyboardModalityRef.current = true;
+    }
+    win.addEventListener('blur', onBlur);
+    win.addEventListener('keydown', onKeyDown, true);
+    return () => {
+      win.removeEventListener('blur', onBlur);
+      win.removeEventListener('keydown', onKeyDown, true);
+    };
+  }, [elements.domReference, open, enabled]);
+  React.useEffect(() => {
+    if (!enabled) return;
+    function onOpenChange(_ref) {
+      let {
+        reason
+      } = _ref;
+      if (reason === 'reference-press' || reason === 'escape-key') {
+        blockFocusRef.current = true;
+      }
+    }
+    events.on('openchange', onOpenChange);
+    return () => {
+      events.off('openchange', onOpenChange);
+    };
+  }, [events, enabled]);
+  React.useEffect(() => {
+    return () => {
+      clearTimeout(timeoutRef.current);
+    };
+  }, []);
+  const reference = React.useMemo(() => ({
+    onPointerDown(event) {
+      if (isVirtualPointerEvent(event.nativeEvent)) return;
+      keyboardModalityRef.current = false;
+    },
+    onMouseLeave() {
+      blockFocusRef.current = false;
+    },
+    onFocus(event) {
+      if (blockFocusRef.current) return;
+      const target = getTarget(event.nativeEvent);
+      if (visibleOnly && isElement(target)) {
+        try {
+          // Mac Safari unreliably matches `:focus-visible` on the reference
+          // if focus was outside the page initially - use the fallback
+          // instead.
+          if (isSafari() && isMac()) throw Error();
+          if (!target.matches(':focus-visible')) return;
+        } catch (e) {
+          // Old browsers will throw an error when using `:focus-visible`.
+          if (!keyboardModalityRef.current && !isTypeableElement(target)) {
+            return;
+          }
+        }
+      }
+      onOpenChange(true, event.nativeEvent, 'focus');
+    },
+    onBlur(event) {
+      blockFocusRef.current = false;
+      const relatedTarget = event.relatedTarget;
+      const nativeEvent = event.nativeEvent;
+
+      // Hit the non-modal focus management portal guard. Focus will be
+      // moved into the floating element immediately after.
+      const movedToFocusGuard = isElement(relatedTarget) && relatedTarget.hasAttribute(createAttribute('focus-guard')) && relatedTarget.getAttribute('data-type') === 'outside';
+
+      // Wait for the window blur listener to fire.
+      timeoutRef.current = window.setTimeout(() => {
+        var _dataRef$current$floa;
+        const activeEl = activeElement(elements.domReference ? elements.domReference.ownerDocument : document);
+
+        // Focus left the page, keep it open.
+        if (!relatedTarget && activeEl === elements.domReference) return;
+
+        // When focusing the reference element (e.g. regular click), then
+        // clicking into the floating element, prevent it from hiding.
+        // Note: it must be focusable, e.g. `tabindex="-1"`.
+        // We can not rely on relatedTarget to point to the correct element
+        // as it will only point to the shadow host of the newly focused element
+        // and not the element that actually has received focus if it is located
+        // inside a shadow root.
+        if (contains((_dataRef$current$floa = dataRef.current.floatingContext) == null ? void 0 : _dataRef$current$floa.refs.floating.current, activeEl) || contains(elements.domReference, activeEl) || movedToFocusGuard) {
+          return;
+        }
+        onOpenChange(false, nativeEvent, 'focus');
+      });
+    }
+  }), [dataRef, elements.domReference, onOpenChange, visibleOnly]);
+  return React.useMemo(() => enabled ? {
+    reference
+  } : {}, [enabled, reference]);
+}
+
+const ACTIVE_KEY = 'active';
+const SELECTED_KEY = 'selected';
+function mergeProps(userProps, propsList, elementKey) {
+  const map = new Map();
+  const isItem = elementKey === 'item';
+  let domUserProps = userProps;
+  if (isItem && userProps) {
+    const {
+      [ACTIVE_KEY]: _,
+      [SELECTED_KEY]: __,
+      ...validProps
+    } = userProps;
+    domUserProps = validProps;
+  }
+  return {
+    ...(elementKey === 'floating' && {
+      tabIndex: -1,
+      [FOCUSABLE_ATTRIBUTE]: ''
+    }),
+    ...domUserProps,
+    ...propsList.map(value => {
+      const propsOrGetProps = value ? value[elementKey] : null;
+      if (typeof propsOrGetProps === 'function') {
+        return userProps ? propsOrGetProps(userProps) : null;
+      }
+      return propsOrGetProps;
+    }).concat(userProps).reduce((acc, props) => {
+      if (!props) {
+        return acc;
+      }
+      Object.entries(props).forEach(_ref => {
+        let [key, value] = _ref;
+        if (isItem && [ACTIVE_KEY, SELECTED_KEY].includes(key)) {
+          return;
+        }
+        if (key.indexOf('on') === 0) {
+          if (!map.has(key)) {
+            map.set(key, []);
+          }
+          if (typeof value === 'function') {
+            var _map$get;
+            (_map$get = map.get(key)) == null || _map$get.push(value);
+            acc[key] = function () {
+              var _map$get2;
+              for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+                args[_key] = arguments[_key];
+              }
+              return (_map$get2 = map.get(key)) == null ? void 0 : _map$get2.map(fn => fn(...args)).find(val => val !== undefined);
+            };
+          }
+        } else {
+          acc[key] = value;
+        }
+      });
+      return acc;
+    }, {})
+  };
+}
+/**
+ * Merges an array of interaction hooks' props into prop getters, allowing
+ * event handler functions to be composed together without overwriting one
+ * another.
+ * @see https://floating-ui.com/docs/useInteractions
+ */
+function useInteractions(propsList) {
+  if (propsList === void 0) {
+    propsList = [];
+  }
+  const referenceDeps = propsList.map(key => key == null ? void 0 : key.reference);
+  const floatingDeps = propsList.map(key => key == null ? void 0 : key.floating);
+  const itemDeps = propsList.map(key => key == null ? void 0 : key.item);
+  const getReferenceProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'reference'),
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  referenceDeps);
+  const getFloatingProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'floating'),
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  floatingDeps);
+  const getItemProps = React.useCallback(userProps => mergeProps(userProps, propsList, 'item'),
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  itemDeps);
+  return React.useMemo(() => ({
+    getReferenceProps,
+    getFloatingProps,
+    getItemProps
+  }), [getReferenceProps, getFloatingProps, getItemProps]);
+}
+
+const componentRoleToAriaRoleMap = /*#__PURE__*/new Map([['select', 'listbox'], ['combobox', 'listbox'], ['label', false]]);
+
+/**
+ * Adds base screen reader props to the reference and floating elements for a
+ * given floating element `role`.
+ * @see https://floating-ui.com/docs/useRole
+ */
+function useRole(context, props) {
+  var _componentRoleToAriaR;
+  if (props === void 0) {
+    props = {};
+  }
+  const {
+    open,
+    floatingId
+  } = context;
+  const {
+    enabled = true,
+    role = 'dialog'
+  } = props;
+  const ariaRole = (_componentRoleToAriaR = componentRoleToAriaRoleMap.get(role)) != null ? _componentRoleToAriaR : role;
+  const referenceId = useId();
+  const parentId = useFloatingParentNodeId();
+  const isNested = parentId != null;
+  const reference = React.useMemo(() => {
+    if (ariaRole === 'tooltip' || role === 'label') {
+      return {
+        ["aria-" + (role === 'label' ? 'labelledby' : 'describedby')]: open ? floatingId : undefined
+      };
+    }
+    return {
+      'aria-expanded': open ? 'true' : 'false',
+      'aria-haspopup': ariaRole === 'alertdialog' ? 'dialog' : ariaRole,
+      'aria-controls': open ? floatingId : undefined,
+      ...(ariaRole === 'listbox' && {
+        role: 'combobox'
+      }),
+      ...(ariaRole === 'menu' && {
+        id: referenceId
+      }),
+      ...(ariaRole === 'menu' && isNested && {
+        role: 'menuitem'
+      }),
+      ...(role === 'select' && {
+        'aria-autocomplete': 'none'
+      }),
+      ...(role === 'combobox' && {
+        'aria-autocomplete': 'list'
+      })
+    };
+  }, [ariaRole, floatingId, isNested, open, referenceId, role]);
+  const floating = React.useMemo(() => {
+    const floatingProps = {
+      id: floatingId,
+      ...(ariaRole && {
+        role: ariaRole
+      })
+    };
+    if (ariaRole === 'tooltip' || role === 'label') {
+      return floatingProps;
+    }
+    return {
+      ...floatingProps,
+      ...(ariaRole === 'menu' && {
+        'aria-labelledby': referenceId
+      })
+    };
+  }, [ariaRole, floatingId, referenceId, role]);
+  const item = React.useCallback(_ref => {
+    let {
+      active,
+      selected
+    } = _ref;
+    const commonProps = {
+      role: 'option',
+      ...(active && {
+        id: floatingId + "-option"
+      })
+    };
+
+    // For `menu`, we are unable to tell if the item is a `menuitemradio`
+    // or `menuitemcheckbox`. For backwards-compatibility reasons, also
+    // avoid defaulting to `menuitem` as it may overwrite custom role props.
+    switch (role) {
+      case 'select':
+        return {
+          ...commonProps,
+          'aria-selected': active && selected
+        };
+      case 'combobox':
+        {
+          return {
+            ...commonProps,
+            ...(active && {
+              'aria-selected': true
+            })
+          };
+        }
+    }
+    return {};
+  }, [floatingId, role]);
+  return React.useMemo(() => enabled ? {
+    reference,
+    floating,
+    item
+  } : {}, [enabled, reference, floating, item]);
+}
+
+function isPointInPolygon(point, polygon) {
+  const [x, y] = point;
+  let isInside = false;
+  const length = polygon.length;
+  for (let i = 0, j = length - 1; i < length; j = i++) {
+    const [xi, yi] = polygon[i] || [0, 0];
+    const [xj, yj] = polygon[j] || [0, 0];
+    const intersect = yi >= y !== yj >= y && x <= (xj - xi) * (y - yi) / (yj - yi) + xi;
+    if (intersect) {
+      isInside = !isInside;
+    }
+  }
+  return isInside;
+}
+function isInside(point, rect) {
+  return point[0] >= rect.x && point[0] <= rect.x + rect.width && point[1] >= rect.y && point[1] <= rect.y + rect.height;
+}
+/**
+ * Generates a safe polygon area that the user can traverse without closing the
+ * floating element once leaving the reference element.
+ * @see https://floating-ui.com/docs/useHover#safepolygon
+ */
+function safePolygon(options) {
+  if (options === void 0) {
+    options = {};
+  }
+  const {
+    buffer = 0.5,
+    blockPointerEvents = false,
+    requireIntent = true
+  } = options;
+  let timeoutId;
+  let hasLanded = false;
+  let lastX = null;
+  let lastY = null;
+  let lastCursorTime = performance.now();
+  function getCursorSpeed(x, y) {
+    const currentTime = performance.now();
+    const elapsedTime = currentTime - lastCursorTime;
+    if (lastX === null || lastY === null || elapsedTime === 0) {
+      lastX = x;
+      lastY = y;
+      lastCursorTime = currentTime;
+      return null;
+    }
+    const deltaX = x - lastX;
+    const deltaY = y - lastY;
+    const distance = Math.sqrt(deltaX * deltaX + deltaY * deltaY);
+    const speed = distance / elapsedTime; // px / ms
+
+    lastX = x;
+    lastY = y;
+    lastCursorTime = currentTime;
+    return speed;
+  }
+  const fn = _ref => {
+    let {
+      x,
+      y,
+      placement,
+      elements,
+      onClose,
+      nodeId,
+      tree
+    } = _ref;
+    return function onMouseMove(event) {
+      function close() {
+        clearTimeout(timeoutId);
+        onClose();
+      }
+      clearTimeout(timeoutId);
+      if (!elements.domReference || !elements.floating || placement == null || x == null || y == null) {
+        return;
+      }
+      const {
+        clientX,
+        clientY
+      } = event;
+      const clientPoint = [clientX, clientY];
+      const target = getTarget(event);
+      const isLeave = event.type === 'mouseleave';
+      const isOverFloatingEl = contains(elements.floating, target);
+      const isOverReferenceEl = contains(elements.domReference, target);
+      const refRect = elements.domReference.getBoundingClientRect();
+      const rect = elements.floating.getBoundingClientRect();
+      const side = placement.split('-')[0];
+      const cursorLeaveFromRight = x > rect.right - rect.width / 2;
+      const cursorLeaveFromBottom = y > rect.bottom - rect.height / 2;
+      const isOverReferenceRect = isInside(clientPoint, refRect);
+      const isFloatingWider = rect.width > refRect.width;
+      const isFloatingTaller = rect.height > refRect.height;
+      const left = (isFloatingWider ? refRect : rect).left;
+      const right = (isFloatingWider ? refRect : rect).right;
+      const top = (isFloatingTaller ? refRect : rect).top;
+      const bottom = (isFloatingTaller ? refRect : rect).bottom;
+      if (isOverFloatingEl) {
+        hasLanded = true;
+        if (!isLeave) {
+          return;
+        }
+      }
+      if (isOverReferenceEl) {
+        hasLanded = false;
+      }
+      if (isOverReferenceEl && !isLeave) {
+        hasLanded = true;
+        return;
+      }
+
+      // Prevent overlapping floating element from being stuck in an open-close
+      // loop: https://github.com/floating-ui/floating-ui/issues/1910
+      if (isLeave && isElement(event.relatedTarget) && contains(elements.floating, event.relatedTarget)) {
+        return;
+      }
+
+      // If any nested child is open, abort.
+      if (tree && getChildren(tree.nodesRef.current, nodeId).some(_ref2 => {
+        let {
+          context
+        } = _ref2;
+        return context == null ? void 0 : context.open;
+      })) {
+        return;
+      }
+
+      // If the pointer is leaving from the opposite side, the "buffer" logic
+      // creates a point where the floating element remains open, but should be
+      // ignored.
+      // A constant of 1 handles floating point rounding errors.
+      if (side === 'top' && y >= refRect.bottom - 1 || side === 'bottom' && y <= refRect.top + 1 || side === 'left' && x >= refRect.right - 1 || side === 'right' && x <= refRect.left + 1) {
+        return close();
+      }
+
+      // Ignore when the cursor is within the rectangular trough between the
+      // two elements. Since the triangle is created from the cursor point,
+      // which can start beyond the ref element's edge, traversing back and
+      // forth from the ref to the floating element can cause it to close. This
+      // ensures it always remains open in that case.
+      let rectPoly = [];
+      switch (side) {
+        case 'top':
+          rectPoly = [[left, refRect.top + 1], [left, rect.bottom - 1], [right, rect.bottom - 1], [right, refRect.top + 1]];
+          break;
+        case 'bottom':
+          rectPoly = [[left, rect.top + 1], [left, refRect.bottom - 1], [right, refRect.bottom - 1], [right, rect.top + 1]];
+          break;
+        case 'left':
+          rectPoly = [[rect.right - 1, bottom], [rect.right - 1, top], [refRect.left + 1, top], [refRect.left + 1, bottom]];
+          break;
+        case 'right':
+          rectPoly = [[refRect.right - 1, bottom], [refRect.right - 1, top], [rect.left + 1, top], [rect.left + 1, bottom]];
+          break;
+      }
+      function getPolygon(_ref3) {
+        let [x, y] = _ref3;
+        switch (side) {
+          case 'top':
+            {
+              const cursorPointOne = [isFloatingWider ? x + buffer / 2 : cursorLeaveFromRight ? x + buffer * 4 : x - buffer * 4, y + buffer + 1];
+              const cursorPointTwo = [isFloatingWider ? x - buffer / 2 : cursorLeaveFromRight ? x + buffer * 4 : x - buffer * 4, y + buffer + 1];
+              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]];
+              return [cursorPointOne, cursorPointTwo, ...commonPoints];
+            }
+          case 'bottom':
+            {
+              const cursorPointOne = [isFloatingWider ? x + buffer / 2 : cursorLeaveFromRight ? x + buffer * 4 : x - buffer * 4, y - buffer];
+              const cursorPointTwo = [isFloatingWider ? x - buffer / 2 : cursorLeaveFromRight ? x + buffer * 4 : x - buffer * 4, 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]];
+              return [cursorPointOne, cursorPointTwo, ...commonPoints];
+            }
+          case 'left':
+            {
+              const cursorPointOne = [x + buffer + 1, isFloatingTaller ? y + buffer / 2 : cursorLeaveFromBottom ? y + buffer * 4 : y - buffer * 4];
+              const cursorPointTwo = [x + buffer + 1, isFloatingTaller ? y - buffer / 2 : cursorLeaveFromBottom ? y + buffer * 4 : y - buffer * 4];
+              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]];
+              return [...commonPoints, cursorPointOne, cursorPointTwo];
+            }
+          case 'right':
+            {
+              const cursorPointOne = [x - buffer, isFloatingTaller ? y + buffer / 2 : cursorLeaveFromBottom ? y + buffer * 4 : y - buffer * 4];
+              const cursorPointTwo = [x - buffer, isFloatingTaller ? y - buffer / 2 : cursorLeaveFromBottom ? y + buffer * 4 : y - buffer * 4];
+              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]];
+              return [cursorPointOne, cursorPointTwo, ...commonPoints];
+            }
+        }
+      }
+      if (isPointInPolygon([clientX, clientY], rectPoly)) {
+        return;
+      }
+      if (hasLanded && !isOverReferenceRect) {
+        return close();
+      }
+      if (!isLeave && requireIntent) {
+        const cursorSpeed = getCursorSpeed(event.clientX, event.clientY);
+        const cursorSpeedThreshold = 0.1;
+        if (cursorSpeed !== null && cursorSpeed < cursorSpeedThreshold) {
+          return close();
+        }
+      }
+      if (!isPointInPolygon([clientX, clientY], getPolygon([x, y]))) {
+        close();
+      } else if (!hasLanded && requireIntent) {
+        timeoutId = window.setTimeout(close, 40);
+      }
+    };
+  };
+  fn.__options = {
+    blockPointerEvents
+  };
+  return fn;
+}
+
+const PopoverContext = createContext(null);
+
+function usePopoverContext() {
+  const context = useContext(PopoverContext);
+  if (!context) {
+    throw new Error(
+      "Popover compound components must be used within a <Popover> component."
+    );
+  }
+  return context;
+}
+
+const PopoverClose = forwardRef(
+  function PopoverClose2(props, ref) {
+    const { onClick, ...rest } = props;
+    const { closePopover } = usePopoverContext();
+    const trackingId = useTrackingId({
+      name: "PopoverClose",
+      data: { children: childrenToString(props.children) },
+      hasOverride: !!props["data-tracking-id"]
+    });
+    const handleClick = useCallback(
+      (event) => {
+        closePopover();
+        onClick?.(event);
+      },
+      [closePopover, onClick]
+    );
+    return /* @__PURE__ */ jsx(
+      Button,
+      {
+        ref,
+        "data-tracking-id": trackingId,
+        "data-anv": "popover-close",
+        ...rest,
+        onClick: handleClick
+      }
+    );
+  }
+);
+PopoverClose.displayName = "PopoverClose";
+
+const PopoverButton = forwardRef(
+  function PopoverButton2(props, ref) {
+    const { children, ...rest } = props;
+    const { refs, getReferenceProps, openState, triggerId } = usePopoverContext();
+    const trackingId = useTrackingId({
+      name: "PopoverButton",
+      data: {
+        children: childrenToString(props.children),
+        appearance: props.appearance,
+        icon: props.icon,
+        size: props.size,
+        type: props.type
+      },
+      hasOverride: !!props["data-tracking-id"]
+    });
+    const buttonRef = useMergeRefs$1([refs.setReference, ref]);
+    const buttonProps = {
+      id: triggerId,
+      "data-anv": "popover-button",
+      "data-tracking-id": trackingId,
+      "data-state": openState ? "open" : "closed",
+      ...getReferenceProps(rest),
+      children
+    };
+    return /* @__PURE__ */ jsx(Button, { ref: buttonRef, ...buttonProps });
+  }
+);
+PopoverButton.displayName = "PopoverButton";
+
+const content = "_content_1nngh_1";
+const scroller = "_scroller_1nngh_78";
+const arrow = "_arrow_1nngh_93";
+const styles$1 = {
+	content: content,
+	scroller: scroller,
+	"no-padding": "_no-padding_1nngh_88",
+	arrow: arrow
+};
+
+const PopoverContent = forwardRef(
+  function PopoverContent2(props, ref) {
+    const {
+      children,
+      className,
+      style,
+      onScroll,
+      onScrollCapture,
+      scrollerRef,
+      hideWhileClosed = false,
+      ...rest
+    } = props;
+    const {
+      floatingContext,
+      refs,
+      floatingStyles,
+      middlewareData,
+      getFloatingProps,
+      openState,
+      actualPlacement,
+      arrowRef,
+      modal,
+      openOnHover,
+      noPadding,
+      enableCaret,
+      triggerId,
+      role
+    } = usePopoverContext();
+    const scrollContainerRef = useRef(null);
+    const mergedFloatingRef = useMergeRefs$1([refs.setFloating, ref]);
+    const mergedScrollerRef = useMergeRefs$1([scrollContainerRef, scrollerRef]);
+    const hasBeenOpenRef = useRef(false);
+    useEffect(() => {
+      if (openState) {
+        hasBeenOpenRef.current = true;
+      } else if (hasBeenOpenRef.current && !openOnHover) {
+        const activeEl = document.activeElement;
+        const floating = floatingContext.elements.floating;
+        const shouldReturnFocus = role === "dialog" ? !activeEl || activeEl === document.body || floating?.contains(activeEl) : floating?.contains(activeEl);
+        if (shouldReturnFocus) {
+          floatingContext.elements.reference?.focus();
+        }
+      }
+    }, [
+      openState,
+      openOnHover,
+      floatingContext.elements.reference,
+      floatingContext.elements.floating,
+      role
+    ]);
+    useLayoutEffect(() => {
+      if (openState && scrollContainerRef.current) {
+        scrollContainerRef.current.scrollTop = 0;
+        scrollContainerRef.current.scrollLeft = 0;
+      }
+    }, [openState]);
+    const arrowX = middlewareData.arrow?.x ?? null;
+    const arrowY = middlewareData.arrow?.y ?? null;
+    const baseSide = actualPlacement.split("-")[0];
+    const staticSide = { top: "bottom", right: "left", bottom: "top", left: "right" }[baseSide];
+    const arrowDeg = staticSide === "top" ? 180 : staticSide === "bottom" ? 0 : staticSide === "left" ? 90 : 270;
+    const arrowWidth = arrowRef.current?.offsetWidth ?? 14;
+    const arrowStyle = {};
+    if (arrowX != null) arrowStyle.left = `${arrowX}px`;
+    if (arrowY != null) arrowStyle.top = `${arrowY}px`;
+    arrowStyle[staticSide] = `${-arrowWidth + 2}px`;
+    arrowStyle.transform = `rotate(${arrowDeg}deg)`;
+    const referenceId = floatingContext.elements.reference?.id ?? triggerId;
+    const defaultLabelProps = role === "dialog" && !("aria-label" in rest) && !("aria-labelledby" in rest) ? { "aria-labelledby": referenceId } : {};
+    const tabIndexOverride = openOnHover ? { tabIndex: -1 } : {};
+    const rawFloatingProps = getFloatingProps({
+      ...defaultLabelProps,
+      ...tabIndexOverride,
+      ...rest
+    });
+    const { role: _suppressedRole, ...floatingPropsWithoutRole } = rawFloatingProps;
+    const floatingProps = role === "dialog" ? rawFloatingProps : floatingPropsWithoutRole;
+    const contentDiv = /* @__PURE__ */ jsxs(
+      "div",
+      {
+        popover: "manual",
+        "data-anv": "popover-content",
+        className: cx(className, styles$1["content"], {
+          [styles$1["no-padding"]]: noPadding
+        }),
+        ref: mergedFloatingRef,
+        style: { ...floatingStyles, ...style },
+        ...floatingProps,
+        children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: styles$1.scroller,
+              role: "presentation",
+              tabIndex: -1,
+              ref: mergedScrollerRef,
+              onScroll,
+              onScrollCapture,
+              children: hideWhileClosed ? openState ? children : null : children
+            }
+          ),
+          enableCaret && /* @__PURE__ */ jsx("span", { className: styles$1["arrow"], ref: arrowRef, style: arrowStyle, children: /* @__PURE__ */ jsx("svg", { "aria-hidden": "true", width: "14", height: "14", viewBox: "0 0 14 14", children: /* @__PURE__ */ jsx("path", { stroke: "none", d: "M0,0 H14 L7,7 Q7,7 7,7 Z" }) }) })
+        ]
+      }
+    );
+    if (role !== "dialog") {
+      return contentDiv;
+    }
+    return /* @__PURE__ */ jsx(
+      FloatingFocusManager,
+      {
+        context: floatingContext,
+        modal: modal ?? false,
+        disabled: !openState || openOnHover,
+        children: contentDiv
+      }
+    );
+  }
+);
+PopoverContent.displayName = "PopoverContent";
+
+function PopoverTrigger(props) {
+  const { children } = props;
+  const { refs, getReferenceProps, openState, triggerId } = usePopoverContext();
+  return children({
+    ...getReferenceProps({
+      ref: refs.setReference
+    }),
+    id: triggerId,
+    "data-state": openState ? "open" : "closed"
+  });
+}
+PopoverTrigger.displayName = "PopoverTrigger";
+
+const Popover = Object.assign(
+  forwardRef(function PopoverInner(props, ref) {
+    const {
+      children,
+      role: roleProp = "dialog",
+      modal,
+      open,
+      defaultOpen = false,
+      onClose,
+      onClickOutside,
+      openOnHover = false,
+      delay = 100,
+      enableCaret,
+      noPadding,
+      matchReferenceWidth,
+      fixedWidth,
+      fillAvailableHeight,
+      maxHeight,
+      fitScreen,
+      minHeight = "2.875rem",
+      disableCloseOnClickOutside,
+      disableCloseOnEscape,
+      onOpenAnimationStart,
+      onOpenAnimationComplete,
+      onCloseAnimationStart,
+      onCloseAnimationComplete
+    } = props;
+    const isAuto = props.placement === "auto";
+    const floatingPlacement = isAuto ? "bottom" : props.placement ?? "bottom";
+    const allowedPlacements = isAuto ? props.placementConfig?.allowedPlacements : void 0;
+    const fallbackPlacements = !isAuto ? props.placementConfig?.fallbackPlacements : void 0;
+    const uid = useId$1();
+    const cleanUid = uid.replace(/:/g, "");
+    const triggerId = `popover-trigger-${cleanUid}`;
+    const isControlled = typeof open !== "undefined";
+    const arrowRef = useRef(null);
+    const isPointerEventRef = useRef(false);
+    const processMinHeight = typeof minHeight === "string" ? minHeight : `${minHeight}px`;
+    const dialogContext = useContext(DialogContext);
+    const [openState, setOpenState] = useOptionallyControlledState({
+      controlledValue: open,
+      defaultValue: defaultOpen
+    });
+    const openStateRef = useRef(openState);
+    openStateRef.current = openState;
+    useEffect(() => {
+      if (!disableCloseOnClickOutside) return;
+      if (roleProp !== "dialog") return;
+      const setTrue = () => {
+        isPointerEventRef.current = true;
+      };
+      const setFalse = () => {
+        setTimeout(() => {
+          isPointerEventRef.current = false;
+        }, 0);
+      };
+      document.addEventListener("pointerdown", setTrue);
+      document.addEventListener("pointerup", setFalse);
+      return () => {
+        document.removeEventListener("pointerdown", setTrue);
+        document.removeEventListener("pointerup", setFalse);
+      };
+    }, [disableCloseOnClickOutside, roleProp]);
+    const handleOpenChange = useCallback(
+      (nextOpen) => {
+        if (!nextOpen && disableCloseOnClickOutside && isPointerEventRef.current)
+          return;
+        if (!nextOpen && !openOnHover) onClose?.();
+        setOpenState(nextOpen);
+      },
+      [openOnHover, onClose, setOpenState, disableCloseOnClickOutside]
+    );
+    const openPopover = useCallback(() => {
+      setOpenState(true);
+    }, [setOpenState]);
+    const closePopover = useCallback(() => {
+      if (!openStateRef.current) return;
+      if (!openOnHover) onClose?.();
+      setOpenState(false);
+    }, [openOnHover, onClose, setOpenState]);
+    const {
+      refs,
+      floatingStyles,
+      context: floatingContext,
+      placement: actualPlacement,
+      middlewareData
+    } = useFloating({
+      open: openState,
+      onOpenChange: handleOpenChange,
+      placement: floatingPlacement,
+      strategy: "absolute",
+      middleware: [
+        offset(8),
+        size({
+          padding: 5,
+          apply({ rects, availableHeight, elements }) {
+            Object.assign(elements.floating.style, {
+              ...matchReferenceWidth ? { width: `${rects.reference.width}px` } : fixedWidth ? { width: "40dvw" } : {},
+              ...fillAvailableHeight ? {
+                height: `${availableHeight - 20}px`,
+                minHeight: processMinHeight
+              } : {},
+              ...maxHeight ? {
+                minHeight: processMinHeight,
+                height: fitScreen ? typeof maxHeight === "string" ? maxHeight : `${maxHeight}px` : void 0,
+                maxHeight: fitScreen ? `${availableHeight - 20}px` : typeof maxHeight === "string" ? maxHeight : `${maxHeight}px`
+              } : {},
+              ...fitScreen && !maxHeight ? {
+                minHeight: processMinHeight,
+                maxHeight: `${availableHeight - 20}px`
+              } : {}
+            });
+          }
+        }),
+        isAuto ? autoPlacement({ allowedPlacements, padding: 5 }) : flip({
+          crossAxis: false,
+          fallbackAxisSideDirection: "none",
+          fallbackPlacements,
+          padding: 5
+        }),
+        shift({
+          padding: 5,
+          crossAxis: false,
+          limiter: limitShift()
+        }),
+        arrow$1({ element: arrowRef, padding: 5 })
+      ],
+      whileElementsMounted: autoUpdate
+    });
+    const role = useRole(floatingContext, { role: roleProp });
+    const hover = useHover(floatingContext, {
+      enabled: openOnHover,
+      delay: { open: delay, close: 100 },
+      handleClose: safePolygon()
+    });
+    const focus = useFocus(floatingContext, { enabled: openOnHover });
+    const click = useClick(floatingContext, {
+      enabled: !openOnHover
+    });
+    const dismiss = useDismiss(floatingContext, {
+      escapeKey: !disableCloseOnEscape,
+      outsidePress: !disableCloseOnClickOutside ? (event) => {
+        onClickOutside?.(event);
+        return true;
+      } : false
+    });
+    const { getReferenceProps, getFloatingProps } = useInteractions([
+      role,
+      hover,
+      focus,
+      click,
+      dismiss
+    ]);
+    useEffect(() => {
+      const floatingEl = refs.floating.current;
+      if (!floatingEl) return;
+      if (openState) {
+        if (dialogContext) {
+          if (dialogContext.ref?.current?.open) {
+            safeShowPopover(floatingEl);
+            dialogContext.setHasOpenPopover?.(true);
+          }
+          return;
+        }
+        safeShowPopover(floatingEl);
+      } else {
+        safeHidePopover(floatingEl);
+        dialogContext?.setHasOpenPopover?.(false);
+      }
+    }, [openState, refs.floating, dialogContext]);
+    usePopoverTransitionStates(refs.floating.current ?? void 0, openState, {
+      onOpenAnimationStart,
+      onOpenAnimationComplete,
+      onCloseAnimationStart,
+      onCloseAnimationComplete
+    });
+    useImperativeHandle(ref, () => ({ openPopover, closePopover }), [
+      openPopover,
+      closePopover
+    ]);
+    const value = useMemo(
+      () => ({
+        floatingContext,
+        refs: {
+          setReference: refs.setReference,
+          setFloating: refs.setFloating
+        },
+        floatingStyles,
+        middlewareData,
+        getReferenceProps,
+        getFloatingProps,
+        triggerId,
+        openState,
+        openPopover,
+        closePopover,
+        controlled: isControlled,
+        actualPlacement,
+        arrowRef,
+        modal,
+        openOnHover,
+        noPadding,
+        enableCaret,
+        role: roleProp
+      }),
+      [
+        floatingContext,
+        refs.setReference,
+        refs.setFloating,
+        floatingStyles,
+        middlewareData,
+        getReferenceProps,
+        getFloatingProps,
+        triggerId,
+        openState,
+        openPopover,
+        closePopover,
+        // stable — does not depend on openState (uses openStateRef)
+        isControlled,
+        actualPlacement,
+        arrowRef,
+        modal,
+        openOnHover,
+        noPadding,
+        enableCaret,
+        roleProp
+      ]
+    );
+    return /* @__PURE__ */ jsx(PopoverContext.Provider, { value, children });
+  }),
+  {
+    /**
+     * PopoverTrigger component for creating custom trigger elements.
+     *
+     * Features:
+     * - Render prop pattern for full control over the trigger element
+     * - ARIA attributes and event handlers injected via getReferenceProps
+     *
+     * @example
+     * <Popover.Trigger>
+     *   {(props) => (
+     *     <Button {...props}>
+     *       Click to open popover
+     *     </Button>
+     *   )}
+     * </Popover.Trigger>
+     */
+    Trigger: PopoverTrigger,
+    /**
+     * PopoverContent component for the main popover content area.
+     *
+     * Features:
+     * - HTML Popover API top-layer rendering (popover="manual")
+     * - Floating UI positioning via refs.setFloating and floatingStyles
+     * - FloatingFocusManager for focus trapping (modal) or Tab-out closing (non-modal)
+     * - Arrow/caret indicator with position computed from middlewareData.arrow
+     * - Scroll position reset when the popover opens
+     * - Optional scrollerRef for external scroll access
+     *
+     * @example
+     * <Popover.Content>
+     *   <p>Popover content</p>
+     *   <Popover.Close>Close</Popover.Close>
+     * </Popover.Content>
+     */
+    Content: PopoverContent,
+    /**
+     * PopoverClose component for closing the popover.
+     *
+     * Features:
+     * - Supports all Button component props and styling
+     * - Closes the popover on click via closePopover
+     * - Automatic tracking ID generation for analytics
+     *
+     * @example
+     * <Popover.Close>Close</Popover.Close>
+     *
+     * @example
+     * <Popover.Close appearance="secondary" size="small">
+     *   Cancel
+     * </Popover.Close>
+     */
+    Close: PopoverClose,
+    /**
+     * PopoverButton component for creating button-style triggers.
+     *
+     * Features:
+     * - Button styling and behavior with all Button props
+     * - ARIA attributes and event handlers injected via getReferenceProps
+     * - Automatic tracking ID generation for analytics
+     *
+     * @example
+     * <Popover.Button>Click to open</Popover.Button>
+     *
+     * @example
+     * <Popover.Button appearance="primary" size="large" icon={InfoIcon}>
+     *   Information
+     * </Popover.Button>
+     */
+    Button: PopoverButton
+  }
+);
+Popover.displayName = "Popover";
+
+const container = "_container_a3zbf_5";
+const small = "_small_a3zbf_62";
+const medium = "_medium_a3zbf_68";
+const large = "_large_a3zbf_74";
+const xlarge = "_xlarge_a3zbf_80";
+const styles = {
+	"tooltip-trigger": "_tooltip-trigger_a3zbf_1",
+	container: container,
+	"button-wrapper": "_button-wrapper_a3zbf_28",
+	"collapse-block": "_collapse-block_a3zbf_40",
+	"with-padding": "_with-padding_a3zbf_40",
+	"collapse-inline": "_collapse-inline_a3zbf_44",
+	small: small,
+	medium: medium,
+	large: large,
+	xlarge: xlarge
+};
+
+const DEFAULT_TOOLTIP_CONTENT = "AI can make mistakes.";
+const DEFAULT_PRIVACY_HREF = "https://www.servicetitan.com/legal/privacy-policy";
+function DefaultPopoverContent() {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    DEFAULT_TOOLTIP_CONTENT,
+    " ",
+    /* @__PURE__ */ jsx(
+      Link,
+      {
+        href: DEFAULT_PRIVACY_HREF,
+        target: "_blank",
+        rel: "noopener noreferrer",
+        appearance: "secondary",
+        children: "Learn more"
+      }
+    )
+  ] });
+}
+const ICON_PIXEL_SIZES$1 = {
+  small: 12,
+  medium: 16,
+  large: 24,
+  xlarge: 32
+};
+const FIELD_LABEL_BUTTON_MIN_OUTER_PX = 28;
+function fieldLabelButtonDimensionsForIcon(iconPx) {
+  const outerPx = Math.max(FIELD_LABEL_BUTTON_MIN_OUTER_PX, iconPx + 4);
+  const innerPx = outerPx - 4;
+  return { outerPx, innerPx };
+}
+function fieldLabelButtonScaleStyle(outerPx, innerPx) {
+  return {
+    "--a2-inline-field-label-button-inner": `${innerPx}px`,
+    "--a2-inline-field-label-button-outer": `${outerPx}px`
+  };
+}
+const AiMarkInteractive = ({
+  config,
+  size,
+  inheritColor,
+  containerClassName,
+  forceAnimate = false
+}) => {
+  const [isActive, setIsActive] = useState(false);
+  const iconPixelSize = ICON_PIXEL_SIZES$1[size];
+  const { outerPx, innerPx } = fieldLabelButtonDimensionsForIcon(iconPixelSize);
+  const fieldLabelButtonScale = fieldLabelButtonScaleStyle(outerPx, innerPx);
+  const animatedIcon = /* @__PURE__ */ jsx(
+    AiMarkIconAnimated,
+    {
+      animate: forceAnimate || isActive,
+      size: iconPixelSize,
+      inheritColor
+    }
+  );
+  const interactionHandlers = {
+    onMouseEnter: () => setIsActive(true),
+    onMouseLeave: () => setIsActive(false),
+    onFocus: () => setIsActive(true),
+    onBlur: () => setIsActive(false)
+  };
+  if (config.type === "popover") {
+    const { content: content2, triggerLabel: triggerLabel2, props: props2, contentProps } = config;
+    const popoverContent = content2 ?? /* @__PURE__ */ jsx(DefaultPopoverContent, {});
+    return /* @__PURE__ */ jsx("div", { className: containerClassName, "data-anv": "ai-mark-interactive", children: /* @__PURE__ */ jsxs(Popover, { role: "dialog", ...props2, children: [
+      /* @__PURE__ */ jsx(Popover.Trigger, { children: (triggerProps) => /* @__PURE__ */ jsx("span", { className: styles["button-wrapper"], tabIndex: -1, children: /* @__PURE__ */ jsx(
+        FieldLabelButton,
+        {
+          ...triggerProps,
+          "aria-label": triggerLabel2,
+          className: fieldLabelButtonStyles["field-label-button-scaled"],
+          style: fieldLabelButtonScale,
+          onMouseEnter: (e) => {
+            interactionHandlers.onMouseEnter();
+            triggerProps.onMouseEnter?.(e);
+          },
+          onMouseLeave: (e) => {
+            interactionHandlers.onMouseLeave();
+            triggerProps.onMouseLeave?.(e);
+          },
+          onFocus: (e) => {
+            interactionHandlers.onFocus();
+            triggerProps.onFocus?.(e);
+          },
+          onBlur: (e) => {
+            interactionHandlers.onBlur();
+            triggerProps.onBlur?.(e);
+          },
+          onClick: (e) => {
+            e.stopPropagation();
+            triggerProps.onClick?.(e);
+          },
+          children: animatedIcon
+        }
+      ) }) }),
+      /* @__PURE__ */ jsx(Popover.Content, { ...contentProps, children: popoverContent })
+    ] }) });
+  }
+  const { content, triggerLabel, props } = config;
+  const tooltipContent = content ?? DEFAULT_TOOLTIP_CONTENT;
+  return /* @__PURE__ */ jsx("div", { className: containerClassName, "data-anv": "ai-mark-interactive", children: /* @__PURE__ */ jsxs(Tooltip, { ...props, children: [
+    /* @__PURE__ */ jsx(Tooltip.Trigger, { className: styles["tooltip-trigger"], children: /* @__PURE__ */ jsx("span", { className: styles["button-wrapper"], tabIndex: -1, children: /* @__PURE__ */ jsx(
+      FieldLabelButton,
+      {
+        "aria-label": triggerLabel,
+        ...interactionHandlers,
+        className: fieldLabelButtonStyles["field-label-button-scaled"],
+        style: fieldLabelButtonScale,
+        children: animatedIcon
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx(Tooltip.Content, { children: tooltipContent })
+  ] }) });
+};
+
+const ICON_PIXEL_SIZES = {
+  small: 12,
+  medium: 16,
+  large: 24,
+  xlarge: 32
+};
+const AiMark = (props) => {
+  const {
+    type = "default",
+    popoverOrTooltipConfig,
+    forceAnimate = false,
+    collapsePadding,
+    className,
+    size = "medium",
+    ...rest
+  } = props;
+  const inheritColor = type === "default";
+  const collapseBlock = collapsePadding === "block" || collapsePadding === "all";
+  const collapseInline = collapsePadding === "inline" || collapsePadding === "all";
+  const baseContainerClassName = cx(
+    styles["container"],
+    styles[size],
+    {
+      [styles["collapse-block"]]: collapseBlock,
+      [styles["collapse-inline"]]: collapseInline
+    },
+    className
+  );
+  if (popoverOrTooltipConfig) {
+    return /* @__PURE__ */ jsx(
+      AiMarkInteractive,
+      {
+        config: popoverOrTooltipConfig,
+        size,
+        inheritColor,
+        containerClassName: baseContainerClassName,
+        forceAnimate
+      }
+    );
+  }
+  const nonInteractiveContainerClassName = cx(
+    baseContainerClassName,
+    styles["with-padding"]
+  );
+  if (forceAnimate) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: nonInteractiveContainerClassName,
+        style: { color: rest.color },
+        children: /* @__PURE__ */ jsx(
+          AiMarkIconAnimated,
+          {
+            animate: true,
+            size: ICON_PIXEL_SIZES[size],
+            inheritColor
+          }
+        )
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: nonInteractiveContainerClassName,
+      style: { color: rest.color },
+      "data-anv": "ai-mark-icon",
+      children: /* @__PURE__ */ jsx(
+        Icon,
+        {
+          ...rest,
+          svg: type === "gradient" ? SvgAiMarkGradient : SvgAiMark,
+          size
+        }
+      )
+    }
+  );
+};
+
+export { AiMark as A, FieldLabelButton as F, Popover as P, usePopoverContext as a, useMergeRefs as u };
+//# sourceMappingURL=AiMark-DjOf60tj.js.map