@volverjs/form-vue 1.1.0 → 1.1.1-beta.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/VvFormField.d.ts +3 -3
- package/dist/index.d.ts +6 -6
- package/dist/index.es.js +24 -24
- package/dist/index.umd.js +1 -1
- package/dist/types.d.ts +2 -2
- package/package.json +3 -3
- package/src/VvFormField.ts +6 -6
- package/src/VvFormFieldsGroup.ts +4 -4
- package/src/VvFormTemplate.ts +3 -3
- package/src/types.ts +2 -2
package/dist/VvFormField.d.ts
CHANGED
|
@@ -53,8 +53,8 @@ export declare function defineFormField<Schema extends FormSchema, Type = undefi
|
|
|
53
53
|
invalid: boolean;
|
|
54
54
|
valid: boolean | undefined;
|
|
55
55
|
type: FormFieldType | undefined;
|
|
56
|
-
invalidLabel:
|
|
57
|
-
modelValue:
|
|
56
|
+
invalidLabel: string[] | undefined;
|
|
57
|
+
modelValue: unknown;
|
|
58
58
|
readonly: boolean;
|
|
59
59
|
'onUpdate:modelValue': (value: unknown) => void;
|
|
60
60
|
}>;
|
|
@@ -115,7 +115,7 @@ export declare function defineFormField<Schema extends FormSchema, Type = undefi
|
|
|
115
115
|
}, SlotsType<{
|
|
116
116
|
[key: string]: any;
|
|
117
117
|
default: {
|
|
118
|
-
errors: DeepReadonly<InferFormattedError<Schema
|
|
118
|
+
errors: DeepReadonly<InferFormattedError<Schema> | undefined>;
|
|
119
119
|
formData?: undefined extends Type ? Partial<InferSchema<Schema>> : Type;
|
|
120
120
|
formErrors?: DeepReadonly<InferFormattedError<Schema>>;
|
|
121
121
|
invalid: boolean;
|
package/dist/index.d.ts
CHANGED
|
@@ -189,8 +189,8 @@ declare function _formType<Schema extends FormSchema, Type>(schema: Schema, opti
|
|
|
189
189
|
invalid: boolean;
|
|
190
190
|
valid: boolean | undefined;
|
|
191
191
|
type: import('./enums').FormFieldType | undefined;
|
|
192
|
-
invalidLabel:
|
|
193
|
-
modelValue:
|
|
192
|
+
invalidLabel: string[] | undefined;
|
|
193
|
+
modelValue: unknown;
|
|
194
194
|
readonly: boolean;
|
|
195
195
|
'onUpdate:modelValue': (value: unknown) => void;
|
|
196
196
|
}>;
|
|
@@ -251,7 +251,7 @@ declare function _formType<Schema extends FormSchema, Type>(schema: Schema, opti
|
|
|
251
251
|
}, import('vue').SlotsType<{
|
|
252
252
|
[key: string]: any;
|
|
253
253
|
default: {
|
|
254
|
-
errors: import('vue').DeepReadonly<import('./types').InferFormattedError<Schema
|
|
254
|
+
errors: import('vue').DeepReadonly<import('./types').InferFormattedError<Schema> | undefined>;
|
|
255
255
|
formData?: (undefined extends Type ? Partial<import('./types').InferSchema<Schema>> : Type) | undefined;
|
|
256
256
|
formErrors?: import('vue').DeepReadonly<import('./types').InferFormattedError<Schema>> | undefined;
|
|
257
257
|
invalid: boolean;
|
|
@@ -679,8 +679,8 @@ export declare function formType<Schema extends FormSchema, Type>(schema: Schema
|
|
|
679
679
|
invalid: boolean;
|
|
680
680
|
valid: boolean | undefined;
|
|
681
681
|
type: import('./enums').FormFieldType | undefined;
|
|
682
|
-
invalidLabel:
|
|
683
|
-
modelValue:
|
|
682
|
+
invalidLabel: string[] | undefined;
|
|
683
|
+
modelValue: unknown;
|
|
684
684
|
readonly: boolean;
|
|
685
685
|
'onUpdate:modelValue': (value: unknown) => void;
|
|
686
686
|
}>;
|
|
@@ -741,7 +741,7 @@ export declare function formType<Schema extends FormSchema, Type>(schema: Schema
|
|
|
741
741
|
}, import('vue').SlotsType<{
|
|
742
742
|
[key: string]: any;
|
|
743
743
|
default: {
|
|
744
|
-
errors: import('vue').DeepReadonly<import('./types').InferFormattedError<Schema
|
|
744
|
+
errors: import('vue').DeepReadonly<import('./types').InferFormattedError<Schema> | undefined>;
|
|
745
745
|
formData?: (undefined extends Type ? Partial<import('./types').InferSchema<Schema>> : Type) | undefined;
|
|
746
746
|
formErrors?: import('vue').DeepReadonly<import('./types').InferFormattedError<Schema>> | undefined;
|
|
747
747
|
invalid: boolean;
|
package/dist/index.es.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
import { ref as
|
|
1
|
+
import { ref as k, computed as D, readonly as F, defineComponent as U, h as E, withModifiers as re, toRaw as N, watch as z, isProxy as ce, onMounted as H, provide as Q, toRefs as Y, useId as ae, inject as G, onBeforeUnmount as L, unref as B, resolveComponent as $, defineAsyncComponent as me, getCurrentInstance as pe } from "vue";
|
|
2
2
|
import { watchIgnorable as ye, throttleFilter as he } from "@vueuse/core";
|
|
3
3
|
import { ZodError as be } from "zod/v3";
|
|
4
4
|
import { safeParse as je, safeParseAsync as Ve, formatError as ne, $ZodError as ge } from "zod/v4/core";
|
|
5
|
-
import {
|
|
5
|
+
import { setProperty as oe, getProperty as W } from "dot-prop";
|
|
6
6
|
var V = /* @__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 = "datetime-local", 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))(V || {}), S = /* @__PURE__ */ ((e) => (e.invalid = "invalid", e.valid = "valid", e.submitting = "submitting", e.reset = "reset", e.updated = "updated", e.unknown = "unknown", e))(S || {});
|
|
7
7
|
const K = (e) => e._def.typeName === "ZodObject", C = (e) => e._zod.def.type === "object", Oe = (e) => e._def.typeName === "ZodDefault", we = (e) => e._zod.def.type === "default", De = (e) => e._def.typeName === "ZodNullable", _e = (e) => e._zod.def.type === "nullable", Re = (e) => e._def.typeName === "ZodRecord", Se = (e) => e._zod.def.type === "record", Ie = (e) => e._def.typeName === "ZodArray", Ee = (e) => e._zod.def.type === "array", Ze = (e) => e._def.typeName === "ZodEffects", ue = (e) => e._def.typeName === "ZodOptional", le = (e) => e._zod.def.type === "optional", xe = (e) => e._zod.def.type === "pipe", ze = (e) => e._zod.def.type === "transform";
|
|
8
8
|
function se(e) {
|
|
@@ -30,7 +30,7 @@ const T = (e) => {
|
|
|
30
30
|
const t = ie(e);
|
|
31
31
|
return !!le(t);
|
|
32
32
|
}, X = (e) => "_zod" in e;
|
|
33
|
-
function
|
|
33
|
+
function P(e, t = {}) {
|
|
34
34
|
if (X(e)) {
|
|
35
35
|
const a = M(e);
|
|
36
36
|
return C(a) ? {
|
|
@@ -55,7 +55,7 @@ function k(e, t = {}) {
|
|
|
55
55
|
return [
|
|
56
56
|
u,
|
|
57
57
|
r.map(
|
|
58
|
-
(w) =>
|
|
58
|
+
(w) => P(
|
|
59
59
|
c,
|
|
60
60
|
w && typeof w == "object" ? w : void 0
|
|
61
61
|
)
|
|
@@ -65,11 +65,11 @@ function k(e, t = {}) {
|
|
|
65
65
|
if (Se(o) && r) {
|
|
66
66
|
const c = M(o._zod.def.valueType);
|
|
67
67
|
if (C(c))
|
|
68
|
-
return [u, Object.keys(r).reduce((w, p) => (w[p] =
|
|
68
|
+
return [u, Object.keys(r).reduce((w, p) => (w[p] = P(c, r[p]), w), {})];
|
|
69
69
|
}
|
|
70
70
|
return C(o) ? [
|
|
71
71
|
u,
|
|
72
|
-
|
|
72
|
+
P(
|
|
73
73
|
o,
|
|
74
74
|
r && typeof r == "object" ? r : d
|
|
75
75
|
)
|
|
@@ -102,7 +102,7 @@ function k(e, t = {}) {
|
|
|
102
102
|
return [
|
|
103
103
|
a,
|
|
104
104
|
u.map(
|
|
105
|
-
(d) =>
|
|
105
|
+
(d) => P(
|
|
106
106
|
o,
|
|
107
107
|
d && typeof d == "object" ? d : void 0
|
|
108
108
|
)
|
|
@@ -112,11 +112,11 @@ function k(e, t = {}) {
|
|
|
112
112
|
if (Re(r) && u) {
|
|
113
113
|
const o = T(r._def.valueType);
|
|
114
114
|
if (K(o))
|
|
115
|
-
return [a, Object.keys(u).reduce((d, c) => (d[c] =
|
|
115
|
+
return [a, Object.keys(u).reduce((d, c) => (d[c] = P(o, u[c]), d), {})];
|
|
116
116
|
}
|
|
117
117
|
return K(r) ? [
|
|
118
118
|
a,
|
|
119
|
-
|
|
119
|
+
P(
|
|
120
120
|
r,
|
|
121
121
|
u && typeof u == "object" ? u : v
|
|
122
122
|
)
|
|
@@ -127,11 +127,11 @@ function k(e, t = {}) {
|
|
|
127
127
|
} : t;
|
|
128
128
|
}
|
|
129
129
|
const Ne = (e, t) => X(e) ? Ve(e, t) : e.safeParseAsync(t), $e = (e, t) => X(e) ? ne(t) : t.format(), Ge = (e, t) => X(e) ? ne(new ge(t)) : new be(t).format();
|
|
130
|
-
function
|
|
131
|
-
const i =
|
|
130
|
+
function Pe(e, t, l, g, a) {
|
|
131
|
+
const i = k(), u = k(), f = D(() => u.value === S.invalid), r = k(), v = k(!1);
|
|
132
132
|
let o;
|
|
133
133
|
const d = (O) => {
|
|
134
|
-
const _ =
|
|
134
|
+
const _ = P(e, O);
|
|
135
135
|
if (l?.class) {
|
|
136
136
|
const n = l.class;
|
|
137
137
|
return new n(_);
|
|
@@ -355,7 +355,7 @@ function ke(e, t, l, g, a) {
|
|
|
355
355
|
VvForm: Z
|
|
356
356
|
};
|
|
357
357
|
}
|
|
358
|
-
function
|
|
358
|
+
function ke(e, t, l, g) {
|
|
359
359
|
return U({
|
|
360
360
|
name: "VvFormField",
|
|
361
361
|
props: {
|
|
@@ -465,7 +465,7 @@ function Be(e, t, l, g) {
|
|
|
465
465
|
}, R = D(() => {
|
|
466
466
|
let n = f.value;
|
|
467
467
|
return typeof n == "function" && (n = n(d?.formData)), Object.keys(n).reduce(
|
|
468
|
-
(j, A) => (j[A] =
|
|
468
|
+
(j, A) => (j[A] = B(n[A]), j),
|
|
469
469
|
{}
|
|
470
470
|
);
|
|
471
471
|
}), Z = D(() => d?.readonly.value || o?.readonly.value ? !0 : R.value.readonly ?? a.readonly), O = D(() => ({
|
|
@@ -504,7 +504,7 @@ function Be(e, t, l, g) {
|
|
|
504
504
|
return {
|
|
505
505
|
render() {
|
|
506
506
|
return i.default?.({
|
|
507
|
-
errors: w.value,
|
|
507
|
+
errors: F(w).value,
|
|
508
508
|
formData: d?.formData.value,
|
|
509
509
|
formErrors: d?.errors.value,
|
|
510
510
|
invalid: m.value,
|
|
@@ -576,7 +576,7 @@ function Be(e, t, l, g) {
|
|
|
576
576
|
}
|
|
577
577
|
});
|
|
578
578
|
}
|
|
579
|
-
function
|
|
579
|
+
function Be(e, t, l) {
|
|
580
580
|
return U({
|
|
581
581
|
name: "VvFormFieldsGroup",
|
|
582
582
|
props: {
|
|
@@ -717,7 +717,7 @@ function Pe(e, t, l) {
|
|
|
717
717
|
}, A = D(() => {
|
|
718
718
|
let s = u.value;
|
|
719
719
|
return typeof s == "function" && (s = s(m?.formData)), Object.keys(s).reduce(
|
|
720
|
-
(h, x) => (h[x] =
|
|
720
|
+
(h, x) => (h[x] = B(s[x]), h),
|
|
721
721
|
{}
|
|
722
722
|
);
|
|
723
723
|
}), ee = D(() => m?.readonly.value ? !0 : A.value.readonly ?? g.readonly), fe = D(() => d.value.reduce((s, h) => (s[`onUpdate:${h}`] = (x) => {
|
|
@@ -797,7 +797,7 @@ function We(e, t) {
|
|
|
797
797
|
],
|
|
798
798
|
slots: Object,
|
|
799
799
|
setup(l, { emit: g }) {
|
|
800
|
-
const a = G(e), i = G(t, void 0), u =
|
|
800
|
+
const a = G(e), i = G(t, void 0), u = k(/* @__PURE__ */ new Map()), f = k(/* @__PURE__ */ new Map()), { name: r } = Y(l), v = D(() => a?.invalid.value ? f.value.size > 0 : !1);
|
|
801
801
|
z(v, (p) => {
|
|
802
802
|
if (p) {
|
|
803
803
|
g("invalid");
|
|
@@ -923,13 +923,13 @@ function Le(e, t) {
|
|
|
923
923
|
if (typeof y == "string" ? f = !!W(
|
|
924
924
|
new Object(i.formData.value),
|
|
925
925
|
y
|
|
926
|
-
) : typeof y == "function" ? f =
|
|
926
|
+
) : typeof y == "function" ? f = B(y(i)) : f = B(y), !f)
|
|
927
927
|
return v;
|
|
928
928
|
} else if (b !== void 0 && f !== void 0) {
|
|
929
929
|
if (f || (typeof b == "string" ? f = !!W(
|
|
930
930
|
new Object(i.formData.value),
|
|
931
931
|
b
|
|
932
|
-
) : typeof b == "function" ? f =
|
|
932
|
+
) : typeof b == "function" ? f = B(b(i)) : f = B(b), !f))
|
|
933
933
|
return v;
|
|
934
934
|
} else
|
|
935
935
|
f = void 0;
|
|
@@ -983,12 +983,12 @@ function q(e, t = {}) {
|
|
|
983
983
|
const l = Symbol("formInjectionKey"), g = Symbol("formWrapperInjectionKey"), a = Symbol("formFieldInjectionKey"), i = Symbol("formFieldsGroupInjectionKey"), u = We(
|
|
984
984
|
l,
|
|
985
985
|
g
|
|
986
|
-
), f =
|
|
986
|
+
), f = ke(
|
|
987
987
|
l,
|
|
988
988
|
g,
|
|
989
989
|
a,
|
|
990
990
|
t
|
|
991
|
-
), r =
|
|
991
|
+
), r = Be(
|
|
992
992
|
l,
|
|
993
993
|
g,
|
|
994
994
|
i
|
|
@@ -1005,7 +1005,7 @@ function q(e, t = {}) {
|
|
|
1005
1005
|
submit: Z,
|
|
1006
1006
|
validate: O,
|
|
1007
1007
|
VvForm: _
|
|
1008
|
-
} =
|
|
1008
|
+
} = Pe(e, l, t, v, o);
|
|
1009
1009
|
return {
|
|
1010
1010
|
clear: d,
|
|
1011
1011
|
errors: c,
|
|
@@ -1062,7 +1062,7 @@ function Qe(e, t = {}) {
|
|
|
1062
1062
|
export {
|
|
1063
1063
|
V as FormFieldType,
|
|
1064
1064
|
qe as createForm,
|
|
1065
|
-
|
|
1065
|
+
P as defaultObjectBySchema,
|
|
1066
1066
|
Qe as formType,
|
|
1067
1067
|
de as pluginInjectionKey,
|
|
1068
1068
|
He as useForm
|
package/dist/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(S,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core"),require("zod/v3"),require("zod/v4/core"),require("ts-dot-prop")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","zod/v3","zod/v4/core","ts-dot-prop"],e):(S=typeof globalThis<"u"?globalThis:S||self,e(S["@volverjs/form-vue"]={},S.Vue,S.VueUseCore,S.zodV3,S.zodV4Core,S.tsDotProp))})(this,function(S,e,L,Q,A,Z){"use strict";var j=(t=>(t.text="text",t.number="number",t.email="email",t.password="password",t.tel="tel",t.url="url",t.search="search",t.date="date",t.time="time",t.datetimeLocal="datetime-local",t.month="month",t.week="week",t.color="color",t.select="select",t.checkbox="checkbox",t.radio="radio",t.textarea="textarea",t.radioGroup="radioGroup",t.checkboxGroup="checkboxGroup",t.combobox="combobox",t.custom="custom",t))(j||{}),I=(t=>(t.invalid="invalid",t.valid="valid",t.submitting="submitting",t.reset="reset",t.updated="updated",t.unknown="unknown",t))(I||{});const B=t=>t._def.typeName==="ZodObject",N=t=>t._zod.def.type==="object",X=t=>t._def.typeName==="ZodDefault",Y=t=>t._zod.def.type==="default",ee=t=>t._def.typeName==="ZodNullable",te=t=>t._zod.def.type==="nullable",re=t=>t._def.typeName==="ZodRecord",ae=t=>t._zod.def.type==="record",ne=t=>t._def.typeName==="ZodArray",oe=t=>t._zod.def.type==="array",le=t=>t._def.typeName==="ZodEffects",M=t=>t._def.typeName==="ZodOptional",K=t=>t._zod.def.type==="optional",ie=t=>t._zod.def.type==="pipe",se=t=>t._zod.def.type==="transform";function P(t){let r=t;for(;le(r);)r=r.innerType();return r}function q(t){let r=t;for(;ie(r);)se(r._zod.def.out)?r=r._zod.def.in:r=r._zod.def.out;return r}const G=t=>{let r=P(t);return M(r)&&(r=r._def.innerType),r},U=t=>{let r=q(t);return K(r)&&(r=r._zod.def.innerType),r},ue=t=>{const r=P(t);return!!M(r)},de=t=>{const r=q(t);return!!K(r)},k=t=>"_zod"in t;function x(t,r={}){if(k(t)){const n=U(t);return N(n)?{...n._zod.def.catchall&&n._zod.def.catchall._zod.def.type!=="never"?r:{},...Object.fromEntries(("shape"in n._zod.def?Object.entries(n._zod.def.shape):[]).map(([i,c])=>{const a=r[i],v=de(c);let l=U(c),f;if(Y(l)&&(f=l._zod.def.defaultValue,l=l._zod.def.innerType),a===null&&te(l))return[i,a];if(a==null&&v)return[i,f];if(l){const m=A.safeParse(c,a);if(m.success)return[i,m.data??f]}if(oe(l)&&Array.isArray(a)&&a.length){const m=U(l._zod.def.element);if(N(m))return[i,a.map(D=>x(m,D&&typeof D=="object"?D:void 0))]}if(ae(l)&&a){const m=U(l._zod.def.valueType);if(N(m))return[i,Object.keys(a).reduce((D,y)=>(D[y]=x(m,a[y]),D),{})]}return N(l)?[i,x(l,a&&typeof a=="object"?a:f)]:[i,f]}))}:r}const s=G(t);return B(s)?{...s._def.unknownKeys==="passthrough"?r:{},...Object.fromEntries(("shape"in s?Object.entries(s.shape):[]).map(([n,d])=>{const i=r[n],c=ue(d);let a=G(d),v;if(X(a)&&(v=a._def.defaultValue(),a=a._def.innerType),i===null&&ee(a))return[n,i];if(i==null&&c)return[n,v];if(a){const l=d.safeParse(i);if(l.success)return[n,l.data??v]}if(ne(a)&&Array.isArray(i)&&i.length){const l=G(a._def.type);if(B(l))return[n,i.map(f=>x(l,f&&typeof f=="object"?f:void 0))]}if(re(a)&&i){const l=G(a._def.valueType);if(B(l))return[n,Object.keys(i).reduce((f,m)=>(f[m]=x(l,i[m]),f),{})]}return B(a)?[n,x(a,i&&typeof i=="object"?i:v)]:[n,v]}))}:r}const fe=(t,r)=>k(t)?A.safeParseAsync(t,r):t.safeParseAsync(r),ce=(t,r)=>k(t)?A.formatError(r):r.format(),ve=(t,r)=>k(t)?A.formatError(new A.$ZodError(r)):new Q.ZodError(r).format();function me(t,r,s,g,n){const d=e.ref(),i=e.ref(),c=e.computed(()=>i.value===I.invalid),a=e.ref(),v=e.ref(!1);let l;const f=O=>{const R=x(t,O);if(s?.class){const o=s.class;return new o(R)}return R},m=async(O=a.value,R)=>{if(l=R?.fields,v.value)return!0;const o=await fe(t,O);if(!o.success){if(i.value=I.invalid,!l?.size)return d.value=ce(t,o.error),!1;const w=o.error.issues.filter(C=>l?.has(C.path.join(".")));return w.length?(d.value=ve(t,w),!1):(d.value=void 0,!0)}return d.value=void 0,i.value=I.valid,a.value=f(o.data),!0},D=()=>{d.value=void 0,i.value=void 0,l=void 0},y=()=>{a.value=f(),D(),i.value=I.reset},p=async O=>v.value||!await m(void 0,O)?!1:(i.value=I.submitting,!0),{ignoreUpdates:h,stop:V}=L.watchIgnorable(a,()=>{i.value=I.updated},{deep:!0,eventFilter:L.throttleFilter(s?.updateThrottle??500)}),z=e.readonly(d),_=e.readonly(i),E=e.defineComponent({name:"VvForm",props:{continuousValidation:{type:Boolean,default:!1},modelValue:{type:Object,default:()=>({})},readonly:{type:Boolean,default:s?.readonly},tag:{type:String,default:"form"},template:{type:[Array,Function],default:void 0},superRefine:{type:Function,default:void 0},validateFields:{type:Array,default:void 0}},emits:["invalid","submit","update:modelValue","update:readonly","valid","reset"],expose:["errors","invalid","readonly","status","submit","tag","template","valid","validate","clear","reset"],slots:Object,setup(O,{emit:R}){return a.value=f(e.toRaw(O.modelValue)),e.watch(()=>O.modelValue,o=>{if(o){const w=e.isProxy(o)?e.toRaw(o):o;if(JSON.stringify(w)===JSON.stringify(e.toRaw(a.value)))return;a.value=typeof w?.clone=="function"?w.clone():JSON.parse(JSON.stringify(w))}},{deep:!0}),e.watch(i,async o=>{if(o===I.invalid){const w=e.toRaw(d.value);R("invalid",w),s?.onInvalid?.(w);return}if(o===I.valid){const w=e.toRaw(a.value);R("valid",w),s?.onValid?.(w),R("update:modelValue",w),s?.onUpdate?.(w);return}if(o===I.submitting){const w=e.toRaw(a.value);R("submit",w),s?.onSubmit?.(w);return}if(o===I.reset){const w=e.toRaw(a.value);R("reset",w),s?.onReset?.(w);return}if(o===I.updated){if((d.value||s?.continuousValidation||O.continuousValidation)&&await m(void 0,{superRefine:O.superRefine,fields:l??new Set(O.validateFields)}),!a.value||!O.modelValue||JSON.stringify(a.value)!==JSON.stringify(O.modelValue)){const w=e.toRaw(a.value);R("update:modelValue",w),s?.onUpdate?.(w)}i.value===I.updated&&(i.value=I.unknown)}}),e.onMounted(()=>{O.readonly!==void 0&&(v.value=O.readonly)}),e.watch(()=>O.readonly,o=>{v.value=o}),e.watch(v,o=>{o!==O.readonly&&R("update:readonly",v.value)}),e.provide(r,{clear:D,errors:z,formData:a,ignoreUpdates:h,invalid:c,readonly:v,reset:y,status:_,stopUpdatesWatch:V,submit:p,validate:m,wrappers:n}),{clear:D,errors:z,formData:a,ignoreUpdates:h,invalid:c,isReadonly:v,reset:y,status:_,stopUpdatesWatch:V,submit:()=>p({superRefine:O.superRefine,fields:new Set(O.validateFields)}),validate:m,wrappers:n}},render(){const O=()=>this.$slots?.default?.({errors:z.value,formData:a.value,invalid:c.value,readonly:v.value,status:_.value,wrappers:n,clear:D,ignoreUpdates:h,reset:y,stopUpdatesWatch:V,submit:p,validate:m})??this.$slots.default;return e.h(this.tag,{onSubmit:e.withModifiers(this.submit,["prevent"]),onReset:e.withModifiers(this.reset,["prevent"])},(this.template??s?.template)&&g?[e.h(g,{schema:this.template??s?.template},{default:O})]:{default:O})}});return{clear:D,errors:d,formData:a,ignoreUpdates:h,invalid:c,readonly:v,reset:y,status:i,wrappers:n,stopUpdatesWatch:V,submit:p,validate:m,VvForm:E}}function pe(t,r,s,g){return e.defineComponent({name:"VvFormField",props:{type:{type:String,validator:n=>Object.values(j).includes(n),default:j.custom},is:{type:[Object,String],default:void 0},name:{type:[String,Number,Boolean,Symbol],required:!0},props:{type:[Object,Function],default:()=>({})},showValid:{type:Boolean,default:!1},defaultValue:{type:[String,Number,Boolean,Array,Object],default:void 0},lazyLoad:{type:Boolean,default:!1},readonly:{type:Boolean,default:void 0}},emits:["invalid","update:formData","update:modelValue","valid"],expose:["component","errors","hasProps","invalid","invalidLabel","is","type"],slots:Object,setup(n,{slots:d,emit:i}){const{props:c,name:a}=e.toRefs(n),v=e.useId(),l=e.inject(r,void 0);l&&l.fields.value.set(v,n.name);const f=e.inject(t),m=e.computed({get(){if(f?.formData)return Z.get(new Object(f.formData.value),String(n.name))},set(o){f?.formData&&(Z.set(new Object(f.formData.value),String(n.name),o),i("update:modelValue",{newValue:m.value,formData:f?.formData}))}});e.onMounted(()=>{m.value===void 0&&n.defaultValue!==void 0&&(m.value=n.defaultValue)}),e.onBeforeUnmount(()=>{l&&l.fields.value.delete(v)});const D=e.computed(()=>{if(f?.errors.value)return Z.get(f.errors.value,String(n.name))}),y=e.computed(()=>D.value?._errors),p=e.computed(()=>D.value!==void 0),h=e.watch(p,o=>{if(o){i("invalid",D.value),l&&l.errors.value.set(String(n.name),D.value);return}i("valid",m.value),l&&l.errors.value.delete(n.name)}),V=e.watch(()=>f?.formData,()=>{i("update:formData",f?.formData)},{deep:!0});e.onBeforeUnmount(()=>{h(),V()});const z=o=>{o instanceof InputEvent&&(o=o.target.value),m.value=o},_=e.computed(()=>{let o=c.value;return typeof o=="function"&&(o=o(f?.formData)),Object.keys(o).reduce((w,C)=>(w[C]=e.unref(o[C]),w),{})}),E=e.computed(()=>f?.readonly.value||l?.readonly.value?!0:_.value.readonly??n.readonly),O=e.computed(()=>({..._.value,name:_.value.name??n.name,invalid:p.value,valid:n.showValid?!!(!p.value&&m.value):void 0,type:(o=>{if([j.color,j.date,j.datetimeLocal,j.email,j.month,j.number,j.password,j.search,j.tel,j.text,j.time,j.url,j.week].includes(o))return o})(n.type),invalidLabel:y.value,modelValue:m.value,readonly:E.value,"onUpdate:modelValue":z}));return e.provide(s,{name:e.readonly(a),errors:e.readonly(D)}),{component:e.computed(()=>{if(n.type===j.custom)return{render(){return d.default?.({errors:D.value,formData:f?.formData.value,formErrors:f?.errors.value,invalid:p.value,invalidLabel:y.value,modelValue:m.value,readonly:E.value,onUpdate:z,submit:f?.submit,validate:f?.validate})??d.default}};if(!(g?.lazyLoad??n.lazyLoad)){let o;switch(n.type){case j.select:o=e.resolveComponent("VvSelect");break;case j.checkbox:o=e.resolveComponent("VvCheckbox");break;case j.radio:o=e.resolveComponent("VvRadio");break;case j.textarea:o=e.resolveComponent("VvTextarea");break;case j.radioGroup:o=e.resolveComponent("VvRadioGroup");break;case j.checkboxGroup:o=e.resolveComponent("VvCheckboxGroup");break;case j.combobox:o=e.resolveComponent("VvCombobox");break;default:o=e.resolveComponent("VvInputText")}if(typeof o!="string")return o;console.warn(`[@volverjs/form-vue]: ${o} not found, the component will be loaded asynchronously. To avoid this warning, please set "lazyLoad" option.`)}return e.defineAsyncComponent(async()=>{switch(g?.sideEffects&&await Promise.resolve(g.sideEffects(n.type)),n.type){case j.textarea:return import("@volverjs/ui-vue/vv-textarea");case j.radio:return import("@volverjs/ui-vue/vv-radio");case j.radioGroup:return import("@volverjs/ui-vue/vv-radio-group");case j.checkbox:return import("@volverjs/ui-vue/vv-checkbox");case j.checkboxGroup:return import("@volverjs/ui-vue/vv-checkbox-group");case j.select:return import("@volverjs/ui-vue/vv-select");case j.combobox:return import("@volverjs/ui-vue/vv-combobox")}return import("@volverjs/ui-vue/vv-input-text")})}),hasProps:O,invalid:p}},render(){return this.is?e.h(this.is,this.hasProps,this.$slots):this.type===j.custom?e.h(this.component,null,this.$slots):e.h(this.component,this.hasProps,this.$slots)}})}function ye(t,r,s){return e.defineComponent({name:"VvFormFieldsGroup",props:{is:{type:[Object,String],default:void 0},names:{type:[Array,Object],required:!0},props:{type:[Object,Function],default:()=>({})},showValid:{type:Boolean,default:!1},defaultValues:{type:[Object],default:void 0},readonly:{type:Boolean,default:void 0}},emits:["invalid","update:formData","update:modelValue","valid"],expose:["component","errors","hasProps","invalid","invalidLabels","is"],slots:Object,setup(g,{slots:n,emit:d}){const{props:i,names:c,defaultValues:a}=e.toRefs(g),v=e.useId(),l=e.computed(()=>Array.isArray(c.value)?c.value:Object.values(c.value)),f=e.computed(()=>Array.isArray(c.value)?c.value:Object.keys(c.value)),m=e.computed(()=>Array.isArray(c.value)?c.value.reduce((u,b)=>(u[String(b)]=b,u),{}):c.value),D=e.computed(()=>Object.keys(m.value).reduce((u,b)=>(u[String(m.value[b])]=b,u),{})),y=e.inject(r,void 0);y&&l.value.forEach(u=>{y.fields.value.set(`${v}-${u}`,u)});const p=e.inject(t),h=e.computed({get(){return p?.formData?f.value.reduce((u,b)=>(u[b]=Z.get(new Object(p.formData.value),m.value[b]),u),{}):{}},set(u){p?.formData&&(f.value.forEach(b=>{Z.set(new Object(p.formData.value),m.value[b],u?.[b])}),d("update:modelValue",{newValue:h.value,formData:p?.formData}))}});e.onMounted(()=>{a.value&&l.value.forEach(u=>{a.value?.[u]!==void 0&&h.value[u]===void 0&&(h.value={...h.value,[u]:a.value?.[u]})})}),e.onBeforeUnmount(()=>{y&&l.value.forEach(u=>{y.fields.value.delete(`${v}-${u}`)})});const V=e.computed(()=>{if(!p?.errors.value)return;const u=l.value.reduce((b,F)=>{if(!p.errors.value)return b;const H=Z.get(p.errors.value,String(F));return H===void 0||(b[String(F)]=H),b},{});if(Object.keys(u).length!==0)return u}),z=e.computed(()=>{if(!V.value)return;const u=Object.keys(V.value).reduce((b,F)=>(V.value?.[F]&&(b[D.value[F]]=V.value[F]._errors),b),{});if(Object.keys(u).length!==0)return u}),_=e.computed(()=>V.value!==void 0),E=e.computed(()=>f.value.reduce((u,b)=>(u[b]=!!V.value?.[D.value[b]],u),{})),O=e.watch(_,()=>{if(_.value){d("invalid",V.value),y&&l.value.forEach(u=>{if(!V.value?.[u]){y.errors.value.delete(u);return}y.errors.value.set(u,V.value?.[u])});return}d("valid",h.value),y&&l.value.forEach(u=>{y.errors.value.delete(u)})}),R=e.watch(()=>p?.formData,()=>{d("update:formData",p?.formData)},{deep:!0});e.onBeforeUnmount(()=>{O(),R()});const o=u=>{h.value=u},w=(u,b)=>{b instanceof InputEvent&&(b=b.target.value),f.value.includes(u)&&(h.value={...h.value,[u]:b})},C=e.computed(()=>{let u=i.value;return typeof u=="function"&&(u=u(p?.formData)),Object.keys(u).reduce((b,F)=>(b[F]=e.unref(u[F]),b),{})}),J=e.computed(()=>p?.readonly.value?!0:C.value.readonly??g.readonly),ge=e.computed(()=>f.value.reduce((u,b)=>(u[`onUpdate:${b}`]=F=>{w(b,F)},u),{"onUpdate:modelValue":o})),Oe=e.computed(()=>({...ge.value,...C.value,...h.value,modelValue:h.value,names:C.value.name??l.value,invalid:_.value,invalids:E.value,valid:g.showValid?!!(!_.value&&h.value):void 0,invalidLabels:z.value,readonly:J.value}));return e.provide(s,{names:e.readonly(c),errors:e.readonly(V)}),{component:e.computed(()=>({render(){return n.default?.({errors:V.value,formData:p?.formData.value,formErrors:p?.errors.value,invalid:_.value,invalids:E.value,invalidLabels:z.value,modelValue:h.value,onUpdate:o,onUpdateField:w,readonly:J.value,submit:p?.submit,validate:p?.validate})??n.default}})),hasProps:Oe,invalid:_}},render(){return this.is?e.h(this.is,this.hasProps,this.$slots):e.h(this.component,null,this.$slots)}})}function he(t,r){return e.defineComponent({name:"VvFormWrapper",props:{name:{type:String,required:!0},tag:{type:String,default:void 0},readonly:{type:Boolean,default:!1}},emits:["invalid","valid"],expose:["clear","errors","fields","fieldsErrors","formData","invalid","readonly","reset","submit","tag","validate","validateWrapper"],slots:Object,setup(s,{emit:g}){const n=e.inject(t),d=e.inject(r,void 0),i=e.ref(new Map),c=e.ref(new Map),{name:a}=e.toRefs(s),v=e.computed(()=>n?.invalid.value?c.value.size>0:!1);e.watch(v,y=>{if(y){g("invalid");return}g("valid")});const l=e.computed(()=>n?.readonly.value||s.readonly),f={name:e.readonly(a),errors:c,invalid:e.readonly(v),readonly:e.readonly(l),fields:i};e.provide(r,f);const m=e.computed(()=>new Map(i.value));e.watch(m,(y,p)=>{d?.fields&&(p.forEach((h,V)=>{y.has(V)||d?.fields.value.delete(V)}),y.forEach((h,V)=>{d?.fields.value.has(V)||d?.fields.value.set(V,h)}))},{deep:!0}),e.watch(c,y=>{d?.errors&&i.value.forEach(p=>{if(y.has(p)||d.errors.value.delete(p),y.has(p)){const h=y.get(p);h&&d.errors.value.set(p,h)}})},{deep:!0}),e.onMounted(()=>{if(!n?.wrappers||!a.value){console.warn("[@volverjs/form-vue]: Invalid wrapper registration state");return}if(n.wrappers.has(a.value)){console.warn(`[@volverjs/form-vue]: wrapper name "${a.value}" is already used`);return}n.wrappers.set(a.value,f)}),e.onBeforeUnmount(()=>{n?.wrappers&&a.value&&n.wrappers.delete(a.value)});const D=()=>n?.validate(void 0,{fields:new Set(i.value.values())})??Promise.resolve(!0);return{errors:n?.errors,fields:i,fieldsErrors:c,formData:n?.formData,invalid:v,readonly:l,clear:n?.clear,reset:n?.reset,submit:n?.submit,validate:n?.validate,validateWrapper:D}},render(){const s=()=>this.$slots.default?.({errors:this.errors,fieldsErrors:this.fieldsErrors,formData:this.formData,invalid:this.invalid,readonly:this.readonly,clear:this.clear,reset:this.reset,submit:this.submit,validate:this.validate,validateWrapper:this.validateWrapper});return this.tag?e.h(this.tag,null,{default:s}):s()}})}function be(t,r){const s=e.defineComponent({name:"VvFormTemplate",props:{schema:{type:[Array,Function],required:!0},scope:{type:Object,default:()=>({})}},slots:Object,setup(g,{slots:n}){const d=e.inject(t);if(d?.formData)return()=>{const i=typeof g.schema=="function"?g.schema(d,g.scope):g.schema;let c;const a=i.reduce((v,l)=>{const f=typeof l=="function"?l(d,g.scope):l,{vvIs:m,vvName:D,vvSlots:y,vvChildren:p,vvIf:h,vvElseIf:V,vvType:z,vvDefaultValue:_,vvShowValid:E,vvContent:O,...R}=f;if(h!==void 0){if(typeof h=="string"?c=!!Z.get(new Object(d.formData.value),h):typeof h=="function"?c=e.unref(h(d)):c=e.unref(h),!c)return v}else if(V!==void 0&&c!==void 0){if(c||(typeof V=="string"?c=!!Z.get(new Object(d.formData.value),V):typeof V=="function"?c=e.unref(V(d)):c=e.unref(V),!c))return v}else c=void 0;let o;return p&&(typeof m=="string"?o=e.h(s,{schema:p}):o={default:w=>e.h(s,{schema:p,scope:w})}),D?(v.push(e.h(r,{name:D,is:m,type:z,defaultValue:_,showValid:E,props:R},y??o??O)),v):m?(v.push(e.h(m,R,y??o??O)),v):(o&&("default"in o?v.push(o.default(g.scope)):v.push(o)),v)},[]);return a.push(n?.default?.({errors:d?.errors.value,formData:d?.formData.value,invalid:d?.invalid.value,status:d?.status.value,submit:d?.submit,validate:d?.validate,clear:d?.clear,reset:d?.reset})),a}}});return s}function W(t,r={}){const s=Symbol("formInjectionKey"),g=Symbol("formWrapperInjectionKey"),n=Symbol("formFieldInjectionKey"),d=Symbol("formFieldsGroupInjectionKey"),i=he(s,g),c=pe(s,g,n,r),a=ye(s,g,d),v=be(s,c),l=new Map,{clear:f,errors:m,formData:D,ignoreUpdates:y,invalid:p,readonly:h,reset:V,status:z,stopUpdatesWatch:_,submit:E,validate:O,VvForm:R}=me(t,s,r,v,l);return{clear:f,errors:m,formData:D,formFieldInjectionKey:n,formInjectionKey:s,formWrapperInjectionKey:g,ignoreUpdates:y,invalid:p,readonly:h,reset:V,status:z,stopUpdatesWatch:_,submit:E,validate:O,wrappers:l,VvForm:R,VvFormField:c,VvFormFieldsGroup:a,VvFormTemplate:v,VvFormWrapper:i}}const $=Symbol("pluginInjectionKey");function je(t){let r={};return t.schema&&(r=W(t.schema,t)),{...r,install(s,{global:g=!1}={}){s.provide($,t),g&&(s.config.globalProperties.$vvForm=t,r?.VvForm&&s.component("VvForm",r.VvForm),r?.VvFormWrapper&&s.component("VvFormWrapper",r.VvFormWrapper),r?.VvFormField&&s.component("VvFormField",r.VvFormField),r?.VvFormFieldsGroup&&s.component("VvFormFieldsGroup",r.VvFormFieldsGroup),r?.VvFormTemplate&&s.component("VvFormTemplate",r.VvFormTemplate))}}}const T=new Map;function Ve(t,r={}){if(r.scope&&T.has(r.scope))return T.get(r.scope);if(!e.getCurrentInstance()){const g=W(t,r);return r.scope&&T.set(r.scope,g),g}const s=W(t,{...e.inject($,{}),...r});return r.scope&&T.set(r.scope,s),s}function we(t,r={}){return W(t,r)}S.FormFieldType=j,S.createForm=je,S.defaultObjectBySchema=x,S.formType=we,S.pluginInjectionKey=$,S.useForm=Ve,Object.defineProperty(S,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(S,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core"),require("zod/v3"),require("zod/v4/core"),require("dot-prop")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","zod/v3","zod/v4/core","dot-prop"],e):(S=typeof globalThis<"u"?globalThis:S||self,e(S["@volverjs/form-vue"]={},S.Vue,S.VueUseCore,S.zodV3,S.zodV4Core,S.dotProp))})(this,function(S,e,$,Q,A,Z){"use strict";var j=(t=>(t.text="text",t.number="number",t.email="email",t.password="password",t.tel="tel",t.url="url",t.search="search",t.date="date",t.time="time",t.datetimeLocal="datetime-local",t.month="month",t.week="week",t.color="color",t.select="select",t.checkbox="checkbox",t.radio="radio",t.textarea="textarea",t.radioGroup="radioGroup",t.checkboxGroup="checkboxGroup",t.combobox="combobox",t.custom="custom",t))(j||{}),I=(t=>(t.invalid="invalid",t.valid="valid",t.submitting="submitting",t.reset="reset",t.updated="updated",t.unknown="unknown",t))(I||{});const B=t=>t._def.typeName==="ZodObject",N=t=>t._zod.def.type==="object",X=t=>t._def.typeName==="ZodDefault",Y=t=>t._zod.def.type==="default",ee=t=>t._def.typeName==="ZodNullable",te=t=>t._zod.def.type==="nullable",re=t=>t._def.typeName==="ZodRecord",ae=t=>t._zod.def.type==="record",ne=t=>t._def.typeName==="ZodArray",oe=t=>t._zod.def.type==="array",le=t=>t._def.typeName==="ZodEffects",L=t=>t._def.typeName==="ZodOptional",M=t=>t._zod.def.type==="optional",ie=t=>t._zod.def.type==="pipe",se=t=>t._zod.def.type==="transform";function K(t){let r=t;for(;le(r);)r=r.innerType();return r}function q(t){let r=t;for(;ie(r);)se(r._zod.def.out)?r=r._zod.def.in:r=r._zod.def.out;return r}const G=t=>{let r=K(t);return L(r)&&(r=r._def.innerType),r},P=t=>{let r=q(t);return M(r)&&(r=r._zod.def.innerType),r},ue=t=>{const r=K(t);return!!L(r)},de=t=>{const r=q(t);return!!M(r)},U=t=>"_zod"in t;function x(t,r={}){if(U(t)){const n=P(t);return N(n)?{...n._zod.def.catchall&&n._zod.def.catchall._zod.def.type!=="never"?r:{},...Object.fromEntries(("shape"in n._zod.def?Object.entries(n._zod.def.shape):[]).map(([i,c])=>{const a=r[i],v=de(c);let l=P(c),f;if(Y(l)&&(f=l._zod.def.defaultValue,l=l._zod.def.innerType),a===null&&te(l))return[i,a];if(a==null&&v)return[i,f];if(l){const m=A.safeParse(c,a);if(m.success)return[i,m.data??f]}if(oe(l)&&Array.isArray(a)&&a.length){const m=P(l._zod.def.element);if(N(m))return[i,a.map(D=>x(m,D&&typeof D=="object"?D:void 0))]}if(ae(l)&&a){const m=P(l._zod.def.valueType);if(N(m))return[i,Object.keys(a).reduce((D,y)=>(D[y]=x(m,a[y]),D),{})]}return N(l)?[i,x(l,a&&typeof a=="object"?a:f)]:[i,f]}))}:r}const s=G(t);return B(s)?{...s._def.unknownKeys==="passthrough"?r:{},...Object.fromEntries(("shape"in s?Object.entries(s.shape):[]).map(([n,d])=>{const i=r[n],c=ue(d);let a=G(d),v;if(X(a)&&(v=a._def.defaultValue(),a=a._def.innerType),i===null&&ee(a))return[n,i];if(i==null&&c)return[n,v];if(a){const l=d.safeParse(i);if(l.success)return[n,l.data??v]}if(ne(a)&&Array.isArray(i)&&i.length){const l=G(a._def.type);if(B(l))return[n,i.map(f=>x(l,f&&typeof f=="object"?f:void 0))]}if(re(a)&&i){const l=G(a._def.valueType);if(B(l))return[n,Object.keys(i).reduce((f,m)=>(f[m]=x(l,i[m]),f),{})]}return B(a)?[n,x(a,i&&typeof i=="object"?i:v)]:[n,v]}))}:r}const fe=(t,r)=>U(t)?A.safeParseAsync(t,r):t.safeParseAsync(r),ce=(t,r)=>U(t)?A.formatError(r):r.format(),ve=(t,r)=>U(t)?A.formatError(new A.$ZodError(r)):new Q.ZodError(r).format();function me(t,r,s,g,n){const d=e.ref(),i=e.ref(),c=e.computed(()=>i.value===I.invalid),a=e.ref(),v=e.ref(!1);let l;const f=O=>{const R=x(t,O);if(s?.class){const o=s.class;return new o(R)}return R},m=async(O=a.value,R)=>{if(l=R?.fields,v.value)return!0;const o=await fe(t,O);if(!o.success){if(i.value=I.invalid,!l?.size)return d.value=ce(t,o.error),!1;const w=o.error.issues.filter(C=>l?.has(C.path.join(".")));return w.length?(d.value=ve(t,w),!1):(d.value=void 0,!0)}return d.value=void 0,i.value=I.valid,a.value=f(o.data),!0},D=()=>{d.value=void 0,i.value=void 0,l=void 0},y=()=>{a.value=f(),D(),i.value=I.reset},p=async O=>v.value||!await m(void 0,O)?!1:(i.value=I.submitting,!0),{ignoreUpdates:h,stop:V}=$.watchIgnorable(a,()=>{i.value=I.updated},{deep:!0,eventFilter:$.throttleFilter(s?.updateThrottle??500)}),z=e.readonly(d),_=e.readonly(i),E=e.defineComponent({name:"VvForm",props:{continuousValidation:{type:Boolean,default:!1},modelValue:{type:Object,default:()=>({})},readonly:{type:Boolean,default:s?.readonly},tag:{type:String,default:"form"},template:{type:[Array,Function],default:void 0},superRefine:{type:Function,default:void 0},validateFields:{type:Array,default:void 0}},emits:["invalid","submit","update:modelValue","update:readonly","valid","reset"],expose:["errors","invalid","readonly","status","submit","tag","template","valid","validate","clear","reset"],slots:Object,setup(O,{emit:R}){return a.value=f(e.toRaw(O.modelValue)),e.watch(()=>O.modelValue,o=>{if(o){const w=e.isProxy(o)?e.toRaw(o):o;if(JSON.stringify(w)===JSON.stringify(e.toRaw(a.value)))return;a.value=typeof w?.clone=="function"?w.clone():JSON.parse(JSON.stringify(w))}},{deep:!0}),e.watch(i,async o=>{if(o===I.invalid){const w=e.toRaw(d.value);R("invalid",w),s?.onInvalid?.(w);return}if(o===I.valid){const w=e.toRaw(a.value);R("valid",w),s?.onValid?.(w),R("update:modelValue",w),s?.onUpdate?.(w);return}if(o===I.submitting){const w=e.toRaw(a.value);R("submit",w),s?.onSubmit?.(w);return}if(o===I.reset){const w=e.toRaw(a.value);R("reset",w),s?.onReset?.(w);return}if(o===I.updated){if((d.value||s?.continuousValidation||O.continuousValidation)&&await m(void 0,{superRefine:O.superRefine,fields:l??new Set(O.validateFields)}),!a.value||!O.modelValue||JSON.stringify(a.value)!==JSON.stringify(O.modelValue)){const w=e.toRaw(a.value);R("update:modelValue",w),s?.onUpdate?.(w)}i.value===I.updated&&(i.value=I.unknown)}}),e.onMounted(()=>{O.readonly!==void 0&&(v.value=O.readonly)}),e.watch(()=>O.readonly,o=>{v.value=o}),e.watch(v,o=>{o!==O.readonly&&R("update:readonly",v.value)}),e.provide(r,{clear:D,errors:z,formData:a,ignoreUpdates:h,invalid:c,readonly:v,reset:y,status:_,stopUpdatesWatch:V,submit:p,validate:m,wrappers:n}),{clear:D,errors:z,formData:a,ignoreUpdates:h,invalid:c,isReadonly:v,reset:y,status:_,stopUpdatesWatch:V,submit:()=>p({superRefine:O.superRefine,fields:new Set(O.validateFields)}),validate:m,wrappers:n}},render(){const O=()=>this.$slots?.default?.({errors:z.value,formData:a.value,invalid:c.value,readonly:v.value,status:_.value,wrappers:n,clear:D,ignoreUpdates:h,reset:y,stopUpdatesWatch:V,submit:p,validate:m})??this.$slots.default;return e.h(this.tag,{onSubmit:e.withModifiers(this.submit,["prevent"]),onReset:e.withModifiers(this.reset,["prevent"])},(this.template??s?.template)&&g?[e.h(g,{schema:this.template??s?.template},{default:O})]:{default:O})}});return{clear:D,errors:d,formData:a,ignoreUpdates:h,invalid:c,readonly:v,reset:y,status:i,wrappers:n,stopUpdatesWatch:V,submit:p,validate:m,VvForm:E}}function pe(t,r,s,g){return e.defineComponent({name:"VvFormField",props:{type:{type:String,validator:n=>Object.values(j).includes(n),default:j.custom},is:{type:[Object,String],default:void 0},name:{type:[String,Number,Boolean,Symbol],required:!0},props:{type:[Object,Function],default:()=>({})},showValid:{type:Boolean,default:!1},defaultValue:{type:[String,Number,Boolean,Array,Object],default:void 0},lazyLoad:{type:Boolean,default:!1},readonly:{type:Boolean,default:void 0}},emits:["invalid","update:formData","update:modelValue","valid"],expose:["component","errors","hasProps","invalid","invalidLabel","is","type"],slots:Object,setup(n,{slots:d,emit:i}){const{props:c,name:a}=e.toRefs(n),v=e.useId(),l=e.inject(r,void 0);l&&l.fields.value.set(v,n.name);const f=e.inject(t),m=e.computed({get(){if(f?.formData)return Z.getProperty(new Object(f.formData.value),String(n.name))},set(o){f?.formData&&(Z.setProperty(new Object(f.formData.value),String(n.name),o),i("update:modelValue",{newValue:m.value,formData:f?.formData}))}});e.onMounted(()=>{m.value===void 0&&n.defaultValue!==void 0&&(m.value=n.defaultValue)}),e.onBeforeUnmount(()=>{l&&l.fields.value.delete(v)});const D=e.computed(()=>{if(f?.errors.value)return Z.getProperty(f.errors.value,String(n.name))}),y=e.computed(()=>D.value?._errors),p=e.computed(()=>D.value!==void 0),h=e.watch(p,o=>{if(o){i("invalid",D.value),l&&l.errors.value.set(String(n.name),D.value);return}i("valid",m.value),l&&l.errors.value.delete(n.name)}),V=e.watch(()=>f?.formData,()=>{i("update:formData",f?.formData)},{deep:!0});e.onBeforeUnmount(()=>{h(),V()});const z=o=>{o instanceof InputEvent&&(o=o.target.value),m.value=o},_=e.computed(()=>{let o=c.value;return typeof o=="function"&&(o=o(f?.formData)),Object.keys(o).reduce((w,C)=>(w[C]=e.unref(o[C]),w),{})}),E=e.computed(()=>f?.readonly.value||l?.readonly.value?!0:_.value.readonly??n.readonly),O=e.computed(()=>({..._.value,name:_.value.name??n.name,invalid:p.value,valid:n.showValid?!!(!p.value&&m.value):void 0,type:(o=>{if([j.color,j.date,j.datetimeLocal,j.email,j.month,j.number,j.password,j.search,j.tel,j.text,j.time,j.url,j.week].includes(o))return o})(n.type),invalidLabel:y.value,modelValue:m.value,readonly:E.value,"onUpdate:modelValue":z}));return e.provide(s,{name:e.readonly(a),errors:e.readonly(D)}),{component:e.computed(()=>{if(n.type===j.custom)return{render(){return d.default?.({errors:e.readonly(D).value,formData:f?.formData.value,formErrors:f?.errors.value,invalid:p.value,invalidLabel:y.value,modelValue:m.value,readonly:E.value,onUpdate:z,submit:f?.submit,validate:f?.validate})??d.default}};if(!(g?.lazyLoad??n.lazyLoad)){let o;switch(n.type){case j.select:o=e.resolveComponent("VvSelect");break;case j.checkbox:o=e.resolveComponent("VvCheckbox");break;case j.radio:o=e.resolveComponent("VvRadio");break;case j.textarea:o=e.resolveComponent("VvTextarea");break;case j.radioGroup:o=e.resolveComponent("VvRadioGroup");break;case j.checkboxGroup:o=e.resolveComponent("VvCheckboxGroup");break;case j.combobox:o=e.resolveComponent("VvCombobox");break;default:o=e.resolveComponent("VvInputText")}if(typeof o!="string")return o;console.warn(`[@volverjs/form-vue]: ${o} not found, the component will be loaded asynchronously. To avoid this warning, please set "lazyLoad" option.`)}return e.defineAsyncComponent(async()=>{switch(g?.sideEffects&&await Promise.resolve(g.sideEffects(n.type)),n.type){case j.textarea:return import("@volverjs/ui-vue/vv-textarea");case j.radio:return import("@volverjs/ui-vue/vv-radio");case j.radioGroup:return import("@volverjs/ui-vue/vv-radio-group");case j.checkbox:return import("@volverjs/ui-vue/vv-checkbox");case j.checkboxGroup:return import("@volverjs/ui-vue/vv-checkbox-group");case j.select:return import("@volverjs/ui-vue/vv-select");case j.combobox:return import("@volverjs/ui-vue/vv-combobox")}return import("@volverjs/ui-vue/vv-input-text")})}),hasProps:O,invalid:p}},render(){return this.is?e.h(this.is,this.hasProps,this.$slots):this.type===j.custom?e.h(this.component,null,this.$slots):e.h(this.component,this.hasProps,this.$slots)}})}function ye(t,r,s){return e.defineComponent({name:"VvFormFieldsGroup",props:{is:{type:[Object,String],default:void 0},names:{type:[Array,Object],required:!0},props:{type:[Object,Function],default:()=>({})},showValid:{type:Boolean,default:!1},defaultValues:{type:[Object],default:void 0},readonly:{type:Boolean,default:void 0}},emits:["invalid","update:formData","update:modelValue","valid"],expose:["component","errors","hasProps","invalid","invalidLabels","is"],slots:Object,setup(g,{slots:n,emit:d}){const{props:i,names:c,defaultValues:a}=e.toRefs(g),v=e.useId(),l=e.computed(()=>Array.isArray(c.value)?c.value:Object.values(c.value)),f=e.computed(()=>Array.isArray(c.value)?c.value:Object.keys(c.value)),m=e.computed(()=>Array.isArray(c.value)?c.value.reduce((u,b)=>(u[String(b)]=b,u),{}):c.value),D=e.computed(()=>Object.keys(m.value).reduce((u,b)=>(u[String(m.value[b])]=b,u),{})),y=e.inject(r,void 0);y&&l.value.forEach(u=>{y.fields.value.set(`${v}-${u}`,u)});const p=e.inject(t),h=e.computed({get(){return p?.formData?f.value.reduce((u,b)=>(u[b]=Z.getProperty(new Object(p.formData.value),m.value[b]),u),{}):{}},set(u){p?.formData&&(f.value.forEach(b=>{Z.setProperty(new Object(p.formData.value),m.value[b],u?.[b])}),d("update:modelValue",{newValue:h.value,formData:p?.formData}))}});e.onMounted(()=>{a.value&&l.value.forEach(u=>{a.value?.[u]!==void 0&&h.value[u]===void 0&&(h.value={...h.value,[u]:a.value?.[u]})})}),e.onBeforeUnmount(()=>{y&&l.value.forEach(u=>{y.fields.value.delete(`${v}-${u}`)})});const V=e.computed(()=>{if(!p?.errors.value)return;const u=l.value.reduce((b,F)=>{if(!p.errors.value)return b;const H=Z.getProperty(p.errors.value,String(F));return H===void 0||(b[String(F)]=H),b},{});if(Object.keys(u).length!==0)return u}),z=e.computed(()=>{if(!V.value)return;const u=Object.keys(V.value).reduce((b,F)=>(V.value?.[F]&&(b[D.value[F]]=V.value[F]._errors),b),{});if(Object.keys(u).length!==0)return u}),_=e.computed(()=>V.value!==void 0),E=e.computed(()=>f.value.reduce((u,b)=>(u[b]=!!V.value?.[D.value[b]],u),{})),O=e.watch(_,()=>{if(_.value){d("invalid",V.value),y&&l.value.forEach(u=>{if(!V.value?.[u]){y.errors.value.delete(u);return}y.errors.value.set(u,V.value?.[u])});return}d("valid",h.value),y&&l.value.forEach(u=>{y.errors.value.delete(u)})}),R=e.watch(()=>p?.formData,()=>{d("update:formData",p?.formData)},{deep:!0});e.onBeforeUnmount(()=>{O(),R()});const o=u=>{h.value=u},w=(u,b)=>{b instanceof InputEvent&&(b=b.target.value),f.value.includes(u)&&(h.value={...h.value,[u]:b})},C=e.computed(()=>{let u=i.value;return typeof u=="function"&&(u=u(p?.formData)),Object.keys(u).reduce((b,F)=>(b[F]=e.unref(u[F]),b),{})}),J=e.computed(()=>p?.readonly.value?!0:C.value.readonly??g.readonly),ge=e.computed(()=>f.value.reduce((u,b)=>(u[`onUpdate:${b}`]=F=>{w(b,F)},u),{"onUpdate:modelValue":o})),Oe=e.computed(()=>({...ge.value,...C.value,...h.value,modelValue:h.value,names:C.value.name??l.value,invalid:_.value,invalids:E.value,valid:g.showValid?!!(!_.value&&h.value):void 0,invalidLabels:z.value,readonly:J.value}));return e.provide(s,{names:e.readonly(c),errors:e.readonly(V)}),{component:e.computed(()=>({render(){return n.default?.({errors:V.value,formData:p?.formData.value,formErrors:p?.errors.value,invalid:_.value,invalids:E.value,invalidLabels:z.value,modelValue:h.value,onUpdate:o,onUpdateField:w,readonly:J.value,submit:p?.submit,validate:p?.validate})??n.default}})),hasProps:Oe,invalid:_}},render(){return this.is?e.h(this.is,this.hasProps,this.$slots):e.h(this.component,null,this.$slots)}})}function he(t,r){return e.defineComponent({name:"VvFormWrapper",props:{name:{type:String,required:!0},tag:{type:String,default:void 0},readonly:{type:Boolean,default:!1}},emits:["invalid","valid"],expose:["clear","errors","fields","fieldsErrors","formData","invalid","readonly","reset","submit","tag","validate","validateWrapper"],slots:Object,setup(s,{emit:g}){const n=e.inject(t),d=e.inject(r,void 0),i=e.ref(new Map),c=e.ref(new Map),{name:a}=e.toRefs(s),v=e.computed(()=>n?.invalid.value?c.value.size>0:!1);e.watch(v,y=>{if(y){g("invalid");return}g("valid")});const l=e.computed(()=>n?.readonly.value||s.readonly),f={name:e.readonly(a),errors:c,invalid:e.readonly(v),readonly:e.readonly(l),fields:i};e.provide(r,f);const m=e.computed(()=>new Map(i.value));e.watch(m,(y,p)=>{d?.fields&&(p.forEach((h,V)=>{y.has(V)||d?.fields.value.delete(V)}),y.forEach((h,V)=>{d?.fields.value.has(V)||d?.fields.value.set(V,h)}))},{deep:!0}),e.watch(c,y=>{d?.errors&&i.value.forEach(p=>{if(y.has(p)||d.errors.value.delete(p),y.has(p)){const h=y.get(p);h&&d.errors.value.set(p,h)}})},{deep:!0}),e.onMounted(()=>{if(!n?.wrappers||!a.value){console.warn("[@volverjs/form-vue]: Invalid wrapper registration state");return}if(n.wrappers.has(a.value)){console.warn(`[@volverjs/form-vue]: wrapper name "${a.value}" is already used`);return}n.wrappers.set(a.value,f)}),e.onBeforeUnmount(()=>{n?.wrappers&&a.value&&n.wrappers.delete(a.value)});const D=()=>n?.validate(void 0,{fields:new Set(i.value.values())})??Promise.resolve(!0);return{errors:n?.errors,fields:i,fieldsErrors:c,formData:n?.formData,invalid:v,readonly:l,clear:n?.clear,reset:n?.reset,submit:n?.submit,validate:n?.validate,validateWrapper:D}},render(){const s=()=>this.$slots.default?.({errors:this.errors,fieldsErrors:this.fieldsErrors,formData:this.formData,invalid:this.invalid,readonly:this.readonly,clear:this.clear,reset:this.reset,submit:this.submit,validate:this.validate,validateWrapper:this.validateWrapper});return this.tag?e.h(this.tag,null,{default:s}):s()}})}function be(t,r){const s=e.defineComponent({name:"VvFormTemplate",props:{schema:{type:[Array,Function],required:!0},scope:{type:Object,default:()=>({})}},slots:Object,setup(g,{slots:n}){const d=e.inject(t);if(d?.formData)return()=>{const i=typeof g.schema=="function"?g.schema(d,g.scope):g.schema;let c;const a=i.reduce((v,l)=>{const f=typeof l=="function"?l(d,g.scope):l,{vvIs:m,vvName:D,vvSlots:y,vvChildren:p,vvIf:h,vvElseIf:V,vvType:z,vvDefaultValue:_,vvShowValid:E,vvContent:O,...R}=f;if(h!==void 0){if(typeof h=="string"?c=!!Z.getProperty(new Object(d.formData.value),h):typeof h=="function"?c=e.unref(h(d)):c=e.unref(h),!c)return v}else if(V!==void 0&&c!==void 0){if(c||(typeof V=="string"?c=!!Z.getProperty(new Object(d.formData.value),V):typeof V=="function"?c=e.unref(V(d)):c=e.unref(V),!c))return v}else c=void 0;let o;return p&&(typeof m=="string"?o=e.h(s,{schema:p}):o={default:w=>e.h(s,{schema:p,scope:w})}),D?(v.push(e.h(r,{name:D,is:m,type:z,defaultValue:_,showValid:E,props:R},y??o??O)),v):m?(v.push(e.h(m,R,y??o??O)),v):(o&&("default"in o?v.push(o.default(g.scope)):v.push(o)),v)},[]);return a.push(n?.default?.({errors:d?.errors.value,formData:d?.formData.value,invalid:d?.invalid.value,status:d?.status.value,submit:d?.submit,validate:d?.validate,clear:d?.clear,reset:d?.reset})),a}}});return s}function k(t,r={}){const s=Symbol("formInjectionKey"),g=Symbol("formWrapperInjectionKey"),n=Symbol("formFieldInjectionKey"),d=Symbol("formFieldsGroupInjectionKey"),i=he(s,g),c=pe(s,g,n,r),a=ye(s,g,d),v=be(s,c),l=new Map,{clear:f,errors:m,formData:D,ignoreUpdates:y,invalid:p,readonly:h,reset:V,status:z,stopUpdatesWatch:_,submit:E,validate:O,VvForm:R}=me(t,s,r,v,l);return{clear:f,errors:m,formData:D,formFieldInjectionKey:n,formInjectionKey:s,formWrapperInjectionKey:g,ignoreUpdates:y,invalid:p,readonly:h,reset:V,status:z,stopUpdatesWatch:_,submit:E,validate:O,wrappers:l,VvForm:R,VvFormField:c,VvFormFieldsGroup:a,VvFormTemplate:v,VvFormWrapper:i}}const T=Symbol("pluginInjectionKey");function je(t){let r={};return t.schema&&(r=k(t.schema,t)),{...r,install(s,{global:g=!1}={}){s.provide(T,t),g&&(s.config.globalProperties.$vvForm=t,r?.VvForm&&s.component("VvForm",r.VvForm),r?.VvFormWrapper&&s.component("VvFormWrapper",r.VvFormWrapper),r?.VvFormField&&s.component("VvFormField",r.VvFormField),r?.VvFormFieldsGroup&&s.component("VvFormFieldsGroup",r.VvFormFieldsGroup),r?.VvFormTemplate&&s.component("VvFormTemplate",r.VvFormTemplate))}}}const W=new Map;function Ve(t,r={}){if(r.scope&&W.has(r.scope))return W.get(r.scope);if(!e.getCurrentInstance()){const g=k(t,r);return r.scope&&W.set(r.scope,g),g}const s=k(t,{...e.inject(T,{}),...r});return r.scope&&W.set(r.scope,s),s}function we(t,r={}){return k(t,r)}S.FormFieldType=j,S.createForm=je,S.defaultObjectBySchema=x,S.formType=we,S.pluginInjectionKey=T,S.useForm=Ve,Object.defineProperty(S,Symbol.toStringTag,{value:"Module"})});
|
package/dist/types.d.ts
CHANGED
|
@@ -57,14 +57,14 @@ export type InjectedFormData<Schema extends FormSchema, Type> = {
|
|
|
57
57
|
};
|
|
58
58
|
export type InjectedFormWrapperData<Schema extends FormSchema> = {
|
|
59
59
|
name: Readonly<Ref<string>>;
|
|
60
|
-
errors: Ref<Map<string, InferFormattedError<Schema
|
|
60
|
+
errors: Ref<Map<string, InferFormattedError<Schema> | undefined>>;
|
|
61
61
|
invalid: Readonly<Ref<boolean>>;
|
|
62
62
|
readonly: Readonly<Ref<boolean>>;
|
|
63
63
|
fields: Ref<Map<string, string>>;
|
|
64
64
|
};
|
|
65
65
|
export type InjectedFormFieldData<Schema extends FormSchema> = {
|
|
66
66
|
name: Readonly<Ref<Path<InferSchema<Schema>>>>;
|
|
67
|
-
errors: Readonly<Ref<DeepReadonly<InferFormattedError<Schema
|
|
67
|
+
errors: Readonly<Ref<DeepReadonly<InferFormattedError<Schema> | undefined>>>;
|
|
68
68
|
};
|
|
69
69
|
export type InjectedFormFieldsGroupData<Schema extends FormSchema> = {
|
|
70
70
|
names: DeepReadonly<Ref<Path<InferSchema<Schema>>[]>>;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@volverjs/form-vue",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.1.
|
|
4
|
+
"version": "1.1.1-beta.1",
|
|
5
5
|
"description": "Vue 3 Forms with @volverjs/ui-vue",
|
|
6
6
|
"author": "8 Wave S.r.l.",
|
|
7
7
|
"license": "MIT",
|
|
@@ -52,7 +52,7 @@
|
|
|
52
52
|
"peerDependencies": {
|
|
53
53
|
"@volverjs/ui-vue": "^0.0.9",
|
|
54
54
|
"@vueuse/core": "^13.0.0",
|
|
55
|
-
"
|
|
55
|
+
"dot-prop": "^10.0.0",
|
|
56
56
|
"vue": "^3.5.0",
|
|
57
57
|
"zod": "^3.25.0 || ^4.0.0"
|
|
58
58
|
},
|
|
@@ -69,9 +69,9 @@
|
|
|
69
69
|
"@vue/test-utils": "^2.4.6",
|
|
70
70
|
"@vueuse/core": "^13.9.0",
|
|
71
71
|
"copy": "^0.3.2",
|
|
72
|
+
"dot-prop": "^10.0.0",
|
|
72
73
|
"eslint": "^9.35.0",
|
|
73
74
|
"happy-dom": "^18.0.1",
|
|
74
|
-
"ts-dot-prop": "^2.1.4",
|
|
75
75
|
"typescript": "^5.9.2",
|
|
76
76
|
"vite": "^7.1.5",
|
|
77
77
|
"vite-plugin-dts": "^4.5.4",
|
package/src/VvFormField.ts
CHANGED
|
@@ -9,7 +9,7 @@ import type {
|
|
|
9
9
|
InferSchema,
|
|
10
10
|
InferFormattedError,
|
|
11
11
|
} from './types'
|
|
12
|
-
import {
|
|
12
|
+
import { getProperty, setProperty } from 'dot-prop'
|
|
13
13
|
import {
|
|
14
14
|
computed,
|
|
15
15
|
defineAsyncComponent,
|
|
@@ -96,7 +96,7 @@ export function defineFormField<Schema extends FormSchema, Type = undefined>(for
|
|
|
96
96
|
slots: Object as SlotsType<{
|
|
97
97
|
[key: string]: any
|
|
98
98
|
default: {
|
|
99
|
-
errors: DeepReadonly<InferFormattedError<Schema
|
|
99
|
+
errors: DeepReadonly<InferFormattedError<Schema> | undefined>
|
|
100
100
|
formData?: undefined extends Type ? Partial<InferSchema<Schema>> : Type
|
|
101
101
|
formErrors?: DeepReadonly<InferFormattedError<Schema>>
|
|
102
102
|
invalid: boolean
|
|
@@ -127,7 +127,7 @@ export function defineFormField<Schema extends FormSchema, Type = undefined>(for
|
|
|
127
127
|
if (!injectedFormData?.formData) {
|
|
128
128
|
return
|
|
129
129
|
}
|
|
130
|
-
return
|
|
130
|
+
return getProperty(
|
|
131
131
|
new Object(injectedFormData.formData.value),
|
|
132
132
|
String(props.name),
|
|
133
133
|
)
|
|
@@ -136,7 +136,7 @@ export function defineFormField<Schema extends FormSchema, Type = undefined>(for
|
|
|
136
136
|
if (!injectedFormData?.formData) {
|
|
137
137
|
return
|
|
138
138
|
}
|
|
139
|
-
|
|
139
|
+
setProperty(
|
|
140
140
|
new Object(injectedFormData.formData.value),
|
|
141
141
|
String(props.name),
|
|
142
142
|
value,
|
|
@@ -165,7 +165,7 @@ export function defineFormField<Schema extends FormSchema, Type = undefined>(for
|
|
|
165
165
|
if (!injectedFormData?.errors.value) {
|
|
166
166
|
return undefined
|
|
167
167
|
}
|
|
168
|
-
return
|
|
168
|
+
return getProperty(injectedFormData.errors.value, String(props.name)) as InferFormattedError<Schema> | undefined
|
|
169
169
|
})
|
|
170
170
|
const invalidLabel = computed(() => {
|
|
171
171
|
return errors.value?._errors
|
|
@@ -278,7 +278,7 @@ export function defineFormField<Schema extends FormSchema, Type = undefined>(for
|
|
|
278
278
|
render() {
|
|
279
279
|
return (
|
|
280
280
|
slots.default?.({
|
|
281
|
-
errors: errors.value,
|
|
281
|
+
errors: readonly(errors).value,
|
|
282
282
|
formData: injectedFormData?.formData.value,
|
|
283
283
|
formErrors: injectedFormData?.errors.value,
|
|
284
284
|
invalid: isInvalid.value,
|
package/src/VvFormFieldsGroup.ts
CHANGED
|
@@ -8,7 +8,7 @@ import type {
|
|
|
8
8
|
InferSchema,
|
|
9
9
|
InferFormattedError,
|
|
10
10
|
} from './types'
|
|
11
|
-
import {
|
|
11
|
+
import { getProperty, setProperty } from 'dot-prop'
|
|
12
12
|
import {
|
|
13
13
|
computed,
|
|
14
14
|
defineComponent,
|
|
@@ -148,7 +148,7 @@ export function defineFormFieldsGroup<Schema extends FormSchema, Type = undefine
|
|
|
148
148
|
return {}
|
|
149
149
|
}
|
|
150
150
|
return namesKeys.value.reduce<Record<string, any>>((acc, nameKey) => {
|
|
151
|
-
acc[nameKey] =
|
|
151
|
+
acc[nameKey] = getProperty(
|
|
152
152
|
new Object(injectedFormData.formData.value),
|
|
153
153
|
namesMap.value[nameKey],
|
|
154
154
|
)
|
|
@@ -160,7 +160,7 @@ export function defineFormFieldsGroup<Schema extends FormSchema, Type = undefine
|
|
|
160
160
|
return
|
|
161
161
|
}
|
|
162
162
|
namesKeys.value.forEach((nameKey) => {
|
|
163
|
-
|
|
163
|
+
setProperty(
|
|
164
164
|
new Object(injectedFormData.formData.value),
|
|
165
165
|
namesMap.value[nameKey],
|
|
166
166
|
value?.[nameKey],
|
|
@@ -208,7 +208,7 @@ export function defineFormFieldsGroup<Schema extends FormSchema, Type = undefine
|
|
|
208
208
|
if (!injectedFormData.errors.value) {
|
|
209
209
|
return acc
|
|
210
210
|
}
|
|
211
|
-
const error =
|
|
211
|
+
const error = getProperty(injectedFormData.errors.value, String(name))
|
|
212
212
|
if (error === undefined) {
|
|
213
213
|
return acc
|
|
214
214
|
}
|
package/src/VvFormTemplate.ts
CHANGED
|
@@ -8,7 +8,7 @@ import type {
|
|
|
8
8
|
InferSchema,
|
|
9
9
|
} from './types'
|
|
10
10
|
import type { FormStatus } from './enums'
|
|
11
|
-
import {
|
|
11
|
+
import { getProperty } from 'dot-prop'
|
|
12
12
|
import {
|
|
13
13
|
defineComponent,
|
|
14
14
|
h,
|
|
@@ -77,7 +77,7 @@ export function defineFormTemplate<Schema extends FormSchema, Type = undefined>(
|
|
|
77
77
|
if (vvIf !== undefined) {
|
|
78
78
|
if (typeof vvIf === 'string') {
|
|
79
79
|
lastIf = Boolean(
|
|
80
|
-
|
|
80
|
+
getProperty(
|
|
81
81
|
new Object(injectedFormData.formData.value),
|
|
82
82
|
vvIf,
|
|
83
83
|
),
|
|
@@ -99,7 +99,7 @@ export function defineFormTemplate<Schema extends FormSchema, Type = undefined>(
|
|
|
99
99
|
}
|
|
100
100
|
if (typeof vvElseIf === 'string') {
|
|
101
101
|
lastIf = Boolean(
|
|
102
|
-
|
|
102
|
+
getProperty(
|
|
103
103
|
new Object(injectedFormData.formData.value),
|
|
104
104
|
vvElseIf,
|
|
105
105
|
),
|
package/src/types.ts
CHANGED
|
@@ -104,7 +104,7 @@ export type InjectedFormData<Schema extends FormSchema, Type> = {
|
|
|
104
104
|
|
|
105
105
|
export type InjectedFormWrapperData<Schema extends FormSchema> = {
|
|
106
106
|
name: Readonly<Ref<string>>
|
|
107
|
-
errors: Ref<Map<string, InferFormattedError<Schema
|
|
107
|
+
errors: Ref<Map<string, InferFormattedError<Schema> | undefined>>
|
|
108
108
|
invalid: Readonly<Ref<boolean>>
|
|
109
109
|
readonly: Readonly<Ref<boolean>>
|
|
110
110
|
fields: Ref<Map<string, string>>
|
|
@@ -112,7 +112,7 @@ export type InjectedFormWrapperData<Schema extends FormSchema> = {
|
|
|
112
112
|
|
|
113
113
|
export type InjectedFormFieldData<Schema extends FormSchema> = {
|
|
114
114
|
name: Readonly<Ref<Path<InferSchema<Schema>>>>
|
|
115
|
-
errors: Readonly<Ref<DeepReadonly<InferFormattedError<Schema
|
|
115
|
+
errors: Readonly<Ref<DeepReadonly<InferFormattedError<Schema> | undefined>>>
|
|
116
116
|
}
|
|
117
117
|
|
|
118
118
|
export type InjectedFormFieldsGroupData<Schema extends FormSchema> = {
|