@bombillazo/rhf-plus 7.62.0-plus.7 → 7.64.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/LICENSE +1 -0
- package/README.md +41 -64
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.mjs +57 -35
- 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/logic/getDirtyFields.d.ts +3 -2
- package/dist/logic/getDirtyFields.d.ts.map +1 -1
- package/dist/logic/getValidateError.d.ts.map +1 -1
- package/dist/react-server.esm.mjs +50 -32
- package/dist/react-server.esm.mjs.map +1 -1
- package/dist/types/form.d.ts +14 -3
- package/dist/types/form.d.ts.map +1 -1
- package/dist/types/path/eager.d.ts +1 -1
- package/dist/types/path/eager.d.ts.map +1 -1
- package/dist/types/resolvers.d.ts +2 -2
- package/dist/types/resolvers.d.ts.map +1 -1
- package/dist/useController.d.ts.map +1 -1
- package/dist/useFieldArray.d.ts.map +1 -1
- package/dist/utils/extractFormValues.d.ts +2 -0
- package/dist/utils/extractFormValues.d.ts.map +1 -0
- package/package.json +33 -36
package/dist/index.esm.mjs
CHANGED
|
@@ -448,6 +448,7 @@ function useController(props) {
|
|
|
448
448
|
});
|
|
449
449
|
const _props = React.useRef(props);
|
|
450
450
|
const _previousRules = React.useRef(props.rules);
|
|
451
|
+
const _previousNameRef = React.useRef(undefined);
|
|
451
452
|
const _registerProps = React.useRef(control.register(name, {
|
|
452
453
|
...props.rules,
|
|
453
454
|
value,
|
|
@@ -567,6 +568,10 @@ function useController(props) {
|
|
|
567
568
|
]);
|
|
568
569
|
React.useEffect(() => {
|
|
569
570
|
const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
|
|
571
|
+
const previousName = _previousNameRef.current;
|
|
572
|
+
if (previousName && previousName !== name && !isArrayField) {
|
|
573
|
+
control.unregister(previousName);
|
|
574
|
+
}
|
|
570
575
|
control.register(name, {
|
|
571
576
|
..._props.current.rules,
|
|
572
577
|
...(isBoolean(_props.current.disabled)
|
|
@@ -581,13 +586,14 @@ function useController(props) {
|
|
|
581
586
|
};
|
|
582
587
|
updateMounted(name, true);
|
|
583
588
|
if (_shouldUnregisterField) {
|
|
584
|
-
const value = cloneObject(get(control._options.defaultValues, name));
|
|
589
|
+
const value = cloneObject(get(control._options.defaultValues, name, _props.current.defaultValue));
|
|
585
590
|
set(control._defaultValues, name, value);
|
|
586
591
|
if (isUndefined(get(control._formValues, name))) {
|
|
587
592
|
set(control._formValues, name, value);
|
|
588
593
|
}
|
|
589
594
|
}
|
|
590
595
|
!isArrayField && control.register(name);
|
|
596
|
+
_previousNameRef.current = name;
|
|
591
597
|
return () => {
|
|
592
598
|
(isArrayField
|
|
593
599
|
? _shouldUnregisterField && !control._state.action
|
|
@@ -843,6 +849,26 @@ function deepMerge(target, source) {
|
|
|
843
849
|
return target;
|
|
844
850
|
}
|
|
845
851
|
|
|
852
|
+
function extractFormValues(fieldsState, formValues) {
|
|
853
|
+
const values = {};
|
|
854
|
+
for (const key in fieldsState) {
|
|
855
|
+
if (fieldsState.hasOwnProperty(key)) {
|
|
856
|
+
const fieldState = fieldsState[key];
|
|
857
|
+
const fieldValue = formValues[key];
|
|
858
|
+
if (fieldState && isObject(fieldState) && fieldValue) {
|
|
859
|
+
const nestedFieldsState = extractFormValues(fieldState, fieldValue);
|
|
860
|
+
if (isObject(nestedFieldsState)) {
|
|
861
|
+
values[key] = nestedFieldsState;
|
|
862
|
+
}
|
|
863
|
+
}
|
|
864
|
+
else if (fieldsState[key]) {
|
|
865
|
+
values[key] = fieldValue;
|
|
866
|
+
}
|
|
867
|
+
}
|
|
868
|
+
}
|
|
869
|
+
return values;
|
|
870
|
+
}
|
|
871
|
+
|
|
846
872
|
var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
|
|
847
873
|
|
|
848
874
|
var isFileInput = (element) => element.type === 'file';
|
|
@@ -924,46 +950,40 @@ var objectHasFunction = (data) => {
|
|
|
924
950
|
return false;
|
|
925
951
|
};
|
|
926
952
|
|
|
953
|
+
function isTraversable(value) {
|
|
954
|
+
return Array.isArray(value) || (isObject(value) && !objectHasFunction(value));
|
|
955
|
+
}
|
|
927
956
|
function markFieldsDirty(data, fields = {}) {
|
|
928
|
-
const
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
}
|
|
936
|
-
else if (!isNullOrUndefined(data[key])) {
|
|
937
|
-
fields[key] = true;
|
|
938
|
-
}
|
|
957
|
+
for (const key in data) {
|
|
958
|
+
if (isTraversable(data[key])) {
|
|
959
|
+
fields[key] = Array.isArray(data[key]) ? [] : {};
|
|
960
|
+
markFieldsDirty(data[key], fields[key]);
|
|
961
|
+
}
|
|
962
|
+
else if (!isNullOrUndefined(data[key])) {
|
|
963
|
+
fields[key] = true;
|
|
939
964
|
}
|
|
940
965
|
}
|
|
941
966
|
return fields;
|
|
942
967
|
}
|
|
943
|
-
function
|
|
944
|
-
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
dirtyFieldsFromValues[key] = Array.isArray(data[key])
|
|
952
|
-
? markFieldsDirty(data[key], [])
|
|
953
|
-
: { ...markFieldsDirty(data[key]) };
|
|
954
|
-
}
|
|
955
|
-
else {
|
|
956
|
-
getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
|
|
957
|
-
}
|
|
968
|
+
function getDirtyFields(data, formValues, dirtyFieldsFromValues) {
|
|
969
|
+
if (!dirtyFieldsFromValues) {
|
|
970
|
+
dirtyFieldsFromValues = markFieldsDirty(formValues);
|
|
971
|
+
}
|
|
972
|
+
for (const key in data) {
|
|
973
|
+
if (isTraversable(data[key])) {
|
|
974
|
+
if (isUndefined(formValues) || isPrimitive(dirtyFieldsFromValues[key])) {
|
|
975
|
+
dirtyFieldsFromValues[key] = markFieldsDirty(data[key], Array.isArray(data[key]) ? [] : {});
|
|
958
976
|
}
|
|
959
977
|
else {
|
|
960
|
-
|
|
978
|
+
getDirtyFields(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
|
|
961
979
|
}
|
|
962
980
|
}
|
|
981
|
+
else {
|
|
982
|
+
dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
|
|
983
|
+
}
|
|
963
984
|
}
|
|
964
985
|
return dirtyFieldsFromValues;
|
|
965
986
|
}
|
|
966
|
-
var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
|
|
967
987
|
|
|
968
988
|
const defaultResult = {
|
|
969
989
|
value: false,
|
|
@@ -1739,7 +1759,7 @@ function createFormControl(props = {}) {
|
|
|
1739
1759
|
const isFieldArrayRoot = _names.array.has(_f.name);
|
|
1740
1760
|
const isPromiseFunction = field._f && hasPromiseValidation(field._f);
|
|
1741
1761
|
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
1742
|
-
_updateIsValidating([name], true);
|
|
1762
|
+
_updateIsValidating([_f.name], true);
|
|
1743
1763
|
}
|
|
1744
1764
|
// Combine disabled and readonly field names for validation skipping
|
|
1745
1765
|
const skipValidationFields = new Set([
|
|
@@ -1748,7 +1768,7 @@ function createFormControl(props = {}) {
|
|
|
1748
1768
|
]);
|
|
1749
1769
|
const fieldError = await validateField(field, skipValidationFields, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
|
|
1750
1770
|
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
1751
|
-
_updateIsValidating([name]);
|
|
1771
|
+
_updateIsValidating([_f.name]);
|
|
1752
1772
|
}
|
|
1753
1773
|
if (fieldError[_f.name]) {
|
|
1754
1774
|
context.valid = false;
|
|
@@ -2061,6 +2081,7 @@ function createFormControl(props = {}) {
|
|
|
2061
2081
|
}
|
|
2062
2082
|
if (isFieldValueUpdated) {
|
|
2063
2083
|
field._f.deps &&
|
|
2084
|
+
(!Array.isArray(field._f.deps) || field._f.deps.length > 0) &&
|
|
2064
2085
|
trigger(field._f.deps);
|
|
2065
2086
|
shouldRenderByError(name, isValid, error, fieldState);
|
|
2066
2087
|
}
|
|
@@ -2108,10 +2129,13 @@ function createFormControl(props = {}) {
|
|
|
2108
2129
|
iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
|
|
2109
2130
|
return validationResult;
|
|
2110
2131
|
};
|
|
2111
|
-
const getValues = (fieldNames) => {
|
|
2112
|
-
|
|
2132
|
+
const getValues = (fieldNames, config) => {
|
|
2133
|
+
let values = {
|
|
2113
2134
|
...(_state.mount ? _formValues : _defaultValues),
|
|
2114
2135
|
};
|
|
2136
|
+
if (config) {
|
|
2137
|
+
values = extractFormValues(config.dirtyFields ? _formState.dirtyFields : _formState.touchedFields, values);
|
|
2138
|
+
}
|
|
2115
2139
|
return isUndefined(fieldNames)
|
|
2116
2140
|
? values
|
|
2117
2141
|
: isString(fieldNames)
|
|
@@ -2843,9 +2867,7 @@ function useFieldArray(props) {
|
|
|
2843
2867
|
const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
|
|
2844
2868
|
const [fields, setFields] = React.useState(control._getFieldArray(name));
|
|
2845
2869
|
const ids = React.useRef(control._getFieldArray(name).map(generateId));
|
|
2846
|
-
const _fieldIds = React.useRef(fields);
|
|
2847
2870
|
const _actioned = React.useRef(false);
|
|
2848
|
-
_fieldIds.current = fields;
|
|
2849
2871
|
control._names.array.add(name);
|
|
2850
2872
|
React.useMemo(() => rules &&
|
|
2851
2873
|
control.register(name, rules), [control, rules, name]);
|