@wow-two-beta/ui-vue 0.0.2

package/dist/chunks/TableOfContents.vue_vue_type_script_setup_true_lang-HVL4lg_f.js

@@ -0,0 +1,2159 @@
+import { defineComponent, useAttrs, useTemplateRef, computed, openBlock, createElementBlock, mergeProps, createElementVNode, Fragment, renderList, renderSlot, createTextVNode, toDisplayString, createVNode, unref, createCommentVNode, normalizeClass, inject, provide, createBlock, withCtx, shallowRef, watch, onScopeDispose, useSlots, toValue, normalizeProps, guardReactiveProps, normalizeStyle } from "vue";
+import { ChevronRight, ChevronsLeft, ChevronLeft, ChevronsRight, ChevronDown, Search } from "lucide-vue-next";
+import { _ as _sfc_main$x } from "./Icon.vue_vue_type_script_setup_true_lang-DgwdLCRR.js";
+import { c as cn } from "./cn-CzDCF-Ah.js";
+import { u as useId } from "./useId-CtgAhGrn.js";
+import { d as dataAttr } from "./dataAttr-7BR67dTj.js";
+import { u as useControlled } from "./useControlled-B6M4kTLn.js";
+import { P as Primitive } from "./Primitive-Cm3ECaVw.js";
+import { u as useReducedMotion } from "./useReducedMotion-B9LqQ3UT.js";
+import { P as Presence } from "./Presence-C7IJvh_P.js";
+import { _ as _sfc_main$C, b as useRovingFocusItem } from "./RovingFocusGroup.vue_vue_type_script_setup_true_lang-DCpYSP2V.js";
+import { tv } from "tailwind-variants";
+import { s as surfaceVariants } from "./SurfaceStyles-ChdpGRBO.js";
+import { _ as _sfc_main$y } from "./Portal.vue_vue_type_script_setup_true_lang-CF3R0VCZ.js";
+import { _ as _sfc_main$z } from "./AnchoredPositioner.vue_vue_type_script_setup_true_lang-BpBVI2Cu.js";
+import { _ as _sfc_main$A, a as _sfc_main$B } from "./DismissableLayer.vue_vue_type_script_setup_true_lang-6nRnzsJW.js";
+import { a as useHotkeys } from "./UseHotkeys-CKIYK5Mq.js";
+import { _ as _sfc_main$D, a as _sfc_main$E } from "./ModalContent.vue_vue_type_script_setup_true_lang-CLACSqKg.js";
+import { l as listboxGroupLabelVariants, a as listboxItemVariants, b as listboxEmptyVariants, c as listboxSeparatorVariants } from "./Listbox.variants-CqAkYsmK.js";
+const _hoisted_1$d = { class: "flex flex-wrap items-center gap-1.5" };
+const _hoisted_2$5 = ["href"];
+const _hoisted_3$1 = ["aria-current"];
+const _hoisted_4$1 = {
+  key: 0,
+  "aria-hidden": "true",
+  class: "text-subtle-foreground"
+};
+const _sfc_main$w = /* @__PURE__ */ defineComponent({
+  ...{ name: "Breadcrumb", inheritAttrs: false },
+  __name: "Breadcrumb",
+  props: {
+    items: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(() => cn("text-sm", attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    const lastIndex = computed(() => props.items.length - 1);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("nav", mergeProps({
+        ref_key: "el",
+        ref: el,
+        "aria-label": "Breadcrumb"
+      }, rest.value, { class: classes.value }), [
+        createElementVNode("ol", _hoisted_1$d, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(props.items, (item, i) => {
+            return openBlock(), createElementBlock(Fragment, { key: i }, [
+              createElementVNode("li", null, [
+                item.href && i !== lastIndex.value ? (openBlock(), createElementBlock("a", {
+                  key: 0,
+                  href: item.href,
+                  class: "text-muted-foreground hover:text-foreground hover:underline focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring rounded-sm"
+                }, [
+                  renderSlot(_ctx.$slots, "label", {
+                    item,
+                    index: i
+                  }, () => [
+                    createTextVNode(toDisplayString(item.label), 1)
+                  ])
+                ], 8, _hoisted_2$5)) : (openBlock(), createElementBlock("span", {
+                  key: 1,
+                  "aria-current": i === lastIndex.value ? "page" : void 0,
+                  class: "text-foreground"
+                }, [
+                  renderSlot(_ctx.$slots, "label", {
+                    item,
+                    index: i
+                  }, () => [
+                    createTextVNode(toDisplayString(item.label), 1)
+                  ])
+                ], 8, _hoisted_3$1))
+              ]),
+              i !== lastIndex.value ? (openBlock(), createElementBlock("li", _hoisted_4$1, [
+                renderSlot(_ctx.$slots, "separator", {}, () => [
+                  createVNode(unref(_sfc_main$x), {
+                    icon: unref(ChevronRight),
+                    size: 14
+                  }, null, 8, ["icon"])
+                ])
+              ])) : createCommentVNode("", true)
+            ], 64);
+          }), 128))
+        ])
+      ], 16);
+    };
+  }
+});
+const _hoisted_1$c = ["disabled"];
+const _hoisted_2$4 = ["disabled"];
+const _hoisted_3 = ["aria-current", "onClick"];
+const _hoisted_4 = ["disabled"];
+const _hoisted_5 = ["disabled"];
+function range(start, end) {
+  return Array.from({ length: end - start + 1 }, (_, i) => start + i);
+}
+function buildPages(total, page, siblings) {
+  if (total <= 1) return [1];
+  const left = Math.max(2, page - siblings);
+  const right = Math.min(total - 1, page + siblings);
+  const pages = [1];
+  if (left > 2) pages.push("ellipsis");
+  pages.push(...range(left, right));
+  if (right < total - 1) pages.push("ellipsis");
+  if (total > 1) pages.push(total);
+  return pages;
+}
+const BASE_BTN = "inline-flex h-8 min-w-8 items-center justify-center rounded-md border border-transparent px-2 text-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50";
+const _sfc_main$v = /* @__PURE__ */ defineComponent({
+  ...{ name: "Pagination", inheritAttrs: false },
+  __name: "Pagination",
+  props: {
+    total: {},
+    page: {},
+    siblings: { default: 1 },
+    hideFirstLast: { type: Boolean, default: false }
+  },
+  emits: ["update:page", "page-change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const pages = computed(() => buildPages(props.total, props.page, props.siblings));
+    function go(page) {
+      const next = Math.min(props.total, Math.max(1, page));
+      emit("update:page", next);
+      emit("page-change", next);
+    }
+    const classes = computed(
+      () => cn("inline-flex items-center gap-1", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("nav", mergeProps({
+        ref_key: "el",
+        ref: el,
+        "aria-label": "Pagination"
+      }, rest.value, { class: classes.value }), [
+        !props.hideFirstLast ? (openBlock(), createElementBlock("button", {
+          key: 0,
+          type: "button",
+          "aria-label": "First page",
+          disabled: props.page <= 1,
+          class: normalizeClass(unref(cn)(BASE_BTN, "hover:bg-muted")),
+          onClick: _cache[0] || (_cache[0] = ($event) => go(1))
+        }, [
+          createVNode(unref(_sfc_main$x), {
+            icon: unref(ChevronsLeft),
+            size: 16
+          }, null, 8, ["icon"])
+        ], 10, _hoisted_1$c)) : createCommentVNode("", true),
+        createElementVNode("button", {
+          type: "button",
+          "aria-label": "Previous page",
+          disabled: props.page <= 1,
+          class: normalizeClass(unref(cn)(BASE_BTN, "hover:bg-muted")),
+          onClick: _cache[1] || (_cache[1] = ($event) => go(props.page - 1))
+        }, [
+          createVNode(unref(_sfc_main$x), {
+            icon: unref(ChevronLeft),
+            size: 16
+          }, null, 8, ["icon"])
+        ], 10, _hoisted_2$4),
+        (openBlock(true), createElementBlock(Fragment, null, renderList(pages.value, (p, i) => {
+          return openBlock(), createElementBlock(Fragment, null, [
+            p === "ellipsis" ? (openBlock(), createElementBlock("span", {
+              key: `e-${i}`,
+              class: "px-1 text-muted-foreground"
+            }, "…")) : (openBlock(), createElementBlock("button", {
+              key: p,
+              type: "button",
+              "aria-current": p === props.page ? "page" : void 0,
+              class: normalizeClass(
+                unref(cn)(
+                  BASE_BTN,
+                  p === props.page ? "border-primary bg-primary text-primary-foreground" : "hover:bg-muted"
+                )
+              ),
+              onClick: ($event) => go(p)
+            }, toDisplayString(p), 11, _hoisted_3))
+          ], 64);
+        }), 256)),
+        createElementVNode("button", {
+          type: "button",
+          "aria-label": "Next page",
+          disabled: props.page >= props.total,
+          class: normalizeClass(unref(cn)(BASE_BTN, "hover:bg-muted")),
+          onClick: _cache[2] || (_cache[2] = ($event) => go(props.page + 1))
+        }, [
+          createVNode(unref(_sfc_main$x), {
+            icon: unref(ChevronRight),
+            size: 16
+          }, null, 8, ["icon"])
+        ], 10, _hoisted_4),
+        !props.hideFirstLast ? (openBlock(), createElementBlock("button", {
+          key: 1,
+          type: "button",
+          "aria-label": "Last page",
+          disabled: props.page >= props.total,
+          class: normalizeClass(unref(cn)(BASE_BTN, "hover:bg-muted")),
+          onClick: _cache[3] || (_cache[3] = ($event) => go(props.total))
+        }, [
+          createVNode(unref(_sfc_main$x), {
+            icon: unref(ChevronsRight),
+            size: 16
+          }, null, 8, ["icon"])
+        ], 10, _hoisted_5)) : createCommentVNode("", true)
+      ], 16);
+    };
+  }
+});
+const MenuKey = Symbol("wow-two.menu");
+function useMenuContext() {
+  const context = inject(MenuKey, null);
+  if (!context) {
+    throw new Error("MenuItem / MenuGroup / MenuLabel / MenuSeparator must be used inside <Menu>");
+  }
+  return context;
+}
+const menuVariants = tv({
+  base: "flex min-w-[8rem] flex-col gap-0.5 rounded-md border border-border bg-popover p-1 text-sm text-popover-foreground shadow-md outline-none"
+});
+const menuItemVariants = tv({
+  base: "relative flex w-full cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-left text-sm outline-none transition-colors focus:bg-muted focus:text-foreground hover:bg-muted hover:text-foreground",
+  variants: {
+    state: {
+      default: "text-popover-foreground",
+      destructive: "text-destructive focus:bg-destructive-soft hover:bg-destructive-soft",
+      disabled: "pointer-events-none opacity-50"
+    }
+  },
+  defaultVariants: { state: "default" }
+});
+const menuLabelVariants = tv({
+  base: "px-2 py-1.5 text-xs font-semibold text-muted-foreground"
+});
+const menuSeparatorVariants = tv({
+  base: "-mx-1 my-1 h-px bg-border"
+});
+const MenuItemState = {
+  /** Refers to the default, neutral item. */
+  Default: "default",
+  /** Refers to a destructive item (e.g. delete). */
+  Destructive: "destructive",
+  /** Refers to a non-interactive, dimmed item. */
+  Disabled: "disabled"
+};
+const _sfc_main$u = /* @__PURE__ */ defineComponent({
+  ...{ name: "Menu", inheritAttrs: false },
+  __name: "Menu",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    anchor: {},
+    placement: { default: "bottom-start" },
+    offset: { default: 6 },
+    variant: { default: void 0 },
+    tone: { default: void 0 },
+    radius: { default: void 0 },
+    padding: { default: void 0 },
+    elevation: { default: void 0 }
+  },
+  emits: ["close", "keydown"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const isMenuOpen = computed(
+      () => props.open !== void 0 ? props.open : props.isOpen ?? false
+    );
+    const items = [];
+    function registerItem(entry) {
+      const index = items.findIndex((i) => i.id === entry.id);
+      if (index >= 0) items[index] = entry;
+      else items.push(entry);
+    }
+    function unregisterItem(id) {
+      const index = items.findIndex((i) => i.id === id);
+      if (index >= 0) items.splice(index, 1);
+    }
+    provide(MenuKey, { registerItem, unregisterItem, items, close: () => emit("close") });
+    const classes = computed(
+      () => cn(
+        surfaceVariants({
+          variant: props.variant ?? "surface",
+          tone: props.tone,
+          radius: props.radius ?? "md",
+          padding: props.padding ?? "xs",
+          elevation: props.elevation
+        }),
+        menuVariants(),
+        "motion-safe:data-[state=open]:animate-(--animate-pop-in)",
+        "motion-safe:data-[state=closed]:animate-(--animate-pop-out)",
+        "motion-reduce:animate-none",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    function handleEscape() {
+      emit("close");
+    }
+    function handleOutsidePointerDown(event) {
+      if (props.anchor?.contains(event.target)) return;
+      emit("close");
+    }
+    function handleKeydown(event) {
+      emit("keydown", event);
+      if (event.defaultPrevented) return;
+      if (event.key === "Tab") {
+        event.preventDefault();
+        emit("close");
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$y), null, {
+        default: withCtx(() => [
+          createVNode(unref(_sfc_main$z), {
+            anchor: props.anchor,
+            placement: props.placement,
+            offset: props.offset,
+            class: "z-dropdown"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(Presence), { "is-present": isMenuOpen.value }, {
+                default: withCtx(() => [
+                  createVNode(unref(_sfc_main$A), {
+                    "as-child": "",
+                    trapped: "",
+                    loop: ""
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(_sfc_main$B), mergeProps({
+                        role: "menu",
+                        "on-escape": handleEscape,
+                        "on-outside-pointer-down": handleOutsidePointerDown
+                      }, rest.value, {
+                        class: classes.value,
+                        onKeydown: handleKeydown
+                      }), {
+                        default: withCtx(() => [
+                          renderSlot(_ctx.$slots, "default")
+                        ]),
+                        _: 3
+                      }, 16, ["class"])
+                    ]),
+                    _: 3
+                  })
+                ]),
+                _: 3
+              }, 8, ["is-present"])
+            ]),
+            _: 3
+          }, 8, ["anchor", "placement", "offset"])
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const _hoisted_1$b = ["disabled", "aria-disabled", "data-disabled"];
+const _sfc_main$t = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenuItem", inheritAttrs: false },
+  __name: "MenuItem",
+  props: {
+    state: { default: void 0 },
+    isDisabled: { type: Boolean, default: void 0 }
+  },
+  emits: ["select"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const menu = useMenuContext();
+    const id = useId();
+    const el = shallowRef(null);
+    watch(
+      [el, () => props.isDisabled],
+      ([node, isDisabled]) => {
+        menu.registerItem({ id, el: node, disabled: isDisabled === true });
+      },
+      { immediate: true, flush: "post" }
+    );
+    onScopeDispose(() => menu.unregisterItem(id));
+    function moveFocus(target) {
+      const list = menu.items.filter((i) => !i.disabled);
+      if (list.length === 0) return;
+      if (target === "first" || target === "last") {
+        list[target === "first" ? 0 : list.length - 1]?.el?.focus();
+        return;
+      }
+      const index = list.findIndex((i) => i.id === id);
+      let nextIndex = index + target;
+      if (index === -1) nextIndex = target === 1 ? 0 : list.length - 1;
+      if (nextIndex < 0) nextIndex = list.length - 1;
+      if (nextIndex >= list.length) nextIndex = 0;
+      list[nextIndex]?.el?.focus();
+    }
+    function handleKeydown(event) {
+      if (event.defaultPrevented || props.isDisabled) return;
+      switch (event.key) {
+        case "ArrowDown":
+          event.preventDefault();
+          moveFocus(1);
+          break;
+        case "ArrowUp":
+          event.preventDefault();
+          moveFocus(-1);
+          break;
+        case "Home":
+          event.preventDefault();
+          moveFocus("first");
+          break;
+        case "End":
+          event.preventDefault();
+          moveFocus("last");
+          break;
+        case "Enter":
+        case " ":
+          event.preventDefault();
+          emit("select");
+          menu.close();
+          break;
+      }
+    }
+    function handleClick(event) {
+      if (event.defaultPrevented || props.isDisabled) return;
+      emit("select");
+      menu.close();
+    }
+    const itemState = computed(
+      () => props.state ?? (props.isDisabled ? MenuItemState.Disabled : MenuItemState.Default)
+    );
+    const classes = computed(
+      () => cn(menuItemVariants({ state: itemState.value }), attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", mergeProps({
+        ref_key: "el",
+        ref: el,
+        type: "button",
+        role: "menuitem",
+        disabled: props.isDisabled,
+        "aria-disabled": props.isDisabled || void 0,
+        "data-disabled": unref(dataAttr)(props.isDisabled)
+      }, rest.value, {
+        class: classes.value,
+        onClick: handleClick,
+        onKeydown: handleKeydown
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$b);
+    };
+  }
+});
+const _hoisted_1$a = ["aria-labelledby"];
+const _hoisted_2$3 = ["id"];
+const _sfc_main$s = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenuGroup", inheritAttrs: false },
+  __name: "MenuGroup",
+  props: {
+    label: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const slots = useSlots();
+    const el = useTemplateRef("el");
+    const labelId = useId();
+    const hasLabel = computed(() => Boolean(props.label) || Boolean(slots.label));
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "el",
+        ref: el,
+        role: "group",
+        "aria-labelledby": hasLabel.value ? unref(labelId) : void 0
+      }, unref(attrs)), [
+        hasLabel.value ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          id: unref(labelId),
+          class: normalizeClass(unref(menuLabelVariants)())
+        }, [
+          renderSlot(_ctx.$slots, "label", {}, () => [
+            createTextVNode(toDisplayString(props.label), 1)
+          ])
+        ], 10, _hoisted_2$3)) : createCommentVNode("", true),
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$a);
+    };
+  }
+});
+const _sfc_main$r = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenuLabel", inheritAttrs: false },
+  __name: "MenuLabel",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(() => cn(menuLabelVariants(), attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "el",
+        ref: el
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16);
+    };
+  }
+});
+const _sfc_main$q = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenuSeparator", inheritAttrs: false },
+  __name: "MenuSeparator",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(() => cn(menuSeparatorVariants(), attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "el",
+        ref: el,
+        role: "separator"
+      }, rest.value, { class: classes.value }), null, 16);
+    };
+  }
+});
+const dropdownMenuContextKey = Symbol("wow-two.dropdownMenu");
+function useDropdownMenuContext() {
+  const context = inject(dropdownMenuContextKey, null);
+  if (!context) throw new Error("DropdownMenu.* must be used inside <DropdownMenu>");
+  return context;
+}
+const _sfc_main$p = /* @__PURE__ */ defineComponent({
+  ...{ name: "DropdownMenu", inheritAttrs: false },
+  __name: "DropdownMenu",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: false },
+    placement: { default: "bottom-start" },
+    offset: { default: 6 }
+  },
+  emits: ["update:open", "open-change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const controlled = useControlled({
+      controlled: () => props.open !== void 0 ? props.open : props.isOpen,
+      default: () => props.defaultOpen,
+      onChange: (value) => {
+        emit("update:open", value);
+        emit("open-change", value);
+      }
+    });
+    provide(dropdownMenuContextKey, {
+      open: controlled.value,
+      setOpen: controlled.setValue,
+      triggerEl: shallowRef(null),
+      openFocus: { current: "first" },
+      placement: computed(() => props.placement),
+      offset: computed(() => props.offset)
+    });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+function toHtmlElement(value) {
+  if (typeof HTMLElement === "undefined") return null;
+  return value instanceof HTMLElement ? value : null;
+}
+const _sfc_main$o = /* @__PURE__ */ defineComponent({
+  ...{ name: "DropdownMenuTrigger", inheritAttrs: false },
+  __name: "DropdownMenuTrigger",
+  props: {
+    asChild: { type: Boolean, default: false }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const context = useDropdownMenuContext();
+    const inner = useTemplateRef("inner");
+    const isOpen = context.open;
+    watch(
+      inner,
+      (instance) => {
+        context.triggerEl.value = toHtmlElement(instance?.$el);
+      },
+      { immediate: true, flush: "post" }
+    );
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      context.openFocus.current = "first";
+      context.setOpen(!context.open.value);
+    }
+    function handleKeydown(event) {
+      if (event.defaultPrevented) return;
+      if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
+        event.preventDefault();
+        context.openFocus.current = event.key === "ArrowUp" ? "last" : "first";
+        context.setOpen(true);
+      }
+    }
+    const el = computed(() => inner.value?.$el ?? null);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Primitive), mergeProps({
+        ref_key: "inner",
+        ref: inner,
+        as: "button",
+        "as-child": props.asChild,
+        type: "button",
+        "aria-haspopup": "menu",
+        "aria-expanded": unref(isOpen),
+        "data-state": unref(isOpen) ? "open" : "closed"
+      }, unref(attrs), {
+        onClick: handleClick,
+        onKeydown: handleKeydown
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child", "aria-expanded", "data-state"]);
+    };
+  }
+});
+const _sfc_main$n = /* @__PURE__ */ defineComponent({
+  ...{ name: "DropdownMenuContent", inheritAttrs: false },
+  __name: "DropdownMenuContent",
+  setup(__props) {
+    const attrs = useAttrs();
+    const context = useDropdownMenuContext();
+    const reducedMotion = useReducedMotion();
+    const isOpen = context.open;
+    const anchor = computed(() => context.triggerEl.value);
+    const placement = context.placement;
+    const offset = context.offset;
+    const panelEl = shallowRef(null);
+    const mounted = shallowRef(context.open.value);
+    watch(
+      [() => context.open.value, reducedMotion],
+      ([open, isReduced], _previous, onCleanup) => {
+        if (open) {
+          mounted.value = true;
+          return;
+        }
+        if (!isReduced) return;
+        if (typeof requestAnimationFrame === "undefined") return;
+        const raf = requestAnimationFrame(() => {
+          mounted.value = false;
+        });
+        onCleanup(() => cancelAnimationFrame(raf));
+      },
+      { immediate: true, flush: "post" }
+    );
+    function focusLastEnabledItem(panel) {
+      if (context.openFocus.current !== "last") return;
+      context.openFocus.current = "first";
+      const items = panel.querySelectorAll('[role="menuitem"]:not([disabled])');
+      items[items.length - 1]?.focus();
+    }
+    watch(
+      [panelEl, () => context.open.value],
+      ([panel, open]) => {
+        if (!panel || !open) return;
+        focusLastEnabledItem(panel);
+      },
+      { flush: "post" }
+    );
+    function setPanel(node) {
+      panelEl.value = node ?? null;
+    }
+    function handleClose() {
+      context.setOpen(false);
+      requestAnimationFrame(() => context.triggerEl.value?.focus());
+    }
+    function handleAnimationEnd() {
+      if (!context.open.value) mounted.value = false;
+    }
+    const panelClasses = computed(
+      () => cn(
+        /* pop (fade + slight scale) gated on data-state; motion-safe so
+           reduced-motion users get no movement. */
+        "motion-safe:data-[state=open]:animate-(--animate-pop-in)",
+        "motion-safe:data-[state=closed]:animate-(--animate-pop-out)",
+        "motion-reduce:animate-none",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    return (_ctx, _cache) => {
+      return mounted.value ? (openBlock(), createBlock(_sfc_main$u, mergeProps({
+        key: 0,
+        open: mounted.value,
+        anchor: anchor.value,
+        placement: unref(placement),
+        offset: unref(offset)
+      }, rest.value, { onClose: handleClose }), {
+        default: withCtx(() => [
+          createVNode(unref(Presence), { "is-present": unref(isOpen) }, {
+            default: withCtx(() => [
+              createElementVNode("div", {
+                ref: setPanel,
+                class: normalizeClass(panelClasses.value),
+                onAnimationend: handleAnimationEnd
+              }, [
+                renderSlot(_ctx.$slots, "default")
+              ], 34)
+            ]),
+            _: 3
+          }, 8, ["is-present"])
+        ]),
+        _: 3
+      }, 16, ["open", "anchor", "placement", "offset"])) : createCommentVNode("", true);
+    };
+  }
+});
+const contextMenuContextKey = Symbol("wow-two.contextMenu");
+function useContextMenuContext() {
+  const context = inject(contextMenuContextKey, null);
+  if (!context) throw new Error("ContextMenu.* must be used inside <ContextMenu>");
+  return context;
+}
+const _sfc_main$m = /* @__PURE__ */ defineComponent({
+  ...{ name: "ContextMenu", inheritAttrs: false },
+  __name: "ContextMenu",
+  setup(__props) {
+    const open = shallowRef(false);
+    const anchor = shallowRef(null);
+    const triggerEl = shallowRef(null);
+    const restoreFocus = { current: null };
+    let restoreRaf = 0;
+    function setAnchor(el) {
+      const previous = anchor.value;
+      if (previous && typeof document !== "undefined" && previous.parentNode === document.body) {
+        previous.remove();
+      }
+      anchor.value = el;
+    }
+    function setOpen(next) {
+      if (next && !open.value) {
+        cancelAnimationFrame(restoreRaf);
+        restoreFocus.current ??= document.activeElement instanceof HTMLElement && document.activeElement !== document.body ? document.activeElement : null;
+      }
+      open.value = next;
+      if (next) return;
+      setAnchor(null);
+      const restoreTarget = restoreFocus.current;
+      restoreFocus.current = null;
+      if (!restoreTarget) return;
+      let attempts = 0;
+      const tryRestore = () => {
+        restoreTarget.focus();
+        if (document.activeElement !== restoreTarget && attempts++ < 30) {
+          restoreRaf = requestAnimationFrame(tryRestore);
+        }
+      };
+      restoreRaf = requestAnimationFrame(tryRestore);
+    }
+    onScopeDispose(() => {
+      if (typeof cancelAnimationFrame !== "undefined") cancelAnimationFrame(restoreRaf);
+      const current = anchor.value;
+      if (current && typeof document !== "undefined" && current.parentNode === document.body) {
+        current.remove();
+      }
+    });
+    provide(contextMenuContextKey, { open, setOpen, anchor, setAnchor, triggerEl, restoreFocus });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+const LONG_PRESS_MS = 600;
+function makeVirtualAnchor(x, y) {
+  const el = document.createElement("div");
+  el.style.position = "fixed";
+  el.style.left = `${x}px`;
+  el.style.top = `${y}px`;
+  el.style.width = "0px";
+  el.style.height = "0px";
+  el.style.pointerEvents = "none";
+  document.body.appendChild(el);
+  return el;
+}
+const _sfc_main$l = /* @__PURE__ */ defineComponent({
+  ...{ name: "ContextMenuTrigger", inheritAttrs: false },
+  __name: "ContextMenuTrigger",
+  props: {
+    asChild: { type: Boolean, default: false },
+    isDisabled: { type: Boolean, default: void 0 }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const context = useContextMenuContext();
+    const inner = useTemplateRef("inner");
+    let longPressTimer = null;
+    watch(
+      inner,
+      (instance) => {
+        context.triggerEl.value = toHtmlElement(instance?.$el);
+      },
+      { immediate: true, flush: "post" }
+    );
+    function clearLongPress() {
+      if (longPressTimer) clearTimeout(longPressTimer);
+      longPressTimer = null;
+    }
+    onScopeDispose(clearLongPress);
+    function handleContextMenu(event) {
+      if (event.defaultPrevented || props.isDisabled) return;
+      event.preventDefault();
+      context.setAnchor(makeVirtualAnchor(event.clientX, event.clientY));
+      context.setOpen(true);
+    }
+    function handlePointerDown(event) {
+      if (!props.isDisabled && !context.open.value && (event.button === 2 || event.pointerType === "touch")) {
+        context.restoreFocus.current = document.activeElement instanceof HTMLElement && document.activeElement !== document.body ? document.activeElement : null;
+      }
+      if (event.defaultPrevented || props.isDisabled || event.pointerType !== "touch") return;
+      const x = event.clientX;
+      const y = event.clientY;
+      longPressTimer = setTimeout(() => {
+        context.setAnchor(makeVirtualAnchor(x, y));
+        context.setOpen(true);
+      }, LONG_PRESS_MS);
+    }
+    const el = computed(() => inner.value?.$el ?? null);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Primitive), mergeProps({
+        ref_key: "inner",
+        ref: inner,
+        as: "div",
+        "as-child": props.asChild
+      }, unref(attrs), {
+        onContextmenu: handleContextMenu,
+        onPointerdown: handlePointerDown,
+        onPointerup: clearLongPress,
+        onPointercancel: clearLongPress
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child"]);
+    };
+  }
+});
+const _sfc_main$k = /* @__PURE__ */ defineComponent({
+  ...{ name: "ContextMenuContent", inheritAttrs: false },
+  __name: "ContextMenuContent",
+  props: {
+    placement: { default: "bottom-start" },
+    offset: { default: 2 }
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const context = useContextMenuContext();
+    const isOpen = context.open;
+    const anchor = context.anchor;
+    const classes = computed(
+      () => cn("motion-safe:animate-(--animate-pop-in)", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$u, mergeProps({
+        open: unref(isOpen),
+        anchor: unref(anchor),
+        placement: props.placement,
+        offset: props.offset
+      }, rest.value, {
+        class: classes.value,
+        onClose: _cache[0] || (_cache[0] = ($event) => unref(context).setOpen(false))
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["open", "anchor", "placement", "offset", "class"]);
+    };
+  }
+});
+const menubarContextKey = Symbol("wow-two.menubar");
+function useMenubarContext() {
+  const context = inject(menubarContextKey, null);
+  if (!context) throw new Error("Menubar.* must be used inside <Menubar>");
+  return context;
+}
+const menubarMenuContextKey = Symbol("wow-two.menubarMenu");
+function useMenubarMenuContext() {
+  const context = inject(menubarMenuContextKey, null);
+  if (!context) throw new Error("MenubarTrigger / MenubarContent must be used inside <MenubarMenu>");
+  return context;
+}
+const menubarVariants = tv({
+  base: "flex items-center gap-1 rounded-md border border-border bg-background p-1"
+});
+const menubarTriggerVariants = tv({
+  base: "inline-flex select-none items-center rounded-sm px-3 py-1 text-sm font-medium text-foreground outline-none transition-colors hover:bg-muted focus-visible:bg-muted data-[state=open]:bg-muted"
+});
+const _sfc_main$j = /* @__PURE__ */ defineComponent({
+  ...{ name: "Menubar", inheritAttrs: false },
+  __name: "Menubar",
+  props: {
+    value: { default: void 0 },
+    defaultValue: { default: null }
+  },
+  emits: ["value-change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const { value: activeId, setValue: setActiveId } = useControlled({
+      controlled: () => props.value,
+      default: () => props.defaultValue,
+      onChange: (next) => emit("value-change", next)
+    });
+    const triggers = [];
+    function registerTrigger(id, triggerEl) {
+      const index = triggers.findIndex((t) => t.id === id);
+      if (index >= 0) triggers[index] = { id, el: triggerEl };
+      else triggers.push({ id, el: triggerEl });
+    }
+    function unregisterTrigger(id) {
+      const index = triggers.findIndex((t) => t.id === id);
+      if (index >= 0) triggers.splice(index, 1);
+    }
+    function moveAcross(fromId, direction) {
+      const index = triggers.findIndex((t) => t.id === fromId);
+      if (index === -1) return;
+      let nextIndex = index + direction;
+      if (nextIndex < 0) nextIndex = triggers.length - 1;
+      if (nextIndex >= triggers.length) nextIndex = 0;
+      const next = triggers[nextIndex];
+      if (!next) return;
+      next.el?.focus();
+      if (activeId.value !== null) setActiveId(next.id);
+    }
+    provide(menubarContextKey, {
+      activeId,
+      setActiveId,
+      registerTrigger,
+      unregisterTrigger,
+      moveAcross
+    });
+    const classes = computed(() => cn(menubarVariants(), attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$C), mergeProps({
+        ref_key: "el",
+        ref: el,
+        orientation: "horizontal",
+        "can-loop": "",
+        role: "menubar"
+      }, rest.value, { class: classes.value }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+const _sfc_main$i = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenubarMenu", inheritAttrs: false },
+  __name: "MenubarMenu",
+  props: {
+    value: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const bar = useMenubarContext();
+    provide(menubarMenuContextKey, {
+      id: props.value,
+      open: computed(() => bar.activeId.value === props.value),
+      setOpen: (next) => bar.setActiveId(next ? props.value : null),
+      triggerEl: shallowRef(null)
+    });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+const _hoisted_1$9 = ["aria-expanded", "data-state", "tabindex"];
+const _sfc_main$h = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenubarTrigger", inheritAttrs: false },
+  __name: "MenubarTrigger",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const bar = useMenubarContext();
+    const menu = useMenubarMenuContext();
+    const item = useRovingFocusItem();
+    const el = shallowRef(null);
+    function setRef(node) {
+      const button = node ?? null;
+      el.value = button;
+      menu.triggerEl.value = button;
+      item.ref(node);
+    }
+    watch(el, (node) => bar.registerTrigger(menu.id, node), { immediate: true, flush: "post" });
+    onScopeDispose(() => bar.unregisterTrigger(menu.id));
+    const isOpen = menu.open;
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      menu.setOpen(!menu.open.value);
+    }
+    function handlePointerEnter() {
+      if (bar.activeId.value !== null && bar.activeId.value !== menu.id) {
+        bar.setActiveId(menu.id);
+      }
+    }
+    function handleFocus() {
+      item.onFocus();
+    }
+    function handleKeydown(event) {
+      if (event.defaultPrevented) return;
+      switch (event.key) {
+        case "ArrowDown":
+        case "Enter":
+        case " ":
+          event.preventDefault();
+          menu.setOpen(true);
+          return;
+        case "ArrowRight":
+        case "ArrowLeft":
+          if (bar.activeId.value !== null) {
+            event.preventDefault();
+            bar.moveAcross(menu.id, event.key === "ArrowRight" ? 1 : -1);
+            return;
+          }
+          break;
+      }
+      item.onKeydown(event);
+    }
+    const classes = computed(
+      () => cn(menubarTriggerVariants(), attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", mergeProps({
+        type: "button",
+        role: "menuitem",
+        "aria-haspopup": "menu",
+        "aria-expanded": unref(isOpen),
+        "data-state": unref(isOpen) ? "open" : "closed",
+        tabindex: unref(item).tabindex,
+        "data-roving-focus-item": true
+      }, rest.value, {
+        ref: setRef,
+        class: classes.value,
+        onClick: handleClick,
+        onPointerenter: handlePointerEnter,
+        onFocus: handleFocus,
+        onKeydown: handleKeydown
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$9);
+    };
+  }
+});
+const _sfc_main$g = /* @__PURE__ */ defineComponent({
+  ...{ name: "MenubarContent", inheritAttrs: false },
+  __name: "MenubarContent",
+  props: {
+    placement: { default: "bottom-start" },
+    offset: { default: 4 }
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const bar = useMenubarContext();
+    const menu = useMenubarMenuContext();
+    const isOpen = menu.open;
+    const anchor = computed(() => menu.triggerEl.value);
+    function handleClose() {
+      menu.setOpen(false);
+      requestAnimationFrame(() => menu.triggerEl.value?.focus());
+    }
+    function handleKeydown(event) {
+      switch (event.key) {
+        case "ArrowRight":
+          event.preventDefault();
+          bar.moveAcross(menu.id, 1);
+          break;
+        case "ArrowLeft":
+          event.preventDefault();
+          bar.moveAcross(menu.id, -1);
+          break;
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$u, mergeProps({
+        open: unref(isOpen),
+        anchor: anchor.value,
+        placement: props.placement,
+        offset: props.offset
+      }, unref(attrs), {
+        onClose: handleClose,
+        onKeydown: handleKeydown
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["open", "anchor", "placement", "offset"]);
+    };
+  }
+});
+const navigationMenuContextKey = Symbol("wow-two.navigationMenu");
+function useNavigationMenuContext() {
+  const context = inject(navigationMenuContextKey, null);
+  if (!context) throw new Error("NavigationMenu.* must be used inside <NavigationMenu>");
+  return context;
+}
+const navigationMenuItemContextKey = Symbol("wow-two.navigationMenuItem");
+function useNavigationMenuItemContext() {
+  const context = inject(navigationMenuItemContextKey, null);
+  if (!context) {
+    throw new Error(
+      "NavigationMenuTrigger / NavigationMenuContent must be used inside <NavigationMenuItem>"
+    );
+  }
+  return context;
+}
+const _hoisted_1$8 = ["aria-label"];
+const DEFAULT_ARIA_LABEL = "Main navigation";
+const _sfc_main$f = /* @__PURE__ */ defineComponent({
+  ...{ name: "NavigationMenu", inheritAttrs: false },
+  __name: "NavigationMenu",
+  props: {
+    value: { default: void 0 },
+    defaultValue: { default: null }
+  },
+  emits: ["value-change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const { value: activeId, setValue: setActiveId } = useControlled({
+      controlled: () => props.value,
+      default: () => props.defaultValue,
+      onChange: (next) => emit("value-change", next)
+    });
+    provide(navigationMenuContextKey, { activeId, setActiveId });
+    const ariaLabel = computed(() => attrs["aria-label"] ?? DEFAULT_ARIA_LABEL);
+    const classes = computed(() => cn("relative", attrs.class));
+    const rest = computed(() => {
+      const { class: _class, "aria-label": _ariaLabel, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("nav", mergeProps({
+        ref_key: "el",
+        ref: el,
+        "aria-label": ariaLabel.value
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$8);
+    };
+  }
+});
+const _sfc_main$e = /* @__PURE__ */ defineComponent({
+  ...{ name: "NavigationMenuList", inheritAttrs: false },
+  __name: "NavigationMenuList",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn("flex items-center gap-1", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$C), mergeProps({
+        ref_key: "el",
+        ref: el,
+        orientation: "horizontal",
+        "can-loop": "",
+        role: "list"
+      }, rest.value, { class: classes.value }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
+  ...{ name: "NavigationMenuItem", inheritAttrs: false },
+  __name: "NavigationMenuItem",
+  props: {
+    value: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const nav = useNavigationMenuContext();
+    provide(navigationMenuItemContextKey, {
+      value: props.value,
+      open: computed(() => nav.activeId.value === props.value),
+      triggerEl: shallowRef(null),
+      contentId: useId(),
+      triggerId: useId()
+    });
+    const classes = computed(() => cn("relative", attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("li", mergeProps({
+        ref_key: "el",
+        ref: el
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16);
+    };
+  }
+});
+const _hoisted_1$7 = ["id", "aria-expanded", "aria-controls", "data-state", "tabindex"];
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
+  ...{ name: "NavigationMenuTrigger", inheritAttrs: false },
+  __name: "NavigationMenuTrigger",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const nav = useNavigationMenuContext();
+    const item = useNavigationMenuItemContext();
+    const roving = useRovingFocusItem();
+    const el = shallowRef(null);
+    function setRef(node) {
+      const button = node ?? null;
+      el.value = button;
+      item.triggerEl.value = button;
+      roving.ref(node);
+    }
+    const isOpen = item.open;
+    let wasOpenedByPointer = false;
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      if (wasOpenedByPointer) {
+        wasOpenedByPointer = false;
+        return;
+      }
+      nav.setActiveId(item.open.value ? null : item.value);
+    }
+    function handlePointerEnter() {
+      if (nav.activeId.value !== null && nav.activeId.value !== item.value) {
+        nav.setActiveId(item.value);
+        wasOpenedByPointer = true;
+      }
+    }
+    function handlePointerLeave() {
+      wasOpenedByPointer = false;
+    }
+    function handleFocus() {
+      roving.onFocus();
+    }
+    function handleKeydown(event) {
+      if (event.defaultPrevented) return;
+      roving.onKeydown(event);
+    }
+    const classes = computed(
+      () => cn(
+        "inline-flex items-center gap-1 rounded-md px-3 py-1.5 text-sm font-medium text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring data-[state=open]:bg-muted",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", mergeProps({
+        id: unref(item).triggerId,
+        type: "button",
+        "aria-haspopup": "true",
+        "aria-expanded": unref(isOpen),
+        "aria-controls": unref(item).contentId,
+        "data-state": unref(isOpen) ? "open" : "closed",
+        tabindex: unref(roving).tabindex,
+        "data-roving-focus-item": true
+      }, rest.value, {
+        ref: setRef,
+        class: classes.value,
+        onClick: handleClick,
+        onPointerenter: handlePointerEnter,
+        onPointerleave: handlePointerLeave,
+        onFocus: handleFocus,
+        onKeydown: handleKeydown
+      }), [
+        renderSlot(_ctx.$slots, "default"),
+        createVNode(unref(ChevronDown), {
+          class: normalizeClass(unref(cn)("h-4 w-4 transition-transform", unref(isOpen) && "rotate-180"))
+        }, null, 8, ["class"])
+      ], 16, _hoisted_1$7);
+    };
+  }
+});
+const _hoisted_1$6 = ["id", "aria-labelledby"];
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
+  ...{ name: "NavigationMenuContent", inheritAttrs: false },
+  __name: "NavigationMenuContent",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const nav = useNavigationMenuContext();
+    const item = useNavigationMenuItemContext();
+    const reducedMotion = useReducedMotion();
+    const isOpen = item.open;
+    const anchor = computed(() => item.triggerEl.value);
+    const el = shallowRef(null);
+    const mounted = shallowRef(item.open.value);
+    watch(
+      [() => item.open.value, reducedMotion],
+      ([open, isReduced], _previous, onCleanup) => {
+        if (open) {
+          mounted.value = true;
+          return;
+        }
+        if (!isReduced) return;
+        if (typeof requestAnimationFrame === "undefined") return;
+        const raf = requestAnimationFrame(() => {
+          mounted.value = false;
+        });
+        onCleanup(() => cancelAnimationFrame(raf));
+      },
+      { immediate: true, flush: "post" }
+    );
+    function handleClose() {
+      nav.setActiveId(null);
+      requestAnimationFrame(() => item.triggerEl.value?.focus());
+    }
+    function handleOutsidePointerDown(event) {
+      if (item.triggerEl.value?.contains(event.target)) return;
+      nav.setActiveId(null);
+    }
+    function handleAnimationEnd() {
+      if (!item.open.value) mounted.value = false;
+    }
+    function setPanel(node) {
+      el.value = node ?? null;
+    }
+    const classes = computed(
+      () => cn(
+        /* pop (fade + slight scale) gated on data-state; motion-safe so
+           reduced-motion users get no movement. */
+        "min-w-[12rem] outline-none",
+        "motion-safe:data-[state=open]:animate-(--animate-pop-in)",
+        "motion-safe:data-[state=closed]:animate-(--animate-pop-out)",
+        "motion-reduce:animate-none",
+        surfaceVariants({ variant: "surface", radius: "md", padding: "md" }),
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return mounted.value ? (openBlock(), createBlock(unref(_sfc_main$y), { key: 0 }, {
+        default: withCtx(() => [
+          createVNode(unref(_sfc_main$z), {
+            anchor: anchor.value,
+            placement: "bottom-start",
+            offset: 6,
+            class: "z-dropdown"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(_sfc_main$B), {
+                "on-escape": handleClose,
+                "on-outside-pointer-down": handleOutsidePointerDown
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(Presence), { "is-present": unref(isOpen) }, {
+                    default: withCtx(() => [
+                      createElementVNode("div", mergeProps({
+                        id: unref(item).contentId,
+                        "aria-labelledby": unref(item).triggerId
+                      }, rest.value, {
+                        ref: setPanel,
+                        class: classes.value,
+                        onAnimationend: handleAnimationEnd
+                      }), [
+                        renderSlot(_ctx.$slots, "default")
+                      ], 16, _hoisted_1$6)
+                    ]),
+                    _: 3
+                  }, 8, ["is-present"])
+                ]),
+                _: 3
+              })
+            ]),
+            _: 3
+          }, 8, ["anchor"])
+        ]),
+        _: 3
+      })) : createCommentVNode("", true);
+    };
+  }
+});
+const _hoisted_1$5 = ["tabindex"];
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
+  ...{ name: "NavigationMenuLink", inheritAttrs: false },
+  __name: "NavigationMenuLink",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const roving = useRovingFocusItem();
+    const el = shallowRef(null);
+    function setRef(node) {
+      el.value = node ?? null;
+      roving.ref(node);
+    }
+    function handleFocus() {
+      roving.onFocus();
+    }
+    function handleKeydown(event) {
+      if (event.defaultPrevented) return;
+      roving.onKeydown(event);
+    }
+    const classes = computed(
+      () => cn(
+        "inline-flex items-center rounded-md px-3 py-1.5 text-sm font-medium text-foreground transition-colors hover:bg-muted hover:underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("a", mergeProps({
+        tabindex: unref(roving).tabindex,
+        "data-roving-focus-item": true
+      }, rest.value, {
+        ref: setRef,
+        class: classes.value,
+        onFocus: handleFocus,
+        onKeydown: handleKeydown
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$5);
+    };
+  }
+});
+const commandPaletteContextKey = Symbol("wow-two.commandPalette");
+function useCommandPaletteContext() {
+  const context = inject(commandPaletteContextKey, null);
+  if (!context) throw new Error("CommandPalette.* must be used inside <CommandPalette>");
+  return context;
+}
+const defaultFilter = (searchText, search) => searchText.toLowerCase().includes(search.toLowerCase());
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPalette", inheritAttrs: false },
+  __name: "CommandPalette",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: false },
+    inputValue: { default: void 0 },
+    defaultInputValue: { default: void 0 },
+    triggerKey: { default: void 0 },
+    filter: { type: Function, default: defaultFilter }
+  },
+  emits: ["update:open", "open-change", "update:inputValue", "input-change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const openState = useControlled({
+      controlled: () => props.open !== void 0 ? props.open : props.isOpen,
+      default: () => props.defaultOpen,
+      onChange: (value) => {
+        emit("update:open", value);
+        emit("open-change", value);
+      }
+    });
+    const inputState = useControlled({
+      controlled: () => props.inputValue,
+      default: () => props.defaultInputValue ?? "",
+      onChange: (value) => {
+        emit("update:inputValue", value);
+        emit("input-change", value);
+      }
+    });
+    const items = shallowRef([]);
+    const activeId = shallowRef(null);
+    const inputEl = shallowRef(null);
+    const inputId = useId();
+    const listboxId = useId();
+    function registerItem(entry) {
+      const next = items.value.slice();
+      const index = next.findIndex((i) => i.id === entry.id);
+      if (index >= 0) next[index] = entry;
+      else next.push(entry);
+      items.value = next;
+    }
+    function unregisterItem(id) {
+      items.value = items.value.filter((i) => i.id !== id);
+    }
+    const chordKey = computed(() => {
+      const key = props.triggerKey;
+      return !key ? "k" : key === "+" ? "plus" : key;
+    });
+    useHotkeys(
+      () => [`mod+${chordKey.value}`, `ctrl+${chordKey.value}`, `meta+${chordKey.value}`],
+      () => openState.setValue(true),
+      { enabled: () => Boolean(props.triggerKey) }
+    );
+    watch(
+      () => openState.value.value,
+      (isOpen) => {
+        if (!isOpen) activeId.value = null;
+      },
+      { flush: "post" }
+    );
+    provide(commandPaletteContextKey, {
+      open: openState.value,
+      setOpen: openState.setValue,
+      inputValue: inputState.value,
+      setInputValue: inputState.setValue,
+      activeId,
+      setActiveId: (id) => {
+        activeId.value = id;
+      },
+      items,
+      registerItem,
+      unregisterItem,
+      /* Wrapped rather than stored, so a `filter` prop change is picked up live —
+         React re-created the whole context value for the same effect. */
+      filter: (searchText, search) => props.filter(searchText, search),
+      inputId,
+      listboxId,
+      inputEl
+    });
+    const resolvedOpen = openState.value;
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$D), {
+        open: unref(resolvedOpen),
+        onOpenChange: unref(openState).setValue
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["open", "onOpenChange"]);
+    };
+  }
+});
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteContent", inheritAttrs: false },
+  __name: "CommandPaletteContent",
+  setup(__props) {
+    const attrs = useAttrs();
+    const classes = computed(
+      () => cn("w-full max-w-xl gap-0 overflow-hidden p-0", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$E), mergeProps(rest.value, { class: classes.value }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+const _hoisted_1$4 = { class: "flex items-center gap-2 border-b border-border px-3" };
+const _hoisted_2$2 = ["id", "aria-controls", "aria-activedescendant", "placeholder", "value"];
+const DEFAULT_PLACEHOLDER = "Type a command…";
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteInput", inheritAttrs: false },
+  __name: "CommandPaletteInput",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const context = useCommandPaletteContext();
+    const el = shallowRef(null);
+    const inputValue = context.inputValue;
+    const activeId = context.activeId;
+    function setRef(node) {
+      const input = node ?? null;
+      el.value = input;
+      context.inputEl.value = input;
+    }
+    watch(
+      [() => context.open.value, el],
+      ([isOpen, input]) => {
+        if (isOpen && input) input.focus();
+      },
+      { flush: "post" }
+    );
+    function visibleItems() {
+      const search = context.inputValue.value;
+      return context.items.value.filter(
+        (i) => !i.disabled && (search === "" || context.filter(i.searchText, search))
+      );
+    }
+    watch(
+      [() => context.inputValue.value, context.items],
+      () => {
+        const list = visibleItems();
+        if (list.length > 0 && !list.some((i) => i.id === context.activeId.value)) {
+          context.setActiveId(list[0].id);
+        } else if (list.length === 0) {
+          context.setActiveId(null);
+        }
+      },
+      { immediate: true, flush: "post" }
+    );
+    function moveActive(direction) {
+      const list = visibleItems();
+      if (list.length === 0) return;
+      const index = list.findIndex((i) => i.id === context.activeId.value);
+      let nextIndex = index + direction;
+      if (index === -1) nextIndex = direction === 1 ? 0 : list.length - 1;
+      if (nextIndex < 0) nextIndex = list.length - 1;
+      if (nextIndex >= list.length) nextIndex = 0;
+      context.setActiveId(list[nextIndex].id);
+    }
+    function handleKeydown(event) {
+      if (event.defaultPrevented) return;
+      switch (event.key) {
+        case "ArrowDown":
+          event.preventDefault();
+          moveActive(1);
+          break;
+        case "ArrowUp":
+          event.preventDefault();
+          moveActive(-1);
+          break;
+        case "Home": {
+          if (event.target !== context.inputEl.value) break;
+          const first = visibleItems();
+          if (first.length > 0) context.setActiveId(first[0].id);
+          break;
+        }
+        case "End": {
+          if (event.target !== context.inputEl.value) break;
+          const last = visibleItems();
+          if (last.length > 0) context.setActiveId(last[last.length - 1].id);
+          break;
+        }
+        case "Enter": {
+          const id = context.activeId.value;
+          if (!id) return;
+          const entry = context.items.value.find((i) => i.id === id);
+          if (!entry || entry.disabled) return;
+          event.preventDefault();
+          entry.select();
+          if (entry.closeOnSelect) context.setOpen(false);
+          break;
+        }
+      }
+    }
+    function handleInput(event) {
+      context.setInputValue(event.target.value);
+    }
+    const placeholder = computed(
+      () => attrs.placeholder ?? DEFAULT_PLACEHOLDER
+    );
+    const classes = computed(
+      () => cn(
+        "flex h-12 w-full bg-transparent text-sm text-foreground placeholder:text-subtle-foreground outline-none disabled:cursor-not-allowed disabled:opacity-50",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, placeholder: _placeholder, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$4, [
+        createVNode(unref(_sfc_main$x), {
+          icon: unref(Search),
+          size: 16,
+          class: "text-muted-foreground"
+        }, null, 8, ["icon"]),
+        createElementVNode("input", mergeProps(rest.value, {
+          id: unref(context).inputId,
+          ref: setRef,
+          type: "text",
+          role: "combobox",
+          "aria-expanded": "true",
+          "aria-controls": unref(context).listboxId,
+          "aria-activedescendant": unref(activeId) ?? void 0,
+          "aria-autocomplete": "list",
+          placeholder: placeholder.value,
+          value: unref(inputValue),
+          class: classes.value,
+          onInput: handleInput,
+          onKeydown: handleKeydown
+        }), null, 16, _hoisted_2$2)
+      ]);
+    };
+  }
+});
+const _hoisted_1$3 = ["id", "aria-labelledby"];
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteList", inheritAttrs: false },
+  __name: "CommandPaletteList",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const context = useCommandPaletteContext();
+    const classes = computed(
+      () => cn("max-h-80 overflow-y-auto p-1", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        id: unref(context).listboxId,
+        ref_key: "el",
+        ref: el,
+        role: "listbox",
+        "aria-labelledby": unref(context).inputId
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$3);
+    };
+  }
+});
+const _hoisted_1$2 = ["aria-labelledby"];
+const _hoisted_2$1 = ["id"];
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteGroup", inheritAttrs: false },
+  __name: "CommandPaletteGroup",
+  props: {
+    label: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const slots = useSlots();
+    const el = useTemplateRef("el");
+    const labelId = useId();
+    const hasLabel = computed(() => Boolean(props.label) || Boolean(slots.label));
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "el",
+        ref: el,
+        role: "group",
+        "aria-labelledby": hasLabel.value ? unref(labelId) : void 0
+      }, unref(attrs)), [
+        hasLabel.value ? (openBlock(), createElementBlock("div", {
+          key: 0,
+          id: unref(labelId),
+          class: normalizeClass(unref(listboxGroupLabelVariants)())
+        }, [
+          renderSlot(_ctx.$slots, "label", {}, () => [
+            createTextVNode(toDisplayString(props.label), 1)
+          ])
+        ], 10, _hoisted_2$1)) : createCommentVNode("", true),
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$2);
+    };
+  }
+});
+const _hoisted_1$1 = ["id", "aria-selected", "aria-disabled", "data-active"];
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteItem", inheritAttrs: false },
+  __name: "CommandPaletteItem",
+  props: {
+    value: {},
+    searchText: { default: void 0 },
+    isDisabled: { type: Boolean, default: void 0 },
+    closeOnSelect: { type: Boolean, default: true }
+  },
+  emits: ["select"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const context = useCommandPaletteContext();
+    const el = useTemplateRef("el");
+    const id = useId();
+    const resolvedSearch = computed(() => props.searchText ?? props.value);
+    watch(
+      [() => props.value, resolvedSearch, () => props.isDisabled, () => props.closeOnSelect],
+      ([value, searchText, isDisabled, closeOnSelect]) => {
+        context.registerItem({
+          id,
+          value,
+          searchText,
+          disabled: isDisabled === true,
+          select: () => emit("select"),
+          closeOnSelect
+        });
+      },
+      { immediate: true, flush: "post" }
+    );
+    onScopeDispose(() => context.unregisterItem(id));
+    const matches = computed(
+      () => context.inputValue.value === "" || context.filter(resolvedSearch.value, context.inputValue.value)
+    );
+    const isActive = computed(() => context.activeId.value === id);
+    const state = computed(
+      () => props.isDisabled ? "disabled" : isActive.value ? "active" : "default"
+    );
+    function handleClick(event) {
+      if (event.defaultPrevented || props.isDisabled) return;
+      emit("select");
+      if (props.closeOnSelect) context.setOpen(false);
+    }
+    function handlePointerEnter() {
+      if (!props.isDisabled) context.setActiveId(id);
+    }
+    const classes = computed(
+      () => cn(listboxItemVariants({ state: state.value }), attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return matches.value ? (openBlock(), createElementBlock("div", mergeProps({
+        key: 0,
+        id: unref(id),
+        ref_key: "el",
+        ref: el,
+        role: "option",
+        "aria-selected": isActive.value,
+        "aria-disabled": props.isDisabled || void 0,
+        "data-active": isActive.value ? "" : void 0
+      }, rest.value, {
+        class: classes.value,
+        onClick: handleClick,
+        onPointerenter: handlePointerEnter
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$1)) : createCommentVNode("", true);
+    };
+  }
+});
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteEmpty", inheritAttrs: false },
+  __name: "CommandPaletteEmpty",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const context = useCommandPaletteContext();
+    const matchCount = computed(() => {
+      const search = context.inputValue.value;
+      return context.items.value.filter((i) => search === "" || context.filter(i.searchText, search)).length;
+    });
+    const classes = computed(() => cn(listboxEmptyVariants(), attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return matchCount.value === 0 ? (openBlock(), createElementBlock("div", mergeProps({
+        key: 0,
+        ref_key: "el",
+        ref: el,
+        role: "status"
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16)) : createCommentVNode("", true);
+    };
+  }
+});
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  ...{ name: "CommandPaletteSeparator", inheritAttrs: false },
+  __name: "CommandPaletteSeparator",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(() => cn(listboxSeparatorVariants(), attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", mergeProps({
+        ref_key: "el",
+        ref: el,
+        role: "separator"
+      }, rest.value, { class: classes.value }), null, 16);
+    };
+  }
+});
+function useScrollSpy(ids, options = {}) {
+  const activeId = shallowRef(null);
+  watch(
+    [
+      () => toValue(ids),
+      () => toValue(options.rootMargin) ?? "0px 0px -60% 0px",
+      () => toValue(options.threshold) ?? 0,
+      () => toValue(options.root) ?? null
+    ],
+    ([idList, rootMargin, threshold, root], _previous, onCleanup) => {
+      if (typeof document === "undefined" || typeof IntersectionObserver === "undefined" || idList.length === 0) {
+        return;
+      }
+      const seen = /* @__PURE__ */ new Map();
+      const elements = idList.map((id) => document.getElementById(id)).filter((el) => el != null);
+      const observer = new IntersectionObserver(
+        (entries) => {
+          for (const e of entries) {
+            if (e.isIntersecting) {
+              seen.set(e.target.id, e.boundingClientRect.top);
+            } else {
+              seen.delete(e.target.id);
+            }
+          }
+          if (seen.size === 0) return;
+          let bestId = null;
+          let bestTop = Number.POSITIVE_INFINITY;
+          for (const [id, top] of seen) {
+            if (top < bestTop) {
+              bestTop = top;
+              bestId = id;
+            }
+          }
+          activeId.value = bestId;
+        },
+        { rootMargin, threshold, root }
+      );
+      for (const el of elements) observer.observe(el);
+      onCleanup(() => observer.disconnect());
+    },
+    { immediate: true, flush: "post" }
+  );
+  return activeId;
+}
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...{ name: "ScrollSpy" },
+  __name: "ScrollSpy",
+  props: {
+    ids: {},
+    rootMargin: {},
+    threshold: {},
+    root: {}
+  },
+  emits: ["active-change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const activeId = useScrollSpy(
+      () => props.ids,
+      {
+        rootMargin: () => props.rootMargin,
+        threshold: () => props.threshold,
+        root: () => props.root
+      }
+    );
+    watch(activeId, (id) => emit("active-change", id), { immediate: true, flush: "post" });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps({ activeId: unref(activeId) })));
+    };
+  }
+});
+const _hoisted_1 = { class: "space-y-1 text-sm" };
+const _hoisted_2 = ["href", "aria-current"];
+function depthFromTagName(tag) {
+  const match = /^H([1-6])$/i.exec(tag);
+  return match ? Number(match[1]) - 2 : 0;
+}
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "TableOfContents", inheritAttrs: false },
+  __name: "TableOfContents",
+  props: {
+    items: {},
+    source: {},
+    headingSelector: { default: "h2, h3" },
+    activeId: { default: void 0 },
+    isSticky: { type: Boolean }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const extracted = shallowRef([]);
+    watch(
+      [() => props.items, () => props.source, () => props.headingSelector],
+      ([itemsProp, source, headingSelector]) => {
+        if (itemsProp || !source) return;
+        const headings = Array.from(source.querySelectorAll(headingSelector));
+        extracted.value = headings.filter((h) => h.id).map((h) => ({
+          id: h.id,
+          label: h.textContent ?? "",
+          depth: Math.max(0, depthFromTagName(h.tagName))
+        }));
+      },
+      { immediate: true, flush: "post" }
+    );
+    const items = computed(() => props.items ?? extracted.value);
+    const ids = computed(() => items.value.map((i) => i.id));
+    const spyId = useScrollSpy(() => ids.value);
+    const activeId = computed(() => props.activeId !== void 0 ? props.activeId : spyId.value);
+    const classes = computed(
+      () => cn(props.isSticky && "sticky top-4 self-start", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return items.value.length > 0 ? (openBlock(), createElementBlock("nav", mergeProps({
+        key: 0,
+        ref_key: "el",
+        ref: el,
+        "aria-label": "Table of contents"
+      }, rest.value, { class: classes.value }), [
+        createElementVNode("ul", _hoisted_1, [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(items.value, (item, i) => {
+            return openBlock(), createElementBlock("li", {
+              key: item.id,
+              style: normalizeStyle({ paddingLeft: `${(item.depth ?? 0) * 12}px` })
+            }, [
+              createElementVNode("a", {
+                href: `#${item.id}`,
+                "aria-current": item.id === activeId.value ? "location" : void 0,
+                class: normalizeClass(
+                  unref(cn)(
+                    "block rounded-sm px-2 py-1 transition-colors",
+                    item.id === activeId.value ? "bg-muted font-medium text-foreground" : "text-muted-foreground hover:bg-muted/40 hover:text-foreground"
+                  )
+                )
+              }, [
+                renderSlot(_ctx.$slots, "label", {
+                  item,
+                  index: i
+                }, () => [
+                  createTextVNode(toDisplayString(item.label), 1)
+                ])
+              ], 10, _hoisted_2)
+            ], 4);
+          }), 128))
+        ])
+      ], 16)) : createCommentVNode("", true);
+    };
+  }
+});
+export {
+  useNavigationMenuContext as $,
+  _sfc_main$d as A,
+  _sfc_main$a as B,
+  _sfc_main$e as C,
+  _sfc_main$c as D,
+  _sfc_main$v as E,
+  _sfc_main$1 as F,
+  _sfc_main as G,
+  commandPaletteContextKey as H,
+  contextMenuContextKey as I,
+  defaultFilter as J,
+  dropdownMenuContextKey as K,
+  menuItemVariants as L,
+  MenuItemState as M,
+  menuLabelVariants as N,
+  menuSeparatorVariants as O,
+  menuVariants as P,
+  menubarContextKey as Q,
+  menubarMenuContextKey as R,
+  navigationMenuContextKey as S,
+  navigationMenuItemContextKey as T,
+  useCommandPaletteContext as U,
+  useContextMenuContext as V,
+  useDropdownMenuContext as W,
+  useMenuContext as X,
+  useMenubarContext as Y,
+  useMenubarMenuContext as Z,
+  _sfc_main$w as _,
+  _sfc_main$9 as a,
+  useNavigationMenuItemContext as a0,
+  useScrollSpy as a1,
+  _sfc_main$8 as b,
+  _sfc_main$3 as c,
+  _sfc_main$5 as d,
+  _sfc_main$7 as e,
+  _sfc_main$4 as f,
+  _sfc_main$6 as g,
+  _sfc_main$2 as h,
+  _sfc_main$m as i,
+  _sfc_main$k as j,
+  _sfc_main$l as k,
+  _sfc_main$p as l,
+  _sfc_main$n as m,
+  _sfc_main$o as n,
+  _sfc_main$u as o,
+  _sfc_main$s as p,
+  _sfc_main$t as q,
+  MenuKey as r,
+  _sfc_main$r as s,
+  _sfc_main$q as t,
+  _sfc_main$j as u,
+  _sfc_main$g as v,
+  _sfc_main$i as w,
+  _sfc_main$h as x,
+  _sfc_main$f as y,
+  _sfc_main$b as z
+};
+//# sourceMappingURL=TableOfContents.vue_vue_type_script_setup_true_lang-HVL4lg_f.js.map