@volverjs/form-vue 0.0.10-beta.3 → 0.0.10-beta.5

package/dist/index.es.js

@@ -1,77 +1,77 @@
-import { defineComponent as $, computed as V, onMounted as z, onBeforeUnmount as q, inject as S, toRefs as A, watch as y, provide as D, readonly as w, resolveComponent as h, defineAsyncComponent as R, h as x, ref as g, isProxy as H, toRaw as Q, withModifiers as X } from "vue";
-import { watchThrottled as Y } from "@vueuse/core";
-import { ZodObject as C, ZodDefault as P, ZodNullable as F, ZodSchema as T, ZodEffects as ee } from "zod";
+import { defineComponent as E, computed as b, onMounted as R, onBeforeUnmount as q, inject as S, toRefs as I, watch as y, provide as $, readonly as w, resolveComponent as p, defineAsyncComponent as H, h as x, ref as g, isProxy as Q, toRaw as X, withModifiers as Y } from "vue";
+import { watchThrottled as D } from "@vueuse/core";
+import { ZodObject as L, ZodDefault as T, ZodNullable as j, ZodSchema as F, ZodEffects as ee } from "zod";
 function O(e) {
   return Array.isArray(e);
 }
 function te(e) {
   return typeof e < "u";
 }
-function L(e) {
+function N(e) {
   return e === null;
 }
-function _(e) {
+function W(e) {
   return typeof e == "object";
 }
-function B(e) {
+function _(e) {
   return typeof e == "string";
 }
 function k(e) {
   return typeof e > "u";
 }
-const re = /^[0-9]+$/, ae = ["__proto__", "prototype", "constructor"];
-function N(e, n, o) {
-  const l = te(o) ? o : void 0;
-  if (!_(e) || !B(n))
-    return l;
-  const a = W(n);
+const re = /^[0-9]+$/, ne = ["__proto__", "prototype", "constructor"];
+function A(e, o, s) {
+  const u = te(s) ? s : void 0;
+  if (!W(e) || !_(o))
+    return u;
+  const a = K(o);
   if (a.length !== 0) {
     for (const t of a) {
       if (t === "*")
         continue;
-      const u = function(s) {
-        return s.map((i) => k(i) || L(i) ? i : O(i) ? u(i) : i[t]);
+      const r = function(c) {
+        return c.map((l) => k(l) || N(l) ? l : O(l) ? r(l) : l[t]);
       };
-      if (O(e) && !re.test(t) ? e = u(e) : e = e[t], k(e) || L(e))
+      if (O(e) && !re.test(t) ? e = r(e) : e = e[t], k(e) || N(e))
         break;
     }
-    return k(e) ? l : e;
+    return k(e) ? u : e;
   }
 }
-function I(e, n, o) {
-  if (!_(e) || !B(n))
+function B(e, o, s) {
+  if (!W(e) || !_(o))
     return;
-  const l = W(n);
-  if (l.length === 0)
+  const u = K(o);
+  if (u.length === 0)
     return;
-  const a = l.length;
+  const a = u.length;
   for (let t = 0; t < a; t++) {
-    const u = l[t];
+    const r = u[t];
     if (t === a - 1) {
-      e[u] = o;
+      e[r] = s;
       return;
     }
-    if (u === "*" && O(e)) {
-      const s = l.slice(t + 1).join(".");
-      for (const i of e)
-        I(i, s, o);
+    if (r === "*" && O(e)) {
+      const c = u.slice(t + 1).join(".");
+      for (const l of e)
+        B(l, c, s);
       return;
     }
-    k(e[u]) && (e[u] = {}), e = e[u];
+    k(e[r]) && (e[r] = {}), e = e[r];
   }
 }
-function W(e) {
-  const n = e.split(/[.]|(?:\[(\d|\*)\])/).filter((o) => !!o);
-  return n.some((o) => ae.indexOf(o) !== -1) ? [] : n;
+function K(e) {
+  const o = e.split(/[.]|(?:\[(\d|\*)\])/).filter((s) => !!s);
+  return o.some((s) => ne.indexOf(s) !== -1) ? [] : o;
 }
-var c = /* @__PURE__ */ ((e) => (e.text = "text", e.number = "number", e.email = "email", e.password = "password", e.tel = "tel", e.url = "url", e.search = "search", e.date = "date", e.time = "time", e.datetimeLocal = "datetimeLocal", e.month = "month", e.week = "week", e.color = "color", e.select = "select", e.checkbox = "checkbox", e.radio = "radio", e.textarea = "textarea", e.radioGroup = "radioGroup", e.checkboxGroup = "checkboxGroup", e.combobox = "combobox", e.custom = "custom", e))(c || {});
-const ne = (e, n, o, l = {}) => $({
+var i = /* @__PURE__ */ ((e) => (e.text = "text", e.number = "number", e.email = "email", e.password = "password", e.tel = "tel", e.url = "url", e.search = "search", e.date = "date", e.time = "time", e.datetimeLocal = "datetimeLocal", e.month = "month", e.week = "week", e.color = "color", e.select = "select", e.checkbox = "checkbox", e.radio = "radio", e.textarea = "textarea", e.radioGroup = "radioGroup", e.checkboxGroup = "checkboxGroup", e.combobox = "combobox", e.custom = "custom", e))(i || {});
+const oe = (e, o, s, u = {}) => E({
   name: "FieldComponent",
   props: {
     type: {
       type: String,
-      validator: (a) => Object.values(c).includes(a),
-      default: c.custom
+      validator: (a) => Object.values(i).includes(a),
+      default: i.custom
     },
     is: {
       type: [Object, String],
@@ -96,126 +96,129 @@ const ne = (e, n, o, l = {}) => $({
   },
   emits: ["invalid", "valid", "update:formData", "update:modelValue"],
   expose: ["invalid", "invalidLabel", "errors"],
-  setup(a, { slots: t, emit: u }) {
-    const s = V({
+  setup(a, { slots: t, emit: r }) {
+    const c = b({
       get() {
-        if (r != null && r.modelValue)
-          return N(
-            Object(r.modelValue.value),
+        if (n != null && n.modelValue)
+          return A(
+            Object(n.modelValue.value),
             String(a.name)
           );
       },
       set(f) {
-        r != null && r.modelValue && (I(
-          Object(r.modelValue.value),
+        n != null && n.modelValue && (B(
+          Object(n.modelValue.value),
           String(a.name),
           f
-        ), u("update:modelValue", {
-          newValue: s.value,
-          formData: r == null ? void 0 : r.modelValue
+        ), r("update:modelValue", {
+          newValue: c.value,
+          formData: n == null ? void 0 : n.modelValue
         }));
       }
     });
-    z(() => {
-      s.value === void 0 && a.defaultValue !== void 0 && (s.value = a.defaultValue);
+    R(() => {
+      c.value === void 0 && a.defaultValue !== void 0 && (c.value = a.defaultValue);
     }), q(() => {
-      j(), J();
+      J(), U();
     });
-    const i = S(n, void 0);
-    i && i.fields.value.add(a.name);
-    const r = S(e), { props: m, name: v } = A(a), d = V(() => {
-      if (r != null && r.errors.value)
-        return N(r.errors.value, String(a.name));
-    }), p = V(() => {
+    const l = S(o, void 0);
+    l && l.fields.value.add(a.name);
+    const n = S(e), { props: m, name: v } = I(a), d = b(() => {
+      if (n != null && n.errors.value)
+        return A(n.errors.value, String(a.name));
+    }), h = b(() => {
       var f;
       return (f = d.value) == null ? void 0 : f._errors;
-    }), b = V(() => d.value !== void 0), j = y(b, () => {
-      b.value ? (u("invalid", p.value), i && i.errors.value.set(a.name, {
-        _errors: p.value
-      })) : (u("valid", s.value), i && i.errors.value.delete(
+    }), V = b(() => d.value !== void 0), J = y(V, () => {
+      V.value ? (r("invalid", h.value), l && l.errors.value.set(
+        a.name,
+        {
+          _errors: h.value
+        }
+      )) : (r("valid", c.value), l && l.errors.value.delete(
         a.name
       ));
-    }), J = y(
-      () => r == null ? void 0 : r.modelValue,
+    }), U = y(
+      () => n == null ? void 0 : n.modelValue,
       () => {
-        u("update:formData", r == null ? void 0 : r.modelValue);
+        r("update:formData", n == null ? void 0 : n.modelValue);
       },
       { deep: !0 }
-    ), E = (f) => {
-      s.value = f;
-    }, G = V(() => typeof m.value == "function" ? m.value(r == null ? void 0 : r.modelValue) : m.value), U = V(() => ({
-      ...G.value,
-      name: G.value.name ?? a.name,
-      invalid: b.value,
-      valid: a.showValid ? !!(!b.value && s.value) : void 0,
+    ), G = (f) => {
+      c.value = f;
+    }, C = b(() => typeof m.value == "function" ? m.value(n == null ? void 0 : n.modelValue) : m.value), z = b(() => ({
+      ...C.value,
+      name: C.value.name ?? a.name,
+      invalid: V.value,
+      valid: a.showValid ? !!(!V.value && c.value) : void 0,
       type: ((f) => {
         if ([
-          c.text,
-          c.number,
-          c.email,
-          c.password,
-          c.tel,
-          c.url,
-          c.search,
-          c.date,
-          c.time,
-          c.datetimeLocal,
-          c.month,
-          c.week,
-          c.color
+          i.text,
+          i.number,
+          i.email,
+          i.password,
+          i.tel,
+          i.url,
+          i.search,
+          i.date,
+          i.time,
+          i.datetimeLocal,
+          i.month,
+          i.week,
+          i.color
         ].includes(f))
           return f;
       })(a.type),
-      invalidLabel: p.value,
-      modelValue: s.value,
+      invalidLabel: h.value,
+      modelValue: c.value,
       errors: a.is ? d.value : void 0,
-      "onUpdate:modelValue": E
+      "onUpdate:modelValue": G
     }));
-    return D(o, {
+    return $(s, {
       name: w(v),
       errors: w(d)
-    }), { component: V(() => {
-      if (a.type === c.custom)
+    }), { component: b(() => {
+      if (a.type === i.custom)
         return {
           render() {
             var f;
             return ((f = t.default) == null ? void 0 : f.call(t, {
-              modelValue: s.value,
-              onUpdate: E,
-              invalid: b.value,
-              invalidLabel: p.value,
-              formData: r == null ? void 0 : r.modelValue.value,
-              formErrors: r == null ? void 0 : r.errors.value,
+              modelValue: c.value,
+              onUpdate: G,
+              invalid: V.value,
+              invalidLabel: h.value,
+              formData: n == null ? void 0 : n.modelValue.value,
+              formErrors: n == null ? void 0 : n.errors.value,
               errors: d.value
             })) ?? t.defalut;
           }
         };
-      if (!l.lazyLoad) {
+      if (!u.lazyLoad) {
         let f;
         switch (a.type) {
-          case c.select:
-            f = h("VvSelect");
+          case i.select:
+            f = p("VvSelect");
             break;
-          case c.checkbox:
-            f = h("VvCheckbox");
+          case i.checkbox:
+            f = p("VvCheckbox");
             break;
-          case c.radio:
-            f = h("VvRadio");
+          case i.radio:
+            f = p("VvRadio");
             break;
-          case c.textarea:
-            f = h("VvTextarea");
+          case i.textarea:
+            f = p("VvTextarea");
             break;
-          case c.radioGroup:
-            f = h("VvRadioGroup");
+          case i.radioGroup:
+            f = p("VvRadioGroup");
             break;
-          case c.checkboxGroup:
-            f = h("VvCheckboxGroup");
+          case i.checkboxGroup:
+            f = p("VvCheckboxGroup");
             break;
-          case c.combobox:
-            f = h("VvCombobox");
+          case i.combobox:
+            f = p("VvCombobox");
             break;
           default:
-            f = h("VvInputText");
+            f = p("VvInputText");
         }
         if (typeof f != "string")
           return f;
@@ -223,65 +226,65 @@ const ne = (e, n, o, l = {}) => $({
           `[form-vue warn]: ${f} not found, the component will be loaded asynchronously. To avoid this warning, please set "lazyLoad" option.`
         );
       }
-      return R(async () => {
-        switch (l.sideEffects && await Promise.resolve(l.sideEffects(a.type)), a.type) {
-          case c.textarea:
+      return H(async () => {
+        switch (u.sideEffects && await Promise.resolve(u.sideEffects(a.type)), a.type) {
+          case i.textarea:
             return import("@volverjs/ui-vue/vv-textarea");
-          case c.radio:
+          case i.radio:
             return import("@volverjs/ui-vue/vv-radio");
-          case c.radioGroup:
+          case i.radioGroup:
             return import("@volverjs/ui-vue/vv-radio-group");
-          case c.checkbox:
+          case i.checkbox:
             return import("@volverjs/ui-vue/vv-checkbox");
-          case c.checkboxGroup:
+          case i.checkboxGroup:
             return import("@volverjs/ui-vue/vv-checkbox-group");
-          case c.combobox:
+          case i.combobox:
             return import("@volverjs/ui-vue/vv-combobox");
         }
         return import("@volverjs/ui-vue/vv-input-text");
       });
-    }), hasProps: U, invalid: b };
+    }), hasProps: z, invalid: V };
   },
   render() {
-    return this.is ? x(this.is, this.hasProps, this.$slots) : this.type === c.custom ? x(this.component, null, this.$slots) : x(this.component, this.hasProps, this.$slots);
+    return this.is ? x(this.is, this.hasProps, this.$slots) : this.type === i.custom ? x(this.component, null, this.$slots) : x(this.component, this.hasProps, this.$slots);
   }
-}), K = (e, n = {}) => {
-  const o = (t) => {
-    let u = t;
-    for (; u instanceof ee; )
-      u = u.innerType();
-    return u;
-  }, l = o(e);
+}), M = (e, o = {}) => {
+  const s = (t) => {
+    let r = t;
+    for (; r instanceof ee; )
+      r = r.innerType();
+    return r;
+  }, u = s(e);
   return {
-    ...(l instanceof C ? l._def.unknownKeys === "passthrough" : !1) ? n : {},
+    ...(u instanceof L ? u._def.unknownKeys === "passthrough" : !1) ? o : {},
     ...Object.fromEntries(
-      Object.entries(l.shape).map(([t, u]) => {
-        const s = n[t], i = o(u);
-        let r;
-        if (i instanceof P && (r = i._def.defaultValue()), s === null && i instanceof F)
-          return [t, s];
-        if (i instanceof T) {
-          const m = i.safeParse(n[t]);
+      Object.entries(u.shape).map(([t, r]) => {
+        const c = o[t], l = s(r);
+        let n;
+        if (l instanceof T && (n = l._def.defaultValue()), c === null && l instanceof j)
+          return [t, c];
+        if (l instanceof F) {
+          const m = l.safeParse(o[t]);
           if (m.success)
-            return [t, m.data ?? r];
+            return [t, m.data ?? n];
         }
-        return i instanceof C ? [
+        return l instanceof L ? [
           t,
-          K(
-            i,
-            s && typeof s == "object" ? s : {}
+          M(
+            l,
+            c && typeof c == "object" ? c : {}
           )
-        ] : [t, r];
+        ] : [t, n];
       })
     )
   };
-}, oe = (e, n, o) => {
-  const l = g(), a = g(), t = g();
+}, ae = (e, o, s) => {
+  const u = g(), a = g(), t = g();
   return {
-    errors: l,
+    errors: u,
     status: a,
     formData: t,
-    component: $({
+    component: E({
       name: "FormComponent",
       props: {
         modelValue: {
@@ -295,50 +298,50 @@ const ne = (e, n, o, l = {}) => $({
       },
       emits: ["invalid", "valid", "submit", "update:modelValue"],
       expose: ["submit", "errors", "status"],
-      setup(u, { emit: s }) {
-        t.value = K(
+      setup(r, { emit: c }) {
+        t.value = M(
           e,
-          u.modelValue
+          r.modelValue
         );
-        const i = (o == null ? void 0 : o.continuosValidation) || u.continuosValidation;
+        const l = (s == null ? void 0 : s.continuosValidation) || r.continuosValidation;
         y(
-          () => u.modelValue,
+          () => r.modelValue,
           (v) => {
             if (v) {
-              const d = H(v) ? Q(v) : v;
+              const d = Q(v) ? X(v) : v;
               t.value = typeof (d == null ? void 0 : d.clone) == "function" ? d.clone() : JSON.parse(JSON.stringify(d));
             }
           },
           { deep: !0 }
-        ), Y(
+        ), D(
           t,
           (v) => {
-            (l.value || i) && r(), (!v || !u.modelValue || JSON.stringify(v) !== JSON.stringify(u.modelValue)) && s("update:modelValue", v);
+            (u.value || l) && n(), (!v || !r.modelValue || JSON.stringify(v) !== JSON.stringify(r.modelValue)) && c("update:modelValue", v);
           },
-          { deep: !0, throttle: (o == null ? void 0 : o.updateThrottle) ?? 500 }
+          { deep: !0, throttle: (s == null ? void 0 : s.updateThrottle) ?? 500 }
         );
-        const r = (v = t.value) => {
+        const n = (v = t.value) => {
           const d = e.safeParse(v);
-          return d.success ? (l.value = void 0, a.value = "valid", t.value = d.data, s("update:modelValue", t.value), s("valid", d.data), !0) : (l.value = d.error.format(), a.value = "invalid", s("invalid", l.value), !1);
-        }, m = () => r() ? (s("submit", t.value), !0) : !1;
-        return D(n, {
+          return d.success ? (u.value = void 0, a.value = "valid", t.value = d.data, c("update:modelValue", t.value), c("valid", d.data), !0) : (u.value = d.error.format(), a.value = "invalid", c("invalid", u.value), !1);
+        }, m = () => n() ? (c("submit", t.value), !0) : !1;
+        return $(o, {
           modelValue: t,
           submit: m,
-          errors: w(l)
+          errors: w(u)
         }), { submit: m };
       },
       render() {
         return x(
           "form",
           {
-            onSubmit: X(this.submit, ["prevent"])
+            onSubmit: Y(this.submit, ["prevent"])
           },
           this.$slots
         );
       }
     })
   };
-}, ue = (e, n) => $({
+}, se = (e, o) => E({
   name: "WrapperComponent",
   props: {
     name: {
@@ -352,98 +355,104 @@ const ne = (e, n, o, l = {}) => $({
   },
   emits: ["invalid", "valid"],
   expose: ["fields", "invalid"],
-  setup(o, { emit: l }) {
-    const a = S(e), t = S(n, void 0), u = g(/* @__PURE__ */ new Set()), s = g(/* @__PURE__ */ new Map()), { name: i } = A(o);
-    D(n, {
-      name: w(i),
-      errors: s,
-      fields: u
+  setup(u, { emit: a }) {
+    const t = S(e), r = S(o, void 0), c = g(/* @__PURE__ */ new Set()), l = g(/* @__PURE__ */ new Map()), { name: n } = I(u);
+    $(o, {
+      name: w(n),
+      errors: l,
+      fields: c
     }), y(
-      u,
-      (m) => {
-        t != null && t.fields && m.forEach((v) => {
-          t == null || t.fields.value.add(v);
+      c,
+      (v) => {
+        r != null && r.fields && v.forEach((d) => {
+          r == null || r.fields.value.add(d);
         });
       },
       { deep: !0 }
     ), y(
-      () => new Map(s.value),
-      (m, v) => {
-        t != null && t.errors && (Array.from(v.keys()).forEach((d) => {
-          t.errors.value.delete(d);
-        }), Array.from(m.keys()).forEach((d) => {
-          const p = m.get(d);
-          p && t.errors.value.set(d, p);
+      () => new Map(l.value),
+      (v, d) => {
+        r != null && r.errors && (Array.from(d.keys()).forEach((h) => {
+          r.errors.value.delete(h);
+        }), Array.from(v.keys()).forEach((h) => {
+          const V = v.get(h);
+          V && r.errors.value.set(h, V);
         }));
       },
       { deep: !0 }
     );
-    const r = V(() => a != null && a.errors.value ? s.value.size > 0 : !1);
-    return y(r, () => {
-      r.value ? l("invalid") : l("valid");
-    }), { formProvided: a, invalid: r, fields: u, errors: s };
+    const m = b(() => t != null && t.errors.value ? l.value.size > 0 : !1);
+    return y(m, () => {
+      m.value ? a("invalid") : a("valid");
+    }), {
+      formData: t == null ? void 0 : t.modelValue,
+      errors: t == null ? void 0 : t.errors,
+      invalid: m,
+      fields: c,
+      fieldsErrors: l
+    };
   },
   render() {
-    var o, l, a, t, u, s, i, r;
+    var u, a, t, r;
     return this.tag ? x(
       this.tag,
       null,
-      ((t = (a = this.$slots).default) == null ? void 0 : t.call(a, {
+      ((a = (u = this.$slots).default) == null ? void 0 : a.call(u, {
         invalid: this.invalid,
-        formData: (o = this.formProvided) == null ? void 0 : o.modelValue.value,
-        errors: (l = this.formProvided) == null ? void 0 : l.errors.value,
-        fieldsErrors: this.errors
+        formData: this.formData,
+        errors: this.errors,
+        fieldsErrors: this.fieldsErrors
       })) ?? this.$slots.defalut
-    ) : ((r = (i = this.$slots).default) == null ? void 0 : r.call(i, {
+    ) : ((r = (t = this.$slots).default) == null ? void 0 : r.call(t, {
       invalid: this.invalid,
-      formData: (u = this.formProvided) == null ? void 0 : u.modelValue.value,
-      errors: (s = this.formProvided) == null ? void 0 : s.errors.value,
-      fieldsErrors: this.errors
+      formData: this.formData,
+      errors: this.errors,
+      fieldsErrors: this.fieldsErrors
     })) ?? this.$slots.defalut;
   }
-}), M = (e, n = {}) => {
-  const o = Symbol(), l = Symbol(), a = Symbol(), {
+}), P = (e, o = {}) => {
+  const s = Symbol(), u = Symbol(), a = Symbol(), {
     component: t,
-    errors: u,
-    status: s,
-    formData: i
-  } = oe(e, o, n), r = ue(
-    o,
-    l
-  ), m = ne(
-    o,
-    l,
+    errors: r,
+    status: c,
+    formData: l
+  } = ae(e, s, o), n = se(
+    s,
+    u
+  ), m = oe(
+    s,
+    u,
     a,
-    n
+    o
   );
   return {
     VvForm: t,
-    VvFormWrapper: r,
+    VvFormWrapper: n,
     VvFormField: m,
-    formInjectionKey: o,
-    formWrapperInjectionKey: l,
+    formInjectionKey: s,
+    formWrapperInjectionKey: u,
     formFieldInjectionKey: a,
-    errors: u,
-    status: s,
-    formData: i
+    errors: r,
+    status: c,
+    formData: l
   };
 }, Z = Symbol(), fe = (e) => {
-  let n = {};
-  return e.schema && (n = M(e.schema, e)), {
-    ...n,
-    install(o, { global: l = !1 } = {}) {
-      o.provide(Z, e), l && (o.config.globalProperties.$vvForm = e, n != null && n.VvForm && o.component("VvForm", n.VvForm), n != null && n.VvFormWrapper && o.component("VvFormWrapper", n.VvFormWrapper), n != null && n.VvFormField && o.component("VvFormField", n.VvFormField));
+  let o = {};
+  return e.schema && (o = P(e.schema, e)), {
+    ...o,
+    install(s, { global: u = !1 } = {}) {
+      s.provide(Z, e), u && (s.config.globalProperties.$vvForm = e, o != null && o.VvForm && s.component("VvForm", o.VvForm), o != null && o.VvFormWrapper && s.component("VvFormWrapper", o.VvFormWrapper), o != null && o.VvFormField && s.component("VvFormField", o.VvFormField));
     }
   };
-}, de = (e, n = {}) => {
-  const o = { ...S(Z, {}), ...n };
-  return M(e, o);
+}, de = (e, o = {}) => {
+  const s = { ...S(Z, {}), ...o };
+  return P(e, s);
 };
 export {
-  c as FormFieldType,
+  i as FormFieldType,
   fe as createForm,
-  K as defaultObjectBySchema,
-  M as formFactory,
+  M as defaultObjectBySchema,
+  P as formFactory,
   Z as pluginInjectionKey,
   de as useForm
 };