remix-validated-form 4.6.4 → 4.6.6
Sign up to get free protection for your applications and to get access to all the features.
- package/.turbo/turbo-build.log +12 -12
- package/.turbo/turbo-typecheck.log +1 -0
- package/README.md +10 -9
- package/browser/ValidatedForm.d.ts +3 -3
- package/browser/hooks.d.ts +1 -1
- package/browser/internal/formContext.d.ts +3 -3
- package/browser/internal/getInputProps.d.ts +7 -7
- package/browser/internal/hydratable.d.ts +1 -1
- package/browser/internal/state/createFormStore.d.ts +3 -3
- package/browser/internal/state/fieldArray.d.ts +5 -5
- package/browser/internal/state/types.d.ts +1 -1
- package/browser/server.d.ts +1 -1
- package/browser/unreleased/formStateHooks.d.ts +2 -2
- package/browser/userFacingFormContext.d.ts +1 -1
- package/browser/validation/types.d.ts +15 -15
- 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 -869
- package/dist/index.esm.js.map +1 -0
- package/package.json +14 -11
- package/src/ValidatedForm.tsx +19 -6
- package/src/hooks.ts +1 -1
- package/src/internal/formContext.ts +2 -2
- package/src/server.ts +1 -1
- package/stats.html +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,538 +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
|
-
function useStore(api, selector = api.getState, equalityFn) {
|
435
|
-
const slice = withSelector.exports.useSyncExternalStoreWithSelector(api.subscribe, api.getState, api.getServerState || api.getState, selector, equalityFn);
|
436
|
-
useDebugValue(slice);
|
437
|
-
return slice;
|
438
|
-
}
|
439
|
-
const createImpl = (createState) => {
|
440
|
-
const api = typeof createState === "function" ? createStore(createState) : createState;
|
441
|
-
const useBoundStore = (selector, equalityFn) => useStore(api, selector, equalityFn);
|
442
|
-
Object.assign(useBoundStore, api);
|
443
|
-
return useBoundStore;
|
444
|
-
};
|
445
|
-
const create = (createState) => createState ? createImpl(createState) : createImpl;
|
446
|
-
var create$1 = create;
|
447
|
-
function n(n2) {
|
448
|
-
for (var r2 = arguments.length, t2 = Array(r2 > 1 ? r2 - 1 : 0), e2 = 1; e2 < r2; e2++)
|
449
|
-
t2[e2 - 1] = arguments[e2];
|
450
|
-
throw Error("[Immer] minified error nr: " + n2 + (t2.length ? " " + t2.map(function(n3) {
|
451
|
-
return "'" + n3 + "'";
|
452
|
-
}).join(",") : "") + ". Find the full error at: https://bit.ly/3cXEKWf");
|
453
|
-
}
|
454
|
-
function r(n2) {
|
455
|
-
return !!n2 && !!n2[Q];
|
456
|
-
}
|
457
|
-
function t(n2) {
|
458
|
-
return !!n2 && (function(n3) {
|
459
|
-
if (!n3 || "object" != typeof n3)
|
460
|
-
return false;
|
461
|
-
var r2 = Object.getPrototypeOf(n3);
|
462
|
-
if (null === r2)
|
463
|
-
return true;
|
464
|
-
var t2 = Object.hasOwnProperty.call(r2, "constructor") && r2.constructor;
|
465
|
-
return t2 === Object || "function" == typeof t2 && Function.toString.call(t2) === Z;
|
466
|
-
}(n2) || Array.isArray(n2) || !!n2[L] || !!n2.constructor[L] || s(n2) || v(n2));
|
467
|
-
}
|
468
|
-
function i(n2, r2, t2) {
|
469
|
-
void 0 === t2 && (t2 = false), 0 === o(n2) ? (t2 ? Object.keys : nn)(n2).forEach(function(e2) {
|
470
|
-
t2 && "symbol" == typeof e2 || r2(e2, n2[e2], n2);
|
471
|
-
}) : n2.forEach(function(t3, e2) {
|
472
|
-
return r2(e2, t3, n2);
|
473
|
-
});
|
474
|
-
}
|
475
|
-
function o(n2) {
|
476
|
-
var r2 = n2[Q];
|
477
|
-
return r2 ? r2.i > 3 ? r2.i - 4 : r2.i : Array.isArray(n2) ? 1 : s(n2) ? 2 : v(n2) ? 3 : 0;
|
478
|
-
}
|
479
|
-
function u(n2, r2) {
|
480
|
-
return 2 === o(n2) ? n2.has(r2) : Object.prototype.hasOwnProperty.call(n2, r2);
|
481
|
-
}
|
482
|
-
function a(n2, r2) {
|
483
|
-
return 2 === o(n2) ? n2.get(r2) : n2[r2];
|
484
|
-
}
|
485
|
-
function f(n2, r2, t2) {
|
486
|
-
var e2 = o(n2);
|
487
|
-
2 === e2 ? n2.set(r2, t2) : 3 === e2 ? (n2.delete(r2), n2.add(t2)) : n2[r2] = t2;
|
488
|
-
}
|
489
|
-
function c(n2, r2) {
|
490
|
-
return n2 === r2 ? 0 !== n2 || 1 / n2 == 1 / r2 : n2 != n2 && r2 != r2;
|
491
|
-
}
|
492
|
-
function s(n2) {
|
493
|
-
return X && n2 instanceof Map;
|
494
|
-
}
|
495
|
-
function v(n2) {
|
496
|
-
return q && n2 instanceof Set;
|
497
|
-
}
|
498
|
-
function p(n2) {
|
499
|
-
return n2.o || n2.t;
|
500
|
-
}
|
501
|
-
function l(n2) {
|
502
|
-
if (Array.isArray(n2))
|
503
|
-
return Array.prototype.slice.call(n2);
|
504
|
-
var r2 = rn(n2);
|
505
|
-
delete r2[Q];
|
506
|
-
for (var t2 = nn(r2), e2 = 0; e2 < t2.length; e2++) {
|
507
|
-
var i2 = t2[e2], o2 = r2[i2];
|
508
|
-
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] });
|
509
|
-
}
|
510
|
-
return Object.create(Object.getPrototypeOf(n2), r2);
|
511
|
-
}
|
512
|
-
function d(n2, e2) {
|
513
|
-
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) {
|
514
|
-
return d(r2, true);
|
515
|
-
}, true), n2);
|
516
|
-
}
|
517
|
-
function h() {
|
518
|
-
n(2);
|
519
|
-
}
|
520
|
-
function y(n2) {
|
521
|
-
return null == n2 || "object" != typeof n2 || Object.isFrozen(n2);
|
522
|
-
}
|
523
|
-
function b(r2) {
|
524
|
-
var t2 = tn[r2];
|
525
|
-
return t2 || n(18, r2), t2;
|
526
|
-
}
|
527
|
-
function _() {
|
528
|
-
return U;
|
529
|
-
}
|
530
|
-
function j(n2, r2) {
|
531
|
-
r2 && (b("Patches"), n2.u = [], n2.s = [], n2.v = r2);
|
532
|
-
}
|
533
|
-
function O(n2) {
|
534
|
-
g(n2), n2.p.forEach(S), n2.p = null;
|
535
|
-
}
|
536
|
-
function g(n2) {
|
537
|
-
n2 === U && (U = n2.l);
|
538
|
-
}
|
539
|
-
function w(n2) {
|
540
|
-
return U = { p: [], l: U, h: n2, m: true, _: 0 };
|
541
|
-
}
|
542
|
-
function S(n2) {
|
543
|
-
var r2 = n2[Q];
|
544
|
-
0 === r2.i || 1 === r2.i ? r2.j() : r2.O = true;
|
545
|
-
}
|
546
|
-
function P(r2, e2) {
|
547
|
-
e2._ = e2.p.length;
|
548
|
-
var i2 = e2.p[0], o2 = void 0 !== r2 && r2 !== i2;
|
549
|
-
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;
|
550
|
-
}
|
551
|
-
function M(n2, r2, t2) {
|
552
|
-
if (y(r2))
|
553
|
-
return r2;
|
554
|
-
var e2 = r2[Q];
|
555
|
-
if (!e2)
|
556
|
-
return i(r2, function(i2, o3) {
|
557
|
-
return A(n2, e2, r2, i2, o3, t2);
|
558
|
-
}, true), r2;
|
559
|
-
if (e2.A !== n2)
|
560
|
-
return r2;
|
561
|
-
if (!e2.P)
|
562
|
-
return x(n2, e2.t, true), e2.t;
|
563
|
-
if (!e2.I) {
|
564
|
-
e2.I = true, e2.A._--;
|
565
|
-
var o2 = 4 === e2.i || 5 === e2.i ? e2.o = l(e2.k) : e2.o;
|
566
|
-
i(3 === e2.i ? new Set(o2) : o2, function(r3, i2) {
|
567
|
-
return A(n2, e2, o2, r3, i2, t2);
|
568
|
-
}), x(n2, o2, false), t2 && n2.u && b("Patches").R(e2, t2, n2.u, n2.s);
|
569
|
-
}
|
570
|
-
return e2.o;
|
571
|
-
}
|
572
|
-
function A(e2, i2, o2, a2, c2, s2) {
|
573
|
-
if (r(c2)) {
|
574
|
-
var v2 = M(e2, c2, s2 && i2 && 3 !== i2.i && !u(i2.D, a2) ? s2.concat(a2) : void 0);
|
575
|
-
if (f(o2, a2, v2), !r(v2))
|
576
|
-
return;
|
577
|
-
e2.m = false;
|
578
|
-
}
|
579
|
-
if (t(c2) && !y(c2)) {
|
580
|
-
if (!e2.h.F && e2._ < 1)
|
581
|
-
return;
|
582
|
-
M(e2, c2), i2 && i2.A.l || x(e2, c2);
|
583
|
-
}
|
584
|
-
}
|
585
|
-
function x(n2, r2, t2) {
|
586
|
-
void 0 === t2 && (t2 = false), n2.h.F && n2.m && d(r2, t2);
|
587
|
-
}
|
588
|
-
function z(n2, r2) {
|
589
|
-
var t2 = n2[Q];
|
590
|
-
return (t2 ? p(t2) : n2)[r2];
|
591
|
-
}
|
592
|
-
function I(n2, r2) {
|
593
|
-
if (r2 in n2)
|
594
|
-
for (var t2 = Object.getPrototypeOf(n2); t2; ) {
|
595
|
-
var e2 = Object.getOwnPropertyDescriptor(t2, r2);
|
596
|
-
if (e2)
|
597
|
-
return e2;
|
598
|
-
t2 = Object.getPrototypeOf(t2);
|
599
|
-
}
|
600
|
-
}
|
601
|
-
function k(n2) {
|
602
|
-
n2.P || (n2.P = true, n2.l && k(n2.l));
|
603
|
-
}
|
604
|
-
function E(n2) {
|
605
|
-
n2.o || (n2.o = l(n2.t));
|
606
|
-
}
|
607
|
-
function R(n2, r2, t2) {
|
608
|
-
var e2 = s(r2) ? b("MapSet").N(r2, t2) : v(r2) ? b("MapSet").T(r2, t2) : n2.g ? function(n3, r3) {
|
609
|
-
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;
|
610
|
-
t3 && (i2 = [e3], o2 = on);
|
611
|
-
var u2 = Proxy.revocable(i2, o2), a2 = u2.revoke, f2 = u2.proxy;
|
612
|
-
return e3.k = f2, e3.j = a2, f2;
|
613
|
-
}(r2, t2) : b("ES5").J(r2, t2);
|
614
|
-
return (t2 ? t2.A : _()).p.push(e2), e2;
|
615
|
-
}
|
616
|
-
function D(e2) {
|
617
|
-
return r(e2) || n(22, e2), function n2(r2) {
|
618
|
-
if (!t(r2))
|
619
|
-
return r2;
|
620
|
-
var e3, u2 = r2[Q], c2 = o(r2);
|
621
|
-
if (u2) {
|
622
|
-
if (!u2.P && (u2.i < 4 || !b("ES5").K(u2)))
|
623
|
-
return u2.t;
|
624
|
-
u2.I = true, e3 = F(r2, c2), u2.I = false;
|
625
|
-
} else
|
626
|
-
e3 = F(r2, c2);
|
627
|
-
return i(e3, function(r3, t2) {
|
628
|
-
u2 && a(u2.t, r3) === t2 || f(e3, r3, n2(t2));
|
629
|
-
}), 3 === c2 ? new Set(e3) : e3;
|
630
|
-
}(e2);
|
631
|
-
}
|
632
|
-
function F(n2, r2) {
|
633
|
-
switch (r2) {
|
634
|
-
case 2:
|
635
|
-
return new Map(n2);
|
636
|
-
case 3:
|
637
|
-
return Array.from(n2);
|
638
|
-
}
|
639
|
-
return l(n2);
|
640
|
-
}
|
641
|
-
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) {
|
642
|
-
return Object.getOwnPropertyNames(n2).concat(Object.getOwnPropertySymbols(n2));
|
643
|
-
} : Object.getOwnPropertyNames, rn = Object.getOwnPropertyDescriptors || function(n2) {
|
644
|
-
var r2 = {};
|
645
|
-
return nn(n2).forEach(function(t2) {
|
646
|
-
r2[t2] = Object.getOwnPropertyDescriptor(n2, t2);
|
647
|
-
}), r2;
|
648
|
-
}, tn = {}, en = { get: function(n2, r2) {
|
649
|
-
if (r2 === Q)
|
650
|
-
return n2;
|
651
|
-
var e2 = p(n2);
|
652
|
-
if (!u(e2, r2))
|
653
|
-
return function(n3, r3, t2) {
|
654
|
-
var e3, i3 = I(r3, t2);
|
655
|
-
return i3 ? "value" in i3 ? i3.value : null === (e3 = i3.get) || void 0 === e3 ? void 0 : e3.call(n3.k) : void 0;
|
656
|
-
}(n2, e2, r2);
|
657
|
-
var i2 = e2[r2];
|
658
|
-
return n2.I || !t(i2) ? i2 : i2 === z(n2.t, r2) ? (E(n2), n2.o[r2] = R(n2.A.h, i2, n2)) : i2;
|
659
|
-
}, has: function(n2, r2) {
|
660
|
-
return r2 in p(n2);
|
661
|
-
}, ownKeys: function(n2) {
|
662
|
-
return Reflect.ownKeys(p(n2));
|
663
|
-
}, set: function(n2, r2, t2) {
|
664
|
-
var e2 = I(p(n2), r2);
|
665
|
-
if (null == e2 ? void 0 : e2.set)
|
666
|
-
return e2.set.call(n2.k, t2), true;
|
667
|
-
if (!n2.P) {
|
668
|
-
var i2 = z(p(n2), r2), o2 = null == i2 ? void 0 : i2[Q];
|
669
|
-
if (o2 && o2.t === t2)
|
670
|
-
return n2.o[r2] = t2, n2.D[r2] = false, true;
|
671
|
-
if (c(t2, i2) && (void 0 !== t2 || u(n2.t, r2)))
|
672
|
-
return true;
|
673
|
-
E(n2), k(n2);
|
674
|
-
}
|
675
|
-
return n2.o[r2] === t2 && "number" != typeof t2 && (void 0 !== t2 || r2 in n2.o) || (n2.o[r2] = t2, n2.D[r2] = true, true);
|
676
|
-
}, deleteProperty: function(n2, r2) {
|
677
|
-
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;
|
678
|
-
}, getOwnPropertyDescriptor: function(n2, r2) {
|
679
|
-
var t2 = p(n2), e2 = Reflect.getOwnPropertyDescriptor(t2, r2);
|
680
|
-
return e2 ? { writable: true, configurable: 1 !== n2.i || "length" !== r2, enumerable: e2.enumerable, value: t2[r2] } : e2;
|
681
|
-
}, defineProperty: function() {
|
682
|
-
n(11);
|
683
|
-
}, getPrototypeOf: function(n2) {
|
684
|
-
return Object.getPrototypeOf(n2.t);
|
685
|
-
}, setPrototypeOf: function() {
|
686
|
-
n(12);
|
687
|
-
} }, on = {};
|
688
|
-
i(en, function(n2, r2) {
|
689
|
-
on[n2] = function() {
|
690
|
-
return arguments[0] = arguments[0][0], r2.apply(this, arguments);
|
691
|
-
};
|
692
|
-
}), on.deleteProperty = function(r2, t2) {
|
693
|
-
return on.set.call(this, r2, t2, void 0);
|
694
|
-
}, on.set = function(r2, t2, e2) {
|
695
|
-
return en.set.call(this, r2[0], t2, e2, r2[0]);
|
696
|
-
};
|
697
|
-
var un = function() {
|
698
|
-
function e2(r2) {
|
699
|
-
var e3 = this;
|
700
|
-
this.g = B, this.F = true, this.produce = function(r3, i3, o2) {
|
701
|
-
if ("function" == typeof r3 && "function" != typeof i3) {
|
702
|
-
var u2 = i3;
|
703
|
-
i3 = r3;
|
704
|
-
var a2 = e3;
|
705
|
-
return function(n2) {
|
706
|
-
var r4 = this;
|
707
|
-
void 0 === n2 && (n2 = u2);
|
708
|
-
for (var t2 = arguments.length, e4 = Array(t2 > 1 ? t2 - 1 : 0), o3 = 1; o3 < t2; o3++)
|
709
|
-
e4[o3 - 1] = arguments[o3];
|
710
|
-
return a2.produce(n2, function(n3) {
|
711
|
-
var t3;
|
712
|
-
return (t3 = i3).call.apply(t3, [r4, n3].concat(e4));
|
713
|
-
});
|
714
|
-
};
|
715
|
-
}
|
716
|
-
var f2;
|
717
|
-
if ("function" != typeof i3 && n(6), void 0 !== o2 && "function" != typeof o2 && n(7), t(r3)) {
|
718
|
-
var c2 = w(e3), s2 = R(e3, r3, void 0), v2 = true;
|
719
|
-
try {
|
720
|
-
f2 = i3(s2), v2 = false;
|
721
|
-
} finally {
|
722
|
-
v2 ? O(c2) : g(c2);
|
723
|
-
}
|
724
|
-
return "undefined" != typeof Promise && f2 instanceof Promise ? f2.then(function(n2) {
|
725
|
-
return j(c2, o2), P(n2, c2);
|
726
|
-
}, function(n2) {
|
727
|
-
throw O(c2), n2;
|
728
|
-
}) : (j(c2, o2), P(f2, c2));
|
729
|
-
}
|
730
|
-
if (!r3 || "object" != typeof r3) {
|
731
|
-
if (void 0 === (f2 = i3(r3)) && (f2 = r3), f2 === H && (f2 = void 0), e3.F && d(f2, true), o2) {
|
732
|
-
var p2 = [], l2 = [];
|
733
|
-
b("Patches").M(r3, f2, p2, l2), o2(p2, l2);
|
734
|
-
}
|
735
|
-
return f2;
|
736
|
-
}
|
737
|
-
n(21, r3);
|
738
|
-
}, this.produceWithPatches = function(n2, r3) {
|
739
|
-
if ("function" == typeof n2)
|
740
|
-
return function(r4) {
|
741
|
-
for (var t3 = arguments.length, i4 = Array(t3 > 1 ? t3 - 1 : 0), o3 = 1; o3 < t3; o3++)
|
742
|
-
i4[o3 - 1] = arguments[o3];
|
743
|
-
return e3.produceWithPatches(r4, function(r5) {
|
744
|
-
return n2.apply(void 0, [r5].concat(i4));
|
745
|
-
});
|
746
|
-
};
|
747
|
-
var t2, i3, o2 = e3.produce(n2, r3, function(n3, r4) {
|
748
|
-
t2 = n3, i3 = r4;
|
749
|
-
});
|
750
|
-
return "undefined" != typeof Promise && o2 instanceof Promise ? o2.then(function(n3) {
|
751
|
-
return [n3, t2, i3];
|
752
|
-
}) : [o2, t2, i3];
|
753
|
-
}, "boolean" == typeof (null == r2 ? void 0 : r2.useProxies) && this.setUseProxies(r2.useProxies), "boolean" == typeof (null == r2 ? void 0 : r2.autoFreeze) && this.setAutoFreeze(r2.autoFreeze);
|
754
|
-
}
|
755
|
-
var i2 = e2.prototype;
|
756
|
-
return i2.createDraft = function(e3) {
|
757
|
-
t(e3) || n(8), r(e3) && (e3 = D(e3));
|
758
|
-
var i3 = w(this), o2 = R(this, e3, void 0);
|
759
|
-
return o2[Q].C = true, g(i3), o2;
|
760
|
-
}, i2.finishDraft = function(r2, t2) {
|
761
|
-
var e3 = r2 && r2[Q];
|
762
|
-
var i3 = e3.A;
|
763
|
-
return j(i3, t2), P(void 0, i3);
|
764
|
-
}, i2.setAutoFreeze = function(n2) {
|
765
|
-
this.F = n2;
|
766
|
-
}, i2.setUseProxies = function(r2) {
|
767
|
-
r2 && !B && n(20), this.g = r2;
|
768
|
-
}, i2.applyPatches = function(n2, t2) {
|
769
|
-
var e3;
|
770
|
-
for (e3 = t2.length - 1; e3 >= 0; e3--) {
|
771
|
-
var i3 = t2[e3];
|
772
|
-
if (0 === i3.path.length && "replace" === i3.op) {
|
773
|
-
n2 = i3.value;
|
774
|
-
break;
|
775
|
-
}
|
776
|
-
}
|
777
|
-
e3 > -1 && (t2 = t2.slice(e3 + 1));
|
778
|
-
var o2 = b("Patches").$;
|
779
|
-
return r(n2) ? o2(n2, t2) : this.produce(n2, function(n3) {
|
780
|
-
return o2(n3, t2);
|
781
|
-
});
|
782
|
-
}, e2;
|
783
|
-
}(), an = new un(), fn = an.produce;
|
784
|
-
an.produceWithPatches.bind(an);
|
785
|
-
an.setAutoFreeze.bind(an);
|
786
|
-
an.setUseProxies.bind(an);
|
787
|
-
an.applyPatches.bind(an);
|
788
|
-
an.createDraft.bind(an);
|
789
|
-
an.finishDraft.bind(an);
|
790
|
-
const immerImpl = (initializer) => (set, get, store) => {
|
791
|
-
store.setState = (updater, replace2, ...a2) => {
|
792
|
-
const nextState = typeof updater === "function" ? fn(updater) : updater;
|
793
|
-
return set(nextState, replace2, ...a2);
|
794
|
-
};
|
795
|
-
return initializer(store.setState, get, store);
|
796
|
-
};
|
797
|
-
const immer = immerImpl;
|
798
|
-
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) => {
|
799
163
|
if (typeof Object.getPrototypeOf(element).requestSubmit === "function" && true) {
|
800
164
|
element.requestSubmit(submitter);
|
801
165
|
return;
|
@@ -834,7 +198,38 @@ function raise(errorConstructor, message, name) {
|
|
834
198
|
name
|
835
199
|
);
|
836
200
|
}
|
837
|
-
|
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) => {
|
838
233
|
const value = getPath(values, field);
|
839
234
|
if (value === void 0 || value === null) {
|
840
235
|
const newValue = [];
|
@@ -847,7 +242,7 @@ const getArray = (values, field) => {
|
|
847
242
|
);
|
848
243
|
return value;
|
849
244
|
};
|
850
|
-
|
245
|
+
var swap = (array, indexA, indexB) => {
|
851
246
|
const itemA = array[indexA];
|
852
247
|
const itemB = array[indexB];
|
853
248
|
const hasItemA = indexA in array;
|
@@ -871,20 +266,20 @@ function sparseSplice(array, start, deleteCount, item) {
|
|
871
266
|
return array.splice(start, deleteCount, item);
|
872
267
|
return array.splice(start, deleteCount);
|
873
268
|
}
|
874
|
-
|
269
|
+
var move = (array, from2, to) => {
|
875
270
|
const [item] = sparseSplice(array, from2, 1);
|
876
271
|
sparseSplice(array, to, 0, item);
|
877
272
|
};
|
878
|
-
|
273
|
+
var insert = (array, index, value) => {
|
879
274
|
sparseSplice(array, index, 0, value);
|
880
275
|
};
|
881
|
-
|
276
|
+
var remove = (array, index) => {
|
882
277
|
sparseSplice(array, index, 1);
|
883
278
|
};
|
884
|
-
|
279
|
+
var replace = (array, index, value) => {
|
885
280
|
sparseSplice(array, index, 1, value);
|
886
281
|
};
|
887
|
-
|
282
|
+
var mutateAsArray = (field, obj, mutate) => {
|
888
283
|
const beforeKeys = /* @__PURE__ */ new Set();
|
889
284
|
const arr = [];
|
890
285
|
for (const [key, value] of Object.entries(obj)) {
|
@@ -905,7 +300,7 @@ const mutateAsArray = (field, obj, mutate) => {
|
|
905
300
|
}
|
906
301
|
}
|
907
302
|
};
|
908
|
-
|
303
|
+
var getDeepArrayPaths = (obj, basePath = "") => {
|
909
304
|
if (Array.isArray(obj)) {
|
910
305
|
return obj.flatMap(
|
911
306
|
(item, index) => getDeepArrayPaths(item, `${basePath}[${index}]`)
|
@@ -918,9 +313,259 @@ const getDeepArrayPaths = (obj, basePath = "") => {
|
|
918
313
|
}
|
919
314
|
return [basePath];
|
920
315
|
};
|
921
|
-
|
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 = () => {
|
922
567
|
};
|
923
|
-
|
568
|
+
var defaultFormState = {
|
924
569
|
isHydrated: false,
|
925
570
|
isSubmitting: false,
|
926
571
|
hasBeenSubmitted: false,
|
@@ -972,7 +617,7 @@ const defaultFormState = {
|
|
972
617
|
}
|
973
618
|
}
|
974
619
|
};
|
975
|
-
|
620
|
+
var createFormState = (set, get) => ({
|
976
621
|
isHydrated: false,
|
977
622
|
isSubmitting: false,
|
978
623
|
hasBeenSubmitted: false,
|
@@ -1027,12 +672,12 @@ const createFormState = (set, get) => ({
|
|
1027
672
|
validateField: async (field) => {
|
1028
673
|
var _a, _b, _c;
|
1029
674
|
const formElement = get().formElement;
|
1030
|
-
|
675
|
+
invariant2(
|
1031
676
|
formElement,
|
1032
677
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
1033
678
|
);
|
1034
679
|
const validator = (_a = get().formProps) == null ? void 0 : _a.validator;
|
1035
|
-
|
680
|
+
invariant2(
|
1036
681
|
validator,
|
1037
682
|
"Cannot validator. This is probably a bug in remix-validated-form."
|
1038
683
|
);
|
@@ -1052,12 +697,12 @@ const createFormState = (set, get) => ({
|
|
1052
697
|
validate: async () => {
|
1053
698
|
var _a;
|
1054
699
|
const formElement = get().formElement;
|
1055
|
-
|
700
|
+
invariant2(
|
1056
701
|
formElement,
|
1057
702
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
1058
703
|
);
|
1059
704
|
const validator = (_a = get().formProps) == null ? void 0 : _a.validator;
|
1060
|
-
|
705
|
+
invariant2(
|
1061
706
|
validator,
|
1062
707
|
"Cannot validator. This is probably a bug in remix-validated-form."
|
1063
708
|
);
|
@@ -1068,7 +713,7 @@ const createFormState = (set, get) => ({
|
|
1068
713
|
},
|
1069
714
|
submit: () => {
|
1070
715
|
const formElement = get().formElement;
|
1071
|
-
|
716
|
+
invariant2(
|
1072
717
|
formElement,
|
1073
718
|
"Cannot find reference to form. This is probably a bug in remix-validated-form."
|
1074
719
|
);
|
@@ -1311,7 +956,7 @@ const createFormState = (set, get) => ({
|
|
1311
956
|
}
|
1312
957
|
}
|
1313
958
|
});
|
1314
|
-
|
959
|
+
var useRootFormStore = create()(
|
1315
960
|
immer((set, get) => ({
|
1316
961
|
forms: {},
|
1317
962
|
form: (formId) => {
|
@@ -1335,10 +980,14 @@ const useRootFormStore = create$1()(
|
|
1335
980
|
}
|
1336
981
|
}))
|
1337
982
|
);
|
1338
|
-
|
983
|
+
|
984
|
+
// src/internal/state/storeHooks.ts
|
985
|
+
var useFormStore = (formId, selector) => {
|
1339
986
|
return useRootFormStore((state) => selector(state.form(formId)));
|
1340
987
|
};
|
1341
|
-
|
988
|
+
|
989
|
+
// src/internal/hooks.ts
|
990
|
+
var useInternalFormContext = (formId, hookName) => {
|
1342
991
|
const formContext = useContext(InternalFormContext);
|
1343
992
|
if (formId)
|
1344
993
|
return { formId };
|
@@ -1368,12 +1017,12 @@ function useErrorResponseForForm({
|
|
1368
1017
|
return actionData;
|
1369
1018
|
return null;
|
1370
1019
|
}
|
1371
|
-
|
1020
|
+
var useFieldErrorsForForm = (context) => {
|
1372
1021
|
const response = useErrorResponseForForm(context);
|
1373
1022
|
const hydrated = useFormStore(context.formId, (state) => state.isHydrated);
|
1374
1023
|
return hydratable.from(response == null ? void 0 : response.fieldErrors, hydrated);
|
1375
1024
|
};
|
1376
|
-
|
1025
|
+
var useDefaultValuesFromLoader = ({
|
1377
1026
|
formId
|
1378
1027
|
}) => {
|
1379
1028
|
const matches = useMatches();
|
@@ -1384,7 +1033,7 @@ const useDefaultValuesFromLoader = ({
|
|
1384
1033
|
}
|
1385
1034
|
return null;
|
1386
1035
|
};
|
1387
|
-
|
1036
|
+
var useDefaultValuesForForm = (context) => {
|
1388
1037
|
const { formId, defaultValuesProp } = context;
|
1389
1038
|
const hydrated = useFormStore(formId, (state) => state.isHydrated);
|
1390
1039
|
const errorResponse = useErrorResponseForForm(context);
|
@@ -1392,7 +1041,7 @@ const useDefaultValuesForForm = (context) => {
|
|
1392
1041
|
if (hydrated)
|
1393
1042
|
return hydratable.hydratedData();
|
1394
1043
|
if (errorResponse == null ? void 0 : errorResponse.repopulateFields) {
|
1395
|
-
|
1044
|
+
invariant3(
|
1396
1045
|
typeof errorResponse.repopulateFields === "object",
|
1397
1046
|
"repopulateFields returned something other than an object"
|
1398
1047
|
);
|
@@ -1402,14 +1051,14 @@ const useDefaultValuesForForm = (context) => {
|
|
1402
1051
|
return hydratable.serverData(defaultValuesProp);
|
1403
1052
|
return hydratable.serverData(defaultValuesFromLoader);
|
1404
1053
|
};
|
1405
|
-
|
1054
|
+
var useHasActiveFormSubmit = ({
|
1406
1055
|
fetcher
|
1407
1056
|
}) => {
|
1408
1057
|
const transition = useTransition();
|
1409
1058
|
const hasActiveSubmission = fetcher ? fetcher.state === "submitting" : !!transition.submission;
|
1410
1059
|
return hasActiveSubmission;
|
1411
1060
|
};
|
1412
|
-
|
1061
|
+
var useFieldTouched = (field, { formId }) => {
|
1413
1062
|
const touched = useFormStore(formId, (state) => state.touchedFields[field]);
|
1414
1063
|
const setFieldTouched = useFormStore(formId, (state) => state.setTouched);
|
1415
1064
|
const setTouched = useCallback(
|
@@ -1418,7 +1067,7 @@ const useFieldTouched = (field, { formId }) => {
|
|
1418
1067
|
);
|
1419
1068
|
return [touched, setTouched];
|
1420
1069
|
};
|
1421
|
-
|
1070
|
+
var useFieldError = (name, context) => {
|
1422
1071
|
const fieldErrors = useFieldErrorsForForm(context);
|
1423
1072
|
const state = useFormStore(
|
1424
1073
|
context.formId,
|
@@ -1426,54 +1075,57 @@ const useFieldError = (name, context) => {
|
|
1426
1075
|
);
|
1427
1076
|
return fieldErrors.map((fieldErrors2) => fieldErrors2 == null ? void 0 : fieldErrors2[name]).hydrateTo(state);
|
1428
1077
|
};
|
1429
|
-
|
1078
|
+
var useClearError = (context) => {
|
1430
1079
|
const { formId } = context;
|
1431
1080
|
return useFormStore(formId, (state) => state.clearFieldError);
|
1432
1081
|
};
|
1433
|
-
|
1434
|
-
|
1082
|
+
var useCurrentDefaultValueForField = (formId, field) => useFormStore(formId, (state) => getPath(state.currentDefaultValues, field));
|
1083
|
+
var useFieldDefaultValue = (name, context) => {
|
1435
1084
|
const defaultValues = useDefaultValuesForForm(context);
|
1436
1085
|
const state = useCurrentDefaultValueForField(context.formId, name);
|
1437
1086
|
return defaultValues.map((val) => getPath(val, name)).hydrateTo(state);
|
1438
1087
|
};
|
1439
|
-
|
1440
|
-
|
1441
|
-
|
1442
|
-
|
1443
|
-
|
1444
|
-
|
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 = () => () => {
|
1445
1094
|
};
|
1446
|
-
|
1095
|
+
var useRegisterReceiveFocus = (formId) => useFormStore(
|
1447
1096
|
formId,
|
1448
1097
|
(state) => {
|
1449
1098
|
var _a, _b;
|
1450
1099
|
return (_b = (_a = state.formProps) == null ? void 0 : _a.registerReceiveFocus) != null ? _b : noOpReceiver;
|
1451
1100
|
}
|
1452
1101
|
);
|
1453
|
-
|
1454
|
-
|
1102
|
+
var defaultDefaultValues = {};
|
1103
|
+
var useSyncedDefaultValues = (formId) => useFormStore(
|
1455
1104
|
formId,
|
1456
1105
|
(state) => {
|
1457
1106
|
var _a, _b;
|
1458
1107
|
return (_b = (_a = state.formProps) == null ? void 0 : _a.defaultValues) != null ? _b : defaultDefaultValues;
|
1459
1108
|
}
|
1460
1109
|
);
|
1461
|
-
|
1462
|
-
|
1463
|
-
|
1464
|
-
|
1465
|
-
|
1466
|
-
|
1467
|
-
|
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) => {
|
1468
1117
|
var _a;
|
1469
1118
|
return (_a = state.formProps) == null ? void 0 : _a.action;
|
1470
1119
|
});
|
1471
|
-
|
1120
|
+
var useFormSubactionProp = (formId) => useFormStore(formId, (state) => {
|
1472
1121
|
var _a;
|
1473
1122
|
return (_a = state.formProps) == null ? void 0 : _a.subaction;
|
1474
1123
|
});
|
1475
|
-
|
1476
|
-
|
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) => {
|
1477
1129
|
const value = useFormStore(
|
1478
1130
|
context.formId,
|
1479
1131
|
(state) => state.controlledFields.getValue(field)
|
@@ -1485,7 +1137,7 @@ const useControlledFieldValue = (context, field) => {
|
|
1485
1137
|
const defaultValue = useFieldDefaultValue(field, context);
|
1486
1138
|
return isFormHydrated ? value : defaultValue;
|
1487
1139
|
};
|
1488
|
-
|
1140
|
+
var useRegisterControlledField = (context, field) => {
|
1489
1141
|
const resolveUpdate = useFormStore(
|
1490
1142
|
context.formId,
|
1491
1143
|
(state) => state.controlledFields.valueUpdateResolvers[field]
|
@@ -1506,38 +1158,40 @@ const useRegisterControlledField = (context, field) => {
|
|
1506
1158
|
return () => unregister(field);
|
1507
1159
|
}, [context.formId, field, register, unregister]);
|
1508
1160
|
};
|
1509
|
-
|
1161
|
+
var useControllableValue = (context, field) => {
|
1510
1162
|
useRegisterControlledField(context, field);
|
1511
1163
|
const setControlledFieldValue = useFormStore(
|
1512
1164
|
context.formId,
|
1513
1165
|
(state) => state.controlledFields.setValue
|
1514
1166
|
);
|
1515
|
-
const setValue =
|
1167
|
+
const setValue = useCallback2(
|
1516
1168
|
(value2) => setControlledFieldValue(field, value2),
|
1517
1169
|
[field, setControlledFieldValue]
|
1518
1170
|
);
|
1519
1171
|
const value = useControlledFieldValue(context, field);
|
1520
1172
|
return [value, setValue];
|
1521
1173
|
};
|
1522
|
-
|
1174
|
+
var useUpdateControllableValue = (formId) => {
|
1523
1175
|
const setValue = useFormStore(
|
1524
1176
|
formId,
|
1525
1177
|
(state) => state.controlledFields.setValue
|
1526
1178
|
);
|
1527
|
-
return
|
1179
|
+
return useCallback2(
|
1528
1180
|
(field, value) => setValue(field, value),
|
1529
1181
|
[setValue]
|
1530
1182
|
);
|
1531
1183
|
};
|
1532
|
-
|
1184
|
+
|
1185
|
+
// src/hooks.ts
|
1186
|
+
var useIsSubmitting = (formId) => {
|
1533
1187
|
const formContext = useInternalFormContext(formId, "useIsSubmitting");
|
1534
1188
|
return useInternalIsSubmitting(formContext.formId);
|
1535
1189
|
};
|
1536
|
-
|
1190
|
+
var useIsValid = (formId) => {
|
1537
1191
|
const formContext = useInternalFormContext(formId, "useIsValid");
|
1538
1192
|
return useInternalIsValid(formContext.formId);
|
1539
1193
|
};
|
1540
|
-
|
1194
|
+
var useField = (name, options) => {
|
1541
1195
|
const { formId: providedFormId, handleReceiveFocus } = options != null ? options : {};
|
1542
1196
|
const formContext = useInternalFormContext(providedFormId, "useField");
|
1543
1197
|
const defaultValue = useFieldDefaultValue(name, formContext);
|
@@ -1547,7 +1201,7 @@ const useField = (name, options) => {
|
|
1547
1201
|
const hasBeenSubmitted = useInternalHasBeenSubmitted(formContext.formId);
|
1548
1202
|
const validateField = useValidateField(formContext.formId);
|
1549
1203
|
const registerReceiveFocus = useRegisterReceiveFocus(formContext.formId);
|
1550
|
-
|
1204
|
+
useEffect2(() => {
|
1551
1205
|
if (handleReceiveFocus)
|
1552
1206
|
return registerReceiveFocus(name, handleReceiveFocus);
|
1553
1207
|
}, [handleReceiveFocus, name, registerReceiveFocus]);
|
@@ -1585,38 +1239,18 @@ const useField = (name, options) => {
|
|
1585
1239
|
]);
|
1586
1240
|
return field;
|
1587
1241
|
};
|
1588
|
-
|
1242
|
+
var useControlField = (name, formId) => {
|
1589
1243
|
const context = useInternalFormContext(formId, "useControlField");
|
1590
1244
|
const [value, setValue] = useControllableValue(context, name);
|
1591
1245
|
return [value, setValue];
|
1592
1246
|
};
|
1593
|
-
|
1247
|
+
var useUpdateControlledField = (formId) => {
|
1594
1248
|
const context = useInternalFormContext(formId, "useControlField");
|
1595
1249
|
return useUpdateControllableValue(context.formId);
|
1596
1250
|
};
|
1597
|
-
|
1598
|
-
|
1599
|
-
|
1600
|
-
* Copyright (c) Remix Software Inc.
|
1601
|
-
*
|
1602
|
-
* This source code is licensed under the MIT license found in the
|
1603
|
-
* LICENSE.md file in the root directory of this source tree.
|
1604
|
-
*
|
1605
|
-
* @license MIT
|
1606
|
-
*/
|
1607
|
-
const json = (data, init = {}) => {
|
1608
|
-
let responseInit = typeof init === "number" ? {
|
1609
|
-
status: init
|
1610
|
-
} : init;
|
1611
|
-
let headers = new Headers(responseInit.headers);
|
1612
|
-
if (!headers.has("Content-Type")) {
|
1613
|
-
headers.set("Content-Type", "application/json; charset=utf-8");
|
1614
|
-
}
|
1615
|
-
return new Response(JSON.stringify(data), {
|
1616
|
-
...responseInit,
|
1617
|
-
headers
|
1618
|
-
});
|
1619
|
-
};
|
1251
|
+
|
1252
|
+
// src/server.ts
|
1253
|
+
import { json } from "@remix-run/server-runtime";
|
1620
1254
|
function validationError(error, repopulateFields, init) {
|
1621
1255
|
return json(
|
1622
1256
|
{
|
@@ -1628,10 +1262,27 @@ function validationError(error, repopulateFields, init) {
|
|
1628
1262
|
{ status: 422, ...init }
|
1629
1263
|
);
|
1630
1264
|
}
|
1631
|
-
|
1265
|
+
var setFormDefaults = (formId, defaultValues) => ({
|
1632
1266
|
[formDefaultValuesKey(formId)]: defaultValues
|
1633
1267
|
});
|
1634
|
-
|
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 {
|
1635
1286
|
constructor() {
|
1636
1287
|
this.dict = /* @__PURE__ */ new Map();
|
1637
1288
|
this.add = (key, value) => {
|
@@ -1662,19 +1313,22 @@ class MultiValueMap {
|
|
1662
1313
|
this.values = () => this.dict.values();
|
1663
1314
|
this.has = (key) => this.dict.has(key);
|
1664
1315
|
}
|
1665
|
-
}
|
1666
|
-
|
1316
|
+
};
|
1317
|
+
var useMultiValueMap = () => {
|
1667
1318
|
const ref = useRef(null);
|
1668
|
-
return
|
1319
|
+
return useCallback3(() => {
|
1669
1320
|
if (ref.current)
|
1670
1321
|
return ref.current;
|
1671
1322
|
ref.current = new MultiValueMap();
|
1672
1323
|
return ref.current;
|
1673
1324
|
}, []);
|
1674
1325
|
};
|
1326
|
+
|
1327
|
+
// src/internal/submissionCallbacks.ts
|
1328
|
+
import { useEffect as useEffect3, useRef as useRef2 } from "react";
|
1675
1329
|
function useSubmitComplete(isSubmitting, callback) {
|
1676
|
-
const isPending =
|
1677
|
-
|
1330
|
+
const isPending = useRef2(false);
|
1331
|
+
useEffect3(() => {
|
1678
1332
|
if (isSubmitting) {
|
1679
1333
|
isPending.current = true;
|
1680
1334
|
}
|
@@ -1684,7 +1338,11 @@ function useSubmitComplete(isSubmitting, callback) {
|
|
1684
1338
|
}
|
1685
1339
|
});
|
1686
1340
|
}
|
1687
|
-
|
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) => {
|
1688
1346
|
return (value) => {
|
1689
1347
|
refs.filter(Boolean).forEach((ref) => {
|
1690
1348
|
if (typeof ref === "function") {
|
@@ -1695,22 +1353,25 @@ const mergeRefs = (refs) => {
|
|
1695
1353
|
});
|
1696
1354
|
};
|
1697
1355
|
};
|
1698
|
-
|
1699
|
-
|
1700
|
-
const ref =
|
1701
|
-
const areEqual = ref.current === item || equals(ref.current, item);
|
1702
|
-
|
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(() => {
|
1703
1361
|
if (!areEqual) {
|
1704
1362
|
ref.current = item;
|
1705
1363
|
}
|
1706
1364
|
});
|
1707
1365
|
return areEqual ? ref.current : item;
|
1708
1366
|
};
|
1709
|
-
|
1367
|
+
|
1368
|
+
// src/ValidatedForm.tsx
|
1369
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
1370
|
+
var getDataFromForm = (el) => new FormData(el);
|
1710
1371
|
function nonNull(value) {
|
1711
1372
|
return value !== null;
|
1712
1373
|
}
|
1713
|
-
|
1374
|
+
var focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) => {
|
1714
1375
|
var _a;
|
1715
1376
|
const namesInOrder = [...formElement.elements].map((el) => {
|
1716
1377
|
const input = el instanceof RadioNodeList ? el[0] : el;
|
@@ -1718,7 +1379,7 @@ const focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) =
|
|
1718
1379
|
return input.name;
|
1719
1380
|
return null;
|
1720
1381
|
}).filter(nonNull).filter((name) => name in fieldErrors);
|
1721
|
-
const uniqueNamesInOrder = uniq(namesInOrder);
|
1382
|
+
const uniqueNamesInOrder = R4.uniq(namesInOrder);
|
1722
1383
|
for (const fieldName of uniqueNamesInOrder) {
|
1723
1384
|
if (customFocusHandlers.has(fieldName)) {
|
1724
1385
|
customFocusHandlers.getAll(fieldName).forEach((handler) => {
|
@@ -1747,11 +1408,11 @@ const focusFirstInvalidInput = (fieldErrors, customFocusHandlers, formElement) =
|
|
1747
1408
|
}
|
1748
1409
|
}
|
1749
1410
|
};
|
1750
|
-
|
1411
|
+
var useFormId = (providedId) => {
|
1751
1412
|
const [symbolId] = useState(() => Symbol("remix-validated-form-id"));
|
1752
1413
|
return providedId != null ? providedId : symbolId;
|
1753
1414
|
};
|
1754
|
-
|
1415
|
+
var FormResetter = ({
|
1755
1416
|
resetAfterSubmit,
|
1756
1417
|
formRef
|
1757
1418
|
}) => {
|
@@ -1801,7 +1462,7 @@ function ValidatedForm({
|
|
1801
1462
|
var _a;
|
1802
1463
|
const formId = useFormId(id);
|
1803
1464
|
const providedDefaultValues = useDeepEqualsMemo(unMemoizedDefaults);
|
1804
|
-
const contextValue =
|
1465
|
+
const contextValue = useMemo2(
|
1805
1466
|
() => ({
|
1806
1467
|
formId,
|
1807
1468
|
action,
|
@@ -1814,8 +1475,8 @@ function ValidatedForm({
|
|
1814
1475
|
const backendError = useErrorResponseForForm(contextValue);
|
1815
1476
|
const backendDefaultValues = useDefaultValuesFromLoader(contextValue);
|
1816
1477
|
const hasActiveSubmission = useHasActiveFormSubmit(contextValue);
|
1817
|
-
const formRef =
|
1818
|
-
const Form
|
1478
|
+
const formRef = useRef4(null);
|
1479
|
+
const Form = (_a = fetcher == null ? void 0 : fetcher.Form) != null ? _a : RemixForm;
|
1819
1480
|
const submit = useSubmit();
|
1820
1481
|
const setFieldErrors = useSetFieldErrors(formId);
|
1821
1482
|
const setFieldError = useFormStore(formId, (state) => state.setFieldError);
|
@@ -1830,7 +1491,7 @@ function ValidatedForm({
|
|
1830
1491
|
const cleanupForm = useRootFormStore((state) => state.cleanupForm);
|
1831
1492
|
const registerForm = useRootFormStore((state) => state.registerForm);
|
1832
1493
|
const customFocusHandlers = useMultiValueMap();
|
1833
|
-
const registerReceiveFocus =
|
1494
|
+
const registerReceiveFocus = useCallback4(
|
1834
1495
|
(fieldName, handler) => {
|
1835
1496
|
customFocusHandlers().add(fieldName, handler);
|
1836
1497
|
return () => {
|
@@ -1864,17 +1525,30 @@ function ValidatedForm({
|
|
1864
1525
|
useIsomorphicLayoutEffect(() => {
|
1865
1526
|
setFormElementInState(formRef.current);
|
1866
1527
|
}, [setFormElementInState]);
|
1867
|
-
|
1528
|
+
useEffect5(() => {
|
1868
1529
|
var _a2;
|
1869
1530
|
setFieldErrors((_a2 = backendError == null ? void 0 : backendError.fieldErrors) != null ? _a2 : {});
|
1870
|
-
|
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
|
+
]);
|
1871
1545
|
useSubmitComplete(hasActiveSubmission, () => {
|
1872
1546
|
endSubmit();
|
1873
1547
|
});
|
1874
|
-
const handleSubmit = async (
|
1548
|
+
const handleSubmit = async (e, target, nativeEvent) => {
|
1875
1549
|
startSubmit();
|
1876
1550
|
const submitter = nativeEvent.submitter;
|
1877
|
-
const formDataToValidate = getDataFromForm(
|
1551
|
+
const formDataToValidate = getDataFromForm(e.currentTarget);
|
1878
1552
|
if (submitter == null ? void 0 : submitter.name) {
|
1879
1553
|
formDataToValidate.append(submitter.name, submitter.value);
|
1880
1554
|
}
|
@@ -1891,14 +1565,14 @@ function ValidatedForm({
|
|
1891
1565
|
}
|
1892
1566
|
} else {
|
1893
1567
|
setFieldErrors({});
|
1894
|
-
const eventProxy = formEventProxy(
|
1568
|
+
const eventProxy = formEventProxy(e);
|
1895
1569
|
await (onSubmit == null ? void 0 : onSubmit(result.data, eventProxy));
|
1896
1570
|
if (eventProxy.defaultPrevented) {
|
1897
1571
|
endSubmit();
|
1898
1572
|
return;
|
1899
1573
|
}
|
1900
1574
|
if (fetcher)
|
1901
|
-
fetcher.submit(submitter ||
|
1575
|
+
fetcher.submit(submitter || e.currentTarget);
|
1902
1576
|
else
|
1903
1577
|
submit(submitter || target, {
|
1904
1578
|
replace: replace2,
|
@@ -1906,43 +1580,44 @@ function ValidatedForm({
|
|
1906
1580
|
});
|
1907
1581
|
}
|
1908
1582
|
};
|
1909
|
-
return /* @__PURE__ */
|
1910
|
-
|
1911
|
-
|
1912
|
-
|
1913
|
-
|
1914
|
-
|
1915
|
-
|
1916
|
-
|
1917
|
-
|
1918
|
-
|
1919
|
-
|
1920
|
-
|
1921
|
-
|
1922
|
-
|
1923
|
-
|
1924
|
-
|
1925
|
-
|
1926
|
-
|
1927
|
-
|
1928
|
-
|
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
|
+
] }) })
|
1929
1612
|
}
|
1930
|
-
|
1931
|
-
value: contextValue
|
1932
|
-
}, /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(FormResetter, {
|
1933
|
-
formRef,
|
1934
|
-
resetAfterSubmit
|
1935
|
-
}), subaction && /* @__PURE__ */ React.createElement("input", {
|
1936
|
-
type: "hidden",
|
1937
|
-
value: subaction,
|
1938
|
-
name: "subaction"
|
1939
|
-
}), id && /* @__PURE__ */ React.createElement("input", {
|
1940
|
-
type: "hidden",
|
1941
|
-
value: id,
|
1942
|
-
name: FORM_ID_FIELD
|
1943
|
-
}), children)));
|
1613
|
+
);
|
1944
1614
|
}
|
1945
|
-
|
1615
|
+
|
1616
|
+
// src/validation/createValidator.ts
|
1617
|
+
import * as R5 from "remeda";
|
1618
|
+
|
1619
|
+
// src/internal/flatten.ts
|
1620
|
+
var objectFromPathEntries = (entries) => {
|
1946
1621
|
const map = new MultiValueMap();
|
1947
1622
|
entries.forEach(([key, value]) => map.add(key, value));
|
1948
1623
|
return [...map.entries()].reduce(
|
@@ -1950,12 +1625,14 @@ const objectFromPathEntries = (entries) => {
|
|
1950
1625
|
{}
|
1951
1626
|
);
|
1952
1627
|
};
|
1953
|
-
|
1628
|
+
|
1629
|
+
// src/validation/createValidator.ts
|
1630
|
+
var preprocessFormData = (data) => {
|
1954
1631
|
if ("entries" in data && typeof data.entries === "function")
|
1955
1632
|
return objectFromPathEntries([...data.entries()]);
|
1956
1633
|
return objectFromPathEntries(Object.entries(data));
|
1957
1634
|
};
|
1958
|
-
|
1635
|
+
var omitInternalFields = (data) => R5.omit(data, [FORM_ID_FIELD]);
|
1959
1636
|
function createValidator(validator) {
|
1960
1637
|
return {
|
1961
1638
|
validate: async (value) => {
|
@@ -1983,7 +1660,13 @@ function createValidator(validator) {
|
|
1983
1660
|
validateField: (data, field) => validator.validateField(preprocessFormData(data), field)
|
1984
1661
|
};
|
1985
1662
|
}
|
1986
|
-
|
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) => {
|
1987
1670
|
const formContext = useInternalFormContext(formId, "useFormState");
|
1988
1671
|
const isSubmitting = useInternalIsSubmitting(formContext.formId);
|
1989
1672
|
const hasBeenSubmitted = useInternalHasBeenSubmitted(formContext.formId);
|
@@ -1997,7 +1680,7 @@ const useFormState = (formId) => {
|
|
1997
1680
|
const fieldErrorsFromState = useFieldErrors(formContext.formId);
|
1998
1681
|
const fieldErrorsToUse = useFieldErrorsForForm(formContext);
|
1999
1682
|
const hydratedFieldErrors = fieldErrorsToUse.hydrateTo(fieldErrorsFromState);
|
2000
|
-
return
|
1683
|
+
return useMemo3(
|
2001
1684
|
() => ({
|
2002
1685
|
action,
|
2003
1686
|
subaction,
|
@@ -2020,7 +1703,7 @@ const useFormState = (formId) => {
|
|
2020
1703
|
]
|
2021
1704
|
);
|
2022
1705
|
};
|
2023
|
-
|
1706
|
+
var useFormHelpers = (formId) => {
|
2024
1707
|
const formContext = useInternalFormContext(formId, "useFormHelpers");
|
2025
1708
|
const setTouched = useSetTouched(formContext);
|
2026
1709
|
const validateField = useValidateField(formContext.formId);
|
@@ -2030,7 +1713,7 @@ const useFormHelpers = (formId) => {
|
|
2030
1713
|
const reset = useResetFormElement(formContext.formId);
|
2031
1714
|
const submit = useSubmitForm(formContext.formId);
|
2032
1715
|
const getValues = useFormValues(formContext.formId);
|
2033
|
-
return
|
1716
|
+
return useMemo3(
|
2034
1717
|
() => ({
|
2035
1718
|
setTouched,
|
2036
1719
|
validateField,
|
@@ -2053,7 +1736,9 @@ const useFormHelpers = (formId) => {
|
|
2053
1736
|
]
|
2054
1737
|
);
|
2055
1738
|
};
|
2056
|
-
|
1739
|
+
|
1740
|
+
// src/userFacingFormContext.ts
|
1741
|
+
var useFormContext = (formId) => {
|
2057
1742
|
const context = useInternalFormContext(formId, "useFormContext");
|
2058
1743
|
const state = useFormState(formId);
|
2059
1744
|
const {
|
@@ -2067,7 +1752,7 @@ const useFormContext = (formId) => {
|
|
2067
1752
|
getValues
|
2068
1753
|
} = useFormHelpers(formId);
|
2069
1754
|
const registerReceiveFocus = useRegisterReceiveFocus(context.formId);
|
2070
|
-
const clearError =
|
1755
|
+
const clearError = useCallback5(
|
2071
1756
|
(...names) => {
|
2072
1757
|
names.forEach((name) => {
|
2073
1758
|
internalClearError(name);
|
@@ -2075,7 +1760,7 @@ const useFormContext = (formId) => {
|
|
2075
1760
|
},
|
2076
1761
|
[internalClearError]
|
2077
1762
|
);
|
2078
|
-
return
|
1763
|
+
return useMemo4(
|
2079
1764
|
() => ({
|
2080
1765
|
...state,
|
2081
1766
|
setFieldTouched: setTouched,
|
@@ -2102,7 +1787,13 @@ const useFormContext = (formId) => {
|
|
2102
1787
|
]
|
2103
1788
|
);
|
2104
1789
|
};
|
2105
|
-
|
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) => {
|
2106
1797
|
const value = useFieldDefaultValue(field, context);
|
2107
1798
|
useRegisterControlledField(context, field);
|
2108
1799
|
const hasBeenSubmitted = useInternalHasBeenSubmitted(context.formId);
|
@@ -2114,12 +1805,12 @@ const useInternalFieldArray = (context, field, validationBehavior) => {
|
|
2114
1805
|
...validationBehavior
|
2115
1806
|
};
|
2116
1807
|
const behavior = hasBeenSubmitted ? resolvedValidationBehavior.whenSubmitted : resolvedValidationBehavior.initial;
|
2117
|
-
const maybeValidate =
|
1808
|
+
const maybeValidate = useCallback6(() => {
|
2118
1809
|
if (behavior === "onChange") {
|
2119
1810
|
validateField(field);
|
2120
1811
|
}
|
2121
1812
|
}, [behavior, field, validateField]);
|
2122
|
-
|
1813
|
+
invariant4(
|
2123
1814
|
value === void 0 || value === null || Array.isArray(value),
|
2124
1815
|
`FieldArray: defaultValue value for ${field} must be an array, null, or undefined`
|
2125
1816
|
);
|
@@ -2127,7 +1818,7 @@ const useInternalFieldArray = (context, field, validationBehavior) => {
|
|
2127
1818
|
context.formId,
|
2128
1819
|
(state) => state.controlledFields.array
|
2129
1820
|
);
|
2130
|
-
const helpers =
|
1821
|
+
const helpers = useMemo5(
|
2131
1822
|
() => ({
|
2132
1823
|
push: (item) => {
|
2133
1824
|
arr.push(field, item);
|
@@ -2164,14 +1855,14 @@ const useInternalFieldArray = (context, field, validationBehavior) => {
|
|
2164
1855
|
}),
|
2165
1856
|
[arr, field, maybeValidate]
|
2166
1857
|
);
|
2167
|
-
const arrayValue =
|
1858
|
+
const arrayValue = useMemo5(() => value != null ? value : [], [value]);
|
2168
1859
|
return [arrayValue, helpers, error];
|
2169
1860
|
};
|
2170
1861
|
function useFieldArray(name, { formId, validationBehavior } = {}) {
|
2171
1862
|
const context = useInternalFormContext(formId, "FieldArray");
|
2172
1863
|
return useInternalFieldArray(context, name, validationBehavior);
|
2173
1864
|
}
|
2174
|
-
|
1865
|
+
var FieldArray = ({
|
2175
1866
|
name,
|
2176
1867
|
children,
|
2177
1868
|
formId,
|
@@ -2183,7 +1874,20 @@ const FieldArray = ({
|
|
2183
1874
|
name,
|
2184
1875
|
validationBehavior
|
2185
1876
|
);
|
2186
|
-
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
|
2187
1892
|
};
|
2188
|
-
|
2189
|
-
//# sourceMappingURL=remix-validated-form.es.js.map
|
1893
|
+
//# sourceMappingURL=index.esm.js.map
|