@teamnovu/kit-vue-forms 0.2.13 → 0.2.14

package/dist/composables/useFieldRegistry.d.ts

@@ -19,6 +19,7 @@ interface FieldRegistryOptions {
     onBlur?: (path: string) => Awaitable<void>;
     onFocus?: (path: string) => Awaitable<void>;
     onChange?: <T>(path: string, value: T) => Awaitable<void>;
+    onRegistered?: <T>(path: string, value: T) => Awaitable<void>;
 }
 export declare function useFieldRegistry<T extends FormDataDefault, TOut = T>(formState: FormState<T>, validationState: ValidationState<T, TOut>, fieldRegistryOptions?: FieldRegistryOptions): {
     fields: ComputedRef<FieldsTuple<T>>;

package/dist/composables/useValidation.d.ts

@@ -9,6 +9,7 @@ export interface ValidationFlags {
     validateOnFormOpen?: MaybeRefOrGetter<boolean>;
     validateOnSubmit?: MaybeRefOrGetter<boolean>;
     validateOnDataChange?: MaybeRefOrGetter<boolean>;
+    validateOnFieldRegister?: MaybeRefOrGetter<boolean>;
 }
 export interface ValidatorOptions<T, TOut = T> {
     schema?: MaybeRef<z.ZodType<TOut, unknown> | undefined>;

package/dist/index.js

@@ -1,19 +1,19 @@
-var ee = Object.defineProperty;
-var te = (r, t, e) => t in r ? ee(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
-var b = (r, t, e) => te(r, typeof t != "symbol" ? t + "" : t, e);
-import { toValue as L, toRaw as re, shallowRef as I, watch as S, computed as p, unref as h, isRef as _, reactive as O, toRefs as J, shallowReactive as ae, toRef as M, onScopeDispose as se, triggerRef as ne, ref as G, getCurrentScope as ie, onBeforeUnmount as oe, defineComponent as x, renderSlot as C, normalizeProps as N, guardReactiveProps as T, createBlock as H, openBlock as K, withCtx as k, resolveDynamicComponent as le, mergeProps as ue, createSlots as ce, renderList as de } from "vue";
-import { cloneDeep as fe, merge as he, omit as ve } from "lodash-es";
+var te = Object.defineProperty;
+var re = (r, t, e) => t in r ? te(r, t, { enumerable: !0, configurable: !0, writable: !0, value: e }) : r[t] = e;
+var P = (r, t, e) => re(r, typeof t != "symbol" ? t + "" : t, e);
+import { toValue as J, toRaw as ae, shallowRef as O, watch as b, computed as m, unref as h, isRef as x, reactive as A, toRefs as G, shallowReactive as se, toRef as U, onScopeDispose as ne, triggerRef as ie, ref as Z, getCurrentScope as oe, onBeforeUnmount as le, defineComponent as N, renderSlot as C, normalizeProps as T, guardReactiveProps as W, createBlock as K, openBlock as L, withCtx as M, resolveDynamicComponent as ue, mergeProps as ce, createSlots as de, renderList as fe } from "vue";
+import { cloneDeep as he, merge as ve, omit as me } from "lodash-es";
 import "zod";
 function D(r) {
-  const t = L(r), e = re(t);
-  return fe(e);
+  const t = J(r), e = ae(t);
+  return he(e);
 }
-function me(r) {
+function pe(r) {
   return r.filter(
     (t, e, a) => a.indexOf(t) === e
   );
 }
-function Z(...r) {
+function q(...r) {
   return r.slice(1).reduce((t, e) => {
     if (!t && !e)
       return;
@@ -23,19 +23,19 @@ function Z(...r) {
     if (!a)
       return t;
     const s = (t ?? []).concat(e);
-    return me(s);
+    return pe(s);
   }, r[0]) ?? [];
 }
-function pe(...r) {
+function Fe(...r) {
   return r.map((e) => Object.keys(e)).flat().reduce((e, a) => {
     const s = r.map((n) => n[a]).filter((n) => !!n);
     return {
       ...e,
-      [a]: Z(e[a], ...s)
+      [a]: q(e[a], ...s)
     };
   }, {});
 }
-function U(...r) {
+function j(...r) {
   if (!r.length)
     return {
       general: [],
@@ -44,25 +44,25 @@ function U(...r) {
   const t = r[0];
   return r.length === 1 ? t : r.slice(1).reduce(
     (e, a) => ({
-      general: Z(e.general, a.general),
-      propertyErrors: pe(e.propertyErrors ?? {}, a.propertyErrors ?? {})
+      general: q(e.general, a.general),
+      propertyErrors: Fe(e.propertyErrors ?? {}, a.propertyErrors ?? {})
     }),
     t
   );
 }
-function q(r) {
+function Q(r) {
   var a;
   const t = (((a = r.general) == null ? void 0 : a.length) ?? 0) > 0, e = Object.entries(r.propertyErrors).filter(([, s]) => s == null ? void 0 : s.length).length > 0;
   return t || e;
 }
-function W(r) {
-  return !q(r.errors);
+function z(r) {
+  return !Q(r.errors);
 }
-function Q(r, t) {
+function X(r, t) {
   return (e) => async (a) => {
     if (a == null || a.preventDefault(), t.canValidate("validateOnSubmit")) {
       const s = await r.validateForm();
-      if (!W(s))
+      if (!z(s))
         return;
       const n = s.data ?? r.data.value;
       await e(n);
@@ -70,11 +70,11 @@ function Q(r, t) {
       await e(r.data.value);
   };
 }
-class Fe {
+class ye {
   constructor(t = (e) => e) {
-    b(this, "weakMap", /* @__PURE__ */ new WeakMap());
-    b(this, "map", /* @__PURE__ */ new Map());
-    b(this, "hashFn");
+    P(this, "weakMap", /* @__PURE__ */ new WeakMap());
+    P(this, "map", /* @__PURE__ */ new Map());
+    P(this, "hashFn");
     this.hashFn = t;
   }
   isReferenceType(t) {
@@ -93,10 +93,10 @@ class Fe {
     this.isReferenceType(a) ? this.weakMap.set(a, e) : this.map.set(a, e);
   }
 }
-function ye(r, t, e) {
+function Ve(r, t, e) {
   const a = /* @__PURE__ */ new Set();
   return t.map((s, n) => {
-    const c = [...r.get(s) ?? []], v = c.findIndex((y) => !a.has(y)), l = (v === -1 ? [] : c.slice(v))[0];
+    const c = [...r.get(s) ?? []], v = c.findIndex((F) => !a.has(F)), l = (v === -1 ? [] : c.slice(v))[0];
     if (l)
       return a.add(l), {
         id: l,
@@ -111,12 +111,12 @@ function ye(r, t, e) {
     };
   });
 }
-function X(r, t, e) {
-  const a = new Fe(e == null ? void 0 : e.hashFn), s = r.getField(t), n = I([]);
-  return S(
+function Y(r, t, e) {
+  const a = new ye(e == null ? void 0 : e.hashFn), s = r.getField(t), n = O([]);
+  return b(
     s.data,
     (l) => {
-      n.value = ye(a, l, t);
+      n.value = Ve(a, l, t);
     },
     {
       immediate: !0,
@@ -129,37 +129,37 @@ function X(r, t, e) {
       return s.setData([...d, l]), n.value.at(-1);
     },
     remove: (l) => {
-      const d = s.data.value ?? [], y = n.value.findIndex(
+      const d = s.data.value ?? [], F = n.value.findIndex(
         ({ id: i }) => i === l
       );
-      y !== -1 && s.setData(
-        d.slice(0, y).concat(d.slice(y + 1))
+      F !== -1 && s.setData(
+        d.slice(0, F).concat(d.slice(F + 1))
       );
     },
     insert: (l, d) => {
-      const y = s.data.value ?? [];
+      const F = s.data.value ?? [];
       return s.setData(
-        y.slice(0, d).concat([l]).concat(y.slice(d))
+        F.slice(0, d).concat([l]).concat(F.slice(d))
       ), n.value[d];
     },
     field: s
   };
 }
-function z(r) {
+function H(r) {
   return r === "" ? [] : r.split(/\s*\.\s*/).filter(Boolean);
 }
-function Ve(r, t) {
-  const e = Array.isArray(t) ? t : z(t);
-  return !!P(r, e.slice(0, -1));
+function ge(r, t) {
+  const e = Array.isArray(t) ? t : H(t);
+  return !!$(r, e.slice(0, -1));
 }
-function P(r, t) {
-  return (Array.isArray(t) ? t : z(t)).reduce(
+function $(r, t) {
+  return (Array.isArray(t) ? t : H(t)).reduce(
     (a, s) => a == null ? void 0 : a[s],
     r
   );
 }
-function ge(r, t, e) {
-  const a = Array.isArray(t) ? t : z(t), s = a.at(-1);
+function we(r, t, e) {
+  const a = Array.isArray(t) ? t : H(t), s = a.at(-1);
   if (s) {
     const n = a.slice(0, -1).reduce(
       (c, v) => ((c == null ? void 0 : c[v]) === void 0 && (c[v] = {}), c == null ? void 0 : c[v]),
@@ -168,23 +168,23 @@ function ge(r, t, e) {
     );
     n[s] = e;
   } else {
-    if (!_(r))
+    if (!x(r))
       return;
     r.value = e;
   }
 }
-const Y = (r, t) => p({
+const ee = (r, t) => m({
   get() {
-    return P(h(r), h(t));
+    return $(h(r), h(t));
   },
   set(e) {
-    ge(r, h(t), e);
+    we(r, h(t), e);
   }
 });
-function $(r, t) {
+function I(r, t) {
   return !r && !t ? "" : !r && t ? t : !t && r ? r : `${r}.${t}`;
 }
-function we(r, t) {
+function Ee(r, t) {
   if (!t)
     return r;
   const e = `${t}.`, a = Object.fromEntries(
@@ -199,9 +199,9 @@ function we(r, t) {
     propertyErrors: a
   };
 }
-class Ee {
+class Re {
   constructor(t) {
-    b(this, "rc", 1);
+    P(this, "rc", 1);
     this.drop = t;
   }
   inc() {
@@ -217,29 +217,29 @@ function De(r) {
       existsInForm: !0
     },
     ...r
-  }, a = I(Object.freeze(D(e.initialValue))), s = O({
+  }, a = O(Object.freeze(D(e.initialValue))), s = A({
     value: e.value,
     path: e.path,
     initialValue: a,
     errors: e.errors,
     touched: !1
   });
-  S(
-    I(e.initialValue),
+  b(
+    O(e.initialValue),
     () => {
       a.value = Object.freeze(D(e.initialValue)), s.value !== h(e.initialValue) && (s.value = D(e.initialValue));
     },
     { flush: "sync" }
-  ), S(() => s.value, (f) => {
+  ), b(() => s.value, (f) => {
     var E;
     (E = r.onChange) == null || E.call(r, f);
   }, { deep: !0 });
-  const n = p(() => JSON.stringify(s.value) !== JSON.stringify(s.initialValue)), c = (f) => {
+  const n = m(() => JSON.stringify(s.value) !== JSON.stringify(s.initialValue)), c = (f) => {
     s.value = f;
   }, v = () => {
     var f;
     s.touched = !0, s.errors = [], (f = e.onBlur) == null || f.call(e);
-  }, V = () => {
+  }, y = () => {
     var f;
     (f = e.onFocus) == null || f.call(e);
   }, l = () => {
@@ -247,11 +247,11 @@ function De(r) {
     h(e.existsInForm) && !/^\d+$/.test(f) && (s.value = D(s.initialValue)), s.touched = !1, s.errors = [];
   }, d = (f) => {
     n.value || c(D(f)), s.initialValue = f;
-  }, y = (f) => {
+  }, F = (f) => {
     s.errors = f;
   }, i = () => {
     s.errors = [];
-  }, o = J(s);
+  }, o = G(s);
   return {
     data: o.value,
     path: o.path,
@@ -262,28 +262,28 @@ function De(r) {
     setData: c,
     setInitialData: d,
     onBlur: v,
-    onFocus: V,
+    onFocus: y,
     reset: l,
-    setErrors: y,
+    setErrors: F,
     clearErrors: i
   };
 }
-const Re = {
+const Se = {
   keepValuesOnUnmount: !0
 };
-function Se(r, t) {
-  const e = () => P(r.initialData, t), a = I(e());
-  return S(
+function be(r, t) {
+  const e = () => $(r.initialData, t), a = O(e());
+  return b(
     () => r.initialData,
     () => {
-      a.value = e(), ne(a);
+      a.value = e(), ie(a);
     },
     { flush: "sync" }
   ), a;
 }
-function be(r, t, e) {
-  const a = /* @__PURE__ */ new Map(), s = ae(/* @__PURE__ */ new Map()), n = {
-    ...Re,
+function Pe(r, t, e) {
+  const a = /* @__PURE__ */ new Map(), s = se(/* @__PURE__ */ new Map()), n = {
+    ...Se,
     ...e
   }, c = (i) => {
     const o = h(i.path);
@@ -291,73 +291,74 @@ function be(r, t, e) {
   }, v = (i) => {
     var o;
     n != null && n.keepValuesOnUnmount || (o = s.get(i)) == null || o.reset(), s.delete(i);
-  }, V = (i) => {
+  }, y = (i) => {
     var o;
-    a.has(i) ? (o = a.get(i)) == null || o.inc() : a.set(i, new Ee(() => v(i)));
+    a.has(i) ? (o = a.get(i)) == null || o.inc() : a.set(i, new Re(() => v(i)));
   }, l = (i) => {
     var o;
     a.has(i) && ((o = a.get(i)) == null || o.dec());
   }, d = (i) => {
+    var E;
     const { path: o } = i;
     if (!s.has(o)) {
-      const E = De({
+      const g = De({
         path: o,
-        value: Y(M(r, "data"), o),
-        initialValue: Se(r, o),
-        existsInForm: p(() => Ve(r.data, h(o))),
-        errors: p({
+        value: ee(U(r, "data"), o),
+        initialValue: be(r, o),
+        existsInForm: m(() => ge(r.data, h(o))),
+        errors: m({
           get() {
             return t.errors.value.propertyErrors[o] || [];
           },
-          set(m) {
-            t.errors.value.propertyErrors[o] = m;
+          set(V) {
+            t.errors.value.propertyErrors[o] = V;
           }
         }),
         onBlur: async () => {
-          var m, g;
+          var V, R;
           await Promise.all([
-            (m = n == null ? void 0 : n.onBlur) == null ? void 0 : m.call(n, h(o)),
-            (g = i.onBlur) == null ? void 0 : g.call(i)
+            (V = n == null ? void 0 : n.onBlur) == null ? void 0 : V.call(n, h(o)),
+            (R = i.onBlur) == null ? void 0 : R.call(i)
           ]);
         },
         onFocus: async () => {
-          var m, g;
+          var V, R;
           await Promise.all([
-            (m = n == null ? void 0 : n.onFocus) == null ? void 0 : m.call(n, h(o)),
-            (g = i.onFocus) == null ? void 0 : g.call(i)
+            (V = n == null ? void 0 : n.onFocus) == null ? void 0 : V.call(n, h(o)),
+            (R = i.onFocus) == null ? void 0 : R.call(i)
           ]);
         },
-        onChange: async (m) => {
-          var g, A;
+        onChange: async (V) => {
+          var R, B;
           await Promise.all([
-            (g = n == null ? void 0 : n.onChange) == null ? void 0 : g.call(n, h(o), m),
-            (A = i.onChange) == null ? void 0 : A.call(i, m)
+            (R = n == null ? void 0 : n.onChange) == null ? void 0 : R.call(n, h(o), V),
+            (B = i.onChange) == null ? void 0 : B.call(i, V)
           ]);
         }
       });
-      c(E);
+      c(g);
     }
     const f = s.get(o);
-    return V(o), se(() => {
+    return y(o), ne(() => {
       l(o);
-    }), f;
-  }, y = (i) => d(i);
+    }), (E = n.onRegistered) == null || E.call(n, o, f), f;
+  }, F = (i) => d(i);
   return {
-    fields: p(() => [...s.values()]),
+    fields: m(() => [...s.values()]),
     getField: (i) => d({ path: i }),
     registerField: c,
     deregisterField: v,
-    defineField: y
+    defineField: F
   };
 }
-function Pe(r) {
-  const t = p(() => r.fields.value.some((a) => h(a.dirty))), e = p(() => r.fields.value.some((a) => h(a.touched)));
+function $e(r) {
+  const t = m(() => r.fields.value.some((a) => h(a.dirty))), e = m(() => r.fields.value.some((a) => h(a.touched)));
   return {
     isDirty: t,
     isTouched: e
   };
 }
-function $e(r) {
+function Ie(r) {
   const t = r.issues.filter((a) => a.path.length === 0).map((a) => a.message), e = r.issues.filter((a) => a.path.length > 0).reduce((a, s) => {
     const n = s.path.join(".");
     return {
@@ -370,18 +371,20 @@ function $e(r) {
     propertyErrors: e
   };
 }
-const Ie = {
+const Oe = {
   validationBeforeSubmit: {
     validateOnBlur: !1,
     validateOnFormOpen: !1,
     validateOnSubmit: !0,
-    validateOnDataChange: !1
+    validateOnDataChange: !1,
+    validateOnFieldRegister: !1
   },
   validationAfterSubmit: {
     validateOnBlur: !1,
     validateOnFormOpen: !1,
     validateOnSubmit: !0,
-    validateOnDataChange: !0
+    validateOnDataChange: !0,
+    validateOnFieldRegister: !0
   }
 }, w = {
   errors: {
@@ -399,7 +402,7 @@ class Ce {
     const e = await this.schema.safeParseAsync(t);
     if (e.success)
       return w;
-    const a = $e(e.error);
+    const a = Ie(e.error);
     return {
       data: e.data,
       errors: {
@@ -409,7 +412,7 @@ class Ce {
     };
   }
 }
-class Oe {
+class Ae {
   constructor(t) {
     this.validateFn = t;
   }
@@ -418,7 +421,7 @@ class Oe {
       return w;
     try {
       const e = await this.validateFn(t);
-      return W(e) ? w : e;
+      return z(e) ? w : e;
     } catch (e) {
       return {
         errors: {
@@ -429,11 +432,11 @@ class Oe {
     }
   }
 }
-class Ae {
+class Be {
   constructor(t, e) {
-    b(this, "schemaValidator");
-    b(this, "functionValidator");
-    this.schema = t, this.validateFn = e, this.schemaValidator = new Ce(this.schema), this.functionValidator = new Oe(this.validateFn);
+    P(this, "schemaValidator");
+    P(this, "functionValidator");
+    this.schema = t, this.validateFn = e, this.schemaValidator = new Ce(this.schema), this.functionValidator = new Ae(this.validateFn);
   }
   async validate(t) {
     const [e, a] = await Promise.all([
@@ -442,31 +445,31 @@ class Ae {
     ]);
     return {
       data: e.data,
-      errors: U(e.errors, a.errors)
+      errors: j(e.errors, a.errors)
     };
   }
 }
-function j(r) {
-  return p(() => new Ae(
+function _(r) {
+  return m(() => new Be(
     h(r.schema),
     h(r.validateFn)
   ));
 }
-function Be(r, t) {
-  const e = O({
-    validators: G([j(t)]),
+function ke(r, t) {
+  const e = A({
+    validators: Z([_(t)]),
     isValidated: !1,
     errors: h(t.errors) ?? w.errors
   }), a = (i = w.errors) => {
-    e.errors = U(h(t.errors) ?? w.errors, i);
+    e.errors = j(h(t.errors) ?? w.errors, i);
   };
-  S(() => h(t.errors), async () => {
+  b(() => h(t.errors), async () => {
     if (e.isValidated) {
       const i = await n();
       a(i.errors);
     } else
       a();
-  }, { immediate: !0 }), S(
+  }, { immediate: !0 }), b(
     [() => e.validators],
     async (i) => {
       if (e.isValidated)
@@ -477,12 +480,12 @@ function Be(r, t) {
           e.errors = w.errors;
     },
     { immediate: !0 }
-  ), S([() => r.data, () => h(t.schema)], () => {
+  ), b([() => r.data, () => h(t.schema)], () => {
     e.isValidated && c();
   });
   const s = (i) => {
-    const o = _(i) ? i : j(i);
-    return e.validators.push(o), ie() && oe(() => {
+    const o = x(i) ? i : _(i);
+    return e.validators.push(o), oe() && le(() => {
       e.validators = e.validators.filter(
         (f) => f !== o
       );
@@ -491,17 +494,17 @@ function Be(r, t) {
   async function n() {
     var E;
     const i = await Promise.all(
-      e.validators.filter((m) => h(m) !== void 0).map((m) => h(m).validate(r.data))
-    ), o = i.every((m) => W(m));
+      e.validators.filter((g) => h(g) !== void 0).map((g) => h(g).validate(r.data))
+    ), o = i.every((g) => z(g));
     let { errors: f } = w;
     if (!o) {
-      const m = i.map((g) => g.errors);
-      f = U(...m);
+      const g = i.map((V) => V.errors);
+      f = j(...g);
     }
     return {
       errors: f,
       // TODO: Implement data disambiguation strategy
-      data: (E = i.findLast((m) => !!m.data)) == null ? void 0 : E.data
+      data: (E = i.findLast((g) => !!g.data)) == null ? void 0 : E.data
     };
   }
   const c = async () => {
@@ -521,32 +524,32 @@ function Be(r, t) {
       data: o.data,
       errors: e.errors
     };
-  }, V = p(() => !q(e.errors)), l = () => {
+  }, y = m(() => !Q(e.errors)), l = () => {
     e.isValidated = !1, e.errors = h(t.errors) ?? w.errors;
   }, d = (i) => {
     const o = e.isValidated ? t.validationAfterSubmit : t.validationBeforeSubmit;
-    return L((o == null ? void 0 : o[i]) ?? !1);
-  }, y = (i, o) => {
+    return J((o == null ? void 0 : o[i]) ?? !1);
+  }, F = (i, o) => {
     if (d(i))
       return v(o);
   };
   return {
-    ...J(e),
+    ...G(e),
     validateForm: c,
     validateField: v,
-    validateStrategy: y,
+    validateStrategy: F,
     canValidate: d,
     defineValidator: s,
-    isValid: V,
+    isValid: y,
     reset: l
   };
 }
-class ke {
+class Me {
   constructor(t, e) {
     this.path = t, this.validator = e;
   }
   async validate(t) {
-    const e = P(t, this.path);
+    const e = $(t, this.path);
     if (!this.validator)
       return w;
     const a = await this.validator.validate(e);
@@ -555,112 +558,115 @@ class ke {
         general: a.errors.general || [],
         propertyErrors: a.errors.propertyErrors ? Object.fromEntries(
           Object.entries(a.errors.propertyErrors).map(
-            ([s, n]) => [$(this.path, s), n]
+            ([s, n]) => [I(this.path, s), n]
           )
         ) : {}
       }
     };
   }
 }
-function Me(r, t, e, a) {
-  const s = Y(r.data, t), n = p(() => P(r.initialData.value, t)), c = (u) => ({
+function Ue(r, t, e, a) {
+  const s = ee(r.data, t), n = m(() => $(r.initialData.value, t)), c = (u) => ({
     ...u,
-    path: p(() => h(u.path).replace(t + ".", "")),
-    setData: (F) => {
-      u.setData(F);
+    path: m(() => h(u.path).replace(t + ".", "")),
+    setData: (p) => {
+      u.setData(p);
     }
   }), v = (u) => {
-    const F = $(t, u), R = r.getField(F);
-    return R ? c(R) : {};
-  }, V = (u) => {
-    const F = $(t, u.path), R = r.defineField({
+    const p = I(t, u), S = r.getField(p);
+    return S ? c(S) : {};
+  }, y = (u) => {
+    const p = I(t, u.path), S = r.defineField({
       ...u,
-      path: F
+      path: p
     });
-    return c(R);
-  }, l = p(() => r.fields.value.filter((u) => {
-    const F = u.path.value;
-    return F.startsWith(t + ".") || F === t;
+    return c(S);
+  }, l = m(() => r.fields.value.filter((u) => {
+    const p = u.path.value;
+    return p.startsWith(t + ".") || p === t;
   }).map((u) => c(u))), d = () => r.fields.value.filter((u) => {
-    const F = u.path.value;
-    return F.startsWith(t + ".") || F === t;
-  }), y = p(() => d().some((u) => u.dirty.value)), i = p(() => d().some((u) => u.touched.value)), o = p(() => r.isValid.value), f = p(() => r.isValidated.value), E = p(() => we(h(r.errors), t)), B = {
+    const p = u.path.value;
+    return p.startsWith(t + ".") || p === t;
+  }), F = m(() => d().some((u) => u.dirty.value)), i = m(() => d().some((u) => u.touched.value)), o = m(() => r.isValid.value), f = m(() => r.isValidated.value), E = m(() => Ee(h(r.errors), t)), k = {
     data: s,
     fields: l,
     initialData: n,
-    defineField: V,
+    defineField: y,
     getField: v,
-    isDirty: y,
+    isDirty: F,
     isTouched: i,
     isValid: o,
     isValidated: f,
     errors: E,
     defineValidator: (u) => {
-      const F = _(u) ? u : j(u), R = p(
-        () => new ke(t, h(F))
+      const p = x(u) ? u : _(u), S = m(
+        () => new Me(t, h(p))
       );
-      return r.defineValidator(R), F;
+      return r.defineValidator(S), p;
     },
     reset: () => d().forEach((u) => u.reset()),
     validateForm: () => r.validateForm(),
-    getSubForm: (u, F) => {
-      const R = $(t, u);
+    getSubForm: (u, p) => {
+      const S = I(t, u);
       return r.getSubForm(
-        R,
-        F
+        S,
+        p
       );
     },
-    submitHandler: (u) => Q(B, e ?? {})(u),
-    getFieldArray: (u, F) => X(B, u, F)
+    submitHandler: (u) => X(k, e ?? {})(u),
+    getFieldArray: (u, p) => Y(k, u, p)
   };
-  return B;
+  return k;
 }
-const Ue = {
+const je = {
   keepValuesOnUnmount: !1,
-  ...Ie
+  ...Oe
 };
 function ze(r) {
-  r = he({}, Ue, r);
-  const t = p(() => D(r.initialData)), e = G(D(t)), a = O({
+  r = ve({}, je, r);
+  const t = m(() => D(r.initialData)), e = Z(D(t)), a = A({
     initialData: t,
     data: e
   });
-  S(
+  b(
     t,
     (l) => {
       a.data = D(l);
     },
     { flush: "sync" }
   );
-  const s = Be(a, r), n = be(a, s, {
+  const s = ke(a, r), n = Pe(a, s, {
     keepValuesOnUnmount: r.keepValuesOnUnmount,
     onBlur: async (l) => {
       s.validateStrategy("validateOnBlur", l);
     },
     onChange: async (l) => {
       s.validateStrategy("validateOnDataChange", l);
+    },
+    onRegistered: async (l) => {
+      s.validateStrategy("validateOnFieldRegister", l);
     }
-  }), c = Pe(n), v = () => {
+  }), c = $e(n), v = () => {
     e.value = D(t), s.reset();
     for (const l of n.fields.value)
       l.reset();
   };
   s.canValidate("validateOnFormOpen") && s.validateForm();
-  const V = {
+  const y = {
     ...n,
     ...c,
-    ...ve(s, ["canValidate", "validateStrategy"]),
+    ...me(s, ["canValidate", "validateStrategy"]),
     reset: v,
-    initialData: M(a, "initialData"),
-    data: M(a, "data"),
+    initialData: U(a, "initialData"),
+    data: U(a, "data"),
     validateForm: s.validateForm,
-    submitHandler: (l) => Q(V, s)(l),
-    getSubForm: (l, d) => Me(V, l, r),
-    getFieldArray: (l, d) => X(V, l, d)
+    submitHandler: (l) => X(y, s)(l),
+    getSubForm: (l, d) => Ue(y, l, r),
+    getFieldArray: (l, d) => Y(y, l, d)
   };
-  return V;
+  return y;
 }
-const je = /* @__PURE__ */ x({
+const _e = /* @__PURE__ */ N({
   __name: "Field",
   props: {
     form: {},
@@ -676,10 +682,10 @@ const je = /* @__PURE__ */ x({
   setup(r) {
     const t = r, e = t.form.defineField({
       path: t.path
-    }), a = O(e);
-    return (s, n) => C(s.$slots, "default", N(T(a)));
+    }), a = A(e);
+    return (s, n) => C(s.$slots, "default", T(W(a)));
   }
-}), He = /* @__PURE__ */ x({
+}), He = /* @__PURE__ */ N({
   inheritAttrs: !1,
   __name: "FormFieldWrapper",
   props: {
@@ -689,28 +695,28 @@ const je = /* @__PURE__ */ x({
     path: {}
   },
   setup(r) {
-    return (t, e) => (K(), H(je, {
+    return (t, e) => (L(), K(_e, {
       form: r.form,
       path: r.path
     }, {
-      default: k(({ errors: a, data: s, setData: n, onBlur: c, onFocus: v }) => [
-        (K(), H(le(r.component), ue({ ...r.componentProps, ...t.$attrs }, {
+      default: M(({ errors: a, data: s, setData: n, onBlur: c, onFocus: v }) => [
+        (L(), K(ue(r.component), ce({ ...r.componentProps, ...t.$attrs }, {
           "on-blur": c,
           "on-focus": v,
           "model-value": s,
           errors: a,
           name: r.path,
           "onUpdate:modelValue": n
-        }), ce({
-          default: k(() => [
+        }), de({
+          default: M(() => [
             C(t.$slots, "default")
           ]),
           _: 2
         }, [
-          de(t.$slots, (V, l) => ({
+          fe(t.$slots, (y, l) => ({
             name: l,
-            fn: k((d) => [
-              C(t.$slots, l, N(T(d ?? {})))
+            fn: M((d) => [
+              C(t.$slots, l, T(W(d ?? {})))
             ])
           }))
         ]), 1040, ["on-blur", "on-focus", "model-value", "errors", "name", "onUpdate:modelValue"]))
@@ -718,19 +724,19 @@ const je = /* @__PURE__ */ x({
       _: 3
     }, 8, ["form", "path"]));
   }
-}), Ke = /* @__PURE__ */ x({
+}), Ke = /* @__PURE__ */ N({
   __name: "FormPart",
   props: {
     form: {},
     path: {}
   },
   setup(r) {
-    const t = r, e = p(() => t.form.getSubForm(t.path));
-    return (a, s) => C(a.$slots, "default", N(T({ subform: e.value })));
+    const t = r, e = m(() => t.form.getSubForm(t.path));
+    return (a, s) => C(a.$slots, "default", T(W({ subform: e.value })));
   }
 });
 export {
-  je as Field,
+  _e as Field,
   He as FormFieldWrapper,
   Ke as FormPart,
   ze as useForm

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@teamnovu/kit-vue-forms",
-  "version": "0.2.13",
+  "version": "0.2.14",
   "description": "",
   "main": "dist/index.js",
   "type": "module",

package/src/composables/useFieldRegistry.ts

@@ -47,6 +47,7 @@ interface FieldRegistryOptions {
   onBlur?: (path: string) => Awaitable<void>
   onFocus?: (path: string) => Awaitable<void>
   onChange?: <T>(path: string, value: T) => Awaitable<void>
+  onRegistered?: <T>(path: string, value: T) => Awaitable<void>
 }
 
 const optionDefaults = {
@@ -165,6 +166,8 @@ export function useFieldRegistry<T extends FormDataDefault, TOut = T>(
       untrack(path)
     })
 
+    registryOptions.onRegistered?.(path, field)
+
     return field
   }
 

package/src/composables/useForm.ts

@@ -84,6 +84,9 @@ export function useForm<T extends FormDataDefault, TOut = T>(
     onChange: async (path: string) => {
       validationState.validateStrategy('validateOnDataChange', path)
     },
+    onRegistered: async (path: string) => {
+      validationState.validateStrategy('validateOnFieldRegister', path)
+    },
   })
   const formState = useFormState(fieldRegistry)
 

package/src/composables/useValidation.ts

@@ -11,12 +11,14 @@ export const defaults: ValidationOptions<FormDataDefault> = {
     validateOnFormOpen: false,
     validateOnSubmit: true,
     validateOnDataChange: false,
+    validateOnFieldRegister: false,
   },
   validationAfterSubmit: {
     validateOnBlur: false,
     validateOnFormOpen: false,
     validateOnSubmit: true,
     validateOnDataChange: true,
+    validateOnFieldRegister: true,
   },
 }
 
@@ -25,6 +27,7 @@ export interface ValidationFlags {
   validateOnFormOpen?: MaybeRefOrGetter<boolean>
   validateOnSubmit?: MaybeRefOrGetter<boolean>
   validateOnDataChange?: MaybeRefOrGetter<boolean>
+  validateOnFieldRegister?: MaybeRefOrGetter<boolean>
 }
 
 export interface ValidatorOptions<T, TOut = T> {