@expcat/tigercat-vue 2.1.2 → 2.1.3

package/dist/chunk-7VHXZX7Y.mjs

@@ -1,997 +0,0 @@
-import {
-  renderVueOverlayTeleport,
-  useVueAnchoredOverlay
-} from "./chunk-Q7Y22OFX.mjs";
-
-// src/components/Menu.ts
-import {
-  defineComponent,
-  computed,
-  ref,
-  provide,
-  inject,
-  h,
-  watch,
-  nextTick,
-  onMounted,
-  onBeforeUnmount,
-  cloneVNode,
-  isVNode
-} from "vue";
-import {
-  classNames,
-  coerceClassValue,
-  getMenuClasses,
-  getMenuItemClasses,
-  getMenuItemIndent,
-  getSubMenuTitleClasses,
-  getSubMenuExpandIconClasses,
-  filterMenuItems,
-  isKeySelected,
-  isKeyOpen,
-  menuItemIconClasses,
-  menuCollapsedIconClasses,
-  menuItemGroupTitleClasses,
-  menuSearchFieldClasses,
-  menuSearchEmptyClasses,
-  menuSearchInputClasses,
-  mergeStyleValues,
-  moveFocusInMenu,
-  focusMenuEdge,
-  focusFirstChildItem,
-  getMenuNavigationKeys,
-  submenuContentHorizontalClasses,
-  submenuContentHorizontalNestedClasses,
-  submenuContentPopupClasses,
-  submenuContentVerticalClasses,
-  submenuContentInlineClasses,
-  submenuHeightTransitionClasses,
-  getInitialSubmenuHeightTransitionStyle,
-  createSubmenuHeightTransitionController,
-  replaceKeys,
-  toggleKey,
-  initRovingTabIndex
-} from "@expcat/tigercat-core";
-var MenuContextKey = /* @__PURE__ */ Symbol("MenuContext");
-var Menu = defineComponent({
-  name: "TigerMenu",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Data-driven menu items
-     */
-    items: {
-      type: Array,
-      default: void 0
-    },
-    /**
-     * Menu mode - horizontal, vertical, or inline
-     * @default 'vertical'
-     */
-    mode: {
-      type: String,
-      default: "vertical"
-    },
-    /**
-     * Menu theme - light or dark
-     * @default 'light'
-     */
-    theme: {
-      type: String,
-      default: "light"
-    },
-    /**
-     * Currently selected menu item keys
-     */
-    selectedKeys: {
-      type: Array,
-      default: void 0
-    },
-    /**
-     * Default selected menu item keys
-     */
-    defaultSelectedKeys: {
-      type: Array,
-      default: () => []
-    },
-    /**
-     * Currently opened submenu keys (for vertical/inline mode)
-     */
-    openKeys: {
-      type: Array,
-      default: void 0
-    },
-    /**
-     * Default opened submenu keys
-     */
-    defaultOpenKeys: {
-      type: Array,
-      default: () => []
-    },
-    /**
-     * Whether the menu is collapsed (for vertical mode)
-     * @default false
-     */
-    collapsed: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Whether multiple submenus can be opened at once
-     * @default true
-     */
-    multiple: {
-      type: Boolean,
-      default: true
-    },
-    /**
-     * Inline indentation for submenu items
-     * @default 24
-     */
-    inlineIndent: {
-      type: Number,
-      default: 24
-    },
-    popupPortal: {
-      type: Boolean,
-      default: false
-    },
-    className: {
-      type: String,
-      default: void 0
-    },
-    style: {
-      type: Object,
-      default: void 0
-    },
-    searchable: {
-      type: Boolean,
-      default: false
-    },
-    searchValue: {
-      type: String,
-      default: void 0
-    },
-    defaultSearchValue: {
-      type: String,
-      default: ""
-    },
-    searchPlaceholder: {
-      type: String,
-      default: "Search menu"
-    },
-    emptyText: {
-      type: String,
-      default: "No menu items found"
-    }
-  },
-  emits: [
-    "update:selectedKeys",
-    "update:openKeys",
-    "update:searchValue",
-    "select",
-    "open-change",
-    "search"
-  ],
-  setup(props, { slots, emit, attrs }) {
-    const menuEl = ref(null);
-    const resolvedMode = computed(
-      () => props.collapsed && props.mode === "inline" ? "vertical" : props.mode
-    );
-    const internalSelectedKeys = ref(props.defaultSelectedKeys);
-    const internalOpenKeys = ref(props.defaultOpenKeys);
-    const internalSearchValue = ref(props.defaultSearchValue);
-    const currentSelectedKeys = computed(() => {
-      return props.selectedKeys !== void 0 ? props.selectedKeys : internalSelectedKeys.value;
-    });
-    const currentOpenKeys = computed(() => {
-      return props.openKeys !== void 0 ? props.openKeys : internalOpenKeys.value;
-    });
-    const handleSelect = (key) => {
-      const newSelectedKeys = replaceKeys(key, currentSelectedKeys.value);
-      if (props.selectedKeys === void 0) {
-        internalSelectedKeys.value = newSelectedKeys;
-      }
-      emit("update:selectedKeys", newSelectedKeys);
-      emit("select", key, { selectedKeys: newSelectedKeys });
-    };
-    const handleOpenChange = (key) => {
-      const toggled = toggleKey(key, currentOpenKeys.value);
-      const newOpenKeys = props.multiple ? toggled : toggled.includes(key) ? [key] : [];
-      if (props.openKeys === void 0) {
-        internalOpenKeys.value = newOpenKeys;
-      }
-      emit("update:openKeys", newOpenKeys);
-      emit("open-change", key, { openKeys: newOpenKeys });
-    };
-    const handleSearchInput = (event) => {
-      const value = event.target.value;
-      if (props.searchValue === void 0) {
-        internalSearchValue.value = value;
-      }
-      emit("update:searchValue", value);
-      emit("search", value);
-    };
-    const menuClasses = computed(() => {
-      return classNames(
-        getMenuClasses(resolvedMode.value, props.theme, props.collapsed),
-        props.className,
-        coerceClassValue(attrs.class)
-      );
-    });
-    const menuStyle = computed(() => mergeStyleValues(attrs.style, props.style));
-    const currentSearchValue = computed(() => {
-      return props.searchValue !== void 0 ? props.searchValue : internalSearchValue.value;
-    });
-    const filteredItems = computed(
-      () => filterMenuItems(props.items ?? [], currentSearchValue.value)
-    );
-    const passthroughAttrs = computed(() => {
-      const { class: _class, style: _style, ...rest } = attrs;
-      return rest;
-    });
-    const modeRef = computed(() => resolvedMode.value);
-    const themeRef = computed(() => props.theme);
-    const collapsedRef = computed(() => props.collapsed);
-    const inlineIndentRef = computed(() => props.inlineIndent);
-    const popupPortalRef = computed(() => props.popupPortal);
-    provide(MenuContextKey, {
-      mode: modeRef,
-      theme: themeRef,
-      collapsed: collapsedRef,
-      inlineIndent: inlineIndentRef,
-      popupPortal: popupPortalRef,
-      selectedKeys: currentSelectedKeys,
-      openKeys: currentOpenKeys,
-      handleSelect,
-      handleOpenChange
-    });
-    const runRovingTabIndex = async () => {
-      await nextTick();
-      if (menuEl.value) initRovingTabIndex(menuEl.value);
-    };
-    onMounted(() => {
-      void runRovingTabIndex();
-    });
-    watch(
-      [modeRef, collapsedRef, currentSelectedKeys, currentOpenKeys, filteredItems],
-      () => {
-        void runRovingTabIndex();
-      },
-      { deep: true }
-    );
-    return () => {
-      const renderDataItem = (item) => {
-        if (item.children && item.children.length > 0) {
-          const children = item.children;
-          return h(
-            SubMenu,
-            {
-              key: item.key,
-              itemKey: item.key,
-              title: item.label,
-              icon: item.icon,
-              disabled: item.disabled
-            },
-            () => children.map(renderDataItem)
-          );
-        }
-        return h(
-          MenuItem,
-          {
-            key: item.key,
-            itemKey: item.key,
-            icon: item.icon,
-            disabled: item.disabled
-          },
-          () => item.label
-        );
-      };
-      const dataChildren = filteredItems.value.map(renderDataItem);
-      const slotChildren = slots.default?.() ?? [];
-      const searchChild = props.searchable ? [
-        h("li", { role: "none", class: menuSearchFieldClasses }, [
-          h("input", {
-            type: "search",
-            value: currentSearchValue.value,
-            placeholder: props.searchPlaceholder,
-            class: menuSearchInputClasses,
-            "aria-label": props.searchPlaceholder,
-            onInput: handleSearchInput
-          })
-        ])
-      ] : [];
-      const emptyChild = props.items && props.items.length > 0 && dataChildren.length === 0 && slotChildren.length === 0 ? [
-        h("li", { role: "none" }, [
-          h("div", { class: menuSearchEmptyClasses }, props.emptyText)
-        ])
-      ] : [];
-      return h(
-        "ul",
-        {
-          ref: menuEl,
-          class: menuClasses.value,
-          style: menuStyle.value,
-          role: "menu",
-          "data-tiger-menu-root": "true",
-          "data-tiger-menu-mode": resolvedMode.value,
-          "data-tiger-menu-requested-mode": props.mode,
-          ...passthroughAttrs.value
-        },
-        [...searchChild, ...dataChildren, ...slotChildren, ...emptyChild]
-      );
-    };
-  }
-});
-var Menu_default = Menu;
-var MenuItem = defineComponent({
-  name: "TigerMenuItem",
-  props: {
-    /**
-     * Unique key for the menu item
-     */
-    itemKey: {
-      type: [String, Number],
-      required: true
-    },
-    /**
-     * Whether the menu item is disabled
-     */
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Icon for the menu item
-     */
-    icon: {
-      type: [String, Object]
-    },
-    level: {
-      type: Number,
-      default: 0
-    },
-    collapsed: {
-      type: Boolean,
-      default: void 0
-    },
-    className: {
-      type: String,
-      default: void 0
-    },
-    style: {
-      type: Object,
-      default: void 0
-    }
-  },
-  inheritAttrs: false,
-  setup(props, { slots, attrs }) {
-    const menuContext = inject(MenuContextKey);
-    if (!menuContext) {
-      console.warn("MenuItem must be used within Menu component");
-    }
-    const isSelected = computed(() => {
-      if (!menuContext) return false;
-      return isKeySelected(props.itemKey, menuContext.selectedKeys.value);
-    });
-    const itemClasses = computed(() => {
-      if (!menuContext) {
-        return classNames(
-          "flex items-center px-4 py-2 cursor-pointer transition-colors duration-200"
-        );
-      }
-      const effectiveCollapsed = props.collapsed ?? menuContext.collapsed.value;
-      return classNames(
-        getMenuItemClasses(
-          isSelected.value,
-          props.disabled,
-          menuContext.theme.value,
-          effectiveCollapsed
-        ),
-        props.className,
-        coerceClassValue(attrs.class)
-      );
-    });
-    const indentStyle = computed(() => {
-      if (!menuContext || menuContext.mode.value !== "inline" || props.level === 0) {
-        return {};
-      }
-      return getMenuItemIndent(props.level, menuContext.inlineIndent.value);
-    });
-    const itemStyle = computed(() => mergeStyleValues(attrs.style, props.style, indentStyle.value));
-    const passthroughAttrs = computed(() => {
-      const { class: _class, style: _style, ...rest } = attrs;
-      return rest;
-    });
-    const handleClick = () => {
-      if (!props.disabled && menuContext) {
-        menuContext.handleSelect(props.itemKey);
-      }
-    };
-    const handleKeyDown = (event) => {
-      if (!menuContext) return;
-      const current = event.currentTarget;
-      const rootMenu = current.closest('ul[role="menu"]');
-      const isRoot = rootMenu?.dataset.tigerMenuRoot === "true";
-      const { nextKey, prevKey } = getMenuNavigationKeys(menuContext.mode.value, isRoot);
-      if (event.key === nextKey) {
-        event.preventDefault();
-        moveFocusInMenu(current, 1);
-        return;
-      }
-      if (event.key === prevKey) {
-        event.preventDefault();
-        moveFocusInMenu(current, -1);
-        return;
-      }
-      if (event.key === "Home") {
-        event.preventDefault();
-        focusMenuEdge(current, "start");
-        return;
-      }
-      if (event.key === "End") {
-        event.preventDefault();
-        focusMenuEdge(current, "end");
-        return;
-      }
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        handleClick();
-      }
-    };
-    return () => {
-      const children = [];
-      const effectiveCollapsed = props.collapsed ?? (menuContext ? menuContext.collapsed.value : false);
-      const iconClasses = effectiveCollapsed ? menuCollapsedIconClasses : menuItemIconClasses;
-      if (props.icon) {
-        if (typeof props.icon === "string") {
-          children.push(
-            h("span", {
-              class: iconClasses,
-              innerHTML: props.icon
-            })
-          );
-        } else {
-          children.push(h("span", { class: iconClasses }, props.icon));
-        }
-      }
-      if (!effectiveCollapsed && slots.default) {
-        children.push(h("span", { class: "flex-1" }, slots.default()));
-      } else if (effectiveCollapsed && slots.default) {
-        if (!props.icon) {
-          const defaultSlot = slots.default();
-          if (defaultSlot && defaultSlot.length > 0) {
-            const text = String(defaultSlot[0].children || "");
-            children.push(
-              h(
-                "span",
-                { class: "flex-1 text-center", "aria-hidden": "true" },
-                text.charAt(0).toUpperCase()
-              )
-            );
-          }
-        }
-        children.push(h("span", { class: "sr-only" }, slots.default()));
-      }
-      return h(
-        "li",
-        {
-          role: "none"
-        },
-        [
-          h(
-            "button",
-            {
-              type: "button",
-              class: itemClasses.value,
-              style: itemStyle.value,
-              role: "menuitem",
-              "data-tiger-menuitem": "true",
-              "data-tiger-selected": isSelected.value ? "true" : "false",
-              "aria-current": isSelected.value ? "page" : void 0,
-              "aria-disabled": props.disabled ? "true" : void 0,
-              disabled: props.disabled,
-              tabindex: -1,
-              onClick: handleClick,
-              onKeydown: handleKeyDown,
-              ...passthroughAttrs.value
-            },
-            children
-          )
-        ]
-      );
-    };
-  }
-});
-var MenuItemGroup = defineComponent({
-  name: "TigerMenuItemGroup",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Group title
-     */
-    title: {
-      type: String,
-      default: ""
-    },
-    level: {
-      type: Number,
-      default: 0
-    },
-    collapsed: {
-      type: Boolean,
-      default: void 0
-    },
-    className: {
-      type: String,
-      default: void 0
-    },
-    style: {
-      type: Object,
-      default: void 0
-    }
-  },
-  setup(props, { slots, attrs }) {
-    const groupClasses = computed(() => classNames(props.className, coerceClassValue(attrs.class)));
-    const groupStyle = computed(() => mergeStyleValues(attrs.style, props.style));
-    const passthroughAttrs = computed(() => {
-      const { class: _class, style: _style, ...rest } = attrs;
-      return rest;
-    });
-    const withLevel = (nodes) => {
-      if (!nodes || nodes.length === 0) return nodes;
-      const level = props.level;
-      return nodes.map((node) => {
-        if (!isVNode(node)) return node;
-        const type = node.type;
-        const name = typeof type === "object" && type != null && "name" in type ? type.name : void 0;
-        const isTarget = name === "TigerMenuItem" || name === "TigerSubMenu";
-        if (!isTarget) return node;
-        const existingProps = node.props ?? {};
-        if (existingProps.level != null && existingProps.collapsed != null) return node;
-        const nextProps = {};
-        if (existingProps.level == null) nextProps.level = level;
-        if (props.collapsed !== void 0 && existingProps.collapsed == null) {
-          nextProps.collapsed = props.collapsed;
-        }
-        return cloneVNode(node, nextProps);
-      });
-    };
-    return () => {
-      return h("li", { class: "list-none" }, [
-        props.title ? h("div", { class: menuItemGroupTitleClasses }, props.title) : null,
-        slots.default ? h(
-          "ul",
-          {
-            role: "group",
-            class: groupClasses.value,
-            style: groupStyle.value,
-            ...passthroughAttrs.value
-          },
-          withLevel(slots.default?.())
-        ) : null
-      ]);
-    };
-  }
-});
-var ExpandIcon = (expanded) => {
-  return h(
-    "svg",
-    {
-      class: getSubMenuExpandIconClasses(expanded),
-      width: "12",
-      height: "12",
-      viewBox: "0 0 12 12",
-      fill: "currentColor"
-    },
-    [
-      h("path", {
-        d: "M6 9L1.5 4.5L2.205 3.795L6 7.59L9.795 3.795L10.5 4.5L6 9Z"
-      })
-    ]
-  );
-};
-var SubMenu = defineComponent({
-  name: "TigerSubMenu",
-  inheritAttrs: false,
-  props: {
-    /**
-     * Unique key for the submenu
-     */
-    itemKey: {
-      type: [String, Number],
-      required: true
-    },
-    /**
-     * Submenu title
-     */
-    title: {
-      type: String,
-      default: ""
-    },
-    /**
-     * Icon for the submenu
-     */
-    icon: {
-      type: [String, Object]
-    },
-    /**
-     * Whether the submenu is disabled
-     */
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    /**
-     * Nesting level (internal use for indentation)
-     */
-    level: {
-      type: Number,
-      default: 0
-    },
-    collapsed: {
-      type: Boolean,
-      default: void 0
-    },
-    className: {
-      type: String,
-      default: void 0
-    },
-    style: {
-      type: Object,
-      default: void 0
-    }
-  },
-  setup(props, { slots, attrs }) {
-    const menuContext = inject(MenuContextKey);
-    if (!menuContext) {
-      console.warn("SubMenu must be used within Menu component");
-    }
-    const isOpen = computed(() => {
-      if (!menuContext) return false;
-      return isKeyOpen(props.itemKey, menuContext.openKeys.value);
-    });
-    const isHovered = ref(false);
-    const isOpenByKeyboard = ref(false);
-    const titleEl = ref(null);
-    const popupEl = ref(null);
-    const submenuContentEl = ref(null);
-    let heightTransitionController = null;
-    let popupCloseTimer = null;
-    const effectiveCollapsed = computed(() => {
-      return props.collapsed ?? (menuContext ? menuContext.collapsed.value : false);
-    });
-    const isPopup = computed(() => {
-      if (!menuContext) return false;
-      if (menuContext.mode.value === "horizontal") return true;
-      return menuContext.mode.value === "vertical" && effectiveCollapsed.value;
-    });
-    const popupPortal = computed(() => Boolean(isPopup.value && menuContext?.popupPortal.value));
-    const isExpanded = computed(() => {
-      if (menuContext?.mode.value === "horizontal" || isPopup.value) {
-        return isHovered.value || isOpenByKeyboard.value;
-      }
-      return isOpen.value;
-    });
-    const hasRenderedInline = ref(!isPopup.value && isExpanded.value);
-    const popupPlacement = computed(
-      () => menuContext?.mode.value === "horizontal" && props.level === 0 ? "bottom-start" : "right-start"
-    );
-    const overlay = useVueAnchoredOverlay({
-      referenceRef: titleEl,
-      floatingRef: popupEl,
-      enabled: computed(() => isPopup.value && isExpanded.value),
-      placement: popupPlacement.value,
-      offset: 4,
-      portal: popupPortal,
-      dismissOnEscape: true,
-      onDismiss: () => {
-        isOpenByKeyboard.value = false;
-        isHovered.value = false;
-      }
-    });
-    const disposeHeightTransition = () => {
-      heightTransitionController?.dispose();
-      heightTransitionController = null;
-    };
-    const syncHeightTransition = async () => {
-      await nextTick();
-      if (isPopup.value || !hasRenderedInline.value || !submenuContentEl.value) {
-        disposeHeightTransition();
-        return;
-      }
-      if (!heightTransitionController) {
-        heightTransitionController = createSubmenuHeightTransitionController(
-          submenuContentEl.value,
-          { expanded: isExpanded.value }
-        );
-        return;
-      }
-      heightTransitionController.update(isExpanded.value);
-    };
-    watch(
-      [isPopup, isExpanded],
-      () => {
-        if (!isPopup.value && isExpanded.value) {
-          hasRenderedInline.value = true;
-        }
-        void syncHeightTransition();
-      },
-      { immediate: true }
-    );
-    watch(hasRenderedInline, () => {
-      void syncHeightTransition();
-    });
-    onBeforeUnmount(() => {
-      disposeHeightTransition();
-      if (popupCloseTimer) clearTimeout(popupCloseTimer);
-    });
-    const titleClasses = computed(() => {
-      if (!menuContext) return "";
-      return classNames(
-        getSubMenuTitleClasses(menuContext.theme.value, props.disabled),
-        props.className,
-        coerceClassValue(attrs.class)
-      );
-    });
-    const titleStyle = computed(() => mergeStyleValues(attrs.style, props.style, indentStyle.value));
-    const passthroughAttrs = computed(() => {
-      const { class: _class, style: _style, ...rest } = attrs;
-      return rest;
-    });
-    const contentClasses = computed(() => {
-      if (!menuContext) return "";
-      if (menuContext.mode.value === "horizontal") {
-        return props.level === 0 ? submenuContentHorizontalClasses : submenuContentHorizontalNestedClasses;
-      }
-      if (isPopup.value) return submenuContentPopupClasses;
-      if (menuContext.mode.value === "inline") return submenuContentInlineClasses;
-      return submenuContentVerticalClasses;
-    });
-    const handleTitleClick = () => {
-      if (!menuContext || props.disabled) return;
-      if (menuContext.mode.value === "horizontal") return;
-      if (isPopup.value) {
-        isOpenByKeyboard.value = !isOpenByKeyboard.value;
-        isHovered.value = true;
-        return;
-      }
-      if (!isOpen.value) {
-        hasRenderedInline.value = true;
-      }
-      menuContext.handleOpenChange(props.itemKey);
-    };
-    const focusFirstChild = async () => {
-      await nextTick();
-      const titleEl2 = document.activeElement;
-      if (titleEl2) focusFirstChildItem(titleEl2);
-    };
-    const handleTitleKeyDown = async (event) => {
-      if (!menuContext || props.disabled) return;
-      const current = event.currentTarget;
-      const rootMenu = current.closest('ul[role="menu"]');
-      const isRoot = rootMenu?.dataset.tigerMenuRoot === "true";
-      const { nextKey, prevKey } = getMenuNavigationKeys(menuContext.mode.value, isRoot);
-      if (event.key === nextKey) {
-        event.preventDefault();
-        moveFocusInMenu(current, 1);
-        return;
-      }
-      if (event.key === prevKey) {
-        event.preventDefault();
-        moveFocusInMenu(current, -1);
-        return;
-      }
-      if (event.key === "Home") {
-        event.preventDefault();
-        focusMenuEdge(current, "start");
-        return;
-      }
-      if (event.key === "End") {
-        event.preventDefault();
-        focusMenuEdge(current, "end");
-        return;
-      }
-      if (event.key === "Escape" || event.key === "ArrowLeft") {
-        if (menuContext.mode.value === "horizontal" || isPopup.value) {
-          event.preventDefault();
-          isOpenByKeyboard.value = false;
-          isHovered.value = false;
-          return;
-        }
-        if (isOpen.value) {
-          event.preventDefault();
-          menuContext.handleOpenChange(props.itemKey);
-        }
-        return;
-      }
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        if (menuContext.mode.value === "horizontal" || isPopup.value) {
-          isOpenByKeyboard.value = true;
-          return;
-        }
-        hasRenderedInline.value = true;
-        menuContext.handleOpenChange(props.itemKey);
-        await focusFirstChild();
-        return;
-      }
-      if (event.key === "ArrowRight" || event.key === "ArrowDown") {
-        if (menuContext.mode.value === "horizontal" || isPopup.value) {
-          event.preventDefault();
-          isOpenByKeyboard.value = true;
-          return;
-        }
-        if (!isOpen.value) {
-          event.preventDefault();
-          hasRenderedInline.value = true;
-          menuContext.handleOpenChange(props.itemKey);
-          await focusFirstChild();
-        }
-      }
-    };
-    const handleMouseEnter = () => {
-      if (popupCloseTimer) {
-        clearTimeout(popupCloseTimer);
-        popupCloseTimer = null;
-      }
-      if (menuContext?.mode.value === "horizontal" || isPopup.value) {
-        isHovered.value = true;
-      }
-    };
-    const handleMouseLeave = () => {
-      if (menuContext?.mode.value === "horizontal" || isPopup.value) {
-        const close = () => {
-          isHovered.value = false;
-          isOpenByKeyboard.value = false;
-        };
-        if (popupPortal.value) {
-          popupCloseTimer = setTimeout(close, 120);
-          return;
-        }
-        close();
-      }
-    };
-    const indentStyle = computed(() => {
-      if (!menuContext || menuContext.mode.value === "horizontal" || props.level === 0) {
-        return {};
-      }
-      return getMenuItemIndent(props.level, menuContext.inlineIndent.value);
-    });
-    const withChildLevel = (nodes) => {
-      if (!nodes || nodes.length === 0) return nodes;
-      const nextLevel = props.level + 1;
-      return nodes.map((node) => {
-        if (!isVNode(node)) return node;
-        const type = node.type;
-        const name = typeof type === "object" && type != null && "name" in type ? type.name : void 0;
-        const isTarget = name === "TigerMenuItem" || name === "TigerSubMenu" || name === "TigerMenuItemGroup";
-        if (!isTarget) return node;
-        const existingProps = node.props ?? {};
-        const nextProps = {
-          level: existingProps.level ?? nextLevel
-        };
-        if (existingProps.collapsed == null && isPopup.value) {
-          nextProps.collapsed = false;
-        }
-        return cloneVNode(node, nextProps);
-      });
-    };
-    return () => {
-      if (!menuContext) return null;
-      const titleChildren = [];
-      const submenuIconClasses = effectiveCollapsed.value ? menuCollapsedIconClasses : menuItemIconClasses;
-      if (props.icon) {
-        if (typeof props.icon === "string") {
-          titleChildren.push(
-            h("span", {
-              class: submenuIconClasses,
-              innerHTML: props.icon
-            })
-          );
-        } else {
-          titleChildren.push(h("span", { class: submenuIconClasses }, props.icon));
-        }
-      }
-      if (!effectiveCollapsed.value) {
-        titleChildren.push(h("span", { class: "flex-1" }, props.title));
-        if (menuContext.mode.value !== "horizontal" && !isPopup.value) {
-          titleChildren.push(ExpandIcon(isExpanded.value));
-        }
-      } else {
-        if (!props.icon) {
-          titleChildren.push(
-            h(
-              "span",
-              { class: "flex-1 text-center", "aria-hidden": "true" },
-              props.title.charAt(0).toUpperCase()
-            )
-          );
-        }
-        titleChildren.push(h("span", { class: "sr-only" }, props.title));
-      }
-      const titleNode = h(
-        "button",
-        {
-          type: "button",
-          ref: titleEl,
-          class: titleClasses.value,
-          style: titleStyle.value,
-          onClick: handleTitleClick,
-          onKeydown: handleTitleKeyDown,
-          role: "menuitem",
-          "data-tiger-menuitem": "true",
-          "aria-expanded": isExpanded.value ? "true" : "false",
-          "aria-haspopup": "true",
-          "aria-disabled": props.disabled ? "true" : void 0,
-          "data-state": isExpanded.value ? "open" : "closed",
-          disabled: props.disabled,
-          tabindex: -1,
-          ...passthroughAttrs.value
-        },
-        titleChildren
-      );
-      const popupContentNode = () => {
-        const node = h(
-          "ul",
-          {
-            ref: popupEl,
-            class: classNames(contentClasses.value, overlay.floatingClasses.value),
-            style: {
-              ...overlay.floatingStyles.value,
-              display: isExpanded.value ? "block" : "none"
-            },
-            "data-positioned": overlay.positioned.value,
-            role: "menu",
-            "aria-hidden": isExpanded.value ? void 0 : "true",
-            onMouseenter: popupPortal.value ? handleMouseEnter : void 0,
-            onMouseleave: popupPortal.value ? handleMouseLeave : void 0,
-            "data-tiger-submenu-popup": ""
-          },
-          withChildLevel(slots.default?.())
-        );
-        return renderVueOverlayTeleport(node, overlay.target.value, !popupPortal.value);
-      };
-      const contentNode = isPopup.value ? popupContentNode() : hasRenderedInline.value ? h(
-        "div",
-        {
-          ref: submenuContentEl,
-          class: submenuHeightTransitionClasses,
-          style: heightTransitionController ? void 0 : getInitialSubmenuHeightTransitionStyle(isExpanded.value),
-          "aria-hidden": isExpanded.value ? void 0 : "true",
-          "data-tiger-menu-hidden": isExpanded.value ? void 0 : "true",
-          "data-tiger-submenu-motion": "height"
-        },
-        [
-          h(
-            "ul",
-            {
-              class: contentClasses.value,
-              role: "menu"
-            },
-            withChildLevel(slots.default?.())
-          )
-        ]
-      ) : null;
-      return h(
-        "li",
-        {
-          class: isPopup.value && !popupPortal.value ? "relative" : "",
-          onMouseenter: handleMouseEnter,
-          onMouseleave: handleMouseLeave,
-          role: "none"
-        },
-        [titleNode, contentNode]
-      );
-    };
-  }
-});
-
-export {
-  MenuContextKey,
-  Menu,
-  Menu_default,
-  MenuItem,
-  MenuItemGroup,
-  SubMenu
-};