@volverjs/form-vue 1.0.0-beta.13 → 1.0.0-beta.15
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/index.es.js +341 -329
- package/dist/index.umd.js +1 -1
- package/package.json +10 -10
- package/src/utils.ts +36 -6
package/dist/index.es.js
CHANGED
|
@@ -1,78 +1,78 @@
|
|
|
1
|
-
import { defineComponent as
|
|
2
|
-
import { watchIgnorable as
|
|
3
|
-
import { ZodObject as
|
|
4
|
-
function
|
|
1
|
+
import { defineComponent as z, inject as $, toRefs as P, computed as w, onMounted as Q, watch as S, onBeforeUnmount as re, unref as C, provide as M, readonly as E, resolveComponent as I, defineAsyncComponent as te, h as k, ref as _, toRaw as A, isProxy as ae, withModifiers as ne, getCurrentInstance as ue } from "vue";
|
|
2
|
+
import { watchIgnorable as le, throttleFilter as ie } from "@vueuse/core";
|
|
3
|
+
import { ZodObject as G, ZodDefault as se, ZodNullable as fe, ZodSchema as oe, ZodArray as de, ZodRecord as ve, ZodEffects as q, ZodOptional as T } from "zod";
|
|
4
|
+
function J(e) {
|
|
5
5
|
return Array.isArray(e);
|
|
6
6
|
}
|
|
7
|
-
function
|
|
7
|
+
function ce(e) {
|
|
8
8
|
return typeof e < "u";
|
|
9
9
|
}
|
|
10
|
-
function
|
|
10
|
+
function H(e) {
|
|
11
11
|
return e === null;
|
|
12
12
|
}
|
|
13
|
-
function
|
|
13
|
+
function X(e) {
|
|
14
14
|
return typeof e == "object";
|
|
15
15
|
}
|
|
16
|
-
function
|
|
16
|
+
function Y(e) {
|
|
17
17
|
return typeof e == "string";
|
|
18
18
|
}
|
|
19
|
-
function
|
|
19
|
+
function L(e) {
|
|
20
20
|
return typeof e > "u";
|
|
21
21
|
}
|
|
22
|
-
const
|
|
22
|
+
const me = /^[0-9]+$/, he = ["__proto__", "prototype", "constructor"];
|
|
23
23
|
function K(e, i, a) {
|
|
24
|
-
const f =
|
|
25
|
-
if (!
|
|
24
|
+
const f = ce(a) ? a : void 0;
|
|
25
|
+
if (!X(e) || !Y(i))
|
|
26
26
|
return f;
|
|
27
|
-
const u =
|
|
27
|
+
const u = j(i);
|
|
28
28
|
if (u.length !== 0) {
|
|
29
|
-
for (const
|
|
30
|
-
if (
|
|
29
|
+
for (const t of u) {
|
|
30
|
+
if (t === "*")
|
|
31
31
|
continue;
|
|
32
32
|
const l = function(n) {
|
|
33
|
-
return n.map((
|
|
33
|
+
return n.map((r) => L(r) || H(r) ? r : J(r) ? l(r) : r[t]);
|
|
34
34
|
};
|
|
35
|
-
if (
|
|
35
|
+
if (J(e) && !me.test(t) ? e = l(e) : e = e[t], L(e) || H(e))
|
|
36
36
|
break;
|
|
37
37
|
}
|
|
38
|
-
return
|
|
38
|
+
return L(e) ? f : e;
|
|
39
39
|
}
|
|
40
40
|
}
|
|
41
|
-
function
|
|
42
|
-
if (!
|
|
41
|
+
function D(e, i, a) {
|
|
42
|
+
if (!X(e) || !Y(i))
|
|
43
43
|
return;
|
|
44
|
-
const f =
|
|
44
|
+
const f = j(i);
|
|
45
45
|
if (f.length === 0)
|
|
46
46
|
return;
|
|
47
47
|
const u = f.length;
|
|
48
|
-
for (let
|
|
49
|
-
const l = f[
|
|
50
|
-
if (
|
|
48
|
+
for (let t = 0; t < u; t++) {
|
|
49
|
+
const l = f[t];
|
|
50
|
+
if (t === u - 1) {
|
|
51
51
|
e[l] = a;
|
|
52
52
|
return;
|
|
53
53
|
}
|
|
54
|
-
if (l === "*" &&
|
|
55
|
-
const n = f.slice(
|
|
56
|
-
for (const
|
|
57
|
-
|
|
54
|
+
if (l === "*" && J(e)) {
|
|
55
|
+
const n = f.slice(t + 1).join(".");
|
|
56
|
+
for (const r of e)
|
|
57
|
+
D(r, n, a);
|
|
58
58
|
return;
|
|
59
59
|
}
|
|
60
|
-
|
|
60
|
+
L(e[l]) && (e[l] = {}), e = e[l];
|
|
61
61
|
}
|
|
62
62
|
}
|
|
63
|
-
function
|
|
63
|
+
function j(e) {
|
|
64
64
|
const i = e.split(/[.]|(?:\[(\d|\*)\])/).filter((a) => !!a);
|
|
65
|
-
return i.some((a) =>
|
|
65
|
+
return i.some((a) => he.indexOf(a) !== -1) ? [] : i;
|
|
66
66
|
}
|
|
67
|
-
var
|
|
68
|
-
function
|
|
69
|
-
return
|
|
67
|
+
var d = /* @__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))(d || {}), x = /* @__PURE__ */ ((e) => (e.invalid = "invalid", e.valid = "valid", e.submitting = "submitting", e.updated = "updated", e.unknown = "unknown", e))(x || {});
|
|
68
|
+
function ye(e, i, a, f) {
|
|
69
|
+
return z({
|
|
70
70
|
name: "VvFormField",
|
|
71
71
|
props: {
|
|
72
72
|
type: {
|
|
73
73
|
type: String,
|
|
74
|
-
validator: (u) => Object.values(
|
|
75
|
-
default:
|
|
74
|
+
validator: (u) => Object.values(d).includes(u),
|
|
75
|
+
default: d.custom
|
|
76
76
|
},
|
|
77
77
|
is: {
|
|
78
78
|
type: [Object, String],
|
|
@@ -105,140 +105,140 @@ function he(e, i, a, f) {
|
|
|
105
105
|
},
|
|
106
106
|
emits: ["invalid", "valid", "update:formData", "update:modelValue"],
|
|
107
107
|
expose: ["invalid", "invalidLabel", "errors"],
|
|
108
|
-
setup(u, { slots:
|
|
109
|
-
const n =
|
|
108
|
+
setup(u, { slots: t, emit: l }) {
|
|
109
|
+
const n = $(i, void 0);
|
|
110
110
|
n && n.fields.value.add(u.name);
|
|
111
|
-
const
|
|
111
|
+
const r = $(e), { props: g, name: o } = P(u), c = w({
|
|
112
112
|
get() {
|
|
113
|
-
if (
|
|
113
|
+
if (r != null && r.formData)
|
|
114
114
|
return K(
|
|
115
|
-
Object(
|
|
115
|
+
Object(r.formData.value),
|
|
116
116
|
String(u.name)
|
|
117
117
|
);
|
|
118
118
|
},
|
|
119
119
|
set(s) {
|
|
120
|
-
|
|
121
|
-
Object(
|
|
120
|
+
r != null && r.formData && (D(
|
|
121
|
+
Object(r.formData.value),
|
|
122
122
|
String(u.name),
|
|
123
123
|
s
|
|
124
124
|
), l("update:modelValue", {
|
|
125
125
|
newValue: c.value,
|
|
126
|
-
formData:
|
|
126
|
+
formData: r == null ? void 0 : r.formData
|
|
127
127
|
}));
|
|
128
128
|
}
|
|
129
129
|
});
|
|
130
|
-
|
|
130
|
+
Q(() => {
|
|
131
131
|
c.value === void 0 && u.defaultValue !== void 0 && (c.value = u.defaultValue);
|
|
132
132
|
});
|
|
133
|
-
const
|
|
134
|
-
if (
|
|
135
|
-
return K(
|
|
136
|
-
}),
|
|
133
|
+
const m = w(() => {
|
|
134
|
+
if (r != null && r.errors.value)
|
|
135
|
+
return K(r.errors.value, String(u.name));
|
|
136
|
+
}), h = w(() => {
|
|
137
137
|
var s;
|
|
138
|
-
return (s =
|
|
139
|
-
}), v = w(() =>
|
|
140
|
-
v.value ? (l("invalid",
|
|
138
|
+
return (s = m.value) == null ? void 0 : s._errors;
|
|
139
|
+
}), v = w(() => m.value !== void 0), b = S(v, () => {
|
|
140
|
+
v.value ? (l("invalid", h.value), n && n.errors.value.set(
|
|
141
141
|
u.name,
|
|
142
142
|
{
|
|
143
|
-
_errors:
|
|
143
|
+
_errors: h.value
|
|
144
144
|
}
|
|
145
145
|
)) : (l("valid", c.value), n && n.errors.value.delete(
|
|
146
146
|
u.name
|
|
147
147
|
));
|
|
148
|
-
}),
|
|
149
|
-
() =>
|
|
148
|
+
}), y = S(
|
|
149
|
+
() => r == null ? void 0 : r.formData,
|
|
150
150
|
() => {
|
|
151
|
-
l("update:formData",
|
|
151
|
+
l("update:formData", r == null ? void 0 : r.formData);
|
|
152
152
|
},
|
|
153
153
|
{ deep: !0 }
|
|
154
154
|
);
|
|
155
|
-
|
|
156
|
-
|
|
155
|
+
re(() => {
|
|
156
|
+
b(), y();
|
|
157
157
|
});
|
|
158
|
-
const
|
|
158
|
+
const V = (s) => {
|
|
159
159
|
c.value = s;
|
|
160
|
-
},
|
|
161
|
-
let s =
|
|
162
|
-
return typeof s == "function" && (s = s(
|
|
163
|
-
(
|
|
160
|
+
}, p = w(() => {
|
|
161
|
+
let s = g.value;
|
|
162
|
+
return typeof s == "function" && (s = s(r == null ? void 0 : r.formData)), Object.keys(s).reduce(
|
|
163
|
+
(N, O) => (N[O] = C(s[O]), N),
|
|
164
164
|
{}
|
|
165
165
|
);
|
|
166
|
-
}), W = w(() =>
|
|
167
|
-
...
|
|
168
|
-
name:
|
|
166
|
+
}), W = w(() => r != null && r.readonly.value ? !0 : p.value.readonly ?? u.readonly), U = w(() => ({
|
|
167
|
+
...p.value,
|
|
168
|
+
name: p.value.name ?? u.name,
|
|
169
169
|
invalid: v.value,
|
|
170
170
|
valid: u.showValid ? !!(!v.value && c.value) : void 0,
|
|
171
171
|
type: ((s) => {
|
|
172
172
|
if ([
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
173
|
+
d.text,
|
|
174
|
+
d.number,
|
|
175
|
+
d.email,
|
|
176
|
+
d.password,
|
|
177
|
+
d.tel,
|
|
178
|
+
d.url,
|
|
179
|
+
d.search,
|
|
180
|
+
d.date,
|
|
181
|
+
d.time,
|
|
182
|
+
d.datetimeLocal,
|
|
183
|
+
d.month,
|
|
184
|
+
d.week,
|
|
185
|
+
d.color
|
|
186
186
|
].includes(s))
|
|
187
187
|
return s;
|
|
188
188
|
})(u.type),
|
|
189
|
-
invalidLabel:
|
|
189
|
+
invalidLabel: h.value,
|
|
190
190
|
modelValue: c.value,
|
|
191
191
|
readonly: W.value,
|
|
192
|
-
"onUpdate:modelValue":
|
|
192
|
+
"onUpdate:modelValue": V
|
|
193
193
|
}));
|
|
194
194
|
return M(a, {
|
|
195
|
-
name: E(
|
|
196
|
-
errors: E(
|
|
195
|
+
name: E(o),
|
|
196
|
+
errors: E(m)
|
|
197
197
|
}), { component: w(() => {
|
|
198
|
-
if (u.type ===
|
|
198
|
+
if (u.type === d.custom)
|
|
199
199
|
return {
|
|
200
200
|
render() {
|
|
201
201
|
var s;
|
|
202
|
-
return ((s =
|
|
202
|
+
return ((s = t.default) == null ? void 0 : s.call(t, {
|
|
203
203
|
modelValue: c.value,
|
|
204
|
-
onUpdate:
|
|
205
|
-
submit:
|
|
206
|
-
validate:
|
|
204
|
+
onUpdate: V,
|
|
205
|
+
submit: r == null ? void 0 : r.submit,
|
|
206
|
+
validate: r == null ? void 0 : r.validate,
|
|
207
207
|
invalid: v.value,
|
|
208
|
-
invalidLabel:
|
|
209
|
-
formData:
|
|
210
|
-
formErrors:
|
|
211
|
-
errors:
|
|
208
|
+
invalidLabel: h.value,
|
|
209
|
+
formData: r == null ? void 0 : r.formData.value,
|
|
210
|
+
formErrors: r == null ? void 0 : r.errors.value,
|
|
211
|
+
errors: m.value,
|
|
212
212
|
readonly: W.value
|
|
213
|
-
})) ??
|
|
213
|
+
})) ?? t.defalut;
|
|
214
214
|
}
|
|
215
215
|
};
|
|
216
216
|
if (!((f == null ? void 0 : f.lazyLoad) ?? u.lazyLoad)) {
|
|
217
217
|
let s;
|
|
218
218
|
switch (u.type) {
|
|
219
|
-
case
|
|
220
|
-
s =
|
|
219
|
+
case d.select:
|
|
220
|
+
s = I("VvSelect");
|
|
221
221
|
break;
|
|
222
|
-
case
|
|
223
|
-
s =
|
|
222
|
+
case d.checkbox:
|
|
223
|
+
s = I("VvCheckbox");
|
|
224
224
|
break;
|
|
225
|
-
case
|
|
226
|
-
s =
|
|
225
|
+
case d.radio:
|
|
226
|
+
s = I("VvRadio");
|
|
227
227
|
break;
|
|
228
|
-
case
|
|
229
|
-
s =
|
|
228
|
+
case d.textarea:
|
|
229
|
+
s = I("VvTextarea");
|
|
230
230
|
break;
|
|
231
|
-
case
|
|
232
|
-
s =
|
|
231
|
+
case d.radioGroup:
|
|
232
|
+
s = I("VvRadioGroup");
|
|
233
233
|
break;
|
|
234
|
-
case
|
|
235
|
-
s =
|
|
234
|
+
case d.checkboxGroup:
|
|
235
|
+
s = I("VvCheckboxGroup");
|
|
236
236
|
break;
|
|
237
|
-
case
|
|
238
|
-
s =
|
|
237
|
+
case d.combobox:
|
|
238
|
+
s = I("VvCombobox");
|
|
239
239
|
break;
|
|
240
240
|
default:
|
|
241
|
-
s =
|
|
241
|
+
s = I("VvInputText");
|
|
242
242
|
}
|
|
243
243
|
if (typeof s != "string")
|
|
244
244
|
return s;
|
|
@@ -246,21 +246,21 @@ function he(e, i, a, f) {
|
|
|
246
246
|
`[form-vue warn]: ${s} not found, the component will be loaded asynchronously. To avoid this warning, please set "lazyLoad" option.`
|
|
247
247
|
);
|
|
248
248
|
}
|
|
249
|
-
return
|
|
249
|
+
return te(async () => {
|
|
250
250
|
switch (f != null && f.sideEffects && await Promise.resolve(f.sideEffects(u.type)), u.type) {
|
|
251
|
-
case
|
|
251
|
+
case d.textarea:
|
|
252
252
|
return import("@volverjs/ui-vue/vv-textarea");
|
|
253
|
-
case
|
|
253
|
+
case d.radio:
|
|
254
254
|
return import("@volverjs/ui-vue/vv-radio");
|
|
255
|
-
case
|
|
255
|
+
case d.radioGroup:
|
|
256
256
|
return import("@volverjs/ui-vue/vv-radio-group");
|
|
257
|
-
case
|
|
257
|
+
case d.checkbox:
|
|
258
258
|
return import("@volverjs/ui-vue/vv-checkbox");
|
|
259
|
-
case
|
|
259
|
+
case d.checkboxGroup:
|
|
260
260
|
return import("@volverjs/ui-vue/vv-checkbox-group");
|
|
261
|
-
case
|
|
261
|
+
case d.select:
|
|
262
262
|
return import("@volverjs/ui-vue/vv-select");
|
|
263
|
-
case
|
|
263
|
+
case d.combobox:
|
|
264
264
|
return import("@volverjs/ui-vue/vv-combobox");
|
|
265
265
|
}
|
|
266
266
|
return import("@volverjs/ui-vue/vv-input-text");
|
|
@@ -268,72 +268,84 @@ function he(e, i, a, f) {
|
|
|
268
268
|
}), hasProps: U, invalid: v };
|
|
269
269
|
},
|
|
270
270
|
render() {
|
|
271
|
-
return this.is ?
|
|
271
|
+
return this.is ? k(this.is, this.hasProps, this.$slots) : this.type === d.custom ? k(this.component, null, this.$slots) : k(this.component, this.hasProps, this.$slots);
|
|
272
272
|
}
|
|
273
273
|
});
|
|
274
274
|
}
|
|
275
|
-
function
|
|
276
|
-
const a = (
|
|
277
|
-
let
|
|
278
|
-
for (;
|
|
279
|
-
|
|
280
|
-
return
|
|
281
|
-
}, f =
|
|
275
|
+
function R(e, i = {}) {
|
|
276
|
+
const a = (l) => {
|
|
277
|
+
let n = l;
|
|
278
|
+
for (; n instanceof q; )
|
|
279
|
+
n = n.innerType();
|
|
280
|
+
return n instanceof T && (n = n._def.innerType), n;
|
|
281
|
+
}, f = (l) => {
|
|
282
|
+
let n = l;
|
|
283
|
+
for (; n instanceof q; )
|
|
284
|
+
n = n.innerType();
|
|
285
|
+
return n instanceof T;
|
|
286
|
+
}, u = a(e);
|
|
282
287
|
return {
|
|
283
|
-
...(
|
|
288
|
+
...(u instanceof G ? u._def.unknownKeys === "passthrough" : !1) ? i : {},
|
|
284
289
|
...Object.fromEntries(
|
|
285
|
-
Object.entries(
|
|
286
|
-
([
|
|
287
|
-
const
|
|
288
|
-
let
|
|
289
|
-
if (
|
|
290
|
-
return [
|
|
291
|
-
if (
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
290
|
+
Object.entries(u.shape).map(
|
|
291
|
+
([l, n]) => {
|
|
292
|
+
const r = i[l], g = f(n);
|
|
293
|
+
let o = a(n), c;
|
|
294
|
+
if (o instanceof se && (c = o._def.defaultValue(), o = o._def.innerType), r === null && o instanceof fe)
|
|
295
|
+
return [l, r];
|
|
296
|
+
if (r == null && g)
|
|
297
|
+
return [l, c];
|
|
298
|
+
if (o instanceof oe) {
|
|
299
|
+
const m = n.safeParse(r);
|
|
300
|
+
if (m.success)
|
|
301
|
+
return [l, m.data ?? c];
|
|
295
302
|
}
|
|
296
|
-
if (
|
|
297
|
-
const
|
|
298
|
-
if (
|
|
303
|
+
if (o instanceof de && Array.isArray(r) && r.length) {
|
|
304
|
+
const m = a(o._def.type);
|
|
305
|
+
if (m instanceof G)
|
|
299
306
|
return [
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
(
|
|
303
|
-
|
|
304
|
-
|
|
307
|
+
l,
|
|
308
|
+
r.map(
|
|
309
|
+
(h) => R(
|
|
310
|
+
m,
|
|
311
|
+
h && typeof h == "object" ? h : void 0
|
|
305
312
|
)
|
|
306
|
-
)
|
|
313
|
+
)
|
|
307
314
|
];
|
|
308
315
|
}
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
316
|
+
if (o instanceof ve && r) {
|
|
317
|
+
const m = a(o._def.valueType);
|
|
318
|
+
if (m instanceof G)
|
|
319
|
+
return [l, Object.keys(r).reduce((h, v) => (h[v] = R(m, r[v]), h), {})];
|
|
320
|
+
}
|
|
321
|
+
return o instanceof G ? [
|
|
322
|
+
l,
|
|
323
|
+
R(
|
|
324
|
+
o,
|
|
325
|
+
r && typeof r == "object" ? r : c
|
|
314
326
|
)
|
|
315
|
-
] : [
|
|
327
|
+
] : [l, c];
|
|
316
328
|
}
|
|
317
329
|
)
|
|
318
330
|
)
|
|
319
331
|
};
|
|
320
332
|
}
|
|
321
|
-
function
|
|
322
|
-
const u =
|
|
323
|
-
if (
|
|
333
|
+
function be(e, i, a, f) {
|
|
334
|
+
const u = _(), t = _(), l = w(() => t.value === x.invalid), n = _(), r = _(!1), g = async (v = n.value) => {
|
|
335
|
+
if (r.value)
|
|
324
336
|
return !0;
|
|
325
|
-
const
|
|
326
|
-
return
|
|
327
|
-
},
|
|
337
|
+
const b = await e.safeParseAsync(v);
|
|
338
|
+
return b.success ? (u.value = void 0, t.value = x.valid, n.value = b.data, !0) : (u.value = b.error.format(), t.value = x.invalid, !1);
|
|
339
|
+
}, o = async () => r.value || !await g() ? !1 : (t.value = x.submitting, !0), { ignoreUpdates: c, stop: m } = le(
|
|
328
340
|
n,
|
|
329
341
|
() => {
|
|
330
|
-
|
|
342
|
+
t.value = x.updated;
|
|
331
343
|
},
|
|
332
344
|
{
|
|
333
345
|
deep: !0,
|
|
334
|
-
eventFilter:
|
|
346
|
+
eventFilter: ie((a == null ? void 0 : a.updateThrottle) ?? 500)
|
|
335
347
|
}
|
|
336
|
-
),
|
|
348
|
+
), h = z({
|
|
337
349
|
name: "VvForm",
|
|
338
350
|
props: {
|
|
339
351
|
continuousValidation: {
|
|
@@ -373,82 +385,82 @@ function ye(e, i, a, f) {
|
|
|
373
385
|
"invalid",
|
|
374
386
|
"readonly"
|
|
375
387
|
],
|
|
376
|
-
setup(v, { emit:
|
|
377
|
-
return n.value =
|
|
388
|
+
setup(v, { emit: b }) {
|
|
389
|
+
return n.value = R(
|
|
378
390
|
e,
|
|
379
391
|
A(v.modelValue)
|
|
380
|
-
),
|
|
392
|
+
), S(
|
|
381
393
|
() => v.modelValue,
|
|
382
|
-
(
|
|
383
|
-
if (
|
|
384
|
-
const
|
|
385
|
-
if (JSON.stringify(
|
|
394
|
+
(y) => {
|
|
395
|
+
if (y) {
|
|
396
|
+
const V = ae(y) ? A(y) : y;
|
|
397
|
+
if (JSON.stringify(V) === JSON.stringify(A(n.value)))
|
|
386
398
|
return;
|
|
387
|
-
n.value = typeof (
|
|
399
|
+
n.value = typeof (V == null ? void 0 : V.clone) == "function" ? V.clone() : JSON.parse(JSON.stringify(V));
|
|
388
400
|
}
|
|
389
401
|
},
|
|
390
402
|
{ deep: !0 }
|
|
391
|
-
),
|
|
392
|
-
var
|
|
393
|
-
if (
|
|
403
|
+
), S(t, async (y) => {
|
|
404
|
+
var V, p, W, U, B;
|
|
405
|
+
if (y === x.invalid) {
|
|
394
406
|
const s = A(u.value);
|
|
395
|
-
|
|
407
|
+
b("invalid", s), (V = a == null ? void 0 : a.onInvalid) == null || V.call(
|
|
396
408
|
a,
|
|
397
409
|
s
|
|
398
410
|
);
|
|
399
411
|
return;
|
|
400
412
|
}
|
|
401
|
-
if (
|
|
413
|
+
if (y === x.valid) {
|
|
402
414
|
const s = A(n.value);
|
|
403
|
-
|
|
415
|
+
b("valid", s), (p = a == null ? void 0 : a.onValid) == null || p.call(a, s), b("update:modelValue", s), (W = a == null ? void 0 : a.onUpdate) == null || W.call(a, s);
|
|
404
416
|
return;
|
|
405
417
|
}
|
|
406
|
-
if (
|
|
418
|
+
if (y === x.submitting) {
|
|
407
419
|
const s = A(n.value);
|
|
408
|
-
|
|
420
|
+
b("submit", s), (U = a == null ? void 0 : a.onSubmit) == null || U.call(a, s);
|
|
409
421
|
}
|
|
410
|
-
if (
|
|
411
|
-
if ((u.value || a != null && a.continuousValidation || v.continuousValidation) && await
|
|
422
|
+
if (y === x.updated) {
|
|
423
|
+
if ((u.value || a != null && a.continuousValidation || v.continuousValidation) && await g(), !n.value || !v.modelValue || JSON.stringify(n.value) !== JSON.stringify(v.modelValue)) {
|
|
412
424
|
const s = A(n.value);
|
|
413
|
-
|
|
425
|
+
b("update:modelValue", s), (B = a == null ? void 0 : a.onUpdate) == null || B.call(a, s);
|
|
414
426
|
}
|
|
415
|
-
|
|
427
|
+
t.value === x.updated && (t.value = x.unknown);
|
|
416
428
|
}
|
|
417
|
-
}),
|
|
418
|
-
|
|
419
|
-
}),
|
|
429
|
+
}), Q(() => {
|
|
430
|
+
r.value = v.readonly;
|
|
431
|
+
}), S(
|
|
420
432
|
() => v.readonly,
|
|
421
|
-
(
|
|
422
|
-
|
|
433
|
+
(y) => {
|
|
434
|
+
r.value = y;
|
|
423
435
|
}
|
|
424
|
-
),
|
|
425
|
-
|
|
436
|
+
), S(r, (y) => {
|
|
437
|
+
y !== v.readonly && b("update:readonly", r.value);
|
|
426
438
|
}), M(i, {
|
|
427
439
|
formData: n,
|
|
428
|
-
submit:
|
|
429
|
-
validate:
|
|
440
|
+
submit: o,
|
|
441
|
+
validate: g,
|
|
430
442
|
ignoreUpdates: c,
|
|
431
|
-
stopUpdatesWatch:
|
|
443
|
+
stopUpdatesWatch: m,
|
|
432
444
|
errors: E(u),
|
|
433
|
-
status: E(
|
|
445
|
+
status: E(t),
|
|
434
446
|
invalid: l,
|
|
435
|
-
readonly:
|
|
447
|
+
readonly: r
|
|
436
448
|
}), {
|
|
437
449
|
formData: n,
|
|
438
|
-
submit:
|
|
439
|
-
validate:
|
|
450
|
+
submit: o,
|
|
451
|
+
validate: g,
|
|
440
452
|
ignoreUpdates: c,
|
|
441
|
-
stopUpdatesWatch:
|
|
453
|
+
stopUpdatesWatch: m,
|
|
442
454
|
errors: E(u),
|
|
443
|
-
status: E(
|
|
455
|
+
status: E(t),
|
|
444
456
|
invalid: l,
|
|
445
|
-
isReadonly:
|
|
457
|
+
isReadonly: r
|
|
446
458
|
};
|
|
447
459
|
},
|
|
448
460
|
render() {
|
|
449
461
|
const v = () => {
|
|
450
|
-
var
|
|
451
|
-
return ((
|
|
462
|
+
var b, y;
|
|
463
|
+
return ((y = (b = this.$slots) == null ? void 0 : b.default) == null ? void 0 : y.call(b, {
|
|
452
464
|
formData: this.formData,
|
|
453
465
|
submit: this.submit,
|
|
454
466
|
validate: this.validate,
|
|
@@ -460,13 +472,13 @@ function ye(e, i, a, f) {
|
|
|
460
472
|
readonly: this.isReadonly
|
|
461
473
|
})) ?? this.$slots.default;
|
|
462
474
|
};
|
|
463
|
-
return
|
|
475
|
+
return k(
|
|
464
476
|
this.tag,
|
|
465
477
|
{
|
|
466
|
-
onSubmit:
|
|
478
|
+
onSubmit: ne(this.submit, ["prevent"])
|
|
467
479
|
},
|
|
468
480
|
(this.template ?? (a == null ? void 0 : a.template)) && f ? [
|
|
469
|
-
|
|
481
|
+
k(
|
|
470
482
|
f,
|
|
471
483
|
{
|
|
472
484
|
schema: this.template ?? (a == null ? void 0 : a.template)
|
|
@@ -483,22 +495,22 @@ function ye(e, i, a, f) {
|
|
|
483
495
|
});
|
|
484
496
|
return {
|
|
485
497
|
errors: u,
|
|
486
|
-
status:
|
|
498
|
+
status: t,
|
|
487
499
|
invalid: l,
|
|
488
|
-
readonly:
|
|
500
|
+
readonly: r,
|
|
489
501
|
formData: n,
|
|
490
|
-
validate:
|
|
491
|
-
submit:
|
|
502
|
+
validate: g,
|
|
503
|
+
submit: o,
|
|
492
504
|
ignoreUpdates: c,
|
|
493
|
-
stopUpdatesWatch:
|
|
505
|
+
stopUpdatesWatch: m,
|
|
494
506
|
/**
|
|
495
507
|
* An hack to add types to the default slot
|
|
496
508
|
*/
|
|
497
|
-
VvForm:
|
|
509
|
+
VvForm: h
|
|
498
510
|
};
|
|
499
511
|
}
|
|
500
|
-
function
|
|
501
|
-
return
|
|
512
|
+
function Ve(e, i) {
|
|
513
|
+
return z({
|
|
502
514
|
name: "VvFormWrapper",
|
|
503
515
|
props: {
|
|
504
516
|
name: {
|
|
@@ -513,50 +525,50 @@ function be(e, i) {
|
|
|
513
525
|
emits: ["invalid", "valid"],
|
|
514
526
|
expose: ["fields", "invalid"],
|
|
515
527
|
setup(f, { emit: u }) {
|
|
516
|
-
const
|
|
528
|
+
const t = $(e), l = $(i, void 0), n = _(/* @__PURE__ */ new Set()), r = _(/* @__PURE__ */ new Map()), { name: g } = P(f);
|
|
517
529
|
M(i, {
|
|
518
|
-
name: E(
|
|
519
|
-
errors:
|
|
530
|
+
name: E(g),
|
|
531
|
+
errors: r,
|
|
520
532
|
fields: n
|
|
521
|
-
}),
|
|
533
|
+
}), S(
|
|
522
534
|
n,
|
|
523
535
|
(c) => {
|
|
524
|
-
l != null && l.fields && c.forEach((
|
|
525
|
-
l == null || l.fields.value.add(
|
|
536
|
+
l != null && l.fields && c.forEach((m) => {
|
|
537
|
+
l == null || l.fields.value.add(m);
|
|
526
538
|
});
|
|
527
539
|
},
|
|
528
540
|
{ deep: !0 }
|
|
529
|
-
),
|
|
530
|
-
() => new Map(
|
|
531
|
-
(c,
|
|
532
|
-
l != null && l.errors && (Array.from(
|
|
533
|
-
l.errors.value.delete(
|
|
534
|
-
}), Array.from(c.keys()).forEach((
|
|
535
|
-
const v = c.get(
|
|
536
|
-
v && l.errors.value.set(
|
|
541
|
+
), S(
|
|
542
|
+
() => new Map(r.value),
|
|
543
|
+
(c, m) => {
|
|
544
|
+
l != null && l.errors && (Array.from(m.keys()).forEach((h) => {
|
|
545
|
+
l.errors.value.delete(h);
|
|
546
|
+
}), Array.from(c.keys()).forEach((h) => {
|
|
547
|
+
const v = c.get(h);
|
|
548
|
+
v && l.errors.value.set(h, v);
|
|
537
549
|
}));
|
|
538
550
|
},
|
|
539
551
|
{ deep: !0 }
|
|
540
552
|
);
|
|
541
|
-
const
|
|
542
|
-
return
|
|
543
|
-
|
|
553
|
+
const o = w(() => t != null && t.invalid.value ? r.value.size > 0 : !1);
|
|
554
|
+
return S(o, () => {
|
|
555
|
+
o.value ? u("invalid") : u("valid");
|
|
544
556
|
}), {
|
|
545
|
-
formData:
|
|
546
|
-
errors:
|
|
547
|
-
submit:
|
|
548
|
-
validate:
|
|
549
|
-
invalid:
|
|
557
|
+
formData: t == null ? void 0 : t.formData,
|
|
558
|
+
errors: t == null ? void 0 : t.errors,
|
|
559
|
+
submit: t == null ? void 0 : t.submit,
|
|
560
|
+
validate: t == null ? void 0 : t.validate,
|
|
561
|
+
invalid: o,
|
|
550
562
|
fields: n,
|
|
551
|
-
fieldsErrors:
|
|
563
|
+
fieldsErrors: r
|
|
552
564
|
};
|
|
553
565
|
},
|
|
554
566
|
render() {
|
|
555
567
|
var f, u;
|
|
556
|
-
return this.tag ?
|
|
568
|
+
return this.tag ? k(this.tag, null, {
|
|
557
569
|
default: () => {
|
|
558
|
-
var
|
|
559
|
-
return ((l = (
|
|
570
|
+
var t, l;
|
|
571
|
+
return ((l = (t = this.$slots).default) == null ? void 0 : l.call(t, {
|
|
560
572
|
invalid: this.invalid,
|
|
561
573
|
formData: this.formData,
|
|
562
574
|
submit: this.submit,
|
|
@@ -576,8 +588,8 @@ function be(e, i) {
|
|
|
576
588
|
}
|
|
577
589
|
});
|
|
578
590
|
}
|
|
579
|
-
function
|
|
580
|
-
const a =
|
|
591
|
+
function ge(e, i) {
|
|
592
|
+
const a = z({
|
|
581
593
|
name: "VvFormTemplate",
|
|
582
594
|
props: {
|
|
583
595
|
schema: {
|
|
@@ -590,154 +602,154 @@ function Ve(e, i) {
|
|
|
590
602
|
}
|
|
591
603
|
},
|
|
592
604
|
setup(f, { slots: u }) {
|
|
593
|
-
const
|
|
594
|
-
if (
|
|
605
|
+
const t = $(e);
|
|
606
|
+
if (t != null && t.formData)
|
|
595
607
|
return () => {
|
|
596
|
-
var
|
|
608
|
+
var g;
|
|
597
609
|
const l = typeof f.schema == "function" ? f.schema(
|
|
598
|
-
|
|
610
|
+
t,
|
|
599
611
|
f.scope
|
|
600
612
|
) : f.schema;
|
|
601
613
|
let n;
|
|
602
|
-
const
|
|
603
|
-
const
|
|
604
|
-
vvIs:
|
|
614
|
+
const r = l.reduce((o, c) => {
|
|
615
|
+
const m = typeof c == "function" ? c(t, f.scope) : c, {
|
|
616
|
+
vvIs: h,
|
|
605
617
|
vvName: v,
|
|
606
|
-
vvSlots:
|
|
607
|
-
vvChildren:
|
|
608
|
-
vvIf:
|
|
609
|
-
vvElseIf:
|
|
618
|
+
vvSlots: b,
|
|
619
|
+
vvChildren: y,
|
|
620
|
+
vvIf: V,
|
|
621
|
+
vvElseIf: p,
|
|
610
622
|
vvType: W,
|
|
611
623
|
vvDefaultValue: U,
|
|
612
|
-
vvShowValid:
|
|
624
|
+
vvShowValid: B,
|
|
613
625
|
vvContent: s,
|
|
614
|
-
...
|
|
615
|
-
} =
|
|
616
|
-
if (
|
|
617
|
-
if (typeof
|
|
618
|
-
Object(
|
|
619
|
-
|
|
620
|
-
) : typeof
|
|
621
|
-
return
|
|
622
|
-
} else if (
|
|
623
|
-
if (n || (typeof
|
|
624
|
-
Object(
|
|
625
|
-
|
|
626
|
-
) : typeof
|
|
627
|
-
return
|
|
626
|
+
...N
|
|
627
|
+
} = m;
|
|
628
|
+
if (V !== void 0) {
|
|
629
|
+
if (typeof V == "string" ? n = !!K(
|
|
630
|
+
Object(t.formData.value),
|
|
631
|
+
V
|
|
632
|
+
) : typeof V == "function" ? n = C(V(t)) : n = C(V), !n)
|
|
633
|
+
return o;
|
|
634
|
+
} else if (p !== void 0 && n !== void 0) {
|
|
635
|
+
if (n || (typeof p == "string" ? n = !!K(
|
|
636
|
+
Object(t.formData.value),
|
|
637
|
+
p
|
|
638
|
+
) : typeof p == "function" ? n = C(p(t)) : n = C(p), !n))
|
|
639
|
+
return o;
|
|
628
640
|
} else
|
|
629
641
|
n = void 0;
|
|
630
|
-
let
|
|
631
|
-
return
|
|
632
|
-
schema:
|
|
633
|
-
}) :
|
|
634
|
-
default: (
|
|
635
|
-
schema:
|
|
636
|
-
scope:
|
|
642
|
+
let O;
|
|
643
|
+
return y && (typeof h == "string" ? O = k(a, {
|
|
644
|
+
schema: y
|
|
645
|
+
}) : O = {
|
|
646
|
+
default: (ee) => k(a, {
|
|
647
|
+
schema: y,
|
|
648
|
+
scope: ee
|
|
637
649
|
})
|
|
638
|
-
}), v ? (
|
|
639
|
-
|
|
650
|
+
}), v ? (o.push(
|
|
651
|
+
k(
|
|
640
652
|
i,
|
|
641
653
|
{
|
|
642
654
|
name: v,
|
|
643
|
-
is:
|
|
655
|
+
is: h,
|
|
644
656
|
type: W,
|
|
645
657
|
defaultValue: U,
|
|
646
|
-
showValid:
|
|
647
|
-
props:
|
|
658
|
+
showValid: B,
|
|
659
|
+
props: N
|
|
648
660
|
},
|
|
649
|
-
|
|
661
|
+
b ?? O ?? s
|
|
650
662
|
)
|
|
651
|
-
),
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
663
|
+
), o) : h ? (o.push(
|
|
664
|
+
k(
|
|
665
|
+
h,
|
|
666
|
+
N,
|
|
667
|
+
b ?? O ?? s
|
|
656
668
|
)
|
|
657
|
-
),
|
|
669
|
+
), o) : (O && ("default" in O ? o.push(O.default(f.scope)) : o.push(O)), o);
|
|
658
670
|
}, []);
|
|
659
|
-
return
|
|
660
|
-
(
|
|
661
|
-
formData:
|
|
662
|
-
submit:
|
|
663
|
-
validate:
|
|
664
|
-
errors:
|
|
665
|
-
status:
|
|
666
|
-
invalid:
|
|
671
|
+
return r.push(
|
|
672
|
+
(g = u == null ? void 0 : u.default) == null ? void 0 : g.call(u, {
|
|
673
|
+
formData: t == null ? void 0 : t.formData.value,
|
|
674
|
+
submit: t == null ? void 0 : t.submit,
|
|
675
|
+
validate: t == null ? void 0 : t.validate,
|
|
676
|
+
errors: t == null ? void 0 : t.errors.value,
|
|
677
|
+
status: t == null ? void 0 : t.status.value,
|
|
678
|
+
invalid: t == null ? void 0 : t.invalid.value
|
|
667
679
|
})
|
|
668
|
-
),
|
|
680
|
+
), r;
|
|
669
681
|
};
|
|
670
682
|
}
|
|
671
683
|
});
|
|
672
684
|
return a;
|
|
673
685
|
}
|
|
674
|
-
function
|
|
675
|
-
const a = Symbol("formInjectionKey"), f = Symbol("formWrapperInjectionKey"), u = Symbol("formFieldInjectionKey"),
|
|
686
|
+
function Z(e, i = {}) {
|
|
687
|
+
const a = Symbol("formInjectionKey"), f = Symbol("formWrapperInjectionKey"), u = Symbol("formFieldInjectionKey"), t = Ve(
|
|
676
688
|
a,
|
|
677
689
|
f
|
|
678
|
-
), l =
|
|
690
|
+
), l = ye(
|
|
679
691
|
a,
|
|
680
692
|
f,
|
|
681
693
|
u,
|
|
682
694
|
i
|
|
683
|
-
), n =
|
|
684
|
-
VvForm:
|
|
685
|
-
errors:
|
|
686
|
-
status:
|
|
695
|
+
), n = ge(a, l), {
|
|
696
|
+
VvForm: r,
|
|
697
|
+
errors: g,
|
|
698
|
+
status: o,
|
|
687
699
|
invalid: c,
|
|
688
|
-
readonly:
|
|
689
|
-
formData:
|
|
700
|
+
readonly: m,
|
|
701
|
+
formData: h,
|
|
690
702
|
validate: v,
|
|
691
|
-
submit:
|
|
692
|
-
ignoreUpdates:
|
|
693
|
-
stopUpdatesWatch:
|
|
694
|
-
} =
|
|
703
|
+
submit: b,
|
|
704
|
+
ignoreUpdates: y,
|
|
705
|
+
stopUpdatesWatch: V
|
|
706
|
+
} = be(e, a, i, n);
|
|
695
707
|
return {
|
|
696
|
-
VvForm:
|
|
697
|
-
VvFormWrapper:
|
|
708
|
+
VvForm: r,
|
|
709
|
+
VvFormWrapper: t,
|
|
698
710
|
VvFormField: l,
|
|
699
711
|
VvFormTemplate: n,
|
|
700
712
|
formInjectionKey: a,
|
|
701
713
|
formWrapperInjectionKey: f,
|
|
702
714
|
formFieldInjectionKey: u,
|
|
703
|
-
errors:
|
|
704
|
-
status:
|
|
715
|
+
errors: g,
|
|
716
|
+
status: o,
|
|
705
717
|
invalid: c,
|
|
706
|
-
readonly:
|
|
707
|
-
formData:
|
|
718
|
+
readonly: m,
|
|
719
|
+
formData: h,
|
|
708
720
|
validate: v,
|
|
709
|
-
submit:
|
|
710
|
-
ignoreUpdates:
|
|
711
|
-
stopUpdatesWatch:
|
|
721
|
+
submit: b,
|
|
722
|
+
ignoreUpdates: y,
|
|
723
|
+
stopUpdatesWatch: V
|
|
712
724
|
};
|
|
713
725
|
}
|
|
714
|
-
const
|
|
715
|
-
function
|
|
726
|
+
const F = Symbol("pluginInjectionKey");
|
|
727
|
+
function we(e) {
|
|
716
728
|
let i = {};
|
|
717
|
-
return e.schema && (i =
|
|
729
|
+
return e.schema && (i = Z(e.schema, e)), {
|
|
718
730
|
...i,
|
|
719
731
|
install(a, { global: f = !1 } = {}) {
|
|
720
|
-
a.provide(
|
|
732
|
+
a.provide(F, e), f && (a.config.globalProperties.$vvForm = e, i != null && i.VvForm && a.component("VvForm", i.VvForm), i != null && i.VvFormWrapper && a.component("VvFormWrapper", i.VvFormWrapper), i != null && i.VvFormField && a.component("VvFormField", i.VvFormField), i != null && i.VvFormTemplate && a.component("VvFormTemplate", i.VvFormTemplate));
|
|
721
733
|
}
|
|
722
734
|
};
|
|
723
735
|
}
|
|
724
|
-
function
|
|
725
|
-
return
|
|
736
|
+
function ke(e, i = {}) {
|
|
737
|
+
return ue() ? Z(
|
|
726
738
|
e,
|
|
727
739
|
{
|
|
728
|
-
|
|
740
|
+
...$(F, {}),
|
|
729
741
|
...i
|
|
730
742
|
}
|
|
731
|
-
) :
|
|
743
|
+
) : Z(e, i);
|
|
732
744
|
}
|
|
733
|
-
function
|
|
734
|
-
return
|
|
745
|
+
function Se(e, i = {}) {
|
|
746
|
+
return Z(e, i);
|
|
735
747
|
}
|
|
736
748
|
export {
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
749
|
+
d as FormFieldType,
|
|
750
|
+
we as createForm,
|
|
751
|
+
R as defaultObjectBySchema,
|
|
752
|
+
Se as formFactory,
|
|
753
|
+
F as pluginInjectionKey,
|
|
754
|
+
ke as useForm
|
|
743
755
|
};
|
package/dist/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
(function(w,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core"),require("zod")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","zod"],e):(w=typeof globalThis<"u"?globalThis:w||self,e(w["@volverjs/form-vue"]={},w.Vue,w.VueUseCore,w.zod))})(this,function(w,e,$,S){"use strict";function N(r){return Array.isArray(r)}function J(r){return typeof r<"u"}function K(r){return r===null}function G(r){return typeof r=="object"}function L(r){return typeof r=="string"}function W(r){return typeof r>"u"}const M=/^[0-9]+$/,z=["__proto__","prototype","constructor"];function A(r,s,n){const f=J(n)?n:void 0;if(!G(r)||!L(s))return f;const i=q(s);if(i.length!==0){for(const t of i){if(t==="*")continue;const u=function(l){return l.map(a=>W(a)||K(a)?a:N(a)?u(a):a[t])};if(N(r)&&!M.test(t)?r=u(r):r=r[t],W(r)||K(r))break}return W(r)?f:r}}function Z(r,s,n){if(!G(r)||!L(s))return;const f=q(s);if(f.length===0)return;const i=f.length;for(let t=0;t<i;t++){const u=f[t];if(t===i-1){r[u]=n;return}if(u==="*"&&N(r)){const l=f.slice(t+1).join(".");for(const a of r)Z(a,l,n);return}W(r[u])&&(r[u]={}),r=r[u]}}function q(r){const s=r.split(/[.]|(?:\[(\d|\*)\])/).filter(n=>!!n);return s.some(n=>z.indexOf(n)!==-1)?[]:s}var d=(r=>(r.text="text",r.number="number",r.email="email",r.password="password",r.tel="tel",r.url="url",r.search="search",r.date="date",r.time="time",r.datetimeLocal="datetime-local",r.month="month",r.week="week",r.color="color",r.select="select",r.checkbox="checkbox",r.radio="radio",r.textarea="textarea",r.radioGroup="radioGroup",r.checkboxGroup="checkboxGroup",r.combobox="combobox",r.custom="custom",r))(d||{}),O=(r=>(r.invalid="invalid",r.valid="valid",r.submitting="submitting",r.updated="updated",r.unknown="unknown",r))(O||{});function T(r,s,n,f){return e.defineComponent({name:"VvFormField",props:{type:{type:String,validator:i=>Object.values(d).includes(i),default:d.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","valid","update:formData","update:modelValue"],expose:["invalid","invalidLabel","errors"],setup(i,{slots:t,emit:u}){const l=e.inject(s,void 0);l&&l.fields.value.add(i.name);const a=e.inject(r),{props:V,name:c}=e.toRefs(i),v=e.computed({get(){if(a!=null&&a.formData)return A(Object(a.formData.value),String(i.name))},set(o){a!=null&&a.formData&&(Z(Object(a.formData.value),String(i.name),o),u("update:modelValue",{newValue:v.value,formData:a==null?void 0:a.formData}))}});e.onMounted(()=>{v.value===void 0&&i.defaultValue!==void 0&&(v.value=i.defaultValue)});const p=e.computed(()=>{if(a!=null&&a.errors.value)return A(a.errors.value,String(i.name))}),g=e.computed(()=>{var o;return(o=p.value)==null?void 0:o._errors}),m=e.computed(()=>p.value!==void 0),y=e.watch(m,()=>{m.value?(u("invalid",g.value),l&&l.errors.value.set(i.name,{_errors:g.value})):(u("valid",v.value),l&&l.errors.value.delete(i.name))}),h=e.watch(()=>a==null?void 0:a.formData,()=>{u("update:formData",a==null?void 0:a.formData)},{deep:!0});e.onBeforeUnmount(()=>{y(),h()});const b=o=>{v.value=o},x=e.computed(()=>{let o=V.value;return typeof o=="function"&&(o=o(a==null?void 0:a.formData)),Object.keys(o).reduce((U,k)=>(U[k]=e.unref(o[k]),U),{})}),C=e.computed(()=>a!=null&&a.readonly.value?!0:x.value.readonly??i.readonly),I=e.computed(()=>({...x.value,name:x.value.name??i.name,invalid:m.value,valid:i.showValid?!!(!m.value&&v.value):void 0,type:(o=>{if([d.text,d.number,d.email,d.password,d.tel,d.url,d.search,d.date,d.time,d.datetimeLocal,d.month,d.week,d.color].includes(o))return o})(i.type),invalidLabel:g.value,modelValue:v.value,readonly:C.value,"onUpdate:modelValue":b}));return e.provide(n,{name:e.readonly(c),errors:e.readonly(p)}),{component:e.computed(()=>{if(i.type===d.custom)return{render(){var o;return((o=t.default)==null?void 0:o.call(t,{modelValue:v.value,onUpdate:b,submit:a==null?void 0:a.submit,validate:a==null?void 0:a.validate,invalid:m.value,invalidLabel:g.value,formData:a==null?void 0:a.formData.value,formErrors:a==null?void 0:a.errors.value,errors:p.value,readonly:C.value}))??t.defalut}};if(!((f==null?void 0:f.lazyLoad)??i.lazyLoad)){let o;switch(i.type){case d.select:o=e.resolveComponent("VvSelect");break;case d.checkbox:o=e.resolveComponent("VvCheckbox");break;case d.radio:o=e.resolveComponent("VvRadio");break;case d.textarea:o=e.resolveComponent("VvTextarea");break;case d.radioGroup:o=e.resolveComponent("VvRadioGroup");break;case d.checkboxGroup:o=e.resolveComponent("VvCheckboxGroup");break;case d.combobox:o=e.resolveComponent("VvCombobox");break;default:o=e.resolveComponent("VvInputText")}if(typeof o!="string")return o;console.warn(`[form-vue warn]: ${o} not found, the component will be loaded asynchronously. To avoid this warning, please set "lazyLoad" option.`)}return e.defineAsyncComponent(async()=>{switch(f!=null&&f.sideEffects&&await Promise.resolve(f.sideEffects(i.type)),i.type){case d.textarea:return import("@volverjs/ui-vue/vv-textarea");case d.radio:return import("@volverjs/ui-vue/vv-radio");case d.radioGroup:return import("@volverjs/ui-vue/vv-radio-group");case d.checkbox:return import("@volverjs/ui-vue/vv-checkbox");case d.checkboxGroup:return import("@volverjs/ui-vue/vv-checkbox-group");case d.select:return import("@volverjs/ui-vue/vv-select");case d.combobox:return import("@volverjs/ui-vue/vv-combobox")}return import("@volverjs/ui-vue/vv-input-text")})}),hasProps:I,invalid:m}},render(){return this.is?e.h(this.is,this.hasProps,this.$slots):this.type===d.custom?e.h(this.component,null,this.$slots):e.h(this.component,this.hasProps,this.$slots)}})}function E(r,s={}){const n=t=>{let u=t;for(;u instanceof S.ZodEffects;)u=u.innerType();return u instanceof S.ZodOptional&&(u=u._def.innerType),u},f=n(r);return{...(f instanceof S.ZodObject?f._def.unknownKeys==="passthrough":!1)?s:{},...Object.fromEntries(Object.entries(f.shape).map(([t,u])=>{const l=s[t];let a=n(u),V;if(a instanceof S.ZodDefault&&(V=a._def.defaultValue(),a=a._def.innerType),l===null&&a instanceof S.ZodNullable)return[t,l];if(a instanceof S.ZodSchema){const c=u.safeParse(l);if(c.success)return[t,c.data??V]}if(a instanceof S.ZodArray&&Array.isArray(l)&&l.length){const c=n(a._def.type);if(c instanceof S.ZodObject)return[t,l.map(v=>E(c,v&&typeof v=="object"?v:void 0))??V]}return a instanceof S.ZodObject?[t,E(a,l&&typeof l=="object"?l:V)]:[t,V]}))}}function P(r,s,n,f){const i=e.ref(),t=e.ref(),u=e.computed(()=>t.value===O.invalid),l=e.ref(),a=e.ref(!1),V=async(m=l.value)=>{if(a.value)return!0;const y=await r.safeParseAsync(m);return y.success?(i.value=void 0,t.value=O.valid,l.value=y.data,!0):(i.value=y.error.format(),t.value=O.invalid,!1)},c=async()=>a.value||!await V()?!1:(t.value=O.submitting,!0),{ignoreUpdates:v,stop:p}=$.watchIgnorable(l,()=>{t.value=O.updated},{deep:!0,eventFilter:$.throttleFilter((n==null?void 0:n.updateThrottle)??500)}),g=e.defineComponent({name:"VvForm",props:{continuousValidation:{type:Boolean,default:!1},modelValue:{type:Object,default:()=>({})},readonly:{type:Boolean,default:(n==null?void 0:n.readonly)??!1},tag:{type:String,default:"form"},template:{type:[Array,Function],default:void 0}},emits:["invalid","valid","submit","update:modelValue","update:readonly"],expose:["submit","validate","errors","status","valid","invalid","readonly"],setup(m,{emit:y}){return l.value=E(r,e.toRaw(m.modelValue)),e.watch(()=>m.modelValue,h=>{if(h){const b=e.isProxy(h)?e.toRaw(h):h;if(JSON.stringify(b)===JSON.stringify(e.toRaw(l.value)))return;l.value=typeof(b==null?void 0:b.clone)=="function"?b.clone():JSON.parse(JSON.stringify(b))}},{deep:!0}),e.watch(t,async h=>{var b,x,C,I,R;if(h===O.invalid){const o=e.toRaw(i.value);y("invalid",o),(b=n==null?void 0:n.onInvalid)==null||b.call(n,o);return}if(h===O.valid){const o=e.toRaw(l.value);y("valid",o),(x=n==null?void 0:n.onValid)==null||x.call(n,o),y("update:modelValue",o),(C=n==null?void 0:n.onUpdate)==null||C.call(n,o);return}if(h===O.submitting){const o=e.toRaw(l.value);y("submit",o),(I=n==null?void 0:n.onSubmit)==null||I.call(n,o)}if(h===O.updated){if((i.value||n!=null&&n.continuousValidation||m.continuousValidation)&&await V(),!l.value||!m.modelValue||JSON.stringify(l.value)!==JSON.stringify(m.modelValue)){const o=e.toRaw(l.value);y("update:modelValue",o),(R=n==null?void 0:n.onUpdate)==null||R.call(n,o)}t.value===O.updated&&(t.value=O.unknown)}}),e.onMounted(()=>{a.value=m.readonly}),e.watch(()=>m.readonly,h=>{a.value=h}),e.watch(a,h=>{h!==m.readonly&&y("update:readonly",a.value)}),e.provide(s,{formData:l,submit:c,validate:V,ignoreUpdates:v,stopUpdatesWatch:p,errors:e.readonly(i),status:e.readonly(t),invalid:u,readonly:a}),{formData:l,submit:c,validate:V,ignoreUpdates:v,stopUpdatesWatch:p,errors:e.readonly(i),status:e.readonly(t),invalid:u,isReadonly:a}},render(){const m=()=>{var y,h;return((h=(y=this.$slots)==null?void 0:y.default)==null?void 0:h.call(y,{formData:this.formData,submit:this.submit,validate:this.validate,ignoreUpdates:this.ignoreUpdates,stopUpdatesWatch:this.stopUpdatesWatch,errors:this.errors,status:this.status,invalid:this.invalid,readonly:this.isReadonly}))??this.$slots.default};return e.h(this.tag,{onSubmit:e.withModifiers(this.submit,["prevent"])},(this.template??(n==null?void 0:n.template))&&f?[e.h(f,{schema:this.template??(n==null?void 0:n.template)},{default:m})]:{default:m})}});return{errors:i,status:t,invalid:u,readonly:a,formData:l,validate:V,submit:c,ignoreUpdates:v,stopUpdatesWatch:p,VvForm:g}}function H(r,s){return e.defineComponent({name:"VvFormWrapper",props:{name:{type:String,required:!0},tag:{type:String,default:void 0}},emits:["invalid","valid"],expose:["fields","invalid"],setup(f,{emit:i}){const t=e.inject(r),u=e.inject(s,void 0),l=e.ref(new Set),a=e.ref(new Map),{name:V}=e.toRefs(f);e.provide(s,{name:e.readonly(V),errors:a,fields:l}),e.watch(l,v=>{u!=null&&u.fields&&v.forEach(p=>{u==null||u.fields.value.add(p)})},{deep:!0}),e.watch(()=>new Map(a.value),(v,p)=>{u!=null&&u.errors&&(Array.from(p.keys()).forEach(g=>{u.errors.value.delete(g)}),Array.from(v.keys()).forEach(g=>{const m=v.get(g);m&&u.errors.value.set(g,m)}))},{deep:!0});const c=e.computed(()=>t!=null&&t.invalid.value?a.value.size>0:!1);return e.watch(c,()=>{c.value?i("invalid"):i("valid")}),{formData:t==null?void 0:t.formData,errors:t==null?void 0:t.errors,submit:t==null?void 0:t.submit,validate:t==null?void 0:t.validate,invalid:c,fields:l,fieldsErrors:a}},render(){var f,i;return this.tag?e.h(this.tag,null,{default:()=>{var t,u;return((u=(t=this.$slots).default)==null?void 0:u.call(t,{invalid:this.invalid,formData:this.formData,submit:this.submit,validate:this.validate,errors:this.errors,fieldsErrors:this.fieldsErrors}))??this.$slots.defalut}}):((i=(f=this.$slots).default)==null?void 0:i.call(f,{invalid:this.invalid,formData:this.formData,submit:this.submit,validate:this.validate,errors:this.errors,fieldsErrors:this.fieldsErrors}))??this.$slots.defalut}})}function Q(r,s){const n=e.defineComponent({name:"VvFormTemplate",props:{schema:{type:[Array,Function],required:!0},scope:{type:Object,default:()=>({})}},setup(f,{slots:i}){const t=e.inject(r);if(t!=null&&t.formData)return()=>{var V;const u=typeof f.schema=="function"?f.schema(t,f.scope):f.schema;let l;const a=u.reduce((c,v)=>{const p=typeof v=="function"?v(t,f.scope):v,{vvIs:g,vvName:m,vvSlots:y,vvChildren:h,vvIf:b,vvElseIf:x,vvType:C,vvDefaultValue:I,vvShowValid:R,vvContent:o,...U}=p;if(b!==void 0){if(typeof b=="string"?l=!!A(Object(t.formData.value),b):typeof b=="function"?l=e.unref(b(t)):l=e.unref(b),!l)return c}else if(x!==void 0&&l!==void 0){if(l||(typeof x=="string"?l=!!A(Object(t.formData.value),x):typeof x=="function"?l=e.unref(x(t)):l=e.unref(x),!l))return c}else l=void 0;let k;return h&&(typeof g=="string"?k=e.h(n,{schema:h}):k={default:j=>e.h(n,{schema:h,scope:j})}),m?(c.push(e.h(s,{name:m,is:g,type:C,defaultValue:I,showValid:R,props:U},y??k??o)),c):g?(c.push(e.h(g,U,y??k??o)),c):(k&&("default"in k?c.push(k.default(f.scope)):c.push(k)),c)},[]);return a.push((V=i==null?void 0:i.default)==null?void 0:V.call(i,{formData:t==null?void 0:t.formData.value,submit:t==null?void 0:t.submit,validate:t==null?void 0:t.validate,errors:t==null?void 0:t.errors.value,status:t==null?void 0:t.status.value,invalid:t==null?void 0:t.invalid.value})),a}}});return n}function B(r,s={}){const n=Symbol("formInjectionKey"),f=Symbol("formWrapperInjectionKey"),i=Symbol("formFieldInjectionKey"),t=H(n,f),u=T(n,f,i,s),l=Q(n,u),{VvForm:a,errors:V,status:c,invalid:v,readonly:p,formData:g,validate:m,submit:y,ignoreUpdates:h,stopUpdatesWatch:b}=P(r,n,s,l);return{VvForm:a,VvFormWrapper:t,VvFormField:u,VvFormTemplate:l,formInjectionKey:n,formWrapperInjectionKey:f,formFieldInjectionKey:i,errors:V,status:c,invalid:v,readonly:p,formData:g,validate:m,submit:y,ignoreUpdates:h,stopUpdatesWatch:b}}const _=Symbol("pluginInjectionKey");function X(r){let s={};return r.schema&&(s=B(r.schema,r)),{...s,install(n,{global:f=!1}={}){n.provide(_,r),f&&(n.config.globalProperties.$vvForm=r,s!=null&&s.VvForm&&n.component("VvForm",s.VvForm),s!=null&&s.VvFormWrapper&&n.component("VvFormWrapper",s.VvFormWrapper),s!=null&&s.VvFormField&&n.component("VvFormField",s.VvFormField),s!=null&&s.VvFormTemplate&&n.component("VvFormTemplate",s.VvFormTemplate))}}}function Y(r,s={}){return e.getCurrentInstance()?B(r,{...e.inject(_,{}),...s}):B(r,s)}function D(r,s={}){return B(r,s)}w.FormFieldType=d,w.createForm=X,w.defaultObjectBySchema=E,w.formFactory=D,w.pluginInjectionKey=_,w.useForm=Y,Object.defineProperty(w,Symbol.toStringTag,{value:"Module"})});
|
|
1
|
+
(function(w,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@vueuse/core"),require("zod")):typeof define=="function"&&define.amd?define(["exports","vue","@vueuse/core","zod"],e):(w=typeof globalThis<"u"?globalThis:w||self,e(w["@volverjs/form-vue"]={},w.Vue,w.VueUseCore,w.zod))})(this,function(w,e,N,O){"use strict";function Z(t){return Array.isArray(t)}function J(t){return typeof t<"u"}function $(t){return t===null}function G(t){return typeof t=="object"}function K(t){return typeof t=="string"}function W(t){return typeof t>"u"}const M=/^[0-9]+$/,T=["__proto__","prototype","constructor"];function A(t,s,n){const f=J(n)?n:void 0;if(!G(t)||!K(s))return f;const i=q(s);if(i.length!==0){for(const a of i){if(a==="*")continue;const u=function(l){return l.map(r=>W(r)||$(r)?r:Z(r)?u(r):r[a])};if(Z(t)&&!M.test(a)?t=u(t):t=t[a],W(t)||$(t))break}return W(t)?f:t}}function L(t,s,n){if(!G(t)||!K(s))return;const f=q(s);if(f.length===0)return;const i=f.length;for(let a=0;a<i;a++){const u=f[a];if(a===i-1){t[u]=n;return}if(u==="*"&&Z(t)){const l=f.slice(a+1).join(".");for(const r of t)L(r,l,n);return}W(t[u])&&(t[u]={}),t=t[u]}}function q(t){const s=t.split(/[.]|(?:\[(\d|\*)\])/).filter(n=>!!n);return s.some(n=>T.indexOf(n)!==-1)?[]:s}var c=(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))(c||{}),k=(t=>(t.invalid="invalid",t.valid="valid",t.submitting="submitting",t.updated="updated",t.unknown="unknown",t))(k||{});function P(t,s,n,f){return e.defineComponent({name:"VvFormField",props:{type:{type:String,validator:i=>Object.values(c).includes(i),default:c.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","valid","update:formData","update:modelValue"],expose:["invalid","invalidLabel","errors"],setup(i,{slots:a,emit:u}){const l=e.inject(s,void 0);l&&l.fields.value.add(i.name);const r=e.inject(t),{props:g,name:d}=e.toRefs(i),v=e.computed({get(){if(r!=null&&r.formData)return A(Object(r.formData.value),String(i.name))},set(o){r!=null&&r.formData&&(L(Object(r.formData.value),String(i.name),o),u("update:modelValue",{newValue:v.value,formData:r==null?void 0:r.formData}))}});e.onMounted(()=>{v.value===void 0&&i.defaultValue!==void 0&&(v.value=i.defaultValue)});const h=e.computed(()=>{if(r!=null&&r.errors.value)return A(r.errors.value,String(i.name))}),y=e.computed(()=>{var o;return(o=h.value)==null?void 0:o._errors}),m=e.computed(()=>h.value!==void 0),V=e.watch(m,()=>{m.value?(u("invalid",y.value),l&&l.errors.value.set(i.name,{_errors:y.value})):(u("valid",v.value),l&&l.errors.value.delete(i.name))}),b=e.watch(()=>r==null?void 0:r.formData,()=>{u("update:formData",r==null?void 0:r.formData)},{deep:!0});e.onBeforeUnmount(()=>{V(),b()});const p=o=>{v.value=o},x=e.computed(()=>{let o=g.value;return typeof o=="function"&&(o=o(r==null?void 0:r.formData)),Object.keys(o).reduce((U,S)=>(U[S]=e.unref(o[S]),U),{})}),C=e.computed(()=>r!=null&&r.readonly.value?!0:x.value.readonly??i.readonly),I=e.computed(()=>({...x.value,name:x.value.name??i.name,invalid:m.value,valid:i.showValid?!!(!m.value&&v.value):void 0,type:(o=>{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].includes(o))return o})(i.type),invalidLabel:y.value,modelValue:v.value,readonly:C.value,"onUpdate:modelValue":p}));return e.provide(n,{name:e.readonly(d),errors:e.readonly(h)}),{component:e.computed(()=>{if(i.type===c.custom)return{render(){var o;return((o=a.default)==null?void 0:o.call(a,{modelValue:v.value,onUpdate:p,submit:r==null?void 0:r.submit,validate:r==null?void 0:r.validate,invalid:m.value,invalidLabel:y.value,formData:r==null?void 0:r.formData.value,formErrors:r==null?void 0:r.errors.value,errors:h.value,readonly:C.value}))??a.defalut}};if(!((f==null?void 0:f.lazyLoad)??i.lazyLoad)){let o;switch(i.type){case c.select:o=e.resolveComponent("VvSelect");break;case c.checkbox:o=e.resolveComponent("VvCheckbox");break;case c.radio:o=e.resolveComponent("VvRadio");break;case c.textarea:o=e.resolveComponent("VvTextarea");break;case c.radioGroup:o=e.resolveComponent("VvRadioGroup");break;case c.checkboxGroup:o=e.resolveComponent("VvCheckboxGroup");break;case c.combobox:o=e.resolveComponent("VvCombobox");break;default:o=e.resolveComponent("VvInputText")}if(typeof o!="string")return o;console.warn(`[form-vue warn]: ${o} not found, the component will be loaded asynchronously. To avoid this warning, please set "lazyLoad" option.`)}return e.defineAsyncComponent(async()=>{switch(f!=null&&f.sideEffects&&await Promise.resolve(f.sideEffects(i.type)),i.type){case c.textarea:return import("@volverjs/ui-vue/vv-textarea");case c.radio:return import("@volverjs/ui-vue/vv-radio");case c.radioGroup:return import("@volverjs/ui-vue/vv-radio-group");case c.checkbox:return import("@volverjs/ui-vue/vv-checkbox");case c.checkboxGroup:return import("@volverjs/ui-vue/vv-checkbox-group");case c.select:return import("@volverjs/ui-vue/vv-select");case c.combobox:return import("@volverjs/ui-vue/vv-combobox")}return import("@volverjs/ui-vue/vv-input-text")})}),hasProps:I,invalid:m}},render(){return this.is?e.h(this.is,this.hasProps,this.$slots):this.type===c.custom?e.h(this.component,null,this.$slots):e.h(this.component,this.hasProps,this.$slots)}})}function R(t,s={}){const n=u=>{let l=u;for(;l instanceof O.ZodEffects;)l=l.innerType();return l instanceof O.ZodOptional&&(l=l._def.innerType),l},f=u=>{let l=u;for(;l instanceof O.ZodEffects;)l=l.innerType();return l instanceof O.ZodOptional},i=n(t);return{...(i instanceof O.ZodObject?i._def.unknownKeys==="passthrough":!1)?s:{},...Object.fromEntries(Object.entries(i.shape).map(([u,l])=>{const r=s[u],g=f(l);let d=n(l),v;if(d instanceof O.ZodDefault&&(v=d._def.defaultValue(),d=d._def.innerType),r===null&&d instanceof O.ZodNullable)return[u,r];if(r==null&&g)return[u,v];if(d instanceof O.ZodSchema){const h=l.safeParse(r);if(h.success)return[u,h.data??v]}if(d instanceof O.ZodArray&&Array.isArray(r)&&r.length){const h=n(d._def.type);if(h instanceof O.ZodObject)return[u,r.map(y=>R(h,y&&typeof y=="object"?y:void 0))]}if(d instanceof O.ZodRecord&&r){const h=n(d._def.valueType);if(h instanceof O.ZodObject)return[u,Object.keys(r).reduce((y,m)=>(y[m]=R(h,r[m]),y),{})]}return d instanceof O.ZodObject?[u,R(d,r&&typeof r=="object"?r:v)]:[u,v]}))}}function H(t,s,n,f){const i=e.ref(),a=e.ref(),u=e.computed(()=>a.value===k.invalid),l=e.ref(),r=e.ref(!1),g=async(m=l.value)=>{if(r.value)return!0;const V=await t.safeParseAsync(m);return V.success?(i.value=void 0,a.value=k.valid,l.value=V.data,!0):(i.value=V.error.format(),a.value=k.invalid,!1)},d=async()=>r.value||!await g()?!1:(a.value=k.submitting,!0),{ignoreUpdates:v,stop:h}=N.watchIgnorable(l,()=>{a.value=k.updated},{deep:!0,eventFilter:N.throttleFilter((n==null?void 0:n.updateThrottle)??500)}),y=e.defineComponent({name:"VvForm",props:{continuousValidation:{type:Boolean,default:!1},modelValue:{type:Object,default:()=>({})},readonly:{type:Boolean,default:(n==null?void 0:n.readonly)??!1},tag:{type:String,default:"form"},template:{type:[Array,Function],default:void 0}},emits:["invalid","valid","submit","update:modelValue","update:readonly"],expose:["submit","validate","errors","status","valid","invalid","readonly"],setup(m,{emit:V}){return l.value=R(t,e.toRaw(m.modelValue)),e.watch(()=>m.modelValue,b=>{if(b){const p=e.isProxy(b)?e.toRaw(b):b;if(JSON.stringify(p)===JSON.stringify(e.toRaw(l.value)))return;l.value=typeof(p==null?void 0:p.clone)=="function"?p.clone():JSON.parse(JSON.stringify(p))}},{deep:!0}),e.watch(a,async b=>{var p,x,C,I,E;if(b===k.invalid){const o=e.toRaw(i.value);V("invalid",o),(p=n==null?void 0:n.onInvalid)==null||p.call(n,o);return}if(b===k.valid){const o=e.toRaw(l.value);V("valid",o),(x=n==null?void 0:n.onValid)==null||x.call(n,o),V("update:modelValue",o),(C=n==null?void 0:n.onUpdate)==null||C.call(n,o);return}if(b===k.submitting){const o=e.toRaw(l.value);V("submit",o),(I=n==null?void 0:n.onSubmit)==null||I.call(n,o)}if(b===k.updated){if((i.value||n!=null&&n.continuousValidation||m.continuousValidation)&&await g(),!l.value||!m.modelValue||JSON.stringify(l.value)!==JSON.stringify(m.modelValue)){const o=e.toRaw(l.value);V("update:modelValue",o),(E=n==null?void 0:n.onUpdate)==null||E.call(n,o)}a.value===k.updated&&(a.value=k.unknown)}}),e.onMounted(()=>{r.value=m.readonly}),e.watch(()=>m.readonly,b=>{r.value=b}),e.watch(r,b=>{b!==m.readonly&&V("update:readonly",r.value)}),e.provide(s,{formData:l,submit:d,validate:g,ignoreUpdates:v,stopUpdatesWatch:h,errors:e.readonly(i),status:e.readonly(a),invalid:u,readonly:r}),{formData:l,submit:d,validate:g,ignoreUpdates:v,stopUpdatesWatch:h,errors:e.readonly(i),status:e.readonly(a),invalid:u,isReadonly:r}},render(){const m=()=>{var V,b;return((b=(V=this.$slots)==null?void 0:V.default)==null?void 0:b.call(V,{formData:this.formData,submit:this.submit,validate:this.validate,ignoreUpdates:this.ignoreUpdates,stopUpdatesWatch:this.stopUpdatesWatch,errors:this.errors,status:this.status,invalid:this.invalid,readonly:this.isReadonly}))??this.$slots.default};return e.h(this.tag,{onSubmit:e.withModifiers(this.submit,["prevent"])},(this.template??(n==null?void 0:n.template))&&f?[e.h(f,{schema:this.template??(n==null?void 0:n.template)},{default:m})]:{default:m})}});return{errors:i,status:a,invalid:u,readonly:r,formData:l,validate:g,submit:d,ignoreUpdates:v,stopUpdatesWatch:h,VvForm:y}}function Q(t,s){return e.defineComponent({name:"VvFormWrapper",props:{name:{type:String,required:!0},tag:{type:String,default:void 0}},emits:["invalid","valid"],expose:["fields","invalid"],setup(f,{emit:i}){const a=e.inject(t),u=e.inject(s,void 0),l=e.ref(new Set),r=e.ref(new Map),{name:g}=e.toRefs(f);e.provide(s,{name:e.readonly(g),errors:r,fields:l}),e.watch(l,v=>{u!=null&&u.fields&&v.forEach(h=>{u==null||u.fields.value.add(h)})},{deep:!0}),e.watch(()=>new Map(r.value),(v,h)=>{u!=null&&u.errors&&(Array.from(h.keys()).forEach(y=>{u.errors.value.delete(y)}),Array.from(v.keys()).forEach(y=>{const m=v.get(y);m&&u.errors.value.set(y,m)}))},{deep:!0});const d=e.computed(()=>a!=null&&a.invalid.value?r.value.size>0:!1);return e.watch(d,()=>{d.value?i("invalid"):i("valid")}),{formData:a==null?void 0:a.formData,errors:a==null?void 0:a.errors,submit:a==null?void 0:a.submit,validate:a==null?void 0:a.validate,invalid:d,fields:l,fieldsErrors:r}},render(){var f,i;return this.tag?e.h(this.tag,null,{default:()=>{var a,u;return((u=(a=this.$slots).default)==null?void 0:u.call(a,{invalid:this.invalid,formData:this.formData,submit:this.submit,validate:this.validate,errors:this.errors,fieldsErrors:this.fieldsErrors}))??this.$slots.defalut}}):((i=(f=this.$slots).default)==null?void 0:i.call(f,{invalid:this.invalid,formData:this.formData,submit:this.submit,validate:this.validate,errors:this.errors,fieldsErrors:this.fieldsErrors}))??this.$slots.defalut}})}function X(t,s){const n=e.defineComponent({name:"VvFormTemplate",props:{schema:{type:[Array,Function],required:!0},scope:{type:Object,default:()=>({})}},setup(f,{slots:i}){const a=e.inject(t);if(a!=null&&a.formData)return()=>{var g;const u=typeof f.schema=="function"?f.schema(a,f.scope):f.schema;let l;const r=u.reduce((d,v)=>{const h=typeof v=="function"?v(a,f.scope):v,{vvIs:y,vvName:m,vvSlots:V,vvChildren:b,vvIf:p,vvElseIf:x,vvType:C,vvDefaultValue:I,vvShowValid:E,vvContent:o,...U}=h;if(p!==void 0){if(typeof p=="string"?l=!!A(Object(a.formData.value),p):typeof p=="function"?l=e.unref(p(a)):l=e.unref(p),!l)return d}else if(x!==void 0&&l!==void 0){if(l||(typeof x=="string"?l=!!A(Object(a.formData.value),x):typeof x=="function"?l=e.unref(x(a)):l=e.unref(x),!l))return d}else l=void 0;let S;return b&&(typeof y=="string"?S=e.h(n,{schema:b}):S={default:j=>e.h(n,{schema:b,scope:j})}),m?(d.push(e.h(s,{name:m,is:y,type:C,defaultValue:I,showValid:E,props:U},V??S??o)),d):y?(d.push(e.h(y,U,V??S??o)),d):(S&&("default"in S?d.push(S.default(f.scope)):d.push(S)),d)},[]);return r.push((g=i==null?void 0:i.default)==null?void 0:g.call(i,{formData:a==null?void 0:a.formData.value,submit:a==null?void 0:a.submit,validate:a==null?void 0:a.validate,errors:a==null?void 0:a.errors.value,status:a==null?void 0:a.status.value,invalid:a==null?void 0:a.invalid.value})),r}}});return n}function B(t,s={}){const n=Symbol("formInjectionKey"),f=Symbol("formWrapperInjectionKey"),i=Symbol("formFieldInjectionKey"),a=Q(n,f),u=P(n,f,i,s),l=X(n,u),{VvForm:r,errors:g,status:d,invalid:v,readonly:h,formData:y,validate:m,submit:V,ignoreUpdates:b,stopUpdatesWatch:p}=H(t,n,s,l);return{VvForm:r,VvFormWrapper:a,VvFormField:u,VvFormTemplate:l,formInjectionKey:n,formWrapperInjectionKey:f,formFieldInjectionKey:i,errors:g,status:d,invalid:v,readonly:h,formData:y,validate:m,submit:V,ignoreUpdates:b,stopUpdatesWatch:p}}const _=Symbol("pluginInjectionKey");function Y(t){let s={};return t.schema&&(s=B(t.schema,t)),{...s,install(n,{global:f=!1}={}){n.provide(_,t),f&&(n.config.globalProperties.$vvForm=t,s!=null&&s.VvForm&&n.component("VvForm",s.VvForm),s!=null&&s.VvFormWrapper&&n.component("VvFormWrapper",s.VvFormWrapper),s!=null&&s.VvFormField&&n.component("VvFormField",s.VvFormField),s!=null&&s.VvFormTemplate&&n.component("VvFormTemplate",s.VvFormTemplate))}}}function z(t,s={}){return e.getCurrentInstance()?B(t,{...e.inject(_,{}),...s}):B(t,s)}function D(t,s={}){return B(t,s)}w.FormFieldType=c,w.createForm=Y,w.defaultObjectBySchema=R,w.formFactory=D,w.pluginInjectionKey=_,w.useForm=z,Object.defineProperty(w,Symbol.toStringTag,{value:"Module"})});
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@volverjs/form-vue",
|
|
3
3
|
"type": "module",
|
|
4
|
-
"version": "1.0.0-beta.
|
|
4
|
+
"version": "1.0.0-beta.15",
|
|
5
5
|
"description": "Vue 3 Forms with @volverjs/ui-vue",
|
|
6
6
|
"author": "8 Wave S.r.l.",
|
|
7
7
|
"license": "MIT",
|
|
@@ -49,28 +49,28 @@
|
|
|
49
49
|
"engines": {
|
|
50
50
|
"node": ">= 16.x"
|
|
51
51
|
},
|
|
52
|
-
"
|
|
53
|
-
"@volverjs/ui-vue": "0.0.10-beta.
|
|
54
|
-
"@vueuse/core": "^10.
|
|
52
|
+
"peerDependencies": {
|
|
53
|
+
"@volverjs/ui-vue": "0.0.10-beta.41",
|
|
54
|
+
"@vueuse/core": "^10.11.0",
|
|
55
55
|
"ts-dot-prop": "^2.1.4",
|
|
56
|
-
"vue": "^3.4.
|
|
56
|
+
"vue": "^3.4.29",
|
|
57
57
|
"zod": "^3.23.8"
|
|
58
58
|
},
|
|
59
59
|
"devDependencies": {
|
|
60
|
-
"@antfu/eslint-config": "^2.
|
|
60
|
+
"@antfu/eslint-config": "^2.21.1",
|
|
61
61
|
"@nabla/vite-plugin-eslint": "^2.0.4",
|
|
62
62
|
"@playwright/experimental-ct-vue": "1.44.1",
|
|
63
63
|
"@testing-library/vue": "^8.1.0",
|
|
64
64
|
"@vitejs/plugin-vue": "^5.0.5",
|
|
65
65
|
"@volverjs/style": "0.1.12-beta.15",
|
|
66
|
-
"@vue/compiler-sfc": "^3.4.
|
|
67
|
-
"@vue/runtime-core": "^3.4.
|
|
66
|
+
"@vue/compiler-sfc": "^3.4.29",
|
|
67
|
+
"@vue/runtime-core": "^3.4.29",
|
|
68
68
|
"@vue/test-utils": "^2.4.6",
|
|
69
69
|
"copy": "^0.3.2",
|
|
70
|
-
"eslint": "^9.
|
|
70
|
+
"eslint": "^9.5.0",
|
|
71
71
|
"happy-dom": "^14.12.0",
|
|
72
72
|
"typescript": "^5.4.5",
|
|
73
|
-
"vite": "^5.
|
|
73
|
+
"vite": "^5.3.1",
|
|
74
74
|
"vite-plugin-dts": "^3.9.1",
|
|
75
75
|
"vite-plugin-externalize-deps": "^0.8.0",
|
|
76
76
|
"vitest": "^1.6.0"
|
package/src/utils.ts
CHANGED
|
@@ -8,12 +8,13 @@ import {
|
|
|
8
8
|
ZodSchema,
|
|
9
9
|
ZodNullable,
|
|
10
10
|
ZodOptional,
|
|
11
|
+
ZodRecord,
|
|
11
12
|
ZodArray,
|
|
12
13
|
} from 'zod'
|
|
13
14
|
import type { FormSchema } from './types'
|
|
14
15
|
|
|
15
|
-
export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema,
|
|
16
|
-
const
|
|
16
|
+
export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema, original: Partial<z.infer<Schema>> & Record<string, unknown> = {}): Partial<z.infer<Schema>> {
|
|
17
|
+
const getSchemaInnerType = <Type extends ZodTypeAny>(
|
|
17
18
|
schema:
|
|
18
19
|
| Type
|
|
19
20
|
| ZodEffects<Type>
|
|
@@ -29,7 +30,23 @@ export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema,
|
|
|
29
30
|
}
|
|
30
31
|
return toReturn
|
|
31
32
|
}
|
|
32
|
-
const
|
|
33
|
+
const isSchemaOptional = <Type extends ZodTypeAny>(
|
|
34
|
+
schema:
|
|
35
|
+
| Type
|
|
36
|
+
| ZodEffects<Type>
|
|
37
|
+
| ZodEffects<ZodEffects<Type>>
|
|
38
|
+
| ZodOptional<Type>,
|
|
39
|
+
) => {
|
|
40
|
+
let toReturn = schema
|
|
41
|
+
while (toReturn instanceof ZodEffects) {
|
|
42
|
+
toReturn = toReturn.innerType()
|
|
43
|
+
}
|
|
44
|
+
if (toReturn instanceof ZodOptional) {
|
|
45
|
+
return true
|
|
46
|
+
}
|
|
47
|
+
return false
|
|
48
|
+
}
|
|
49
|
+
const innerType = getSchemaInnerType<AnyZodObject>(schema)
|
|
33
50
|
const unknownKeys
|
|
34
51
|
= innerType instanceof ZodObject
|
|
35
52
|
? innerType._def.unknownKeys === 'passthrough'
|
|
@@ -40,7 +57,8 @@ export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema,
|
|
|
40
57
|
(Object.entries(innerType.shape) as [string, ZodTypeAny][]).map(
|
|
41
58
|
([key, subSchema]) => {
|
|
42
59
|
const originalValue = original[key]
|
|
43
|
-
|
|
60
|
+
const isOptional = isSchemaOptional(subSchema)
|
|
61
|
+
let innerType = getSchemaInnerType(subSchema)
|
|
44
62
|
let defaultValue: Partial<z.infer<Schema>> | undefined
|
|
45
63
|
if (innerType instanceof ZodDefault) {
|
|
46
64
|
defaultValue = innerType._def.defaultValue()
|
|
@@ -52,6 +70,9 @@ export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema,
|
|
|
52
70
|
) {
|
|
53
71
|
return [key, originalValue]
|
|
54
72
|
}
|
|
73
|
+
if ((originalValue === undefined || originalValue === null) && isOptional) {
|
|
74
|
+
return [key, defaultValue]
|
|
75
|
+
}
|
|
55
76
|
if (innerType instanceof ZodSchema) {
|
|
56
77
|
const parse = subSchema.safeParse(originalValue)
|
|
57
78
|
if (parse.success) {
|
|
@@ -63,7 +84,7 @@ export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema,
|
|
|
63
84
|
&& Array.isArray(originalValue)
|
|
64
85
|
&& originalValue.length
|
|
65
86
|
) {
|
|
66
|
-
const arrayType =
|
|
87
|
+
const arrayType = getSchemaInnerType(innerType._def.type)
|
|
67
88
|
if (arrayType instanceof ZodObject) {
|
|
68
89
|
return [
|
|
69
90
|
key,
|
|
@@ -76,10 +97,19 @@ export function defaultObjectBySchema<Schema extends FormSchema>(schema: Schema,
|
|
|
76
97
|
typeof arrayType
|
|
77
98
|
>,
|
|
78
99
|
),
|
|
79
|
-
)
|
|
100
|
+
),
|
|
80
101
|
]
|
|
81
102
|
}
|
|
82
103
|
}
|
|
104
|
+
if (innerType instanceof ZodRecord && originalValue) {
|
|
105
|
+
const valueType = getSchemaInnerType(innerType._def.valueType)
|
|
106
|
+
if (valueType instanceof ZodObject) {
|
|
107
|
+
return [key, Object.keys(originalValue).reduce((acc: Record<string, unknown>, recordKey: string) => {
|
|
108
|
+
acc[recordKey] = defaultObjectBySchema(valueType, originalValue[recordKey])
|
|
109
|
+
return acc
|
|
110
|
+
}, {})]
|
|
111
|
+
}
|
|
112
|
+
}
|
|
83
113
|
if (innerType instanceof ZodObject) {
|
|
84
114
|
return [
|
|
85
115
|
key,
|