@bombillazo/rhf-plus 7.65.0-plus.0 → 7.68.0-plus.0

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export * from './controller';
 export * from './form';
+export * from './formStateSubscribe';
 export * from './logic';
 export * from './types';
 export * from './useController';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,sBAAsB,CAAC;AACrC,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,WAAW,CAAC;AAC1B,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC"}

package/dist/index.esm.mjs

@@ -179,7 +179,7 @@ HookFormContext.displayName = 'HookFormContext';
  */
 const useFormContext = () => React.useContext(HookFormContext);
 /**
- * A provider component that propagates the `useForm` methods to all children components via [React Context](https://reactjs.org/docs/context.html) API. To be used with {@link useFormContext}.
+ * A provider component that propagates the `useForm` methods to all children components via [React Context](https://react.dev/reference/react/useContext) API. To be used with {@link useFormContext}.
  *
  * @remarks
  * [API](https://react-hook-form.com/docs/useformcontext) • [Demo](https://codesandbox.io/s/react-hook-form-v7-form-context-ytudi)
@@ -318,7 +318,7 @@ var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
 
 function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
     if (isPrimitive(object1) || isPrimitive(object2)) {
-        return object1 === object2;
+        return Object.is(object1, object2);
     }
     if (isDateObject(object1) && isDateObject(object2)) {
         return object1.getTime() === object2.getTime();
@@ -344,7 +344,7 @@ function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
                 (isObject(val1) && isObject(val2)) ||
                 (Array.isArray(val1) && Array.isArray(val2))
                 ? !deepEqual(val1, val2, _internal_visited)
-                : val1 !== val2) {
+                : !Object.is(val1, val2)) {
                 return false;
             }
         }
@@ -374,33 +374,68 @@ function useWatch(props) {
     const _defaultValue = React.useRef(defaultValue);
     const _compute = React.useRef(compute);
     const _computeFormValues = React.useRef(undefined);
+    const _prevControl = React.useRef(control);
+    const _prevName = React.useRef(name);
     _compute.current = compute;
-    const defaultValueMemo = React.useMemo(() => control._getWatch(name, _defaultValue.current), [control, name]);
-    const [value, updateValue] = React.useState(_compute.current ? _compute.current(defaultValueMemo) : defaultValueMemo);
-    useIsomorphicLayoutEffect(() => control._subscribe({
-        name,
-        formState: {
-            values: true,
-        },
-        exact,
-        callback: (formState) => {
-            if (!disabled) {
-                const formValues = generateWatchOutput(name, control._names, formState.values || control._formValues, false, _defaultValue.current);
-                if (_compute.current) {
-                    const computedFormValues = _compute.current(formValues);
-                    if (!deepEqual(computedFormValues, _computeFormValues.current)) {
-                        updateValue(computedFormValues);
-                        _computeFormValues.current = computedFormValues;
-                    }
-                }
-                else {
-                    updateValue(formValues);
+    const [value, updateValue] = React.useState(() => {
+        const defaultValue = control._getWatch(name, _defaultValue.current);
+        return _compute.current ? _compute.current(defaultValue) : defaultValue;
+    });
+    const getCurrentOutput = React.useCallback((values) => {
+        const formValues = generateWatchOutput(name, control._names, values || control._formValues, false, _defaultValue.current);
+        return _compute.current ? _compute.current(formValues) : formValues;
+    }, [control._formValues, control._names, name]);
+    const refreshValue = React.useCallback((values) => {
+        if (!disabled) {
+            const formValues = generateWatchOutput(name, control._names, values || control._formValues, false, _defaultValue.current);
+            if (_compute.current) {
+                const computedFormValues = _compute.current(formValues);
+                if (!deepEqual(computedFormValues, _computeFormValues.current)) {
+                    updateValue(computedFormValues);
+                    _computeFormValues.current = computedFormValues;
                 }
             }
-        },
-    }), [control, disabled, name, exact]);
+            else {
+                updateValue(formValues);
+            }
+        }
+    }, [control._formValues, control._names, disabled, name]);
+    useIsomorphicLayoutEffect(() => {
+        if (_prevControl.current !== control ||
+            !deepEqual(_prevName.current, name)) {
+            _prevControl.current = control;
+            _prevName.current = name;
+            refreshValue();
+        }
+        return control._subscribe({
+            name,
+            formState: {
+                values: true,
+            },
+            exact,
+            callback: (formState) => {
+                refreshValue(formState.values);
+            },
+        });
+    }, [control, exact, name, refreshValue]);
     React.useEffect(() => control._removeUnmounted());
-    return value;
+    // If name or control changed for this render, synchronously reflect the
+    // latest value so callers (like useController) see the correct value
+    // immediately on the same render.
+    // Optimize: Check control reference first before expensive deepEqual
+    const controlChanged = _prevControl.current !== control;
+    const prevName = _prevName.current;
+    // Cache the computed output to avoid duplicate calls within the same render
+    // We include shouldReturnImmediate in deps to ensure proper recomputation
+    const computedOutput = React.useMemo(() => {
+        if (disabled) {
+            return null;
+        }
+        const nameChanged = !controlChanged && !deepEqual(prevName, name);
+        const shouldReturnImmediate = controlChanged || nameChanged;
+        return shouldReturnImmediate ? getCurrentOutput() : null;
+    }, [disabled, controlChanged, name, prevName, getCurrentOutput]);
+    return computedOutput !== null ? computedOutput : value;
 }
 
 /**
@@ -429,7 +464,7 @@ function useWatch(props) {
  */
 function useController(props) {
     const methods = useFormContext();
-    const { name, disabled, control = methods === null || methods === void 0 ? void 0 : methods.control, shouldUnregister, defaultValue, } = props;
+    const { name, disabled, control = methods === null || methods === void 0 ? void 0 : methods.control, shouldUnregister, defaultValue, exact = true, } = props;
     if (!control) {
         throw new Error('useController: missing `control`. Pass `control` as a prop or provide it via FormProvider.');
     }
@@ -439,12 +474,12 @@ function useController(props) {
         control,
         name,
         defaultValue: defaultValueMemo,
-        exact: true,
+        exact,
     });
     const formState = useFormState({
         control,
         name,
-        exact: true,
+        exact,
     });
     const _props = React.useRef(props);
     const _previousRules = React.useRef(props.rules);
@@ -797,6 +832,8 @@ function Form(props) {
     }))) : (React.createElement("form", { noValidate: mounted, action: action, method: method, encType: encType, onSubmit: submit, ...rest }, children));
 }
 
+const FormStateSubscribe = ({ control, disabled, exact, name, render, }) => render(useFormState({ control, name, disabled, exact }));
+
 var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => validateAllFieldCriteria
     ? {
         ...errors[name],
@@ -972,11 +1009,12 @@ function isTraversable(value) {
 }
 function markFieldsDirty(data, fields = {}) {
     for (const key in data) {
-        if (isTraversable(data[key])) {
-            fields[key] = Array.isArray(data[key]) ? [] : {};
-            markFieldsDirty(data[key], fields[key]);
+        const value = data[key];
+        if (isTraversable(value)) {
+            fields[key] = Array.isArray(value) ? [] : {};
+            markFieldsDirty(value, fields[key]);
         }
-        else if (!isUndefined(data[key])) {
+        else if (!isUndefined(value)) {
             fields[key] = true;
         }
     }
@@ -987,16 +1025,18 @@ function getDirtyFields(data, formValues, dirtyFieldsFromValues) {
         dirtyFieldsFromValues = markFieldsDirty(formValues);
     }
     for (const key in data) {
-        if (isTraversable(data[key])) {
+        const value = data[key];
+        if (isTraversable(value)) {
             if (isUndefined(formValues) || isPrimitive(dirtyFieldsFromValues[key])) {
-                dirtyFieldsFromValues[key] = markFieldsDirty(data[key], Array.isArray(data[key]) ? [] : {});
+                dirtyFieldsFromValues[key] = markFieldsDirty(value, Array.isArray(value) ? [] : {});
             }
             else {
-                getDirtyFields(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
+                getDirtyFields(value, isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
             }
         }
         else {
-            dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
+            const formValue = formValues[key];
+            dirtyFieldsFromValues[key] = !deepEqual(value, formValue);
         }
     }
     return dirtyFieldsFromValues;
@@ -1630,7 +1670,7 @@ function createFormControl(props = {}) {
                 shouldSkipSetValueAs
                 ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f))
                 : setFieldValue(name, defaultValue);
-            _state.mount && _setValid();
+            _state.mount && !_state.action && _setValid();
         }
     };
     const updateTouchAndDirty = (name, fieldValue, isBlurEvent, isFocusEvent, shouldDirty, shouldRender) => {
@@ -2558,8 +2598,16 @@ function createFormControl(props = {}) {
         _state.mount =
             !_proxyFormState.isValid ||
                 !!keepStateOptions.keepIsValid ||
-                !!keepStateOptions.keepDirtyValues;
+                !!keepStateOptions.keepDirtyValues ||
+                (!_options.shouldUnregister && !isEmptyObject(values));
         _state.watch = !!_options.shouldUnregister;
+        _state.action = false;
+        // Clear errors synchronously to prevent validation errors on subsequent submissions
+        // This fixes the issue where form.reset() causes validation errors on subsequent
+        // submissions in Next.js 16 with Server Actions
+        if (!keepStateOptions.keepErrors) {
+            _formState.errors = {};
+        }
         _subjects.state.next({
             submitCount: keepStateOptions.keepSubmitCount
                 ? _formState.submitCount
@@ -3217,11 +3265,15 @@ function useForm(props = {}) {
         }
     }, [control, formState.isDirty]);
     React.useEffect(() => {
+        var _a;
         if (props.values && !deepEqual(props.values, _values.current)) {
             control._reset(props.values, {
                 keepFieldsRef: true,
                 ...control._options.resetOptions,
             });
+            if (!((_a = control._options.resetOptions) === null || _a === void 0 ? void 0 : _a.keepIsValid)) {
+                control._setValid();
+            }
             _values.current = props.values;
             updateFormState((state) => ({ ...state }));
         }
@@ -3280,5 +3332,5 @@ function useForm(props = {}) {
  */
 const Watch = ({ control, names, render, }) => render(useWatch({ control, name: names }));
 
-export { Controller, Form, FormProvider, Watch, appendErrors, createFormControl, get, set, submitForm as submit, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
+export { Controller, Form, FormProvider, FormStateSubscribe, Watch, appendErrors, createFormControl, get, set, submitForm as submit, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
 //# sourceMappingURL=index.esm.mjs.map