react-hook-form 7.72.1 → 7.73.1

package/dist/index.esm.mjs

@@ -64,7 +64,10 @@ var get = (object, path, defaultValue) => {
     if (!path || !isObject(object)) {
         return defaultValue;
     }
-    const result = (isKey(path) ? [path] : stringToPath(path)).reduce((result, key) => isNullOrUndefined(result) ? result : result[key], object);
+    const paths = isKey(path) ? [path] : stringToPath(path);
+    const result = paths.reduce((result, key) => {
+        return isNullOrUndefined(result) ? undefined : result[key];
+    }, object);
     return isUndefined(result) || result === object
         ? isUndefined(object[path])
             ? defaultValue
@@ -239,7 +242,10 @@ var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) =>
 
 var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
 
-function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
+function deepEqual(object1, object2, visited = new WeakSet()) {
+    if (object1 === object2) {
+        return true;
+    }
     if (isPrimitive(object1) || isPrimitive(object2)) {
         return Object.is(object1, object2);
     }
@@ -251,14 +257,14 @@ function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
     if (keys1.length !== keys2.length) {
         return false;
     }
-    if (_internal_visited.has(object1) || _internal_visited.has(object2)) {
+    if (visited.has(object1) || visited.has(object2)) {
         return true;
     }
-    _internal_visited.add(object1);
-    _internal_visited.add(object2);
+    visited.add(object1);
+    visited.add(object2);
     for (const key of keys1) {
         const val1 = object1[key];
-        if (!keys2.includes(key)) {
+        if (!(key in object2)) {
             return false;
         }
         if (key !== 'ref') {
@@ -266,7 +272,7 @@ function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
             if ((isDateObject(val1) && isDateObject(val2)) ||
                 ((isObject(val1) || Array.isArray(val1)) &&
                     (isObject(val2) || Array.isArray(val2)))
-                ? !deepEqual(val1, val2, _internal_visited)
+                ? !deepEqual(val1, val2, visited)
                 : !Object.is(val1, val2)) {
                 return false;
             }
@@ -706,7 +712,7 @@ function Form(props) {
     const methods = useFormContext();
     const [mounted, setMounted] = React.useState(false);
     const { control = methods.control, onSubmit, children, action, method = POST_REQUEST, headers, encType, onError, render, onSuccess, validateStatus, ...rest } = props;
-    const submit = async (event) => {
+    const submit = React.useCallback(async (event) => {
         let hasError = false;
         let type = '';
         await control.handleSubmit(async (data) => {
@@ -716,7 +722,7 @@ function Form(props) {
                 formDataJson = JSON.stringify(data);
             }
             catch (_a) { }
-            const flattenFormValues = flatten(control._formValues);
+            const flattenFormValues = flatten(data);
             for (const key in flattenFormValues) {
                 formData.append(key, flattenFormValues[key]);
             }
@@ -763,15 +769,25 @@ function Form(props) {
                 }
             }
         })(event);
-        if (hasError && props.control) {
-            props.control._subjects.state.next({
+        if (hasError && control) {
+            control._subjects.state.next({
                 isSubmitSuccessful: false,
             });
-            props.control.setError('root.server', {
+            control.setError('root.server', {
                 type,
             });
         }
-    };
+    }, [
+        control,
+        onSubmit,
+        method,
+        action,
+        headers,
+        encType,
+        validateStatus,
+        onError,
+        onSuccess,
+    ]);
     React.useEffect(() => {
         setMounted(true);
     }, []);
@@ -880,6 +896,10 @@ function isEmptyArray(obj) {
     return true;
 }
 function unset(object, path) {
+    if (isString(path) && Object.prototype.hasOwnProperty.call(object, path)) {
+        delete object[path];
+        return object;
+    }
     const paths = Array.isArray(path)
         ? path
         : isKey(path)
@@ -1841,17 +1861,15 @@ function createFormControl(props = {}) {
         const field = get(_fields, name);
         const isFieldArray = _names.array.has(name);
         const cloneValue = cloneObject(value);
+        const previousValue = get(_formValues, name);
+        const isValueUnchanged = deepEqual(previousValue, cloneValue);
         set(_formValues, name, cloneValue);
         if (isFieldArray) {
             _subjects.array.next({
                 name,
                 values: cloneObject(_formValues),
             });
-            if ((_proxyFormState.isDirty ||
-                _proxyFormState.dirtyFields ||
-                _proxySubscribeFormState.isDirty ||
-                _proxySubscribeFormState.dirtyFields) &&
-                options.shouldDirty) {
+            if (options.shouldDirty) {
                 _updateDirtyFields(name);
                 _subjects.state.next({
                     name,
@@ -1861,22 +1879,29 @@ function createFormControl(props = {}) {
             }
         }
         else {
-            field && !field._f && !isNullOrUndefined(cloneValue)
-                ? setValues(name, cloneValue, options)
-                : setFieldValue(name, cloneValue, options);
-        }
-        if (isWatched(name, _names)) {
-            _subjects.state.next({
-                ..._formState,
-                name,
-                values: cloneObject(_formValues),
-            });
+            const isEmpty = (Array.isArray(cloneValue) && !cloneValue.length) ||
+                isEmptyObject(cloneValue);
+            if (!field || field._f || isNullOrUndefined(cloneValue) || isEmpty) {
+                setFieldValue(name, cloneValue, options);
+            }
+            else {
+                setValues(name, cloneValue, options);
+            }
         }
-        else {
-            _subjects.state.next({
-                name: _state.mount ? name : undefined,
-                values: cloneObject(_formValues),
-            });
+        if (!isValueUnchanged) {
+            if (isWatched(name, _names)) {
+                _subjects.state.next({
+                    ..._formState,
+                    name,
+                    values: cloneObject(_formValues),
+                });
+            }
+            else {
+                _subjects.state.next({
+                    name: _state.mount ? name : undefined,
+                    values: cloneObject(_formValues),
+                });
+            }
         }
     };
     const onChange = async (event) => {
@@ -2095,15 +2120,16 @@ function createFormControl(props = {}) {
     const watch = (name, defaultValue) => isFunction(name)
         ? _subjects.state.subscribe({
             next: (payload) => 'values' in payload &&
-                name(_getWatch(undefined, defaultValue), payload),
+                name(payload.values || _getWatch(undefined, defaultValue), payload),
         })
         : _getWatch(name, defaultValue, true);
     const _subscribe = (props) => _subjects.state.subscribe({
         next: (formState) => {
             if (shouldSubscribeByName(props.name, formState.name, props.exact) &&
                 shouldRenderFormState(formState, props.formState || _proxyFormState, _setFormState, props.reRenderRoot)) {
+                const snapshot = { ..._formValues };
                 props.callback({
-                    values: { ..._formValues },
+                    values: snapshot,
                     ..._formState,
                     ...formState,
                     defaultValues: _defaultValues,
@@ -2165,7 +2191,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;
+        const shouldRevalidateRemount = !_names.registerName.has(name) && field && field._f && !field._f.mount;
         set(_fields, name, {
             ...(field || {}),
             _f: {
@@ -2812,10 +2838,11 @@ function useFieldArray(props) {
             control._subjects.state.next({
                 ...control._formState,
             });
+        const validationModes = getValidationModes(control._options.mode);
         if (_actioned.current &&
-            (!getValidationModes(control._options.mode).isOnSubmit ||
-                control._formState.isSubmitted) &&
-            !getValidationModes(control._options.reValidateMode).isOnSubmit) {
+            (!validationModes.isOnSubmit || control._formState.isSubmitted) &&
+            !getValidationModes(control._options.reValidateMode).isOnSubmit &&
+            !validationModes.isOnBlur) {
             if (control._options.resolver) {
                 control._runSchema([name]).then((result) => {
                     control._updateIsValidating([name]);