vlite3 1.4.31 → 1.4.32

package/components/Form/Form.vue2.js

@@ -1,35 +1,35 @@
-import { defineComponent as Ie, computed as o, inject as Ne, getCurrentInstance as Be, onMounted as De, onUnmounted as Z, ref as _, watch as ee, nextTick as Ee, openBlock as n, createElementBlock as c, withKeys as ve, withModifiers as te, normalizeClass as v, createElementVNode as p, createVNode as k, mergeProps as O, toDisplayString as j, renderSlot as me, unref as l, createCommentVNode as d, createBlock as C, withCtx as fe, Fragment as qe, renderList as He } from "vue";
-import { useForm as $e } from "./composables/useForm.js";
-import J from "./FormFields.vue.js";
-import Ge from "./FormField.vue.js";
-import Oe from "./FormSkeleton.vue.js";
-import je from "../Accordion/Accordion.vue.js";
-import F from "../Button.vue.js";
-import Ke from "../BackButton.vue.js";
-import Me from "../Timeline/Timeline.vue.js";
+import { defineComponent as Ge, computed as o, inject as He, getCurrentInstance as $e, onMounted as Me, onUnmounted as _, shallowRef as ee, watch as te, nextTick as Oe, openBlock as n, createElementBlock as c, withKeys as ye, withModifiers as ae, normalizeClass as v, createElementVNode as p, createVNode as k, mergeProps as O, toDisplayString as j, renderSlot as he, unref as l, createCommentVNode as d, createBlock as C, withCtx as be, Fragment as je, renderList as Ke, isMemoSame as Ye } from "vue";
+import { useForm as Je } from "./composables/useForm.js";
+import X from "./FormFields.vue.js";
+import Qe from "./FormField.vue.js";
+import We from "./FormSkeleton.vue.js";
+import Xe from "../Accordion/Accordion.vue.js";
+import S from "../Button.vue.js";
+import Ze from "../BackButton.vue.js";
+import _e from "../Timeline/Timeline.vue.js";
 import "@iconify/vue";
-import { resolveI18nText as Ye } from "../../utils/i18n.js";
-import { useVLiteConfig as Je } from "../../core/config.js";
-import { resolveFieldType as Qe } from "./utils/form.utils.js";
-const We = ["onKeydown"], Xe = { class: "flex items-center gap-3" }, Ze = { class: "flex items-center gap-2 shrink-0" }, _e = {
+import { resolveI18nText as et } from "../../utils/i18n.js";
+import { useVLiteConfig as tt } from "../../core/config.js";
+import { resolveFieldType as at } from "./utils/form.utils.js";
+const lt = ["onKeydown"], it = { class: "flex items-center gap-3" }, st = { class: "flex items-center gap-2 shrink-0" }, nt = {
   key: 0,
   class: "w-full order-first lg:order-last lg:min-w-100 lg:max-w-[380px] shrink-0"
-}, et = { key: 0 }, tt = {
+}, ot = { key: 0 }, rt = {
   key: 0,
   class: "flex gap-3 items-end ml-auto"
-}, at = { class: "text-base font-semibold text-foreground" }, lt = {
+}, ut = { class: "text-base font-semibold text-foreground" }, dt = {
   key: 0,
   class: "text-sm text-muted-foreground mt-1"
-}, it = {
+}, ct = {
   key: 3,
   class: "form-step"
-}, st = { class: "text-lg font-semibold text-foreground" }, nt = {
+}, vt = { class: "text-lg font-semibold text-foreground" }, mt = {
   key: 0,
   class: "text-sm text-muted-foreground mt-1"
-}, ot = {
+}, ft = {
   key: 0,
   class: "flex gap-3 items-center"
-}, kt = /* @__PURE__ */ Ie({
+}, Pt = /* @__PURE__ */ Ge({
   __name: "Form",
   props: {
     schema: {},
@@ -71,199 +71,210 @@ const We = ["onKeydown"], Xe = { class: "flex items-center gap-3" }, Ze = { clas
     layout: { default: "vertical" }
   },
   emits: ["onSubmit", "onCancel", "onStepChange", "onAddonAction", "onBack", "onChange"],
-  setup(e, { expose: ge, emit: ye }) {
-    const i = e, g = ye, he = o(() => Ye(i.pageTitleI18n, i.pageTitle)), y = Ne("modal-context", null), be = Je(), K = o(() => be?.components?.form || {}), V = o(() => i.variant ?? K.value.variant ?? "outline"), I = o(() => i.size ?? K.value.size ?? "md"), N = o(() => i.rounded ?? K.value.rounded ?? "md"), M = o(
+  setup(e, { expose: xe, emit: pe }) {
+    const i = e, f = pe, ke = o(() => et(i.pageTitleI18n, i.pageTitle)), g = He("modal-context", null), Ce = tt(), K = o(() => Ce?.components?.form || {}), U = o(() => i.variant ?? K.value.variant ?? "outline"), I = o(() => i.size ?? K.value.size ?? "md"), z = o(() => i.rounded ?? K.value.rounded ?? "md"), D = o(
       () => i.showRequiredAsterisk ?? K.value.showRequiredAsterisk ?? !0
-    ), Y = o(() => i.showCancel || !!y), B = o(() => !!y), xe = Be(), pe = o(() => {
-      const a = xe?.vnode.props;
-      return !!a && (Object.prototype.hasOwnProperty.call(a, "stickyFooter") || Object.prototype.hasOwnProperty.call(a, "sticky-footer")) && i.stickyFooter;
-    }), U = o(
-      () => i.layout !== "inline" && (i.stickyFooter || B.value)
+    ), Y = o(() => i.showCancel || !!g), E = o(() => !!g), Se = $e(), Fe = o(() => {
+      const t = Se?.vnode.props;
+      return !!t && (Object.prototype.hasOwnProperty.call(t, "stickyFooter") || Object.prototype.hasOwnProperty.call(t, "sticky-footer")) && i.stickyFooter;
+    }), L = o(
+      () => i.layout !== "inline" && (i.stickyFooter || E.value)
     );
-    De(() => {
-      i.footer && B.value && y?.registerFormFooter?.(!0);
-    }), Z(() => {
-      B.value && y?.registerFormFooter?.(!1);
+    Me(() => {
+      i.footer && E.value && g?.registerFormFooter?.(!0);
+    }), _(() => {
+      E.value && g?.registerFormFooter?.(!1);
     });
-    const S = _(null), D = _(!1), ae = (a) => {
-      let t = a?.parentElement ?? null;
-      for (; t && t !== document.body; ) {
-        const { overflowY: s } = getComputedStyle(t);
+    const F = ee(null), q = ee(!1), le = (t) => {
+      let a = t?.parentElement ?? null;
+      for (; a && a !== document.body; ) {
+        const { overflowY: s } = getComputedStyle(a);
         if (s === "auto" || s === "scroll" || s === "overlay")
-          return t;
-        t = t.parentElement;
+          return a;
+        a = a.parentElement;
       }
       return document.documentElement;
-    }, le = () => {
-      if (!U.value || !S.value) {
-        D.value = !1;
+    }, ie = () => {
+      if (!L.value || !F.value) {
+        q.value = !1;
         return;
       }
-      const a = ae(S.value);
-      if (!a) {
-        D.value = !1;
+      const t = le(F.value);
+      if (!t) {
+        q.value = !1;
         return;
       }
-      D.value = a.scrollHeight > a.clientHeight + 1;
-    }, ke = o(
-      () => U.value && (B.value || pe.value || D.value)
+      q.value = t.scrollHeight > t.clientHeight + 1;
+    }, we = o(
+      () => L.value && (E.value || Fe.value || q.value)
     );
     let A = null;
-    ee(
-      [S, U, () => i.schemaLoading],
+    te(
+      [F, L, () => i.schemaLoading],
       async () => {
-        if (A?.disconnect(), A = null, await Ee(), !S.value || !U.value) {
-          D.value = !1;
+        if (A?.disconnect(), A = null, await Oe(), !F.value || !L.value) {
+          q.value = !1;
           return;
         }
-        const a = ae(S.value);
-        if (le(), typeof ResizeObserver > "u" || !a) return;
-        A = new ResizeObserver(() => le()), A.observe(a), A.observe(S.value);
-        const t = S.value.closest("form");
-        t && A.observe(t);
+        const t = le(F.value);
+        if (ie(), typeof ResizeObserver > "u" || !t) return;
+        A = new ResizeObserver(() => ie()), A.observe(t), A.observe(F.value);
+        const a = F.value.closest("form");
+        a && A.observe(a);
       },
       { flush: "post", immediate: !0 }
-    ), Z(() => {
+    ), _(() => {
       A?.disconnect();
     });
-    const T = o(() => !i.schema || i.schema.length === 0 ? !1 : Array.isArray(i.schema[0])), u = o(() => i.tabs && i.tabs.length > 0 && T.value), r = _(0), ie = o(() => i.tabs ? i.tabs.map((a, t) => ({
-      id: a.id?.toString() || t.toString(),
-      title: a.title,
-      icon: a.icon,
-      description: a.description,
-      status: t < r.value ? "completed" : t === r.value ? "current" : "upcoming"
-    })) : []), E = o(() => T.value ? i.schema : [i.schema]), se = o(() => u.value ? E.value[r.value] || [] : []), ne = (a) => {
-      if (!a) return [];
-      if (Array.isArray(a)) return a;
+    const T = o(() => !i.schema || i.schema.length === 0 ? !1 : Array.isArray(i.schema[0])), u = o(() => i.tabs && i.tabs.length > 0 && T.value), r = ee(0), se = o(() => i.tabs ? i.tabs.map((t, a) => ({
+      id: t.id?.toString() || a.toString(),
+      title: t.title,
+      icon: t.icon,
+      description: t.description,
+      status: a < r.value ? "completed" : a === r.value ? "current" : "upcoming"
+    })) : []), G = o(() => T.value ? i.schema : [i.schema]), ne = o(() => u.value ? G.value[r.value] || [] : []), oe = (t) => {
+      if (!t) return [];
+      if (Array.isArray(t)) return t;
       try {
-        const t = a({
+        const a = t({
           values: m.value,
           globalValues: m.value,
           isUpdate: i.isUpdate
         });
-        return Array.isArray(t) ? t : [];
-      } catch (t) {
-        return console.error("[Form] Error evaluating dynamic group headings:", t), [];
+        return Array.isArray(a) ? a : [];
+      } catch (a) {
+        return console.error("[Form] Error evaluating dynamic group headings:", a), [];
       }
-    }, Q = o(() => ne(i.groupsHeadings)), W = o(
-      () => ne(i.groupHeadingsDescription)
-    ), q = o(() => {
-      const a = E.value, t = [];
-      for (let s = 0; s < a.length; s++) {
-        const f = a[s];
-        !Array.isArray(f) || f.length === 0 || f.some((Ve) => R(Ve)) && t.push({ schema: f, originalIndex: s });
+    }, J = o(() => oe(i.groupsHeadings)), Q = o(
+      () => oe(i.groupHeadingsDescription)
+    ), H = o(() => {
+      const t = G.value, a = [];
+      for (let s = 0; s < t.length; s++) {
+        const x = t[s];
+        !Array.isArray(x) || x.length === 0 || x.some((me) => R(me)) && a.push({ schema: x, originalIndex: s });
       }
+      return a;
+    }), Ae = o(
+      () => H.value.map((t) => ({
+        id: `form-group-${t.originalIndex}`,
+        title: J.value?.[t.originalIndex] || "",
+        description: Q.value?.[t.originalIndex] || void 0
+      }))
+    ), Te = o(() => {
+      const t = /* @__PURE__ */ new Map();
+      for (const a of H.value)
+        t.set(`form-group-${a.originalIndex}`, a.schema);
       return t;
-    }), b = o(() => u.value ? null : (T.value ? i.schema.flat() : i.schema).find((t) => Qe(t, {
+    }), h = o(() => u.value ? null : (T.value ? i.schema.flat() : i.schema).find((a) => at(a, {
       values: m.value,
       globalValues: m.value,
       isUpdate: i.isUpdate
-    }) === "thumbnailSelector") ?? null), P = o(() => !!b.value), {
+    }) === "thumbnailSelector") ?? null), P = o(() => !!h.value), {
       formValues: m,
-      errors: x,
-      isSubmitting: h,
-      fieldLoading: H,
-      handleFieldChange: oe,
-      validateField: Ce,
-      validateAll: re,
+      errors: b,
+      isSubmitting: y,
+      fieldLoading: V,
+      handleFieldChange: re,
+      validateField: Pe,
+      validateAll: ue,
       isFieldVisible: R,
-      isFieldDisabled: z,
+      isFieldDisabled: B,
       isFieldReadonly: $,
-      handleSubmit: Fe,
-      reinitialize: Se,
-      resetForm: we,
-      setFieldError: Ae,
-      clearErrors: Te
-    } = $e({
+      handleSubmit: Re,
+      reinitialize: Ue,
+      resetForm: Ie,
+      setFieldError: ze,
+      clearErrors: Le
+    } = Je({
       schema: i.schema,
       values: i.values,
       isUpdate: i.isUpdate,
       folderId: i.folderId,
       emitFields: i.emitFields,
-      onSubmit: (a) => {
-        g("onSubmit", a, y?.close || (() => {
+      onSubmit: (t) => {
+        f("onSubmit", t, g?.close || (() => {
         }));
       }
     });
-    ee(
-      () => i.loading || h.value,
-      (a) => {
-        y?.setSubmitting && y.setSubmitting(a);
+    te(
+      () => i.loading || y.value,
+      (t) => {
+        g?.setSubmitting && g.setSubmitting(t);
       },
       { immediate: !0 }
-    ), Z(() => {
-      y?.setSubmitting && y.setSubmitting(!1);
-    }), ee(
+    ), _(() => {
+      g?.setSubmitting && g.setSubmitting(!1);
+    }), te(
       [() => i.schema, () => i.values, () => i.schemaLoading],
-      ([a, t, s]) => {
-        s || Se(a, t);
+      ([t, a, s]) => {
+        s || Ue(t, a);
       }
     );
-    const G = (a, t) => {
-      oe(a, t.value, t.data), g("onChange", m.value);
-    }, Pe = async () => {
+    const M = (t, a) => {
+      re(t, a.value, a.data), f("onChange", m.value);
+    }, Ve = async () => {
       if (!u.value) return !0;
-      const a = se.value;
-      let t = !0;
-      for (const s of a) {
-        if (!R(s) || z(s)) continue;
-        await Ce(s) && (t = !1);
+      const t = ne.value;
+      let a = !0;
+      for (const s of t) {
+        if (!R(s) || B(s)) continue;
+        await Pe(s) && (a = !1);
       }
-      return t;
-    }, Re = o(() => u.value ? r.value < E.value.length - 1 : !1), ue = o(() => u.value ? r.value > 0 : !1), L = o(() => u.value ? r.value === E.value.length - 1 : !0), de = async () => {
-      !Re.value || !await Pe() || (r.value++, g("onStepChange", r.value));
-    }, Ue = () => {
-      ue.value && (r.value--, g("onStepChange", r.value));
-    }, ze = (a, t) => {
-      t <= r.value && (r.value = t, g("onStepChange", r.value));
+      return a;
+    }, Be = o(() => u.value ? r.value < G.value.length - 1 : !1), de = o(() => u.value ? r.value > 0 : !1), N = o(() => u.value ? r.value === G.value.length - 1 : !0), ce = async () => {
+      !Be.value || !await Ve() || (r.value++, f("onStepChange", r.value));
+    }, Ne = () => {
+      de.value && (r.value--, f("onStepChange", r.value));
+    }, De = (t, a) => {
+      a <= r.value && (r.value = a, f("onStepChange", r.value));
     }, w = async () => {
       if (u.value) {
-        if (!L.value && !i.isUpdate) {
-          await de();
+        if (!N.value && !i.isUpdate) {
+          await ce();
           return;
         }
-        if (!await re()) {
-          const t = E.value.findIndex(
-            (s) => s.some((f) => !!x.value[f.name])
+        if (!await ue()) {
+          const a = G.value.findIndex(
+            (s) => s.some((x) => !!b.value[x.name])
           );
-          t !== -1 && t !== r.value && (r.value = t, g("onStepChange", r.value));
+          a !== -1 && a !== r.value && (r.value = a, f("onStepChange", r.value));
           return;
         }
       }
       try {
-        await Fe();
+        await Re();
       } catch {
       }
-    }, Le = (a) => {
-      if (a.key !== "Enter" || a.defaultPrevented) return;
-      const t = a.target;
-      if (!t) return;
-      const s = t.tagName.toLowerCase();
-      s !== "textarea" && s !== "button" && (t.isContentEditable || (a.preventDefault(), w()));
-    }, ce = (a) => {
-      (a.metaKey || a.ctrlKey) && a.key === "s" && (a.preventDefault(), w());
+    }, Ee = (t) => {
+      if (t.key !== "Enter" || t.defaultPrevented) return;
+      const a = t.target;
+      if (!a) return;
+      const s = a.tagName.toLowerCase();
+      s !== "textarea" && s !== "button" && (a.isContentEditable || (t.preventDefault(), w()));
+    }, ve = (t) => {
+      (t.metaKey || t.ctrlKey) && t.key === "s" && (t.preventDefault(), w());
     };
-    ge({
+    xe({
       formValues: m,
-      errors: x,
-      isSubmitting: h,
+      errors: b,
+      isSubmitting: y,
       handleSubmit: w,
-      validateAll: re,
-      resetForm: we,
-      setFieldError: Ae,
-      clearErrors: Te,
-      setFieldValue: oe
+      validateAll: ue,
+      resetForm: Ie,
+      setFieldError: ze,
+      clearErrors: Le,
+      setFieldValue: re
     });
-    const X = () => {
-      g("onCancel"), y && y?.close?.();
+    const Z = () => {
+      f("onCancel"), g && g?.close?.();
     };
-    return (a, t) => (n(), c("form", {
+    return (t, a) => (n(), c("form", {
       class: v(["form-container", i.class, e.isPage && "pb-10"]),
-      onSubmit: te(w, ["prevent"]),
+      onSubmit: ae(w, ["prevent"]),
       onKeydown: [
-        Le,
-        ve(te(ce, ["meta", "prevent"]), ["s"]),
-        ve(te(ce, ["ctrl", "prevent"]), ["s"])
+        Ee,
+        ye(ae(ve, ["meta", "prevent"]), ["s"]),
+        ye(ae(ve, ["ctrl", "prevent"]), ["s"])
       ]
     }, [
       e.isPage ? (n(), c("div", {
@@ -273,72 +284,72 @@ const We = ["onKeydown"], Xe = { class: "flex items-center gap-3" }, Ze = { clas
           e.pageHeaderClass
         ])
       }, [
-        p("div", Xe, [
-          k(Ke, O(e.backButtonProps, {
+        p("div", it, [
+          k(Ze, O(e.backButtonProps, {
             fallback: e.backButtonPath,
             class: "max-sm:w-8 max-sm:h-8 max-sm:min-w-8 max-sm:min-h-8 max-sm:px-0 shrink-0"
           }), null, 16, ["fallback"]),
           p("h1", {
             class: v(["text-foreground max-sm:text-lg text-fs-5 truncate", e.pageTitleClass])
-          }, j(he.value), 3)
+          }, j(ke.value), 3)
         ]),
-        p("div", Ze, [
-          me(a.$slots, "header-actions", {
+        p("div", st, [
+          he(t.$slots, "header-actions", {
             values: l(m),
-            isSubmitting: l(h),
+            isSubmitting: l(y),
             handleSubmit: w
           }, void 0, !0),
-          k(F, O({
+          k(S, O({
             type: "button",
             variant: e.isUpdate ? "outline" : "primary",
             text: e.submitText
           }, e.submitProps, {
             disabled: e.schemaLoading,
-            loading: e.loading || l(h),
+            loading: e.loading || l(y),
             onClick: w,
             class: "max-sm:hidden"
           }), null, 16, ["variant", "text", "disabled", "loading"])
         ])
       ], 2)) : d("", !0),
-      !e.schemaLoading && u.value && ie.value.length > 0 ? (n(), c("div", {
+      !e.schemaLoading && u.value && se.value.length > 0 ? (n(), c("div", {
         key: 1,
         class: v(["form-timeline", e.timelineTextPosition == "right" ? "mb-2" : "mb-8"])
       }, [
-        k(l(Me), {
-          steps: ie.value,
+        k(l(_e), {
+          steps: se.value,
           activeStep: r.value,
           direction: "horizontal",
           textPosition: e.timelineTextPosition,
           clickable: !0,
-          onStepClick: ze
+          onStepClick: De
         }, null, 8, ["steps", "activeStep", "textPosition"])
       ], 2)) : d("", !0),
       p("div", {
-        class: v(e.footer && U.value ? "pb-2" : "")
+        class: v(e.footer && L.value ? "pb-2" : "")
       }, [
-        e.schemaLoading ? (n(), C(Oe, {
+        e.schemaLoading ? (n(), C(We, {
           key: 0,
           isGrouped: T.value
         }, null, 8, ["isGrouped"])) : (n(), c("div", {
           key: 1,
           class: v(P.value ? "flex flex-col lg:flex-row gap-10 lg:gap-16" : "")
         }, [
-          P.value ? (n(), c("div", _e, [
-            b.value && l(R)(b.value) ? (n(), C(Ge, {
+          P.value ? (n(), c("div", nt, [
+            h.value && l(R)(h.value) ? (n(), C(Qe, {
               key: 0,
-              field: b.value,
-              value: l(m)[b.value.name],
+              field: h.value,
+              value: l(m)[h.value.name],
               values: l(m),
-              errors: l(x),
-              variant: V.value,
+              errors: l(b),
+              variant: U.value,
               size: I.value,
-              rounded: N.value,
-              disabled: l(z)(b.value),
-              readonly: l($)(b.value),
-              error: l(x)[b.value.name] || "",
+              rounded: z.value,
+              disabled: l(B)(h.value),
+              readonly: l($)(h.value),
+              error: l(b)[h.value.name] || "",
               isUpdate: e.isUpdate,
-              loading: l(H)[b.value?.name],
-              onChange: t[0] || (t[0] = (s) => G(b.value.name, s))
+              loading: l(V)[h.value?.name],
+              onChange: a[0] || (a[0] = (s) => M(h.value.name, s))
             }, null, 8, ["field", "value", "values", "errors", "variant", "size", "rounded", "disabled", "readonly", "error", "isUpdate", "loading"])) : d("", !0)
           ])) : d("", !0),
           p("div", {
@@ -348,152 +359,170 @@ const We = ["onKeydown"], Xe = { class: "flex items-center gap-3" }, Ze = { clas
               key: 1,
               class: v(["form-groups space-y-6", e.groupContainerClass])
             }, [
-              (n(!0), c(qe, null, He(q.value, (s) => (n(), c("div", {
-                key: s.originalIndex,
-                class: v([
-                  "form-group overflow-hidden bg-body",
+              (n(!0), c(je, null, Ke(H.value, (s, x, me, W) => {
+                const fe = [
+                  s.schema,
+                  s.originalIndex,
+                  l(m),
+                  l(b),
+                  l(V),
+                  U.value,
+                  I.value,
+                  z.value,
+                  J.value?.[s.originalIndex],
+                  Q.value?.[s.originalIndex],
                   e.groupClass,
-                  q.value.length > 1 ? "border rounded" : ""
-                ])
-              }, [
-                Q.value?.[s.originalIndex] ? (n(), c("div", {
-                  key: 0,
-                  class: v(["form-group-header bg-muted/50 px-4 py-2.5 border-b", e.headerClass])
-                }, [
-                  p("h3", at, j(Q.value[s.originalIndex]), 1),
-                  W.value?.[s.originalIndex] ? (n(), c("p", lt, j(W.value[s.originalIndex]), 1)) : d("", !0)
-                ], 2)) : d("", !0),
-                p("div", {
-                  class: v(["form-group-body", [e.groupBodyClass, q.value.length > 1 ? "p-4.5" : ""]])
+                  e.groupBodyClass,
+                  e.headerClass,
+                  e.className,
+                  e.isUpdate,
+                  D.value
+                ];
+                if (W && W.key === s.originalIndex && Ye(W, fe)) return W;
+                const ge = (n(), c("div", {
+                  key: s.originalIndex,
+                  class: v([
+                    "form-group overflow-hidden bg-body",
+                    e.groupClass,
+                    H.value.length > 1 ? "border rounded" : ""
+                  ])
                 }, [
-                  k(J, {
-                    schema: s.schema,
-                    values: l(m),
-                    errors: l(x),
-                    fieldLoading: l(H),
-                    variant: V.value,
-                    size: I.value,
-                    rounded: N.value,
-                    className: e.className,
-                    isUpdate: e.isUpdate,
-                    showRequiredAsterisk: M.value,
-                    isFieldVisible: l(R),
-                    isFieldDisabled: l(z),
-                    isFieldReadonly: l($),
-                    excludeTypes: P.value ? ["thumbnailSelector"] : [],
-                    onChange: G,
-                    onAddonAction: t[2] || (t[2] = (f) => g("onAddonAction", f))
-                  }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
-                ], 2)
-              ], 2))), 128))
+                  J.value?.[s.originalIndex] ? (n(), c("div", {
+                    key: 0,
+                    class: v(["form-group-header bg-muted/50 px-4 py-2.5 border-b", e.headerClass])
+                  }, [
+                    p("h3", ut, j(J.value[s.originalIndex]), 1),
+                    Q.value?.[s.originalIndex] ? (n(), c("p", dt, j(Q.value[s.originalIndex]), 1)) : d("", !0)
+                  ], 2)) : d("", !0),
+                  p("div", {
+                    class: v(["form-group-body", [e.groupBodyClass, H.value.length > 1 ? "p-4.5" : ""]])
+                  }, [
+                    k(X, {
+                      schema: s.schema,
+                      values: l(m),
+                      errors: l(b),
+                      fieldLoading: l(V),
+                      variant: U.value,
+                      size: I.value,
+                      rounded: z.value,
+                      className: e.className,
+                      isUpdate: e.isUpdate,
+                      showRequiredAsterisk: D.value,
+                      isFieldVisible: l(R),
+                      isFieldDisabled: l(B),
+                      isFieldReadonly: l($),
+                      excludeTypes: P.value ? ["thumbnailSelector"] : [],
+                      onChange: M,
+                      onAddonAction: a[2] || (a[2] = (qe) => f("onAddonAction", qe))
+                    }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
+                  ], 2)
+                ], 2));
+                return ge.memo = fe, ge;
+              }, a, 3), 128))
             ], 2)) : T.value && !u.value && e.groupLayout === "accordion" ? (n(), c("div", {
               key: 2,
               class: v(e.groupContainerClass)
             }, [
-              k(je, {
+              k(Xe, {
                 variant: "solid",
-                items: q.value.map((s) => ({
-                  id: `form-group-${s.originalIndex}`,
-                  title: Q.value?.[s.originalIndex] || "",
-                  description: W.value?.[s.originalIndex] || void 0
-                })),
+                items: Ae.value,
                 "allow-multiple": "",
                 class: v(e.groupClass)
               }, {
-                content: fe(({ item: s }) => [
-                  k(J, {
-                    schema: q.value.find((f) => `form-group-${f.originalIndex}` === s.id)?.schema || [],
+                content: be(({ item: s }) => [
+                  k(X, {
+                    schema: Te.value.get(s.id) || [],
                     values: l(m),
-                    errors: l(x),
-                    fieldLoading: l(H),
-                    variant: V.value,
+                    errors: l(b),
+                    fieldLoading: l(V),
+                    variant: U.value,
                     size: I.value,
-                    rounded: N.value,
+                    rounded: z.value,
                     className: e.className,
                     isUpdate: e.isUpdate,
-                    showRequiredAsterisk: M.value,
+                    showRequiredAsterisk: D.value,
                     isFieldVisible: l(R),
-                    isFieldDisabled: l(z),
+                    isFieldDisabled: l(B),
                     isFieldReadonly: l($),
                     excludeTypes: P.value ? ["thumbnailSelector"] : [],
-                    onChange: G,
-                    onAddonAction: t[3] || (t[3] = (f) => g("onAddonAction", f))
+                    onChange: M,
+                    onAddonAction: a[5] || (a[5] = (x) => f("onAddonAction", x))
                   }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
                 ]),
                 _: 1
               }, 8, ["items", "class"])
-            ], 2)) : u.value ? (n(), c("div", it, [
+            ], 2)) : u.value ? (n(), c("div", ct, [
               e.tabs?.[r.value] ? (n(), c("div", {
                 key: 0,
                 class: v(["form-step-header mb-6", e.headerClass])
               }, [
-                p("h2", st, j(e.tabs[r.value].title), 1),
-                e.tabs[r.value].description ? (n(), c("p", nt, j(e.tabs[r.value].description), 1)) : d("", !0)
+                p("h2", vt, j(e.tabs[r.value].title), 1),
+                e.tabs[r.value].description ? (n(), c("p", mt, j(e.tabs[r.value].description), 1)) : d("", !0)
               ], 2)) : d("", !0),
-              k(J, {
-                schema: se.value,
+              k(X, {
+                schema: ne.value,
                 values: l(m),
-                errors: l(x),
-                fieldLoading: l(H),
-                variant: V.value,
+                errors: l(b),
+                fieldLoading: l(V),
+                variant: U.value,
                 size: I.value,
-                rounded: N.value,
+                rounded: z.value,
                 className: e.className,
                 isUpdate: e.isUpdate,
-                showRequiredAsterisk: M.value,
+                showRequiredAsterisk: D.value,
                 isFieldVisible: l(R),
-                isFieldDisabled: l(z),
+                isFieldDisabled: l(B),
                 isFieldReadonly: l($),
                 excludeTypes: P.value ? ["thumbnailSelector"] : [],
-                onChange: G,
-                onAddonAction: t[4] || (t[4] = (s) => g("onAddonAction", s))
+                onChange: M,
+                onAddonAction: a[6] || (a[6] = (s) => f("onAddonAction", s))
               }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
-            ])) : d("", !0) : (n(), c("div", et, [
-              k(J, {
+            ])) : d("", !0) : (n(), c("div", ot, [
+              k(X, {
                 schema: e.schema,
                 values: l(m),
-                errors: l(x),
-                fieldLoading: l(H),
-                variant: V.value,
+                errors: l(b),
+                fieldLoading: l(V),
+                variant: U.value,
                 size: I.value,
-                rounded: N.value,
+                rounded: z.value,
                 className: e.className,
                 isUpdate: e.isUpdate,
-                showRequiredAsterisk: M.value,
+                showRequiredAsterisk: D.value,
                 isFieldVisible: l(R),
-                isFieldDisabled: l(z),
+                isFieldDisabled: l(B),
                 isFieldReadonly: l($),
                 excludeTypes: P.value ? ["thumbnailSelector"] : [],
                 layout: i.layout,
-                onChange: G,
-                onAddonAction: t[1] || (t[1] = (s) => g("onAddonAction", s))
+                onChange: M,
+                onAddonAction: a[1] || (a[1] = (s) => f("onAddonAction", s))
               }, {
-                default: fe(() => [
-                  i.layout === "inline" && e.footer ? (n(), c("div", tt, [
-                    Y.value ? (n(), C(F, {
+                default: be(() => [
+                  i.layout === "inline" && e.footer ? (n(), c("div", rt, [
+                    Y.value ? (n(), C(S, {
                       key: 0,
                       type: "button",
                       variant: "outline",
                       text: e.cancelText,
-                      disabled: e.loading || l(h),
-                      onClick: X
+                      disabled: e.loading || l(y),
+                      onClick: Z
                     }, null, 8, ["text", "disabled"])) : d("", !0),
-                    k(F, O({
+                    k(S, O({
                       type: "submit",
                       variant: "primary",
                       text: e.submitText
                     }, e.submitProps, {
-                      loading: e.loading || l(h)
+                      loading: e.loading || l(y)
                     }), null, 16, ["text", "loading"])
                   ])) : d("", !0)
                 ]),
                 _: 1
               }, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes", "layout"])
             ])),
-            me(a.$slots, "default", {
+            he(t.$slots, "default", {
               values: l(m),
-              errors: l(x),
-              isSubmitting: l(h),
+              errors: l(b),
+              isSubmitting: l(y),
               handleSubmit: w
             }, void 0, !0)
           ], 2)
@@ -502,7 +531,7 @@ const We = ["onKeydown"], Xe = { class: "flex items-center gap-3" }, Ze = { clas
       e.footer && !e.schemaLoading && i.layout !== "inline" ? (n(), c("div", {
         key: 2,
         ref_key: "footerRef",
-        ref: S,
+        ref: F,
         class: v([
           "form-footer items-center gap-3 z-20 rounded-b-md!",
           e.isPage ? "flex sm:hidden" : "flex",
@@ -512,77 +541,77 @@ const We = ["onKeydown"], Xe = { class: "flex items-center gap-3" }, Ze = { clas
           // `sticky bottom-0` anchors the footer to the bottom of the nearest scrollable ancestor
           // (the modal's overflow-y-auto body), keeping it visible at all times without leaving
           // the normal document flow (unlike `fixed` which would escape the modal bounds).
-          U.value ? "sticky bottom-0  -mx-0.5 px-0.5 mt-4" : i.layout !== "inline" ? "mt-6" : "",
+          L.value ? "sticky bottom-0  -mx-0.5 px-0.5 mt-4" : i.layout !== "inline" ? "mt-6" : "",
           // Show the separator for modal/explicit sticky mode, or when the default
           // auto-sticky footer is active because its scroll container overflows.
-          ke.value ? "border-t border-border/75 bg-body pt-3 pb-3 mt-6" : "",
+          we.value ? "border-t border-border/75 bg-body pt-3 pb-3 mt-6" : "",
           // Inside modal: extend footer flush to modal edge padding
-          B.value && i.layout !== "inline" ? "-mx-4 px-4 pb-3! mt-7.5!" : "",
+          E.value && i.layout !== "inline" ? "-mx-4 px-4 pb-3! mt-7.5!" : "",
           i.layout === "inline" ? "mt-0 shrink-0" : ""
         ])
       }, [
-        u.value && (Y.value || e.isUpdate && !L.value) ? (n(), c("div", ot, [
-          Y.value ? (n(), C(F, {
+        u.value && (Y.value || e.isUpdate && !N.value) ? (n(), c("div", ft, [
+          Y.value ? (n(), C(S, {
             key: 0,
             type: "button",
             variant: "outline",
             text: e.cancelText,
-            disabled: e.loading || l(h),
-            onClick: X
+            disabled: e.loading || l(y),
+            onClick: Z
           }, null, 8, ["text", "disabled"])) : d("", !0),
-          e.isUpdate && !L.value ? (n(), C(F, O({
+          e.isUpdate && !N.value ? (n(), C(S, O({
             key: 1,
             type: "button",
             variant: "primary",
             text: e.submitText
           }, e.submitProps, {
-            loading: e.loading || l(h),
+            loading: e.loading || l(y),
             onClick: w
           }), null, 16, ["text", "loading"])) : d("", !0)
         ])) : d("", !0),
         p("div", {
           class: v(["flex gap-3 items-center", [
             u.value && "ml-auto",
-            !u.value || L.value ? "w-full justify-end" : ""
+            !u.value || N.value ? "w-full justify-end" : ""
           ]])
         }, [
-          Y.value && !u.value ? (n(), C(F, {
+          Y.value && !u.value ? (n(), C(S, {
             key: 0,
             type: "button",
             variant: "outline",
             text: e.cancelText,
-            disabled: e.loading || l(h),
-            onClick: X
+            disabled: e.loading || l(y),
+            onClick: Z
           }, null, 8, ["text", "disabled"])) : d("", !0),
-          u.value && ue.value ? (n(), C(F, {
+          u.value && de.value ? (n(), C(S, {
             key: 1,
             type: "button",
             variant: "outline",
             icon: "lucide:arrow-left",
             text: "Previous",
-            onClick: Ue
+            onClick: Ne
           })) : d("", !0),
-          u.value && !L.value ? (n(), C(F, {
+          u.value && !N.value ? (n(), C(S, {
             key: 2,
             type: "button",
             variant: e.isUpdate ? "outline" : "primary",
             text: "Next",
             iconRight: "lucide:arrow-right",
-            onClick: de
+            onClick: ce
           }, null, 8, ["variant"])) : d("", !0),
-          !u.value || L.value ? (n(), C(F, O({
+          !u.value || N.value ? (n(), C(S, O({
             key: 3,
             type: "submit",
             variant: "primary",
             text: e.submitText
           }, e.submitProps, {
-            loading: e.loading || l(h)
+            loading: e.loading || l(y)
           }), null, 16, ["text", "loading"])) : d("", !0)
         ], 2)
       ], 2)) : d("", !0)
-    ], 42, We));
+    ], 42, lt));
   }
 });
 export {
-  kt as default
+  Pt as default
 };