vlite3 1.2.7 → 1.2.8

package/components/Form/Form.vue2.js

@@ -1,28 +1,28 @@
-import { defineComponent as pe, inject as Se, computed as r, onMounted as te, onUnmounted as O, ref as K, watch as ae, openBlock as s, createElementBlock as d, withKeys as le, withModifiers as J, normalizeClass as m, createElementVNode as f, createVNode as T, mergeProps as M, toDisplayString as z, unref as t, renderSlot as ie, createCommentVNode as c, createBlock as C, Fragment as Ce, renderList as Fe } from "vue";
-import { useForm as we } from "./composables/useForm.js";
+import { defineComponent as we, inject as Ae, computed as r, onMounted as ae, onUnmounted as O, ref as E, watch as le, openBlock as s, createElementBlock as d, withKeys as ie, withModifiers as J, normalizeClass as m, createElementVNode as f, createVNode as T, mergeProps as K, toDisplayString as z, unref as t, renderSlot as se, createCommentVNode as c, createBlock as C, Fragment as Te, renderList as Re } from "vue";
+import { useForm as Pe } from "./composables/useForm.js";
 import Q from "./FormFields.vue.js";
-import Ae from "./FormField.vue.js";
-import Te from "./FormSkeleton.vue.js";
+import Ue from "./FormField.vue.js";
+import Ve from "./FormSkeleton.vue.js";
 import R from "../Button.vue.js";
-import Re from "../BackButton.vue.js";
-import Pe from "../Timeline/Timeline.vue.js";
+import ze from "../BackButton.vue.js";
+import Be from "../Timeline/Timeline.vue.js";
 import "@iconify/vue";
-import { $t as Ue } from "../../utils/i18n.js";
-import { useVLiteConfig as Ve } from "../../core/config.js";
-import { resolveFieldType as ze } from "./utils/form.utils.js";
-const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { class: "flex items-center gap-2 shrink-0" }, De = {
+import { $t as Le } from "../../utils/i18n.js";
+import { useVLiteConfig as Ne } from "../../core/config.js";
+import { resolveFieldType as De } from "./utils/form.utils.js";
+const qe = ["onKeydown"], He = { class: "flex items-center gap-3" }, $e = { class: "flex items-center gap-2 shrink-0" }, Ie = {
   key: 0,
   class: "w-full order-first lg:order-last lg:min-w-100 lg:max-w-[380px] shrink-0"
-}, qe = { key: 0 }, He = { class: "text-base font-semibold text-foreground" }, $e = {
+}, Ee = { key: 0 }, Ke = { class: "text-base font-semibold text-foreground" }, Me = {
   key: 0,
   class: "text-sm text-muted-foreground mt-1"
-}, Ie = {
+}, Ge = {
   key: 2,
   class: "form-step"
-}, Ke = { class: "text-lg font-semibold text-foreground" }, Me = {
+}, je = { class: "text-lg font-semibold text-foreground" }, Oe = {
   key: 0,
   class: "text-sm text-muted-foreground mt-1"
-}, Ge = { class: "flex gap-3 items-center" }, at = /* @__PURE__ */ pe({
+}, Je = { class: "flex gap-3 items-center" }, nt = /* @__PURE__ */ we({
   __name: "Form",
   props: {
     schema: {},
@@ -62,126 +62,140 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
     backButtonPath: {}
   },
   emits: ["onSubmit", "onCancel", "onStepChange", "onAddonAction", "onBack"],
-  setup(e, { emit: se }) {
-    const l = e, h = se, v = Se("modal-context", null), ne = Ve(), B = r(() => ne?.components?.form || {}), L = r(() => l.variant ?? B.value.variant ?? "outline"), N = r(() => l.size ?? B.value.size ?? "md"), D = r(() => l.rounded ?? B.value.rounded ?? "md"), G = r(
+  setup(e, { expose: ne, emit: oe }) {
+    const l = e, b = oe, v = Ae("modal-context", null), re = Ne(), B = r(() => re?.components?.form || {}), L = r(() => l.variant ?? B.value.variant ?? "outline"), N = r(() => l.size ?? B.value.size ?? "md"), D = r(() => l.rounded ?? B.value.rounded ?? "md"), M = r(
       () => l.showRequiredAsterisk ?? B.value.showRequiredAsterisk ?? !0
-    ), oe = r(() => l.showCancel || !!v), F = r(() => !!v), P = r(() => l.stickyFooter || F.value);
-    te(() => {
+    ), ue = r(() => l.showCancel || !!v), F = r(() => !!v), P = r(() => l.stickyFooter || F.value);
+    ae(() => {
       l.footer && F.value && v?.registerFormFooter?.(!0);
     }), O(() => {
       F.value && v?.registerFormFooter?.(!1);
     });
-    const re = K(null), j = K(null), W = K(!1);
-    let E = null;
-    te(() => {
-      j.value && (E = new IntersectionObserver(
+    const de = E(null), G = E(null), W = E(!1);
+    let j = null;
+    ae(() => {
+      G.value && (j = new IntersectionObserver(
         ([a]) => {
           W.value = !a.isIntersecting;
         },
         { threshold: 0 }
-      ), E.observe(j.value));
+      ), j.observe(G.value));
     }), O(() => {
-      E?.disconnect();
+      j?.disconnect();
     });
-    const w = r(() => !l.schema || l.schema.length === 0 ? !1 : Array.isArray(l.schema[0])), u = r(() => l.tabs && l.tabs.length > 0 && w.value), n = K(0), X = r(() => l.tabs ? l.tabs.map((a, i) => ({
+    const w = r(() => !l.schema || l.schema.length === 0 ? !1 : Array.isArray(l.schema[0])), u = r(() => l.tabs && l.tabs.length > 0 && w.value), n = E(0), X = r(() => l.tabs ? l.tabs.map((a, i) => ({
       id: a.id?.toString() || i.toString(),
       title: a.title,
       icon: a.icon,
       description: a.description,
       status: i < n.value ? "completed" : i === n.value ? "current" : "upcoming"
-    })) : []), x = r(() => w.value ? l.schema : [l.schema]), Y = r(() => u.value ? x.value[n.value] || [] : []), g = r(() => u.value ? null : (w.value ? l.schema.flat() : l.schema).find((i) => ze(i, {
-      values: b.value,
-      globalValues: b.value,
+    })) : []), S = r(() => w.value ? l.schema : [l.schema]), Y = r(() => u.value ? S.value[n.value] || [] : []), g = r(() => u.value ? null : (w.value ? l.schema.flat() : l.schema).find((i) => De(i, {
+      values: h.value,
+      globalValues: h.value,
       isUpdate: l.isUpdate
     }) === "thumbnailSelector") ?? null), A = r(() => !!g.value), {
-      formValues: b,
-      errors: k,
-      isSubmitting: p,
+      formValues: h,
+      errors: y,
+      isSubmitting: x,
       fieldLoading: q,
-      handleFieldChange: ue,
-      validateField: de,
-      validateAll: ce,
+      handleFieldChange: ce,
+      validateField: me,
+      validateAll: Z,
       isFieldVisible: U,
       isFieldDisabled: V,
       isFieldReadonly: H,
-      handleSubmit: me,
-      reinitialize: ve
-    } = we({
+      handleSubmit: ve,
+      reinitialize: fe,
+      resetForm: ge,
+      setFieldError: he,
+      clearErrors: be
+    } = Pe({
       schema: l.schema,
       values: l.values,
       isUpdate: l.isUpdate,
       folderId: l.folderId,
       emitFields: l.emitFields,
       onSubmit: (a) => {
-        h("onSubmit", a, v?.close || (() => {
+        b("onSubmit", a, v?.close || (() => {
         }));
       }
     });
-    ae(
-      () => l.loading || p.value,
+    le(
+      () => l.loading || x.value,
       (a) => {
         v?.setSubmitting && v.setSubmitting(a);
       },
       { immediate: !0 }
     ), O(() => {
       v?.setSubmitting && v.setSubmitting(!1);
-    }), ae(
+    }), le(
       [() => l.schema, () => l.values, () => l.schemaLoading],
       ([a, i, o]) => {
-        o || ve(a, i);
+        o || fe(a, i);
       }
     );
     const $ = (a, i) => {
-      ue(a, i.value, i.data);
-    }, fe = async () => {
+      ce(a, i.value, i.data);
+    }, ye = async () => {
       if (!u.value) return !0;
       const a = Y.value;
       let i = !0;
       for (const o of a) {
         if (!U(o) || V(o)) continue;
-        await de(o) && (i = !1);
+        await me(o) && (i = !1);
       }
       return i;
-    }, ge = r(() => u.value ? n.value < x.value.length - 1 : !1), Z = r(() => u.value ? n.value > 0 : !1), I = r(() => u.value ? n.value === x.value.length - 1 : !0), _ = async () => {
-      !ge.value || !await fe() || (n.value++, h("onStepChange", n.value));
-    }, he = () => {
-      Z.value && (n.value--, h("onStepChange", n.value));
-    }, be = (a, i) => {
-      i <= n.value && (n.value = i, h("onStepChange", n.value));
-    }, S = async () => {
+    }, xe = r(() => u.value ? n.value < S.value.length - 1 : !1), _ = r(() => u.value ? n.value > 0 : !1), I = r(() => u.value ? n.value === S.value.length - 1 : !0), ee = async () => {
+      !xe.value || !await ye() || (n.value++, b("onStepChange", n.value));
+    }, ke = () => {
+      _.value && (n.value--, b("onStepChange", n.value));
+    }, pe = (a, i) => {
+      i <= n.value && (n.value = i, b("onStepChange", n.value));
+    }, k = async () => {
       if (u.value) {
         if (!I.value && !l.isUpdate) {
-          await _();
+          await ee();
           return;
         }
-        if (!await ce()) {
-          const i = x.value.findIndex(
-            (o) => o.some((y) => !!k.value[y.name])
+        if (!await Z()) {
+          const i = S.value.findIndex(
+            (o) => o.some((p) => !!y.value[p.name])
           );
-          i !== -1 && i !== n.value && (n.value = i, h("onStepChange", n.value));
+          i !== -1 && i !== n.value && (n.value = i, b("onStepChange", n.value));
           return;
         }
       }
       try {
-        await me();
+        await ve();
       } catch {
       }
-    }, ye = (a) => {
+    }, Se = (a) => {
       if (a.key !== "Enter") return;
       const o = a.target.tagName.toLowerCase();
-      o !== "textarea" && o !== "button" && (a.preventDefault(), S());
-    }, ee = (a) => {
-      (a.metaKey || a.ctrlKey) && a.key === "s" && (a.preventDefault(), S());
-    }, xe = () => {
-      h("onCancel"), v && v?.close?.();
+      o !== "textarea" && o !== "button" && (a.preventDefault(), k());
+    }, te = (a) => {
+      (a.metaKey || a.ctrlKey) && a.key === "s" && (a.preventDefault(), k());
+    };
+    ne({
+      formValues: h,
+      errors: y,
+      isSubmitting: x,
+      handleSubmit: k,
+      validateAll: Z,
+      resetForm: ge,
+      setFieldError: he,
+      clearErrors: be
+    });
+    const Ce = () => {
+      b("onCancel"), v && v?.close?.();
     };
     return (a, i) => (s(), d("form", {
       class: m(["form-container ", l.class, e.isPage && "pb-10"]),
-      onSubmit: J(S, ["prevent"]),
+      onSubmit: J(k, ["prevent"]),
       onKeydown: [
-        ye,
-        le(J(ee, ["meta", "prevent"]), ["s"]),
-        le(J(ee, ["ctrl", "prevent"]), ["s"])
+        Se,
+        ie(J(te, ["meta", "prevent"]), ["s"]),
+        ie(J(te, ["ctrl", "prevent"]), ["s"])
       ]
     }, [
       e.isPage ? (s(), d("div", {
@@ -191,29 +205,29 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
           e.pageHeaderClass
         ])
       }, [
-        f("div", Le, [
-          T(Re, M(e.backButtonProps, {
+        f("div", He, [
+          T(ze, K(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"]),
           f("h1", {
             class: m(["text-foreground max-sm:text-lg text-fs-5 truncate", e.pageTitleClass])
-          }, z(e.pageTitleI18n ? t(Ue)(e.pageTitleI18n) : e.pageTitle), 3)
+          }, z(e.pageTitleI18n ? t(Le)(e.pageTitleI18n) : e.pageTitle), 3)
         ]),
-        f("div", Ne, [
-          ie(a.$slots, "header-actions", {
-            values: t(b),
-            isSubmitting: t(p),
-            handleSubmit: S
+        f("div", $e, [
+          se(a.$slots, "header-actions", {
+            values: t(h),
+            isSubmitting: t(x),
+            handleSubmit: k
           }, void 0, !0),
-          T(R, M({
+          T(R, K({
             type: "button",
             variant: e.isUpdate ? "outline" : "primary",
             text: e.submitText
           }, e.submitProps, {
             disabled: e.schemaLoading,
-            loading: e.loading || t(p),
-            onClick: S,
+            loading: e.loading || t(x),
+            onClick: k,
             class: "max-sm:hidden"
           }), null, 16, ["variant", "text", "disabled", "loading"])
         ])
@@ -222,38 +236,38 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
         key: 1,
         class: m(["form-timeline", e.timelineTextPosition == "right" ? "mb-2" : "mb-8"])
       }, [
-        T(t(Pe), {
+        T(t(Be), {
           steps: X.value,
           activeStep: n.value,
           direction: "horizontal",
           textPosition: e.timelineTextPosition,
           clickable: !0,
-          onStepClick: be
+          onStepClick: pe
         }, null, 8, ["steps", "activeStep", "textPosition"])
       ], 2)) : c("", !0),
       f("div", {
         class: m(e.footer && P.value ? "pb-2" : "")
       }, [
-        e.schemaLoading ? (s(), C(Te, {
+        e.schemaLoading ? (s(), C(Ve, {
           key: 0,
           isGrouped: w.value
         }, null, 8, ["isGrouped"])) : (s(), d("div", {
           key: 1,
           class: m(A.value ? "flex flex-col lg:flex-row gap-10 lg:gap-16" : "")
         }, [
-          A.value ? (s(), d("div", De, [
-            g.value && t(U)(g.value) ? (s(), C(Ae, {
+          A.value ? (s(), d("div", Ie, [
+            g.value && t(U)(g.value) ? (s(), C(Ue, {
               key: 0,
               field: g.value,
-              value: t(b)[g.value.name],
-              values: t(b),
-              errors: t(k),
+              value: t(h)[g.value.name],
+              values: t(h),
+              errors: t(y),
               variant: L.value,
               size: N.value,
               rounded: D.value,
               disabled: t(V)(g.value),
               readonly: t(H)(g.value),
-              error: t(k)[g.value.name] || "",
+              error: t(y)[g.value.name] || "",
               isUpdate: e.isUpdate,
               loading: t(q)[g.value?.name],
               onChange: i[0] || (i[0] = (o) => $(g.value.name, o))
@@ -266,101 +280,101 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
               key: 1,
               class: m(["form-groups space-y-6", e.groupContainerClass])
             }, [
-              (s(!0), d(Ce, null, Fe(x.value, (o, y) => (s(), d("div", {
-                key: y,
+              (s(!0), d(Te, null, Re(S.value, (o, p) => (s(), d("div", {
+                key: p,
                 class: m([
                   "form-group overflow-hidden bg-body",
                   e.groupClass,
-                  x.value?.length > 1 ? "border rounded" : ""
+                  S.value?.length > 1 ? "border rounded" : ""
                 ])
               }, [
-                e.groupsHeadings?.[y] ? (s(), d("div", {
+                e.groupsHeadings?.[p] ? (s(), d("div", {
                   key: 0,
                   class: m(["form-group-header bg-muted/50 px-4 py-2.5 border-b", e.headerClass])
                 }, [
-                  f("h3", He, z(e.groupsHeadings[y]), 1),
-                  e.groupHeadingsDescription?.[y] ? (s(), d("p", $e, z(e.groupHeadingsDescription[y]), 1)) : c("", !0)
+                  f("h3", Ke, z(e.groupsHeadings[p]), 1),
+                  e.groupHeadingsDescription?.[p] ? (s(), d("p", Me, z(e.groupHeadingsDescription[p]), 1)) : c("", !0)
                 ], 2)) : c("", !0),
                 f("div", {
-                  class: m(["form-group-body", [e.groupBodyClass, x.value?.length > 1 ? "p-4.5" : ""]])
+                  class: m(["form-group-body", [e.groupBodyClass, S.value?.length > 1 ? "p-4.5" : ""]])
                 }, [
                   T(Q, {
                     schema: o,
-                    values: t(b),
-                    errors: t(k),
+                    values: t(h),
+                    errors: t(y),
                     fieldLoading: t(q),
                     variant: L.value,
                     size: N.value,
                     rounded: D.value,
                     className: e.className,
                     isUpdate: e.isUpdate,
-                    showRequiredAsterisk: G.value,
+                    showRequiredAsterisk: M.value,
                     isFieldVisible: t(U),
                     isFieldDisabled: t(V),
                     isFieldReadonly: t(H),
                     excludeTypes: A.value ? ["thumbnailSelector"] : [],
                     onChange: $,
-                    onAddonAction: i[2] || (i[2] = (ke) => h("onAddonAction", ke))
+                    onAddonAction: i[2] || (i[2] = (Fe) => b("onAddonAction", Fe))
                   }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
                 ], 2)
               ], 2))), 128))
-            ], 2)) : u.value ? (s(), d("div", Ie, [
+            ], 2)) : u.value ? (s(), d("div", Ge, [
               e.tabs?.[n.value] ? (s(), d("div", {
                 key: 0,
                 class: m(["form-step-header mb-6", e.headerClass])
               }, [
-                f("h2", Ke, z(e.tabs[n.value].title), 1),
-                e.tabs[n.value].description ? (s(), d("p", Me, z(e.tabs[n.value].description), 1)) : c("", !0)
+                f("h2", je, z(e.tabs[n.value].title), 1),
+                e.tabs[n.value].description ? (s(), d("p", Oe, z(e.tabs[n.value].description), 1)) : c("", !0)
               ], 2)) : c("", !0),
               T(Q, {
                 schema: Y.value,
-                values: t(b),
-                errors: t(k),
+                values: t(h),
+                errors: t(y),
                 fieldLoading: t(q),
                 variant: L.value,
                 size: N.value,
                 rounded: D.value,
                 className: e.className,
                 isUpdate: e.isUpdate,
-                showRequiredAsterisk: G.value,
+                showRequiredAsterisk: M.value,
                 isFieldVisible: t(U),
                 isFieldDisabled: t(V),
                 isFieldReadonly: t(H),
                 excludeTypes: A.value ? ["thumbnailSelector"] : [],
                 onChange: $,
-                onAddonAction: i[3] || (i[3] = (o) => h("onAddonAction", o))
+                onAddonAction: i[3] || (i[3] = (o) => b("onAddonAction", o))
               }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
-            ])) : c("", !0) : (s(), d("div", qe, [
+            ])) : c("", !0) : (s(), d("div", Ee, [
               T(Q, {
                 schema: e.schema,
-                values: t(b),
-                errors: t(k),
+                values: t(h),
+                errors: t(y),
                 fieldLoading: t(q),
                 variant: L.value,
                 size: N.value,
                 rounded: D.value,
                 className: e.className,
                 isUpdate: e.isUpdate,
-                showRequiredAsterisk: G.value,
+                showRequiredAsterisk: M.value,
                 isFieldVisible: t(U),
                 isFieldDisabled: t(V),
                 isFieldReadonly: t(H),
                 excludeTypes: A.value ? ["thumbnailSelector"] : [],
                 onChange: $,
-                onAddonAction: i[1] || (i[1] = (o) => h("onAddonAction", o))
+                onAddonAction: i[1] || (i[1] = (o) => b("onAddonAction", o))
               }, null, 8, ["schema", "values", "errors", "fieldLoading", "variant", "size", "rounded", "className", "isUpdate", "showRequiredAsterisk", "isFieldVisible", "isFieldDisabled", "isFieldReadonly", "excludeTypes"])
             ])),
-            ie(a.$slots, "default", {
-              values: t(b),
-              errors: t(k),
-              isSubmitting: t(p),
-              handleSubmit: S
+            se(a.$slots, "default", {
+              values: t(h),
+              errors: t(y),
+              isSubmitting: t(x),
+              handleSubmit: k
             }, void 0, !0)
           ], 2)
         ], 2)),
         f("div", {
           ref_key: "sentinelRef",
-          ref: j,
+          ref: G,
           class: "form-scroll-sentinel h-px w-full",
           "aria-hidden": "true"
         }, null, 512)
@@ -368,7 +382,7 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
       e.footer && !e.schemaLoading ? (s(), d("div", {
         key: 2,
         ref_key: "footerRef",
-        ref: re,
+        ref: de,
         class: m([
           "form-footer items-center gap-3 z-20 rounded-b-md!",
           e.isPage ? "flex sm:hidden" : "flex",
@@ -388,35 +402,35 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
           !P.value && !F.value ? "mt-6" : ""
         ])
       }, [
-        f("div", Ge, [
-          oe.value ? (s(), C(R, {
+        f("div", Je, [
+          ue.value ? (s(), C(R, {
             key: 0,
             type: "button",
             variant: "outline",
             text: e.cancelText,
-            disabled: e.loading || t(p),
-            onClick: xe
+            disabled: e.loading || t(x),
+            onClick: Ce
           }, null, 8, ["text", "disabled"])) : c("", !0),
-          u.value && e.isUpdate && !I.value ? (s(), C(R, M({
+          u.value && e.isUpdate && !I.value ? (s(), C(R, K({
             key: 1,
             type: "button",
             variant: "primary",
             text: e.submitText
           }, e.submitProps, {
-            loading: e.loading || t(p),
-            onClick: S
+            loading: e.loading || t(x),
+            onClick: k
           }), null, 16, ["text", "loading"])) : c("", !0)
         ]),
         f("div", {
           class: m(["flex gap-3 items-center", u.value && "ml-auto"])
         }, [
-          u.value && Z.value ? (s(), C(R, {
+          u.value && _.value ? (s(), C(R, {
             key: 0,
             type: "button",
             variant: "outline",
             icon: "lucide:arrow-left",
             text: "Previous",
-            onClick: he
+            onClick: ke
           })) : c("", !0),
           u.value && !I.value ? (s(), C(R, {
             key: 1,
@@ -424,21 +438,21 @@ const Be = ["onKeydown"], Le = { class: "flex items-center gap-3" }, Ne = { clas
             variant: e.isUpdate ? "outline" : "primary",
             text: "Next",
             iconRight: "lucide:arrow-right",
-            onClick: _
+            onClick: ee
           }, null, 8, ["variant"])) : c("", !0),
-          !u.value || I.value ? (s(), C(R, M({
+          !u.value || I.value ? (s(), C(R, K({
             key: 2,
             type: "submit",
             variant: "primary",
             text: e.submitText
           }, e.submitProps, {
-            loading: e.loading || t(p)
+            loading: e.loading || t(x)
           }), null, 16, ["text", "loading"])) : c("", !0)
         ], 2)
       ], 2)) : c("", !0)
-    ], 42, Be));
+    ], 42, qe));
   }
 });
 export {
-  at as default
+  nt as default
 };