"use client";
import * as React from "react";
import { isHTMLElement } from "../../../../../@floating-ui/utils/dist/floating-ui.utils.dom.js";
import { useControlled } from "../../../../utils/esm/useControlled.js";
import { useStableCallback } from "../../../../utils/esm/useStableCallback.js";
import { ownerDocument } from "../../../../utils/esm/owner.js";
import { useRenderElement } from "../../utils/useRenderElement.js";
import { NavigationMenuRootContext, useNavigationMenuRootContext, NavigationMenuTreeContext } from "./NavigationMenuRootContext.js";
import { useOpenChangeComplete } from "../../utils/useOpenChangeComplete.js";
import { useTransitionStatus } from "../../utils/useTransitionStatus.js";
import { setFixedSize } from "../utils/setFixedSize.js";
import { jsx } from "react/jsx-runtime";
import { useFloatingParentNodeId, FloatingTree, useFloatingNodeId } from "../../floating-ui-react/components/FloatingTree.js";
import { activeElement, contains } from "../../floating-ui-react/utils/element.js";
import { triggerHover, outsidePress, focusOut } from "../../utils/reason-parts.js";
const blockedReturnFocusReasons = /* @__PURE__ */ new Set([triggerHover, outsidePress, focusOut]);
const NavigationMenuRoot = /* @__PURE__ */ React.forwardRef(function NavigationMenuRoot2(componentProps, forwardedRef) {
  const {
    defaultValue = null,
    value: valueParam,
    onValueChange,
    actionsRef,
    delay = 50,
    closeDelay = 50,
    orientation = "horizontal",
    onOpenChangeComplete
  } = componentProps;
  const nested = useFloatingParentNodeId() != null;
  const [value, setValueUnwrapped] = useControlled({
    controlled: valueParam,
    default: defaultValue,
    name: "NavigationMenu",
    state: "value"
  });
  const open = value != null;
  const closeReasonRef = React.useRef(void 0);
  const rootRef = React.useRef(null);
  const [positionerElement, setPositionerElement] = React.useState(null);
  const [popupElement, setPopupElement] = React.useState(null);
  const [viewportElement, setViewportElement] = React.useState(null);
  const [viewportTargetElement, setViewportTargetElement] = React.useState(null);
  const [activationDirection, setActivationDirection] = React.useState(null);
  const [floatingRootContext, setFloatingRootContext] = React.useState(void 0);
  const [viewportInert, setViewportInert] = React.useState(false);
  const prevTriggerElementRef = React.useRef(null);
  const currentContentRef = React.useRef(null);
  const beforeInsideRef = React.useRef(null);
  const afterInsideRef = React.useRef(null);
  const beforeOutsideRef = React.useRef(null);
  const afterOutsideRef = React.useRef(null);
  const {
    mounted,
    setMounted,
    transitionStatus
  } = useTransitionStatus(open);
  React.useEffect(() => {
    setViewportInert(false);
  }, [value]);
  const setValue = useStableCallback((nextValue, eventDetails) => {
    if (!nextValue) {
      closeReasonRef.current = eventDetails.reason;
      setActivationDirection(null);
      setFloatingRootContext(void 0);
      if (positionerElement && popupElement) {
        setFixedSize(popupElement, "popup");
        setFixedSize(positionerElement, "positioner");
      }
    }
    if (nextValue !== value) {
      onValueChange?.(nextValue, eventDetails);
    }
    if (eventDetails.isCanceled) {
      return;
    }
    setValueUnwrapped(nextValue);
  });
  const handleUnmount = useStableCallback(() => {
    const doc = ownerDocument(rootRef.current);
    const activeEl = activeElement(doc);
    const isReturnFocusBlocked = closeReasonRef.current ? blockedReturnFocusReasons.has(closeReasonRef.current) : false;
    if (!isReturnFocusBlocked && isHTMLElement(prevTriggerElementRef.current) && (activeEl === ownerDocument(popupElement).body || contains(popupElement, activeEl)) && popupElement) {
      prevTriggerElementRef.current.focus({
        preventScroll: true
      });
      prevTriggerElementRef.current = void 0;
    }
    setMounted(false);
    onOpenChangeComplete?.(false);
    setActivationDirection(null);
    setFloatingRootContext(void 0);
    currentContentRef.current = null;
    closeReasonRef.current = void 0;
  });
  useOpenChangeComplete({
    enabled: !actionsRef,
    open,
    ref: {
      current: popupElement
    },
    onComplete() {
      if (!open) {
        handleUnmount();
      }
    }
  });
  useOpenChangeComplete({
    enabled: !actionsRef,
    open,
    ref: {
      current: viewportTargetElement
    },
    onComplete() {
      if (!open) {
        handleUnmount();
      }
    }
  });
  const contextValue = React.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$1 = /* @__PURE__ */ jsx(NavigationMenuRootContext.Provider, {
    value: contextValue,
    children: /* @__PURE__ */ jsx(TreeContext, {
      componentProps,
      forwardedRef,
      children: componentProps.children
    })
  });
  if (!nested) {
    return /* @__PURE__ */ jsx(FloatingTree, {
      children: jsx$1
    });
  }
  return jsx$1;
});
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 = useFloatingNodeId();
  const {
    rootRef,
    nested
  } = useNavigationMenuRootContext();
  const {
    open
  } = useNavigationMenuRootContext();
  const state = React.useMemo(() => ({
    open,
    nested
  }), [open, nested]);
  const element = useRenderElement(nested ? "div" : "nav", props.componentProps, {
    state,
    ref: [props.forwardedRef, rootRef],
    props: [{
      "aria-orientation": orientation
    }, elementProps]
  });
  return /* @__PURE__ */ jsx(NavigationMenuTreeContext.Provider, {
    value: nodeId,
    children: element
  });
}
export {
  NavigationMenuRoot
};
//# sourceMappingURL=NavigationMenuRoot.js.map
