remix-validated-form 4.6.5 → 4.6.6
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/README.md +10 -9
- package/dist/index.cjs.js +1928 -0
- package/dist/index.cjs.js.map +1 -0
- package/dist/index.d.ts +337 -0
- package/dist/{remix-validated-form.es.js → index.esm.js} +573 -877
- package/dist/index.esm.js.map +1 -0
- package/package.json +12 -10
- package/src/ValidatedForm.tsx +17 -5
- package/src/hooks.ts +1 -1
- package/src/server.ts +1 -1
- package/tsup.config.ts +3 -0
- package/dist/remix-validated-form.cjs.js +0 -27
- package/dist/remix-validated-form.cjs.js.map +0 -1
- package/dist/remix-validated-form.es.js.map +0 -1
- package/dist/remix-validated-form.umd.js +0 -27
- package/dist/remix-validated-form.umd.js.map +0 -1
- package/dist/types/ValidatedForm.d.ts +0 -50
- package/dist/types/hooks.d.ts +0 -67
- package/dist/types/index.d.ts +0 -7
- package/dist/types/internal/MultiValueMap.d.ts +0 -11
- package/dist/types/internal/constants.d.ts +0 -3
- package/dist/types/internal/flatten.d.ts +0 -1
- package/dist/types/internal/formContext.d.ts +0 -12
- package/dist/types/internal/getInputProps.d.ts +0 -29
- package/dist/types/internal/hooks.d.ts +0 -35
- package/dist/types/internal/hydratable.d.ts +0 -14
- package/dist/types/internal/logic/getCheckboxChecked.d.ts +0 -1
- package/dist/types/internal/logic/getRadioChecked.d.ts +0 -1
- package/dist/types/internal/logic/requestSubmit.d.ts +0 -5
- package/dist/types/internal/state/arrayUtil.d.ts +0 -12
- package/dist/types/internal/state/controlledFields.d.ts +0 -7
- package/dist/types/internal/state/createFormStore.d.ts +0 -79
- package/dist/types/internal/state/fieldArray.d.ts +0 -28
- package/dist/types/internal/state/storeHooks.d.ts +0 -3
- package/dist/types/internal/state/types.d.ts +0 -1
- package/dist/types/internal/submissionCallbacks.d.ts +0 -1
- package/dist/types/internal/util.d.ts +0 -5
- package/dist/types/server.d.ts +0 -21
- package/dist/types/unreleased/formStateHooks.d.ts +0 -64
- package/dist/types/userFacingFormContext.d.ts +0 -85
- package/dist/types/validation/createValidator.d.ts +0 -7
- package/dist/types/validation/types.d.ts +0 -58
- package/vite.config.ts +0 -7
@@ -1,177 +1,11 @@
|
|
1
|
-
|
2
|
-
import {
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
ar[i2] = from2[i2];
|
10
|
-
}
|
11
|
-
}
|
12
|
-
return to.concat(ar || Array.prototype.slice.call(from2));
|
13
|
-
};
|
14
|
-
function purry(fn2, args, lazy) {
|
15
|
-
var diff = fn2.length - args.length;
|
16
|
-
var arrayArgs = Array.from(args);
|
17
|
-
if (diff === 0) {
|
18
|
-
return fn2.apply(void 0, arrayArgs);
|
19
|
-
}
|
20
|
-
if (diff === 1) {
|
21
|
-
var ret = function(data) {
|
22
|
-
return fn2.apply(void 0, __spreadArray([data], arrayArgs, false));
|
23
|
-
};
|
24
|
-
if (lazy || fn2.lazy) {
|
25
|
-
ret.lazy = lazy || fn2.lazy;
|
26
|
-
ret.lazyArgs = args;
|
27
|
-
}
|
28
|
-
return ret;
|
29
|
-
}
|
30
|
-
throw new Error("Wrong number of arguments");
|
31
|
-
}
|
32
|
-
function _reduceLazy(array, lazy, indexed) {
|
33
|
-
return array.reduce(function(acc, item, index) {
|
34
|
-
var result = indexed ? lazy(item, index, array) : lazy(item);
|
35
|
-
if (result.hasMany === true) {
|
36
|
-
acc.push.apply(acc, result.next);
|
37
|
-
} else if (result.hasNext === true) {
|
38
|
-
acc.push(result.next);
|
39
|
-
}
|
40
|
-
return acc;
|
41
|
-
}, []);
|
42
|
-
}
|
43
|
-
var isArray = Array.isArray;
|
44
|
-
var keyList = Object.keys;
|
45
|
-
var hasProp = Object.prototype.hasOwnProperty;
|
46
|
-
function equals() {
|
47
|
-
return purry(_equals, arguments);
|
48
|
-
}
|
49
|
-
function _equals(a2, b2) {
|
50
|
-
if (a2 === b2) {
|
51
|
-
return true;
|
52
|
-
}
|
53
|
-
if (a2 && b2 && typeof a2 === "object" && typeof b2 === "object") {
|
54
|
-
var arrA = isArray(a2);
|
55
|
-
var arrB = isArray(b2);
|
56
|
-
var i2 = void 0;
|
57
|
-
var length = void 0;
|
58
|
-
var key = void 0;
|
59
|
-
if (arrA && arrB) {
|
60
|
-
length = a2.length;
|
61
|
-
if (length !== b2.length) {
|
62
|
-
return false;
|
63
|
-
}
|
64
|
-
for (i2 = length; i2-- !== 0; ) {
|
65
|
-
if (!equals(a2[i2], b2[i2])) {
|
66
|
-
return false;
|
67
|
-
}
|
68
|
-
}
|
69
|
-
return true;
|
70
|
-
}
|
71
|
-
if (arrA !== arrB) {
|
72
|
-
return false;
|
73
|
-
}
|
74
|
-
var dateA = a2 instanceof Date;
|
75
|
-
var dateB = b2 instanceof Date;
|
76
|
-
if (dateA !== dateB) {
|
77
|
-
return false;
|
78
|
-
}
|
79
|
-
if (dateA && dateB) {
|
80
|
-
return a2.getTime() === b2.getTime();
|
81
|
-
}
|
82
|
-
var regexpA = a2 instanceof RegExp;
|
83
|
-
var regexpB = b2 instanceof RegExp;
|
84
|
-
if (regexpA !== regexpB) {
|
85
|
-
return false;
|
86
|
-
}
|
87
|
-
if (regexpA && regexpB) {
|
88
|
-
return a2.toString() === b2.toString();
|
89
|
-
}
|
90
|
-
var keys = keyList(a2);
|
91
|
-
length = keys.length;
|
92
|
-
if (length !== keyList(b2).length) {
|
93
|
-
return false;
|
94
|
-
}
|
95
|
-
for (i2 = length; i2-- !== 0; ) {
|
96
|
-
if (!hasProp.call(b2, keys[i2])) {
|
97
|
-
return false;
|
98
|
-
}
|
99
|
-
}
|
100
|
-
for (i2 = length; i2-- !== 0; ) {
|
101
|
-
key = keys[i2];
|
102
|
-
if (!equals(a2[key], b2[key])) {
|
103
|
-
return false;
|
104
|
-
}
|
105
|
-
}
|
106
|
-
return true;
|
107
|
-
}
|
108
|
-
return a2 !== a2 && b2 !== b2;
|
109
|
-
}
|
110
|
-
function omit() {
|
111
|
-
return purry(_omit, arguments);
|
112
|
-
}
|
113
|
-
function _omit(object, names) {
|
114
|
-
var set = new Set(names);
|
115
|
-
return Object.entries(object).reduce(function(acc, _a) {
|
116
|
-
var name = _a[0], value = _a[1];
|
117
|
-
if (!set.has(name)) {
|
118
|
-
acc[name] = value;
|
119
|
-
}
|
120
|
-
return acc;
|
121
|
-
}, {});
|
122
|
-
}
|
123
|
-
function omitBy() {
|
124
|
-
return purry(_omitBy, arguments);
|
125
|
-
}
|
126
|
-
function _omitBy(object, fn2) {
|
127
|
-
return Object.keys(object).reduce(function(acc, key) {
|
128
|
-
if (!fn2(object[key], key)) {
|
129
|
-
acc[key] = object[key];
|
130
|
-
}
|
131
|
-
return acc;
|
132
|
-
}, {});
|
133
|
-
}
|
134
|
-
function pathOr() {
|
135
|
-
return purry(_pathOr, arguments);
|
136
|
-
}
|
137
|
-
function _pathOr(object, path, defaultValue) {
|
138
|
-
var current = object;
|
139
|
-
for (var _i = 0, path_1 = path; _i < path_1.length; _i++) {
|
140
|
-
var prop = path_1[_i];
|
141
|
-
if (current == null || current[prop] == null) {
|
142
|
-
return defaultValue;
|
143
|
-
}
|
144
|
-
current = current[prop];
|
145
|
-
}
|
146
|
-
return current;
|
147
|
-
}
|
148
|
-
function uniq() {
|
149
|
-
return purry(_uniq, arguments, uniq.lazy);
|
150
|
-
}
|
151
|
-
function _uniq(array) {
|
152
|
-
return _reduceLazy(array, uniq.lazy());
|
153
|
-
}
|
154
|
-
(function(uniq2) {
|
155
|
-
function lazy() {
|
156
|
-
var set = /* @__PURE__ */ new Set();
|
157
|
-
return function(value) {
|
158
|
-
if (set.has(value)) {
|
159
|
-
return {
|
160
|
-
done: false,
|
161
|
-
hasNext: false
|
162
|
-
};
|
163
|
-
}
|
164
|
-
set.add(value);
|
165
|
-
return {
|
166
|
-
done: false,
|
167
|
-
hasNext: true,
|
168
|
-
next: value
|
169
|
-
};
|
170
|
-
};
|
171
|
-
}
|
172
|
-
uniq2.lazy = lazy;
|
173
|
-
})(uniq || (uniq = {}));
|
174
|
-
const getCheckboxChecked = (checkboxValue = "on", newValue) => {
|
1
|
+
// src/hooks.ts
|
2
|
+
import { useEffect as useEffect2, useMemo } from "react";
|
3
|
+
|
4
|
+
// src/internal/getInputProps.ts
|
5
|
+
import * as R from "remeda";
|
6
|
+
|
7
|
+
// src/internal/logic/getCheckboxChecked.ts
|
8
|
+
var getCheckboxChecked = (checkboxValue = "on", newValue) => {
|
175
9
|
if (Array.isArray(newValue))
|
176
10
|
return newValue.some((val) => val === true || val === checkboxValue);
|
177
11
|
if (typeof newValue === "boolean")
|
@@ -180,17 +14,31 @@ const getCheckboxChecked = (checkboxValue = "on", newValue) => {
|
|
180
14
|
return newValue === checkboxValue;
|
181
15
|
return void 0;
|
182
16
|
};
|
183
|
-
|
17
|
+
|
18
|
+
// src/internal/logic/getRadioChecked.ts
|
19
|
+
var getRadioChecked = (radioValue = "on", newValue) => {
|
184
20
|
if (typeof newValue === "string")
|
185
21
|
return newValue === radioValue;
|
186
22
|
return void 0;
|
187
23
|
};
|
188
|
-
|
24
|
+
if (void 0) {
|
25
|
+
const { it, expect } = void 0;
|
26
|
+
it("getRadioChecked", () => {
|
27
|
+
expect(getRadioChecked("on", "on")).toBe(true);
|
28
|
+
expect(getRadioChecked("on", void 0)).toBe(void 0);
|
29
|
+
expect(getRadioChecked("trueValue", void 0)).toBe(void 0);
|
30
|
+
expect(getRadioChecked("trueValue", "bob")).toBe(false);
|
31
|
+
expect(getRadioChecked("trueValue", "trueValue")).toBe(true);
|
32
|
+
});
|
33
|
+
}
|
34
|
+
|
35
|
+
// src/internal/getInputProps.ts
|
36
|
+
var defaultValidationBehavior = {
|
189
37
|
initial: "onBlur",
|
190
38
|
whenTouched: "onChange",
|
191
39
|
whenSubmitted: "onChange"
|
192
40
|
};
|
193
|
-
|
41
|
+
var createGetInputProps = ({
|
194
42
|
clearError,
|
195
43
|
validate,
|
196
44
|
defaultValue,
|
@@ -232,19 +80,27 @@ const createGetInputProps = ({
|
|
232
80
|
} else if (props.value === void 0) {
|
233
81
|
inputProps.defaultValue = defaultValue;
|
234
82
|
}
|
235
|
-
return omitBy(inputProps, (value) => value === void 0);
|
83
|
+
return R.omitBy(inputProps, (value) => value === void 0);
|
236
84
|
};
|
237
85
|
};
|
238
|
-
|
86
|
+
|
87
|
+
// src/internal/hooks.ts
|
88
|
+
import { useActionData, useMatches, useTransition } from "@remix-run/react";
|
89
|
+
import { useCallback, useContext } from "react";
|
90
|
+
|
91
|
+
// ../set-get/src/stringToPathArray.ts
|
92
|
+
var stringToPathArray = (path) => {
|
239
93
|
if (path.length === 0)
|
240
94
|
return [];
|
241
95
|
const match = path.match(/^\[(.+?)\](.*)$/) || path.match(/^\.?([^\.\[\]]+)(.*)$/);
|
242
96
|
if (match) {
|
243
|
-
const [
|
97
|
+
const [_, key, rest] = match;
|
244
98
|
return [/^\d+$/.test(key) ? Number(key) : key, ...stringToPathArray(rest)];
|
245
99
|
}
|
246
100
|
return [path];
|
247
101
|
};
|
102
|
+
|
103
|
+
// ../set-get/src/setPath.ts
|
248
104
|
function setPath(object, path, defaultValue) {
|
249
105
|
return _setPathNormalized(object, stringToPathArray(path), defaultValue);
|
250
106
|
}
|
@@ -253,10 +109,10 @@ function _setPathNormalized(object, path, value) {
|
|
253
109
|
const leadingSegments = path.slice(0, -1);
|
254
110
|
const lastSegment = path[path.length - 1];
|
255
111
|
let obj = object;
|
256
|
-
for (let
|
257
|
-
const segment = leadingSegments[
|
112
|
+
for (let i = 0; i < leadingSegments.length; i++) {
|
113
|
+
const segment = leadingSegments[i];
|
258
114
|
if (obj[segment] === void 0) {
|
259
|
-
const nextSegment = (_a = leadingSegments[
|
115
|
+
const nextSegment = (_a = leadingSegments[i + 1]) != null ? _a : lastSegment;
|
260
116
|
obj[segment] = typeof nextSegment === "number" ? [] : {};
|
261
117
|
}
|
262
118
|
obj = obj[segment];
|
@@ -264,546 +120,46 @@ function _setPathNormalized(object, path, value) {
|
|
264
120
|
obj[lastSegment] = value;
|
265
121
|
return object;
|
266
122
|
}
|
267
|
-
|
268
|
-
|
269
|
-
|
270
|
-
|
271
|
-
|
272
|
-
|
273
|
-
|
274
|
-
|
275
|
-
|
276
|
-
|
277
|
-
|
278
|
-
|
279
|
-
|
280
|
-
|
281
|
-
|
282
|
-
|
283
|
-
|
284
|
-
|
285
|
-
|
123
|
+
|
124
|
+
// ../set-get/src/getPath.ts
|
125
|
+
import * as R2 from "remeda";
|
126
|
+
var getPath = (object, path) => R2.pathOr(object, stringToPathArray(path), void 0);
|
127
|
+
|
128
|
+
// src/internal/hooks.ts
|
129
|
+
import invariant3 from "tiny-invariant";
|
130
|
+
|
131
|
+
// src/internal/constants.ts
|
132
|
+
var FORM_ID_FIELD = "__rvfInternalFormId";
|
133
|
+
var FORM_DEFAULTS_FIELD = "__rvfInternalFormDefaults";
|
134
|
+
var formDefaultValuesKey = (formId) => `${FORM_DEFAULTS_FIELD}_${formId}`;
|
135
|
+
|
136
|
+
// src/internal/formContext.ts
|
137
|
+
import { createContext } from "react";
|
138
|
+
var InternalFormContext = createContext(null);
|
139
|
+
|
140
|
+
// src/internal/hydratable.ts
|
141
|
+
var serverData = (data) => ({
|
286
142
|
hydrateTo: () => data,
|
287
|
-
map: (
|
143
|
+
map: (fn) => serverData(fn(data))
|
288
144
|
});
|
289
|
-
|
145
|
+
var hydratedData = () => ({
|
290
146
|
hydrateTo: (hydratedData2) => hydratedData2,
|
291
147
|
map: () => hydratedData()
|
292
148
|
});
|
293
|
-
|
294
|
-
|
149
|
+
var from = (data, hydrated) => hydrated ? hydratedData() : serverData(data);
|
150
|
+
var hydratable = {
|
295
151
|
serverData,
|
296
152
|
hydratedData,
|
297
153
|
from
|
298
154
|
};
|
299
|
-
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
304
|
-
|
305
|
-
|
306
|
-
|
307
|
-
listeners.forEach((listener) => listener(state, previousState));
|
308
|
-
}
|
309
|
-
};
|
310
|
-
const getState = () => state;
|
311
|
-
const subscribe = (listener) => {
|
312
|
-
listeners.add(listener);
|
313
|
-
return () => listeners.delete(listener);
|
314
|
-
};
|
315
|
-
const destroy = () => listeners.clear();
|
316
|
-
const api = { setState, getState, subscribe, destroy };
|
317
|
-
state = createState(setState, getState, api);
|
318
|
-
return api;
|
319
|
-
};
|
320
|
-
const createStore = (createState) => createState ? createStoreImpl(createState) : createStoreImpl;
|
321
|
-
var withSelector = { exports: {} };
|
322
|
-
var withSelector_production_min = {};
|
323
|
-
var shim = { exports: {} };
|
324
|
-
var useSyncExternalStoreShim_production_min = {};
|
325
|
-
/**
|
326
|
-
* @license React
|
327
|
-
* use-sync-external-store-shim.production.min.js
|
328
|
-
*
|
329
|
-
* Copyright (c) Facebook, Inc. and its affiliates.
|
330
|
-
*
|
331
|
-
* This source code is licensed under the MIT license found in the
|
332
|
-
* LICENSE file in the root directory of this source tree.
|
333
|
-
*/
|
334
|
-
var e = React;
|
335
|
-
function h$2(a2, b2) {
|
336
|
-
return a2 === b2 && (0 !== a2 || 1 / a2 === 1 / b2) || a2 !== a2 && b2 !== b2;
|
337
|
-
}
|
338
|
-
var k$1 = "function" === typeof Object.is ? Object.is : h$2, l$1 = e.useState, m = e.useEffect, n$2 = e.useLayoutEffect, p$2 = e.useDebugValue;
|
339
|
-
function q$2(a2, b2) {
|
340
|
-
var d2 = b2(), f2 = l$1({ inst: { value: d2, getSnapshot: b2 } }), c2 = f2[0].inst, g2 = f2[1];
|
341
|
-
n$2(function() {
|
342
|
-
c2.value = d2;
|
343
|
-
c2.getSnapshot = b2;
|
344
|
-
r$2(c2) && g2({ inst: c2 });
|
345
|
-
}, [a2, d2, b2]);
|
346
|
-
m(function() {
|
347
|
-
r$2(c2) && g2({ inst: c2 });
|
348
|
-
return a2(function() {
|
349
|
-
r$2(c2) && g2({ inst: c2 });
|
350
|
-
});
|
351
|
-
}, [a2]);
|
352
|
-
p$2(d2);
|
353
|
-
return d2;
|
354
|
-
}
|
355
|
-
function r$2(a2) {
|
356
|
-
var b2 = a2.getSnapshot;
|
357
|
-
a2 = a2.value;
|
358
|
-
try {
|
359
|
-
var d2 = b2();
|
360
|
-
return !k$1(a2, d2);
|
361
|
-
} catch (f2) {
|
362
|
-
return true;
|
363
|
-
}
|
364
|
-
}
|
365
|
-
function t$2(a2, b2) {
|
366
|
-
return b2();
|
367
|
-
}
|
368
|
-
var u$2 = "undefined" === typeof window || "undefined" === typeof window.document || "undefined" === typeof window.document.createElement ? t$2 : q$2;
|
369
|
-
useSyncExternalStoreShim_production_min.useSyncExternalStore = void 0 !== e.useSyncExternalStore ? e.useSyncExternalStore : u$2;
|
370
|
-
{
|
371
|
-
shim.exports = useSyncExternalStoreShim_production_min;
|
372
|
-
}
|
373
|
-
/**
|
374
|
-
* @license React
|
375
|
-
* use-sync-external-store-shim/with-selector.production.min.js
|
376
|
-
*
|
377
|
-
* Copyright (c) Facebook, Inc. and its affiliates.
|
378
|
-
*
|
379
|
-
* This source code is licensed under the MIT license found in the
|
380
|
-
* LICENSE file in the root directory of this source tree.
|
381
|
-
*/
|
382
|
-
var h$1 = React, n$1 = shim.exports;
|
383
|
-
function p$1(a2, b2) {
|
384
|
-
return a2 === b2 && (0 !== a2 || 1 / a2 === 1 / b2) || a2 !== a2 && b2 !== b2;
|
385
|
-
}
|
386
|
-
var q$1 = "function" === typeof Object.is ? Object.is : p$1, r$1 = n$1.useSyncExternalStore, t$1 = h$1.useRef, u$1 = h$1.useEffect, v$1 = h$1.useMemo, w$1 = h$1.useDebugValue;
|
387
|
-
withSelector_production_min.useSyncExternalStoreWithSelector = function(a2, b2, e2, l2, g2) {
|
388
|
-
var c2 = t$1(null);
|
389
|
-
if (null === c2.current) {
|
390
|
-
var f2 = { hasValue: false, value: null };
|
391
|
-
c2.current = f2;
|
392
|
-
} else
|
393
|
-
f2 = c2.current;
|
394
|
-
c2 = v$1(function() {
|
395
|
-
function a3(a4) {
|
396
|
-
if (!c3) {
|
397
|
-
c3 = true;
|
398
|
-
d3 = a4;
|
399
|
-
a4 = l2(a4);
|
400
|
-
if (void 0 !== g2 && f2.hasValue) {
|
401
|
-
var b3 = f2.value;
|
402
|
-
if (g2(b3, a4))
|
403
|
-
return k2 = b3;
|
404
|
-
}
|
405
|
-
return k2 = a4;
|
406
|
-
}
|
407
|
-
b3 = k2;
|
408
|
-
if (q$1(d3, a4))
|
409
|
-
return b3;
|
410
|
-
var e3 = l2(a4);
|
411
|
-
if (void 0 !== g2 && g2(b3, e3))
|
412
|
-
return b3;
|
413
|
-
d3 = a4;
|
414
|
-
return k2 = e3;
|
415
|
-
}
|
416
|
-
var c3 = false, d3, k2, m2 = void 0 === e2 ? null : e2;
|
417
|
-
return [function() {
|
418
|
-
return a3(b2());
|
419
|
-
}, null === m2 ? void 0 : function() {
|
420
|
-
return a3(m2());
|
421
|
-
}];
|
422
|
-
}, [b2, e2, l2, g2]);
|
423
|
-
var d2 = r$1(a2, c2[0], c2[1]);
|
424
|
-
u$1(function() {
|
425
|
-
f2.hasValue = true;
|
426
|
-
f2.value = d2;
|
427
|
-
}, [d2]);
|
428
|
-
w$1(d2);
|
429
|
-
return d2;
|
430
|
-
};
|
431
|
-
{
|
432
|
-
withSelector.exports = withSelector_production_min;
|
433
|
-
}
|
434
|
-
var useSyncExternalStoreExports = withSelector.exports;
|
435
|
-
const { useSyncExternalStoreWithSelector } = useSyncExternalStoreExports;
|
436
|
-
function useStore(api, selector = api.getState, equalityFn) {
|
437
|
-
const slice = useSyncExternalStoreWithSelector(
|
438
|
-
api.subscribe,
|
439
|
-
api.getState,
|
440
|
-
api.getServerState || api.getState,
|
441
|
-
selector,
|
442
|
-
equalityFn
|
443
|
-
);
|
444
|
-
useDebugValue(slice);
|
445
|
-
return slice;
|
446
|
-
}
|
447
|
-
const createImpl = (createState) => {
|
448
|
-
const api = typeof createState === "function" ? createStore(createState) : createState;
|
449
|
-
const useBoundStore = (selector, equalityFn) => useStore(api, selector, equalityFn);
|
450
|
-
Object.assign(useBoundStore, api);
|
451
|
-
return useBoundStore;
|
452
|
-
};
|
453
|
-
const create = (createState) => createState ? createImpl(createState) : createImpl;
|
454
|
-
function n(n2) {
|
455
|
-
for (var r2 = arguments.length, t2 = Array(r2 > 1 ? r2 - 1 : 0), e2 = 1; e2 < r2; e2++)
|
456
|
-
t2[e2 - 1] = arguments[e2];
|
457
|
-
throw Error("[Immer] minified error nr: " + n2 + (t2.length ? " " + t2.map(function(n3) {
|
458
|
-
return "'" + n3 + "'";
|
459
|
-
}).join(",") : "") + ". Find the full error at: https://bit.ly/3cXEKWf");
|
460
|
-
}
|
461
|
-
function r(n2) {
|
462
|
-
return !!n2 && !!n2[Q];
|
463
|
-
}
|
464
|
-
function t(n2) {
|
465
|
-
var r2;
|
466
|
-
return !!n2 && (function(n3) {
|
467
|
-
if (!n3 || "object" != typeof n3)
|
468
|
-
return false;
|
469
|
-
var r3 = Object.getPrototypeOf(n3);
|
470
|
-
if (null === r3)
|
471
|
-
return true;
|
472
|
-
var t2 = Object.hasOwnProperty.call(r3, "constructor") && r3.constructor;
|
473
|
-
return t2 === Object || "function" == typeof t2 && Function.toString.call(t2) === Z;
|
474
|
-
}(n2) || Array.isArray(n2) || !!n2[L] || !!(null === (r2 = n2.constructor) || void 0 === r2 ? void 0 : r2[L]) || s(n2) || v(n2));
|
475
|
-
}
|
476
|
-
function i(n2, r2, t2) {
|
477
|
-
void 0 === t2 && (t2 = false), 0 === o(n2) ? (t2 ? Object.keys : nn)(n2).forEach(function(e2) {
|
478
|
-
t2 && "symbol" == typeof e2 || r2(e2, n2[e2], n2);
|
479
|
-
}) : n2.forEach(function(t3, e2) {
|
480
|
-
return r2(e2, t3, n2);
|
481
|
-
});
|
482
|
-
}
|
483
|
-
function o(n2) {
|
484
|
-
var r2 = n2[Q];
|
485
|
-
return r2 ? r2.i > 3 ? r2.i - 4 : r2.i : Array.isArray(n2) ? 1 : s(n2) ? 2 : v(n2) ? 3 : 0;
|
486
|
-
}
|
487
|
-
function u(n2, r2) {
|
488
|
-
return 2 === o(n2) ? n2.has(r2) : Object.prototype.hasOwnProperty.call(n2, r2);
|
489
|
-
}
|
490
|
-
function a(n2, r2) {
|
491
|
-
return 2 === o(n2) ? n2.get(r2) : n2[r2];
|
492
|
-
}
|
493
|
-
function f(n2, r2, t2) {
|
494
|
-
var e2 = o(n2);
|
495
|
-
2 === e2 ? n2.set(r2, t2) : 3 === e2 ? (n2.delete(r2), n2.add(t2)) : n2[r2] = t2;
|
496
|
-
}
|
497
|
-
function c(n2, r2) {
|
498
|
-
return n2 === r2 ? 0 !== n2 || 1 / n2 == 1 / r2 : n2 != n2 && r2 != r2;
|
499
|
-
}
|
500
|
-
function s(n2) {
|
501
|
-
return X && n2 instanceof Map;
|
502
|
-
}
|
503
|
-
function v(n2) {
|
504
|
-
return q && n2 instanceof Set;
|
505
|
-
}
|
506
|
-
function p(n2) {
|
507
|
-
return n2.o || n2.t;
|
508
|
-
}
|
509
|
-
function l(n2) {
|
510
|
-
if (Array.isArray(n2))
|
511
|
-
return Array.prototype.slice.call(n2);
|
512
|
-
var r2 = rn(n2);
|
513
|
-
delete r2[Q];
|
514
|
-
for (var t2 = nn(r2), e2 = 0; e2 < t2.length; e2++) {
|
515
|
-
var i2 = t2[e2], o2 = r2[i2];
|
516
|
-
false === o2.writable && (o2.writable = true, o2.configurable = true), (o2.get || o2.set) && (r2[i2] = { configurable: true, writable: true, enumerable: o2.enumerable, value: n2[i2] });
|
517
|
-
}
|
518
|
-
return Object.create(Object.getPrototypeOf(n2), r2);
|
519
|
-
}
|
520
|
-
function d(n2, e2) {
|
521
|
-
return void 0 === e2 && (e2 = false), y(n2) || r(n2) || !t(n2) ? n2 : (o(n2) > 1 && (n2.set = n2.add = n2.clear = n2.delete = h), Object.freeze(n2), e2 && i(n2, function(n3, r2) {
|
522
|
-
return d(r2, true);
|
523
|
-
}, true), n2);
|
524
|
-
}
|
525
|
-
function h() {
|
526
|
-
n(2);
|
527
|
-
}
|
528
|
-
function y(n2) {
|
529
|
-
return null == n2 || "object" != typeof n2 || Object.isFrozen(n2);
|
530
|
-
}
|
531
|
-
function b(r2) {
|
532
|
-
var t2 = tn[r2];
|
533
|
-
return t2 || n(18, r2), t2;
|
534
|
-
}
|
535
|
-
function _() {
|
536
|
-
return U;
|
537
|
-
}
|
538
|
-
function j(n2, r2) {
|
539
|
-
r2 && (b("Patches"), n2.u = [], n2.s = [], n2.v = r2);
|
540
|
-
}
|
541
|
-
function O(n2) {
|
542
|
-
g(n2), n2.p.forEach(S), n2.p = null;
|
543
|
-
}
|
544
|
-
function g(n2) {
|
545
|
-
n2 === U && (U = n2.l);
|
546
|
-
}
|
547
|
-
function w(n2) {
|
548
|
-
return U = { p: [], l: U, h: n2, m: true, _: 0 };
|
549
|
-
}
|
550
|
-
function S(n2) {
|
551
|
-
var r2 = n2[Q];
|
552
|
-
0 === r2.i || 1 === r2.i ? r2.j() : r2.O = true;
|
553
|
-
}
|
554
|
-
function P(r2, e2) {
|
555
|
-
e2._ = e2.p.length;
|
556
|
-
var i2 = e2.p[0], o2 = void 0 !== r2 && r2 !== i2;
|
557
|
-
return e2.h.g || b("ES5").S(e2, r2, o2), o2 ? (i2[Q].P && (O(e2), n(4)), t(r2) && (r2 = M(e2, r2), e2.l || x(e2, r2)), e2.u && b("Patches").M(i2[Q].t, r2, e2.u, e2.s)) : r2 = M(e2, i2, []), O(e2), e2.u && e2.v(e2.u, e2.s), r2 !== H ? r2 : void 0;
|
558
|
-
}
|
559
|
-
function M(n2, r2, t2) {
|
560
|
-
if (y(r2))
|
561
|
-
return r2;
|
562
|
-
var e2 = r2[Q];
|
563
|
-
if (!e2)
|
564
|
-
return i(r2, function(i2, o3) {
|
565
|
-
return A(n2, e2, r2, i2, o3, t2);
|
566
|
-
}, true), r2;
|
567
|
-
if (e2.A !== n2)
|
568
|
-
return r2;
|
569
|
-
if (!e2.P)
|
570
|
-
return x(n2, e2.t, true), e2.t;
|
571
|
-
if (!e2.I) {
|
572
|
-
e2.I = true, e2.A._--;
|
573
|
-
var o2 = 4 === e2.i || 5 === e2.i ? e2.o = l(e2.k) : e2.o;
|
574
|
-
i(3 === e2.i ? new Set(o2) : o2, function(r3, i2) {
|
575
|
-
return A(n2, e2, o2, r3, i2, t2);
|
576
|
-
}), x(n2, o2, false), t2 && n2.u && b("Patches").R(e2, t2, n2.u, n2.s);
|
577
|
-
}
|
578
|
-
return e2.o;
|
579
|
-
}
|
580
|
-
function A(e2, i2, o2, a2, c2, s2) {
|
581
|
-
if (r(c2)) {
|
582
|
-
var v2 = M(e2, c2, s2 && i2 && 3 !== i2.i && !u(i2.D, a2) ? s2.concat(a2) : void 0);
|
583
|
-
if (f(o2, a2, v2), !r(v2))
|
584
|
-
return;
|
585
|
-
e2.m = false;
|
586
|
-
}
|
587
|
-
if (t(c2) && !y(c2)) {
|
588
|
-
if (!e2.h.F && e2._ < 1)
|
589
|
-
return;
|
590
|
-
M(e2, c2), i2 && i2.A.l || x(e2, c2);
|
591
|
-
}
|
592
|
-
}
|
593
|
-
function x(n2, r2, t2) {
|
594
|
-
void 0 === t2 && (t2 = false), n2.h.F && n2.m && d(r2, t2);
|
595
|
-
}
|
596
|
-
function z(n2, r2) {
|
597
|
-
var t2 = n2[Q];
|
598
|
-
return (t2 ? p(t2) : n2)[r2];
|
599
|
-
}
|
600
|
-
function I(n2, r2) {
|
601
|
-
if (r2 in n2)
|
602
|
-
for (var t2 = Object.getPrototypeOf(n2); t2; ) {
|
603
|
-
var e2 = Object.getOwnPropertyDescriptor(t2, r2);
|
604
|
-
if (e2)
|
605
|
-
return e2;
|
606
|
-
t2 = Object.getPrototypeOf(t2);
|
607
|
-
}
|
608
|
-
}
|
609
|
-
function k(n2) {
|
610
|
-
n2.P || (n2.P = true, n2.l && k(n2.l));
|
611
|
-
}
|
612
|
-
function E(n2) {
|
613
|
-
n2.o || (n2.o = l(n2.t));
|
614
|
-
}
|
615
|
-
function R(n2, r2, t2) {
|
616
|
-
var e2 = s(r2) ? b("MapSet").N(r2, t2) : v(r2) ? b("MapSet").T(r2, t2) : n2.g ? function(n3, r3) {
|
617
|
-
var t3 = Array.isArray(n3), e3 = { i: t3 ? 1 : 0, A: r3 ? r3.A : _(), P: false, I: false, D: {}, l: r3, t: n3, k: null, o: null, j: null, C: false }, i2 = e3, o2 = en;
|
618
|
-
t3 && (i2 = [e3], o2 = on);
|
619
|
-
var u2 = Proxy.revocable(i2, o2), a2 = u2.revoke, f2 = u2.proxy;
|
620
|
-
return e3.k = f2, e3.j = a2, f2;
|
621
|
-
}(r2, t2) : b("ES5").J(r2, t2);
|
622
|
-
return (t2 ? t2.A : _()).p.push(e2), e2;
|
623
|
-
}
|
624
|
-
function D(e2) {
|
625
|
-
return r(e2) || n(22, e2), function n2(r2) {
|
626
|
-
if (!t(r2))
|
627
|
-
return r2;
|
628
|
-
var e3, u2 = r2[Q], c2 = o(r2);
|
629
|
-
if (u2) {
|
630
|
-
if (!u2.P && (u2.i < 4 || !b("ES5").K(u2)))
|
631
|
-
return u2.t;
|
632
|
-
u2.I = true, e3 = F(r2, c2), u2.I = false;
|
633
|
-
} else
|
634
|
-
e3 = F(r2, c2);
|
635
|
-
return i(e3, function(r3, t2) {
|
636
|
-
u2 && a(u2.t, r3) === t2 || f(e3, r3, n2(t2));
|
637
|
-
}), 3 === c2 ? new Set(e3) : e3;
|
638
|
-
}(e2);
|
639
|
-
}
|
640
|
-
function F(n2, r2) {
|
641
|
-
switch (r2) {
|
642
|
-
case 2:
|
643
|
-
return new Map(n2);
|
644
|
-
case 3:
|
645
|
-
return Array.from(n2);
|
646
|
-
}
|
647
|
-
return l(n2);
|
648
|
-
}
|
649
|
-
var G, U, W = "undefined" != typeof Symbol && "symbol" == typeof Symbol("x"), X = "undefined" != typeof Map, q = "undefined" != typeof Set, B = "undefined" != typeof Proxy && void 0 !== Proxy.revocable && "undefined" != typeof Reflect, H = W ? Symbol.for("immer-nothing") : ((G = {})["immer-nothing"] = true, G), L = W ? Symbol.for("immer-draftable") : "__$immer_draftable", Q = W ? Symbol.for("immer-state") : "__$immer_state", Z = "" + Object.prototype.constructor, nn = "undefined" != typeof Reflect && Reflect.ownKeys ? Reflect.ownKeys : void 0 !== Object.getOwnPropertySymbols ? function(n2) {
|
650
|
-
return Object.getOwnPropertyNames(n2).concat(Object.getOwnPropertySymbols(n2));
|
651
|
-
} : Object.getOwnPropertyNames, rn = Object.getOwnPropertyDescriptors || function(n2) {
|
652
|
-
var r2 = {};
|
653
|
-
return nn(n2).forEach(function(t2) {
|
654
|
-
r2[t2] = Object.getOwnPropertyDescriptor(n2, t2);
|
655
|
-
}), r2;
|
656
|
-
}, tn = {}, en = { get: function(n2, r2) {
|
657
|
-
if (r2 === Q)
|
658
|
-
return n2;
|
659
|
-
var e2 = p(n2);
|
660
|
-
if (!u(e2, r2))
|
661
|
-
return function(n3, r3, t2) {
|
662
|
-
var e3, i3 = I(r3, t2);
|
663
|
-
return i3 ? "value" in i3 ? i3.value : null === (e3 = i3.get) || void 0 === e3 ? void 0 : e3.call(n3.k) : void 0;
|
664
|
-
}(n2, e2, r2);
|
665
|
-
var i2 = e2[r2];
|
666
|
-
return n2.I || !t(i2) ? i2 : i2 === z(n2.t, r2) ? (E(n2), n2.o[r2] = R(n2.A.h, i2, n2)) : i2;
|
667
|
-
}, has: function(n2, r2) {
|
668
|
-
return r2 in p(n2);
|
669
|
-
}, ownKeys: function(n2) {
|
670
|
-
return Reflect.ownKeys(p(n2));
|
671
|
-
}, set: function(n2, r2, t2) {
|
672
|
-
var e2 = I(p(n2), r2);
|
673
|
-
if (null == e2 ? void 0 : e2.set)
|
674
|
-
return e2.set.call(n2.k, t2), true;
|
675
|
-
if (!n2.P) {
|
676
|
-
var i2 = z(p(n2), r2), o2 = null == i2 ? void 0 : i2[Q];
|
677
|
-
if (o2 && o2.t === t2)
|
678
|
-
return n2.o[r2] = t2, n2.D[r2] = false, true;
|
679
|
-
if (c(t2, i2) && (void 0 !== t2 || u(n2.t, r2)))
|
680
|
-
return true;
|
681
|
-
E(n2), k(n2);
|
682
|
-
}
|
683
|
-
return n2.o[r2] === t2 && "number" != typeof t2 && (void 0 !== t2 || r2 in n2.o) || (n2.o[r2] = t2, n2.D[r2] = true, true);
|
684
|
-
}, deleteProperty: function(n2, r2) {
|
685
|
-
return void 0 !== z(n2.t, r2) || r2 in n2.t ? (n2.D[r2] = false, E(n2), k(n2)) : delete n2.D[r2], n2.o && delete n2.o[r2], true;
|
686
|
-
}, getOwnPropertyDescriptor: function(n2, r2) {
|
687
|
-
var t2 = p(n2), e2 = Reflect.getOwnPropertyDescriptor(t2, r2);
|
688
|
-
return e2 ? { writable: true, configurable: 1 !== n2.i || "length" !== r2, enumerable: e2.enumerable, value: t2[r2] } : e2;
|
689
|
-
}, defineProperty: function() {
|
690
|
-
n(11);
|
691
|
-
}, getPrototypeOf: function(n2) {
|
692
|
-
return Object.getPrototypeOf(n2.t);
|
693
|
-
}, setPrototypeOf: function() {
|
694
|
-
n(12);
|
695
|
-
} }, on = {};
|
696
|
-
i(en, function(n2, r2) {
|
697
|
-
on[n2] = function() {
|
698
|
-
return arguments[0] = arguments[0][0], r2.apply(this, arguments);
|
699
|
-
};
|
700
|
-
}), on.deleteProperty = function(r2, t2) {
|
701
|
-
return on.set.call(this, r2, t2, void 0);
|
702
|
-
}, on.set = function(r2, t2, e2) {
|
703
|
-
return en.set.call(this, r2[0], t2, e2, r2[0]);
|
704
|
-
};
|
705
|
-
var un = function() {
|
706
|
-
function e2(r2) {
|
707
|
-
var e3 = this;
|
708
|
-
this.g = B, this.F = true, this.produce = function(r3, i3, o2) {
|
709
|
-
if ("function" == typeof r3 && "function" != typeof i3) {
|
710
|
-
var u2 = i3;
|
711
|
-
i3 = r3;
|
712
|
-
var a2 = e3;
|
713
|
-
return function(n2) {
|
714
|
-
var r4 = this;
|
715
|
-
void 0 === n2 && (n2 = u2);
|
716
|
-
for (var t2 = arguments.length, e4 = Array(t2 > 1 ? t2 - 1 : 0), o3 = 1; o3 < t2; o3++)
|
717
|
-
e4[o3 - 1] = arguments[o3];
|
718
|
-
return a2.produce(n2, function(n3) {
|
719
|
-
var t3;
|
720
|
-
return (t3 = i3).call.apply(t3, [r4, n3].concat(e4));
|
721
|
-
});
|
722
|
-
};
|
723
|
-
}
|
724
|
-
var f2;
|
725
|
-
if ("function" != typeof i3 && n(6), void 0 !== o2 && "function" != typeof o2 && n(7), t(r3)) {
|
726
|
-
var c2 = w(e3), s2 = R(e3, r3, void 0), v2 = true;
|
727
|
-
try {
|
728
|
-
f2 = i3(s2), v2 = false;
|
729
|
-
} finally {
|
730
|
-
v2 ? O(c2) : g(c2);
|
731
|
-
}
|
732
|
-
return "undefined" != typeof Promise && f2 instanceof Promise ? f2.then(function(n2) {
|
733
|
-
return j(c2, o2), P(n2, c2);
|
734
|
-
}, function(n2) {
|
735
|
-
throw O(c2), n2;
|
736
|
-
}) : (j(c2, o2), P(f2, c2));
|
737
|
-
}
|
738
|
-
if (!r3 || "object" != typeof r3) {
|
739
|
-
if (void 0 === (f2 = i3(r3)) && (f2 = r3), f2 === H && (f2 = void 0), e3.F && d(f2, true), o2) {
|
740
|
-
var p2 = [], l2 = [];
|
741
|
-
b("Patches").M(r3, f2, p2, l2), o2(p2, l2);
|
742
|
-
}
|
743
|
-
return f2;
|
744
|
-
}
|
745
|
-
n(21, r3);
|
746
|
-
}, this.produceWithPatches = function(n2, r3) {
|
747
|
-
if ("function" == typeof n2)
|
748
|
-
return function(r4) {
|
749
|
-
for (var t3 = arguments.length, i4 = Array(t3 > 1 ? t3 - 1 : 0), o3 = 1; o3 < t3; o3++)
|
750
|
-
i4[o3 - 1] = arguments[o3];
|
751
|
-
return e3.produceWithPatches(r4, function(r5) {
|
752
|
-
return n2.apply(void 0, [r5].concat(i4));
|
753
|
-
});
|
754
|
-
};
|
755
|
-
var t2, i3, o2 = e3.produce(n2, r3, function(n3, r4) {
|
756
|
-
t2 = n3, i3 = r4;
|
757
|
-
});
|
758
|
-
return "undefined" != typeof Promise && o2 instanceof Promise ? o2.then(function(n3) {
|
759
|
-
return [n3, t2, i3];
|
760
|
-
}) : [o2, t2, i3];
|
761
|
-
}, "boolean" == typeof (null == r2 ? void 0 : r2.useProxies) && this.setUseProxies(r2.useProxies), "boolean" == typeof (null == r2 ? void 0 : r2.autoFreeze) && this.setAutoFreeze(r2.autoFreeze);
|
762
|
-
}
|
763
|
-
var i2 = e2.prototype;
|
764
|
-
return i2.createDraft = function(e3) {
|
765
|
-
t(e3) || n(8), r(e3) && (e3 = D(e3));
|
766
|
-
var i3 = w(this), o2 = R(this, e3, void 0);
|
767
|
-
return o2[Q].C = true, g(i3), o2;
|
768
|
-
}, i2.finishDraft = function(r2, t2) {
|
769
|
-
var e3 = r2 && r2[Q];
|
770
|
-
var i3 = e3.A;
|
771
|
-
return j(i3, t2), P(void 0, i3);
|
772
|
-
}, i2.setAutoFreeze = function(n2) {
|
773
|
-
this.F = n2;
|
774
|
-
}, i2.setUseProxies = function(r2) {
|
775
|
-
r2 && !B && n(20), this.g = r2;
|
776
|
-
}, i2.applyPatches = function(n2, t2) {
|
777
|
-
var e3;
|
778
|
-
for (e3 = t2.length - 1; e3 >= 0; e3--) {
|
779
|
-
var i3 = t2[e3];
|
780
|
-
if (0 === i3.path.length && "replace" === i3.op) {
|
781
|
-
n2 = i3.value;
|
782
|
-
break;
|
783
|
-
}
|
784
|
-
}
|
785
|
-
e3 > -1 && (t2 = t2.slice(e3 + 1));
|
786
|
-
var o2 = b("Patches").$;
|
787
|
-
return r(n2) ? o2(n2, t2) : this.produce(n2, function(n3) {
|
788
|
-
return o2(n3, t2);
|
789
|
-
});
|
790
|
-
}, e2;
|
791
|
-
}(), an = new un(), fn = an.produce;
|
792
|
-
an.produceWithPatches.bind(an);
|
793
|
-
an.setAutoFreeze.bind(an);
|
794
|
-
an.setUseProxies.bind(an);
|
795
|
-
an.applyPatches.bind(an);
|
796
|
-
an.createDraft.bind(an);
|
797
|
-
an.finishDraft.bind(an);
|
798
|
-
const immerImpl = (initializer) => (set, get, store) => {
|
799
|
-
store.setState = (updater, replace2, ...a2) => {
|
800
|
-
const nextState = typeof updater === "function" ? fn(updater) : updater;
|
801
|
-
return set(nextState, replace2, ...a2);
|
802
|
-
};
|
803
|
-
return initializer(store.setState, get, store);
|
804
|
-
};
|
805
|
-
const immer = immerImpl;
|
806
|
-
const requestSubmit = (element, submitter) => {
|
155
|
+
|
156
|
+
// src/internal/state/createFormStore.ts
|
157
|
+
import invariant2 from "tiny-invariant";
|
158
|
+
import create from "zustand";
|
159
|
+
import { immer } from "zustand/middleware/immer";
|
160
|
+
|
161
|
+
// src/internal/logic/requestSubmit.ts
|
162
|
+
var requestSubmit = (element, submitter) => {
|
807
163
|
if (typeof Object.getPrototypeOf(element).requestSubmit === "function" && true) {
|
808
164
|
element.requestSubmit(submitter);
|
809
165
|
return;
|
@@ -842,7 +198,38 @@ function raise(errorConstructor, message, name) {
|
|
842
198
|
name
|
843
199
|
);
|
844
200
|
}
|
845
|
-
|
201
|
+
if (void 0) {
|
202
|
+
const { it, expect } = void 0;
|
203
|
+
it("should validate the submitter", () => {
|
204
|
+
const form = document.createElement("form");
|
205
|
+
document.body.appendChild(form);
|
206
|
+
const submitter = document.createElement("input");
|
207
|
+
expect(() => validateSubmitter(null, null)).toThrow();
|
208
|
+
expect(() => validateSubmitter(form, null)).toThrow();
|
209
|
+
expect(() => validateSubmitter(form, submitter)).toThrow();
|
210
|
+
expect(
|
211
|
+
() => validateSubmitter(form, document.createElement("div"))
|
212
|
+
).toThrow();
|
213
|
+
submitter.type = "submit";
|
214
|
+
expect(() => validateSubmitter(form, submitter)).toThrow();
|
215
|
+
form.appendChild(submitter);
|
216
|
+
expect(() => validateSubmitter(form, submitter)).not.toThrow();
|
217
|
+
form.removeChild(submitter);
|
218
|
+
expect(() => validateSubmitter(form, submitter)).toThrow();
|
219
|
+
document.body.appendChild(submitter);
|
220
|
+
form.id = "test-form";
|
221
|
+
submitter.setAttribute("form", "test-form");
|
222
|
+
expect(() => validateSubmitter(form, submitter)).not.toThrow();
|
223
|
+
const button = document.createElement("button");
|
224
|
+
button.type = "submit";
|
225
|
+
form.appendChild(button);
|
226
|
+
expect(() => validateSubmitter(form, button)).not.toThrow();
|
227
|
+
});
|
228
|
+
}
|
229
|
+
|
230
|
+
// src/internal/state/arrayUtil.ts
|
231
|
+
import invariant from "tiny-invariant";
|
232
|
+
var getArray = (values, field) => {
|
846
233
|
const value = getPath(values, field);
|
847
234
|
if (value === void 0 || value === null) {
|
848
235
|
const newValue = [];
|
@@ -855,7 +242,7 @@ const getArray = (values, field) => {
|
|
855
242
|
);
|
856
243
|
return value;
|
857
244
|
};
|
858
|
-
|
245
|
+
var swap = (array, indexA, indexB) => {
|
859
246
|
const itemA = array[indexA];
|
860
247
|
const itemB = array[indexB];
|
861
248
|
const hasItemA = indexA in array;
|
@@ -879,20 +266,20 @@ function sparseSplice(array, start, deleteCount, item) {
|
|
879
266
|
return array.splice(start, deleteCount, item);
|
880
267
|
return array.splice(start, deleteCount);
|
881
268
|
}
|
882
|
-
|
269
|
+
var move = (array, from2, to) => {
|
883
270
|
const [item] = sparseSplice(array, from2, 1);
|
884
271
|
sparseSplice(array, to, 0, item);
|
885
272
|
};
|
886
|
-
|
273
|
+
var insert = (array, index, value) => {
|
887
274
|
sparseSplice(array, index, 0, value);
|
888
275
|
};
|
889
|
-
|
276
|
+
var remove = (array, index) => {
|
890
277
|
sparseSplice(array, index, 1);
|
891
278
|
};
|
892
|
-
|
279
|
+
var replace = (array, index, value) => {
|
893
280
|
sparseSplice(array, index, 1, value);
|
894
281
|
};
|
895
|
-
|
282
|
+
var mutateAsArray = (field, obj, mutate) => {
|
896
283
|
const beforeKeys = /* @__PURE__ */ new Set();
|
897
284
|
const arr = [];
|
898
285
|
for (const [key, value] of Object.entries(obj)) {
|
@@ -913,7 +300,7 @@ const mutateAsArray = (field, obj, mutate) => {
|
|
913
300
|
}
|
914
301
|
}
|
915
302
|
};
|
916
|
-
|
303
|
+
var getDeepArrayPaths = (obj, basePath = "") => {
|
917
304
|
if (Array.isArray(obj)) {
|
918
305
|
return obj.flatMap(
|
919
306
|
(item, index) => getDeepArrayPaths(item, `${basePath}[${index}]`)
|
@@ -926,9 +313,259 @@ const getDeepArrayPaths = (obj, basePath = "") => {
|
|
926
313
|
}
|
927
314
|
return [basePath];
|
928
315
|
};
|
929
|
-
|
316
|
+
if (void 0) {
|
317
|
+
const { describe, expect, it } = void 0;
|
318
|
+
const countArrayItems = (arr) => {
|
319
|
+
let count = 0;
|
320
|
+
arr.forEach(() => count++);
|
321
|
+
return count;
|
322
|
+
};
|
323
|
+
describe("getArray", () => {
|
324
|
+
it("shoud get a deeply nested array that can be mutated to update the nested value", () => {
|
325
|
+
const values = {
|
326
|
+
d: [
|
327
|
+
{ foo: "bar", baz: [true, false] },
|
328
|
+
{ e: true, f: "hi" }
|
329
|
+
]
|
330
|
+
};
|
331
|
+
const result = getArray(values, "d[0].baz");
|
332
|
+
const finalValues = {
|
333
|
+
d: [
|
334
|
+
{ foo: "bar", baz: [true, false, true] },
|
335
|
+
{ e: true, f: "hi" }
|
336
|
+
]
|
337
|
+
};
|
338
|
+
expect(result).toEqual([true, false]);
|
339
|
+
result.push(true);
|
340
|
+
expect(values).toEqual(finalValues);
|
341
|
+
});
|
342
|
+
it("should return an empty array that can be mutated if result is null or undefined", () => {
|
343
|
+
const values = {};
|
344
|
+
const result = getArray(values, "a.foo[0].bar");
|
345
|
+
const finalValues = {
|
346
|
+
a: { foo: [{ bar: ["Bob ross"] }] }
|
347
|
+
};
|
348
|
+
expect(result).toEqual([]);
|
349
|
+
result.push("Bob ross");
|
350
|
+
expect(values).toEqual(finalValues);
|
351
|
+
});
|
352
|
+
it("should throw if the value is defined and not an array", () => {
|
353
|
+
const values = { foo: "foo" };
|
354
|
+
expect(() => getArray(values, "foo")).toThrow();
|
355
|
+
});
|
356
|
+
});
|
357
|
+
describe("swap", () => {
|
358
|
+
it("should swap two items", () => {
|
359
|
+
const array = [1, 2, 3];
|
360
|
+
swap(array, 0, 1);
|
361
|
+
expect(array).toEqual([2, 1, 3]);
|
362
|
+
});
|
363
|
+
it("should work for sparse arrays", () => {
|
364
|
+
const arr = [];
|
365
|
+
arr[0] = true;
|
366
|
+
swap(arr, 0, 2);
|
367
|
+
expect(countArrayItems(arr)).toEqual(1);
|
368
|
+
expect(0 in arr).toBe(false);
|
369
|
+
expect(2 in arr).toBe(true);
|
370
|
+
expect(arr[2]).toEqual(true);
|
371
|
+
});
|
372
|
+
});
|
373
|
+
describe("move", () => {
|
374
|
+
it("should move an item to a new index", () => {
|
375
|
+
const array = [1, 2, 3];
|
376
|
+
move(array, 0, 1);
|
377
|
+
expect(array).toEqual([2, 1, 3]);
|
378
|
+
});
|
379
|
+
it("should work with sparse arrays", () => {
|
380
|
+
const array = [1];
|
381
|
+
move(array, 0, 2);
|
382
|
+
expect(countArrayItems(array)).toEqual(1);
|
383
|
+
expect(array).toEqual([void 0, void 0, 1]);
|
384
|
+
});
|
385
|
+
});
|
386
|
+
describe("insert", () => {
|
387
|
+
it("should insert an item at a new index", () => {
|
388
|
+
const array = [1, 2, 3];
|
389
|
+
insert(array, 1, 4);
|
390
|
+
expect(array).toEqual([1, 4, 2, 3]);
|
391
|
+
});
|
392
|
+
it("should be able to insert falsey values", () => {
|
393
|
+
const array = [1, 2, 3];
|
394
|
+
insert(array, 1, null);
|
395
|
+
expect(array).toEqual([1, null, 2, 3]);
|
396
|
+
});
|
397
|
+
it("should handle sparse arrays", () => {
|
398
|
+
const array = [];
|
399
|
+
array[2] = true;
|
400
|
+
insert(array, 0, true);
|
401
|
+
expect(countArrayItems(array)).toEqual(2);
|
402
|
+
expect(array).toEqual([true, void 0, void 0, true]);
|
403
|
+
});
|
404
|
+
});
|
405
|
+
describe("remove", () => {
|
406
|
+
it("should remove an item at a given index", () => {
|
407
|
+
const array = [1, 2, 3];
|
408
|
+
remove(array, 1);
|
409
|
+
expect(array).toEqual([1, 3]);
|
410
|
+
});
|
411
|
+
it("should handle sparse arrays", () => {
|
412
|
+
const array = [];
|
413
|
+
array[2] = true;
|
414
|
+
remove(array, 0);
|
415
|
+
expect(countArrayItems(array)).toEqual(1);
|
416
|
+
expect(array).toEqual([void 0, true]);
|
417
|
+
});
|
418
|
+
});
|
419
|
+
describe("replace", () => {
|
420
|
+
it("should replace an item at a given index", () => {
|
421
|
+
const array = [1, 2, 3];
|
422
|
+
replace(array, 1, 4);
|
423
|
+
expect(array).toEqual([1, 4, 3]);
|
424
|
+
});
|
425
|
+
it("should handle sparse arrays", () => {
|
426
|
+
const array = [];
|
427
|
+
array[2] = true;
|
428
|
+
replace(array, 0, true);
|
429
|
+
expect(countArrayItems(array)).toEqual(2);
|
430
|
+
expect(array).toEqual([true, void 0, true]);
|
431
|
+
});
|
432
|
+
});
|
433
|
+
describe("mutateAsArray", () => {
|
434
|
+
it("should handle swap", () => {
|
435
|
+
const values = {
|
436
|
+
myField: "something",
|
437
|
+
"myField[0]": "foo",
|
438
|
+
"myField[2]": "bar",
|
439
|
+
otherField: "baz",
|
440
|
+
"otherField[0]": "something else"
|
441
|
+
};
|
442
|
+
mutateAsArray("myField", values, (arr) => {
|
443
|
+
swap(arr, 0, 2);
|
444
|
+
});
|
445
|
+
expect(values).toEqual({
|
446
|
+
myField: "something",
|
447
|
+
"myField[0]": "bar",
|
448
|
+
"myField[2]": "foo",
|
449
|
+
otherField: "baz",
|
450
|
+
"otherField[0]": "something else"
|
451
|
+
});
|
452
|
+
});
|
453
|
+
it("should swap sparse arrays", () => {
|
454
|
+
const values = {
|
455
|
+
myField: "something",
|
456
|
+
"myField[0]": "foo",
|
457
|
+
otherField: "baz",
|
458
|
+
"otherField[0]": "something else"
|
459
|
+
};
|
460
|
+
mutateAsArray("myField", values, (arr) => {
|
461
|
+
swap(arr, 0, 2);
|
462
|
+
});
|
463
|
+
expect(values).toEqual({
|
464
|
+
myField: "something",
|
465
|
+
"myField[2]": "foo",
|
466
|
+
otherField: "baz",
|
467
|
+
"otherField[0]": "something else"
|
468
|
+
});
|
469
|
+
});
|
470
|
+
it("should handle arrays with nested values", () => {
|
471
|
+
const values = {
|
472
|
+
myField: "something",
|
473
|
+
"myField[0].title": "foo",
|
474
|
+
"myField[0].note": "bar",
|
475
|
+
"myField[2].title": "other",
|
476
|
+
"myField[2].note": "other",
|
477
|
+
otherField: "baz",
|
478
|
+
"otherField[0]": "something else"
|
479
|
+
};
|
480
|
+
mutateAsArray("myField", values, (arr) => {
|
481
|
+
swap(arr, 0, 2);
|
482
|
+
});
|
483
|
+
expect(values).toEqual({
|
484
|
+
myField: "something",
|
485
|
+
"myField[0].title": "other",
|
486
|
+
"myField[0].note": "other",
|
487
|
+
"myField[2].title": "foo",
|
488
|
+
"myField[2].note": "bar",
|
489
|
+
otherField: "baz",
|
490
|
+
"otherField[0]": "something else"
|
491
|
+
});
|
492
|
+
});
|
493
|
+
it("should handle move", () => {
|
494
|
+
const values = {
|
495
|
+
myField: "something",
|
496
|
+
"myField[0]": "foo",
|
497
|
+
"myField[1]": "bar",
|
498
|
+
"myField[2]": "baz",
|
499
|
+
"otherField[0]": "something else"
|
500
|
+
};
|
501
|
+
mutateAsArray("myField", values, (arr) => {
|
502
|
+
move(arr, 0, 2);
|
503
|
+
});
|
504
|
+
expect(values).toEqual({
|
505
|
+
myField: "something",
|
506
|
+
"myField[0]": "bar",
|
507
|
+
"myField[1]": "baz",
|
508
|
+
"myField[2]": "foo",
|
509
|
+
"otherField[0]": "something else"
|
510
|
+
});
|
511
|
+
});
|
512
|
+
it("should not create keys for `undefined`", () => {
|
513
|
+
const values = {
|
514
|
+
"myField[0]": "foo"
|
515
|
+
};
|
516
|
+
mutateAsArray("myField", values, (arr) => {
|
517
|
+
arr.unshift(void 0);
|
518
|
+
});
|
519
|
+
expect(Object.keys(values)).toHaveLength(1);
|
520
|
+
expect(values).toEqual({
|
521
|
+
"myField[1]": "foo"
|
522
|
+
});
|
523
|
+
});
|
524
|
+
it("should handle remove", () => {
|
525
|
+
const values = {
|
526
|
+
myField: "something",
|
527
|
+
"myField[0]": "foo",
|
528
|
+
"myField[1]": "bar",
|
529
|
+
"myField[2]": "baz",
|
530
|
+
"otherField[0]": "something else"
|
531
|
+
};
|
532
|
+
mutateAsArray("myField", values, (arr) => {
|
533
|
+
remove(arr, 1);
|
534
|
+
});
|
535
|
+
expect(values).toEqual({
|
536
|
+
myField: "something",
|
537
|
+
"myField[0]": "foo",
|
538
|
+
"myField[1]": "baz",
|
539
|
+
"otherField[0]": "something else"
|
540
|
+
});
|
541
|
+
expect("myField[2]" in values).toBe(false);
|
542
|
+
});
|
543
|
+
});
|
544
|
+
describe("getDeepArrayPaths", () => {
|
545
|
+
it("should return all paths recursively", () => {
|
546
|
+
const obj = [
|
547
|
+
true,
|
548
|
+
true,
|
549
|
+
[true, true],
|
550
|
+
{ foo: true, bar: { baz: true, test: [true] } }
|
551
|
+
];
|
552
|
+
expect(getDeepArrayPaths(obj, "myField")).toEqual([
|
553
|
+
"myField[0]",
|
554
|
+
"myField[1]",
|
555
|
+
"myField[2][0]",
|
556
|
+
"myField[2][1]",
|
557
|
+
"myField[3].foo",
|
558
|
+
"myField[3].bar.baz",
|
559
|
+
"myField[3].bar.test[0]"
|
560
|
+
]);
|
561
|
+
});
|
562
|
+
});
|
563
|
+
}
|
564
|
+
|
565
|
+
// src/internal/state/createFormStore.ts
|
566
|
+
var noOp = () => {
|
930
567
|
};
|
931
|
-
|
568
|
+
var defaultFormState = {
|
932
569
|
isHydrated: false,
|
933
570
|
isSubmitting: false,
|
934
571
|
hasBeenSubmitted: false,
|
@@ -980,7 +617,7 @@ const defaultFormState = {
|
|
980
617
|
}
|
981
618
|
}
|
982
619
|
};
|
983
|
-
|
620
|
+
var createFormState = (set, get) => ({
|
984
621
|
isHydrated: false,
|
985
622
|
isSubmitting: false,
|
986
623
|
hasBeenSubmitted: false,
|
@@ -1035,12 +672,12 @@ const createFormState = (set, get) => ({
|
|
1035
672
|
validateField: async (field) => {
|
1036
673
|
var _a, _b, _c;
|
1037
674
|
const formElement = get().formElement;
|
1038
|
-
|
675
|
+
invariant2(
|
1039
676
|
formElement,
|
1040
677
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
1041
678
|
);
|
1042
679
|
const validator = (_a = get().formProps) == null ? void 0 : _a.validator;
|
1043
|
-
|
680
|
+
invariant2(
|
1044
681
|
validator,
|
1045
682
|
"Cannot validator. This is probably a bug in remix-validated-form."
|
1046
683
|
);
|
@@ -1060,12 +697,12 @@ const createFormState = (set, get) => ({
|
|
1060
697
|
validate: async () => {
|
1061
698
|
var _a;
|
1062
699
|
const formElement = get().formElement;
|
1063
|
-
|
700
|
+
invariant2(
|
1064
701
|
formElement,
|
1065
702
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
1066
703
|
);
|
1067
704
|
const validator = (_a = get().formProps) == null ? void 0 : _a.validator;
|
1068
|
-
|
705
|
+
invariant2(
|
1069
706
|
validator,
|
1070
707
|
"Cannot validator. This is probably a bug in remix-validated-form."
|
1071
708
|
);
|
@@ -1076,7 +713,7 @@ const createFormState = (set, get) => ({
|
|
1076
713
|
},
|
1077
714
|
submit: () => {
|
1078
715
|
const formElement = get().formElement;
|
1079
|
-
|
716
|
+
invariant2(
|
1080
717
|
formElement,
|
1081
718
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
1082
719
|
);
|
@@ -1319,7 +956,7 @@ const createFormState = (set, get) => ({
|
|
1319
956
|
}
|
1320
957
|
}
|
1321
958
|
});
|
1322
|
-
|
959
|
+
var useRootFormStore = create()(
|
1323
960
|
immer((set, get) => ({
|
1324
961
|
forms: {},
|
1325
962
|
form: (formId) => {
|
@@ -1343,10 +980,14 @@ const useRootFormStore = create()(
|
|
1343
980
|
}
|
1344
981
|
}))
|
1345
982
|
);
|
1346
|
-
|
983
|
+
|
984
|
+
// src/internal/state/storeHooks.ts
|
985
|
+
var useFormStore = (formId, selector) => {
|
1347
986
|
return useRootFormStore((state) => selector(state.form(formId)));
|
1348
987
|
};
|
1349
|
-
|
988
|
+
|
989
|
+
// src/internal/hooks.ts
|
990
|
+
var useInternalFormContext = (formId, hookName) => {
|
1350
991
|
const formContext = useContext(InternalFormContext);
|
1351
992
|
if (formId)
|
1352
993
|
return { formId };
|
@@ -1376,12 +1017,12 @@ function useErrorResponseForForm({
|
|
1376
1017
|
return actionData;
|
1377
1018
|
return null;
|
1378
1019
|
}
|
1379
|
-
|
1020
|
+
var useFieldErrorsForForm = (context) => {
|
1380
1021
|
const response = useErrorResponseForForm(context);
|
1381
1022
|
const hydrated = useFormStore(context.formId, (state) => state.isHydrated);
|
1382
1023
|
return hydratable.from(response == null ? void 0 : response.fieldErrors, hydrated);
|
1383
1024
|
};
|
1384
|
-
|
1025
|
+
var useDefaultValuesFromLoader = ({
|
1385
1026
|
formId
|
1386
1027
|
}) => {
|
1387
1028
|
const matches = useMatches();
|
@@ -1392,7 +1033,7 @@ const useDefaultValuesFromLoader = ({
|
|
1392
1033
|
}
|
1393
1034
|
return null;
|
1394
1035
|
};
|
1395
|
-
|
1036
|
+
var useDefaultValuesForForm = (context) => {
|
1396
1037
|
const { formId, defaultValuesProp } = context;
|
1397
1038
|
const hydrated = useFormStore(formId, (state) => state.isHydrated);
|
1398
1039
|
const errorResponse = useErrorResponseForForm(context);
|
@@ -1400,7 +1041,7 @@ const useDefaultValuesForForm = (context) => {
|
|
1400
1041
|
if (hydrated)
|
1401
1042
|
return hydratable.hydratedData();
|
1402
1043
|
if (errorResponse == null ? void 0 : errorResponse.repopulateFields) {
|
1403
|
-
|
1044
|
+
invariant3(
|
1404
1045
|
typeof errorResponse.repopulateFields === "object",
|
1405
1046
|
"repopulateFields returned something other than an object"
|
1406
1047
|
);
|
@@ -1410,14 +1051,14 @@ const useDefaultValuesForForm = (context) => {
|
|
1410
1051
|
return hydratable.serverData(defaultValuesProp);
|
1411
1052
|
return hydratable.serverData(defaultValuesFromLoader);
|
1412
1053
|
};
|
1413
|
-
|
1054
|
+
var useHasActiveFormSubmit = ({
|
1414
1055
|
fetcher
|
1415
1056
|
}) => {
|
1416
1057
|
const transition = useTransition();
|
1417
1058
|
const hasActiveSubmission = fetcher ? fetcher.state === "submitting" : !!transition.submission;
|
1418
1059
|
return hasActiveSubmission;
|
1419
1060
|
};
|
1420
|
-
|
1061
|
+
var useFieldTouched = (field, { formId }) => {
|
1421
1062
|
const touched = useFormStore(formId, (state) => state.touchedFields[field]);
|
1422
1063
|
const setFieldTouched = useFormStore(formId, (state) => state.setTouched);
|
1423
1064
|
const setTouched = useCallback(
|
@@ -1426,7 +1067,7 @@ const useFieldTouched = (field, { formId }) => {
|
|
1426
1067
|
);
|
1427
1068
|
return [touched, setTouched];
|
1428
1069
|
};
|
1429
|
-
|
1070
|
+
var useFieldError = (name, context) => {
|
1430
1071
|
const fieldErrors = useFieldErrorsForForm(context);
|
1431
1072
|
const state = useFormStore(
|
1432
1073
|
context.formId,
|
@@ -1434,54 +1075,57 @@ const useFieldError = (name, context) => {
|
|
1434
1075
|
);
|
1435
1076
|
return fieldErrors.map((fieldErrors2) => fieldErrors2 == null ? void 0 : fieldErrors2[name]).hydrateTo(state);
|
1436
1077
|
};
|
1437
|
-
|
1078
|
+
var useClearError = (context) => {
|
1438
1079
|
const { formId } = context;
|
1439
1080
|
return useFormStore(formId, (state) => state.clearFieldError);
|
1440
1081
|
};
|
1441
|
-
|
1442
|
-
|
1082
|
+
var useCurrentDefaultValueForField = (formId, field) => useFormStore(formId, (state) => getPath(state.currentDefaultValues, field));
|
1083
|
+
var useFieldDefaultValue = (name, context) => {
|
1443
1084
|
const defaultValues = useDefaultValuesForForm(context);
|
1444
1085
|
const state = useCurrentDefaultValueForField(context.formId, name);
|
1445
1086
|
return defaultValues.map((val) => getPath(val, name)).hydrateTo(state);
|
1446
1087
|
};
|
1447
|
-
|
1448
|
-
|
1449
|
-
|
1450
|
-
|
1451
|
-
|
1452
|
-
|
1088
|
+
var useInternalIsSubmitting = (formId) => useFormStore(formId, (state) => state.isSubmitting);
|
1089
|
+
var useInternalIsValid = (formId) => useFormStore(formId, (state) => state.isValid());
|
1090
|
+
var useInternalHasBeenSubmitted = (formId) => useFormStore(formId, (state) => state.hasBeenSubmitted);
|
1091
|
+
var useValidateField = (formId) => useFormStore(formId, (state) => state.validateField);
|
1092
|
+
var useValidate = (formId) => useFormStore(formId, (state) => state.validate);
|
1093
|
+
var noOpReceiver = () => () => {
|
1453
1094
|
};
|
1454
|
-
|
1095
|
+
var useRegisterReceiveFocus = (formId) => useFormStore(
|
1455
1096
|
formId,
|
1456
1097
|
(state) => {
|
1457
1098
|
var _a, _b;
|
1458
1099
|
return (_b = (_a = state.formProps) == null ? void 0 : _a.registerReceiveFocus) != null ? _b : noOpReceiver;
|
1459
1100
|
}
|
1460
1101
|
);
|
1461
|
-
|
1462
|
-
|
1102
|
+
var defaultDefaultValues = {};
|
1103
|
+
var useSyncedDefaultValues = (formId) => useFormStore(
|
1463
1104
|
formId,
|
1464
1105
|
(state) => {
|
1465
1106
|
var _a, _b;
|
1466
1107
|
return (_b = (_a = state.formProps) == null ? void 0 : _a.defaultValues) != null ? _b : defaultDefaultValues;
|
1467
1108
|
}
|
1468
1109
|
);
|
1469
|
-
|
1470
|
-
|
1471
|
-
|
1472
|
-
|
1473
|
-
|
1474
|
-
|
1475
|
-
|
1110
|
+
var useSetTouched = ({ formId }) => useFormStore(formId, (state) => state.setTouched);
|
1111
|
+
var useTouchedFields = (formId) => useFormStore(formId, (state) => state.touchedFields);
|
1112
|
+
var useFieldErrors = (formId) => useFormStore(formId, (state) => state.fieldErrors);
|
1113
|
+
var useSetFieldErrors = (formId) => useFormStore(formId, (state) => state.setFieldErrors);
|
1114
|
+
var useResetFormElement = (formId) => useFormStore(formId, (state) => state.resetFormElement);
|
1115
|
+
var useSubmitForm = (formId) => useFormStore(formId, (state) => state.submit);
|
1116
|
+
var useFormActionProp = (formId) => useFormStore(formId, (state) => {
|
1476
1117
|
var _a;
|
1477
1118
|
return (_a = state.formProps) == null ? void 0 : _a.action;
|
1478
1119
|
});
|
1479
|
-
|
1120
|
+
var useFormSubactionProp = (formId) => useFormStore(formId, (state) => {
|
1480
1121
|
var _a;
|
1481
1122
|
return (_a = state.formProps) == null ? void 0 : _a.subaction;
|
1482
1123
|
});
|
1483
|
-
|
1484
|
-
|
1124
|
+
var useFormValues = (formId) => useFormStore(formId, (state) => state.getValues);
|
1125
|
+
|
1126
|
+
// src/internal/state/controlledFields.ts
|
1127
|
+
import { useCallback as useCallback2, useEffect } from "react";
|
1128
|
+
var useControlledFieldValue = (context, field) => {
|
1485
1129
|
const value = useFormStore(
|
1486
1130
|
context.formId,
|
1487
1131
|
(state) => state.controlledFields.getValue(field)
|
@@ -1493,7 +1137,7 @@ const useControlledFieldValue = (context, field) => {
|
|
1493
1137
|
const defaultValue = useFieldDefaultValue(field, context);
|
1494
1138
|
return isFormHydrated ? value : defaultValue;
|
1495
1139
|
};
|
1496
|
-
|
1140
|
+
var useRegisterControlledField = (context, field) => {
|
1497
1141
|
const resolveUpdate = useFormStore(
|
1498
1142
|
context.formId,
|
1499
1143
|
(state) => state.controlledFields.valueUpdateResolvers[field]
|
@@ -1514,38 +1158,40 @@ const useRegisterControlledField = (context, field) => {
|
|
1514
1158
|
return () => unregister(field);
|
1515
1159
|
}, [context.formId, field, register, unregister]);
|
1516
1160
|
};
|
1517
|
-
|
1161
|
+
var useControllableValue = (context, field) => {
|
1518
1162
|
useRegisterControlledField(context, field);
|
1519
1163
|
const setControlledFieldValue = useFormStore(
|
1520
1164
|
context.formId,
|
1521
1165
|
(state) => state.controlledFields.setValue
|
1522
1166
|
);
|
1523
|
-
const setValue =
|
1167
|
+
const setValue = useCallback2(
|
1524
1168
|
(value2) => setControlledFieldValue(field, value2),
|
1525
1169
|
[field, setControlledFieldValue]
|
1526
1170
|
);
|
1527
1171
|
const value = useControlledFieldValue(context, field);
|
1528
1172
|
return [value, setValue];
|
1529
1173
|
};
|
1530
|
-
|
1174
|
+
var useUpdateControllableValue = (formId) => {
|
1531
1175
|
const setValue = useFormStore(
|
1532
1176
|
formId,
|
1533
1177
|
(state) => state.controlledFields.setValue
|
1534
1178
|
);
|
1535
|
-
return
|
1179
|
+
return useCallback2(
|
1536
1180
|
(field, value) => setValue(field, value),
|
1537
1181
|
[setValue]
|
1538
1182
|
);
|
1539
1183
|
};
|
1540
|
-
|
1184
|
+
|
1185
|
+
// src/hooks.ts
|
1186
|
+
var useIsSubmitting = (formId) => {
|
1541
1187
|
const formContext = useInternalFormContext(formId, "useIsSubmitting");
|
1542
1188
|
return useInternalIsSubmitting(formContext.formId);
|
1543
1189
|
};
|
1544
|
-
|
1190
|
+
var useIsValid = (formId) => {
|
1545
1191
|
const formContext = useInternalFormContext(formId, "useIsValid");
|
1546
1192
|
return useInternalIsValid(formContext.formId);
|
1547
1193
|
};
|
1548
|
-
|
1194
|
+
var useField = (name, options) => {
|
1549
1195
|
const { formId: providedFormId, handleReceiveFocus } = options != null ? options : {};
|
1550
1196
|
const formContext = useInternalFormContext(providedFormId, "useField");
|
1551
1197
|
const defaultValue = useFieldDefaultValue(name, formContext);
|
@@ -1555,7 +1201,7 @@ const useField = (name, options) => {
|
|
1555
1201
|
const hasBeenSubmitted = useInternalHasBeenSubmitted(formContext.formId);
|
1556
1202
|
const validateField = useValidateField(formContext.formId);
|
1557
1203
|
const registerReceiveFocus = useRegisterReceiveFocus(formContext.formId);
|
1558
|
-
|
1204
|
+
useEffect2(() => {
|
1559
1205
|
if (handleReceiveFocus)
|
1560
1206
|
return registerReceiveFocus(name, handleReceiveFocus);
|
1561
1207
|
}, [handleReceiveFocus, name, registerReceiveFocus]);
|
@@ -1593,38 +1239,18 @@ const useField = (name, options) => {
|
|
1593
1239
|
]);
|
1594
1240
|
return field;
|
1595
1241
|
};
|
1596
|
-
|
1242
|
+
var useControlField = (name, formId) => {
|
1597
1243
|
const context = useInternalFormContext(formId, "useControlField");
|
1598
1244
|
const [value, setValue] = useControllableValue(context, name);
|
1599
1245
|
return [value, setValue];
|
1600
1246
|
};
|
1601
|
-
|
1247
|
+
var useUpdateControlledField = (formId) => {
|
1602
1248
|
const context = useInternalFormContext(formId, "useControlField");
|
1603
1249
|
return useUpdateControllableValue(context.formId);
|
1604
1250
|
};
|
1605
|
-
|
1606
|
-
|
1607
|
-
|
1608
|
-
* Copyright (c) Remix Software Inc.
|
1609
|
-
*
|
1610
|
-
* This source code is licensed under the MIT license found in the
|
1611
|
-
* LICENSE.md file in the root directory of this source tree.
|
1612
|
-
*
|
1613
|
-
* @license MIT
|
1614
|
-
*/
|
1615
|
-
const json = (data, init = {}) => {
|
1616
|
-
let responseInit = typeof init === "number" ? {
|
1617
|
-
status: init
|
1618
|
-
} : init;
|
1619
|
-
let headers = new Headers(responseInit.headers);
|
1620
|
-
if (!headers.has("Content-Type")) {
|
1621
|
-
headers.set("Content-Type", "application/json; charset=utf-8");
|
1622
|
-
}
|
1623
|
-
return new Response(JSON.stringify(data), {
|
1624
|
-
...responseInit,
|
1625
|
-
headers
|
1626
|
-
});
|
1627
|
-
};
|
1251
|
+
|
1252
|
+
// src/server.ts
|
1253
|
+
import { json } from "@remix-run/server-runtime";
|
1628
1254
|
function validationError(error, repopulateFields, init) {
|
1629
1255
|
return json(
|
1630
1256
|
{
|
@@ -1636,10 +1262,27 @@ function validationError(error, repopulateFields, init) {
|
|
1636
1262
|
{ status: 422, ...init }
|
1637
1263
|
);
|
1638
1264
|
}
|
1639
|
-
|
1265
|
+
var setFormDefaults = (formId, defaultValues) => ({
|
1640
1266
|
[formDefaultValuesKey(formId)]: defaultValues
|
1641
1267
|
});
|
1642
|
-
|
1268
|
+
|
1269
|
+
// src/ValidatedForm.tsx
|
1270
|
+
import {
|
1271
|
+
Form as RemixForm,
|
1272
|
+
useSubmit
|
1273
|
+
} from "@remix-run/react";
|
1274
|
+
import {
|
1275
|
+
useCallback as useCallback4,
|
1276
|
+
useEffect as useEffect5,
|
1277
|
+
useMemo as useMemo2,
|
1278
|
+
useRef as useRef4,
|
1279
|
+
useState
|
1280
|
+
} from "react";
|
1281
|
+
import * as R4 from "remeda";
|
1282
|
+
|
1283
|
+
// src/internal/MultiValueMap.ts
|
1284
|
+
import { useCallback as useCallback3, useRef } from "react";
|
1285
|
+
var MultiValueMap = class {
|
1643
1286
|
constructor() {
|
1644
1287
|
this.dict = /* @__PURE__ */ new Map();
|
1645
1288
|
this.add = (key, value) => {
|
@@ -1670,19 +1313,22 @@ class MultiValueMap {
|
|
1670
1313
|
this.values = () => this.dict.values();
|
1671
1314
|
this.has = (key) => this.dict.has(key);
|
1672
1315
|
}
|
1673
|
-
}
|
1674
|
-
|
1316
|
+
};
|
1317
|
+
var useMultiValueMap = () => {
|
1675
1318
|
const ref = useRef(null);
|
1676
|
-
return
|
1319
|
+
return useCallback3(() => {
|
1677
1320
|
if (ref.current)
|
1678
1321
|
return ref.current;
|
1679
1322
|
ref.current = new MultiValueMap();
|
1680
1323
|
return ref.current;
|
1681
1324
|
}, []);
|
1682
1325
|
};
|
1326
|
+
|
1327
|
+
// src/internal/submissionCallbacks.ts
|
1328
|
+
import { useEffect as useEffect3, useRef as useRef2 } from "react";
|
1683
1329
|
function useSubmitComplete(isSubmitting, callback) {
|
1684
|
-
const isPending =
|
1685
|
-
|
1330
|
+
const isPending = useRef2(false);
|
1331
|
+
useEffect3(() => {
|
1686
1332
|
if (isSubmitting) {
|
1687
1333
|
isPending.current = true;
|
1688
1334
|
}
|
@@ -1692,7 +1338,11 @@ function useSubmitComplete(isSubmitting, callback) {
|
|
1692
1338
|
}
|
1693
1339
|
});
|
1694
1340
|
}
|
1695
|
-
|
1341
|
+
|
1342
|
+
// src/internal/util.ts
|
1343
|
+
import { useEffect as useEffect4, useLayoutEffect, useRef as useRef3 } from "react";
|
1344
|
+
import * as R3 from "remeda";
|
1345
|
+
var mergeRefs = (refs) => {
|
1696
1346
|
return (value) => {
|
1697
1347
|
refs.filter(Boolean).forEach((ref) => {
|
1698
1348
|
if (typeof ref === "function") {
|
@@ -1703,22 +1353,25 @@ const mergeRefs = (refs) => {
|
|
1703
1353
|
});
|
1704
1354
|
};
|
1705
1355
|
};
|
1706
|
-
|
1707
|
-
|
1708
|
-
const ref =
|
1709
|
-
const areEqual = ref.current === item || equals(ref.current, item);
|
1710
|
-
|
1356
|
+
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? useLayoutEffect : useEffect4;
|
1357
|
+
var useDeepEqualsMemo = (item) => {
|
1358
|
+
const ref = useRef3(item);
|
1359
|
+
const areEqual = ref.current === item || R3.equals(ref.current, item);
|
1360
|
+
useEffect4(() => {
|
1711
1361
|
if (!areEqual) {
|
1712
1362
|
ref.current = item;
|
1713
1363
|
}
|
1714
1364
|
});
|
1715
1365
|
return areEqual ? ref.current : item;
|
1716
1366
|
};
|
1717
|
-
|
1367
|
+
|
1368
|
+
// src/ValidatedForm.tsx
|
1369
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
1370
|
+
var getDataFromForm = (el) => new FormData(el);
|
1718
1371
|
function nonNull(value) {
|
1719
1372
|
return value !== null;
|
1720
1373
|
}
|
1721
|
-
|
1374
|
+
var focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) => {
|
1722
1375
|
var _a;
|
1723
1376
|
const namesInOrder = [...formElement.elements].map((el) => {
|
1724
1377
|
const input = el instanceof RadioNodeList ? el[0] : el;
|
@@ -1726,7 +1379,7 @@ const focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) =
|
|
1726
1379
|
return input.name;
|
1727
1380
|
return null;
|
1728
1381
|
}).filter(nonNull).filter((name) => name in fieldErrors);
|
1729
|
-
const uniqueNamesInOrder = uniq(namesInOrder);
|
1382
|
+
const uniqueNamesInOrder = R4.uniq(namesInOrder);
|
1730
1383
|
for (const fieldName of uniqueNamesInOrder) {
|
1731
1384
|
if (customFocusHandlers.has(fieldName)) {
|
1732
1385
|
customFocusHandlers.getAll(fieldName).forEach((handler) => {
|
@@ -1755,11 +1408,11 @@ const focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) =
|
|
1755
1408
|
}
|
1756
1409
|
}
|
1757
1410
|
};
|
1758
|
-
|
1411
|
+
var useFormId = (providedId) => {
|
1759
1412
|
const [symbolId] = useState(() => Symbol("remix-validated-form-id"));
|
1760
1413
|
return providedId != null ? providedId : symbolId;
|
1761
1414
|
};
|
1762
|
-
|
1415
|
+
var FormResetter = ({
|
1763
1416
|
resetAfterSubmit,
|
1764
1417
|
formRef
|
1765
1418
|
}) => {
|
@@ -1809,7 +1462,7 @@ function ValidatedForm({
|
|
1809
1462
|
var _a;
|
1810
1463
|
const formId = useFormId(id);
|
1811
1464
|
const providedDefaultValues = useDeepEqualsMemo(unMemoizedDefaults);
|
1812
|
-
const contextValue =
|
1465
|
+
const contextValue = useMemo2(
|
1813
1466
|
() => ({
|
1814
1467
|
formId,
|
1815
1468
|
action,
|
@@ -1822,8 +1475,8 @@ function ValidatedForm({
|
|
1822
1475
|
const backendError = useErrorResponseForForm(contextValue);
|
1823
1476
|
const backendDefaultValues = useDefaultValuesFromLoader(contextValue);
|
1824
1477
|
const hasActiveSubmission = useHasActiveFormSubmit(contextValue);
|
1825
|
-
const formRef =
|
1826
|
-
const Form
|
1478
|
+
const formRef = useRef4(null);
|
1479
|
+
const Form = (_a = fetcher == null ? void 0 : fetcher.Form) != null ? _a : RemixForm;
|
1827
1480
|
const submit = useSubmit();
|
1828
1481
|
const setFieldErrors = useSetFieldErrors(formId);
|
1829
1482
|
const setFieldError = useFormStore(formId, (state) => state.setFieldError);
|
@@ -1838,7 +1491,7 @@ function ValidatedForm({
|
|
1838
1491
|
const cleanupForm = useRootFormStore((state) => state.cleanupForm);
|
1839
1492
|
const registerForm = useRootFormStore((state) => state.registerForm);
|
1840
1493
|
const customFocusHandlers = useMultiValueMap();
|
1841
|
-
const registerReceiveFocus =
|
1494
|
+
const registerReceiveFocus = useCallback4(
|
1842
1495
|
(fieldName, handler) => {
|
1843
1496
|
customFocusHandlers().add(fieldName, handler);
|
1844
1497
|
return () => {
|
@@ -1872,17 +1525,30 @@ function ValidatedForm({
|
|
1872
1525
|
useIsomorphicLayoutEffect(() => {
|
1873
1526
|
setFormElementInState(formRef.current);
|
1874
1527
|
}, [setFormElementInState]);
|
1875
|
-
|
1528
|
+
useEffect5(() => {
|
1876
1529
|
var _a2;
|
1877
1530
|
setFieldErrors((_a2 = backendError == null ? void 0 : backendError.fieldErrors) != null ? _a2 : {});
|
1878
|
-
|
1531
|
+
if (!disableFocusOnError && (backendError == null ? void 0 : backendError.fieldErrors)) {
|
1532
|
+
focusFirstInvalidInput(
|
1533
|
+
backendError.fieldErrors,
|
1534
|
+
customFocusHandlers(),
|
1535
|
+
formRef.current
|
1536
|
+
);
|
1537
|
+
}
|
1538
|
+
}, [
|
1539
|
+
backendError == null ? void 0 : backendError.fieldErrors,
|
1540
|
+
customFocusHandlers,
|
1541
|
+
disableFocusOnError,
|
1542
|
+
setFieldErrors,
|
1543
|
+
setFieldError
|
1544
|
+
]);
|
1879
1545
|
useSubmitComplete(hasActiveSubmission, () => {
|
1880
1546
|
endSubmit();
|
1881
1547
|
});
|
1882
|
-
const handleSubmit = async (
|
1548
|
+
const handleSubmit = async (e, target, nativeEvent) => {
|
1883
1549
|
startSubmit();
|
1884
1550
|
const submitter = nativeEvent.submitter;
|
1885
|
-
const formDataToValidate = getDataFromForm(
|
1551
|
+
const formDataToValidate = getDataFromForm(e.currentTarget);
|
1886
1552
|
if (submitter == null ? void 0 : submitter.name) {
|
1887
1553
|
formDataToValidate.append(submitter.name, submitter.value);
|
1888
1554
|
}
|
@@ -1899,14 +1565,14 @@ function ValidatedForm({
|
|
1899
1565
|
}
|
1900
1566
|
} else {
|
1901
1567
|
setFieldErrors({});
|
1902
|
-
const eventProxy = formEventProxy(
|
1568
|
+
const eventProxy = formEventProxy(e);
|
1903
1569
|
await (onSubmit == null ? void 0 : onSubmit(result.data, eventProxy));
|
1904
1570
|
if (eventProxy.defaultPrevented) {
|
1905
1571
|
endSubmit();
|
1906
1572
|
return;
|
1907
1573
|
}
|
1908
1574
|
if (fetcher)
|
1909
|
-
fetcher.submit(submitter ||
|
1575
|
+
fetcher.submit(submitter || e.currentTarget);
|
1910
1576
|
else
|
1911
1577
|
submit(submitter || target, {
|
1912
1578
|
replace: replace2,
|
@@ -1914,43 +1580,44 @@ function ValidatedForm({
|
|
1914
1580
|
});
|
1915
1581
|
}
|
1916
1582
|
};
|
1917
|
-
return /* @__PURE__ */
|
1918
|
-
|
1919
|
-
|
1920
|
-
|
1921
|
-
|
1922
|
-
|
1923
|
-
|
1924
|
-
|
1925
|
-
|
1926
|
-
|
1927
|
-
|
1928
|
-
|
1929
|
-
|
1930
|
-
|
1931
|
-
|
1932
|
-
|
1933
|
-
|
1934
|
-
|
1935
|
-
|
1936
|
-
|
1583
|
+
return /* @__PURE__ */ jsx(
|
1584
|
+
Form,
|
1585
|
+
{
|
1586
|
+
ref: mergeRefs([formRef, formRefProp]),
|
1587
|
+
...rest,
|
1588
|
+
id,
|
1589
|
+
action,
|
1590
|
+
method,
|
1591
|
+
replace: replace2,
|
1592
|
+
onSubmit: (e) => {
|
1593
|
+
e.preventDefault();
|
1594
|
+
handleSubmit(
|
1595
|
+
e,
|
1596
|
+
e.currentTarget,
|
1597
|
+
e.nativeEvent
|
1598
|
+
);
|
1599
|
+
},
|
1600
|
+
onReset: (event) => {
|
1601
|
+
onReset == null ? void 0 : onReset(event);
|
1602
|
+
if (event.defaultPrevented)
|
1603
|
+
return;
|
1604
|
+
reset();
|
1605
|
+
},
|
1606
|
+
children: /* @__PURE__ */ jsx(InternalFormContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(Fragment, { children: [
|
1607
|
+
/* @__PURE__ */ jsx(FormResetter, { formRef, resetAfterSubmit }),
|
1608
|
+
subaction && /* @__PURE__ */ jsx("input", { type: "hidden", value: subaction, name: "subaction" }),
|
1609
|
+
id && /* @__PURE__ */ jsx("input", { type: "hidden", value: id, name: FORM_ID_FIELD }),
|
1610
|
+
children
|
1611
|
+
] }) })
|
1937
1612
|
}
|
1938
|
-
|
1939
|
-
value: contextValue
|
1940
|
-
}, /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FormResetter, {
|
1941
|
-
formRef,
|
1942
|
-
resetAfterSubmit
|
1943
|
-
}), subaction && /* @__PURE__ */ React.createElement("input", {
|
1944
|
-
type: "hidden",
|
1945
|
-
value: subaction,
|
1946
|
-
name: "subaction"
|
1947
|
-
}), id && /* @__PURE__ */ React.createElement("input", {
|
1948
|
-
type: "hidden",
|
1949
|
-
value: id,
|
1950
|
-
name: FORM_ID_FIELD
|
1951
|
-
}), children)));
|
1613
|
+
);
|
1952
1614
|
}
|
1953
|
-
|
1615
|
+
|
1616
|
+
// src/validation/createValidator.ts
|
1617
|
+
import * as R5 from "remeda";
|
1618
|
+
|
1619
|
+
// src/internal/flatten.ts
|
1620
|
+
var objectFromPathEntries = (entries) => {
|
1954
1621
|
const map = new MultiValueMap();
|
1955
1622
|
entries.forEach(([key, value]) => map.add(key, value));
|
1956
1623
|
return [...map.entries()].reduce(
|
@@ -1958,12 +1625,14 @@ const objectFromPathEntries = (entries) => {
|
|
1958
1625
|
{}
|
1959
1626
|
);
|
1960
1627
|
};
|
1961
|
-
|
1628
|
+
|
1629
|
+
// src/validation/createValidator.ts
|
1630
|
+
var preprocessFormData = (data) => {
|
1962
1631
|
if ("entries" in data && typeof data.entries === "function")
|
1963
1632
|
return objectFromPathEntries([...data.entries()]);
|
1964
1633
|
return objectFromPathEntries(Object.entries(data));
|
1965
1634
|
};
|
1966
|
-
|
1635
|
+
var omitInternalFields = (data) => R5.omit(data, [FORM_ID_FIELD]);
|
1967
1636
|
function createValidator(validator) {
|
1968
1637
|
return {
|
1969
1638
|
validate: async (value) => {
|
@@ -1991,7 +1660,13 @@ function createValidator(validator) {
|
|
1991
1660
|
validateField: (data, field) => validator.validateField(preprocessFormData(data), field)
|
1992
1661
|
};
|
1993
1662
|
}
|
1994
|
-
|
1663
|
+
|
1664
|
+
// src/userFacingFormContext.ts
|
1665
|
+
import { useCallback as useCallback5, useMemo as useMemo4 } from "react";
|
1666
|
+
|
1667
|
+
// src/unreleased/formStateHooks.ts
|
1668
|
+
import { useMemo as useMemo3 } from "react";
|
1669
|
+
var useFormState = (formId) => {
|
1995
1670
|
const formContext = useInternalFormContext(formId, "useFormState");
|
1996
1671
|
const isSubmitting = useInternalIsSubmitting(formContext.formId);
|
1997
1672
|
const hasBeenSubmitted = useInternalHasBeenSubmitted(formContext.formId);
|
@@ -2005,7 +1680,7 @@ const useFormState = (formId) => {
|
|
2005
1680
|
const fieldErrorsFromState = useFieldErrors(formContext.formId);
|
2006
1681
|
const fieldErrorsToUse = useFieldErrorsForForm(formContext);
|
2007
1682
|
const hydratedFieldErrors = fieldErrorsToUse.hydrateTo(fieldErrorsFromState);
|
2008
|
-
return
|
1683
|
+
return useMemo3(
|
2009
1684
|
() => ({
|
2010
1685
|
action,
|
2011
1686
|
subaction,
|
@@ -2028,7 +1703,7 @@ const useFormState = (formId) => {
|
|
2028
1703
|
]
|
2029
1704
|
);
|
2030
1705
|
};
|
2031
|
-
|
1706
|
+
var useFormHelpers = (formId) => {
|
2032
1707
|
const formContext = useInternalFormContext(formId, "useFormHelpers");
|
2033
1708
|
const setTouched = useSetTouched(formContext);
|
2034
1709
|
const validateField = useValidateField(formContext.formId);
|
@@ -2038,7 +1713,7 @@ const useFormHelpers = (formId) => {
|
|
2038
1713
|
const reset = useResetFormElement(formContext.formId);
|
2039
1714
|
const submit = useSubmitForm(formContext.formId);
|
2040
1715
|
const getValues = useFormValues(formContext.formId);
|
2041
|
-
return
|
1716
|
+
return useMemo3(
|
2042
1717
|
() => ({
|
2043
1718
|
setTouched,
|
2044
1719
|
validateField,
|
@@ -2061,7 +1736,9 @@ const useFormHelpers = (formId) => {
|
|
2061
1736
|
]
|
2062
1737
|
);
|
2063
1738
|
};
|
2064
|
-
|
1739
|
+
|
1740
|
+
// src/userFacingFormContext.ts
|
1741
|
+
var useFormContext = (formId) => {
|
2065
1742
|
const context = useInternalFormContext(formId, "useFormContext");
|
2066
1743
|
const state = useFormState(formId);
|
2067
1744
|
const {
|
@@ -2075,7 +1752,7 @@ const useFormContext = (formId) => {
|
|
2075
1752
|
getValues
|
2076
1753
|
} = useFormHelpers(formId);
|
2077
1754
|
const registerReceiveFocus = useRegisterReceiveFocus(context.formId);
|
2078
|
-
const clearError =
|
1755
|
+
const clearError = useCallback5(
|
2079
1756
|
(...names) => {
|
2080
1757
|
names.forEach((name) => {
|
2081
1758
|
internalClearError(name);
|
@@ -2083,7 +1760,7 @@ const useFormContext = (formId) => {
|
|
2083
1760
|
},
|
2084
1761
|
[internalClearError]
|
2085
1762
|
);
|
2086
|
-
return
|
1763
|
+
return useMemo4(
|
2087
1764
|
() => ({
|
2088
1765
|
...state,
|
2089
1766
|
setFieldTouched: setTouched,
|
@@ -2110,7 +1787,13 @@ const useFormContext = (formId) => {
|
|
2110
1787
|
]
|
2111
1788
|
);
|
2112
1789
|
};
|
2113
|
-
|
1790
|
+
|
1791
|
+
// src/internal/state/fieldArray.tsx
|
1792
|
+
import { useMemo as useMemo5 } from "react";
|
1793
|
+
import { useCallback as useCallback6 } from "react";
|
1794
|
+
import invariant4 from "tiny-invariant";
|
1795
|
+
import { Fragment as Fragment2, jsx as jsx2 } from "react/jsx-runtime";
|
1796
|
+
var useInternalFieldArray = (context, field, validationBehavior) => {
|
2114
1797
|
const value = useFieldDefaultValue(field, context);
|
2115
1798
|
useRegisterControlledField(context, field);
|
2116
1799
|
const hasBeenSubmitted = useInternalHasBeenSubmitted(context.formId);
|
@@ -2122,12 +1805,12 @@ const useInternalFieldArray = (context, field, validationBehavior) => {
|
|
2122
1805
|
...validationBehavior
|
2123
1806
|
};
|
2124
1807
|
const behavior = hasBeenSubmitted ? resolvedValidationBehavior.whenSubmitted : resolvedValidationBehavior.initial;
|
2125
|
-
const maybeValidate =
|
1808
|
+
const maybeValidate = useCallback6(() => {
|
2126
1809
|
if (behavior === "onChange") {
|
2127
1810
|
validateField(field);
|
2128
1811
|
}
|
2129
1812
|
}, [behavior, field, validateField]);
|
2130
|
-
|
1813
|
+
invariant4(
|
2131
1814
|
value === void 0 || value === null || Array.isArray(value),
|
2132
1815
|
`FieldArray: defaultValue value for ${field} must be an array, null, or undefined`
|
2133
1816
|
);
|
@@ -2135,7 +1818,7 @@ const useInternalFieldArray = (context, field, validationBehavior) => {
|
|
2135
1818
|
context.formId,
|
2136
1819
|
(state) => state.controlledFields.array
|
2137
1820
|
);
|
2138
|
-
const helpers =
|
1821
|
+
const helpers = useMemo5(
|
2139
1822
|
() => ({
|
2140
1823
|
push: (item) => {
|
2141
1824
|
arr.push(field, item);
|
@@ -2172,14 +1855,14 @@ const useInternalFieldArray = (context, field, validationBehavior) => {
|
|
2172
1855
|
}),
|
2173
1856
|
[arr, field, maybeValidate]
|
2174
1857
|
);
|
2175
|
-
const arrayValue =
|
1858
|
+
const arrayValue = useMemo5(() => value != null ? value : [], [value]);
|
2176
1859
|
return [arrayValue, helpers, error];
|
2177
1860
|
};
|
2178
1861
|
function useFieldArray(name, { formId, validationBehavior } = {}) {
|
2179
1862
|
const context = useInternalFormContext(formId, "FieldArray");
|
2180
1863
|
return useInternalFieldArray(context, name, validationBehavior);
|
2181
1864
|
}
|
2182
|
-
|
1865
|
+
var FieldArray = ({
|
2183
1866
|
name,
|
2184
1867
|
children,
|
2185
1868
|
formId,
|
@@ -2191,7 +1874,20 @@ const FieldArray = ({
|
|
2191
1874
|
name,
|
2192
1875
|
validationBehavior
|
2193
1876
|
);
|
2194
|
-
return /* @__PURE__ */
|
1877
|
+
return /* @__PURE__ */ jsx2(Fragment2, { children: children(value, helpers, error) });
|
1878
|
+
};
|
1879
|
+
export {
|
1880
|
+
FieldArray,
|
1881
|
+
ValidatedForm,
|
1882
|
+
createValidator,
|
1883
|
+
setFormDefaults,
|
1884
|
+
useControlField,
|
1885
|
+
useField,
|
1886
|
+
useFieldArray,
|
1887
|
+
useFormContext,
|
1888
|
+
useIsSubmitting,
|
1889
|
+
useIsValid,
|
1890
|
+
useUpdateControlledField,
|
1891
|
+
validationError
|
2195
1892
|
};
|
2196
|
-
|
2197
|
-
//# sourceMappingURL=remix-validated-form.es.js.map
|
1893
|
+
//# sourceMappingURL=index.esm.js.map
|