@expcat/tigercat-vue 2.0.4 → 2.1.0

package/dist/chunk-UXJRH72H.mjs

@@ -0,0 +1,834 @@
+import {
+  renderVueOverlayTeleport,
+  useVueAnchoredOverlay
+} from "./chunk-Q7Y22OFX.mjs";
+
+// src/components/NavigationMenu.ts
+import {
+  defineComponent,
+  computed,
+  ref,
+  provide,
+  inject,
+  h,
+  onBeforeUnmount,
+  onMounted,
+  onUpdated,
+  nextTick
+} from "vue";
+import {
+  classNames,
+  coerceClassValue,
+  mergeStyleValues,
+  getNavigationMenuClasses,
+  getNavigationMenuListClasses,
+  getNavigationMenuItemClasses,
+  getNavigationMenuTriggerClasses,
+  getNavigationMenuChevronClasses,
+  getNavigationMenuContentClasses,
+  getNavigationMenuLinkClasses,
+  injectNavigationMenuStyles,
+  NAVIGATION_MENU_ENTER_CLASS,
+  NAVIGATION_MENU_CHEVRON_PATH,
+  NAVIGATION_MENU_BAR_ITEM_ATTR,
+  NAVIGATION_MENU_DEFAULT_DELAY_DURATION,
+  NAVIGATION_MENU_DEFAULT_SKIP_DELAY_DURATION,
+  NAVIGATION_MENU_DEFAULT_OFFSET,
+  isNavigationMenuValueOpen,
+  isNavigationMenuOpen,
+  resolveNavigationMenuOpenValue,
+  shouldSkipNavigationMenuOpenDelay,
+  isNavigationMenuTriggerOpenKey,
+  handleMenubarNavigation,
+  handleMenuNavigation,
+  initNavigationMenuRovingTabIndex,
+  focusFirstMenuItem,
+  captureActiveElement,
+  restoreFocus,
+  getSecureRel
+} from "@expcat/tigercat-core";
+var navigationMenuItemIdCounter = 0;
+var createNavigationMenuItemId = () => `tiger-navigation-menu-item-${++navigationMenuItemIdCounter}`;
+var NavigationMenuContextKey = /* @__PURE__ */ Symbol("NavigationMenuContext");
+var NavigationMenuItemContextKey = /* @__PURE__ */ Symbol("NavigationMenuItemContext");
+var NavigationMenuContentContextKey = /* @__PURE__ */ Symbol("NavigationMenuContentContext");
+function containsFocusTarget(container, target) {
+  return Boolean(container && target instanceof Node && container.contains(target));
+}
+function getOpenPanelFromMenubar(menubar) {
+  if (!menubar) return null;
+  const trigger = menubar.querySelector('[aria-expanded="true"][aria-controls]');
+  const contentId = trigger?.getAttribute("aria-controls");
+  if (!contentId) return null;
+  return menubar.ownerDocument.getElementById(contentId);
+}
+function splitClassStyleAttrs(attrs) {
+  const {
+    class: attrsClass,
+    style: attrsStyle,
+    ...restAttrs
+  } = attrs;
+  return { restAttrs, attrsClass, attrsStyle };
+}
+var NavigationMenuLink = defineComponent({
+  name: "TigerNavigationMenuLink",
+  inheritAttrs: false,
+  props: {
+    href: {
+      type: String,
+      default: void 0
+    },
+    target: {
+      type: String,
+      default: void 0
+    },
+    rel: {
+      type: String,
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    active: {
+      type: Boolean,
+      default: false
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: ["click"],
+  setup(props, { slots, emit, attrs }) {
+    const attrsRecord = attrs;
+    const root = inject(NavigationMenuContextKey, null);
+    const item = inject(NavigationMenuItemContextKey, null);
+    const content = inject(
+      NavigationMenuContentContextKey,
+      null
+    );
+    const inPanel = Boolean(content);
+    const disabled = computed(() => props.disabled || Boolean(item?.disabled));
+    const handleClick = (event) => {
+      if (disabled.value) {
+        event.preventDefault();
+        event.stopPropagation();
+        return;
+      }
+      emit("click", event);
+      root?.handleItemClick();
+    };
+    const handleFocus = () => {
+      if (inPanel) return;
+      if (!item || !item.hasPanel.value) {
+        root?.setValue(null, { restoreFocus: false });
+      }
+    };
+    const handleKeyDown = (event) => {
+      if (inPanel) return;
+      if (root?.menubarRef.value) {
+        handleMenubarNavigation(root.menubarRef.value, event);
+      }
+    };
+    const linkClasses = computed(
+      () => classNames(
+        getNavigationMenuLinkClasses(disabled.value, inPanel, props.active),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      )
+    );
+    const mergedStyle = computed(
+      () => mergeStyleValues(attrsRecord.style, props.style)
+    );
+    return () => {
+      const { restAttrs } = splitClassStyleAttrs(attrsRecord);
+      const isAnchor = Boolean(props.href);
+      const rel = isAnchor ? getSecureRel(
+        props.target,
+        props.rel
+      ) : void 0;
+      return h(
+        isAnchor ? "a" : "button",
+        {
+          ...restAttrs,
+          href: isAnchor ? props.href : void 0,
+          target: isAnchor ? props.target : void 0,
+          rel,
+          type: isAnchor ? void 0 : "button",
+          class: linkClasses.value,
+          style: mergedStyle.value,
+          role: "menuitem",
+          tabindex: inPanel ? -1 : -1,
+          [NAVIGATION_MENU_BAR_ITEM_ATTR]: inPanel ? void 0 : "",
+          "aria-disabled": disabled.value || void 0,
+          "aria-current": props.active ? "page" : void 0,
+          disabled: isAnchor ? void 0 : disabled.value,
+          "data-tiger-navigation-menu-link": "",
+          "data-active": props.active ? "true" : void 0,
+          onClick: handleClick,
+          onFocus: handleFocus,
+          onKeydown: handleKeyDown
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
+var NavigationMenuTrigger = defineComponent({
+  name: "TigerNavigationMenuTrigger",
+  inheritAttrs: false,
+  props: {
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    showArrow: {
+      type: Boolean,
+      default: void 0
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const attrsRecord = attrs;
+    const root = inject(NavigationMenuContextKey, null);
+    const item = inject(NavigationMenuItemContextKey, null);
+    const disabled = computed(
+      () => props.disabled || Boolean(item?.disabled) || Boolean(root?.disabled)
+    );
+    const showArrow = computed(
+      () => props.showArrow !== void 0 ? props.showArrow : item?.showArrow ?? true
+    );
+    const handleMouseEnter = () => {
+      if (disabled.value) return;
+      item?.scheduleOpen();
+    };
+    const handleMouseLeave = () => {
+      item?.scheduleClose();
+    };
+    const handleFocus = () => {
+      if (disabled.value || root?.suppressFocusOpen.value) return;
+      item?.open();
+    };
+    const handleClick = (event) => {
+      if (disabled.value) {
+        event.preventDefault();
+        return;
+      }
+      item?.open();
+    };
+    const handleKeyDown = (event) => {
+      if (disabled.value || !item) return;
+      if (root?.menubarRef.value && handleMenubarNavigation(root.menubarRef.value, event)) {
+        return;
+      }
+      if (isNavigationMenuTriggerOpenKey(event.key) && item.hasPanel.value) {
+        event.preventDefault();
+        item.open(true);
+        return;
+      }
+      if (event.key === "Escape" && item.isOpen.value) {
+        event.preventDefault();
+        item.close();
+        item.triggerRef.value?.focus();
+      }
+    };
+    const triggerClasses = computed(
+      () => classNames(
+        getNavigationMenuTriggerClasses(disabled.value, Boolean(item?.isOpen.value)),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      )
+    );
+    const mergedStyle = computed(
+      () => mergeStyleValues(attrsRecord.style, props.style)
+    );
+    return () => {
+      if (!item) return null;
+      const { restAttrs } = splitClassStyleAttrs(attrsRecord);
+      const chevron = showArrow.value ? h(
+        "svg",
+        {
+          class: getNavigationMenuChevronClasses(item.isOpen.value),
+          viewBox: "0 0 24 24",
+          fill: "none",
+          stroke: "currentColor",
+          "stroke-width": "2",
+          "stroke-linecap": "round",
+          "stroke-linejoin": "round",
+          "aria-hidden": "true"
+        },
+        [h("path", { d: NAVIGATION_MENU_CHEVRON_PATH })]
+      ) : null;
+      return h(
+        "button",
+        {
+          ...restAttrs,
+          ref: item.triggerRef,
+          type: "button",
+          class: triggerClasses.value,
+          style: mergedStyle.value,
+          role: "menuitem",
+          tabindex: -1,
+          [NAVIGATION_MENU_BAR_ITEM_ATTR]: "",
+          "aria-haspopup": "menu",
+          "aria-expanded": item.isOpen.value,
+          "aria-controls": item.isOpen.value ? item.contentId : void 0,
+          "aria-disabled": disabled.value || void 0,
+          disabled: disabled.value,
+          "data-state": item.isOpen.value ? "open" : "closed",
+          "data-tiger-navigation-menu-trigger": "",
+          onMouseenter: handleMouseEnter,
+          onMouseleave: handleMouseLeave,
+          onFocus: handleFocus,
+          onClick: handleClick,
+          onKeydown: handleKeyDown
+        },
+        [slots.default?.(), chevron]
+      );
+    };
+  }
+});
+var NavigationMenuContent = defineComponent({
+  name: "TigerNavigationMenuContent",
+  inheritAttrs: false,
+  props: {
+    mega: {
+      type: Boolean,
+      default: false
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const attrsRecord = attrs;
+    const root = inject(NavigationMenuContextKey, null);
+    const item = inject(NavigationMenuItemContextKey, null);
+    const panelContext = { inPanel: true };
+    provide(NavigationMenuContentContextKey, panelContext);
+    const portalEnabled = computed(() => Boolean(root?.portal.value));
+    const overlayEnabled = computed(
+      () => Boolean(item) && Boolean(item?.isOpen.value) && !item?.disabled
+    );
+    const overlay = useVueAnchoredOverlay({
+      referenceRef: item?.triggerRef ?? ref(null),
+      floatingRef: item?.contentRef ?? ref(null),
+      enabled: overlayEnabled,
+      placement: root?.placement ?? "bottom-start",
+      offset: root?.offset ?? NAVIGATION_MENU_DEFAULT_OFFSET,
+      portal: portalEnabled,
+      dismissOnOutside: true,
+      dismissOnEscape: true,
+      onDismiss: () => item?.close()
+    });
+    if (item) item.hasPanel.value = true;
+    onBeforeUnmount(() => {
+      if (item) item.hasPanel.value = false;
+    });
+    const handleMouseEnter = () => {
+      item?.cancelClose();
+    };
+    const handleMouseLeave = () => {
+      item?.scheduleClose();
+    };
+    const handleFocusOut = (event) => {
+      root?.handleFocusLeave(event);
+    };
+    const handleKeyDown = (event) => {
+      if (item?.contentRef.value) {
+        handleMenuNavigation(item.contentRef.value, event);
+      }
+      if (event.key === "Escape" || event.key === "ArrowLeft") {
+        event.preventDefault();
+        event.stopPropagation();
+        item?.close();
+        item?.triggerRef.value?.focus();
+        return;
+      }
+      if ((event.key === "ArrowRight" || event.key === "ArrowLeft") && root?.menubarRef.value && item?.triggerRef.value) {
+        item.triggerRef.value.focus();
+        handleMenubarNavigation(root.menubarRef.value, event);
+      }
+    };
+    const panelClasses = computed(
+      () => classNames(overlay.floatingClasses.value, NAVIGATION_MENU_ENTER_CLASS)
+    );
+    const innerClasses = computed(
+      () => classNames(
+        getNavigationMenuContentClasses(props.mega),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      )
+    );
+    const mergedStyle = computed(
+      () => mergeStyleValues(attrsRecord.style, props.style)
+    );
+    return () => {
+      if (!item || !root) return null;
+      const { restAttrs } = splitClassStyleAttrs(attrsRecord);
+      const isOpen = item.isOpen.value;
+      const popup = h(
+        "div",
+        {
+          ref: item.contentRef,
+          class: panelClasses.value,
+          style: overlay.floatingStyles.value,
+          "data-positioned": overlay.positioned.value,
+          "data-tiger-navigation-menu-content": "",
+          hidden: !isOpen,
+          onMouseenter: handleMouseEnter,
+          onMouseleave: handleMouseLeave,
+          onFocusout: handleFocusOut,
+          onKeydown: handleKeyDown
+        },
+        [
+          h(
+            "div",
+            {
+              ...restAttrs,
+              id: item.contentId,
+              class: innerClasses.value,
+              style: mergedStyle.value,
+              role: props.mega ? "group" : "menu"
+            },
+            slots.default?.()
+          )
+        ]
+      );
+      return renderVueOverlayTeleport(popup, overlay.target.value, !portalEnabled.value);
+    };
+  }
+});
+var NavigationMenuItem = defineComponent({
+  name: "TigerNavigationMenuItem",
+  inheritAttrs: false,
+  props: {
+    value: {
+      type: [String, Number],
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const attrsRecord = attrs;
+    const root = inject(NavigationMenuContextKey, null);
+    const autoValue = createNavigationMenuItemId();
+    const itemValue = computed(() => props.value ?? autoValue);
+    const triggerRef = ref(null);
+    const contentRef = ref(null);
+    const hasPanel = ref(false);
+    const isOpen = computed(
+      () => Boolean(root) && !props.disabled && isNavigationMenuValueOpen(itemValue.value, root?.value.value)
+    );
+    const contentId = `${autoValue}-content`;
+    const open = (focusPanel = false) => {
+      if (props.disabled || !root) return;
+      root.cancelClose();
+      root.setValue(itemValue.value);
+      if (!focusPanel) return;
+      nextTick(() => {
+        requestAnimationFrame(() => {
+          const panel = contentRef.value ?? document.getElementById(contentId);
+          if (panel) focusFirstMenuItem(panel);
+        });
+      });
+    };
+    const close = () => {
+      if (!root) return;
+      if (isOpen.value) root.setValue(null);
+    };
+    const scheduleOpen = () => {
+      if (props.disabled || !root) return;
+      root.scheduleOpen(itemValue.value);
+    };
+    const scheduleClose = () => {
+      if (!root) return;
+      root.scheduleClose(itemValue.value);
+    };
+    const cancelClose = () => {
+      root?.cancelClose();
+    };
+    const itemContext = {
+      get value() {
+        return itemValue.value;
+      },
+      isOpen,
+      get disabled() {
+        return props.disabled;
+      },
+      hasPanel,
+      triggerRef,
+      contentRef,
+      contentId,
+      open,
+      close,
+      scheduleOpen,
+      scheduleClose,
+      cancelClose,
+      get showArrow() {
+        return root?.showArrow ?? true;
+      }
+    };
+    provide(NavigationMenuItemContextKey, itemContext);
+    const itemClasses = computed(
+      () => classNames(
+        getNavigationMenuItemClasses(),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      )
+    );
+    const mergedStyle = computed(
+      () => mergeStyleValues(attrsRecord.style, props.style)
+    );
+    return () => {
+      const { restAttrs } = splitClassStyleAttrs(attrsRecord);
+      return h(
+        "li",
+        {
+          ...restAttrs,
+          class: itemClasses.value,
+          style: mergedStyle.value,
+          role: "none",
+          "data-tiger-navigation-menu-item": "",
+          "data-state": isOpen.value ? "open" : "closed"
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
+var NavigationMenuList = defineComponent({
+  name: "TigerNavigationMenuList",
+  inheritAttrs: false,
+  props: {
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  setup(props, { slots, attrs }) {
+    const attrsRecord = attrs;
+    const root = inject(NavigationMenuContextKey, null);
+    const listRef = ref(null);
+    const syncRoving = () => {
+      if (root) root.menubarRef.value = listRef.value;
+      if (listRef.value) initNavigationMenuRovingTabIndex(listRef.value);
+    };
+    onMounted(syncRoving);
+    onUpdated(syncRoving);
+    const listClasses = computed(
+      () => classNames(
+        getNavigationMenuListClasses(),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      )
+    );
+    const mergedStyle = computed(
+      () => mergeStyleValues(attrsRecord.style, props.style)
+    );
+    return () => {
+      const { restAttrs } = splitClassStyleAttrs(attrsRecord);
+      return h(
+        "ul",
+        {
+          ...restAttrs,
+          ref: listRef,
+          class: listClasses.value,
+          style: mergedStyle.value,
+          role: "menubar",
+          "data-tiger-navigation-menu-list": ""
+        },
+        slots.default?.()
+      );
+    };
+  }
+});
+var NavigationMenu = defineComponent({
+  name: "TigerNavigationMenu",
+  inheritAttrs: false,
+  props: {
+    value: {
+      type: [String, Number],
+      default: void 0
+    },
+    defaultValue: {
+      type: [String, Number],
+      default: void 0
+    },
+    open: {
+      type: Boolean,
+      default: void 0
+    },
+    defaultOpen: {
+      type: Boolean,
+      default: false
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    closeOnClick: {
+      type: Boolean,
+      default: true
+    },
+    delayDuration: {
+      type: Number,
+      default: NAVIGATION_MENU_DEFAULT_DELAY_DURATION
+    },
+    skipDelayDuration: {
+      type: Number,
+      default: NAVIGATION_MENU_DEFAULT_SKIP_DELAY_DURATION
+    },
+    showArrow: {
+      type: Boolean,
+      default: true
+    },
+    portal: {
+      type: Boolean,
+      default: true
+    },
+    offset: {
+      type: Number,
+      default: NAVIGATION_MENU_DEFAULT_OFFSET
+    },
+    placement: {
+      type: String,
+      default: "bottom-start"
+    },
+    className: {
+      type: String,
+      default: void 0
+    },
+    style: {
+      type: Object,
+      default: void 0
+    }
+  },
+  emits: ["update:value", "value-change", "update:open", "open-change"],
+  setup(props, { slots, emit, attrs }) {
+    const attrsRecord = attrs;
+    onMounted(() => injectNavigationMenuStyles());
+    const previousActiveElement = ref(null);
+    const rootRef = ref(null);
+    const menubarRef = ref(null);
+    const suppressFocusOpen = ref(false);
+    const initialValue = props.defaultValue ?? (props.defaultOpen ? props.value ?? null : null);
+    const internalValue = ref(
+      isNavigationMenuOpen(initialValue) ? initialValue : null
+    );
+    const currentValue = computed(
+      () => resolveNavigationMenuOpenValue({
+        value: props.value,
+        internalValue: internalValue.value,
+        open: props.open
+      })
+    );
+    const currentOpen = computed(() => isNavigationMenuOpen(currentValue.value));
+    let openTimer = null;
+    let closeTimer = null;
+    let lastOpenAt = 0;
+    const clearTimers = () => {
+      if (openTimer) {
+        clearTimeout(openTimer);
+        openTimer = null;
+      }
+      if (closeTimer) {
+        clearTimeout(closeTimer);
+        closeTimer = null;
+      }
+    };
+    const setValue = (next, options) => {
+      if (props.disabled && next != null) return;
+      clearTimers();
+      const resolvedNext = isNavigationMenuOpen(next) ? next : null;
+      const wasOpen = isNavigationMenuOpen(currentValue.value);
+      const willOpen = resolvedNext != null;
+      if (willOpen && !wasOpen) {
+        const active = captureActiveElement();
+        if (active && menubarRef.value?.contains(active)) {
+          previousActiveElement.value = active;
+        }
+      }
+      if (props.value === void 0) {
+        internalValue.value = resolvedNext;
+      }
+      emit("update:value", resolvedNext);
+      emit("value-change", resolvedNext);
+      const open = willOpen;
+      emit("update:open", open);
+      emit("open-change", open);
+      if (!willOpen) {
+        suppressFocusOpen.value = true;
+        if (options?.restoreFocus !== false) {
+          restoreFocus(previousActiveElement.value);
+        }
+        previousActiveElement.value = null;
+        nextTick(() => {
+          suppressFocusOpen.value = false;
+        });
+      }
+    };
+    const scheduleOpen = (itemValue) => {
+      if (props.disabled) return;
+      if (closeTimer) {
+        clearTimeout(closeTimer);
+        closeTimer = null;
+      }
+      const skip = shouldSkipNavigationMenuOpenDelay(
+        lastOpenAt,
+        Date.now(),
+        props.skipDelayDuration
+      );
+      const delay = skip ? 0 : props.delayDuration;
+      const apply = () => {
+        lastOpenAt = Date.now();
+        setValue(itemValue);
+        openTimer = null;
+      };
+      if (delay <= 0) {
+        apply();
+        return;
+      }
+      if (openTimer) clearTimeout(openTimer);
+      openTimer = setTimeout(apply, delay);
+    };
+    const scheduleClose = (itemValue) => {
+      if (openTimer) {
+        clearTimeout(openTimer);
+        openTimer = null;
+      }
+      const close = () => {
+        if (currentValue.value === itemValue) setValue(null);
+        closeTimer = null;
+      };
+      if (props.skipDelayDuration <= 0) {
+        close();
+        return;
+      }
+      if (closeTimer) clearTimeout(closeTimer);
+      closeTimer = setTimeout(close, props.skipDelayDuration);
+    };
+    const cancelClose = () => {
+      if (closeTimer) {
+        clearTimeout(closeTimer);
+        closeTimer = null;
+      }
+    };
+    const handleItemClick = () => {
+      if (props.closeOnClick) setValue(null);
+    };
+    const handleFocusLeave = (event) => {
+      const next = event.relatedTarget;
+      if (containsFocusTarget(rootRef.value, next)) return;
+      if (containsFocusTarget(getOpenPanelFromMenubar(menubarRef.value), next)) return;
+      if (!isNavigationMenuOpen(currentValue.value)) return;
+      setValue(null, { restoreFocus: false });
+    };
+    onBeforeUnmount(clearTimers);
+    const portalEnabled = computed(() => props.portal);
+    const navigationMenuContext = {
+      value: currentValue,
+      setValue,
+      scheduleOpen,
+      scheduleClose,
+      cancelClose,
+      get closeOnClick() {
+        return props.closeOnClick;
+      },
+      handleItemClick,
+      handleFocusLeave,
+      portal: portalEnabled,
+      get disabled() {
+        return props.disabled;
+      },
+      get offset() {
+        return props.offset;
+      },
+      get placement() {
+        return props.placement;
+      },
+      get showArrow() {
+        return props.showArrow;
+      },
+      menubarRef,
+      suppressFocusOpen
+    };
+    provide(NavigationMenuContextKey, navigationMenuContext);
+    const containerClasses = computed(
+      () => classNames(
+        getNavigationMenuClasses(),
+        props.className,
+        coerceClassValue(attrsRecord.class)
+      )
+    );
+    const mergedStyle = computed(
+      () => mergeStyleValues(attrsRecord.style, props.style)
+    );
+    return () => {
+      const defaultSlot = slots.default?.() ?? [];
+      const hasList = defaultSlot.some((node) => node.type === NavigationMenuList);
+      const children = hasList ? defaultSlot : [h(NavigationMenuList, null, { default: () => defaultSlot })];
+      const { restAttrs } = splitClassStyleAttrs(attrsRecord);
+      return h(
+        "nav",
+        {
+          ...restAttrs,
+          ref: rootRef,
+          class: containerClasses.value,
+          style: mergedStyle.value,
+          "aria-label": restAttrs["aria-label"] ?? "Main",
+          "data-tiger-navigation-menu": "",
+          "data-state": currentOpen.value ? "open" : "closed",
+          onFocusout: handleFocusLeave
+        },
+        children
+      );
+    };
+  }
+});
+var NavigationMenu_default = NavigationMenu;
+
+export {
+  NavigationMenuContextKey,
+  NavigationMenuItemContextKey,
+  NavigationMenuContentContextKey,
+  NavigationMenuLink,
+  NavigationMenuTrigger,
+  NavigationMenuContent,
+  NavigationMenuItem,
+  NavigationMenuList,
+  NavigationMenu,
+  NavigationMenu_default
+};