vlite3 1.2.4 → 1.2.7

package/components/{CopyButton.vue.js → Clipboard.vue.js}

@@ -1,61 +1,61 @@
-import { defineComponent as f, ref as p, computed as l, openBlock as m, createBlock as x, normalizeClass as T, withCtx as y, renderSlot as v, createCommentVNode as I } from "vue";
+import { defineComponent as f, ref as p, computed as i, openBlock as m, createBlock as x, normalizeClass as T, withCtx as v, renderSlot as y, createCommentVNode as I } from "vue";
 import C from "./Button.vue.js";
-import { $t as r } from "../utils/i18n.js";
-const z = /* @__PURE__ */ f({
-  __name: "CopyButton",
+import { $t as d } from "../utils/i18n.js";
+const w = /* @__PURE__ */ f({
+  __name: "Clipboard",
   props: {
     textToCopy: {},
     variant: { default: "outline" },
     size: { default: "md" },
-    rounded: {},
+    rounded: { default: "full" },
     class: {},
     disabled: { type: Boolean },
     defaultIcon: { default: "lucide:copy" },
     copiedIcon: { default: "lucide:check" },
     defaultText: {},
     copiedText: {},
-    defaultTextI18n: { default: "vlite.copyButton.copy" },
-    copiedTextI18n: { default: "vlite.copyButton.copied" },
+    defaultTextI18n: { default: "vlite.clipboard.copy" },
+    copiedTextI18n: { default: "vlite.clipboard.copied" },
     asIcon: { type: Boolean, default: !1 }
   },
   emits: ["copy", "error"],
-  setup(o, { emit: d }) {
-    const e = o, c = d, a = p(!1);
+  setup(o, { emit: r }) {
+    const e = o, l = r, a = p(!1);
     let n = null;
-    const u = l(() => a.value ? e.copiedIcon : e.defaultIcon), i = l(() => {
+    const u = i(() => a.value ? e.copiedIcon : e.defaultIcon), c = i(() => {
       if (!e.asIcon)
         if (a.value) {
           if (e.copiedText) return e.copiedText;
-          const t = r(e.copiedTextI18n);
+          const t = d(e.copiedTextI18n);
           return t !== e.copiedTextI18n ? t : "Copied";
         } else {
           if (e.defaultText) return e.defaultText;
-          const t = r(e.defaultTextI18n);
+          const t = d(e.defaultTextI18n);
           return t !== e.defaultTextI18n ? t : "Copy";
         }
     }), s = async () => {
       if (!e.disabled)
         try {
-          await navigator.clipboard.writeText(e.textToCopy), a.value = !0, c("copy", e.textToCopy), n && clearTimeout(n), n = setTimeout(() => {
+          await navigator.clipboard.writeText(e.textToCopy), a.value = !0, l("copy", e.textToCopy), n && clearTimeout(n), n = setTimeout(() => {
             a.value = !1;
           }, 500);
         } catch (t) {
-          c("error", t instanceof Error ? t : new Error("Copy failed"));
+          l("error", t instanceof Error ? t : new Error("Copy failed"));
         }
     };
-    return (t, B) => (m(), x(C, {
+    return (t, b) => (m(), x(C, {
       variant: o.variant,
       size: o.size,
       rounded: o.rounded,
       class: T(e.class),
       disabled: o.disabled,
       icon: u.value,
-      text: i.value,
+      text: c.value,
       "as-icon": o.asIcon,
       onClick: s
     }, {
-      default: y(() => [
-        !o.asIcon && !i.value ? v(t.$slots, "default", {
+      default: v(() => [
+        !o.asIcon && !c.value ? y(t.$slots, "default", {
           key: 0,
           copied: a.value
         }) : I("", !0)
@@ -65,5 +65,5 @@ const z = /* @__PURE__ */ f({
   }
 });
 export {
-  z as default
+  w as default
 };

package/components/Clipboard.vue2.js

@@ -0,0 +1,4 @@
+import f from "./Clipboard.vue.js";
+export {
+  f as default
+};

package/components/ColorPicker/ColorPicker.vue.js

@@ -11,7 +11,7 @@ import E from "./ColorIro.vue.js";
 import { useEyeDropper as P } from "@vueuse/core";
 const I = {
   key: 0,
-  class: "p-2 w-max flex flex-col justify-center"
+  class: "p-1 w-max flex flex-col justify-center"
 }, N = {
   key: 0,
   class: "flex items-center gap-1.5 w-full"

package/components/CommandPalette/CommandPaletteContent.vue2.js

@@ -4,7 +4,7 @@ import k from "../Icon.vue.js";
 import { $t as E } from "../../utils/i18n.js";
 import { useCommandPaletteItems as Y } from "./useCommandPaletteItems.js";
 import { useCommandPaletteNav as Z } from "./useCommandPaletteNav.js";
-import ee from "./CommandPaletteItem.vue2.js";
+import ee from "./CommandPaletteItem.vue.js";
 const te = { class: "command-palette-content flex flex-col w-full h-full max-h-[70vh]" }, oe = { class: "flex items-center gap-3 px-4 py-3 border-b border-border/80 shrink-0" }, se = ["placeholder"], ne = ["aria-label"], re = {
   key: 0,
   class: "flex flex-col items-center justify-center py-14 px-6 text-center select-none",

package/components/CommandPalette/{CommandPaletteItem.vue2.js → CommandPaletteItem.vue.js}

@@ -1,5 +1,5 @@
 import t from "./CommandPaletteItem.vue3.js";
-/* empty css                       */
+/* empty css                        */
 import o from "../../_virtual/_plugin-vue_export-helper.js";
 const r = /* @__PURE__ */ o(t, [["__scopeId", "data-v-66b1ae06"]]);
 export {

package/components/DataTable/DataTableHeader.vue.js

@@ -1,10 +1,10 @@
-import { defineComponent as x, computed as r, openBlock as l, createElementBlock as n, normalizeClass as o, createElementVNode as s, toDisplayString as y, createVNode as b, createCommentVNode as v } from "vue";
-import C from "../Icon.vue.js";
-import { $t as w } from "../../utils/i18n.js";
-const B = { class: "text-xs font-bold! uppercase tracking-wider text-gray-900 truncate" }, S = {
+import { defineComponent as y, computed as t, openBlock as s, createElementBlock as i, normalizeClass as a, createElementVNode as c, toDisplayString as v, createVNode as C, createCommentVNode as b } from "vue";
+import w from "../Icon.vue.js";
+import { $t as B } from "../../utils/i18n.js";
+const _ = { class: "text-xs font-bold! uppercase tracking-wider text-gray-900 truncate" }, k = {
   key: 0,
   class: "w-4 h-4 shrink-0"
-}, I = /* @__PURE__ */ x({
+}, j = /* @__PURE__ */ y({
   __name: "DataTableHeader",
   props: {
     header: {},
@@ -15,43 +15,46 @@ const B = { class: "text-xs font-bold! uppercase tracking-wider text-gray-900 tr
     cellBordered: { type: Boolean }
   },
   emits: ["sort"],
-  setup(t, { emit: i }) {
-    const e = t, d = i, a = r(() => e.header.sortKey || e.header.field), c = r(
-      () => e.sortConfig?.field === a.value && e.sortConfig?.order
-    ), u = r(() => !e.sortConfig || e.sortConfig.field !== a.value ? "lucide:chevrons-up-down" : e.sortConfig.order === "asc" ? "lucide:arrow-up" : e.sortConfig.order === "desc" ? "lucide:arrow-down" : "lucide:chevrons-up-down"), f = () => {
-      e.tableSortable && e.header.sortable !== !1 && d("sort", e.header.field);
-    }, p = r(() => ({
+  setup(l, { emit: d }) {
+    const e = l, u = d, n = t(() => e.header.sortKey || e.header.field), f = t(
+      () => e.sortConfig?.field === n.value && e.sortConfig?.order
+    ), p = t(() => !e.sortConfig || e.sortConfig.field !== n.value ? "lucide:chevrons-up-down" : e.sortConfig.order === "asc" ? "lucide:arrow-up" : e.sortConfig.order === "desc" ? "lucide:arrow-down" : "lucide:chevrons-up-down"), r = t(() => {
+      const o = !!e.header.title || !!e.header.titleI18n;
+      return e.tableSortable && e.header.sortable !== !1 && o;
+    }), h = () => {
+      r.value && u("sort", e.header.field);
+    }, m = t(() => ({
       left: "justify-start text-left",
       center: "justify-center text-center",
       right: "justify-end text-right"
-    })[e.header.align || "left"]), h = r(
-      () => e.header.titleI18n ? w(e.header.titleI18n) : e.header.title
-    ), m = r(() => e.size === "xs" || e.compact ? `py-1.5! ${e.cellBordered ? "px-3!" : ""}` : e.size === "sm" ? `py-2! ${e.cellBordered ? "px-3!" : ""}` : e.size === "lg" ? `py-4! ${e.cellBordered ? "px-4!" : ""}` : `py-3! ${e.cellBordered ? "px-3.5!" : ""}`);
-    return (g, k) => (l(), n("th", {
+    })[e.header.align || "left"]), g = t(
+      () => e.header.titleI18n ? B(e.header.titleI18n) : e.header.title
+    ), x = t(() => e.size === "xs" || e.compact ? `py-1.5! ${e.cellBordered ? "px-3!" : ""}` : e.size === "sm" ? `py-2! ${e.cellBordered ? "px-3!" : ""}` : e.size === "lg" ? `py-4! ${e.cellBordered ? "px-4!" : ""}` : `py-3! ${e.cellBordered ? "px-3.5!" : ""}`);
+    return (o, S) => (s(), i("th", {
       scope: "col",
-      class: o(["group/th px-3 text-left align-middle font-medium text-muted-foreground transition-colors [&:has([role=checkbox])]:pr-0 overflow-hidden max-w-[400px]", [
-        m.value,
-        t.header.sortable !== !1 && t.tableSortable ? "cursor-pointer hover:bg-muted/50" : "",
-        t.header.hideOnMobile ? "hidden md:table-cell" : ""
+      class: a(["group/th px-3 text-left align-middle font-medium text-muted-foreground transition-colors [&:has([role=checkbox])]:pr-0 overflow-hidden max-w-[400px]", [
+        x.value,
+        r.value ? "cursor-pointer hover:bg-muted/50" : "",
+        l.header.hideOnMobile ? "hidden md:table-cell" : ""
       ]]),
-      onClick: f
+      onClick: h
     }, [
-      s("div", {
-        class: o(["flex items-center gap-2 space-x-2", p.value])
+      c("div", {
+        class: a(["flex items-center gap-2 space-x-2", m.value])
       }, [
-        s("span", B, y(h.value), 1),
-        t.tableSortable && t.header.sortable !== !1 ? (l(), n("span", S, [
-          b(C, {
-            icon: u.value,
-            class: o(["w-3.5 h-3.5 transition-all text-muted-foreground mt-0.5", [
-              c.value ? "opacity-100 text-foreground" : "opacity-0 group-hover/th:opacity-100"
+        c("span", _, v(g.value), 1),
+        r.value ? (s(), i("span", k, [
+          C(w, {
+            icon: p.value,
+            class: a(["w-3.5 h-3.5 transition-all text-muted-foreground mt-0.5", [
+              f.value ? "opacity-100 text-foreground" : "opacity-0 group-hover/th:opacity-100"
             ]])
           }, null, 8, ["icon", "class"])
-        ])) : v("", !0)
+        ])) : b("", !0)
       ], 2)
     ], 2));
   }
 });
 export {
-  I as default
+  j as default
 };

package/components/DataTable/types.d.ts

@@ -18,7 +18,7 @@ export interface FilterConfig {
 }
 export interface TableFilter {
     pagination: PaginationConfig;
-    sort: SortConfig;
+    sort?: SortConfig;
     filter: FilterConfig;
 }
 export interface TableHeader {

package/components/ImageComparison/ImageComparison.vue.d.ts

@@ -0,0 +1,29 @@
+type __VLS_Props = {
+    beforeImage: string;
+    afterImage: string;
+    beforeLabel?: string;
+    afterLabel?: string;
+    initialPosition?: number;
+    hover?: boolean;
+    width?: string | number;
+    height?: string | number;
+    containerClass?: string;
+    handleClass?: string;
+    showHandle?: boolean;
+    variant?: 'one' | 'two';
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {
+    width: string | number;
+    height: string | number;
+    variant: "one" | "two";
+    containerClass: string;
+    hover: boolean;
+    beforeLabel: string;
+    afterLabel: string;
+    initialPosition: number;
+    handleClass: string;
+    showHandle: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    containerRef: HTMLDivElement;
+}, HTMLDivElement>;
+export default _default;

package/components/ImageComparison/ImageComparison.vue.js

@@ -0,0 +1,126 @@
+import { defineComponent as k, ref as w, onMounted as C, onUnmounted as E, computed as M, openBlock as a, createElementBlock as i, normalizeStyle as b, normalizeClass as s, createElementVNode as n, toDisplayString as v, createCommentVNode as r, setBlockTracking as p, createVNode as B } from "vue";
+import X from "../Icon.vue.js";
+const z = ["src"], I = ["src"], j = {
+  key: 0,
+  class: "absolute top-4 flex w-full justify-center pointer-events-none"
+}, D = { class: "bg-[#4846468d] backdrop-blur-sm px-3 py-1 rounded-full -text-fs-3 font-medium text-[white] whitespace-nowrap" }, P = { class: "bg-[#4846468d] backdrop-blur-sm px-3 py-1 rounded-full -text-fs-3 font-medium text-[white] whitespace-nowrap" }, R = /* @__PURE__ */ k({
+  __name: "ImageComparison",
+  props: {
+    beforeImage: {},
+    afterImage: {},
+    beforeLabel: { default: "Before" },
+    afterLabel: { default: "After" },
+    initialPosition: { default: 50 },
+    hover: { type: Boolean, default: !1 },
+    width: { default: "100%" },
+    height: { default: "auto" },
+    containerClass: { default: "" },
+    handleClass: { default: "" },
+    showHandle: { type: Boolean, default: !0 },
+    variant: { default: "one" }
+  },
+  setup(o) {
+    const u = o, l = w(u.initialPosition), c = w(!1), h = w(null), m = (e) => {
+      if (!h.value) return;
+      const t = h.value.getBoundingClientRect(), L = (e - t.left) / t.width * 100;
+      l.value = Math.max(0, Math.min(100, L));
+    }, y = (e) => {
+      u.hover && !c.value && m(e.clientX);
+    }, g = (e) => {
+      c.value = !0;
+      const t = "touches" in e ? e.touches[0].clientX : e.clientX;
+      m(t);
+    }, d = (e) => {
+      if (!c.value) return;
+      "touches" in e && e.cancelable && e.preventDefault();
+      const t = "touches" in e ? e.touches[0].clientX : e.clientX;
+      m(t);
+    }, f = () => {
+      c.value = !1;
+    };
+    C(() => {
+      window.addEventListener("mousemove", d), window.addEventListener("touchmove", d, { passive: !1 }), window.addEventListener("mouseup", f), window.addEventListener("touchend", f);
+    }), E(() => {
+      window.removeEventListener("mousemove", d), window.removeEventListener("touchmove", d), window.removeEventListener("mouseup", f), window.removeEventListener("touchend", f);
+    });
+    const x = M(() => {
+      const e = (t) => typeof t == "number" ? `${t}px` : t;
+      return {
+        width: e(u.width),
+        height: e(u.height)
+      };
+    });
+    return (e, t) => (a(), i("div", {
+      ref_key: "containerRef",
+      ref: h,
+      class: s(["relative overflow-hidden select-none cursor-ew-resize rounded-2xl group", o.containerClass]),
+      style: b(x.value),
+      onMousemove: y,
+      onMousedown: g,
+      onTouchstartPassive: g
+    }, [
+      n("img", {
+        src: o.afterImage,
+        class: s(["block w-full object-cover select-none", u.height === "auto" ? "h-auto" : "h-full"]),
+        alt: "After",
+        draggable: "false"
+      }, null, 10, z),
+      o.afterLabel && o.variant === "one" ? (a(), i("div", {
+        key: 0,
+        class: s(["absolute top-4 right-4 bg-[#4846468d] px-3 py-1 -text-fs-4 rounded-full -text-fs-3 font-medium text-[white] transition-opacity duration-300 pointer-events-none", l.value > 80 ? "opacity-0" : "opacity-100"])
+      }, v(o.afterLabel), 3)) : r("", !0),
+      n("div", {
+        class: "absolute inset-0 w-full h-full",
+        style: b({ clipPath: `inset(0 ${100 - l.value}% 0 0)`, willChange: "clip-path" })
+      }, [
+        n("img", {
+          src: o.beforeImage,
+          class: "absolute inset-0 w-full h-full object-cover select-none",
+          alt: "Before",
+          draggable: "false"
+        }, null, 8, I)
+      ], 4),
+      o.beforeLabel && o.variant === "one" ? (a(), i("div", {
+        key: 1,
+        class: s(["absolute top-4 left-4 bg-[#4846468d] px-3 py-1 -text-fs-4 rounded-full -text-fs-3 font-medium text-[white] transition-opacity duration-300 pointer-events-none z-10", l.value < 20 ? "opacity-0" : "opacity-100"])
+      }, v(o.beforeLabel), 3)) : r("", !0),
+      n("div", {
+        class: "absolute top-0 bottom-0 flex flex-col items-center justify-center cursor-ew-resize z-20 pointer-events-none",
+        style: b({
+          left: `${l.value}%`,
+          transform: "translateX(-50%)",
+          willChange: "transform"
+        })
+      }, [
+        o.variant === "two" ? (a(), i("div", j, [
+          o.beforeLabel ? (a(), i("div", {
+            key: 0,
+            class: s(["absolute right-full pr-3 transition-opacity duration-300", l.value < 23 ? "opacity-0" : "opacity-100"])
+          }, [
+            n("div", D, v(o.beforeLabel), 1)
+          ], 2)) : r("", !0),
+          o.afterLabel ? (a(), i("div", {
+            key: 1,
+            class: s(["absolute left-full pl-3 transition-opacity duration-300", l.value > 78 ? "opacity-0" : "opacity-100"])
+          }, [
+            n("div", P, v(o.afterLabel), 1)
+          ], 2)) : r("", !0)
+        ])) : r("", !0),
+        t[1] || (t[1] = n("div", { class: "w-px h-full bg-[white]" }, null, -1)),
+        o.showHandle ? (a(), i("div", {
+          key: 1,
+          class: s(["w-7 h-7 border-[1.5px] border-[white] rounded-full flex-shrink-0 flex items-center justify-center transform transition-all duration-200", [c.value ? "scale-110 " : "group-hover:scale-105", o.handleClass]])
+        }, [
+          t[0] || (p(-1, !0), (t[0] = B(X, {
+            icon: "lucide:chevrons-left-right",
+            class: "w-4 h-4 text-[white]"
+          })).cacheIndex = 0, p(1), t[0])
+        ], 2)) : r("", !0),
+        t[2] || (t[2] = n("div", { class: "w-px h-full bg-[white]" }, null, -1))
+      ], 4)
+    ], 38));
+  }
+});
+export {
+  R as default
+};

package/components/ImageComparison/ImageComparison.vue2.js

@@ -0,0 +1,4 @@
+import f from "./ImageComparison.vue.js";
+export {
+  f as default
+};

package/components/ImageComparison/index.d.ts

@@ -0,0 +1 @@
+export { default as ImageComparison } from './ImageComparison.vue';

package/components/ImportData/ImportData.vue.js

@@ -159,7 +159,7 @@ const xe = { class: "px-2" }, ye = { class: "min-h-[300px]" }, De = {
           ue(pe(fe), {
             steps: Y.value,
             "active-step": a.value - 1,
-            class: "mb-13"
+            class: "mb-8"
           }, null, 8, ["steps", "active-step"]),
           B("div", ye, [
             a.value === 1 ? (n(), d(he, {

package/components/Modal.vue.js

@@ -1,7 +1,7 @@
 import o from "./Modal.vue2.js";
 /* empty css           */
 import t from "../_virtual/_plugin-vue_export-helper.js";
-const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-350b61e5"]]);
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-b47509d4"]]);
 export {
   p as default
 };

package/components/Modal.vue2.js

@@ -1,14 +1,14 @@
-import { defineComponent as P, ref as f, inject as R, computed as h, markRaw as V, watch as T, provide as W, nextTick as K, onMounted as L, onUnmounted as A, openBlock as s, createElementBlock as d, Fragment as U, mergeProps as B, withModifiers as S, renderSlot as v, createCommentVNode as n, createBlock as I, Teleport as q, normalizeClass as i, createElementVNode as b, toDisplayString as z, createVNode as G, resolveDynamicComponent as H } from "vue";
-import J from "./Button.vue.js";
-import { useKeyStroke as Q } from "../composables/useKeyStroke.js";
-import { $t as F } from "../utils/i18n.js";
-const X = ["data-testid"], Y = ["data-testid"], Z = {
+import { defineComponent as R, ref as f, inject as V, computed as p, markRaw as W, watch as T, provide as K, nextTick as L, onMounted as A, onUnmounted as U, openBlock as s, createElementBlock as a, Fragment as q, mergeProps as B, withModifiers as S, renderSlot as v, createCommentVNode as r, createBlock as I, Teleport as G, normalizeClass as i, createVNode as z, Transition as H, withCtx as J, createElementVNode as h, toDisplayString as F, resolveDynamicComponent as Q } from "vue";
+import X from "./Button.vue.js";
+import { useKeyStroke as Y } from "../composables/useKeyStroke.js";
+import { $t as O } from "../utils/i18n.js";
+const Z = ["data-testid"], _ = ["data-testid"], ee = {
   key: 0,
   class: "flex-none flex flex-col space-y-1.5 pb-0 border-b border-border/90"
-}, _ = { class: "text-lg font-semibold leading-none tracking-tight" }, ee = {
+}, te = { class: "text-lg font-semibold leading-none tracking-tight" }, oe = {
   key: 0,
   class: "text-sm text-muted-foreground mb-3.5"
-}, ae = /* @__PURE__ */ P({
+}, de = /* @__PURE__ */ R({
   inheritAttrs: !1,
   __name: "Modal",
   props: {
@@ -28,113 +28,119 @@ const X = ["data-testid"], Y = ["data-testid"], Z = {
     bodyProps: {}
   },
   emits: ["close", "update:show", "onOpen"],
-  setup(t, { emit: O }) {
-    const o = t, u = O, l = f(o.show), k = f(!1), g = f(!1), C = f(null);
+  setup(o, { emit: j }) {
+    const t = o, u = j, l = f(t.show), k = f(!1), b = f(!1), C = f(null);
     let c = null;
-    const y = f(!1), a = R("dropdown-context", null), w = h(() => o.body ? V(o.body) : void 0);
+    const g = f(!1), d = V("dropdown-context", null), w = p(() => t.body ? W(t.body) : void 0);
     T(
-      () => o.show,
+      () => t.show,
       (e) => {
-        l.value = e, e && (u("onOpen"), a?.close());
+        l.value = e, e && (u("onOpen"), d?.close());
       }
     );
-    const j = () => {
-      l.value = !0, a?.close();
-    }, D = (e) => {
-      k.value = e;
+    const D = () => {
+      l.value = !0, d?.close();
     }, E = (e) => {
-      y.value = e;
+      k.value = e;
+    }, M = (e) => {
+      g.value = e;
     }, m = () => {
       if (k.value) {
-        g.value = !0, c && clearTimeout(c), c = setTimeout(() => {
-          g.value = !1;
+        b.value = !0, c && clearTimeout(c), c = setTimeout(() => {
+          b.value = !1;
         }, 1e3);
         return;
       }
       l.value = !1, u("update:show", !1), u("close");
-    }, p = () => {
+    }, y = () => {
       l.value = !1, u("update:show", !1), u("close");
     };
-    W("modal-context", { close: m, setSubmitting: D, registerFormFooter: E });
-    const M = () => {
-      o.closeOutside && m();
-    }, { onKeyStroke: N } = Q();
-    N("Escape", m), T(l, async (e) => {
-      e ? (a?.onChildToggle?.(!0), document.body.style.overflow = "hidden", await K(), C.value?.focus()) : (document.body.style.overflow = "", a?.onChildToggle?.(!1), y.value = !1);
-    }), L(() => {
-      l.value && a?.onChildToggle?.(!0);
+    K("modal-context", { close: m, setSubmitting: E, registerFormFooter: M });
+    const N = () => {
+      t.closeOutside && m();
+    }, { onKeyStroke: P } = Y();
+    P("Escape", m), T(l, async (e) => {
+      e ? (d?.onChildToggle?.(!0), document.body.style.overflow = "hidden", await L(), C.value?.focus()) : (document.body.style.overflow = "", d?.onChildToggle?.(!1), g.value = !1);
     }), A(() => {
-      l.value && a?.onChildToggle?.(!1), document.body.style.overflow = "", c && clearTimeout(c);
+      l.value && d?.onChildToggle?.(!0);
+    }), U(() => {
+      l.value && d?.onChildToggle?.(!1), document.body.style.overflow = "", c && clearTimeout(c);
     });
-    const r = h(() => o.titleI18n ? F(o.titleI18n) : o.title), x = h(
-      () => o.descriptionI18n ? F(o.descriptionI18n) : o.description
+    const n = p(() => t.titleI18n ? O(t.titleI18n) : t.title), x = p(
+      () => t.descriptionI18n ? O(t.descriptionI18n) : t.description
     );
-    return (e, $) => (s(), d(U, null, [
-      e.$slots?.trigger || e.$slots?.default ? (s(), d("span", B({
+    return (e, $) => (s(), a(q, null, [
+      e.$slots?.trigger || e.$slots?.default ? (s(), a("span", B({
         key: 0,
-        onClick: S(j, ["stop"]),
-        class: `${t.triggerClass}`
+        onClick: S(D, ["stop"]),
+        class: `${o.triggerClass}`
       }, e.$attrs, {
-        "data-testid": e.$attrs["data-testid"] ? `${e.$attrs["data-testid"]}-trigger` : r.value ? `modal-trigger-${r.value.toString().toLowerCase().replace(/[^a-z0-9]+/g, "-")}` : "modal-trigger"
+        "data-testid": e.$attrs["data-testid"] ? `${e.$attrs["data-testid"]}-trigger` : n.value ? `modal-trigger-${n.value.toString().toLowerCase().replace(/[^a-z0-9]+/g, "-")}` : "modal-trigger"
       }), [
         v(e.$slots, "trigger", {}, () => [
-          t.body ? v(e.$slots, "default", { key: 0 }, void 0, !0) : n("", !0)
+          o.body ? v(e.$slots, "default", { key: 0 }, void 0, !0) : r("", !0)
         ], !0)
-      ], 16, X)) : n("", !0),
-      (s(), I(q, { to: "body" }, [
-        l.value ? (s(), d("div", {
+      ], 16, Z)) : r("", !0),
+      (s(), I(G, { to: "body" }, [
+        l.value ? (s(), a("div", {
           key: 0,
-          class: i(["fixed inset-0 z-50 flex items-center justify-center p-4 v-modal-overlay", t.backdrop ? "v-modal-backdrop" : ""]),
-          onClick: M
+          class: i(["fixed inset-0 z-50 flex items-center justify-center p-4 v-modal-overlay", o.backdrop ? "v-modal-backdrop" : ""]),
+          onClick: N
         }, [
-          b("div", {
-            ref_key: "modalRef",
-            ref: C,
-            tabindex: "-1",
-            role: "dialog",
-            "aria-modal": "true",
-            class: i(["modal-body relative w-full rounded border border-border/60 bg-body shadow-lg text-foreground flex flex-col max-h-[85vh] sm:max-h-[90vh] focus:outline-none", [t.maxWidth]]),
-            "data-testid": e.$attrs["data-testid"] || (r.value ? `modal-${r.value.toString().toLowerCase().replace(/[^a-z0-9]+/g, "-")}` : "modal"),
-            onClick: $[0] || ($[0] = S(() => {
-            }, ["stop"]))
-          }, [
-            r.value ? (s(), d("div", Z, [
-              b("div", {
-                class: i(["flex items-center justify-between py-2 px-4 rounded-t-md", t.headerClass])
+          z(H, { name: "modal-dialog" }, {
+            default: J(() => [
+              l.value ? (s(), a("div", {
+                key: 0,
+                ref_key: "modalRef",
+                ref: C,
+                tabindex: "-1",
+                role: "dialog",
+                "aria-modal": "true",
+                class: i(["modal-body relative w-full rounded border border-border/60 bg-body shadow-lg text-foreground flex flex-col max-h-[85vh] sm:max-h-[90vh] focus:outline-none", [o.maxWidth]]),
+                "data-testid": e.$attrs["data-testid"] || (n.value ? `modal-${n.value.toString().toLowerCase().replace(/[^a-z0-9]+/g, "-")}` : "modal"),
+                onClick: $[0] || ($[0] = S(() => {
+                }, ["stop"]))
               }, [
-                b("h3", _, z(r.value), 1),
-                G(J, {
-                  rounded: "full",
-                  size: "sm",
-                  icon: "lucide:x",
-                  variant: "ghost",
-                  class: i(["hover:bg-gray-250/25!", { "blink-bg": g.value }]),
-                  "data-testid": "modal-close-btn",
-                  onClick: m
-                }, null, 8, ["class"])
-              ], 2)
-            ])) : n("", !0),
-            b("div", {
-              class: i(["flex-1 overflow-y-auto px-4 pt-4 min-h-0 scrollbar-thin scrollbar-stable", [y.value ? "pb-0" : "pb-3.5", t.bodyClass]])
-            }, [
-              x.value ? (s(), d("p", ee, z(x.value), 1)) : n("", !0),
-              w.value ? (s(), I(H(w.value), B({ key: 1 }, { ...t.bodyProps, ...e.$attrs }, { close: p }), null, 16)) : v(e.$slots, "default", {
-                key: 2,
-                close: p
-              }, void 0, !0)
-            ], 2),
-            e.$slots.footer ? (s(), d("div", {
-              key: 1,
-              class: i([t.footerClass, "flex-none flex items-center px-4 py-3 border-t border-border/75 rounded-b-xl bg-body"])
-            }, [
-              v(e.$slots, "footer", { close: p }, void 0, !0)
-            ], 2)) : n("", !0)
-          ], 10, Y)
-        ], 2)) : n("", !0)
+                n.value ? (s(), a("div", ee, [
+                  h("div", {
+                    class: i(["flex items-center justify-between py-2 px-4 rounded-t-md", o.headerClass])
+                  }, [
+                    h("h3", te, F(n.value), 1),
+                    z(X, {
+                      rounded: "full",
+                      size: "sm",
+                      icon: "lucide:x",
+                      variant: "ghost",
+                      class: i(["hover:bg-gray-250/25!", { "blink-bg": b.value }]),
+                      "data-testid": "modal-close-btn",
+                      onClick: m
+                    }, null, 8, ["class"])
+                  ], 2)
+                ])) : r("", !0),
+                h("div", {
+                  class: i(["flex-1 overflow-y-auto px-4 pt-4 min-h-0 scrollbar-thin scrollbar-stable", [g.value ? "pb-0" : "pb-3.5", o.bodyClass]])
+                }, [
+                  x.value ? (s(), a("p", oe, F(x.value), 1)) : r("", !0),
+                  w.value ? (s(), I(Q(w.value), B({ key: 1 }, { ...o.bodyProps, ...e.$attrs }, { close: y }), null, 16)) : v(e.$slots, "default", {
+                    key: 2,
+                    close: y
+                  }, void 0, !0)
+                ], 2),
+                e.$slots.footer ? (s(), a("div", {
+                  key: 1,
+                  class: i([o.footerClass, "flex-none flex items-center px-4 py-3 border-t border-border/75 rounded-b-xl bg-body"])
+                }, [
+                  v(e.$slots, "footer", { close: y }, void 0, !0)
+                ], 2)) : r("", !0)
+              ], 10, _)) : r("", !0)
+            ]),
+            _: 3
+          })
+        ], 2)) : r("", !0)
       ]))
     ], 64));
   }
 });
 export {
-  ae as default
+  de as default
 };