@bombillazo/rhf-plus 7.64.0-plus.0 → 7.64.0-plus.1

package/dist/index.esm.mjs

@@ -453,6 +453,8 @@ function useController(props) {
         ...props.rules,
         value,
         ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
+        ...(props.mode ? { mode: props.mode } : {}),
+        ...(props.reValidateMode ? { reValidateMode: props.reValidateMode } : {}),
     }));
     const mergedRules = React.useMemo(() => mergeMissingKeysAsUndefined(_previousRules.current, props.rules), [props.rules]);
     // Update register props when rules change
@@ -461,9 +463,20 @@ function useController(props) {
             ...mergedRules,
             value,
             ...(isBoolean(props.disabled) ? { disabled: props.disabled } : {}),
+            ...(props.mode ? { mode: props.mode } : {}),
+            ...(props.reValidateMode ? { reValidateMode: props.reValidateMode } : {}),
         });
         _previousRules.current = props.rules;
-    }, [mergedRules, props.rules, value, props.disabled, control, name]);
+    }, [
+        mergedRules,
+        props.rules,
+        value,
+        props.disabled,
+        props.mode,
+        props.reValidateMode,
+        control,
+        name,
+    ]);
     _props.current = props;
     const fieldState = React.useMemo(() => Object.defineProperties({}, {
         invalid: {
@@ -577,6 +590,10 @@ function useController(props) {
             ...(isBoolean(_props.current.disabled)
                 ? { disabled: _props.current.disabled }
                 : {}),
+            ...(_props.current.mode ? { mode: _props.current.mode } : {}),
+            ...(_props.current.reValidateMode
+                ? { reValidateMode: _props.current.reValidateMode }
+                : {}),
         });
         const updateMounted = (name, value) => {
             const field = get(control._fields, name);
@@ -1196,21 +1213,37 @@ var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode,
 /**
  * Need to keep this order of parameters for backward compatibility
  */
-isFocusEvent) => {
+isFocusEvent, 
+/**
+ * Optional field-level validation mode that overrides form-level mode.
+ * When provided, this field's mode takes precedence over the form's mode.
+ * Partial because only the relevant flags (e.g., isOnChange, isOnBlur) need to be checked.
+ */
+fieldMode, 
+/**
+ * Optional field-level revalidation mode that overrides form-level reValidateMode.
+ * When provided, this field's reValidateMode takes precedence after form submission.
+ * Only includes isOnBlur and isOnChange as these are the only valid revalidation modes.
+ */
+fieldReValidateMode) => {
+    // Use field-level modes if provided, otherwise fallback to form-level modes
+    // This allows individual fields to have different validation timing than the form
+    const effectiveMode = fieldMode || mode;
+    const effectiveReValidateMode = fieldReValidateMode || reValidateMode;
     // Focus events should always skip validation
     if (isFocusEvent) {
         return true;
     }
-    if (mode.isOnAll) {
+    if (effectiveMode.isOnAll) {
         return false;
     }
-    else if (!isSubmitted && mode.isOnTouch) {
+    else if (!isSubmitted && effectiveMode.isOnTouch) {
         return !(isTouched || isBlurEvent);
     }
-    else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
+    else if (isSubmitted ? effectiveReValidateMode.isOnBlur : effectiveMode.isOnBlur) {
         return !isBlurEvent;
     }
-    else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
+    else if (isSubmitted ? effectiveReValidateMode.isOnChange : effectiveMode.isOnChange) {
         return isBlurEvent;
     }
     return true;
@@ -1955,6 +1988,16 @@ function createFormControl(props = {}) {
         };
         const validationModeBeforeSubmit = getValidationModes(_options.mode);
         const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
+        // Extract field-level validation modes if they exist
+        // Field-level modes take precedence over form-level modes, allowing
+        // individual fields to override when they validate (mode) and when they
+        // revalidate after form submission (reValidateMode)
+        const fieldMode = (field === null || field === void 0 ? void 0 : field._f.mode)
+            ? getValidationModes(field._f.mode)
+            : undefined;
+        const fieldReValidateMode = (field === null || field === void 0 ? void 0 : field._f.reValidateMode)
+            ? getValidationModes(field._f.reValidateMode)
+            : undefined;
         if (field) {
             // Check if field is disabled and should not process events
             const isFieldDisabled = isBoolean(field._f.disabled)
@@ -2013,7 +2056,7 @@ function createFormControl(props = {}) {
                 !_options.resolver &&
                 !get(_formState.errors, name) &&
                 !field._f.deps) ||
-                skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit, isFocusEvent);
+                skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit, isFocusEvent, fieldMode, fieldReValidateMode);
             const watched = isWatched(name, _names, isBlurEvent || isFocusEvent);
             set(_formValues, name, fieldValue);
             if (isBlurEvent) {