react-hook-form 7.45.3 → 7.46.0-next.0

package/dist/index.esm.mjs

@@ -435,6 +435,7 @@ function useController(props) {
         field: {
             name,
             value,
+            disabled: formState.disabled,
             onChange: React.useCallback((event) => _registerProps.current.onChange({
                 target: {
                     value: getEventValue(event),
@@ -568,7 +569,7 @@ function Form(props) {
                 formData.append(name, get(data, name));
             }
             if (onSubmit) {
-                onSubmit({
+                await onSubmit({
                     data,
                     event,
                     method,
@@ -635,28 +636,6 @@ var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => va
     }
     : {};
 
-const focusFieldBy = (fields, callback, fieldsNames) => {
-    for (const key of fieldsNames || Object.keys(fields)) {
-        const field = get(fields, key);
-        if (field) {
-            const { _f, ...currentField } = field;
-            if (_f && callback(_f.name)) {
-                if (_f.ref.focus) {
-                    _f.ref.focus();
-                    break;
-                }
-                else if (_f.refs && _f.refs[0].focus) {
-                    _f.refs[0].focus();
-                    break;
-                }
-            }
-            else if (isObject(currentField)) {
-                focusFieldBy(currentField, callback);
-            }
-        }
-    }
-};
-
 var generateId = () => {
     const d = typeof performance === 'undefined' ? Date.now() : performance.now() * 1000;
     return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
@@ -684,6 +663,26 @@ var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
         [..._names.watch].some((watchName) => name.startsWith(watchName) &&
             /^\.\w+/.test(name.slice(watchName.length))));
 
+const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
+    for (const key of fieldsNames || Object.keys(fields)) {
+        const field = get(fields, key);
+        if (field) {
+            const { _f, ...currentField } = field;
+            if (_f) {
+                if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
+                    break;
+                }
+                else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
+                    break;
+                }
+            }
+            else if (isObject(currentField)) {
+                iterateFieldsByAction(currentField, action);
+            }
+        }
+    }
+};
+
 var updateFieldArrayRootError = (errors, error, name) => {
     const fieldArrayErrors = compact(get(errors, name));
     set(fieldArrayErrors, 'root', error[name]);
@@ -1227,7 +1226,15 @@ function useFieldArray(props) {
             values: { ...control._formValues },
         });
         control._names.focus &&
-            focusFieldBy(control._fields, (key) => !!key && key.startsWith(control._names.focus || ''));
+            iterateFieldsByAction(control._fields, (ref, key) => {
+                if (control._names.focus &&
+                    key.startsWith(control._names.focus) &&
+                    ref.focus) {
+                    ref.focus();
+                    return 1;
+                }
+                return;
+            });
         control._names.focus = '';
         control._updateValid();
         _actioned.current = false;
@@ -1508,6 +1515,7 @@ function createFormControl(props = {}, flushRootRender) {
         touchedFields: {},
         dirtyFields: {},
         errors: {},
+        disabled: false,
     };
     let _fields = {};
     let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values)
@@ -1916,6 +1924,13 @@ function createFormControl(props = {}, flushRootRender) {
             }
         }
     };
+    const _focusInput = (ref, key) => {
+        if (get(_formState.errors, key) && ref.focus) {
+            ref.focus();
+            return 1;
+        }
+        return;
+    };
     const trigger = async (name, options = {}) => {
         let isValid;
         let validationResult;
@@ -1949,7 +1964,7 @@ function createFormControl(props = {}, flushRootRender) {
         });
         options.shouldFocus &&
             !validationResult &&
-            focusFieldBy(_fields, (key) => key && get(_formState.errors, key), name ? fieldNames : _names.mount);
+            iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
         return validationResult;
     };
     const getValues = (fieldNames) => {
@@ -2098,7 +2113,15 @@ function createFormControl(props = {}, flushRootRender) {
         };
     };
     const _focusError = () => _options.shouldFocusError &&
-        focusFieldBy(_fields, (key) => key && get(_formState.errors, key), _names.mount);
+        iterateFieldsByAction(_fields, _focusInput, _names.mount);
+    const _disableForm = (disabled) => {
+        if (isBoolean(props.disabled)) {
+            _subjects.state.next({ disabled: props.disabled });
+            iterateFieldsByAction(_fields, (ref) => {
+                ref.disabled = disabled;
+            }, 0, false);
+        }
+    };
     const handleSubmit = (onValid, onInvalid) => async (e) => {
         if (e) {
             e.preventDefault && e.preventDefault();
@@ -2293,6 +2316,7 @@ function createFormControl(props = {}, flushRootRender) {
             _reset,
             _resetDefaultValues,
             _updateFormState,
+            _disableForm,
             _subjects,
             _proxyFormState,
             get _fields() {
@@ -2392,6 +2416,7 @@ function useForm(props = {}) {
         dirtyFields: {},
         touchedFields: {},
         errors: {},
+        disabled: false,
         defaultValues: isFunction(props.defaultValues)
             ? undefined
             : props.defaultValues,
@@ -2432,6 +2457,7 @@ function useForm(props = {}) {
         }
         control._removeUnmounted();
     });
+    React.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
     _formControl.current.formState = getProxyFormState(formState, control);
     return _formControl.current;
 }