lynote-ui 0.0.1

package/dist/navigation-menu/index.js

@@ -0,0 +1,1702 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("../jsx-runtime-CPzt8Nmm.js");
+const classVarianceAuthority = require("class-variance-authority");
+const lucideReact = require("lucide-react");
+const React = require("react");
+const floatingUi_utils_dom = require("../floating-ui.utils.dom-djqmdyxg.js");
+const useControlled = require("../useControlled-DTjTIpeU.js");
+const useStableCallback = require("../useStableCallback-CfE_knIO.js");
+const owner = require("../owner-DohlhdQa.js");
+const useRenderElement = require("../useRenderElement-CtyURhhF.js");
+const useOpenChangeComplete = require("../useOpenChangeComplete-B0xZNwMu.js");
+const floatingUi_utils = require("../floating-ui.utils-CMX6M1P8.js");
+const popupStateMapping = require("../popupStateMapping-DKN5mXrh.js");
+const createBaseUIEventDetails = require("../createBaseUIEventDetails-D39y2D9R.js");
+const element = require("../element-DAAyJrnp.js");
+const utils = require("../utils-ij3i9zTT.js");
+const ReactDOM = require("react-dom");
+const useIsoLayoutEffect = require("../useIsoLayoutEffect-CYDr9Bko.js");
+const inertValue = require("../inertValue-gSeyz2Lm.js");
+const CompositeRoot = require("../CompositeRoot-DhWDFM9v.js");
+const useBaseUiId = require("../useBaseUiId-ZDgjliOe.js");
+const CompositeItem = require("../CompositeItem-DKYDWwo1.js");
+const getEmptyRootContext = require("../getEmptyRootContext-DrOPobKp.js");
+const safePolygon = require("../safePolygon-DzT-LXP_.js");
+const useTimeout = require("../useTimeout-CSlJ10_7.js");
+const useAnchorPositioning = require("../useAnchorPositioning-jXRh4g8d.js");
+const DirectionContext = require("../DirectionContext-BsZvU9q3.js");
+const useAnimationFrame = require("../useAnimationFrame-Bgt4Euiv.js");
+const useValueAsRef = require("../useValueAsRef-uSzmRbW_.js");
+const detectBrowser = require("../detectBrowser-j_AUpd7-.js");
+const useClick = require("../useClick-wsFFnZw6.js");
+const useButton = require("../useButton-CcvYPR5H.js");
+const event = require("../event-BHxKjfyi.js");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const ReactDOM__namespace = /* @__PURE__ */ _interopNamespaceDefault(ReactDOM);
+function getCssDimensions(element2) {
+  const css = floatingUi_utils_dom.getComputedStyle(element2);
+  let width = parseFloat(css.width) || 0;
+  let height = parseFloat(css.height) || 0;
+  const hasOffset = floatingUi_utils_dom.isHTMLElement(element2);
+  const offsetWidth = hasOffset ? element2.offsetWidth : width;
+  const offsetHeight = hasOffset ? element2.offsetHeight : height;
+  const shouldFallback = floatingUi_utils.round(width) !== offsetWidth || floatingUi_utils.round(height) !== offsetHeight;
+  if (shouldFallback) {
+    width = offsetWidth;
+    height = offsetHeight;
+  }
+  return {
+    width,
+    height
+  };
+}
+const NavigationMenuRootContext = /* @__PURE__ */ React__namespace.createContext(void 0);
+if (process.env.NODE_ENV !== "production") NavigationMenuRootContext.displayName = "NavigationMenuRootContext";
+if (process.env.NODE_ENV !== "production") {
+  NavigationMenuRootContext.displayName = "NavigationMenuRootContext";
+}
+function useNavigationMenuRootContext(optional) {
+  const context = React__namespace.useContext(NavigationMenuRootContext);
+  if (context === void 0 && !optional) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: NavigationMenuRootContext is missing. Navigation Menu parts must be placed within <NavigationMenu.Root>." : useRenderElement.formatErrorMessage(41));
+  }
+  return context;
+}
+const NavigationMenuTreeContext = /* @__PURE__ */ React__namespace.createContext(void 0);
+if (process.env.NODE_ENV !== "production") NavigationMenuTreeContext.displayName = "NavigationMenuTreeContext";
+function useNavigationMenuTreeContext() {
+  return React__namespace.useContext(NavigationMenuTreeContext);
+}
+let NavigationMenuPopupCssVars = /* @__PURE__ */ (function(NavigationMenuPopupCssVars2) {
+  NavigationMenuPopupCssVars2["popupWidth"] = "--popup-width";
+  NavigationMenuPopupCssVars2["popupHeight"] = "--popup-height";
+  return NavigationMenuPopupCssVars2;
+})({});
+let NavigationMenuPositionerCssVars = /* @__PURE__ */ (function(NavigationMenuPositionerCssVars2) {
+  NavigationMenuPositionerCssVars2["availableWidth"] = "--available-width";
+  NavigationMenuPositionerCssVars2["availableHeight"] = "--available-height";
+  NavigationMenuPositionerCssVars2["anchorWidth"] = "--anchor-width";
+  NavigationMenuPositionerCssVars2["anchorHeight"] = "--anchor-height";
+  NavigationMenuPositionerCssVars2["transformOrigin"] = "--transform-origin";
+  NavigationMenuPositionerCssVars2["positionerWidth"] = "--positioner-width";
+  NavigationMenuPositionerCssVars2["positionerHeight"] = "--positioner-height";
+  return NavigationMenuPositionerCssVars2;
+})({});
+const blockedReturnFocusReasons = /* @__PURE__ */ new Set([createBaseUIEventDetails.triggerHover, createBaseUIEventDetails.outsidePress, createBaseUIEventDetails.focusOut]);
+function setSharedFixedSize(popupElement, positionerElement) {
+  const {
+    width,
+    height
+  } = getCssDimensions(popupElement);
+  if (width === 0 || height === 0) {
+    return;
+  }
+  popupElement.style.setProperty(NavigationMenuPopupCssVars.popupWidth, `${width}px`);
+  popupElement.style.setProperty(NavigationMenuPopupCssVars.popupHeight, `${height}px`);
+  positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerWidth, `${width}px`);
+  positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerHeight, `${height}px`);
+}
+const NavigationMenuRoot = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuRoot2(componentProps, forwardedRef) {
+  const {
+    defaultValue = null,
+    value: valueParam,
+    onValueChange,
+    actionsRef,
+    delay = 50,
+    closeDelay = 50,
+    orientation = "horizontal",
+    onOpenChangeComplete
+  } = componentProps;
+  const nested = popupStateMapping.useFloatingParentNodeId() != null;
+  const parentRootContext = useNavigationMenuRootContext(true);
+  const [value, setValueUnwrapped] = useControlled.useControlled({
+    controlled: valueParam,
+    default: defaultValue,
+    name: "NavigationMenu",
+    state: "value"
+  });
+  const open = value != null;
+  const closeReasonRef = React__namespace.useRef(void 0);
+  const rootRef = React__namespace.useRef(null);
+  const [positionerElement, setPositionerElement] = React__namespace.useState(null);
+  const [popupElement, setPopupElement] = React__namespace.useState(null);
+  const [viewportElement, setViewportElement] = React__namespace.useState(null);
+  const [viewportTargetElement, setViewportTargetElement] = React__namespace.useState(null);
+  const [activationDirection, setActivationDirection] = React__namespace.useState(null);
+  const [floatingRootContext, setFloatingRootContext] = React__namespace.useState(void 0);
+  const [viewportInert, setViewportInert] = React__namespace.useState(false);
+  const prevTriggerElementRef = React__namespace.useRef(null);
+  const currentContentRef = React__namespace.useRef(null);
+  const beforeInsideRef = React__namespace.useRef(null);
+  const afterInsideRef = React__namespace.useRef(null);
+  const beforeOutsideRef = React__namespace.useRef(null);
+  const afterOutsideRef = React__namespace.useRef(null);
+  const {
+    mounted,
+    setMounted,
+    transitionStatus
+  } = useOpenChangeComplete.useTransitionStatus(open);
+  React__namespace.useEffect(() => {
+    setViewportInert(false);
+  }, [value]);
+  const setValue = useStableCallback.useStableCallback((nextValue, eventDetails) => {
+    if (!nextValue) {
+      closeReasonRef.current = eventDetails.reason;
+      setActivationDirection(null);
+      setFloatingRootContext(void 0);
+      if (positionerElement && popupElement) {
+        setSharedFixedSize(popupElement, positionerElement);
+      }
+    }
+    if (nextValue !== value) {
+      onValueChange == null ? void 0 : onValueChange(nextValue, eventDetails);
+    }
+    if (eventDetails.isCanceled) {
+      return;
+    }
+    setValueUnwrapped(nextValue);
+    if (nested && !nextValue && eventDetails.reason === createBaseUIEventDetails.linkPress && parentRootContext) {
+      parentRootContext.setValue(null, eventDetails);
+    }
+  });
+  const handleUnmount = useStableCallback.useStableCallback(() => {
+    const doc = owner.ownerDocument(rootRef.current);
+    const activeEl = element.activeElement(doc);
+    const isReturnFocusBlocked = closeReasonRef.current ? blockedReturnFocusReasons.has(closeReasonRef.current) : false;
+    if (!isReturnFocusBlocked && floatingUi_utils_dom.isHTMLElement(prevTriggerElementRef.current) && (activeEl === owner.ownerDocument(popupElement).body || element.contains(popupElement, activeEl)) && popupElement) {
+      prevTriggerElementRef.current.focus({
+        preventScroll: true
+      });
+      prevTriggerElementRef.current = void 0;
+    }
+    setMounted(false);
+    onOpenChangeComplete == null ? void 0 : onOpenChangeComplete(false);
+    setActivationDirection(null);
+    setFloatingRootContext(void 0);
+    currentContentRef.current = null;
+    closeReasonRef.current = void 0;
+  });
+  useOpenChangeComplete.useOpenChangeComplete({
+    enabled: !actionsRef,
+    open,
+    ref: {
+      current: popupElement
+    },
+    onComplete() {
+      if (!open) {
+        handleUnmount();
+      }
+    }
+  });
+  useOpenChangeComplete.useOpenChangeComplete({
+    enabled: !actionsRef,
+    open,
+    ref: {
+      current: viewportTargetElement
+    },
+    onComplete() {
+      if (!open) {
+        handleUnmount();
+      }
+    }
+  });
+  const contextValue = React__namespace.useMemo(() => ({
+    open,
+    value,
+    setValue,
+    mounted,
+    transitionStatus,
+    positionerElement,
+    setPositionerElement,
+    popupElement,
+    setPopupElement,
+    viewportElement,
+    setViewportElement,
+    viewportTargetElement,
+    setViewportTargetElement,
+    activationDirection,
+    setActivationDirection,
+    floatingRootContext,
+    setFloatingRootContext,
+    currentContentRef,
+    nested,
+    rootRef,
+    beforeInsideRef,
+    afterInsideRef,
+    beforeOutsideRef,
+    afterOutsideRef,
+    prevTriggerElementRef,
+    delay,
+    closeDelay,
+    orientation,
+    viewportInert,
+    setViewportInert
+  }), [open, value, setValue, mounted, transitionStatus, positionerElement, popupElement, viewportElement, viewportTargetElement, activationDirection, floatingRootContext, nested, delay, closeDelay, orientation, viewportInert]);
+  const jsx = /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuRootContext.Provider, {
+    value: contextValue,
+    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(TreeContext, {
+      componentProps,
+      forwardedRef,
+      children: componentProps.children
+    })
+  });
+  if (!nested) {
+    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FloatingTree, {
+      children: jsx
+    });
+  }
+  return jsx;
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuRoot.displayName = "NavigationMenuRoot";
+function TreeContext(props) {
+  const {
+    className,
+    render,
+    defaultValue,
+    value: valueParam,
+    onValueChange,
+    actionsRef,
+    delay,
+    closeDelay,
+    orientation,
+    onOpenChangeComplete,
+    ...elementProps
+  } = props.componentProps;
+  const nodeId = popupStateMapping.useFloatingNodeId();
+  const {
+    rootRef,
+    nested
+  } = useNavigationMenuRootContext();
+  const {
+    open
+  } = useNavigationMenuRootContext();
+  const state = {
+    open,
+    nested
+  };
+  const element2 = useRenderElement.useRenderElement(nested ? "div" : "nav", props.componentProps, {
+    state,
+    ref: [props.forwardedRef, rootRef],
+    props: elementProps
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuTreeContext.Provider, {
+    value: nodeId,
+    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FloatingNode, {
+      id: nodeId,
+      children: element2
+    })
+  });
+}
+const NAVIGATION_MENU_TRIGGER_IDENTIFIER = "data-base-ui-navigation-menu-trigger";
+const NavigationMenuDismissContext = /* @__PURE__ */ React__namespace.createContext(void 0);
+if (process.env.NODE_ENV !== "production") NavigationMenuDismissContext.displayName = "NavigationMenuDismissContext";
+function useNavigationMenuDismissContext() {
+  return React__namespace.useContext(NavigationMenuDismissContext);
+}
+const NavigationMenuList$1 = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuList(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    ...elementProps
+  } = componentProps;
+  const {
+    orientation,
+    open,
+    floatingRootContext,
+    positionerElement,
+    value,
+    closeDelay,
+    viewportElement,
+    nested
+  } = useNavigationMenuRootContext();
+  const fallbackContext = React__namespace.useMemo(() => getEmptyRootContext.getEmptyRootContext(), []);
+  const context = floatingRootContext || fallbackContext;
+  const interactionsEnabled = positionerElement ? true : !value;
+  const hoverInteractionsEnabled = positionerElement || viewportElement ? true : !value;
+  safePolygon.useHoverFloatingInteraction(context, {
+    enabled: Boolean(floatingRootContext) && hoverInteractionsEnabled,
+    closeDelay
+  });
+  const dismiss = popupStateMapping.useDismiss(context, {
+    enabled: interactionsEnabled,
+    outsidePressEvent: "intentional",
+    outsidePress(event2) {
+      const target = element.getTarget(event2);
+      const closestNavigationMenuTrigger = target == null ? void 0 : target.closest(`[${NAVIGATION_MENU_TRIGGER_IDENTIFIER}]`);
+      return closestNavigationMenuTrigger === null;
+    }
+  });
+  const dismissProps = floatingRootContext ? dismiss : void 0;
+  const state = {
+    open
+  };
+  const defaultProps = nested ? {
+    "aria-orientation": orientation
+  } : {
+    onKeyDown(event2) {
+      const shouldStop = orientation === "horizontal" && (event2.key === "ArrowLeft" || event2.key === "ArrowRight") || orientation === "vertical" && (event2.key === "ArrowUp" || event2.key === "ArrowDown");
+      if (shouldStop) {
+        event2.stopPropagation();
+      }
+    }
+  };
+  const props = [(dismissProps == null ? void 0 : dismissProps.floating) || useRenderElement.EMPTY_OBJECT, defaultProps, elementProps];
+  const element$1 = useRenderElement.useRenderElement("ul", componentProps, {
+    state,
+    ref: forwardedRef,
+    props,
+    enabled: nested
+  });
+  if (nested) {
+    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuDismissContext.Provider, {
+      value: dismissProps,
+      children: element$1
+    });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuDismissContext.Provider, {
+    value: dismissProps,
+    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CompositeRoot.CompositeRoot, {
+      render,
+      className,
+      state,
+      refs: [forwardedRef],
+      props,
+      loopFocus: false,
+      orientation,
+      tag: "ul"
+    })
+  });
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuList$1.displayName = "NavigationMenuList";
+const NavigationMenuItemContext = /* @__PURE__ */ React__namespace.createContext(void 0);
+if (process.env.NODE_ENV !== "production") NavigationMenuItemContext.displayName = "NavigationMenuItemContext";
+function useNavigationMenuItemContext() {
+  const value = React__namespace.useContext(NavigationMenuItemContext);
+  if (!value) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: NavigationMenuItem parts must be used within a <NavigationMenu.Item>." : useRenderElement.formatErrorMessage(39));
+  }
+  return value;
+}
+const NavigationMenuItem$1 = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuItem(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    value: valueProp,
+    ...elementProps
+  } = componentProps;
+  const fallbackValue = useBaseUiId.useBaseUiId();
+  const value = valueProp ?? fallbackValue;
+  const element2 = useRenderElement.useRenderElement("li", componentProps, {
+    ref: forwardedRef,
+    props: elementProps
+  });
+  const contextValue = React__namespace.useMemo(() => ({
+    value
+  }), [value]);
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuItemContext.Provider, {
+    value: contextValue,
+    children: element2
+  });
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuItem$1.displayName = "NavigationMenuItem";
+const stateAttributesMapping$1 = {
+  ...popupStateMapping.popupStateMapping,
+  ...useOpenChangeComplete.transitionStatusMapping,
+  activationDirection(value) {
+    if (!value) {
+      return null;
+    }
+    return {
+      "data-activation-direction": value
+    };
+  }
+};
+const NavigationMenuContent$1 = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuContent(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    keepMounted = false,
+    ...elementProps
+  } = componentProps;
+  const {
+    mounted: popupMounted,
+    viewportElement,
+    value,
+    activationDirection,
+    currentContentRef,
+    viewportTargetElement
+  } = useNavigationMenuRootContext();
+  const {
+    value: itemValue
+  } = useNavigationMenuItemContext();
+  const nodeId = useNavigationMenuTreeContext();
+  const open = popupMounted && value === itemValue;
+  const ref = React__namespace.useRef(null);
+  const [hasMountedInPortal, setHasMountedInPortal] = React__namespace.useState(false);
+  const [focusInside, setFocusInside] = React__namespace.useState(false);
+  const {
+    mounted,
+    setMounted,
+    transitionStatus
+  } = useOpenChangeComplete.useTransitionStatus(open);
+  if (mounted && !popupMounted) {
+    setMounted(false);
+  }
+  useOpenChangeComplete.useOpenChangeComplete({
+    ref,
+    open,
+    onComplete() {
+      if (!open) {
+        setMounted(false);
+      }
+    }
+  });
+  useIsoLayoutEffect.useIsoLayoutEffect(() => {
+    if (open && ref.current) {
+      currentContentRef.current = ref.current;
+    }
+  }, [open, currentContentRef]);
+  const state = {
+    open,
+    transitionStatus,
+    activationDirection
+  };
+  const handleCurrentContentRef = React__namespace.useCallback((node) => {
+    if (node) {
+      currentContentRef.current = node;
+    }
+  }, [currentContentRef]);
+  const commonProps = {
+    onFocus(event2) {
+      const target = element.getTarget(event2.nativeEvent);
+      if (target == null ? void 0 : target.hasAttribute("data-base-ui-focus-guard")) {
+        return;
+      }
+      setFocusInside(true);
+    },
+    onBlur(event2) {
+      if (!element.contains(event2.currentTarget, event2.relatedTarget)) {
+        setFocusInside(false);
+      }
+    }
+  };
+  const defaultProps = !open && mounted ? {
+    style: {
+      position: "absolute",
+      top: 0,
+      left: 0
+    },
+    inert: inertValue.inertValue(!focusInside),
+    ...commonProps
+  } : commonProps;
+  const portalContainer = viewportTargetElement || viewportElement;
+  const hidden = keepMounted && !mounted;
+  const shouldRenderInline = keepMounted && !portalContainer && !hasMountedInPortal;
+  if (keepMounted && portalContainer && !hasMountedInPortal) {
+    setHasMountedInPortal(true);
+  }
+  if (shouldRenderInline) {
+    return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CompositeRoot.CompositeRoot, {
+      render,
+      className,
+      state,
+      refs: [forwardedRef],
+      props: [defaultProps, {
+        hidden: true
+      }, elementProps],
+      stateAttributesMapping: stateAttributesMapping$1
+    });
+  }
+  if (!portalContainer || !mounted && !keepMounted) {
+    return null;
+  }
+  return /* @__PURE__ */ ReactDOM__namespace.createPortal(/* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FloatingNode, {
+    id: nodeId,
+    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CompositeRoot.CompositeRoot, {
+      render,
+      className,
+      state,
+      refs: [forwardedRef, ref, handleCurrentContentRef],
+      props: [defaultProps, hidden ? {
+        hidden: true
+      } : useRenderElement.EMPTY_OBJECT, elementProps],
+      stateAttributesMapping: stateAttributesMapping$1
+    })
+  }), portalContainer);
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuContent$1.displayName = "NavigationMenuContent";
+function isOutsideMenuEvent({
+  currentTarget,
+  relatedTarget
+}, params) {
+  const {
+    popupElement,
+    viewportElement,
+    rootRef,
+    tree,
+    nodeId
+  } = params;
+  const nodeChildrenContains = tree ? popupStateMapping.getNodeChildren(tree.nodesRef.current, nodeId).some((node) => {
+    var _a;
+    return element.contains((_a = node.context) == null ? void 0 : _a.elements.floating, relatedTarget);
+  }) : [];
+  if (!popupElement) {
+    return !element.contains(rootRef.current, relatedTarget) && !nodeChildrenContains;
+  }
+  const floatingElement = popupElement || viewportElement;
+  return !element.contains(floatingElement, currentTarget) && !element.contains(floatingElement, relatedTarget) && !element.contains(rootRef.current, relatedTarget) && !nodeChildrenContains && !(element.contains(floatingElement, relatedTarget) && (relatedTarget == null ? void 0 : relatedTarget.hasAttribute("data-base-ui-focus-guard")));
+}
+const DEFAULT_SIZE = {
+  width: 0,
+  height: 0
+};
+const NavigationMenuTrigger$1 = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuTrigger(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    nativeButton = true,
+    disabled,
+    ...elementProps
+  } = componentProps;
+  const {
+    value,
+    setValue,
+    mounted,
+    open,
+    positionerElement,
+    setActivationDirection,
+    setFloatingRootContext,
+    popupElement,
+    viewportElement,
+    transitionStatus,
+    rootRef,
+    beforeOutsideRef,
+    afterOutsideRef,
+    afterInsideRef,
+    beforeInsideRef,
+    prevTriggerElementRef,
+    currentContentRef,
+    delay,
+    closeDelay,
+    orientation,
+    setViewportInert,
+    nested
+  } = useNavigationMenuRootContext();
+  const {
+    value: itemValue
+  } = useNavigationMenuItemContext();
+  const nodeId = useNavigationMenuTreeContext();
+  const tree = popupStateMapping.useFloatingTree();
+  const dismissProps = useNavigationMenuDismissContext();
+  const stickIfOpenTimeout = useTimeout.useTimeout();
+  const focusFrame = useAnimationFrame.useAnimationFrame();
+  const mutationFrame = useAnimationFrame.useAnimationFrame();
+  const resizeFrame = useAnimationFrame.useAnimationFrame();
+  const sizeFrame = useAnimationFrame.useAnimationFrame();
+  const [triggerElement, setTriggerElement] = React__namespace.useState(null);
+  const [stickIfOpen, setStickIfOpen] = React__namespace.useState(true);
+  const [pointerType, setPointerType] = React__namespace.useState("");
+  const triggerElementRef = React__namespace.useRef(null);
+  const allowFocusRef = React__namespace.useRef(false);
+  const prevSizeRef = React__namespace.useRef(DEFAULT_SIZE);
+  const animationAbortControllerRef = React__namespace.useRef(null);
+  const skipAutoSizeSyncRef = React__namespace.useRef(false);
+  const isActiveItem = open && value === itemValue;
+  const isActiveItemRef = useValueAsRef.useValueAsRef(isActiveItem);
+  const interactionsEnabled = positionerElement ? true : !value;
+  const hoverFloatingElement = positionerElement || viewportElement;
+  const hoverInteractionsEnabled = hoverFloatingElement ? true : !value;
+  const runOnceAnimationsFinish = useOpenChangeComplete.useAnimationsFinished(popupElement, false, false);
+  const handleTriggerElement = React__namespace.useCallback((element2) => {
+    triggerElementRef.current = element2;
+    setTriggerElement(element2);
+  }, []);
+  React__namespace.useEffect(() => {
+    var _a;
+    (_a = animationAbortControllerRef.current) == null ? void 0 : _a.abort();
+  }, [isActiveItem]);
+  function setAutoSizes() {
+    if (!popupElement) {
+      return;
+    }
+    popupElement.style.setProperty(NavigationMenuPopupCssVars.popupWidth, "auto");
+    popupElement.style.setProperty(NavigationMenuPopupCssVars.popupHeight, "auto");
+  }
+  function clearFixedSizes() {
+    if (!popupElement || !positionerElement) {
+      return;
+    }
+    popupElement.style.removeProperty(NavigationMenuPopupCssVars.popupWidth);
+    popupElement.style.removeProperty(NavigationMenuPopupCssVars.popupHeight);
+    positionerElement.style.removeProperty(NavigationMenuPositionerCssVars.positionerWidth);
+    positionerElement.style.removeProperty(NavigationMenuPositionerCssVars.positionerHeight);
+  }
+  function setSharedFixedSizes(width, height) {
+    if (!popupElement || !positionerElement) {
+      return;
+    }
+    popupElement.style.setProperty(NavigationMenuPopupCssVars.popupWidth, `${width}px`);
+    popupElement.style.setProperty(NavigationMenuPopupCssVars.popupHeight, `${height}px`);
+    positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerWidth, `${width}px`);
+    positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerHeight, `${height}px`);
+  }
+  function scheduleAutoSizeReset() {
+    animationAbortControllerRef.current = new AbortController();
+    runOnceAnimationsFinish(setAutoSizes, animationAbortControllerRef.current.signal);
+  }
+  const handleValueChange = useStableCallback.useStableCallback((currentWidth, currentHeight, options = {}) => {
+    if (!popupElement || !positionerElement) {
+      return;
+    }
+    const {
+      syncPositioner = false
+    } = options;
+    clearFixedSizes();
+    const {
+      width,
+      height
+    } = getCssDimensions(popupElement);
+    const measuredWidth = width || prevSizeRef.current.width;
+    const measuredHeight = height || prevSizeRef.current.height;
+    if (currentHeight === 0 || currentWidth === 0) {
+      currentWidth = measuredWidth;
+      currentHeight = measuredHeight;
+    }
+    popupElement.style.setProperty(NavigationMenuPopupCssVars.popupWidth, `${currentWidth}px`);
+    popupElement.style.setProperty(NavigationMenuPopupCssVars.popupHeight, `${currentHeight}px`);
+    positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerWidth, `${syncPositioner ? currentWidth : measuredWidth}px`);
+    positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerHeight, `${syncPositioner ? currentHeight : measuredHeight}px`);
+    sizeFrame.request(() => {
+      popupElement.style.setProperty(NavigationMenuPopupCssVars.popupWidth, `${measuredWidth}px`);
+      popupElement.style.setProperty(NavigationMenuPopupCssVars.popupHeight, `${measuredHeight}px`);
+      if (syncPositioner) {
+        positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerWidth, `${measuredWidth}px`);
+        positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerHeight, `${measuredHeight}px`);
+      }
+      scheduleAutoSizeReset();
+    });
+  });
+  const handleInterruptedMutationResize = useStableCallback.useStableCallback((currentWidth, currentHeight) => {
+    var _a;
+    if (!popupElement || !positionerElement) {
+      return;
+    }
+    sizeFrame.cancel();
+    mutationFrame.cancel();
+    (_a = animationAbortControllerRef.current) == null ? void 0 : _a.abort();
+    animationAbortControllerRef.current = null;
+    if (currentWidth === 0 || currentHeight === 0) {
+      return;
+    }
+    setSharedFixedSizes(currentWidth, currentHeight);
+    mutationFrame.request(() => {
+      mutationFrame.request(() => {
+        clearFixedSizes();
+        const {
+          width,
+          height
+        } = getCssDimensions(popupElement);
+        const measuredWidth = width || currentWidth || prevSizeRef.current.width;
+        const measuredHeight = height || currentHeight || prevSizeRef.current.height;
+        setSharedFixedSizes(currentWidth, currentHeight);
+        sizeFrame.request(() => {
+          setSharedFixedSizes(measuredWidth, measuredHeight);
+          scheduleAutoSizeReset();
+        });
+      });
+    });
+  });
+  const syncCurrentSize = useStableCallback.useStableCallback(() => {
+    var _a;
+    if (!popupElement || !positionerElement) {
+      return;
+    }
+    sizeFrame.cancel();
+    (_a = animationAbortControllerRef.current) == null ? void 0 : _a.abort();
+    animationAbortControllerRef.current = null;
+    clearFixedSizes();
+    const {
+      width,
+      height
+    } = getCssDimensions(popupElement);
+    if (width === 0 || height === 0) {
+      return;
+    }
+    prevSizeRef.current = {
+      width,
+      height
+    };
+    setAutoSizes();
+    positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerWidth, `${width}px`);
+    positionerElement.style.setProperty(NavigationMenuPositionerCssVars.positionerHeight, `${height}px`);
+  });
+  const getMutationBaseline = useStableCallback.useStableCallback(() => {
+    if (!popupElement) {
+      return {
+        size: prevSizeRef.current,
+        syncPositioner: false
+      };
+    }
+    const popupWidth = popupElement.style.getPropertyValue(NavigationMenuPopupCssVars.popupWidth);
+    const popupHeight = popupElement.style.getPropertyValue(NavigationMenuPopupCssVars.popupHeight);
+    const isResizing = popupWidth !== "" && popupWidth !== "auto" && popupHeight !== "" && popupHeight !== "auto";
+    if (!isResizing) {
+      return {
+        size: prevSizeRef.current,
+        syncPositioner: false
+      };
+    }
+    return {
+      size: {
+        width: popupElement.offsetWidth || prevSizeRef.current.width,
+        height: popupElement.offsetHeight || prevSizeRef.current.height
+      },
+      syncPositioner: true
+    };
+  });
+  React__namespace.useEffect(() => {
+    var _a;
+    if (!open) {
+      stickIfOpenTimeout.clear();
+      mutationFrame.cancel();
+      resizeFrame.cancel();
+      sizeFrame.cancel();
+      (_a = animationAbortControllerRef.current) == null ? void 0 : _a.abort();
+      animationAbortControllerRef.current = null;
+      skipAutoSizeSyncRef.current = false;
+      setPointerType("");
+    }
+  }, [stickIfOpenTimeout, open, mutationFrame, resizeFrame, sizeFrame]);
+  React__namespace.useEffect(() => {
+    if (!mounted) {
+      prevSizeRef.current = DEFAULT_SIZE;
+    }
+  }, [mounted]);
+  React__namespace.useEffect(() => {
+    if (!popupElement || typeof ResizeObserver !== "function") {
+      return void 0;
+    }
+    const resizeObserver = new ResizeObserver(() => {
+      prevSizeRef.current = {
+        width: popupElement.offsetWidth,
+        height: popupElement.offsetHeight
+      };
+    });
+    resizeObserver.observe(popupElement);
+    return () => {
+      resizeObserver.disconnect();
+    };
+  }, [popupElement]);
+  React__namespace.useEffect(() => {
+    if (!open || !isActiveItem || !popupElement || !positionerElement) {
+      return void 0;
+    }
+    const win = floatingUi_utils_dom.getWindow(positionerElement);
+    function handleResize() {
+      resizeFrame.cancel();
+      resizeFrame.request(syncCurrentSize);
+    }
+    win.addEventListener("resize", handleResize);
+    return () => {
+      resizeFrame.cancel();
+      win.removeEventListener("resize", handleResize);
+    };
+  }, [open, isActiveItem, popupElement, positionerElement, resizeFrame, syncCurrentSize]);
+  React__namespace.useEffect(() => {
+    const observedElement = currentContentRef.current;
+    if (!observedElement || !popupElement || !isActiveItem || typeof MutationObserver !== "function") {
+      return void 0;
+    }
+    const mutationObserver = new MutationObserver(() => {
+      if (transitionStatus === "starting" || popupElement.hasAttribute(useOpenChangeComplete.TransitionStatusDataAttributes.startingStyle)) {
+        syncCurrentSize();
+        return;
+      }
+      const {
+        size,
+        syncPositioner
+      } = getMutationBaseline();
+      if (syncPositioner) {
+        handleInterruptedMutationResize(size.width, size.height);
+        return;
+      }
+      handleValueChange(size.width, size.height);
+    });
+    mutationObserver.observe(observedElement, {
+      childList: true,
+      subtree: true,
+      characterData: true
+    });
+    return () => {
+      mutationObserver.disconnect();
+    };
+  }, [currentContentRef, popupElement, isActiveItem, transitionStatus, getMutationBaseline, handleInterruptedMutationResize, handleValueChange, syncCurrentSize]);
+  React__namespace.useEffect(() => {
+    if (isActiveItem && open && popupElement && allowFocusRef.current) {
+      allowFocusRef.current = false;
+      focusFrame.request(() => {
+        var _a;
+        (_a = beforeOutsideRef.current) == null ? void 0 : _a.focus();
+      });
+    }
+    return () => {
+      focusFrame.cancel();
+    };
+  }, [beforeOutsideRef, focusFrame, isActiveItem, open, popupElement]);
+  useIsoLayoutEffect.useIsoLayoutEffect(() => {
+    var _a;
+    if (isActiveItemRef.current && open && popupElement) {
+      if (transitionStatus === "starting") {
+        const hasNestedMenu = ((_a = currentContentRef.current) == null ? void 0 : _a.querySelector("[data-nested]")) != null;
+        if (hasNestedMenu) {
+          sizeFrame.request(syncCurrentSize);
+          return () => {
+            sizeFrame.cancel();
+          };
+        }
+      }
+      if (skipAutoSizeSyncRef.current) {
+        skipAutoSizeSyncRef.current = false;
+        return void 0;
+      }
+      handleValueChange(0, 0);
+    }
+    return void 0;
+  }, [currentContentRef, handleValueChange, isActiveItemRef, open, popupElement, sizeFrame, syncCurrentSize, transitionStatus]);
+  function handleOpenChange(nextOpen, eventDetails) {
+    const isHover = eventDetails.reason === createBaseUIEventDetails.triggerHover;
+    if (!interactionsEnabled) {
+      return;
+    }
+    if (pointerType === "touch" && isHover) {
+      return;
+    }
+    if (!nextOpen && value !== itemValue) {
+      return;
+    }
+    function changeState() {
+      if (isHover) {
+        setStickIfOpen(true);
+        stickIfOpenTimeout.clear();
+        stickIfOpenTimeout.start(popupStateMapping.PATIENT_CLICK_THRESHOLD, () => {
+          setStickIfOpen(false);
+        });
+      }
+      if (nextOpen) {
+        setValue(itemValue, eventDetails);
+      } else {
+        setValue(null, eventDetails);
+        setPointerType("");
+      }
+    }
+    if (isHover) {
+      ReactDOM__namespace.flushSync(changeState);
+    } else {
+      changeState();
+    }
+  }
+  const context = useAnchorPositioning.useFloatingRootContext({
+    open,
+    onOpenChange: handleOpenChange,
+    elements: {
+      reference: triggerElement,
+      floating: hoverFloatingElement
+    }
+  });
+  const hoverInteractionState = safePolygon.useHoverInteractionSharedState(context);
+  React__namespace.useEffect(() => {
+    if (!open) {
+      context.context.dataRef.current.openEvent = void 0;
+      hoverInteractionState.pointerType = void 0;
+      hoverInteractionState.interactedInside = false;
+      hoverInteractionState.restTimeoutPending = false;
+      hoverInteractionState.openChangeTimeout.clear();
+      hoverInteractionState.restTimeout.clear();
+      safePolygon.clearSafePolygonPointerEventsMutation(hoverInteractionState);
+    }
+  }, [context, hoverInteractionState, open]);
+  const getInlineHandleCloseContext = useStableCallback.useStableCallback(() => {
+    if (!nested || positionerElement || !triggerElementRef.current || !hoverFloatingElement) {
+      return null;
+    }
+    return getHandleCloseContext(triggerElementRef.current, hoverFloatingElement, nodeId);
+  });
+  function getScope() {
+    var _a;
+    return ((_a = triggerElementRef.current) == null ? void 0 : _a.closest("ul")) ?? null;
+  }
+  const hoverProps = safePolygon.useHoverReferenceInteraction(context, {
+    enabled: hoverInteractionsEnabled,
+    move: false,
+    handleClose: safePolygon.safePolygon({
+      blockPointerEvents: pointerType !== "touch" && (!detectBrowser.isWebKit || nested)
+    }),
+    restMs: mounted && positionerElement ? 0 : delay,
+    delay: {
+      close: closeDelay
+    },
+    triggerElementRef,
+    getHandleCloseContext: getInlineHandleCloseContext
+  });
+  const hover = React__namespace.useMemo(() => hoverProps ? {
+    reference: hoverProps
+  } : void 0, [hoverProps]);
+  const click = useClick.useClick(context, {
+    enabled: interactionsEnabled,
+    stickIfOpen,
+    toggle: isActiveItem
+  });
+  const {
+    getReferenceProps
+  } = popupStateMapping.useInteractions([hover, click]);
+  useIsoLayoutEffect.useIsoLayoutEffect(() => {
+    if (isActiveItem) {
+      setFloatingRootContext(context);
+      prevTriggerElementRef.current = triggerElement;
+    }
+  }, [isActiveItem, context, setFloatingRootContext, prevTriggerElementRef, triggerElement]);
+  function handleActivation(event2) {
+    ReactDOM__namespace.flushSync(() => {
+      var _a;
+      const prevTriggerRect = (_a = prevTriggerElementRef.current) == null ? void 0 : _a.getBoundingClientRect();
+      if (mounted && prevTriggerRect && triggerElement) {
+        const nextTriggerRect = triggerElement.getBoundingClientRect();
+        const isMovingRight = nextTriggerRect.left > prevTriggerRect.left;
+        const isMovingDown = nextTriggerRect.top > prevTriggerRect.top;
+        if (orientation === "horizontal" && nextTriggerRect.left !== prevTriggerRect.left) {
+          setActivationDirection(isMovingRight ? "right" : "left");
+        } else if (orientation === "vertical" && nextTriggerRect.top !== prevTriggerRect.top) {
+          setActivationDirection(isMovingDown ? "down" : "up");
+        }
+      }
+      if (event2.type !== "click" && value != null) {
+        context.context.dataRef.current.openEvent = void 0;
+      }
+      if (pointerType === "touch" && event2.type !== "click") {
+        return;
+      }
+      if (value != null) {
+        setValue(itemValue, createBaseUIEventDetails.createChangeEventDetails(event2.type === "mouseenter" ? createBaseUIEventDetails.triggerHover : createBaseUIEventDetails.triggerPress, event2.nativeEvent));
+      }
+      if (event2.type === "mouseenter" && nested && !positionerElement && pointerType !== "touch" && hoverFloatingElement && floatingUi_utils_dom.isHTMLElement(event2.currentTarget)) {
+        const scopeElement = getScope();
+        if (!scopeElement) {
+          return;
+        }
+        safePolygon.applySafePolygonPointerEventsMutation(hoverInteractionState, {
+          scopeElement,
+          referenceElement: event2.currentTarget,
+          floatingElement: hoverFloatingElement
+        });
+      }
+    });
+  }
+  const handleOpenEvent = useStableCallback.useStableCallback((event2) => {
+    if (!popupElement || !positionerElement) {
+      handleActivation(event2);
+      return;
+    }
+    const {
+      width,
+      height
+    } = getCssDimensions(popupElement);
+    const shouldSkipAutoSizeSync = value != null && value !== itemValue && (event2.type === "click" || pointerType !== "touch");
+    handleActivation(event2);
+    if (shouldSkipAutoSizeSync) {
+      skipAutoSizeSyncRef.current = true;
+    }
+    handleValueChange(width, height);
+  });
+  const state = {
+    open: isActiveItem
+  };
+  function handleSetPointerType(event2) {
+    setPointerType(event2.pointerType);
+  }
+  const defaultProps = {
+    tabIndex: 0,
+    onMouseEnter: handleOpenEvent,
+    onClick: handleOpenEvent,
+    onPointerEnter: handleSetPointerType,
+    onPointerDown: handleSetPointerType,
+    "aria-expanded": isActiveItem,
+    "aria-controls": isActiveItem ? popupElement == null ? void 0 : popupElement.id : void 0,
+    [NAVIGATION_MENU_TRIGGER_IDENTIFIER]: "",
+    onFocus() {
+      if (!isActiveItem) {
+        return;
+      }
+      setViewportInert(false);
+    },
+    onMouseMove() {
+      allowFocusRef.current = false;
+    },
+    onKeyDown(event$1) {
+      allowFocusRef.current = true;
+      if (nested) {
+        return;
+      }
+      const openHorizontal = orientation === "horizontal" && event$1.key === "ArrowDown";
+      const openVertical = orientation === "vertical" && event$1.key === "ArrowRight";
+      if (openHorizontal || openVertical) {
+        setValue(itemValue, createBaseUIEventDetails.createChangeEventDetails(createBaseUIEventDetails.listNavigation, event$1.nativeEvent));
+        handleOpenEvent(event$1);
+        event.stopEvent(event$1);
+      }
+    },
+    onBlur(event2) {
+      if (positionerElement && popupElement && isOutsideMenuEvent({
+        currentTarget: event2.currentTarget,
+        relatedTarget: event2.relatedTarget
+      }, {
+        popupElement,
+        rootRef,
+        tree,
+        nodeId
+      })) {
+        setValue(null, createBaseUIEventDetails.createChangeEventDetails(createBaseUIEventDetails.focusOut, event2.nativeEvent));
+      }
+    }
+  };
+  const {
+    getButtonProps,
+    buttonRef
+  } = useButton.useButton({
+    disabled,
+    focusableWhenDisabled: true,
+    native: nativeButton
+  });
+  const referenceElement = hoverFloatingElement;
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(React__namespace.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CompositeItem.CompositeItem, {
+      tag: "button",
+      render,
+      className,
+      state,
+      stateAttributesMapping: popupStateMapping.pressableTriggerOpenStateMapping,
+      refs: [forwardedRef, handleTriggerElement, buttonRef],
+      props: [getReferenceProps, (dismissProps == null ? void 0 : dismissProps.reference) || useRenderElement.EMPTY_ARRAY, defaultProps, elementProps, getButtonProps]
+    }), isActiveItem && /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(React__namespace.Fragment, {
+      children: [/* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FocusGuard, {
+        ref: beforeOutsideRef,
+        onFocus: (event2) => {
+          var _a;
+          if (referenceElement && popupStateMapping.isOutsideEvent(event2, referenceElement)) {
+            (_a = beforeInsideRef.current) == null ? void 0 : _a.focus();
+          } else {
+            const prevTabbable = popupStateMapping.getPreviousTabbable(triggerElement);
+            prevTabbable == null ? void 0 : prevTabbable.focus();
+          }
+        }
+      }), /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("span", {
+        "aria-owns": viewportElement == null ? void 0 : viewportElement.id,
+        style: popupStateMapping.ownerVisuallyHidden
+      }), /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FocusGuard, {
+        ref: afterOutsideRef,
+        onFocus: (event2) => {
+          if (referenceElement && popupStateMapping.isOutsideEvent(event2, referenceElement)) {
+            const elementToFocus = afterInsideRef.current && popupStateMapping.isTabbable(afterInsideRef.current) ? afterInsideRef.current : triggerElement;
+            elementToFocus == null ? void 0 : elementToFocus.focus();
+          } else {
+            let nextTabbable = popupStateMapping.getNextTabbable(triggerElement);
+            if (nested && !positionerElement && referenceElement && nextTabbable && element.contains(referenceElement, nextTabbable)) {
+              nextTabbable = popupStateMapping.getTabbableAfterElement(afterInsideRef.current);
+            }
+            nextTabbable == null ? void 0 : nextTabbable.focus();
+            if ((!nested || positionerElement) && !element.contains(rootRef.current, nextTabbable)) {
+              setValue(null, createBaseUIEventDetails.createChangeEventDetails(createBaseUIEventDetails.focusOut, event2.nativeEvent));
+            }
+          }
+        }
+      })]
+    })]
+  });
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuTrigger$1.displayName = "NavigationMenuTrigger";
+function getPlacementFromElements(domReferenceElement, floatingElement) {
+  const referenceRect = domReferenceElement.getBoundingClientRect();
+  const floatingRect = floatingElement.getBoundingClientRect();
+  const referenceCenterX = referenceRect.left + referenceRect.width / 2;
+  const referenceCenterY = referenceRect.top + referenceRect.height / 2;
+  const floatingCenterX = floatingRect.left + floatingRect.width / 2;
+  const floatingCenterY = floatingRect.top + floatingRect.height / 2;
+  const deltaX = floatingCenterX - referenceCenterX;
+  const deltaY = floatingCenterY - referenceCenterY;
+  if (Math.abs(deltaX) >= Math.abs(deltaY)) {
+    return deltaX >= 0 ? "right" : "left";
+  }
+  return deltaY >= 0 ? "bottom" : "top";
+}
+function getHandleCloseContext(domReferenceElement, floatingElement, nodeId) {
+  return {
+    placement: getPlacementFromElements(domReferenceElement, floatingElement),
+    elements: {
+      domReference: domReferenceElement,
+      floating: floatingElement
+    },
+    nodeId
+  };
+}
+const NavigationMenuPortalContext = /* @__PURE__ */ React__namespace.createContext(void 0);
+if (process.env.NODE_ENV !== "production") NavigationMenuPortalContext.displayName = "NavigationMenuPortalContext";
+function useNavigationMenuPortalContext() {
+  const value = React__namespace.useContext(NavigationMenuPortalContext);
+  if (value === void 0) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: <NavigationMenu.Portal> is missing." : useRenderElement.formatErrorMessage(40));
+  }
+  return value;
+}
+const NavigationMenuPortal = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuPortal2(props, forwardedRef) {
+  const {
+    keepMounted = false,
+    ...portalProps
+  } = props;
+  const {
+    mounted
+  } = useNavigationMenuRootContext();
+  const shouldRender = mounted || keepMounted;
+  if (!shouldRender) {
+    return null;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuPortalContext.Provider, {
+    value: keepMounted,
+    children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FloatingPortal, {
+      ref: forwardedRef,
+      ...portalProps
+    })
+  });
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuPortal.displayName = "NavigationMenuPortal";
+const NavigationMenuPositionerContext = /* @__PURE__ */ React__namespace.createContext(void 0);
+if (process.env.NODE_ENV !== "production") NavigationMenuPositionerContext.displayName = "NavigationMenuPositionerContext";
+function useNavigationMenuPositionerContext(optional = false) {
+  const context = React__namespace.useContext(NavigationMenuPositionerContext);
+  if (!context && !optional) {
+    throw new Error(process.env.NODE_ENV !== "production" ? "Base UI: NavigationMenuPositionerContext is missing. NavigationMenuPositioner parts must be placed within <NavigationMenu.Positioner>." : useRenderElement.formatErrorMessage(42));
+  }
+  return context;
+}
+const EMPTY_ROOT_CONTEXT$1 = getEmptyRootContext.getEmptyRootContext();
+const NavigationMenuPositioner$1 = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuPositioner(componentProps, forwardedRef) {
+  const {
+    open,
+    mounted,
+    positionerElement,
+    setPositionerElement,
+    floatingRootContext,
+    nested,
+    transitionStatus
+  } = useNavigationMenuRootContext();
+  const {
+    className,
+    render,
+    anchor,
+    positionMethod = "absolute",
+    side = "bottom",
+    align = "center",
+    sideOffset = 0,
+    alignOffset = 0,
+    collisionBoundary = "clipping-ancestors",
+    collisionPadding = 5,
+    collisionAvoidance = nested ? popupStateMapping.POPUP_COLLISION_AVOIDANCE : popupStateMapping.DROPDOWN_COLLISION_AVOIDANCE,
+    arrowPadding = 5,
+    sticky = false,
+    disableAnchorTracking = false,
+    ...elementProps
+  } = componentProps;
+  const keepMounted = useNavigationMenuPortalContext();
+  const nodeId = useNavigationMenuTreeContext();
+  const resizeTimeout = useTimeout.useTimeout();
+  const [instant, setInstant] = React__namespace.useState(false);
+  const positionerRef = React__namespace.useRef(null);
+  const prevTriggerElementRef = React__namespace.useRef(null);
+  React__namespace.useEffect(() => {
+    if (!positionerElement) {
+      return void 0;
+    }
+    function onFocus(event2) {
+      if (positionerElement && popupStateMapping.isOutsideEvent(event2)) {
+        const focusing = event2.type === "focusin";
+        const manageFocus = focusing ? popupStateMapping.enableFocusInside : popupStateMapping.disableFocusInside;
+        manageFocus(positionerElement);
+      }
+    }
+    positionerElement.addEventListener("focusin", onFocus, true);
+    positionerElement.addEventListener("focusout", onFocus, true);
+    return () => {
+      positionerElement.removeEventListener("focusin", onFocus, true);
+      positionerElement.removeEventListener("focusout", onFocus, true);
+    };
+  }, [positionerElement]);
+  const domReference = (floatingRootContext || EMPTY_ROOT_CONTEXT$1).useState("domReferenceElement");
+  const positioning = useAnchorPositioning.useAnchorPositioning({
+    anchor: anchor ?? domReference ?? prevTriggerElementRef,
+    positionMethod,
+    mounted,
+    side,
+    sideOffset,
+    align,
+    alignOffset,
+    arrowPadding,
+    collisionBoundary,
+    collisionPadding,
+    sticky,
+    disableAnchorTracking,
+    keepMounted,
+    floatingRootContext,
+    collisionAvoidance,
+    nodeId,
+    // Allows the menu to remain anchored without wobbling while its size
+    // and position transition simultaneously when side=top or side=left.
+    adaptiveOrigin: useAnchorPositioning.adaptiveOrigin
+  });
+  const defaultProps = React__namespace.useMemo(() => {
+    const hiddenStyles = {};
+    if (!open) {
+      hiddenStyles.pointerEvents = "none";
+    }
+    return {
+      role: "presentation",
+      hidden: !mounted,
+      style: {
+        ...positioning.positionerStyles,
+        ...hiddenStyles
+      }
+    };
+  }, [open, mounted, positioning.positionerStyles]);
+  const state = {
+    open,
+    side: positioning.side,
+    align: positioning.align,
+    anchorHidden: positioning.anchorHidden,
+    instant
+  };
+  React__namespace.useEffect(() => {
+    if (!open) {
+      return void 0;
+    }
+    function handleResize() {
+      ReactDOM__namespace.flushSync(() => {
+        setInstant(true);
+      });
+      resizeTimeout.start(100, () => {
+        setInstant(false);
+      });
+    }
+    const win = floatingUi_utils_dom.getWindow(positionerElement);
+    win.addEventListener("resize", handleResize);
+    return () => {
+      win.removeEventListener("resize", handleResize);
+    };
+  }, [open, resizeTimeout, positionerElement]);
+  const element2 = useRenderElement.useRenderElement("div", componentProps, {
+    state,
+    ref: [forwardedRef, setPositionerElement, positionerRef],
+    props: [defaultProps, useAnchorPositioning.getDisabledMountTransitionStyles(transitionStatus), elementProps],
+    stateAttributesMapping: popupStateMapping.popupStateMapping
+  });
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuPositionerContext.Provider, {
+    value: positioning,
+    children: element2
+  });
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuPositioner$1.displayName = "NavigationMenuPositioner";
+const EMPTY_ROOT_CONTEXT = getEmptyRootContext.getEmptyRootContext();
+function Guards({
+  children
+}) {
+  const {
+    beforeInsideRef,
+    beforeOutsideRef,
+    afterInsideRef,
+    afterOutsideRef,
+    positionerElement,
+    viewportElement,
+    floatingRootContext
+  } = useNavigationMenuRootContext();
+  const hasPositioner = Boolean(useNavigationMenuPositionerContext(true));
+  const referenceElement = positionerElement || viewportElement;
+  if (!floatingRootContext && !hasPositioner) {
+    return children;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(React__namespace.Fragment, {
+    children: [/* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FocusGuard, {
+      ref: beforeInsideRef,
+      onFocus: (event2) => {
+        var _a, _b;
+        if (referenceElement && popupStateMapping.isOutsideEvent(event2, referenceElement)) {
+          (_a = popupStateMapping.getNextTabbable(referenceElement)) == null ? void 0 : _a.focus();
+        } else {
+          (_b = beforeOutsideRef.current) == null ? void 0 : _b.focus();
+        }
+      }
+    }), children, /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(popupStateMapping.FocusGuard, {
+      ref: afterInsideRef,
+      onFocus: (event2) => {
+        var _a, _b;
+        if (referenceElement && popupStateMapping.isOutsideEvent(event2, referenceElement)) {
+          (_a = popupStateMapping.getPreviousTabbable(referenceElement)) == null ? void 0 : _a.focus();
+        } else {
+          (_b = afterOutsideRef.current) == null ? void 0 : _b.focus();
+        }
+      }
+    })]
+  });
+}
+const NavigationMenuViewport = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuViewport2(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    children,
+    id: idProp,
+    ...elementProps
+  } = componentProps;
+  const id = useBaseUiId.useId(idProp);
+  const {
+    setViewportElement,
+    setViewportTargetElement,
+    floatingRootContext,
+    prevTriggerElementRef,
+    viewportInert,
+    setViewportInert
+  } = useNavigationMenuRootContext();
+  const positioning = useNavigationMenuPositionerContext(true);
+  const hasPositioner = Boolean(positioning);
+  const domReference = (floatingRootContext || EMPTY_ROOT_CONTEXT).useState("domReferenceElement");
+  useIsoLayoutEffect.useIsoLayoutEffect(() => {
+    if (domReference) {
+      prevTriggerElementRef.current = domReference;
+    }
+  }, [domReference, prevTriggerElementRef]);
+  const element$1 = useRenderElement.useRenderElement("div", componentProps, {
+    ref: [forwardedRef, setViewportElement],
+    props: [{
+      id,
+      onBlur(event2) {
+        const relatedTarget = event2.relatedTarget;
+        const currentTarget = event2.currentTarget;
+        if (relatedTarget && !element.contains(currentTarget, relatedTarget) && relatedTarget !== domReference) {
+          setViewportInert(true);
+        }
+      },
+      ...!hasPositioner && viewportInert && {
+        inert: inertValue.inertValue(true)
+      },
+      children: hasPositioner ? children : /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Guards, {
+        children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", {
+          ref: setViewportTargetElement,
+          children
+        })
+      })
+    }, elementProps]
+  });
+  return hasPositioner ? /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(Guards, {
+    children: element$1
+  }) : element$1;
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuViewport.displayName = "NavigationMenuViewport";
+const stateAttributesMapping = {
+  ...popupStateMapping.popupStateMapping,
+  ...useOpenChangeComplete.transitionStatusMapping
+};
+const NavigationMenuPopup = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuPopup2(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    id: idProp,
+    ...elementProps
+  } = componentProps;
+  const {
+    open,
+    transitionStatus,
+    setPopupElement
+  } = useNavigationMenuRootContext();
+  const positioning = useNavigationMenuPositionerContext();
+  const direction = DirectionContext.useDirection();
+  const id = useBaseUiId.useBaseUiId(idProp);
+  const state = {
+    open,
+    transitionStatus,
+    side: positioning.side,
+    align: positioning.align,
+    anchorHidden: positioning.anchorHidden
+  };
+  let isOriginSide = positioning.side === "top";
+  let isPhysicalLeft = positioning.side === "left";
+  if (direction === "rtl") {
+    isOriginSide = isOriginSide || positioning.side === "inline-end";
+    isPhysicalLeft = isPhysicalLeft || positioning.side === "inline-end";
+  } else {
+    isOriginSide = isOriginSide || positioning.side === "inline-start";
+    isPhysicalLeft = isPhysicalLeft || positioning.side === "inline-start";
+  }
+  const element2 = useRenderElement.useRenderElement("nav", componentProps, {
+    state,
+    ref: [forwardedRef, setPopupElement],
+    props: [{
+      id,
+      tabIndex: -1,
+      style: isOriginSide ? {
+        position: "absolute",
+        [positioning.side === "top" ? "bottom" : "top"]: "0",
+        [isPhysicalLeft ? "right" : "left"]: "0"
+      } : {}
+    }, elementProps],
+    stateAttributesMapping
+  });
+  return element2;
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuPopup.displayName = "NavigationMenuPopup";
+const NavigationMenuLink$1 = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuLink(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    active = false,
+    closeOnClick = false,
+    ...elementProps
+  } = componentProps;
+  const {
+    setValue,
+    popupElement,
+    positionerElement,
+    rootRef
+  } = useNavigationMenuRootContext();
+  const nodeId = useNavigationMenuTreeContext();
+  const tree = popupStateMapping.useFloatingTree();
+  const state = {
+    active
+  };
+  const defaultProps = {
+    "aria-current": active ? "page" : void 0,
+    tabIndex: void 0,
+    onClick(event2) {
+      if (closeOnClick) {
+        setValue(null, createBaseUIEventDetails.createChangeEventDetails(createBaseUIEventDetails.linkPress, event2.nativeEvent));
+      }
+    },
+    onBlur(event2) {
+      if (positionerElement && popupElement && isOutsideMenuEvent({
+        currentTarget: event2.currentTarget,
+        relatedTarget: event2.relatedTarget
+      }, {
+        popupElement,
+        rootRef,
+        tree,
+        nodeId
+      })) {
+        setValue(null, createBaseUIEventDetails.createChangeEventDetails(createBaseUIEventDetails.focusOut, event2.nativeEvent));
+      }
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(CompositeItem.CompositeItem, {
+    tag: "a",
+    render,
+    className,
+    state,
+    refs: [forwardedRef],
+    props: [defaultProps, elementProps]
+  });
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuLink$1.displayName = "NavigationMenuLink";
+const NavigationMenuIcon = /* @__PURE__ */ React__namespace.forwardRef(function NavigationMenuIcon2(componentProps, forwardedRef) {
+  const {
+    className,
+    render,
+    ...elementProps
+  } = componentProps;
+  const {
+    value: itemValue
+  } = useNavigationMenuItemContext();
+  const {
+    open,
+    value
+  } = useNavigationMenuRootContext();
+  const isActiveItem = open && value === itemValue;
+  const state = {
+    open: isActiveItem
+  };
+  const element2 = useRenderElement.useRenderElement("span", componentProps, {
+    state,
+    ref: forwardedRef,
+    props: [{
+      "aria-hidden": true,
+      children: "▼"
+    }, elementProps],
+    stateAttributesMapping: popupStateMapping.triggerOpenStateMapping
+  });
+  return element2;
+});
+if (process.env.NODE_ENV !== "production") NavigationMenuIcon.displayName = "NavigationMenuIcon";
+function NavigationMenu({
+  align = "start",
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
+    NavigationMenuRoot,
+    {
+      "data-slot": "navigation-menu",
+      className: utils.cn(
+        "group/navigation-menu relative flex max-w-max flex-1 items-center justify-center",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuPositioner2, { align })
+      ]
+    }
+  );
+}
+function NavigationMenuList2({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    NavigationMenuList$1,
+    {
+      "data-slot": "navigation-menu-list",
+      className: utils.cn(
+        "group flex flex-1 list-none items-center justify-center gap-0",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function NavigationMenuItem2({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    NavigationMenuItem$1,
+    {
+      "data-slot": "navigation-menu-item",
+      className: utils.cn("relative", className),
+      ...props
+    }
+  );
+}
+const navigationMenuTriggerStyle = classVarianceAuthority.cva(
+  "group/navigation-menu-trigger inline-flex h-9 w-max items-center justify-center rounded-lg px-2.5 py-1.5 text-sm font-medium transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 disabled:pointer-events-none disabled:opacity-50 data-popup-open:bg-muted/50 data-popup-open:hover:bg-muted data-open:bg-muted/50 data-open:hover:bg-muted data-open:focus:bg-muted"
+);
+function NavigationMenuTrigger2({
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsxs(
+    NavigationMenuTrigger$1,
+    {
+      "data-slot": "navigation-menu-trigger",
+      className: utils.cn(navigationMenuTriggerStyle(), "group", className),
+      ...props,
+      children: [
+        children,
+        " ",
+        /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(lucideReact.ChevronDownIcon, { className: "relative top-px ml-1 size-3 transition duration-300 group-data-popup-open/navigation-menu-trigger:rotate-180 group-data-open/navigation-menu-trigger:rotate-180", "aria-hidden": "true" })
+      ]
+    }
+  );
+}
+function NavigationMenuContent2({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    NavigationMenuContent$1,
+    {
+      "data-slot": "navigation-menu-content",
+      className: utils.cn(
+        "data-ending-style:data-activation-direction=left:translate-x-[50%] data-ending-style:data-activation-direction=right:translate-x-[-50%] data-starting-style:data-activation-direction=left:translate-x-[-50%] data-starting-style:data-activation-direction=right:translate-x-[50%] h-full w-auto p-1 transition-[opacity,transform,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] group-data-[viewport=false]/navigation-menu:rounded-lg group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:ring-1 group-data-[viewport=false]/navigation-menu:ring-foreground/10 group-data-[viewport=false]/navigation-menu:duration-300 data-ending-style:opacity-0 data-starting-style:opacity-0 data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 data-[motion^=from-]:animate-in data-[motion^=from-]:fade-in data-[motion^=to-]:animate-out data-[motion^=to-]:fade-out **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none group-data-[viewport=false]/navigation-menu:data-open:animate-in group-data-[viewport=false]/navigation-menu:data-open:fade-in-0 group-data-[viewport=false]/navigation-menu:data-open:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-closed:animate-out group-data-[viewport=false]/navigation-menu:data-closed:fade-out-0 group-data-[viewport=false]/navigation-menu:data-closed:zoom-out-95",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function NavigationMenuPositioner2({
+  className,
+  side = "bottom",
+  sideOffset = 8,
+  align = "start",
+  alignOffset = 0,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuPortal, { children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    NavigationMenuPositioner$1,
+    {
+      side,
+      sideOffset,
+      align,
+      alignOffset,
+      className: utils.cn(
+        "isolate z-50 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] data-instant:transition-none data-[side=bottom]:before:top-[-10px] data-[side=bottom]:before:right-0 data-[side=bottom]:before:left-0",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuPopup, { className: "data-[ending-style]:easing-[ease] xs:w-(--popup-width) relative h-(--popup-height) w-(--popup-width) origin-(--transform-origin) rounded-lg bg-popover text-popover-foreground shadow ring-1 ring-foreground/10 transition-[opacity,transform,width,height,scale,translate] duration-[0.35s] ease-[cubic-bezier(0.22,1,0.36,1)] outline-none data-ending-style:scale-90 data-ending-style:opacity-0 data-ending-style:duration-150 data-starting-style:scale-90 data-starting-style:opacity-0", children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(NavigationMenuViewport, { className: "relative size-full overflow-hidden" }) })
+    }
+  ) });
+}
+function NavigationMenuLink2({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    NavigationMenuLink$1,
+    {
+      "data-slot": "navigation-menu-link",
+      className: utils.cn(
+        "flex items-center gap-2 rounded-lg p-2 text-sm transition-all outline-none hover:bg-muted focus:bg-muted focus-visible:ring-3 focus-visible:ring-ring/50 focus-visible:outline-1 in-data-[slot=navigation-menu-content]:rounded-md data-active:bg-muted/50 data-active:hover:bg-muted data-active:focus:bg-muted [&_svg:not([class*='size-'])]:size-4",
+        className
+      ),
+      ...props
+    }
+  );
+}
+function NavigationMenuIndicator({
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx(
+    NavigationMenuIcon,
+    {
+      "data-slot": "navigation-menu-indicator",
+      className: utils.cn(
+        "top-full z-1 flex h-1.5 items-end justify-center overflow-hidden data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:animate-in data-[state=visible]:fade-in",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsxRuntimeExports.jsx("div", { className: "relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" })
+    }
+  );
+}
+exports.NavigationMenu = NavigationMenu;
+exports.NavigationMenuContent = NavigationMenuContent2;
+exports.NavigationMenuIndicator = NavigationMenuIndicator;
+exports.NavigationMenuItem = NavigationMenuItem2;
+exports.NavigationMenuLink = NavigationMenuLink2;
+exports.NavigationMenuList = NavigationMenuList2;
+exports.NavigationMenuPositioner = NavigationMenuPositioner2;
+exports.NavigationMenuTrigger = NavigationMenuTrigger2;
+exports.navigationMenuTriggerStyle = navigationMenuTriggerStyle;
+//# sourceMappingURL=index.js.map