@bombillazo/rhf-plus 7.68.0-plus.0 → 7.69.0-plus.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.mjs +61 -39
- package/dist/index.esm.mjs.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/logic/createFormControl.d.ts.map +1 -1
- package/dist/react-server.esm.mjs +46 -29
- package/dist/react-server.esm.mjs.map +1 -1
- package/dist/types/fieldArray.d.ts.map +1 -1
- package/dist/types/form.d.ts +1 -0
- package/dist/types/form.d.ts.map +1 -1
- package/dist/useController.d.ts.map +1 -1
- package/dist/useFieldArray.d.ts.map +1 -1
- package/dist/useWatch.d.ts.map +1 -1
- package/dist/utils/cloneObject.d.ts.map +1 -1
- package/dist/watch.d.ts +24 -15
- package/dist/watch.d.ts.map +1 -1
- package/package.json +15 -15
package/dist/index.esm.mjs
CHANGED
|
@@ -33,29 +33,23 @@ var isWeb = typeof window !== 'undefined' &&
|
|
|
33
33
|
typeof document !== 'undefined';
|
|
34
34
|
|
|
35
35
|
function cloneObject(data) {
|
|
36
|
-
let copy;
|
|
37
|
-
const isArray = Array.isArray(data);
|
|
38
|
-
const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
|
|
39
36
|
if (data instanceof Date) {
|
|
40
|
-
|
|
37
|
+
return new Date(data);
|
|
41
38
|
}
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
if (!isArray && !isPlainObject(data)) {
|
|
46
|
-
copy = data;
|
|
47
|
-
}
|
|
48
|
-
else {
|
|
49
|
-
for (const key in data) {
|
|
50
|
-
if (data.hasOwnProperty(key)) {
|
|
51
|
-
copy[key] = cloneObject(data[key]);
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
39
|
+
const isFileListInstance = typeof FileList !== 'undefined' && data instanceof FileList;
|
|
40
|
+
if (isWeb && (data instanceof Blob || isFileListInstance)) {
|
|
41
|
+
return data;
|
|
55
42
|
}
|
|
56
|
-
|
|
43
|
+
const isArray = Array.isArray(data);
|
|
44
|
+
if (!isArray && !(isObject(data) && isPlainObject(data))) {
|
|
57
45
|
return data;
|
|
58
46
|
}
|
|
47
|
+
const copy = isArray ? [] : Object.create(Object.getPrototypeOf(data));
|
|
48
|
+
for (const key in data) {
|
|
49
|
+
if (Object.prototype.hasOwnProperty.call(data, key)) {
|
|
50
|
+
copy[key] = cloneObject(data[key]);
|
|
51
|
+
}
|
|
52
|
+
}
|
|
59
53
|
return copy;
|
|
60
54
|
}
|
|
61
55
|
|
|
@@ -81,6 +75,8 @@ var get = (object, path, defaultValue) => {
|
|
|
81
75
|
|
|
82
76
|
var isBoolean = (value) => typeof value === 'boolean';
|
|
83
77
|
|
|
78
|
+
var isFunction = (value) => typeof value === 'function';
|
|
79
|
+
|
|
84
80
|
function mergeMissingKeysAsUndefined(oldObject, newObject) {
|
|
85
81
|
if (!newObject) {
|
|
86
82
|
return newObject;
|
|
@@ -564,12 +560,12 @@ function useController(props) {
|
|
|
564
560
|
const ref = React.useCallback((elm) => {
|
|
565
561
|
elementRef.current = elm;
|
|
566
562
|
const field = get(control._fields, name);
|
|
567
|
-
if (field && elm) {
|
|
563
|
+
if (field && field._f && elm) {
|
|
568
564
|
field._f.ref = {
|
|
569
|
-
focus: () =>
|
|
570
|
-
select: () =>
|
|
571
|
-
setCustomValidity: (message) => elm.setCustomValidity(message),
|
|
572
|
-
reportValidity: () => elm.reportValidity(),
|
|
565
|
+
focus: () => isFunction(elm.focus) && elm.focus(),
|
|
566
|
+
select: () => isFunction(elm.select) && elm.select(),
|
|
567
|
+
setCustomValidity: (message) => isFunction(elm.setCustomValidity) && elm.setCustomValidity(message),
|
|
568
|
+
reportValidity: () => isFunction(elm.reportValidity) && elm.reportValidity(),
|
|
573
569
|
};
|
|
574
570
|
}
|
|
575
571
|
}, [control._fields, name]);
|
|
@@ -927,8 +923,6 @@ var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
|
|
|
927
923
|
|
|
928
924
|
var isFileInput = (element) => element.type === 'file';
|
|
929
925
|
|
|
930
|
-
var isFunction = (value) => typeof value === 'function';
|
|
931
|
-
|
|
932
926
|
var isHTMLElement = (value) => {
|
|
933
927
|
if (!isWeb) {
|
|
934
928
|
return false;
|
|
@@ -1541,6 +1535,7 @@ function createFormControl(props = {}) {
|
|
|
1541
1535
|
action: false,
|
|
1542
1536
|
mount: false,
|
|
1543
1537
|
watch: false,
|
|
1538
|
+
keepIsValid: false,
|
|
1544
1539
|
};
|
|
1545
1540
|
let _names = {
|
|
1546
1541
|
mount: new Set(),
|
|
@@ -1552,7 +1547,7 @@ function createFormControl(props = {}) {
|
|
|
1552
1547
|
};
|
|
1553
1548
|
let delayErrorCallback;
|
|
1554
1549
|
let timer = 0;
|
|
1555
|
-
const
|
|
1550
|
+
const defaultProxyFormState = {
|
|
1556
1551
|
isDirty: false,
|
|
1557
1552
|
isDirtySinceSubmit: false,
|
|
1558
1553
|
hasBeenSubmitted: false,
|
|
@@ -1564,6 +1559,9 @@ function createFormControl(props = {}) {
|
|
|
1564
1559
|
isValid: false,
|
|
1565
1560
|
errors: false,
|
|
1566
1561
|
};
|
|
1562
|
+
const _proxyFormState = {
|
|
1563
|
+
...defaultProxyFormState,
|
|
1564
|
+
};
|
|
1567
1565
|
let _proxySubscribeFormState = {
|
|
1568
1566
|
..._proxyFormState,
|
|
1569
1567
|
};
|
|
@@ -1580,13 +1578,21 @@ function createFormControl(props = {}) {
|
|
|
1580
1578
|
timer = setTimeout(callback, wait);
|
|
1581
1579
|
};
|
|
1582
1580
|
const _setValid = async (shouldUpdateValid) => {
|
|
1581
|
+
if (_state.keepIsValid) {
|
|
1582
|
+
return;
|
|
1583
|
+
}
|
|
1583
1584
|
if ((Array.isArray(_options.disabled) || !_options.disabled) &&
|
|
1584
1585
|
(_proxyFormState.isValid ||
|
|
1585
1586
|
_proxySubscribeFormState.isValid ||
|
|
1586
1587
|
shouldUpdateValid)) {
|
|
1587
|
-
|
|
1588
|
-
|
|
1589
|
-
|
|
1588
|
+
let isValid;
|
|
1589
|
+
if (_options.resolver) {
|
|
1590
|
+
isValid = isEmptyObject((await _runSchema()).errors);
|
|
1591
|
+
_updateIsValidating();
|
|
1592
|
+
}
|
|
1593
|
+
else {
|
|
1594
|
+
isValid = await executeBuiltInValidation(_fields, true);
|
|
1595
|
+
}
|
|
1590
1596
|
if (isValid !== _formState.isValid) {
|
|
1591
1597
|
_subjects.state.next({
|
|
1592
1598
|
isValid,
|
|
@@ -1782,11 +1788,11 @@ function createFormControl(props = {}) {
|
|
|
1782
1788
|
const _runSchema = async (name) => {
|
|
1783
1789
|
_updateIsValidating(name, true);
|
|
1784
1790
|
const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
|
|
1785
|
-
_updateIsValidating(name);
|
|
1786
1791
|
return result;
|
|
1787
1792
|
};
|
|
1788
1793
|
const executeSchemaAndUpdateState = async (names) => {
|
|
1789
1794
|
const { errors } = await _runSchema(names);
|
|
1795
|
+
_updateIsValidating(names);
|
|
1790
1796
|
if (names) {
|
|
1791
1797
|
for (const name of names) {
|
|
1792
1798
|
const error = get(errors, name);
|
|
@@ -2112,6 +2118,7 @@ function createFormControl(props = {}) {
|
|
|
2112
2118
|
!isBlurEvent && watched && _subjects.state.next({ ..._formState });
|
|
2113
2119
|
if (_options.resolver) {
|
|
2114
2120
|
const { errors } = await _runSchema([name]);
|
|
2121
|
+
_updateIsValidating([name]);
|
|
2115
2122
|
_updateIsFieldValueUpdated(fieldValue);
|
|
2116
2123
|
if (isFieldValueUpdated) {
|
|
2117
2124
|
const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
|
|
@@ -2263,7 +2270,10 @@ function createFormControl(props = {}) {
|
|
|
2263
2270
|
};
|
|
2264
2271
|
return _subscribe({
|
|
2265
2272
|
...props,
|
|
2266
|
-
formState:
|
|
2273
|
+
formState: {
|
|
2274
|
+
...defaultProxyFormState,
|
|
2275
|
+
...props.formState,
|
|
2276
|
+
},
|
|
2267
2277
|
});
|
|
2268
2278
|
};
|
|
2269
2279
|
const unregister = (name, options = {}) => {
|
|
@@ -2457,6 +2467,7 @@ function createFormControl(props = {}) {
|
|
|
2457
2467
|
});
|
|
2458
2468
|
if (_options.resolver) {
|
|
2459
2469
|
const { errors, values } = await _runSchema();
|
|
2470
|
+
_updateIsValidating();
|
|
2460
2471
|
_formState.errors = errors;
|
|
2461
2472
|
fieldValues = cloneObject(values);
|
|
2462
2473
|
}
|
|
@@ -2601,6 +2612,7 @@ function createFormControl(props = {}) {
|
|
|
2601
2612
|
!!keepStateOptions.keepDirtyValues ||
|
|
2602
2613
|
(!_options.shouldUnregister && !isEmptyObject(values));
|
|
2603
2614
|
_state.watch = !!_options.shouldUnregister;
|
|
2615
|
+
_state.keepIsValid = !!keepStateOptions.keepIsValid;
|
|
2604
2616
|
_state.action = false;
|
|
2605
2617
|
// Clear errors synchronously to prevent validation errors on subsequent submissions
|
|
2606
2618
|
// This fixes the issue where form.reset() causes validation errors on subsequent
|
|
@@ -2648,7 +2660,7 @@ function createFormControl(props = {}) {
|
|
|
2648
2660
|
};
|
|
2649
2661
|
const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
|
|
2650
2662
|
? formValues(_formValues)
|
|
2651
|
-
: formValues, keepStateOptions);
|
|
2663
|
+
: formValues, { ..._options.resetOptions, ...keepStateOptions });
|
|
2652
2664
|
const setFocus = (name, options = {}) => {
|
|
2653
2665
|
const field = get(_fields, name);
|
|
2654
2666
|
const fieldReference = field && field._f;
|
|
@@ -2657,10 +2669,14 @@ function createFormControl(props = {}) {
|
|
|
2657
2669
|
? fieldReference.refs[0]
|
|
2658
2670
|
: fieldReference.ref;
|
|
2659
2671
|
if (fieldRef.focus) {
|
|
2660
|
-
|
|
2661
|
-
|
|
2662
|
-
|
|
2663
|
-
fieldRef.
|
|
2672
|
+
// Use setTimeout to ensure focus happens after any pending state updates
|
|
2673
|
+
// This fixes the issue where setFocus doesn't work immediately after setError
|
|
2674
|
+
setTimeout(() => {
|
|
2675
|
+
fieldRef.focus();
|
|
2676
|
+
options.shouldSelect &&
|
|
2677
|
+
isFunction(fieldRef.select) &&
|
|
2678
|
+
fieldRef.select();
|
|
2679
|
+
});
|
|
2664
2680
|
}
|
|
2665
2681
|
}
|
|
2666
2682
|
};
|
|
@@ -2751,6 +2767,7 @@ function createFormControl(props = {}) {
|
|
|
2751
2767
|
setError,
|
|
2752
2768
|
_subscribe,
|
|
2753
2769
|
_runSchema,
|
|
2770
|
+
_updateIsValidating,
|
|
2754
2771
|
_focusError,
|
|
2755
2772
|
_getWatch,
|
|
2756
2773
|
_getDirty,
|
|
@@ -2832,7 +2849,7 @@ var generateId = () => {
|
|
|
2832
2849
|
}
|
|
2833
2850
|
const d = typeof performance === 'undefined' ? Date.now() : performance.now() * 1000;
|
|
2834
2851
|
return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
|
|
2835
|
-
const r = (Math.random() * 16 + d) % 16 | 0;
|
|
2852
|
+
const r = ((Math.random() * 16 + d) % 16) | 0;
|
|
2836
2853
|
return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16);
|
|
2837
2854
|
});
|
|
2838
2855
|
};
|
|
@@ -3054,6 +3071,7 @@ function useFieldArray(props) {
|
|
|
3054
3071
|
!getValidationModes(control._options.reValidateMode).isOnSubmit) {
|
|
3055
3072
|
if (control._options.resolver) {
|
|
3056
3073
|
control._runSchema([name]).then((result) => {
|
|
3074
|
+
control._updateIsValidating([name]);
|
|
3057
3075
|
const error = get(result.errors, name);
|
|
3058
3076
|
const existingError = get(control._formState.errors, name);
|
|
3059
3077
|
if (existingError
|
|
@@ -3312,7 +3330,11 @@ function useForm(props = {}) {
|
|
|
3312
3330
|
* Watch component that subscribes to form field changes and re-renders when watched fields update.
|
|
3313
3331
|
*
|
|
3314
3332
|
* @param control - The form control object from useForm
|
|
3315
|
-
* @param
|
|
3333
|
+
* @param name - Can be field name, array of field names, or undefined to watch the entire form
|
|
3334
|
+
* @param disabled - Disable subscription
|
|
3335
|
+
* @param exact - Whether to watch exact field names or not
|
|
3336
|
+
* @param defaultValue - The default value to use if the field is not yet set
|
|
3337
|
+
* @param compute - Function to compute derived values from watched fields
|
|
3316
3338
|
* @param render - The function that receives watched values and returns ReactNode
|
|
3317
3339
|
* @returns The result of calling render function with watched values
|
|
3318
3340
|
*
|
|
@@ -3330,7 +3352,7 @@ function useForm(props = {}) {
|
|
|
3330
3352
|
* />
|
|
3331
3353
|
* ```
|
|
3332
3354
|
*/
|
|
3333
|
-
const Watch = ({
|
|
3355
|
+
const Watch = ({ render, names, ...props }) => render(useWatch({ ...props, name: names }));
|
|
3334
3356
|
|
|
3335
3357
|
export { Controller, Form, FormProvider, FormStateSubscribe, Watch, appendErrors, createFormControl, get, set, submitForm as submit, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
|
|
3336
3358
|
//# sourceMappingURL=index.esm.mjs.map
|