@companix/formkit 0.0.18 → 0.0.19
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/bundle.es.js +70 -69
- package/dist/useForm.d.ts +2 -0
- package/package.json +2 -2
package/dist/bundle.es.js
CHANGED
|
@@ -39,12 +39,12 @@ const D = M({}), q = (n) => {
|
|
|
39
39
|
S(() => () => {
|
|
40
40
|
t();
|
|
41
41
|
}, []);
|
|
42
|
-
const { value:
|
|
42
|
+
const { value: b, error: m } = s.getForm(e);
|
|
43
43
|
return /* @__PURE__ */ h(
|
|
44
44
|
n,
|
|
45
45
|
{
|
|
46
46
|
field: {
|
|
47
|
-
value:
|
|
47
|
+
value: b,
|
|
48
48
|
onChange: (y) => {
|
|
49
49
|
s.onChange(e, y);
|
|
50
50
|
},
|
|
@@ -60,20 +60,20 @@ const D = M({}), q = (n) => {
|
|
|
60
60
|
}, z = ({ item: n, path: e }) => {
|
|
61
61
|
const { getController: r, items: s } = n, t = R(D), f = p(() => {
|
|
62
62
|
const l = {};
|
|
63
|
-
return s.forEach(({ name:
|
|
64
|
-
l[
|
|
63
|
+
return s.forEach(({ name: g, getForm: o }) => {
|
|
64
|
+
l[g] = o(g, () => a(g));
|
|
65
65
|
}), l;
|
|
66
|
-
}, []),
|
|
66
|
+
}, []), b = A(() => {
|
|
67
67
|
const l = [];
|
|
68
|
-
return s.forEach(({ name:
|
|
69
|
-
t.getForm([...e,
|
|
68
|
+
return s.forEach(({ name: g }) => {
|
|
69
|
+
t.getForm([...e, g].join(".")).value !== void 0 && l.push(g);
|
|
70
70
|
}), l;
|
|
71
|
-
}, []), m = p(() =>
|
|
71
|
+
}, []), m = p(() => b(), []), [y, v] = w(m);
|
|
72
72
|
S(() => {
|
|
73
73
|
const { unregistry: l } = t.registryExtraForm(
|
|
74
|
-
s.map(({ name:
|
|
74
|
+
s.map(({ name: g }) => [...e, g].join(".")),
|
|
75
75
|
() => {
|
|
76
|
-
v(
|
|
76
|
+
v(b());
|
|
77
77
|
}
|
|
78
78
|
);
|
|
79
79
|
return () => {
|
|
@@ -82,16 +82,16 @@ const D = M({}), q = (n) => {
|
|
|
82
82
|
}, []);
|
|
83
83
|
const d = A(
|
|
84
84
|
(l) => {
|
|
85
|
-
f[l] && !y.includes(l) && v((
|
|
85
|
+
f[l] && !y.includes(l) && v((g) => [...g, l]);
|
|
86
86
|
},
|
|
87
87
|
[y]
|
|
88
88
|
), a = A((l) => {
|
|
89
|
-
v((
|
|
89
|
+
v((g) => g.filter((o) => o !== l));
|
|
90
90
|
}, []);
|
|
91
91
|
return /* @__PURE__ */ B(j, { children: [
|
|
92
92
|
y.map((l) => {
|
|
93
|
-
const
|
|
94
|
-
return /* @__PURE__ */ h(C, { path: e, scheme: [
|
|
93
|
+
const g = f[l];
|
|
94
|
+
return /* @__PURE__ */ h(C, { path: e, scheme: [g] }, `param-form--${l}`);
|
|
95
95
|
}),
|
|
96
96
|
r(d, y)
|
|
97
97
|
] });
|
|
@@ -127,8 +127,8 @@ const D = M({}), q = (n) => {
|
|
|
127
127
|
V(t.childs, e, r, s);
|
|
128
128
|
return;
|
|
129
129
|
}
|
|
130
|
-
t.type === "extra" && t.items.forEach(({ getForm: f, name:
|
|
131
|
-
V([f(
|
|
130
|
+
t.type === "extra" && t.items.forEach(({ getForm: f, name: b }) => {
|
|
131
|
+
V([f(b, () => {
|
|
132
132
|
})], e, r, s);
|
|
133
133
|
});
|
|
134
134
|
});
|
|
@@ -158,8 +158,8 @@ const D = M({}), q = (n) => {
|
|
|
158
158
|
return;
|
|
159
159
|
}
|
|
160
160
|
}
|
|
161
|
-
t.type === "extra" && t.items.forEach(({ getForm: f, name:
|
|
162
|
-
E({ scheme: [f(
|
|
161
|
+
t.type === "extra" && t.items.forEach(({ getForm: f, name: b }) => {
|
|
162
|
+
E({ scheme: [f(b, () => {
|
|
163
163
|
})], path: r, values: e, forms: s });
|
|
164
164
|
});
|
|
165
165
|
});
|
|
@@ -167,7 +167,7 @@ const D = M({}), q = (n) => {
|
|
|
167
167
|
const r = {};
|
|
168
168
|
return E({ scheme: n, path: [], values: r, forms: e }), r;
|
|
169
169
|
}, G = (n, e) => {
|
|
170
|
-
const { onSubmit: r, onEqual: s, disabled: t, onDirty: f, onFormDirty:
|
|
170
|
+
const { onSubmit: r, onEqual: s, disabled: t, onDirty: f, onFormDirty: b, onChangeEvent: m, defaultValues: y } = e, v = { onSubmit: r }, d = {
|
|
171
171
|
isActive: !1,
|
|
172
172
|
isSubmitted: !1,
|
|
173
173
|
dirtyCount: 0
|
|
@@ -175,13 +175,13 @@ const D = M({}), q = (n) => {
|
|
|
175
175
|
subscribers: [],
|
|
176
176
|
names: {}
|
|
177
177
|
};
|
|
178
|
-
V(n, [], y ?? {}, (o,
|
|
179
|
-
a[
|
|
178
|
+
V(n, [], y ?? {}, (o, i, u) => {
|
|
179
|
+
a[i] = {
|
|
180
180
|
error: null,
|
|
181
181
|
isDirty: !1,
|
|
182
|
-
value:
|
|
182
|
+
value: u,
|
|
183
183
|
// текущее (динамическое) состояние поля. Значение равно переданному дефолтному, либо: определяется как дефолтное значение компонента формы в момент его монтирования, а до этого - undefined.
|
|
184
|
-
startValue:
|
|
184
|
+
startValue: u ?? o.defaultValue,
|
|
185
185
|
// начальное (стартовое) значение (равно переданному дефолтному, либо значению формы по умолчанию). Исходя из сравнения текущего значения со стартовым, можно понять, модифицированно ли поле
|
|
186
186
|
defaultValue: o.defaultValue,
|
|
187
187
|
// дефолтное значение компонента формы
|
|
@@ -191,8 +191,8 @@ const D = M({}), q = (n) => {
|
|
|
191
191
|
validate: o.validate
|
|
192
192
|
};
|
|
193
193
|
});
|
|
194
|
-
const
|
|
195
|
-
f?.({ name: o, isDirty:
|
|
194
|
+
const g = (o, i) => {
|
|
195
|
+
f?.({ name: o, isDirty: i }), i && d.dirtyCount === 0 && b?.(!0), !i && d.dirtyCount === 1 && b?.(!1), d.dirtyCount += i ? 1 : -1;
|
|
196
196
|
};
|
|
197
197
|
return {
|
|
198
198
|
submitRef: v,
|
|
@@ -204,20 +204,20 @@ const D = M({}), q = (n) => {
|
|
|
204
204
|
disactivate() {
|
|
205
205
|
d.isActive = !1;
|
|
206
206
|
},
|
|
207
|
-
setError(o,
|
|
208
|
-
const
|
|
209
|
-
|
|
207
|
+
setError(o, i) {
|
|
208
|
+
const u = this.getForm(o);
|
|
209
|
+
u && (u.error = {
|
|
210
210
|
error: !0,
|
|
211
|
-
messages: [
|
|
212
|
-
},
|
|
211
|
+
messages: [i.message]
|
|
212
|
+
}, u.rerender());
|
|
213
213
|
},
|
|
214
214
|
setFocus(o) {
|
|
215
|
-
const u = this.getForm(o);
|
|
216
|
-
u && u.focus && u.focus();
|
|
217
|
-
},
|
|
218
|
-
setValue(o, u) {
|
|
219
215
|
const i = this.getForm(o);
|
|
220
|
-
i && i.
|
|
216
|
+
i && i.focus && i.focus();
|
|
217
|
+
},
|
|
218
|
+
setValue(o, i) {
|
|
219
|
+
const u = this.getForm(o);
|
|
220
|
+
u && u.value !== i && this.onChange(o, i);
|
|
221
221
|
},
|
|
222
222
|
getValues() {
|
|
223
223
|
return T(n, a);
|
|
@@ -226,21 +226,21 @@ const D = M({}), q = (n) => {
|
|
|
226
226
|
if (t)
|
|
227
227
|
return;
|
|
228
228
|
d.isSubmitted = !0;
|
|
229
|
-
let o = !1,
|
|
230
|
-
for (const
|
|
231
|
-
const c = a[
|
|
229
|
+
let o = !1, i = !1;
|
|
230
|
+
for (const u in a) {
|
|
231
|
+
const c = a[u];
|
|
232
232
|
if (c.value !== void 0) {
|
|
233
233
|
const F = c.validate(c.value);
|
|
234
|
-
F && (
|
|
234
|
+
F && (i = !0, c.error = F, c.rerender(), !o && c.focus && (c.focus(), o = !0));
|
|
235
235
|
}
|
|
236
236
|
}
|
|
237
|
-
if (!
|
|
237
|
+
if (!i) {
|
|
238
238
|
if (d.dirtyCount === 0) {
|
|
239
239
|
s?.();
|
|
240
240
|
return;
|
|
241
241
|
}
|
|
242
|
-
const
|
|
243
|
-
await v.onSubmit(
|
|
242
|
+
const u = T(n, a);
|
|
243
|
+
await v.onSubmit(u, {
|
|
244
244
|
setError: (c, F) => {
|
|
245
245
|
const x = this.getForm(c);
|
|
246
246
|
x.error = {
|
|
@@ -251,18 +251,18 @@ const D = M({}), q = (n) => {
|
|
|
251
251
|
});
|
|
252
252
|
}
|
|
253
253
|
},
|
|
254
|
-
reset(o, { asDirty:
|
|
255
|
-
V(n, [], o, (
|
|
254
|
+
reset(o, { asDirty: i }) {
|
|
255
|
+
V(n, [], o, (u, c, F) => {
|
|
256
256
|
if (F === void 0 && a[c].value === void 0)
|
|
257
257
|
return;
|
|
258
258
|
if (l.names[c] && F === void 0) {
|
|
259
259
|
a[c].value = void 0;
|
|
260
260
|
return;
|
|
261
261
|
}
|
|
262
|
-
const x = F ??
|
|
263
|
-
|
|
264
|
-
}),
|
|
265
|
-
|
|
262
|
+
const x = F ?? u.defaultValue;
|
|
263
|
+
i || (a[c].startValue = x, a[c].isDirty = !1), a[c].value !== x && this.onChange(c, x);
|
|
264
|
+
}), i || (d.dirtyCount = 0, d.isSubmitted = !1), l.subscribers.forEach(({ visualizeEvalueatedForms: u }) => {
|
|
265
|
+
u();
|
|
266
266
|
});
|
|
267
267
|
},
|
|
268
268
|
setAsDefault() {
|
|
@@ -270,14 +270,14 @@ const D = M({}), q = (n) => {
|
|
|
270
270
|
a[o].startValue = a[o].value, a[o].isDirty = !1;
|
|
271
271
|
}), d.dirtyCount = 0, d.isSubmitted = !1;
|
|
272
272
|
},
|
|
273
|
-
registry(o,
|
|
274
|
-
return a[o].rerender =
|
|
273
|
+
registry(o, i) {
|
|
274
|
+
return a[o].rerender = i, a[o].value === void 0 && (a[o].value = a[o].defaultValue), {
|
|
275
275
|
unregistry() {
|
|
276
276
|
if (a[o].rerender = () => {
|
|
277
277
|
}, a[o].focus = void 0, d.isActive) {
|
|
278
278
|
a[o].value = void 0;
|
|
279
|
-
const
|
|
280
|
-
a[o].isDirty !==
|
|
279
|
+
const u = !L(a[o].startValue, a[o].defaultValue);
|
|
280
|
+
a[o].isDirty !== u && g(o, u), a[o].isDirty = u;
|
|
281
281
|
}
|
|
282
282
|
}
|
|
283
283
|
};
|
|
@@ -285,26 +285,26 @@ const D = M({}), q = (n) => {
|
|
|
285
285
|
getForm(o) {
|
|
286
286
|
return a[o];
|
|
287
287
|
},
|
|
288
|
-
subscribeToForm(o,
|
|
289
|
-
const
|
|
290
|
-
return c.subscribers.push(
|
|
291
|
-
c.subscribers = c.subscribers.filter((F) => F !==
|
|
288
|
+
subscribeToForm(o, i) {
|
|
289
|
+
const u = { callback: i }, c = this.getForm(o);
|
|
290
|
+
return c.subscribers.push(u), () => {
|
|
291
|
+
c.subscribers = c.subscribers.filter((F) => F !== u);
|
|
292
292
|
};
|
|
293
293
|
},
|
|
294
|
-
registryExtraForm(o,
|
|
295
|
-
const
|
|
294
|
+
registryExtraForm(o, i) {
|
|
295
|
+
const u = { visualizeEvalueatedForms: i };
|
|
296
296
|
return o.forEach((c) => {
|
|
297
297
|
l.names[c] = !0;
|
|
298
|
-
}), l.subscribers.push(
|
|
298
|
+
}), l.subscribers.push(u), {
|
|
299
299
|
unregistry() {
|
|
300
|
-
l.subscribers = l.subscribers.filter((c) => c !==
|
|
300
|
+
l.subscribers = l.subscribers.filter((c) => c !== u);
|
|
301
301
|
}
|
|
302
302
|
};
|
|
303
303
|
},
|
|
304
|
-
onChange(o,
|
|
305
|
-
const
|
|
306
|
-
|
|
307
|
-
F(
|
|
304
|
+
onChange(o, i) {
|
|
305
|
+
const u = this.getForm(o), c = !L(i, u.startValue);
|
|
306
|
+
u.isDirty !== c && g(o, c), u.isDirty = c, m?.({ name: o, value: i }), (u.error || d.isSubmitted) && (u.error = u.validate(i) || null), u.value = i, u.rerender(), u.subscribers.forEach(({ callback: F }) => {
|
|
307
|
+
F(i);
|
|
308
308
|
});
|
|
309
309
|
}
|
|
310
310
|
};
|
|
@@ -332,6 +332,7 @@ const D = M({}), q = (n) => {
|
|
|
332
332
|
setValue: (t, f) => {
|
|
333
333
|
s.setValue(t, f);
|
|
334
334
|
},
|
|
335
|
+
getValue: (t) => s.getForm(t).value,
|
|
335
336
|
getValues: () => s.getValues(),
|
|
336
337
|
handleSubmit: async () => {
|
|
337
338
|
await s.handleSubmit();
|
|
@@ -358,7 +359,7 @@ const D = M({}), q = (n) => {
|
|
|
358
359
|
};
|
|
359
360
|
}
|
|
360
361
|
}, X = (n) => (e, r) => {
|
|
361
|
-
const s = n.getRequireCheck(r), { $rules: t = {}, ...f } = r, { validate:
|
|
362
|
+
const s = n.getRequireCheck(r), { $rules: t = {}, ...f } = r, { validate: b, required: m } = t;
|
|
362
363
|
return {
|
|
363
364
|
type: "form",
|
|
364
365
|
name: e,
|
|
@@ -369,15 +370,15 @@ const D = M({}), q = (n) => {
|
|
|
369
370
|
const v = $(() => s(y));
|
|
370
371
|
if (v)
|
|
371
372
|
return v;
|
|
372
|
-
if (
|
|
373
|
-
const d = $(() =>
|
|
373
|
+
if (b) {
|
|
374
|
+
const d = $(() => b(y));
|
|
374
375
|
if (d)
|
|
375
376
|
return d;
|
|
376
377
|
}
|
|
377
378
|
return;
|
|
378
379
|
}
|
|
379
|
-
if (
|
|
380
|
-
const d = $(() =>
|
|
380
|
+
if (b && !$(() => s(y))) {
|
|
381
|
+
const d = $(() => b(y));
|
|
381
382
|
if (d)
|
|
382
383
|
return d;
|
|
383
384
|
}
|
package/dist/useForm.d.ts
CHANGED
|
@@ -45,6 +45,7 @@ declare const useDynamicForm: (scheme: SchemeItems.All[], opts: MainOptions<Fiel
|
|
|
45
45
|
message: string;
|
|
46
46
|
}) => void;
|
|
47
47
|
setValue: <K extends string>(name: K, value: any) => void;
|
|
48
|
+
getValue: <K extends string>(name: K) => any;
|
|
48
49
|
getValues: () => {
|
|
49
50
|
[x: string]: any;
|
|
50
51
|
};
|
|
@@ -61,6 +62,7 @@ declare const useForm: <Items extends SchemeItems.All[], Values extends ExtractV
|
|
|
61
62
|
message: string;
|
|
62
63
|
}) => void;
|
|
63
64
|
setValue: <K extends keyof FlattenValues>(name: K, value: FlattenValues[K]) => void;
|
|
65
|
+
getValue: <K extends keyof FlattenValues>(name: K & string) => FlattenValues[K];
|
|
64
66
|
getValues: () => DeepPartial<Cloned>;
|
|
65
67
|
handleSubmit: () => Promise<void>;
|
|
66
68
|
subscribe: <K extends keyof FlattenValues>(name: K & string, callback: (value: FlattenValues[K]) => void) => () => void;
|
package/package.json
CHANGED