@bombillazo/rhf-plus 7.71.2-plus.4 → 7.72.1-plus.1
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/__tests__/useFieldArray/dirtyFields.test.d.ts +2 -0
- package/dist/__tests__/useFieldArray/dirtyFields.test.d.ts.map +1 -0
- package/dist/constants.d.ts +5 -0
- package/dist/constants.d.ts.map +1 -1
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.esm.mjs +162 -63
- 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/isNameInFieldArray.d.ts.map +1 -1
- package/dist/logic/updateFieldArrayRootError.d.ts.map +1 -1
- package/dist/react-server.esm.mjs +123 -24
- package/dist/react-server.esm.mjs.map +1 -1
- package/dist/types/errors.d.ts +1 -0
- package/dist/types/errors.d.ts.map +1 -1
- package/dist/types/form.d.ts +7 -3
- package/dist/types/form.d.ts.map +1 -1
- package/dist/types/validator.d.ts +13 -2
- package/dist/types/validator.d.ts.map +1 -1
- package/dist/useFormContext.d.ts.map +1 -1
- package/package.json +20 -20
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"createFormControl.d.ts","sourceRoot":"","sources":["../../src/logic/createFormControl.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"createFormControl.d.ts","sourceRoot":"","sources":["../../src/logic/createFormControl.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAaV,WAAW,EACX,YAAY,EAiBZ,YAAY,EAIZ,aAAa,EAWd,MAAM,UAAU,CAAC;AA0DlB,wBAAgB,iBAAiB,CAC/B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,QAAQ,GAAG,GAAG,EACd,kBAAkB,GAAG,YAAY,EACjC,SAAS,SAAS,YAAY,GAAG,GAAG,EAEpC,KAAK,GAAE,YAAY,CACjB,YAAY,EACZ,QAAQ,EACR,kBAAkB,EAClB,SAAS,CACL,GACL,IAAI,CACL,aAAa,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,SAAS,CAAC,EACpE,WAAW,CACZ,GAAG;IACF,WAAW,EAAE,IAAI,CACf,aAAa,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,SAAS,CAAC,EACpE,WAAW,CACZ,CAAC;CACH,CAo7DA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"isNameInFieldArray.d.ts","sourceRoot":"","sources":["../../src/logic/isNameInFieldArray.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"isNameInFieldArray.d.ts","sourceRoot":"","sources":["../../src/logic/isNameInFieldArray.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;yBAElC,OAAO,GAAG,CAAC,iBAAiB,CAAC,EAAE,MAAM,iBAAiB;AAAtE,wBAMM"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"updateFieldArrayRootError.d.ts","sourceRoot":"","sources":["../../src/logic/updateFieldArrayRootError.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"updateFieldArrayRootError.d.ts","sourceRoot":"","sources":["../../src/logic/updateFieldArrayRootError.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,WAAW,EACX,iBAAiB,EAClB,MAAM,UAAU,CAAC;yBAKF,CAAC,SAAS,WAAW,GAAG,WAAW,EACjD,QAAQ,WAAW,CAAC,CAAC,CAAC,EACtB,OAAO,OAAO,CAAC,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC,EAC1C,MAAM,iBAAiB,KACtB,WAAW,CAAC,CAAC,CAAC;AAJjB,wBASE"}
|
|
@@ -14,7 +14,11 @@ const EVENTS = {
|
|
|
14
14
|
BLUR: 'blur',
|
|
15
15
|
FOCUS_OUT: 'focusout',
|
|
16
16
|
FOCUS: 'focus',
|
|
17
|
-
FOCUS_IN: 'focusin'
|
|
17
|
+
FOCUS_IN: 'focusin',
|
|
18
|
+
SUBMIT: 'submit',
|
|
19
|
+
TRIGGER: 'trigger',
|
|
20
|
+
VALID: 'valid',
|
|
21
|
+
};
|
|
18
22
|
const VALIDATION_MODE = {
|
|
19
23
|
onBlur: 'onBlur',
|
|
20
24
|
onChange: 'onChange',
|
|
@@ -31,6 +35,8 @@ const INPUT_VALIDATION_RULES = {
|
|
|
31
35
|
required: 'required',
|
|
32
36
|
validate: 'validate',
|
|
33
37
|
};
|
|
38
|
+
const FORM_ERROR_TYPE = 'form';
|
|
39
|
+
const ROOT_ERROR_TYPE = 'root';
|
|
34
40
|
|
|
35
41
|
var isDateObject = (value) => value instanceof Date;
|
|
36
42
|
|
|
@@ -141,8 +147,8 @@ function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
|
|
|
141
147
|
if (key !== 'ref') {
|
|
142
148
|
const val2 = object2[key];
|
|
143
149
|
if ((isDateObject(val1) && isDateObject(val2)) ||
|
|
144
|
-
(isObject(val1)
|
|
145
|
-
|
|
150
|
+
((isObject(val1) || Array.isArray(val1)) &&
|
|
151
|
+
(isObject(val2) || Array.isArray(val2)))
|
|
146
152
|
? !deepEqual(val1, val2, _internal_visited)
|
|
147
153
|
: !Object.is(val1, val2)) {
|
|
148
154
|
return false;
|
|
@@ -447,6 +453,8 @@ function getFieldValue(_f) {
|
|
|
447
453
|
return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
|
|
448
454
|
}
|
|
449
455
|
|
|
456
|
+
var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name;
|
|
457
|
+
|
|
450
458
|
var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
|
|
451
459
|
const fields = {};
|
|
452
460
|
for (const name of fieldsNames) {
|
|
@@ -498,9 +506,9 @@ var hasValidation = (options) => options.mount &&
|
|
|
498
506
|
options.pattern ||
|
|
499
507
|
options.validate);
|
|
500
508
|
|
|
501
|
-
var
|
|
502
|
-
|
|
503
|
-
|
|
509
|
+
var isNameInFieldArray = (names, name) => name
|
|
510
|
+
.split('.')
|
|
511
|
+
.some((part, index, arr) => !isNaN(Number(part)) && names.has(arr.slice(0, index).join('.')));
|
|
504
512
|
|
|
505
513
|
var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
|
|
506
514
|
(_names.watchAll ||
|
|
@@ -633,7 +641,7 @@ var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(re
|
|
|
633
641
|
|
|
634
642
|
var updateFieldArrayRootError = (errors, error, name) => {
|
|
635
643
|
const fieldArrayErrors = convertToArrayPayload(get(errors, name));
|
|
636
|
-
set(fieldArrayErrors,
|
|
644
|
+
set(fieldArrayErrors, ROOT_ERROR_TYPE, error[name]);
|
|
637
645
|
set(errors, name, fieldArrayErrors);
|
|
638
646
|
return errors;
|
|
639
647
|
};
|
|
@@ -890,6 +898,7 @@ function createFormControl(props = {}) {
|
|
|
890
898
|
unMount: new Set(),
|
|
891
899
|
array: new Set(),
|
|
892
900
|
watch: new Set(),
|
|
901
|
+
registerName: new Set(),
|
|
893
902
|
};
|
|
894
903
|
let delayErrorCallback;
|
|
895
904
|
let timer = 0;
|
|
@@ -937,7 +946,11 @@ function createFormControl(props = {}) {
|
|
|
937
946
|
_updateIsValidating();
|
|
938
947
|
}
|
|
939
948
|
else {
|
|
940
|
-
isValid = await executeBuiltInValidation(
|
|
949
|
+
isValid = await executeBuiltInValidation({
|
|
950
|
+
fields: _fields,
|
|
951
|
+
onlyCheckValid: true,
|
|
952
|
+
eventType: EVENTS.VALID,
|
|
953
|
+
});
|
|
941
954
|
}
|
|
942
955
|
if (isValid !== _formState.isValid) {
|
|
943
956
|
_subjects.state.next({
|
|
@@ -965,6 +978,11 @@ function createFormControl(props = {}) {
|
|
|
965
978
|
});
|
|
966
979
|
}
|
|
967
980
|
};
|
|
981
|
+
const _updateDirtyFields = (name) => {
|
|
982
|
+
const fullDirtyFields = getDirtyFields(_defaultValues, _formValues);
|
|
983
|
+
const rootName = getNodeParentName(name);
|
|
984
|
+
set(_formState.dirtyFields, rootName, get(fullDirtyFields, rootName));
|
|
985
|
+
};
|
|
968
986
|
const _setFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
|
|
969
987
|
if (args && method && !_options.disabled) {
|
|
970
988
|
_state.action = true;
|
|
@@ -986,7 +1004,7 @@ function createFormControl(props = {}) {
|
|
|
986
1004
|
shouldSetValues && set(_formState.touchedFields, name, touchedFields);
|
|
987
1005
|
}
|
|
988
1006
|
if (_proxyFormState.dirtyFields || _proxySubscribeFormState.dirtyFields) {
|
|
989
|
-
|
|
1007
|
+
_updateDirtyFields(name);
|
|
990
1008
|
}
|
|
991
1009
|
_subjects.state.next({
|
|
992
1010
|
name,
|
|
@@ -1133,8 +1151,7 @@ function createFormControl(props = {}) {
|
|
|
1133
1151
|
};
|
|
1134
1152
|
const _runSchema = async (name) => {
|
|
1135
1153
|
_updateIsValidating(name, true);
|
|
1136
|
-
|
|
1137
|
-
return result;
|
|
1154
|
+
return await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
|
|
1138
1155
|
};
|
|
1139
1156
|
const executeSchemaAndUpdateState = async (names) => {
|
|
1140
1157
|
const { errors } = await _runSchema(names);
|
|
@@ -1152,9 +1169,55 @@ function createFormControl(props = {}) {
|
|
|
1152
1169
|
}
|
|
1153
1170
|
return errors;
|
|
1154
1171
|
};
|
|
1155
|
-
const
|
|
1172
|
+
const validateForm = async ({ name, eventType, }) => {
|
|
1173
|
+
if (props.validate) {
|
|
1174
|
+
const result = await props.validate({
|
|
1175
|
+
formValues: _formValues,
|
|
1176
|
+
formState: _formState,
|
|
1177
|
+
name,
|
|
1178
|
+
eventType,
|
|
1179
|
+
});
|
|
1180
|
+
if (isObject(result)) {
|
|
1181
|
+
for (const key in result) {
|
|
1182
|
+
const error = result[key];
|
|
1183
|
+
if (error) {
|
|
1184
|
+
setError(`${FORM_ERROR_TYPE}.${key}`, {
|
|
1185
|
+
message: isString(result.message) ? result.message : '',
|
|
1186
|
+
type: INPUT_VALIDATION_RULES.validate,
|
|
1187
|
+
});
|
|
1188
|
+
}
|
|
1189
|
+
}
|
|
1190
|
+
}
|
|
1191
|
+
else if (isString(result) || !result) {
|
|
1192
|
+
setError(FORM_ERROR_TYPE, {
|
|
1193
|
+
message: result || '',
|
|
1194
|
+
type: INPUT_VALIDATION_RULES.validate,
|
|
1195
|
+
});
|
|
1196
|
+
}
|
|
1197
|
+
else {
|
|
1198
|
+
clearErrors(FORM_ERROR_TYPE);
|
|
1199
|
+
}
|
|
1200
|
+
return result;
|
|
1201
|
+
}
|
|
1202
|
+
return true;
|
|
1203
|
+
};
|
|
1204
|
+
const executeBuiltInValidation = async ({ fields, onlyCheckValid, name, eventType, context = {
|
|
1156
1205
|
valid: true,
|
|
1157
|
-
|
|
1206
|
+
runRootValidation: false,
|
|
1207
|
+
}, }) => {
|
|
1208
|
+
if (props.validate) {
|
|
1209
|
+
context.runRootValidation = true;
|
|
1210
|
+
const result = await validateForm({
|
|
1211
|
+
name,
|
|
1212
|
+
eventType,
|
|
1213
|
+
});
|
|
1214
|
+
if (!result) {
|
|
1215
|
+
context.valid = false;
|
|
1216
|
+
if (onlyCheckValid) {
|
|
1217
|
+
return context.valid;
|
|
1218
|
+
}
|
|
1219
|
+
}
|
|
1220
|
+
}
|
|
1158
1221
|
for (const name in fields) {
|
|
1159
1222
|
const field = fields[name];
|
|
1160
1223
|
if (field) {
|
|
@@ -1170,25 +1233,34 @@ function createFormControl(props = {}) {
|
|
|
1170
1233
|
..._names.disabled,
|
|
1171
1234
|
..._names.readonly,
|
|
1172
1235
|
]);
|
|
1173
|
-
const fieldError = await validateField(field, skipValidationFields, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !
|
|
1236
|
+
const fieldError = await validateField(field, skipValidationFields, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !onlyCheckValid, isFieldArrayRoot);
|
|
1174
1237
|
if (isPromiseFunction && _proxyFormState.validatingFields) {
|
|
1175
1238
|
_updateIsValidating([_f.name]);
|
|
1176
1239
|
}
|
|
1177
1240
|
if (fieldError[_f.name]) {
|
|
1178
1241
|
context.valid = false;
|
|
1179
|
-
if (
|
|
1242
|
+
if (onlyCheckValid) {
|
|
1180
1243
|
break;
|
|
1181
1244
|
}
|
|
1182
1245
|
}
|
|
1183
|
-
!
|
|
1246
|
+
!onlyCheckValid &&
|
|
1184
1247
|
(get(fieldError, _f.name)
|
|
1185
1248
|
? isFieldArrayRoot
|
|
1186
1249
|
? updateFieldArrayRootError(_formState.errors, fieldError, _f.name)
|
|
1187
1250
|
: set(_formState.errors, _f.name, fieldError[_f.name])
|
|
1188
1251
|
: unset(_formState.errors, _f.name));
|
|
1252
|
+
if (props.shouldUseNativeValidation && fieldError[_f.name]) {
|
|
1253
|
+
break;
|
|
1254
|
+
}
|
|
1189
1255
|
}
|
|
1190
1256
|
!isEmptyObject(fieldValue) &&
|
|
1191
|
-
(await executeBuiltInValidation(
|
|
1257
|
+
(await executeBuiltInValidation({
|
|
1258
|
+
context,
|
|
1259
|
+
onlyCheckValid,
|
|
1260
|
+
fields: fieldValue,
|
|
1261
|
+
name: name,
|
|
1262
|
+
eventType,
|
|
1263
|
+
}));
|
|
1192
1264
|
}
|
|
1193
1265
|
}
|
|
1194
1266
|
return context.valid;
|
|
@@ -1308,9 +1380,10 @@ function createFormControl(props = {}) {
|
|
|
1308
1380
|
_proxyFormState.isDirtySinceSubmit ||
|
|
1309
1381
|
_proxySubscribeFormState.isDirtySinceSubmit) &&
|
|
1310
1382
|
options.shouldDirty) {
|
|
1383
|
+
_updateDirtyFields(name);
|
|
1311
1384
|
_subjects.state.next({
|
|
1312
1385
|
name,
|
|
1313
|
-
dirtyFields:
|
|
1386
|
+
dirtyFields: _formState.dirtyFields,
|
|
1314
1387
|
isDirty: _getDirty(name, cloneValue),
|
|
1315
1388
|
...((_formState.isSubmitted || _hasBeenSubmitted) &&
|
|
1316
1389
|
!_formState.isDirtySinceSubmit
|
|
@@ -1432,6 +1505,7 @@ function createFormControl(props = {}) {
|
|
|
1432
1505
|
const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
|
|
1433
1506
|
const isFocusEvent = event.type === EVENTS.FOCUS || event.type === EVENTS.FOCUS_IN;
|
|
1434
1507
|
const shouldSkipValidation = (!hasValidation(field._f) &&
|
|
1508
|
+
!props.validate &&
|
|
1435
1509
|
!_options.resolver &&
|
|
1436
1510
|
!get(_formState.errors, name) &&
|
|
1437
1511
|
!field._f.deps) ||
|
|
@@ -1469,6 +1543,12 @@ function createFormControl(props = {}) {
|
|
|
1469
1543
|
return (shouldRender &&
|
|
1470
1544
|
_subjects.state.next({ name, ...(watched ? {} : fieldState) }));
|
|
1471
1545
|
}
|
|
1546
|
+
if (!_options.resolver && props.validate) {
|
|
1547
|
+
await validateForm({
|
|
1548
|
+
name: name,
|
|
1549
|
+
eventType: event.type,
|
|
1550
|
+
});
|
|
1551
|
+
}
|
|
1472
1552
|
!isBlurEvent && watched && _subjects.state.next({ ..._formState });
|
|
1473
1553
|
if (_options.resolver) {
|
|
1474
1554
|
const { errors } = await _runSchema([name]);
|
|
@@ -1498,7 +1578,12 @@ function createFormControl(props = {}) {
|
|
|
1498
1578
|
}
|
|
1499
1579
|
else if (_proxyFormState.isValid ||
|
|
1500
1580
|
_proxySubscribeFormState.isValid) {
|
|
1501
|
-
isValid = await executeBuiltInValidation(
|
|
1581
|
+
isValid = await executeBuiltInValidation({
|
|
1582
|
+
fields: _fields,
|
|
1583
|
+
onlyCheckValid: true,
|
|
1584
|
+
name: name,
|
|
1585
|
+
eventType: event.type,
|
|
1586
|
+
});
|
|
1502
1587
|
}
|
|
1503
1588
|
}
|
|
1504
1589
|
}
|
|
@@ -1531,12 +1616,19 @@ function createFormControl(props = {}) {
|
|
|
1531
1616
|
else if (name) {
|
|
1532
1617
|
validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
|
|
1533
1618
|
const field = get(_fields, fieldName);
|
|
1534
|
-
return await executeBuiltInValidation(
|
|
1619
|
+
return await executeBuiltInValidation({
|
|
1620
|
+
fields: field && field._f ? { [fieldName]: field } : field,
|
|
1621
|
+
eventType: EVENTS.TRIGGER,
|
|
1622
|
+
});
|
|
1535
1623
|
}))).every(Boolean);
|
|
1536
1624
|
!(!validationResult && !_formState.isValid) && _setValid();
|
|
1537
1625
|
}
|
|
1538
1626
|
else {
|
|
1539
|
-
validationResult = isValid = await executeBuiltInValidation(
|
|
1627
|
+
validationResult = isValid = await executeBuiltInValidation({
|
|
1628
|
+
fields: _fields,
|
|
1629
|
+
name,
|
|
1630
|
+
eventType: EVENTS.TRIGGER,
|
|
1631
|
+
});
|
|
1540
1632
|
}
|
|
1541
1633
|
_subjects.state.next({
|
|
1542
1634
|
...(!isString(name) ||
|
|
@@ -1685,6 +1777,7 @@ function createFormControl(props = {}) {
|
|
|
1685
1777
|
const disabledIsDefined = isBoolean(options.disabled) ||
|
|
1686
1778
|
isBoolean(_options.disabled) ||
|
|
1687
1779
|
Array.isArray(_options.disabled);
|
|
1780
|
+
const shouldRevalidateRemount = !_names.registerName.has(name) && field && !field._f.mount;
|
|
1688
1781
|
set(_fields, name, {
|
|
1689
1782
|
...(field || {}),
|
|
1690
1783
|
_f: {
|
|
@@ -1695,7 +1788,7 @@ function createFormControl(props = {}) {
|
|
|
1695
1788
|
},
|
|
1696
1789
|
});
|
|
1697
1790
|
_names.mount.add(name);
|
|
1698
|
-
if (field) {
|
|
1791
|
+
if (field && !shouldRevalidateRemount) {
|
|
1699
1792
|
_setDisabledField({
|
|
1700
1793
|
disabled: isBoolean(options.disabled)
|
|
1701
1794
|
? options.disabled
|
|
@@ -1734,7 +1827,9 @@ function createFormControl(props = {}) {
|
|
|
1734
1827
|
onFocus: onChange,
|
|
1735
1828
|
ref: (ref) => {
|
|
1736
1829
|
if (ref) {
|
|
1830
|
+
_names.registerName.add(name);
|
|
1737
1831
|
register(name, options);
|
|
1832
|
+
_names.registerName.delete(name);
|
|
1738
1833
|
field = get(_fields, name);
|
|
1739
1834
|
const fieldRef = isUndefined(ref.value)
|
|
1740
1835
|
? ref.querySelectorAll
|
|
@@ -1843,14 +1938,17 @@ function createFormControl(props = {}) {
|
|
|
1843
1938
|
fieldValues = cloneObject(values);
|
|
1844
1939
|
}
|
|
1845
1940
|
else {
|
|
1846
|
-
await executeBuiltInValidation(
|
|
1941
|
+
await executeBuiltInValidation({
|
|
1942
|
+
fields: _fields,
|
|
1943
|
+
eventType: EVENTS.SUBMIT,
|
|
1944
|
+
});
|
|
1847
1945
|
}
|
|
1848
1946
|
if (_names.disabled.size) {
|
|
1849
1947
|
for (const name of _names.disabled) {
|
|
1850
1948
|
unset(fieldValues, name);
|
|
1851
1949
|
}
|
|
1852
1950
|
}
|
|
1853
|
-
unset(_formState.errors,
|
|
1951
|
+
unset(_formState.errors, ROOT_ERROR_TYPE);
|
|
1854
1952
|
if (isEmptyObject(_formState.errors)) {
|
|
1855
1953
|
_subjects.state.next({
|
|
1856
1954
|
errors: {},
|
|
@@ -1977,6 +2075,7 @@ function createFormControl(props = {}) {
|
|
|
1977
2075
|
mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
|
|
1978
2076
|
unMount: new Set(),
|
|
1979
2077
|
array: new Set(),
|
|
2078
|
+
registerName: new Set(),
|
|
1980
2079
|
disabled: new Set(),
|
|
1981
2080
|
readonly: new Set(),
|
|
1982
2081
|
watch: new Set(),
|