react-hook-form 7.19.1 → 7.19.5

package/dist/index.esm.js

@@ -116,23 +116,29 @@ const tearDown = (_subscription) => {
         _subscription.current = undefined;
     }
 };
-const updateSubscriptionProps = ({ _subscription, props }) => {
-    if (props.disabled) {
+const updateSubscriptionProps = ({ _subscription, _props }) => {
+    if (_props.current.disabled) {
         tearDown(_subscription);
     }
     else if (!_subscription.current) {
-        _subscription.current = props.subject.subscribe({
-            next: props.callback,
+        _subscription.current = _props.current.subject.subscribe({
+            next: _props.current.callback,
         });
     }
 };
 function useSubscribe(props) {
     const _subscription = React.useRef();
+    const _props = React.useRef(props);
+    _props.current = props;
     updateSubscriptionProps({
         _subscription,
-        props,
+        _props,
     });
     React.useEffect(() => {
+        updateSubscriptionProps({
+            _subscription,
+            _props,
+        });
         return () => tearDown(_subscription);
     }, []);
 }
@@ -177,33 +183,6 @@ function generateWatchOutput(names, _names, formValues, isGlobal) {
     return formValues;
 }
 
-var isKey = (value) => /^\w*$/.test(value);
-
-var stringToPath = (input) => compact(input.replace(/["|']|\]/g, '').split(/\.|\[/));
-
-function set(object, path, value) {
-    let index = -1;
-    const tempPath = isKey(path) ? [path] : stringToPath(path);
-    const length = tempPath.length;
-    const lastIndex = length - 1;
-    while (++index < length) {
-        const key = tempPath[index];
-        let newValue = value;
-        if (index !== lastIndex) {
-            const objValue = object[key];
-            newValue =
-                isObject(objValue) || Array.isArray(objValue)
-                    ? objValue
-                    : !isNaN(+tempPath[index + 1])
-                        ? []
-                        : {};
-        }
-        object[key] = newValue;
-        object = object[key];
-    }
-    return object;
-}
-
 function useWatch(props) {
     const methods = useFormContext();
     const { control = methods.control, name, defaultValue, disabled, } = props || {};
@@ -214,10 +193,8 @@ function useWatch(props) {
         subject: control._subjects.watch,
         callback: (formState) => {
             if (shouldSubscribeByName(_name.current, formState.name)) {
-                const fieldValues = generateWatchOutput(_name.current, control._names, control._formValues);
-                updateValue(isObject(fieldValues) &&
-                    !(isString(_name.current) &&
-                        get(control._fields, _name.current, {})._f)
+                const fieldValues = generateWatchOutput(_name.current, control._names, formState.values || control._formValues);
+                updateValue(isUndefined(_name.current)
                     ? Object.assign({}, fieldValues) : Array.isArray(fieldValues)
                     ? [...fieldValues]
                     : fieldValues);
@@ -261,7 +238,7 @@ function useController(props) {
             if (isNameInFieldArray(control._names.array, name)
                 ? _shouldUnregisterField && !control._stateFlags.action
                 : _shouldUnregisterField) {
-                control.unregister(name);
+                control.unregister(name, { keepDefaultValue: true });
             }
             else {
                 updateMounted(name, false);
@@ -316,6 +293,33 @@ const Controller = (props) => props.render(useController(props));
 var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria
     ? Object.assign(Object.assign({}, errors[name]), { types: Object.assign(Object.assign({}, (errors[name] && errors[name].types ? errors[name].types : {})), { [type]: message || true }) }) : {};
 
+var isKey = (value) => /^\w*$/.test(value);
+
+var stringToPath = (input) => compact(input.replace(/["|']|\]/g, '').split(/\.|\[/));
+
+function set(object, path, value) {
+    let index = -1;
+    const tempPath = isKey(path) ? [path] : stringToPath(path);
+    const length = tempPath.length;
+    const lastIndex = length - 1;
+    while (++index < length) {
+        const key = tempPath[index];
+        let newValue = value;
+        if (index !== lastIndex) {
+            const objValue = object[key];
+            newValue =
+                isObject(objValue) || Array.isArray(objValue)
+                    ? objValue
+                    : !isNaN(+tempPath[index + 1])
+                        ? []
+                        : {};
+        }
+        object[key] = newValue;
+        object = object[key];
+    }
+    return object;
+}
+
 const focusFieldBy = (fields, callback, fieldsNames) => {
     for (const key of fieldsNames || Object.keys(fields)) {
         const field = get(fields, key);
@@ -433,7 +437,6 @@ const useFieldArray = (props) => {
         const updatedFieldArrayValues = omitKeys(updatedFieldArrayValuesWithKey, keyName);
         _actioned.current = true;
         set(control._formValues, name, updatedFieldArrayValues);
-        setFields(updatedFieldArrayValuesWithKey);
         return updatedFieldArrayValues;
     }, [control, name, keyName]);
     const append$1 = (value, options) => {
@@ -442,6 +445,7 @@ const useFieldArray = (props) => {
         control._updateFieldArray(name, append, {
             argA: fillEmptyArray(value),
         }, updateValues(updatedFieldArrayValuesWithKey));
+        setFields(updatedFieldArrayValuesWithKey);
         control._names.focus = getFocusFieldName(name, updatedFieldArrayValuesWithKey.length - appendValue.length, options);
     };
     const prepend$1 = (value, options) => {
@@ -449,6 +453,7 @@ const useFieldArray = (props) => {
         control._updateFieldArray(name, prepend, {
             argA: fillEmptyArray(value),
         }, updateValues(updatedFieldArrayValuesWithKey));
+        setFields(updatedFieldArrayValuesWithKey);
         control._names.focus = getFocusFieldName(name, 0, options);
     };
     const remove = (index) => {
@@ -456,6 +461,7 @@ const useFieldArray = (props) => {
         control._updateFieldArray(name, removeArrayAt, {
             argA: index,
         }, updateValues(updatedFieldArrayValuesWithKey));
+        setFields(updatedFieldArrayValuesWithKey);
     };
     const insert$1 = (index, value, options) => {
         const updatedFieldArrayValuesWithKey = insert(mapCurrentIds(control._getFieldArray(name), _fieldIds, keyName), index, mapIds(convertToArrayPayload(value), keyName));
@@ -463,6 +469,7 @@ const useFieldArray = (props) => {
             argA: index,
             argB: fillEmptyArray(value),
         }, updateValues(updatedFieldArrayValuesWithKey));
+        setFields(updatedFieldArrayValuesWithKey);
         control._names.focus = getFocusFieldName(name, index, options);
     };
     const swap = (indexA, indexB) => {
@@ -472,6 +479,7 @@ const useFieldArray = (props) => {
             argA: indexA,
             argB: indexB,
         }, updateValues(updatedFieldArrayValuesWithKey), false);
+        setFields(updatedFieldArrayValuesWithKey);
     };
     const move = (from, to) => {
         const updatedFieldArrayValuesWithKey = mapCurrentIds(control._getFieldArray(name), _fieldIds, keyName);
@@ -480,6 +488,7 @@ const useFieldArray = (props) => {
             argA: from,
             argB: to,
         }, updateValues(updatedFieldArrayValuesWithKey), false);
+        setFields(updatedFieldArrayValuesWithKey);
     };
     const update = (index, value) => {
         const updatedFieldArrayValuesWithKey = mapCurrentIds(control._getFieldArray(name), _fieldIds, keyName);
@@ -489,10 +498,12 @@ const useFieldArray = (props) => {
             argA: index,
             argB: value,
         }, updateValues(_fieldIds.current), true, false);
+        setFields(_fieldIds.current);
     };
     const replace = (value) => {
         const updatedFieldArrayValuesWithKey = mapIds(convertToArrayPayload(value), keyName);
         control._updateFieldArray(name, () => updatedFieldArrayValuesWithKey, {}, updateValues(updatedFieldArrayValuesWithKey), true, false);
+        setFields(updatedFieldArrayValuesWithKey);
     };
     React.useEffect(() => {
         control._stateFlags.action = false;
@@ -1585,7 +1596,9 @@ function createFormControl(props = {}) {
             e.persist && e.persist();
         }
         let hasNoPromiseError = true;
-        let fieldValues = Object.assign({}, _formValues);
+        let fieldValues = _options.shouldUnregister
+            ? cloneObject(_formValues)
+            : Object.assign({}, _formValues);
         _subjects.state.next({
             isSubmitting: true,
         });
@@ -1843,7 +1856,6 @@ function useForm(props = {}) {
         }
         control._removeUnmounted();
     });
-    React.useEffect(() => () => Object.values(control._subjects).forEach((subject) => subject.unsubscribe()), [control]);
     _formControl.current.formState = getProxyFormState(formState, control._proxyFormState);
     return _formControl.current;
 }