react-hook-form 7.71.2 → 7.72.1

package/dist/logic/createFormControl.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createFormControl.d.ts","sourceRoot":"","sources":["../../src/logic/createFormControl.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAaV,WAAW,EAiBX,YAAY,EAIZ,aAAa,EAUd,MAAM,UAAU,CAAC;AAqDlB,wBAAgB,iBAAiB,CAC/B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,QAAQ,GAAG,GAAG,EACd,kBAAkB,GAAG,YAAY,EAEjC,KAAK,GAAE,YAAY,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAM,GACnE,IAAI,CACL,aAAa,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAC,EACzD,WAAW,CACZ,GAAG;IACF,WAAW,EAAE,IAAI,CACf,aAAa,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAC,EACzD,WAAW,CACZ,CAAC;CACH,CAk/CA"}
+{"version":3,"file":"createFormControl.d.ts","sourceRoot":"","sources":["../../src/logic/createFormControl.ts"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAaV,WAAW,EAiBX,YAAY,EAIZ,aAAa,EAWd,MAAM,UAAU,CAAC;AAsDlB,wBAAgB,iBAAiB,CAC/B,YAAY,SAAS,WAAW,GAAG,WAAW,EAC9C,QAAQ,GAAG,GAAG,EACd,kBAAkB,GAAG,YAAY,EAEjC,KAAK,GAAE,YAAY,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAM,GACnE,IAAI,CACL,aAAa,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAC,EACzD,WAAW,CACZ,GAAG;IACF,WAAW,EAAE,IAAI,CACf,aAAa,CAAC,YAAY,EAAE,QAAQ,EAAE,kBAAkB,CAAC,EACzD,WAAW,CACZ,CAAC;CACH,CAkmDA"}

package/dist/logic/isNameInFieldArray.d.ts.map

@@ -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;yBAIlC,OAAO,GAAG,CAAC,iBAAiB,CAAC,EAAE,MAAM,iBAAiB;AAAtE,wBACqC"}
+{"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"}

package/dist/logic/updateFieldArrayRootError.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"updateFieldArrayRootError.d.ts","sourceRoot":"","sources":["../../src/logic/updateFieldArrayRootError.ts"],"names":[],"mappings":"AAAA,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"}
+{"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"}

package/dist/react-server.esm.mjs

@@ -10,7 +10,11 @@ var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => va
 
 const EVENTS = {
     BLUR: 'blur',
-    FOCUS_OUT: 'focusout'};
+    FOCUS_OUT: 'focusout',
+    SUBMIT: 'submit',
+    TRIGGER: 'trigger',
+    VALID: 'valid',
+};
 const VALIDATION_MODE = {
     onBlur: 'onBlur',
     onChange: 'onChange',
@@ -27,6 +31,8 @@ const INPUT_VALIDATION_RULES = {
     required: 'required',
     validate: 'validate',
 };
+const FORM_ERROR_TYPE = 'form';
+const ROOT_ERROR_TYPE = 'root';
 
 var isDateObject = (value) => value instanceof Date;
 
@@ -127,8 +133,8 @@ function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
         if (key !== 'ref') {
             const val2 = object2[key];
             if ((isDateObject(val1) && isDateObject(val2)) ||
-                (isObject(val1) && isObject(val2)) ||
-                (Array.isArray(val1) && Array.isArray(val2))
+                ((isObject(val1) || Array.isArray(val1)) &&
+                    (isObject(val2) || Array.isArray(val2)))
                 ? !deepEqual(val1, val2, _internal_visited)
                 : !Object.is(val1, val2)) {
                 return false;
@@ -401,6 +407,8 @@ function getFieldValue(_f) {
     return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
 }
 
+var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name;
+
 var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
     const fields = {};
     for (const name of fieldsNames) {
@@ -452,9 +460,9 @@ var hasValidation = (options) => options.mount &&
         options.pattern ||
         options.validate);
 
-var getNodeParentName = (name) => name.substring(0, name.search(/\.\d+(\.|$)/)) || name;
-
-var isNameInFieldArray = (names, name) => names.has(getNodeParentName(name));
+var isNameInFieldArray = (names, name) => name
+    .split('.')
+    .some((part, index, arr) => !isNaN(Number(part)) && names.has(arr.slice(0, index).join('.')));
 
 var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
     (_names.watchAll ||
@@ -563,7 +571,7 @@ var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(re
 
 var updateFieldArrayRootError = (errors, error, name) => {
     const fieldArrayErrors = convertToArrayPayload(get(errors, name));
-    set(fieldArrayErrors, 'root', error[name]);
+    set(fieldArrayErrors, ROOT_ERROR_TYPE, error[name]);
     set(errors, name, fieldArrayErrors);
     return errors;
 };
@@ -811,6 +819,7 @@ function createFormControl(props = {}) {
         unMount: new Set(),
         array: new Set(),
         watch: new Set(),
+        registerName: new Set(),
     };
     let delayErrorCallback;
     let timer = 0;
@@ -852,7 +861,11 @@ function createFormControl(props = {}) {
                 _updateIsValidating();
             }
             else {
-                isValid = await executeBuiltInValidation(_fields, true);
+                isValid = await executeBuiltInValidation({
+                    fields: _fields,
+                    onlyCheckValid: true,
+                    eventType: EVENTS.VALID,
+                });
             }
             if (isValid !== _formState.isValid) {
                 _subjects.state.next({
@@ -880,6 +893,11 @@ function createFormControl(props = {}) {
             });
         }
     };
+    const _updateDirtyFields = (name) => {
+        const fullDirtyFields = getDirtyFields(_defaultValues, _formValues);
+        const rootName = getNodeParentName(name);
+        set(_formState.dirtyFields, rootName, get(fullDirtyFields, rootName));
+    };
     const _setFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
         if (args && method && !_options.disabled) {
             _state.action = true;
@@ -901,7 +919,7 @@ function createFormControl(props = {}) {
                 shouldSetValues && set(_formState.touchedFields, name, touchedFields);
             }
             if (_proxyFormState.dirtyFields || _proxySubscribeFormState.dirtyFields) {
-                _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
+                _updateDirtyFields(name);
             }
             _subjects.state.next({
                 name,
@@ -1015,8 +1033,7 @@ function createFormControl(props = {}) {
     };
     const _runSchema = async (name) => {
         _updateIsValidating(name, true);
-        const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
-        return result;
+        return await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
     };
     const executeSchemaAndUpdateState = async (names) => {
         const { errors } = await _runSchema(names);
@@ -1034,9 +1051,55 @@ function createFormControl(props = {}) {
         }
         return errors;
     };
-    const executeBuiltInValidation = async (fields, shouldOnlyCheckValid, context = {
+    const validateForm = async ({ name, eventType, }) => {
+        if (props.validate) {
+            const result = await props.validate({
+                formValues: _formValues,
+                formState: _formState,
+                name,
+                eventType,
+            });
+            if (isObject(result)) {
+                for (const key in result) {
+                    const error = result[key];
+                    if (error) {
+                        setError(`${FORM_ERROR_TYPE}.${key}`, {
+                            message: isString(result.message) ? result.message : '',
+                            type: INPUT_VALIDATION_RULES.validate,
+                        });
+                    }
+                }
+            }
+            else if (isString(result) || !result) {
+                setError(FORM_ERROR_TYPE, {
+                    message: result || '',
+                    type: INPUT_VALIDATION_RULES.validate,
+                });
+            }
+            else {
+                clearErrors(FORM_ERROR_TYPE);
+            }
+            return result;
+        }
+        return true;
+    };
+    const executeBuiltInValidation = async ({ fields, onlyCheckValid, name, eventType, context = {
         valid: true,
-    }) => {
+        runRootValidation: false,
+    }, }) => {
+        if (props.validate) {
+            context.runRootValidation = true;
+            const result = await validateForm({
+                name,
+                eventType,
+            });
+            if (!result) {
+                context.valid = false;
+                if (onlyCheckValid) {
+                    return context.valid;
+                }
+            }
+        }
         for (const name in fields) {
             const field = fields[name];
             if (field) {
@@ -1047,25 +1110,34 @@ function createFormControl(props = {}) {
                     if (isPromiseFunction && _proxyFormState.validatingFields) {
                         _updateIsValidating([_f.name], true);
                     }
-                    const fieldError = await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !shouldOnlyCheckValid, isFieldArrayRoot);
+                    const fieldError = await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation && !onlyCheckValid, isFieldArrayRoot);
                     if (isPromiseFunction && _proxyFormState.validatingFields) {
                         _updateIsValidating([_f.name]);
                     }
                     if (fieldError[_f.name]) {
                         context.valid = false;
-                        if (shouldOnlyCheckValid || props.shouldUseNativeValidation) {
+                        if (onlyCheckValid) {
                             break;
                         }
                     }
-                    !shouldOnlyCheckValid &&
+                    !onlyCheckValid &&
                         (get(fieldError, _f.name)
                             ? isFieldArrayRoot
                                 ? updateFieldArrayRootError(_formState.errors, fieldError, _f.name)
                                 : set(_formState.errors, _f.name, fieldError[_f.name])
                             : unset(_formState.errors, _f.name));
+                    if (props.shouldUseNativeValidation && fieldError[_f.name]) {
+                        break;
+                    }
                 }
                 !isEmptyObject(fieldValue) &&
-                    (await executeBuiltInValidation(fieldValue, shouldOnlyCheckValid, context));
+                    (await executeBuiltInValidation({
+                        context,
+                        onlyCheckValid,
+                        fields: fieldValue,
+                        name: name,
+                        eventType,
+                    }));
             }
         }
         return context.valid;
@@ -1176,9 +1248,10 @@ function createFormControl(props = {}) {
                 _proxySubscribeFormState.isDirty ||
                 _proxySubscribeFormState.dirtyFields) &&
                 options.shouldDirty) {
+                _updateDirtyFields(name);
                 _subjects.state.next({
                     name,
-                    dirtyFields: getDirtyFields(_defaultValues, _formValues),
+                    dirtyFields: _formState.dirtyFields,
                     isDirty: _getDirty(name, cloneValue),
                 });
             }
@@ -1224,6 +1297,7 @@ function createFormControl(props = {}) {
                 : getEventValue(event);
             const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
             const shouldSkipValidation = (!hasValidation(field._f) &&
+                !props.validate &&
                 !_options.resolver &&
                 !get(_formState.errors, name) &&
                 !field._f.deps) ||
@@ -1261,6 +1335,12 @@ function createFormControl(props = {}) {
                 return (shouldRender &&
                     _subjects.state.next({ name, ...(watched ? {} : fieldState) }));
             }
+            if (!_options.resolver && props.validate) {
+                await validateForm({
+                    name: name,
+                    eventType: event.type,
+                });
+            }
             !isBlurEvent && watched && _subjects.state.next({ ..._formState });
             if (_options.resolver) {
                 const { errors } = await _runSchema([name]);
@@ -1285,7 +1365,12 @@ function createFormControl(props = {}) {
                     }
                     else if (_proxyFormState.isValid ||
                         _proxySubscribeFormState.isValid) {
-                        isValid = await executeBuiltInValidation(_fields, true);
+                        isValid = await executeBuiltInValidation({
+                            fields: _fields,
+                            onlyCheckValid: true,
+                            name: name,
+                            eventType: event.type,
+                        });
                     }
                 }
             }
@@ -1318,12 +1403,19 @@ function createFormControl(props = {}) {
         else if (name) {
             validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
                 const field = get(_fields, fieldName);
-                return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
+                return await executeBuiltInValidation({
+                    fields: field && field._f ? { [fieldName]: field } : field,
+                    eventType: EVENTS.TRIGGER,
+                });
             }))).every(Boolean);
             !(!validationResult && !_formState.isValid) && _setValid();
         }
         else {
-            validationResult = isValid = await executeBuiltInValidation(_fields);
+            validationResult = isValid = await executeBuiltInValidation({
+                fields: _fields,
+                name,
+                eventType: EVENTS.TRIGGER,
+            });
         }
         _subjects.state.next({
             ...(!isString(name) ||
@@ -1469,6 +1561,7 @@ function createFormControl(props = {}) {
     const register = (name, options = {}) => {
         let field = get(_fields, name);
         const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
+        const shouldRevalidateRemount = !_names.registerName.has(name) && field && !field._f.mount;
         set(_fields, name, {
             ...(field || {}),
             _f: {
@@ -1479,7 +1572,7 @@ function createFormControl(props = {}) {
             },
         });
         _names.mount.add(name);
-        if (field) {
+        if (field && !shouldRevalidateRemount) {
             _setDisabledField({
                 disabled: isBoolean(options.disabled)
                     ? options.disabled
@@ -1509,7 +1602,9 @@ function createFormControl(props = {}) {
             onBlur: onChange,
             ref: (ref) => {
                 if (ref) {
+                    _names.registerName.add(name);
                     register(name, options);
+                    _names.registerName.delete(name);
                     field = get(_fields, name);
                     const fieldRef = isUndefined(ref.value)
                         ? ref.querySelectorAll
@@ -1588,14 +1683,17 @@ function createFormControl(props = {}) {
             fieldValues = cloneObject(values);
         }
         else {
-            await executeBuiltInValidation(_fields);
+            await executeBuiltInValidation({
+                fields: _fields,
+                eventType: EVENTS.SUBMIT,
+            });
         }
         if (_names.disabled.size) {
             for (const name of _names.disabled) {
                 unset(fieldValues, name);
             }
         }
-        unset(_formState.errors, 'root');
+        unset(_formState.errors, ROOT_ERROR_TYPE);
         if (isEmptyObject(_formState.errors)) {
             _subjects.state.next({
                 errors: {},
@@ -1719,6 +1817,7 @@ function createFormControl(props = {}) {
             mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
             unMount: new Set(),
             array: new Set(),
+            registerName: new Set(),
             disabled: new Set(),
             watch: new Set(),
             watchAll: false,