vlite3 0.8.11 → 0.9.2

package/components/Form/composables/useForm.js

@@ -1,34 +1,34 @@
 import { ref as m, shallowRef as Q, computed as W, watch as X } from "vue";
-import { initializeFormValues as L, deepClone as b, cleanSubmitValues as Y, getNestedValue as M, evaluateConditional as x, setNestedValue as A, collectFileFields as Z, filterNullCustomFields as _ } from "../utils/form.utils.js";
+import { initializeFormValues as M, deepClone as b, cleanSubmitValues as Y, getNestedValue as R, evaluateConditional as E, setNestedValue as A, collectFileFields as Z, filterNullCustomFields as _ } from "../utils/form.utils.js";
 import { useFileUpload as ee } from "./useFileUpload.js";
 import { $t as le } from "../../../utils/i18n.js";
 function ue(S) {
-  const { schema: f, values: E, isUpdate: h = !1, folderId: C, onSubmit: I } = S, { handleUploadFile: N } = ee(), i = m(L(f, E)), d = m({}), j = m(!1), y = m(!1), w = m({}), z = Q(b(i.value)), V = W(() => f ? Array.isArray(f[0]) ? f.flat() : f : []);
+  const { schema: f, values: C, isUpdate: h = !1, folderId: $, onSubmit: I } = S, { handleUploadFile: N } = ee(), i = m(M(f, C)), d = m({}), w = m(!1), y = m(!1), j = m({}), z = Q(b(i.value)), V = W(() => f ? Array.isArray(f[0]) ? f.flat() : f : []);
   X(
-    () => E,
+    () => C,
     (e) => {
-      e && (i.value = L(f, e), z.value = b(i.value), y.value = !1);
+      e && (i.value = M(f, e), z.value = b(i.value), y.value = !1);
     },
     { deep: !0 }
   );
   const g = () => ({
     values: i.value,
     isUpdate: h
-  }), O = (e) => M(i.value, e), R = (e) => d.value[e] || "", $ = (e, l) => {
+  }), O = (e) => R(i.value, e), G = (e) => d.value[e] || "", D = (e, l) => {
     l ? d.value[e] = l : delete d.value[e];
   }, U = () => {
     d.value = {};
-  }, D = (e) => e.when ? x(e.when, g()) : !0, P = (e) => x(e.disabled, g()), G = (e) => x(e.readonly, g()), T = (e) => {
+  }, P = (e) => e.when ? E(e.when, g()) : !0, x = (e) => E(e.disabled, g()), k = (e) => E(e.readonly, g()), B = (e) => {
     const l = O(e.name);
     let t = "";
     const r = e.labelI18n ? le(e.labelI18n) : typeof e.label == "string" ? e.label : e.name;
     if (e.required && (l == null || l === "" || Array.isArray(l) && l.length === 0) && (t = `${r} is required`), !t && e.maxFileSize) {
-      const n = e.maxFileSize * 1024 * 1024;
+      const o = e.maxFileSize * 1024 * 1024;
       if (l != null && l !== "") {
         const s = Array.isArray(l) ? l : [l];
-        for (const o of s) {
-          const a = o instanceof File ? o.size : o?.fileSize || o?.file?.size || o?.size;
-          if (a !== void 0 && a > n) {
+        for (const n of s) {
+          const a = n instanceof File ? n.size : n?.fileSize || n?.file?.size || n?.size;
+          if (a !== void 0 && a > o) {
             t = `${r} size must be less than ${e.maxFileSize}MB`;
             break;
           }
@@ -36,54 +36,57 @@ function ue(S) {
       }
     }
     if (!t && (e.type === "file" || e.type === "fileUploader") && (e.props?.multiple || e.maxFiles)) {
-      const n = e.maxFiles || e.props?.maxFiles;
-      n && Array.isArray(l) && l.length > n && (t = `Maximum ${n} files allowed`);
+      const o = e.maxFiles || e.props?.maxFiles;
+      o && Array.isArray(l) && l.length > o && (t = `Maximum ${o} files allowed`);
     }
     return !t && e.validation && (t = e.validation({
       value: l,
       values: i.value,
       isUpdate: h
     })), t ? d.value[e.name] = t : delete d.value[e.name], t;
-  }, k = () => {
+  }, T = () => {
     U();
     let e = !0;
     for (const l of V.value) {
-      if (!D(l) || P(l)) continue;
-      T(l) && (e = !1);
+      if (!P(l) || x(l)) continue;
+      B(l) && (e = !1);
     }
     return e;
   }, H = (e, l, t) => {
-    i.value = A(i.value, e, l), y.value = !0, delete d.value[e];
-    const r = V.value.find((n) => n.name === e);
-    if (r?.updateValues) {
-      const n = r.updateValues({
+    const r = V.value.find((o) => o.name === e);
+    if (r && (x(r) || k(r))) {
+      console.warn(`[vlite3/useForm] Blocked attempted update to disabled/readonly field: ${e}`);
+      return;
+    }
+    if (i.value = A(i.value, e, l), y.value = !0, delete d.value[e], r?.updateValues) {
+      const o = r.updateValues({
         values: i.value,
         data: t,
         isUpdate: h,
-        updateError: $
+        updateError: D
       });
-      n && typeof n == "object" && (i.value = { ...i.value, ...n });
+      o && typeof o == "object" && (i.value = { ...i.value, ...o });
     }
   }, J = async () => {
-    const e = b(i.value), l = Z(f, e), t = (s, o) => {
+    const e = b(i.value), l = Z(f, e), t = (s, n) => {
       let a = null;
       s instanceof File ? a = s : s && typeof s == "object" && s.file instanceof File && (a = s.file);
       const F = {
         ...typeof s == "object" ? s : {},
-        fileName: s?.fileName || a?.name || o.split("/").pop() || "unknown",
-        fileUrl: o,
+        fileName: s?.fileName || a?.name || n.split("/").pop() || "unknown",
+        fileUrl: n,
         fileType: s?.fileType || a?.type || "application/octet-stream",
         fileSize: s?.fileSize || a?.size || 0
       };
       return delete F.file, delete F.base64, F;
     }, r = l.map(async (s) => {
-      const { name: o, value: a, field: F } = s, q = F.returnFileObject === !0, B = Array.isArray(a) ? a.some((p) => p instanceof File || p && typeof p == "object" && p.file instanceof File) : a instanceof File || a && typeof a == "object" && a.file instanceof File;
-      B && (w.value[o] = !0);
+      const { name: n, value: a, field: F } = s, q = F.returnFileObject === !0, L = Array.isArray(a) ? a.some((p) => p instanceof File || p && typeof p == "object" && p.file instanceof File) : a instanceof File || a && typeof a == "object" && a.file instanceof File;
+      L && (j.value[n] = !0);
       try {
         if (Array.isArray(a)) {
           const p = a.map(async (u) => {
             if (u instanceof File || u && typeof u == "object" && u.file instanceof File) {
-              const v = await N(u, C);
+              const v = await N(u, $);
               return v ? q ? t(u, v) : v : null;
             }
             if (u && typeof u == "object") {
@@ -92,20 +95,20 @@ function ue(S) {
             }
             return u;
           }), c = await Promise.all(p);
-          return { name: o, value: c };
+          return { name: n, value: c };
         } else {
           if (a instanceof File || a && typeof a == "object" && a.file instanceof File) {
-            const c = await N(a, C);
+            const c = await N(a, $);
             if (c)
-              return { name: o, value: q ? t(a, c) : c };
+              return { name: n, value: q ? t(a, c) : c };
           } else if (a && typeof a == "object") {
             const c = { ...a };
-            return delete c.file, delete c.base64, { name: o, value: c };
+            return delete c.file, delete c.base64, { name: n, value: c };
           }
           return null;
         }
       } finally {
-        B && (w.value[o] = !1);
+        L && (j.value[n] = !1);
       }
     });
     return (await Promise.all(r)).forEach((s) => {
@@ -115,10 +118,10 @@ function ue(S) {
     const l = { ...e };
     for (const t of V.value)
       if (t.type === "customFields" && t.props?.schema) {
-        const r = M(l, t.name);
+        const r = R(l, t.name);
         if (Array.isArray(r)) {
-          const n = _(r, t.props.schema);
-          Object.assign(l, A(l, t.name, n));
+          const o = _(r, t.props.schema);
+          Object.assign(l, A(l, t.name, o));
         }
       }
     return l;
@@ -126,25 +129,25 @@ function ue(S) {
   return {
     formValues: i,
     errors: d,
-    isSubmitting: j,
+    isSubmitting: w,
     isDirty: y,
-    fieldLoading: w,
+    fieldLoading: j,
     handleFieldChange: H,
-    validateField: T,
-    validateAll: k,
-    isFieldVisible: D,
-    isFieldDisabled: P,
-    isFieldReadonly: G,
+    validateField: B,
+    validateAll: T,
+    isFieldVisible: P,
+    isFieldDisabled: x,
+    isFieldReadonly: k,
     getFieldValue: O,
-    getFieldError: R,
-    setFieldError: $,
+    getFieldError: G,
+    setFieldError: D,
     clearErrors: U,
     resetForm: () => {
       i.value = b(z.value), U(), y.value = !1;
     },
     handleSubmit: async () => {
-      if (k()) {
-        j.value = !0;
+      if (T()) {
+        w.value = !0;
         try {
           let l = await J();
           l = K(l), l = Y(
@@ -159,7 +162,7 @@ function ue(S) {
         } catch (l) {
           throw console.error("[useForm] Submit error:", l), l;
         } finally {
-          j.value = !1;
+          w.value = !1;
         }
       }
     },

package/components/Input.vue.d.ts

@@ -26,6 +26,7 @@ declare const __VLS_component: import('vue').DefineComponent<InputProps, {}, {},
     "onClick:icon"?: (event: MouseEvent) => any;
     "onClick:icon-right"?: (event: MouseEvent) => any;
 }>, {
+    readonly: boolean;
     variant: InputVariant;
     size: InputSize;
     rounded: InputRounded;

package/components/Input.vue.js

@@ -3,7 +3,7 @@ import v from "./Icon.vue.js";
 import te from "./Label.vue.js";
 import le from "./Textarea.vue.js";
 import { $t as E } from "../utils/i18n.js";
-const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "max"], ae = { class: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center gap-2 z-20" }, fe = /* @__PURE__ */ Y({
+const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "readonly", "min", "max"], ae = { class: "absolute right-3 top-1/2 -translate-y-1/2 flex items-center justify-center gap-2 z-20" }, fe = /* @__PURE__ */ Y({
   __name: "Input",
   props: {
     modelValue: { default: "" },
@@ -13,6 +13,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
     placeholder: {},
     placeholderI18n: {},
     disabled: { type: Boolean, default: !1 },
+    readonly: { type: Boolean, default: !1 },
     loading: { type: Boolean, default: !1 },
     error: {},
     icon: {},
@@ -40,7 +41,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
   setup(t, { emit: D }) {
     const e = t, c = D, s = a(() => e.labelI18n ? E(e.labelI18n) : e.label), I = a(
       () => e.placeholderI18n ? E(e.placeholderI18n) : e.placeholder
-    ), g = Z(), m = b(null), x = b(!1), y = b(!1), H = a(() => e.type === "password" && x.value ? "text" : e.type), C = a(() => e.modelValue !== "" && e.modelValue !== null && e.modelValue !== void 0), V = a(() => h.value || C.value || y.value), p = a(() => !!e.addonLeft || !!g["addon-left"]), B = a(() => !!e.addonRight || !!g["addon-right"]), U = a(() => [
+    ), g = Z(), m = b(null), x = b(!1), y = b(!1), H = a(() => e.type === "password" && x.value ? "text" : e.type), C = a(() => e.modelValue !== "" && e.modelValue !== null && e.modelValue !== void 0), V = a(() => p.value || C.value || y.value), h = a(() => !!e.addonLeft || !!g["addon-left"]), B = a(() => !!e.addonRight || !!g["addon-right"]), U = a(() => [
       "relative w-full",
       e.class,
       e.labelPosition === "left" ? "flex items-center gap-4" : "",
@@ -68,7 +69,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
         "2xl": "rounded-2xl",
         full: "rounded-full"
       }[e.rounded];
-      p.value && (e.rounded === "md" ? o = "rounded-r-md rounded-l-none" : e.rounded === "sm" ? o = "rounded-r-sm rounded-l-none" : e.rounded === "lg" ? o = "rounded-r-lg rounded-l-none" : e.rounded === "full" ? o = "rounded-r-full rounded-l-none" : e.rounded !== "none" && (o = o.replace("rounded-", "rounded-r-").replace("rounded-l-", ""))), B.value && (p.value ? o = "rounded-none" : e.rounded === "md" ? o = "rounded-l-md rounded-r-none" : e.rounded === "sm" ? o = "rounded-l-sm rounded-r-none" : e.rounded === "lg" ? o = "rounded-l-lg rounded-r-none" : e.rounded === "full" ? o = "rounded-l-full rounded-r-none" : e.rounded !== "none" && (o = o.replace("rounded-", "rounded-l-").replace("rounded-r-", ""))), e.variant === "outline-b" && (o = "rounded-none");
+      h.value && (e.rounded === "md" ? o = "rounded-r-md rounded-l-none" : e.rounded === "sm" ? o = "rounded-r-sm rounded-l-none" : e.rounded === "lg" ? o = "rounded-r-lg rounded-l-none" : e.rounded === "full" ? o = "rounded-r-full rounded-l-none" : e.rounded !== "none" && (o = o.replace("rounded-", "rounded-r-").replace("rounded-l-", ""))), B.value && (h.value ? o = "rounded-none" : e.rounded === "md" ? o = "rounded-l-md rounded-r-none" : e.rounded === "sm" ? o = "rounded-l-sm rounded-r-none" : e.rounded === "lg" ? o = "rounded-l-lg rounded-r-none" : e.rounded === "full" ? o = "rounded-l-full rounded-r-none" : e.rounded !== "none" && (o = o.replace("rounded-", "rounded-l-").replace("rounded-r-", ""))), e.variant === "outline-b" && (o = "rounded-none");
       const M = e.variant === "outline-b" || e.variant === "transparent";
       return e.variant, [
         l,
@@ -76,7 +77,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
         e.type === "textarea" ? "" : f[e.size],
         o,
         e.error ? "border-destructive focus-visible:ring-destructive" : "",
-        e.icon ? "pl-9" : M && !p.value ? "pl-0" : "",
+        e.icon ? "pl-9" : M && !h.value ? "pl-0" : "",
         e.showClearButton && C.value || e.type === "password" || e.loading || e.iconRight ? "pr-9" : M && !B.value ? "pr-0" : "",
         // Keyframe name used to detect browser autofill via animationstart event
         e.variant === "floating" ? "autofill-detect" : "",
@@ -136,15 +137,15 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
       const n = l.target;
       c("change", n.value);
     }, O = () => {
-      x.value = !x.value;
+      e.disabled || e.readonly || (x.value = !x.value);
     }, Q = () => {
-      c("update:modelValue", ""), z(() => {
+      e.disabled || e.readonly || (c("update:modelValue", ""), z(() => {
         m.value?.focus();
-      });
-    }, h = b(!1), j = b(!1), F = (l) => {
-      h.value = !0, c("focus", l);
+      }));
+    }, p = b(!1), j = b(!1), F = (l) => {
+      p.value = !0, c("focus", l);
     }, N = (l) => {
-      h.value = !1, c("blur", l);
+      p.value = !1, c("blur", l);
     }, X = (l) => {
       l.animationName === "onAutoFillStart" ? y.value = !0 : l.animationName === "onAutoFillCancel" && (y.value = !1);
     };
@@ -170,7 +171,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
       A("div", {
         class: r(W.value)
       }, [
-        p.value ? (d(), u("div", {
+        h.value ? (d(), u("div", {
           key: 0,
           class: r(q.value)
         }, [
@@ -196,12 +197,13 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
             "model-value": String(t.modelValue),
             placeholder: t.variant === "floating" && s.value && !V.value ? "" : I.value,
             disabled: t.disabled,
+            readonly: t.readonly,
             rows: t.rows,
             class: r(S.value),
             "onUpdate:modelValue": n[0] || (n[0] = (f) => c("update:modelValue", f)),
             onBlur: N,
             onFocus: F
-          }, null, 8, ["model-value", "placeholder", "disabled", "rows", "class"])) : (d(), u("input", {
+          }, null, 8, ["model-value", "placeholder", "disabled", "readonly", "rows", "class"])) : (d(), u("input", {
             key: 2,
             ref_key: "inputRef",
             ref: m,
@@ -209,6 +211,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
             value: t.modelValue,
             placeholder: t.variant === "floating" && s.value && !V.value ? "" : I.value,
             disabled: t.disabled,
+            readonly: t.readonly,
             min: t.min,
             max: t.max,
             class: r(S.value),
@@ -243,14 +246,14 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
                 "flex items-center justify-center text-muted-foreground",
                 t.disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer hover:text-foreground"
               ]),
-              onClick: n[1] || (n[1] = (f) => !t.disabled && c("click:icon-right", f))
+              onClick: n[1] || (n[1] = (f) => !t.disabled && !t.readonly && c("click:icon-right", f))
             }, [
               k(v, {
                 icon: t.iconRight,
                 class: r(["h-4 w-4", t.iconRightClass])
               }, null, 8, ["icon", "class"])
             ], 2)) : i("", !0),
-            t.type === "password" && !t.disabled ? (d(), u("button", {
+            t.type === "password" && !t.disabled && !t.readonly ? (d(), u("button", {
               key: 2,
               type: "button",
               tabindex: "-1",
@@ -262,7 +265,7 @@ const ne = ["for"], oe = ["type", "value", "placeholder", "disabled", "min", "ma
                 class: "h-4 w-4"
               }, null, 8, ["icon"])
             ])) : i("", !0),
-            t.showClearButton && C.value && !t.disabled && !t.loading && t.type !== "textarea" && t.type !== "password" && (h.value || j.value) ? (d(), u("button", {
+            t.showClearButton && C.value && !t.disabled && !t.readonly && !t.loading && t.type !== "textarea" && t.type !== "password" && (p.value || j.value) ? (d(), u("button", {
               key: 3,
               type: "button",
               tabindex: "-1",

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 m = /* @__PURE__ */ t(o, [["__scopeId", "data-v-0f3159c0"]]);
+const p = /* @__PURE__ */ t(o, [["__scopeId", "data-v-7c958115"]]);
 export {
-  m as default
+  p as default
 };

package/components/Modal.vue2.js

@@ -1,4 +1,4 @@
-import { defineComponent as P, ref as c, inject as R, computed as h, markRaw as V, watch as T, provide as W, nextTick as K, onMounted as A, onUnmounted as U, openBlock as s, createElementBlock as a, Fragment as q, mergeProps as B, withModifiers as I, renderSlot as m, createCommentVNode as r, createBlock as S, Teleport as G, normalizeClass as d, createElementVNode as v, toDisplayString as F, createVNode as H, resolveDynamicComponent as J } from "vue";
+import { defineComponent as P, ref as c, inject as R, computed as h, markRaw as V, watch as T, provide as W, nextTick as K, onMounted as A, onUnmounted as U, openBlock as s, createElementBlock as r, Fragment as q, mergeProps as B, withModifiers as I, renderSlot as m, createCommentVNode as a, createBlock as S, Teleport as G, normalizeClass as i, createElementVNode as b, toDisplayString as F, createVNode as H, resolveDynamicComponent as J } from "vue";
 import L from "./Button.vue.js";
 import { useKeyStroke as Q } from "../composables/useKeyStroke.js";
 import { $t as O } from "../utils/i18n.js";
@@ -29,13 +29,13 @@ const X = {
   },
   emits: ["close", "update:show", "onOpen"],
   setup(t, { emit: j }) {
-    const o = t, i = j, l = c(o.show), g = c(!1), y = c(!1), k = c(null);
+    const o = t, d = j, l = c(o.show), g = c(!1), v = c(!1), k = c(null);
     let u = null;
-    const b = c(!1), n = R("dropdown-context", null), C = h(() => o.body ? V(o.body) : void 0);
+    const y = c(!1), n = R("dropdown-context", null), C = h(() => o.body ? V(o.body) : void 0);
     T(
       () => o.show,
       (e) => {
-        l.value = e, e && (i("onOpen"), n?.close());
+        l.value = e, e && (d("onOpen"), n?.close());
       }
     );
     const z = () => {
@@ -43,24 +43,24 @@ const X = {
     }, D = (e) => {
       g.value = e;
     }, E = (e) => {
-      b.value = e;
+      y.value = e;
     }, f = () => {
       if (g.value) {
-        y.value = !0, u && clearTimeout(u), u = setTimeout(() => {
-          y.value = !1;
+        v.value = !0, u && clearTimeout(u), u = setTimeout(() => {
+          v.value = !1;
         }, 1e3);
         return;
       }
-      l.value = !1, i("update:show", !1), i("close");
+      l.value = !1, d("update:show", !1), d("close");
     }, p = () => {
-      l.value = !1, i("update:show", !1), i("close");
+      l.value = !1, d("update:show", !1), d("close");
     };
     W("modal-context", { close: f, setSubmitting: D, registerFormFooter: E });
     const M = () => {
       o.closeOutside && f();
     }, { onKeyStroke: N } = Q();
     N("Escape", f), T(l, async (e) => {
-      e ? (n?.onChildToggle?.(!0), document.body.style.overflow = "hidden", await K(), k.value?.focus()) : (document.body.style.overflow = "", n?.onChildToggle?.(!1), b.value = !1);
+      e ? (n?.onChildToggle?.(!0), document.body.style.overflow = "hidden", await K(), k.value?.focus()) : (document.body.style.overflow = "", n?.onChildToggle?.(!1), y.value = !1);
     }), A(() => {
       l.value && n?.onChildToggle?.(!0);
     }), U(() => {
@@ -69,62 +69,62 @@ const X = {
     const x = h(() => o.titleI18n ? O(o.titleI18n) : o.title), w = h(
       () => o.descriptionI18n ? O(o.descriptionI18n) : o.description
     );
-    return (e, $) => (s(), a(q, null, [
-      e.$slots?.trigger || e.$slots?.default ? (s(), a("span", B({
+    return (e, $) => (s(), r(q, null, [
+      e.$slots?.trigger || e.$slots?.default ? (s(), r("span", B({
         key: 0,
         onClick: I(z, ["stop"]),
         class: `${t.triggerClass}`
       }, e.$attrs), [
         m(e.$slots, "trigger", {}, () => [
-          t.body ? m(e.$slots, "default", { key: 0 }, void 0, !0) : r("", !0)
+          t.body ? m(e.$slots, "default", { key: 0 }, void 0, !0) : a("", !0)
         ], !0)
-      ], 16)) : r("", !0),
+      ], 16)) : a("", !0),
       (s(), S(G, { to: "body" }, [
-        l.value ? (s(), a("div", {
+        l.value ? (s(), r("div", {
           key: 0,
-          class: d(["fixed inset-0 z-50 flex items-center justify-center p-4 v-modal-overlay", t.backdrop ? "v-modal-backdrop" : ""]),
+          class: i(["fixed inset-0 z-50 flex items-center justify-center p-4 v-modal-overlay", t.backdrop ? "v-modal-backdrop" : ""]),
           onClick: M
         }, [
-          v("div", {
+          b("div", {
             ref_key: "modalRef",
             ref: k,
             tabindex: "-1",
-            class: d(["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]]),
+            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]]),
             onClick: $[0] || ($[0] = I(() => {
             }, ["stop"]))
           }, [
-            x.value ? (s(), a("div", X, [
-              v("div", {
-                class: d(["flex items-center justify-between py-2 px-4 rounded-t-md", t.headerClass])
+            x.value ? (s(), r("div", X, [
+              b("div", {
+                class: i(["flex items-center justify-between py-2 px-4 rounded-t-md", t.headerClass])
               }, [
-                v("h3", Y, F(x.value), 1),
+                b("h3", Y, F(x.value), 1),
                 H(L, {
                   rounded: "full",
                   size: "sm",
                   icon: "lucide:x",
                   variant: "ghost",
-                  class: d(["hover:bg-gray-250/25!", { "blink-bg": y.value }]),
+                  class: i(["hover:bg-gray-250/25!", { "blink-bg": v.value }]),
                   onClick: f
                 }, null, 8, ["class"])
               ], 2)
-            ])) : r("", !0),
-            v("div", {
-              class: d(["flex-1 overflow-y-auto px-4 pt-4 min-h-0", [b.value ? "pb-0" : "pb-3.5", t.bodyClass]])
+            ])) : a("", !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]])
             }, [
-              w.value ? (s(), a("p", Z, F(w.value), 1)) : r("", !0),
+              w.value ? (s(), r("p", Z, F(w.value), 1)) : a("", !0),
               C.value ? (s(), S(J(C.value), B({ key: 1 }, { ...t.bodyProps, ...e.$attrs }, { close: p }), null, 16)) : m(e.$slots, "default", {
                 key: 2,
                 close: p
               }, void 0, !0)
             ], 2),
-            e.$slots.footer ? (s(), a("div", {
+            e.$slots.footer ? (s(), r("div", {
               key: 1,
-              class: d([t.footerClass, "flex-none flex items-center px-4 py-3 border-t border-border/75 rounded-b-xl bg-body"])
+              class: i([t.footerClass, "flex-none flex items-center px-4 py-3 border-t border-border/75 rounded-b-xl bg-body"])
             }, [
               m(e.$slots, "footer", { close: p }, void 0, !0)
-            ], 2)) : r("", !0)
+            ], 2)) : a("", !0)
           ], 2)
-        ], 2)) : r("", !0)
+        ], 2)) : a("", !0)
       ]))
     ], 64));
   }