@vanstack/solid-ark 0.0.37 → 0.0.38

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.
@@ -1,658 +0,0 @@
1
- import "./solid-ark.css";
2
- import { Index as e, className as t, createComponent as n, delegateEvents as r, effect as i, insert as a, memo as o, setAttribute as s, style as c, template as l } from "solid-js/web";
3
- import { For as u, Show as d, Suspense as f, createEffect as p, createMemo as m, createSignal as h, createUniqueId as g, lazy as _, mergeProps as ee, on as v, onCleanup as y } from "solid-js";
4
- import { Field as b } from "@ark-ui/solid/field";
5
- import { createForm as x } from "@tanstack/solid-form";
6
- import { Checkbox as S } from "@ark-ui/solid/checkbox";
7
- import { RadioGroup as C } from "@ark-ui/solid/radio-group";
8
- import { Switch as w } from "@ark-ui/solid/switch";
9
- import { deepEqual as T } from "fast-equals";
10
- //#region src/form/components/FieldSkeleton.tsx
11
- var E = /*#__PURE__*/ l("<div aria-hidden=true class=van-form-field-skeleton>");
12
- function D() {
13
- return E();
14
- }
15
- //#endregion
16
- //#region src/form/components/FormCheckbox.tsx
17
- var O = /*#__PURE__*/ l("<svg class=van-form-check-icon fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=3 viewBox=\"0 0 24 24\"><path d=\"M5 12l5 5l10 -10\">");
18
- function k(e) {
19
- return n(S.Root, {
20
- get checked() {
21
- return e.value ?? !1;
22
- },
23
- class: "van-form-checkbox-root",
24
- get id() {
25
- return e.controlId;
26
- },
27
- onCheckedChange: (t) => e.onChange(t.checked === !0),
28
- get children() {
29
- return [
30
- n(S.Control, {
31
- class: "van-form-checkbox-control",
32
- get children() {
33
- return n(S.Indicator, {
34
- class: "van-form-checkbox-indicator",
35
- get children() {
36
- return O();
37
- }
38
- });
39
- }
40
- }),
41
- o(() => o(() => !!e.label)() && n(S.Label, {
42
- class: "van-form-checkbox-label",
43
- get children() {
44
- return e.label;
45
- }
46
- })),
47
- n(S.HiddenInput, {})
48
- ];
49
- }
50
- });
51
- }
52
- //#endregion
53
- //#region src/form/components/FormCheckboxGroup.tsx
54
- var A = /*#__PURE__*/ l("<svg class=van-form-check-icon fill=none stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=3 viewBox=\"0 0 24 24\"><path d=\"M5 12l5 5l10 -10\">");
55
- function te(t) {
56
- return n(S.Group, {
57
- class: "van-form-checkbox-group",
58
- get id() {
59
- return t.controlId;
60
- },
61
- onValueChange: (e) => t.onChange(e),
62
- value: () => Array.isArray(t.value) ? t.value : [],
63
- get children() {
64
- return n(e, {
65
- get each() {
66
- return t.field.options;
67
- },
68
- children: (e) => n(S.Root, {
69
- class: "van-form-checkbox-root",
70
- get id() {
71
- return `${t.controlId}-item-${e().value}`;
72
- },
73
- get ids() {
74
- return {
75
- hiddenInput: `${t.controlId}-${e().value}`,
76
- label: `${t.controlId}-${e().value}-label`
77
- };
78
- },
79
- get value() {
80
- return e().value;
81
- },
82
- get children() {
83
- return [
84
- n(S.Control, {
85
- class: "van-form-checkbox-control",
86
- get children() {
87
- return n(S.Indicator, {
88
- class: "van-form-checkbox-indicator",
89
- get children() {
90
- return A();
91
- }
92
- });
93
- }
94
- }),
95
- n(S.Label, {
96
- class: "van-form-checkbox-label",
97
- get children() {
98
- return e().label;
99
- }
100
- }),
101
- n(S.HiddenInput, {})
102
- ];
103
- }
104
- })
105
- });
106
- }
107
- });
108
- }
109
- //#endregion
110
- //#region src/form/components/useDebouncedValue.ts
111
- function j(e) {
112
- let [t, n] = h(e.value() ?? ""), r, i = (t) => {
113
- if (n(t), (e.debounce ?? 0) > 0) {
114
- clearTimeout(r), r = setTimeout(() => {
115
- r = void 0, e.onChange(t);
116
- }, e.debounce);
117
- return;
118
- }
119
- e.onChange(t);
120
- }, a = () => {
121
- r !== void 0 && (clearTimeout(r), r = void 0, t() !== e.value() && e.onChange(t()));
122
- };
123
- return p(v(() => e.value(), (e) => n(e ?? ""))), y(() => clearTimeout(r)), {
124
- local: t,
125
- handleInput: i,
126
- handleBlur: () => {
127
- a(), e.onBlur();
128
- },
129
- handleClear: () => {
130
- clearTimeout(r), r = void 0, n(""), e.onChange("");
131
- }
132
- };
133
- }
134
- //#endregion
135
- //#region src/form/components/FormInput.tsx
136
- var ne = /*#__PURE__*/ l("<svg fill=none height=14 stroke=currentColor stroke-linecap=round stroke-linejoin=round stroke-width=2 viewBox=\"0 0 24 24\"width=14 xmlns=http://www.w3.org/2000/svg><path d=\"M18 6 6 18\"></path><path d=\"m6 6 12 12\">"), re = /*#__PURE__*/ l("<button aria-label=清空 type=button>"), ie = /*#__PURE__*/ l("<div class=van-form-input-group>"), M = /*#__PURE__*/ l("<span class=\"van-form-input-addon van-form-input-addon-prefix\">"), N = /*#__PURE__*/ l("<span class=\"van-form-input-addon van-form-input-addon-suffix\">");
137
- function P() {
138
- return ne();
139
- }
140
- function F(e) {
141
- let { local: r, handleInput: s, handleBlur: c, handleClear: l } = j({
142
- value: () => e.value,
143
- debounce: e.field.debounce,
144
- onChange: e.onChange,
145
- onBlur: e.onBlur
146
- }), u, f = n(b.Input, {
147
- get autocomplete() {
148
- return e.field.autocomplete;
149
- },
150
- class: "van-form-input",
151
- onBlur: c,
152
- onInput: (e) => s(e.currentTarget.value),
153
- get placeholder() {
154
- return e.field.placeholder;
155
- },
156
- ref: (e) => {
157
- u = e;
158
- },
159
- get type() {
160
- return e.field.type ?? "text";
161
- },
162
- get value() {
163
- return r();
164
- }
165
- }), p = e.field.prefix !== void 0 || e.field.suffix !== void 0, m = e.field.clearable === !0;
166
- return !p && !m ? f : (() => {
167
- var s = ie();
168
- return a(s, (() => {
169
- var t = o(() => e.field.prefix !== void 0);
170
- return () => t() && (() => {
171
- var t = M();
172
- return a(t, () => e.field.prefix), t;
173
- })();
174
- })(), null), a(s, f, null), a(s, n(d, {
175
- get when() {
176
- return m && r() !== "";
177
- },
178
- get children() {
179
- var r = re();
180
- return r.$$click = () => {
181
- l(), u?.focus();
182
- }, a(r, n(P, {})), i(() => t(r, `van-form-input-clear${e.field.suffix === void 0 ? "" : " van-form-input-clear-before-suffix"}`)), r;
183
- }
184
- }), null), a(s, (() => {
185
- var t = o(() => e.field.suffix !== void 0);
186
- return () => t() && (() => {
187
- var t = N();
188
- return a(t, () => e.field.suffix), t;
189
- })();
190
- })(), null), s;
191
- })();
192
- }
193
- r(["click"]);
194
- //#endregion
195
- //#region src/form/components/FormRadio.tsx
196
- function I(t) {
197
- let r = m(() => t.field.options.map((e) => e.value));
198
- return n(C.Root, {
199
- class: "van-form-radio-group",
200
- get id() {
201
- return t.controlId;
202
- },
203
- ids: { itemHiddenInput: (e) => e === t.field.options[0]?.value ? t.controlId : `radio-${t.controlId}-${e}` },
204
- onValueChange: (e) => t.onChange(e.value ?? ""),
205
- get value() {
206
- return t.value ?? "";
207
- },
208
- get children() {
209
- return n(e, {
210
- get each() {
211
- return r();
212
- },
213
- children: (e) => {
214
- let r = t.field.options.find((t) => t.value === e());
215
- return n(C.Item, {
216
- class: "van-form-radio-item",
217
- get value() {
218
- return e();
219
- },
220
- get children() {
221
- return [
222
- n(C.ItemControl, { class: "van-form-radio-control" }),
223
- n(C.ItemText, {
224
- class: "van-form-radio-text",
225
- get children() {
226
- return r?.label ?? e();
227
- }
228
- }),
229
- n(C.ItemHiddenInput, {})
230
- ];
231
- }
232
- });
233
- }
234
- });
235
- }
236
- });
237
- }
238
- //#endregion
239
- //#region src/form/components/FormSwitch.tsx
240
- function L(e) {
241
- return n(w.Root, {
242
- get checked() {
243
- return e.value ?? !1;
244
- },
245
- class: "van-form-switch-root",
246
- get id() {
247
- return e.controlId;
248
- },
249
- onCheckedChange: (t) => e.onChange(t.checked),
250
- get children() {
251
- return [
252
- n(w.Control, {
253
- class: "van-form-switch-control",
254
- get children() {
255
- return n(w.Thumb, { class: "van-form-switch-thumb" });
256
- }
257
- }),
258
- o(() => o(() => !!e.label)() && n(w.Label, {
259
- class: "van-form-switch-label",
260
- get children() {
261
- return e.label;
262
- }
263
- })),
264
- n(w.HiddenInput, {})
265
- ];
266
- }
267
- });
268
- }
269
- //#endregion
270
- //#region src/form/components/FormTextarea.tsx
271
- function R(e) {
272
- let { local: t, handleInput: r, handleBlur: i } = j({
273
- value: () => e.value,
274
- debounce: e.field.debounce,
275
- onChange: e.onChange,
276
- onBlur: e.onBlur
277
- });
278
- return n(b.Textarea, {
279
- class: "van-form-textarea",
280
- onBlur: i,
281
- onInput: (e) => r(e.currentTarget.value),
282
- get placeholder() {
283
- return e.field.placeholder;
284
- },
285
- get rows() {
286
- return e.field.rows ?? 4;
287
- },
288
- get value() {
289
- return t();
290
- }
291
- });
292
- }
293
- //#endregion
294
- //#region src/form/components/utils.ts
295
- function z(e, t) {
296
- return e.fieldType === t;
297
- }
298
- function B(e) {
299
- if (e != null) return typeof e == "number" ? `${e}px` : e;
300
- }
301
- function V(e) {
302
- return ({ value: t }) => t == null || t === "" || Array.isArray(t) && t.length === 0 ? `${e ?? ""}必填` : void 0;
303
- }
304
- //#endregion
305
- //#region src/form/components/FieldRenderer.tsx
306
- var H = _(() => import("./FormDatePicker-Cazd9kkD.js").then((e) => ({ default: e.FormDatePicker }))), U = _(() => import("./FormSelect-BDZATc3u.js").then((e) => ({ default: e.FormSelect })));
307
- function W(e) {
308
- return z(e.field, "input") ? n(F, {
309
- get field() {
310
- return e.field;
311
- },
312
- get onBlur() {
313
- return e.onBlur;
314
- },
315
- onChange: (t) => e.onChange(t),
316
- get value() {
317
- return e.value;
318
- }
319
- }) : z(e.field, "textarea") ? n(R, {
320
- get field() {
321
- return e.field;
322
- },
323
- get onBlur() {
324
- return e.onBlur;
325
- },
326
- onChange: (t) => e.onChange(t),
327
- get value() {
328
- return e.value;
329
- }
330
- }) : z(e.field, "select") ? n(f, {
331
- get fallback() {
332
- return n(D, {});
333
- },
334
- get children() {
335
- return n(U, {
336
- get controlId() {
337
- return e.controlId;
338
- },
339
- get field() {
340
- return e.field;
341
- },
342
- get onBlur() {
343
- return e.onBlur;
344
- },
345
- onChange: (t) => e.onChange(t),
346
- get value() {
347
- return e.value;
348
- }
349
- });
350
- }
351
- }) : z(e.field, "datePicker") ? n(f, {
352
- get fallback() {
353
- return n(D, {});
354
- },
355
- get children() {
356
- return n(H, {
357
- get controlId() {
358
- return e.controlId;
359
- },
360
- get field() {
361
- return e.field;
362
- },
363
- get onBlur() {
364
- return e.onBlur;
365
- },
366
- onChange: (t) => e.onChange(t),
367
- get value() {
368
- return e.value;
369
- }
370
- });
371
- }
372
- }) : z(e.field, "checkbox") ? n(k, {
373
- get controlId() {
374
- return e.controlId;
375
- },
376
- get label() {
377
- return e.field.label;
378
- },
379
- onChange: (t) => e.onChange(t),
380
- get value() {
381
- return e.value;
382
- }
383
- }) : z(e.field, "switch") ? n(L, {
384
- get controlId() {
385
- return e.controlId;
386
- },
387
- get label() {
388
- return e.field.label;
389
- },
390
- onChange: (t) => e.onChange(t),
391
- get value() {
392
- return e.value;
393
- }
394
- }) : z(e.field, "radio") ? n(I, {
395
- get controlId() {
396
- return e.controlId;
397
- },
398
- get field() {
399
- return e.field;
400
- },
401
- onChange: (t) => e.onChange(t),
402
- get value() {
403
- return e.value;
404
- }
405
- }) : z(e.field, "checkbox-group") ? n(te, {
406
- get controlId() {
407
- return e.controlId;
408
- },
409
- get field() {
410
- return e.field;
411
- },
412
- onChange: (t) => e.onChange(t),
413
- get value() {
414
- return e.value;
415
- }
416
- }) : null;
417
- }
418
- //#endregion
419
- //#region src/form/patch.ts
420
- function G(e) {
421
- return q(e) || e === "" ? void 0 : Number(e);
422
- }
423
- function K(e) {
424
- return q(e) || e === "" ? 0 : Number(e);
425
- }
426
- function q(e) {
427
- return e == null;
428
- }
429
- function J(e) {
430
- return Array.isArray(e) ? [...e].sort() : [];
431
- }
432
- function Y(e) {
433
- return e && typeof e == "object" && !Array.isArray(e) ? e : {};
434
- }
435
- function X(e) {
436
- return typeof e == "object" && !!e && !Array.isArray(e);
437
- }
438
- function ae(e, t, n) {
439
- let r = {};
440
- for (let i of n) {
441
- let { name: n, valueType: a } = i, o = e[n], s = t[n], c;
442
- c = a === "number" ? T(G(o), G(s)) : Array.isArray(o) || Array.isArray(s) ? T(J(o), J(s)) : X(o) || X(s) ? T(Y(o), Y(s)) : T(q(o) ? "" : o, q(s) ? "" : s), c || (r[n] = a === "number" ? K(s) : s);
443
- }
444
- return {
445
- patch: r,
446
- changed: Object.keys(r).length > 0
447
- };
448
- }
449
- //#endregion
450
- //#region src/form/Form.tsx
451
- var oe = /*#__PURE__*/ l("<form>"), se = /*#__PURE__*/ l("<div class=van-form-field><div class=van-form-loading-wrap>"), ce = /*#__PURE__*/ l("<span aria-hidden=true class=van-form-required>*"), Z = /*#__PURE__*/ l("<div class=van-form-loading-wrap>");
452
- function Q(e) {
453
- return typeof e == "string" ? e : e && typeof e == "object" && "message" in e ? String(e.message) : String(e);
454
- }
455
- function le(e) {
456
- let t = e.required === !0 && !e.rule ? V(e.label) : e.rule;
457
- if (t) return {
458
- onChange: typeof t == "function" ? (e) => t({
459
- value: e.value,
460
- getValue: (t) => e.fieldApi.form.getFieldValue(t)
461
- }) : t,
462
- ...e.validateListenTo?.length ? { onChangeListenTo: e.validateListenTo } : {}
463
- };
464
- }
465
- function $(e, t) {
466
- return typeof e.show == "function" ? e.show(t) : e.show !== !1;
467
- }
468
- function ue(e, t) {
469
- let n = new Set(t.filter((t) => !$(t, e)).map((e) => e.name));
470
- return Object.fromEntries(Object.entries(e).filter(([e]) => !n.has(e)));
471
- }
472
- function de(e, t) {
473
- return e.filter((e) => $(e, t));
474
- }
475
- function fe(e) {
476
- let r = ee({ values: {} }, e), l = r.values, f = g(), h = (e) => `${f}-${e}`, _ = (e) => {
477
- let t = ue(e, r.fields);
478
- if (r.patch) {
479
- let { patch: n, changed: i } = ae(l, t, de(r.fields, e));
480
- return {
481
- values: t,
482
- patch: n,
483
- changed: i
484
- };
485
- }
486
- return { values: t };
487
- }, y = x(() => ({
488
- defaultValues: l,
489
- onSubmit: async ({ value: e }) => {
490
- let { values: t, patch: n, changed: i } = _(e);
491
- await r.onSubmit?.(n === void 0 ? { value: t } : {
492
- value: t,
493
- patch: n,
494
- changed: i
495
- });
496
- },
497
- onSubmitInvalid: ({ value: e, formApi: t }) => {
498
- if (!r.onSubmitInvalid) return;
499
- let n = {}, i = t.state.fieldMeta;
500
- for (let [e, t] of Object.entries(i)) {
501
- let r = (t?.errors ?? []).map(Q).filter(Boolean);
502
- r.length > 0 && (n[e] = r);
503
- }
504
- r.onSubmitInvalid({
505
- value: e,
506
- errors: n
507
- });
508
- }
509
- }));
510
- r.ref?.({
511
- validate: async () => (await y.validateAllFields("change"), y.state.canSubmit),
512
- validateAndGetFieldValues: async () => (await y.validateAllFields("change"), y.state.canSubmit ? _(y.state.values) : !1),
513
- reset: () => y.reset(),
514
- getFieldValues: () => _(y.state.values),
515
- setFieldValues: (e) => {
516
- for (let [t, n] of Object.entries(e)) y.setFieldValue(t, n);
517
- },
518
- getFieldValue: (e) => y.getFieldValue(e),
519
- setFieldValue: (e, t) => y.setFieldValue(e, t)
520
- });
521
- let S = y.useStore((e) => e.values), C = m(() => r.fields.filter((e) => !e.hidden && $(e, S()))), w = y.useStore((e) => e.isSubmitting), T = y.useStore((e) => e.values), E = y.setFieldValue;
522
- return p(v(() => r.values, (e) => {
523
- for (let [t, n] of Object.entries(e ?? {})) y.state.values[t] !== n && E(t, n);
524
- }, { defer: !0 })), p(v(T, (e) => r.onValuesChange?.(e), { defer: !0 })), (() => {
525
- var e = oe();
526
- return e.addEventListener("submit", (e) => {
527
- e.preventDefault(), e.stopPropagation(), y.handleSubmit();
528
- }), a(e, n(u, {
529
- get each() {
530
- return C();
531
- },
532
- children: (e) => n(y.Field, {
533
- get name() {
534
- return e.name;
535
- },
536
- get validators() {
537
- return le(e);
538
- },
539
- children: (t) => {
540
- let l = t(), f = m(() => (t().state.meta.errors ?? []).map(Q).filter(Boolean)), p = m(() => t().state.value), g = B(e.fieldWidth), _ = g ? { width: g } : void 0;
541
- return e.control ? (() => {
542
- var t = se(), n = t.firstChild;
543
- return a(n, () => e.control({
544
- value: p,
545
- onChange: (e) => l.handleChange(e),
546
- onBlur: () => l.handleBlur(),
547
- error: f,
548
- id: h(e.name)
549
- })), i((e) => {
550
- var i = _, a = r.loading ? "" : void 0, o = r.loading || void 0;
551
- return e.e = c(t, i, e.e), a !== e.t && s(n, "data-loading", e.t = a), o !== e.a && (n.inert = e.a = o), e;
552
- }, {
553
- e: void 0,
554
- t: void 0,
555
- a: void 0
556
- }), t;
557
- })() : n(b.Root, {
558
- class: "van-form-field",
559
- get id() {
560
- return h(e.name);
561
- },
562
- get invalid() {
563
- return f().length > 0;
564
- },
565
- style: _,
566
- get children() {
567
- return [
568
- n(d, {
569
- get when() {
570
- return o(() => !!(e.label && e.fieldType !== "checkbox" && e.fieldType !== "checkbox-group"))() && e.fieldType !== "switch";
571
- },
572
- get children() {
573
- return n(b.Label, {
574
- class: "van-form-label",
575
- get children() {
576
- return [n(d, {
577
- get when() {
578
- return e.required === !0;
579
- },
580
- get children() {
581
- return ce();
582
- }
583
- }), o(() => o(() => !!e.renderLabel)() ? e.renderLabel(e.label) : e.label)];
584
- }
585
- });
586
- }
587
- }),
588
- (() => {
589
- var t = Z();
590
- return a(t, n(W, {
591
- get controlId() {
592
- return h(e.name);
593
- },
594
- field: e,
595
- onBlur: () => l.handleBlur(),
596
- onChange: (e) => l.handleChange(e),
597
- get value() {
598
- return p();
599
- }
600
- })), i((e) => {
601
- var n = r.loading ? "" : void 0, i = r.loading || void 0;
602
- return n !== e.e && s(t, "data-loading", e.e = n), i !== e.t && (t.inert = e.t = i), e;
603
- }, {
604
- e: void 0,
605
- t: void 0
606
- }), t;
607
- })(),
608
- n(d, {
609
- get when() {
610
- return e.helperText;
611
- },
612
- get children() {
613
- return n(b.HelperText, {
614
- class: "van-form-helper",
615
- get children() {
616
- return e.helperText;
617
- }
618
- });
619
- }
620
- }),
621
- n(d, {
622
- get when() {
623
- return f().length > 0;
624
- },
625
- get children() {
626
- return o(() => !!e.renderError)() ? n(b.ErrorText, {
627
- class: "van-form-error",
628
- get children() {
629
- return e.renderError(f());
630
- }
631
- }) : n(u, {
632
- get each() {
633
- return f();
634
- },
635
- children: (e) => n(b.ErrorText, {
636
- class: "van-form-error",
637
- children: e
638
- })
639
- });
640
- }
641
- })
642
- ];
643
- }
644
- });
645
- }
646
- })
647
- }), null), a(e, () => r.children?.({ isSubmitting: w() }), null), i((n) => {
648
- var i = r.loading ?? !1, a = `van-form-form ${r.className ?? ""}`, o = r.size ?? "default";
649
- return i !== n.e && s(e, "aria-busy", n.e = i), a !== n.t && t(e, n.t = a), o !== n.a && s(e, "data-size", n.a = o), n;
650
- }, {
651
- e: void 0,
652
- t: void 0,
653
- a: void 0
654
- }), e;
655
- })();
656
- }
657
- //#endregion
658
- export { fe as t };