react-hook-form 7.42.0 → 7.43.0-next.0

package/dist/index.esm.mjs

@@ -148,7 +148,8 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
 
 var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
 
-var shouldRenderFormState = (formStateData, _proxyFormState, isRoot) => {
+var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
+    updateFormState(formStateData);
     const { name, ...formState } = formStateData;
     return (isEmptyObject(formState) ||
         Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
@@ -231,7 +232,7 @@ function useFormState(props) {
         disabled,
         next: (value) => _mounted.current &&
             shouldSubscribeByName(_name.current, value.name, exact) &&
-            shouldRenderFormState(value, _localProxyFormState.current) &&
+            shouldRenderFormState(value, _localProxyFormState.current, control._updateFormState) &&
             updateFormState({
                 ...control._formState,
                 ...value,
@@ -246,7 +247,7 @@ function useFormState(props) {
                 isDirty,
             });
         }
-        control._updateValid();
+        _localProxyFormState.current.isValid && control._updateValid(true);
         return () => {
             _mounted.current = false;
         };
@@ -1117,7 +1118,7 @@ function useFieldArray(props) {
         control._names.focus &&
             focusFieldBy(control._fields, (key) => !!key && key.startsWith(control._names.focus || ''));
         control._names.focus = '';
-        control._proxyFormState.isValid && control._updateValid();
+        control._updateValid();
     }, [fields, name, control]);
     React.useEffect(() => {
         !get(control._formValues, name) && control._updateFieldArray(name);
@@ -1400,8 +1401,8 @@ function createFormControl(props = {}, flushRootRender) {
         errors: {},
     };
     let _fields = {};
-    let _defaultValues = isObject(_options.defaultValues)
-        ? cloneObject(_options.defaultValues) || {}
+    let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values)
+        ? cloneObject(_options.defaultValues || _options.values) || {}
         : {};
     let _formValues = _options.shouldUnregister
         ? {}
@@ -1439,13 +1440,12 @@ function createFormControl(props = {}, flushRootRender) {
         clearTimeout(timer);
         timer = window.setTimeout(callback, wait);
     };
-    const _updateValid = async () => {
-        if (_proxyFormState.isValid) {
+    const _updateValid = async (shouldUpdateValid) => {
+        if (_proxyFormState.isValid || shouldUpdateValid) {
             const isValid = _options.resolver
                 ? isEmptyObject((await _executeSchema()).errors)
                 : await executeBuiltInValidation(_fields, true);
             if (isValid !== _formState.isValid) {
-                _formState.isValid = isValid;
                 _subjects.state.next({
                     isValid,
                 });
@@ -1717,10 +1717,9 @@ function createFormControl(props = {}, flushRootRender) {
             });
             if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) &&
                 options.shouldDirty) {
-                _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
                 _subjects.state.next({
                     name,
-                    dirtyFields: _formState.dirtyFields,
+                    dirtyFields: getDirtyFields(_defaultValues, _formValues),
                     isDirty: _getDirty(name, cloneValue),
                 });
             }
@@ -1850,11 +1849,10 @@ function createFormControl(props = {}, flushRootRender) {
         error: get((formState || _formState).errors, name),
     });
     const clearErrors = (name) => {
-        name
-            ? convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName))
-            : (_formState.errors = {});
+        name &&
+            convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
         _subjects.state.next({
-            errors: _formState.errors,
+            errors: name ? _formState.errors : {},
         });
     };
     const setError = (name, error, options) => {
@@ -1997,6 +1995,7 @@ function createFormControl(props = {}, flushRootRender) {
         else {
             await executeBuiltInValidation(_fields);
         }
+        unset(_formState.errors, 'root');
         if (isEmptyObject(_formState.errors)) {
             _subjects.state.next({
                 errors: {},
@@ -2143,6 +2142,12 @@ function createFormControl(props = {}, flushRootRender) {
             }
         }
     };
+    const _updateFormState = (updatedFormState) => {
+        _formState = {
+            ..._formState,
+            ...updatedFormState,
+        };
+    };
     if (isFunction(_options.defaultValues)) {
         _options.defaultValues().then((values) => {
             reset(values, _options.resetOptions);
@@ -2165,6 +2170,7 @@ function createFormControl(props = {}, flushRootRender) {
             _updateFieldArray,
             _getFieldArray,
             _reset,
+            _updateFormState,
             _subjects,
             _proxyFormState,
             get _fields() {
@@ -2278,18 +2284,14 @@ function useForm(props = {}) {
     useSubscribe({
         subject: control._subjects.state,
         next: (value) => {
-            if (shouldRenderFormState(value, control._proxyFormState, true)) {
-                control._formState = {
-                    ...control._formState,
-                    ...value,
-                };
+            if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {
                 updateFormState({ ...control._formState });
             }
         },
     });
     React.useEffect(() => {
         if (!control._stateFlags.mount) {
-            control._proxyFormState.isValid && control._updateValid();
+            control._updateValid();
             control._stateFlags.mount = true;
         }
         if (control._stateFlags.watch) {