@wow-two-beta/ui-vue 0.0.2

package/dist/chunks/BottomSheet.vue_vue_type_script_setup_true_lang-CmNoI4BE.js

@@ -0,0 +1,1094 @@
+import { defineComponent, useAttrs, useTemplateRef, watch, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot, createElementBlock, useSlots, createVNode, shallowRef, onScopeDispose, provide, inject, createElementVNode, normalizeClass, createTextVNode, toDisplayString, createCommentVNode, ref, normalizeStyle } from "vue";
+import { t as toHtmlElement } from "./PopoverContent.vue_vue_type_script_setup_true_lang-D-OiGICS.js";
+import { u as useModalContext, _ as _sfc_main$l, a as _sfc_main$m } from "./ModalContent.vue_vue_type_script_setup_true_lang-CLACSqKg.js";
+import { P as Primitive } from "./Primitive-Cm3ECaVw.js";
+import { c as cn } from "./cn-CzDCF-Ah.js";
+import { X } from "lucide-vue-next";
+import { u as useOverlayChromeContext, o as overlayChromeContextKey } from "./OverlayChrome-e4MNr8Yl.js";
+import { u as useDrawerContext, _ as _sfc_main$q, a as _sfc_main$r } from "./DrawerContent.vue_vue_type_script_setup_true_lang-DvvrJdF0.js";
+import { _ as _sfc_main$n } from "./OverlayArrow.vue_vue_type_script_setup_true_lang-CLYhnI8i.js";
+import { u as useControlled } from "./useControlled-B6M4kTLn.js";
+import { u as useEscape } from "./useEscape-CYPdpm_l.js";
+import { _ as _sfc_main$o } from "./Portal.vue_vue_type_script_setup_true_lang-CF3R0VCZ.js";
+import { _ as _sfc_main$p } from "./AnchoredPositioner.vue_vue_type_script_setup_true_lang-BpBVI2Cu.js";
+import { P as Presence } from "./Presence-C7IJvh_P.js";
+import { _ as _sfc_main$t } from "./Backdrop.vue_vue_type_script_setup_true_lang-DZUhGY9p.js";
+import { u as useId } from "./useId-CtgAhGrn.js";
+import { s as surfaceVariants } from "./SurfaceStyles-ChdpGRBO.js";
+import { _ as _sfc_main$s } from "./ScrollLockProvider.vue_vue_type_script_setup_true_lang-_ihHJ7jI.js";
+import { _ as _sfc_main$u, a as _sfc_main$v } from "./DismissableLayer.vue_vue_type_script_setup_true_lang-6nRnzsJW.js";
+const _sfc_main$k = /* @__PURE__ */ defineComponent({
+  ...{ name: "ModalTrigger", inheritAttrs: false },
+  __name: "ModalTrigger",
+  props: {
+    asChild: { type: Boolean, default: false }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const context = useModalContext();
+    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.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": "dialog",
+        "aria-expanded": unref(isOpen),
+        "data-state": unref(isOpen) ? "open" : "closed"
+      }, unref(attrs), { onClick: handleClick }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child", "aria-expanded", "data-state"]);
+    };
+  }
+});
+const _sfc_main$j = /* @__PURE__ */ defineComponent({
+  ...{ name: "OverlayHeader", inheritAttrs: false },
+  __name: "OverlayHeader",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn("mb-4 flex flex-col gap-1.5", 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 _hoisted_1$3 = ["id"];
+const _sfc_main$i = /* @__PURE__ */ defineComponent({
+  ...{ name: "OverlayTitle", inheritAttrs: false },
+  __name: "OverlayTitle",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const context = useOverlayChromeContext();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn("text-lg font-semibold leading-none text-foreground", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("h2", mergeProps({
+        ref_key: "el",
+        ref: el,
+        id: unref(context).titleId
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$3);
+    };
+  }
+});
+const _hoisted_1$2 = ["id"];
+const _sfc_main$h = /* @__PURE__ */ defineComponent({
+  ...{ name: "OverlayDescription", inheritAttrs: false },
+  __name: "OverlayDescription",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const context = useOverlayChromeContext();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn("text-sm text-muted-foreground", attrs.class)
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("p", mergeProps({
+        ref_key: "el",
+        ref: el,
+        id: unref(context).descriptionId
+      }, rest.value, { class: classes.value }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16, _hoisted_1$2);
+    };
+  }
+});
+const _sfc_main$g = /* @__PURE__ */ defineComponent({
+  ...{ name: "OverlayBody", inheritAttrs: false },
+  __name: "OverlayBody",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn("text-sm text-foreground", 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$f = /* @__PURE__ */ defineComponent({
+  ...{ name: "OverlayFooter", inheritAttrs: false },
+  __name: "OverlayFooter",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn(
+        "mt-6 flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",
+        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$e = /* @__PURE__ */ defineComponent({
+  ...{ name: "OverlayCloseButton", inheritAttrs: false },
+  __name: "OverlayCloseButton",
+  props: {
+    asChild: { type: Boolean, default: false }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const slots = useSlots();
+    const context = useOverlayChromeContext();
+    const inner = useTemplateRef("inner");
+    const classes = computed(
+      () => props.asChild ? attrs.class : cn(
+        "absolute right-4 top-4 grid h-7 w-7 place-items-center rounded-sm text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      context.close();
+    }
+    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-label": unref(slots).default ? void 0 : "Close"
+      }, rest.value, {
+        class: classes.value,
+        onClick: handleClick
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createVNode(unref(X), { class: "h-4 w-4" })
+          ])
+        ]),
+        _: 3
+      }, 16, ["as-child", "aria-label", "class"]);
+    };
+  }
+});
+const _sfc_main$d = /* @__PURE__ */ defineComponent({
+  ...{ name: "AlertModal", inheritAttrs: false },
+  __name: "AlertModal",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: false },
+    dismissOnEscape: { type: Boolean, default: true }
+  },
+  emits: ["update:open", "open-change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    function handleOpenChange(open) {
+      emit("update:open", open);
+      emit("open-change", open);
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$l, {
+        open: props.open,
+        "is-open": props.isOpen,
+        "default-open": props.defaultOpen,
+        "dismiss-on-escape": props.dismissOnEscape,
+        role: "alertdialog",
+        "dismiss-on-outside-click": false,
+        onOpenChange: handleOpenChange
+      }, {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 8, ["open", "is-open", "default-open", "dismiss-on-escape"]);
+    };
+  }
+});
+const _sfc_main$c = /* @__PURE__ */ defineComponent({
+  ...{ name: "AlertModalContent", inheritAttrs: false },
+  __name: "AlertModalContent",
+  props: {
+    hideBackdrop: { type: Boolean },
+    isBlurred: { type: Boolean },
+    variant: {},
+    tone: {},
+    radius: {},
+    padding: {},
+    elevation: {}
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const inner = useTemplateRef("inner");
+    const forwarded = computed(() => ({ ...props, ...attrs }));
+    const el = computed(() => inner.value?.$el ?? null);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$m, mergeProps({
+        ref_key: "inner",
+        ref: inner
+      }, forwarded.value), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16);
+    };
+  }
+});
+const _sfc_main$b = /* @__PURE__ */ defineComponent({
+  ...{ name: "AlertModalAction", inheritAttrs: false },
+  __name: "AlertModalAction",
+  emits: ["action"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const emit = __emit;
+    const attrs = useAttrs();
+    const inner = useTemplateRef("inner");
+    const classes = computed(
+      () => cn(
+        "inline-flex h-9 items-center justify-center rounded-md bg-primary px-4 text-sm font-medium text-primary-foreground transition-colors hover:bg-primary/90 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      emit("action");
+    }
+    const el = computed(() => inner.value?.$el ?? null);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$e, mergeProps({
+        ref_key: "inner",
+        ref: inner
+      }, rest.value, {
+        class: classes.value,
+        onClick: handleClick
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
+  ...{ name: "AlertModalCancel", inheritAttrs: false },
+  __name: "AlertModalCancel",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const inner = useTemplateRef("inner");
+    const classes = computed(
+      () => cn(
+        "inline-flex h-9 items-center justify-center rounded-md border border-border bg-background px-4 text-sm font-medium text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    const el = computed(() => inner.value?.$el ?? null);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$e, mergeProps({
+        ref_key: "inner",
+        ref: inner
+      }, rest.value, { class: classes.value }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["class"]);
+    };
+  }
+});
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+  ...{ name: "DrawerTrigger", inheritAttrs: false },
+  __name: "DrawerTrigger",
+  props: {
+    asChild: { type: Boolean, default: false }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const context = useDrawerContext();
+    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.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": "dialog",
+        "aria-expanded": unref(isOpen),
+        "data-state": unref(isOpen) ? "open" : "closed"
+      }, unref(attrs), { onClick: handleClick }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child", "aria-expanded", "data-state"]);
+    };
+  }
+});
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  ...{ name: "PopoverArrow", inheritAttrs: false },
+  __name: "PopoverArrow",
+  props: {
+    width: {},
+    height: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const classes = computed(() => cn("text-popover", attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$n), mergeProps({
+        width: props.width,
+        height: props.height
+      }, rest.value, { class: classes.value }), null, 16, ["width", "height", "class"]);
+    };
+  }
+});
+const hoverCardContextKey = Symbol("wow-two.hoverCard");
+function useHoverCardContext() {
+  const context = inject(hoverCardContextKey, null);
+  if (!context) throw new Error("HoverCard.* must be used inside <HoverCard>");
+  return context;
+}
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+  ...{ name: "HoverCard", inheritAttrs: false },
+  __name: "HoverCard",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: false },
+    openDelay: { default: 700 },
+    closeDelay: { default: 300 },
+    placement: { default: "bottom" },
+    offset: { default: 8 }
+  },
+  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);
+      }
+    });
+    const triggerEl = shallowRef(null);
+    let openTimer = null;
+    let closeTimer = null;
+    function clear() {
+      if (openTimer) clearTimeout(openTimer);
+      if (closeTimer) clearTimeout(closeTimer);
+      openTimer = null;
+      closeTimer = null;
+    }
+    function show() {
+      clear();
+      openTimer = setTimeout(() => controlled.setValue(true), props.openDelay);
+    }
+    function hide() {
+      clear();
+      closeTimer = setTimeout(() => controlled.setValue(false), props.closeDelay);
+    }
+    function cancelHide() {
+      if (closeTimer) {
+        clearTimeout(closeTimer);
+        closeTimer = null;
+      }
+    }
+    onScopeDispose(clear);
+    useEscape(
+      () => {
+        clear();
+        controlled.setValue(false);
+      },
+      () => controlled.value.value
+    );
+    provide(hoverCardContextKey, {
+      open: controlled.value,
+      setOpen: controlled.setValue,
+      triggerEl,
+      show,
+      hide,
+      cancelHide,
+      placement: computed(() => props.placement),
+      offset: computed(() => props.offset)
+    });
+    return (_ctx, _cache) => {
+      return renderSlot(_ctx.$slots, "default");
+    };
+  }
+});
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  ...{ name: "HoverCardTrigger", inheritAttrs: false },
+  __name: "HoverCardTrigger",
+  props: {
+    asChild: { type: Boolean, default: true }
+  },
+  setup(__props, { expose: __expose }) {
+    const props = __props;
+    const attrs = useAttrs();
+    const context = useHoverCardContext();
+    const inner = useTemplateRef("inner");
+    watch(
+      inner,
+      (instance) => {
+        context.triggerEl.value = toHtmlElement(instance?.$el);
+      },
+      { immediate: true, flush: "post" }
+    );
+    const el = computed(() => inner.value?.$el ?? null);
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(Primitive), mergeProps({
+        ref_key: "inner",
+        ref: inner,
+        as: "span",
+        "as-child": props.asChild
+      }, unref(attrs), {
+        onPointerenter: _cache[0] || (_cache[0] = ($event) => unref(context).show()),
+        onPointerleave: _cache[1] || (_cache[1] = ($event) => unref(context).hide()),
+        onFocus: _cache[2] || (_cache[2] = ($event) => unref(context).show()),
+        onBlur: _cache[3] || (_cache[3] = ($event) => unref(context).hide())
+      }), {
+        default: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ]),
+        _: 3
+      }, 16, ["as-child"]);
+    };
+  }
+});
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  ...{ name: "HoverCardContent", inheritAttrs: false },
+  __name: "HoverCardContent",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const context = useHoverCardContext();
+    const el = useTemplateRef("el");
+    const isOpen = context.open;
+    const placement = context.placement;
+    const offset = context.offset;
+    const anchor = computed(() => context.triggerEl.value);
+    const classes = computed(
+      () => cn(
+        "w-64 rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md outline-none",
+        "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;
+    });
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$o), null, {
+        default: withCtx(() => [
+          createVNode(unref(_sfc_main$p), {
+            anchor: anchor.value,
+            placement: unref(placement),
+            offset: unref(offset),
+            class: "z-dropdown"
+          }, {
+            default: withCtx(() => [
+              createVNode(unref(Presence), { "is-present": unref(isOpen) }, {
+                default: withCtx(() => [
+                  createElementVNode("div", mergeProps({
+                    ref_key: "el",
+                    ref: el
+                  }, rest.value, {
+                    class: classes.value,
+                    onPointerenter: _cache[0] || (_cache[0] = ($event) => unref(context).cancelHide()),
+                    onPointerleave: _cache[1] || (_cache[1] = ($event) => unref(context).hide())
+                  }), [
+                    renderSlot(_ctx.$slots, "default")
+                  ], 16)
+                ]),
+                _: 3
+              }, 8, ["is-present"])
+            ]),
+            _: 3
+          }, 8, ["anchor", "placement", "offset"])
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  ...{ name: "HoverCardArrow", inheritAttrs: false },
+  __name: "HoverCardArrow",
+  props: {
+    width: {},
+    height: {}
+  },
+  setup(__props) {
+    const props = __props;
+    const attrs = useAttrs();
+    const classes = computed(() => cn("text-popover", attrs.class));
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$n), mergeProps({
+        width: props.width,
+        height: props.height
+      }, rest.value, { class: classes.value }), null, 16, ["width", "height", "class"]);
+    };
+  }
+});
+const _hoisted_1$1 = {
+  key: 0,
+  class: "px-3 py-2 text-center"
+};
+const _hoisted_2$1 = { class: "flex flex-col gap-px overflow-hidden rounded-lg bg-border" };
+const actionSheetContextKey = Symbol(
+  "wow-two.actionSheet"
+);
+function useActionSheetContext() {
+  const context = inject(actionSheetContextKey, null);
+  if (!context) throw new Error("ActionSheet.* must be used inside <ActionSheet>");
+  return context;
+}
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  ...{ name: "ActionSheet", inheritAttrs: false },
+  __name: "ActionSheet",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: false },
+    title: { default: void 0 },
+    description: { default: void 0 }
+  },
+  emits: ["update:open", "open-change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const slots = useSlots();
+    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);
+      }
+    });
+    const resolvedOpen = controlled.value;
+    provide(actionSheetContextKey, { setOpen: controlled.setValue });
+    const hasTitle = computed(() => props.title !== void 0 || slots.title !== void 0);
+    const hasDescription = computed(
+      () => props.description !== void 0 || slots.description !== void 0
+    );
+    const classes = computed(
+      () => cn(
+        "mx-auto max-w-md rounded-t-xl bg-card p-2 text-card-foreground",
+        attrs.class
+      )
+    );
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(_sfc_main$q, {
+        open: unref(resolvedOpen),
+        side: "bottom",
+        onOpenChange: unref(controlled).setValue
+      }, {
+        default: withCtx(() => [
+          createVNode(_sfc_main$r, {
+            class: normalizeClass(classes.value)
+          }, {
+            default: withCtx(() => [
+              hasTitle.value || hasDescription.value ? (openBlock(), createElementBlock("div", _hoisted_1$1, [
+                hasTitle.value ? (openBlock(), createBlock(_sfc_main$i, {
+                  key: 0,
+                  class: "text-sm font-medium text-muted-foreground"
+                }, {
+                  default: withCtx(() => [
+                    renderSlot(_ctx.$slots, "title", {}, () => [
+                      createTextVNode(toDisplayString(props.title), 1)
+                    ])
+                  ]),
+                  _: 3
+                })) : createCommentVNode("", true),
+                hasDescription.value ? (openBlock(), createBlock(_sfc_main$h, {
+                  key: 1,
+                  class: "mt-1 text-xs text-muted-foreground"
+                }, {
+                  default: withCtx(() => [
+                    renderSlot(_ctx.$slots, "description", {}, () => [
+                      createTextVNode(toDisplayString(props.description), 1)
+                    ])
+                  ]),
+                  _: 3
+                })) : createCommentVNode("", true)
+              ])) : createCommentVNode("", true),
+              createElementVNode("div", _hoisted_2$1, [
+                renderSlot(_ctx.$slots, "default")
+              ])
+            ]),
+            _: 3
+          }, 8, ["class"])
+        ]),
+        _: 3
+      }, 8, ["open", "onOpenChange"]);
+    };
+  }
+});
+const _sfc_main$2 = /* @__PURE__ */ defineComponent({
+  ...{ name: "ActionSheetAction", inheritAttrs: false },
+  __name: "ActionSheetAction",
+  props: {
+    isDestructive: { type: Boolean, default: false }
+  },
+  emits: ["select"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    const context = useActionSheetContext();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn(
+        "flex h-12 w-full items-center justify-center bg-card px-4 text-base font-medium transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+        props.isDestructive ? "text-destructive" : "text-foreground",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      emit("select");
+      context.setOpen(false);
+    }
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", mergeProps({
+        ref_key: "el",
+        ref: el,
+        type: "button"
+      }, rest.value, {
+        class: classes.value,
+        onClick: handleClick
+      }), [
+        renderSlot(_ctx.$slots, "default")
+      ], 16);
+    };
+  }
+});
+const _sfc_main$1 = /* @__PURE__ */ defineComponent({
+  ...{ name: "ActionSheetCancel", inheritAttrs: false },
+  __name: "ActionSheetCancel",
+  setup(__props, { expose: __expose }) {
+    const attrs = useAttrs();
+    const context = useActionSheetContext();
+    const el = useTemplateRef("el");
+    const classes = computed(
+      () => cn(
+        "mt-2 flex h-12 w-full items-center justify-center rounded-lg bg-card text-base font-semibold text-foreground shadow-sm transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, ...others } = attrs;
+      return others;
+    });
+    function handleClick(event) {
+      if (event.defaultPrevented) return;
+      context.setOpen(false);
+    }
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("button", mergeProps({
+        ref_key: "el",
+        ref: el,
+        type: "button"
+      }, rest.value, {
+        class: classes.value,
+        onClick: handleClick
+      }), [
+        renderSlot(_ctx.$slots, "default", {}, () => [
+          _cache[0] || (_cache[0] = createTextVNode("Cancel", -1))
+        ])
+      ], 16);
+    };
+  }
+});
+const _hoisted_1 = ["aria-valuenow", "aria-valuemax"];
+const _hoisted_2 = { class: "flex-1 overflow-y-auto px-4 pb-4" };
+const bottomSheetContextKey = Symbol(
+  "wow-two.bottomSheet"
+);
+function useBottomSheet() {
+  const context = inject(bottomSheetContextKey, null);
+  if (!context) throw new Error("useBottomSheet must be used inside <BottomSheet>");
+  return context;
+}
+function resolveSnapPx(point, viewport) {
+  if (typeof point === "number") return point;
+  const trimmed = point.trim();
+  if (trimmed.endsWith("vh")) return parseFloat(trimmed) / 100 * viewport;
+  if (trimmed.endsWith("px")) return parseFloat(trimmed);
+  if (trimmed.endsWith("%")) return parseFloat(trimmed) / 100 * viewport;
+  const n = parseFloat(trimmed);
+  return Number.isFinite(n) ? n : 0;
+}
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...{ name: "BottomSheet", inheritAttrs: false },
+  __name: "BottomSheet",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    isOpen: { type: Boolean, default: void 0 },
+    defaultOpen: { type: Boolean, default: false },
+    snapPoints: { default: () => ["40vh", "90vh"] },
+    initialSnap: { default: 0 },
+    dismissOnOutsideClick: { type: Boolean, default: true },
+    dismissOnEscape: { type: Boolean, default: true },
+    dragToDismiss: { type: Boolean, default: true },
+    variant: {},
+    tone: {},
+    radius: {},
+    padding: {},
+    elevation: {}
+  },
+  emits: ["update:open", "open-change"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const attrs = useAttrs();
+    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);
+      }
+    });
+    const resolvedOpen = controlled.value;
+    const currentSnap = ref(Math.min(props.initialSnap, props.snapPoints.length - 1));
+    const dragHeight = shallowRef(null);
+    const titleId = useId("bottom-sheet-title");
+    const descriptionId = useId("bottom-sheet-description");
+    const panel = useTemplateRef("panel");
+    const handle = useTemplateRef("handle");
+    let startY = null;
+    let startHeight = 0;
+    watch(
+      () => [resolvedOpen.value, props.initialSnap, props.snapPoints.length],
+      () => {
+        if (resolvedOpen.value)
+          currentSnap.value = Math.min(props.initialSnap, props.snapPoints.length - 1);
+      }
+    );
+    provide(bottomSheetContextKey, {
+      open: resolvedOpen,
+      setOpen: controlled.setValue,
+      currentSnap,
+      setCurrentSnap: (index) => {
+        currentSnap.value = index;
+      },
+      snapPoints: computed(() => props.snapPoints)
+    });
+    provide(overlayChromeContextKey, {
+      titleId,
+      descriptionId,
+      close: () => controlled.setValue(false)
+    });
+    function panelEl() {
+      return toHtmlElement(panel.value?.$el);
+    }
+    function handlePointerDown(event) {
+      startY = event.clientY;
+      const rect = panelEl()?.getBoundingClientRect();
+      startHeight = rect ? rect.height : 0;
+      event.currentTarget.setPointerCapture(event.pointerId);
+    }
+    function handlePointerMove(event) {
+      if (startY === null) return;
+      const dy = event.clientY - startY;
+      dragHeight.value = Math.max(0, startHeight - dy);
+    }
+    function handlePointerUp(event) {
+      if (startY === null) return;
+      startY = null;
+      event.currentTarget.releasePointerCapture?.(event.pointerId);
+      const viewport = typeof window !== "undefined" ? window.innerHeight : 800;
+      const heights = props.snapPoints.map((point) => resolveSnapPx(point, viewport));
+      const liveHeight = dragHeight.value ?? heights[currentSnap.value] ?? 0;
+      dragHeight.value = null;
+      if (props.dragToDismiss && liveHeight < (heights[0] ?? 0) - 60) {
+        controlled.setValue(false);
+        return;
+      }
+      let bestIdx = 0;
+      let bestDist = Number.POSITIVE_INFINITY;
+      heights.forEach((height, index) => {
+        const distance = Math.abs(height - liveHeight);
+        if (distance < bestDist) {
+          bestDist = distance;
+          bestIdx = index;
+        }
+      });
+      currentSnap.value = bestIdx;
+    }
+    function handleKeyDown(event) {
+      if (event.key === "ArrowUp" && currentSnap.value < props.snapPoints.length - 1) {
+        event.preventDefault();
+        currentSnap.value += 1;
+      } else if (event.key === "ArrowDown") {
+        event.preventDefault();
+        if (currentSnap.value > 0) currentSnap.value -= 1;
+        else if (props.dragToDismiss) controlled.setValue(false);
+      }
+    }
+    function handleMountAutoFocus(event) {
+      event.preventDefault();
+      handle.value?.focus();
+    }
+    function handleBackdropClick() {
+      if (props.dismissOnOutsideClick) controlled.setValue(false);
+    }
+    function handleEscape() {
+      controlled.setValue(false);
+    }
+    const heightStyle = computed(() => {
+      if (dragHeight.value !== null) return `${dragHeight.value}px`;
+      const point = props.snapPoints[currentSnap.value];
+      if (typeof point === "number") return `${point}px`;
+      return point ?? "40vh";
+    });
+    const panelStyle = computed(
+      () => normalizeStyle([
+        {
+          height: heightStyle.value,
+          transition: dragHeight.value === null ? "height 220ms ease-out, transform var(--duration-base) var(--ease-out)" : "none"
+        },
+        attrs.style
+      ])
+    );
+    const classes = computed(
+      () => cn(
+        "fixed inset-x-0 bottom-0 z-modal flex flex-col rounded-t-xl border-t outline-none",
+        "will-change-transform",
+        "motion-safe:data-[state=closed]:translate-y-full",
+        "motion-reduce:translate-y-0",
+        surfaceVariants({
+          variant: props.variant ?? "elevated",
+          tone: props.tone,
+          radius: props.radius ?? "none",
+          padding: props.padding ?? "none",
+          elevation: props.elevation ?? 5
+        }),
+        attrs.class
+      )
+    );
+    const rest = computed(() => {
+      const { class: _class, style: _style, ...others } = attrs;
+      return others;
+    });
+    const el = computed(() => panelEl());
+    __expose({ el });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(unref(_sfc_main$o), null, {
+        default: withCtx(() => [
+          createVNode(unref(_sfc_main$s), { "is-enabled": unref(resolvedOpen) }, {
+            default: withCtx(() => [
+              createVNode(_sfc_main$t, {
+                "is-inline": "",
+                "is-open": unref(resolvedOpen),
+                onClick: handleBackdropClick
+              }, null, 8, ["is-open"]),
+              createVNode(unref(Presence), { "is-present": unref(resolvedOpen) }, {
+                default: withCtx(() => [
+                  createVNode(unref(_sfc_main$u), {
+                    "as-child": "",
+                    trapped: "",
+                    loop: "",
+                    "on-mount-auto-focus": handleMountAutoFocus
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(_sfc_main$v), mergeProps({
+                        ref_key: "panel",
+                        ref: panel,
+                        "is-escape-disabled": !props.dismissOnEscape,
+                        "is-outside-click-disabled": "",
+                        "on-escape": handleEscape,
+                        role: "dialog",
+                        "aria-modal": "true",
+                        "aria-labelledby": unref(titleId),
+                        "aria-describedby": unref(descriptionId),
+                        style: panelStyle.value
+                      }, rest.value, { class: classes.value }), {
+                        default: withCtx(() => [
+                          createElementVNode("div", {
+                            ref_key: "handle",
+                            ref: handle,
+                            role: "separator",
+                            "aria-orientation": "horizontal",
+                            "aria-valuenow": currentSnap.value,
+                            "aria-valuemin": 0,
+                            "aria-valuemax": props.snapPoints.length - 1,
+                            tabindex: "0",
+                            class: "flex h-7 cursor-ns-resize items-center justify-center focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+                            onPointerdown: handlePointerDown,
+                            onPointermove: handlePointerMove,
+                            onPointerup: handlePointerUp,
+                            onPointercancel: handlePointerUp,
+                            onKeydown: handleKeyDown
+                          }, [..._cache[0] || (_cache[0] = [
+                            createElementVNode("span", {
+                              class: "h-1 w-10 rounded-full bg-border-strong",
+                              "aria-hidden": "true"
+                            }, null, -1)
+                          ])], 40, _hoisted_1),
+                          createElementVNode("div", _hoisted_2, [
+                            renderSlot(_ctx.$slots, "default")
+                          ])
+                        ]),
+                        _: 3
+                      }, 16, ["is-escape-disabled", "aria-labelledby", "aria-describedby", "style", "class"])
+                    ]),
+                    _: 3
+                  })
+                ]),
+                _: 3
+              }, 8, ["is-present"])
+            ]),
+            _: 3
+          }, 8, ["is-enabled"])
+        ]),
+        _: 3
+      });
+    };
+  }
+});
+export {
+  _sfc_main$3 as _,
+  _sfc_main$2 as a,
+  _sfc_main$1 as b,
+  _sfc_main$d as c,
+  _sfc_main$b as d,
+  _sfc_main$a as e,
+  _sfc_main$c as f,
+  _sfc_main as g,
+  _sfc_main$h as h,
+  _sfc_main$i as i,
+  _sfc_main$g as j,
+  _sfc_main$e as k,
+  _sfc_main$f as l,
+  _sfc_main$j as m,
+  _sfc_main$k as n,
+  _sfc_main$9 as o,
+  _sfc_main$7 as p,
+  _sfc_main$4 as q,
+  _sfc_main$5 as r,
+  _sfc_main$6 as s,
+  _sfc_main$8 as t,
+  useBottomSheet as u
+};
+//# sourceMappingURL=BottomSheet.vue_vue_type_script_setup_true_lang-CmNoI4BE.js.map