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

package/dist/index.esm.mjs

@@ -33,29 +33,23 @@ var isWeb = typeof window !== 'undefined' &&
     typeof document !== 'undefined';
 
 function cloneObject(data) {
-    let copy;
-    const isArray = Array.isArray(data);
-    const isFileListInstance = typeof FileList !== 'undefined' ? data instanceof FileList : false;
     if (data instanceof Date) {
-        copy = new Date(data);
+        return new Date(data);
     }
-    else if (!(isWeb && (data instanceof Blob || isFileListInstance)) &&
-        (isArray || isObject(data))) {
-        copy = isArray ? [] : Object.create(Object.getPrototypeOf(data));
-        if (!isArray && !isPlainObject(data)) {
-            copy = data;
-        }
-        else {
-            for (const key in data) {
-                if (data.hasOwnProperty(key)) {
-                    copy[key] = cloneObject(data[key]);
-                }
-            }
-        }
+    const isFileListInstance = typeof FileList !== 'undefined' && data instanceof FileList;
+    if (isWeb && (data instanceof Blob || isFileListInstance)) {
+        return data;
     }
-    else {
+    const isArray = Array.isArray(data);
+    if (!isArray && !(isObject(data) && isPlainObject(data))) {
         return data;
     }
+    const copy = isArray ? [] : Object.create(Object.getPrototypeOf(data));
+    for (const key in data) {
+        if (Object.prototype.hasOwnProperty.call(data, key)) {
+            copy[key] = cloneObject(data[key]);
+        }
+    }
     return copy;
 }
 
@@ -81,6 +75,8 @@ var get = (object, path, defaultValue) => {
 
 var isBoolean = (value) => typeof value === 'boolean';
 
+var isFunction = (value) => typeof value === 'function';
+
 function mergeMissingKeysAsUndefined(oldObject, newObject) {
     if (!newObject) {
         return newObject;
@@ -321,7 +317,7 @@ function deepEqual(object1, object2, _internal_visited = new WeakSet()) {
         return Object.is(object1, object2);
     }
     if (isDateObject(object1) && isDateObject(object2)) {
-        return object1.getTime() === object2.getTime();
+        return Object.is(object1.getTime(), object2.getTime());
     }
     const keys1 = Object.keys(object1);
     const keys2 = Object.keys(object2);
@@ -564,12 +560,12 @@ function useController(props) {
     const ref = React.useCallback((elm) => {
         elementRef.current = elm;
         const field = get(control._fields, name);
-        if (field && elm) {
+        if (field && field._f && elm) {
             field._f.ref = {
-                focus: () => { var _a; return (_a = elm.focus) === null || _a === void 0 ? void 0 : _a.call(elm); },
-                select: () => { var _a; return (_a = elm.select) === null || _a === void 0 ? void 0 : _a.call(elm); },
-                setCustomValidity: (message) => elm.setCustomValidity(message),
-                reportValidity: () => elm.reportValidity(),
+                focus: () => isFunction(elm.focus) && elm.focus(),
+                select: () => isFunction(elm.select) && elm.select(),
+                setCustomValidity: (message) => isFunction(elm.setCustomValidity) && elm.setCustomValidity(message),
+                reportValidity: () => isFunction(elm.reportValidity) && elm.reportValidity(),
             };
         }
     }, [control._fields, name]);
@@ -927,8 +923,6 @@ var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
 
 var isFileInput = (element) => element.type === 'file';
 
-var isFunction = (value) => typeof value === 'function';
-
 var isHTMLElement = (value) => {
     if (!isWeb) {
         return false;
@@ -1541,6 +1535,7 @@ function createFormControl(props = {}) {
         action: false,
         mount: false,
         watch: false,
+        keepIsValid: false,
     };
     let _names = {
         mount: new Set(),
@@ -1552,7 +1547,7 @@ function createFormControl(props = {}) {
     };
     let delayErrorCallback;
     let timer = 0;
-    const _proxyFormState = {
+    const defaultProxyFormState = {
         isDirty: false,
         isDirtySinceSubmit: false,
         hasBeenSubmitted: false,
@@ -1564,6 +1559,9 @@ function createFormControl(props = {}) {
         isValid: false,
         errors: false,
     };
+    const _proxyFormState = {
+        ...defaultProxyFormState,
+    };
     let _proxySubscribeFormState = {
         ..._proxyFormState,
     };
@@ -1580,13 +1578,21 @@ function createFormControl(props = {}) {
         timer = setTimeout(callback, wait);
     };
     const _setValid = async (shouldUpdateValid) => {
+        if (_state.keepIsValid) {
+            return;
+        }
         if ((Array.isArray(_options.disabled) || !_options.disabled) &&
             (_proxyFormState.isValid ||
                 _proxySubscribeFormState.isValid ||
                 shouldUpdateValid)) {
-            const isValid = _options.resolver
-                ? isEmptyObject((await _runSchema()).errors)
-                : await executeBuiltInValidation(_fields, true);
+            let isValid;
+            if (_options.resolver) {
+                isValid = isEmptyObject((await _runSchema()).errors);
+                _updateIsValidating();
+            }
+            else {
+                isValid = await executeBuiltInValidation(_fields, true);
+            }
             if (isValid !== _formState.isValid) {
                 _subjects.state.next({
                     isValid,
@@ -1782,11 +1788,11 @@ function createFormControl(props = {}) {
     const _runSchema = async (name) => {
         _updateIsValidating(name, true);
         const result = await _options.resolver(_formValues, _options.context, getResolverOptions(name || _names.mount, _fields, _options.criteriaMode, _options.shouldUseNativeValidation));
-        _updateIsValidating(name);
         return result;
     };
     const executeSchemaAndUpdateState = async (names) => {
         const { errors } = await _runSchema(names);
+        _updateIsValidating(names);
         if (names) {
             for (const name of names) {
                 const error = get(errors, name);
@@ -1824,7 +1830,7 @@ function createFormControl(props = {}) {
                     }
                     if (fieldError[_f.name]) {
                         context.valid = false;
-                        if (shouldOnlyCheckValid) {
+                        if (shouldOnlyCheckValid || props.shouldUseNativeValidation) {
                             break;
                         }
                     }
@@ -1979,11 +1985,19 @@ function createFormControl(props = {}) {
                 ? setValues(name, cloneValue, options)
                 : setFieldValue(name, cloneValue, options);
         }
-        isWatched(name, _names) && _subjects.state.next({ ..._formState, name });
-        _subjects.state.next({
-            name: _state.mount ? name : undefined,
-            values: cloneObject(_formValues),
-        });
+        if (isWatched(name, _names)) {
+            _subjects.state.next({
+                ..._formState,
+                name,
+                values: cloneObject(_formValues),
+            });
+        }
+        else {
+            _subjects.state.next({
+                name: _state.mount ? name : undefined,
+                values: cloneObject(_formValues),
+            });
+        }
         // Trigger validation when shouldValidate is true
         // This ensures validation happens for all cases including:
         // - Field arrays
@@ -2112,6 +2126,7 @@ function createFormControl(props = {}) {
             !isBlurEvent && watched && _subjects.state.next({ ..._formState });
             if (_options.resolver) {
                 const { errors } = await _runSchema([name]);
+                _updateIsValidating([name]);
                 _updateIsFieldValueUpdated(fieldValue);
                 if (isFieldValueUpdated) {
                     const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
@@ -2263,7 +2278,10 @@ function createFormControl(props = {}) {
         };
         return _subscribe({
             ...props,
-            formState: _proxySubscribeFormState,
+            formState: {
+                ...defaultProxyFormState,
+                ...props.formState,
+            },
         });
     };
     const unregister = (name, options = {}) => {
@@ -2457,6 +2475,7 @@ function createFormControl(props = {}) {
         });
         if (_options.resolver) {
             const { errors, values } = await _runSchema();
+            _updateIsValidating();
             _formState.errors = errors;
             fieldValues = cloneObject(values);
         }
@@ -2541,9 +2560,15 @@ function createFormControl(props = {}) {
                     ...Object.keys(getDirtyFields(_defaultValues, _formValues)),
                 ]);
                 for (const fieldName of Array.from(fieldsToCheck)) {
-                    get(_formState.dirtyFields, fieldName)
-                        ? set(values, fieldName, get(_formValues, fieldName))
-                        : setValue(fieldName, get(values, fieldName));
+                    const isDirty = get(_formState.dirtyFields, fieldName);
+                    const existingValue = get(_formValues, fieldName);
+                    const newValue = get(values, fieldName);
+                    if (isDirty && !isUndefined(existingValue)) {
+                        set(values, fieldName, existingValue);
+                    }
+                    else if (!isDirty && !isUndefined(newValue)) {
+                        setValue(fieldName, newValue);
+                    }
                 }
             }
             else {
@@ -2601,6 +2626,7 @@ function createFormControl(props = {}) {
                 !!keepStateOptions.keepDirtyValues ||
                 (!_options.shouldUnregister && !isEmptyObject(values));
         _state.watch = !!_options.shouldUnregister;
+        _state.keepIsValid = !!keepStateOptions.keepIsValid;
         _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
@@ -2648,7 +2674,7 @@ function createFormControl(props = {}) {
     };
     const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
         ? formValues(_formValues)
-        : formValues, keepStateOptions);
+        : formValues, { ..._options.resetOptions, ...keepStateOptions });
     const setFocus = (name, options = {}) => {
         const field = get(_fields, name);
         const fieldReference = field && field._f;
@@ -2657,10 +2683,14 @@ function createFormControl(props = {}) {
                 ? fieldReference.refs[0]
                 : fieldReference.ref;
             if (fieldRef.focus) {
-                fieldRef.focus();
-                options.shouldSelect &&
-                    isFunction(fieldRef.select) &&
-                    fieldRef.select();
+                // Use setTimeout to ensure focus happens after any pending state updates
+                // This fixes the issue where setFocus doesn't work immediately after setError
+                setTimeout(() => {
+                    fieldRef.focus();
+                    options.shouldSelect &&
+                        isFunction(fieldRef.select) &&
+                        fieldRef.select();
+                });
             }
         }
     };
@@ -2751,6 +2781,7 @@ function createFormControl(props = {}) {
             setError,
             _subscribe,
             _runSchema,
+            _updateIsValidating,
             _focusError,
             _getWatch,
             _getDirty,
@@ -2832,7 +2863,7 @@ var generateId = () => {
     }
     const d = typeof performance === 'undefined' ? Date.now() : performance.now() * 1000;
     return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, (c) => {
-        const r = (Math.random() * 16 + d) % 16 | 0;
+        const r = ((Math.random() * 16 + d) % 16) | 0;
         return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16);
     });
 };
@@ -3054,6 +3085,7 @@ function useFieldArray(props) {
             !getValidationModes(control._options.reValidateMode).isOnSubmit) {
             if (control._options.resolver) {
                 control._runSchema([name]).then((result) => {
+                    control._updateIsValidating([name]);
                     const error = get(result.errors, name);
                     const existingError = get(control._formState.errors, name);
                     if (existingError
@@ -3312,7 +3344,11 @@ function useForm(props = {}) {
  * Watch component that subscribes to form field changes and re-renders when watched fields update.
  *
  * @param control - The form control object from useForm
- * @param names - Array of field names to watch for changes
+ * @param name - Can be field name, array of field names, or undefined to watch the entire form
+ * @param disabled - Disable subscription
+ * @param exact - Whether to watch exact field names or not
+ * @param defaultValue - The default value to use if the field is not yet set
+ * @param compute - Function to compute derived values from watched fields
  * @param render - The function that receives watched values and returns ReactNode
  * @returns The result of calling render function with watched values
  *
@@ -3330,7 +3366,7 @@ function useForm(props = {}) {
  * />
  * ```
  */
-const Watch = ({ control, names, render, }) => render(useWatch({ control, name: names }));
+const Watch = (props) => props.render(useWatch({ name: props.names, ...props }));
 
 export { Controller, Form, FormProvider, FormStateSubscribe, Watch, appendErrors, createFormControl, get, set, submitForm as submit, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
 //# sourceMappingURL=index.esm.mjs.map