pixel-react 1.13.89 → 1.13.90

package/lib/node_modules/react-hook-form/dist/index.esm.js

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import React__default from 'react';
 
 var isCheckBoxInput = (element) => element.type === 'checkbox';
@@ -107,6 +106,7 @@ var set = (object, path, value) => {
         object[key] = newValue;
         object = object[key];
     }
+    return object;
 };
 
 const EVENTS = {
@@ -217,7 +217,42 @@ var getProxyFormState = (formState, control, localProxyFormState, isRoot = true)
     return result;
 };
 
-const useIsomorphicLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
+var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
+
+var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
+    updateFormState(formStateData);
+    const { name, ...formState } = formStateData;
+    return (isEmptyObject(formState) ||
+        Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
+        Object.keys(formState).find((key) => _proxyFormState[key] ===
+            (!isRoot || VALIDATION_MODE.all)));
+};
+
+var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
+
+var shouldSubscribeByName = (name, signalName, exact) => !name ||
+    !signalName ||
+    name === signalName ||
+    convertToArrayPayload(name).some((currentName) => currentName &&
+        (exact
+            ? currentName === signalName
+            : currentName.startsWith(signalName) ||
+                signalName.startsWith(currentName)));
+
+function useSubscribe(props) {
+    const _props = React__default.useRef(props);
+    _props.current = props;
+    React__default.useEffect(() => {
+        const subscription = !props.disabled &&
+            _props.current.subject &&
+            _props.current.subject.subscribe({
+                next: _props.current.next,
+            });
+        return () => {
+            subscription && subscription.unsubscribe();
+        };
+    }, [props.disabled]);
+}
 
 /**
  * This custom hook allows you to subscribe to each form state, and isolate the re-render at the custom hook level. It has its scope in terms of form state subscription, so it would not affect other useFormState and useForm. Using this hook can reduce the re-render impact on large and complex form application.
@@ -253,6 +288,7 @@ function useFormState(props) {
     const methods = useFormContext();
     const { control = methods.control, disabled, name, exact } = props || {};
     const [formState, updateFormState] = React__default.useState(control._formState);
+    const _mounted = React__default.useRef(true);
     const _localProxyFormState = React__default.useRef({
         isDirty: false,
         isLoading: false,
@@ -263,20 +299,25 @@ function useFormState(props) {
         isValid: false,
         errors: false,
     });
-    useIsomorphicLayoutEffect(() => control._subscribe({
-        name: name,
-        formState: _localProxyFormState.current,
-        exact,
-        callback: (formState) => {
-            !disabled &&
-                updateFormState({
-                    ...control._formState,
-                    ...formState,
-                });
-        },
-    }), [name, disabled, exact]);
+    const _name = React__default.useRef(name);
+    _name.current = name;
+    useSubscribe({
+        disabled,
+        next: (value) => _mounted.current &&
+            shouldSubscribeByName(_name.current, value.name, exact) &&
+            shouldRenderFormState(value, _localProxyFormState.current, control._updateFormState) &&
+            updateFormState({
+                ...control._formState,
+                ...value,
+            }),
+        subject: control._subjects.state,
+    });
     React__default.useEffect(() => {
-        _localProxyFormState.current.isValid && control._setValid(true);
+        _mounted.current = true;
+        _localProxyFormState.current.isValid && control._updateValid(true);
+        return () => {
+            _mounted.current = false;
+        };
     }, [control]);
     return React__default.useMemo(() => getProxyFormState(formState, control, _localProxyFormState.current, false), [formState, control]);
 }
@@ -314,17 +355,18 @@ var generateWatchOutput = (names, _names, formValues, isGlobal, defaultValue) =>
 function useWatch(props) {
     const methods = useFormContext();
     const { control = methods.control, name, defaultValue, disabled, exact, } = props || {};
-    const _defaultValue = React__default.useRef(defaultValue);
-    const [value, updateValue] = React__default.useState(control._getWatch(name, _defaultValue.current));
-    useIsomorphicLayoutEffect(() => control._subscribe({
-        name: name,
-        formState: {
-            values: true,
+    const _name = React__default.useRef(name);
+    _name.current = name;
+    useSubscribe({
+        disabled,
+        subject: control._subjects.values,
+        next: (formState) => {
+            if (shouldSubscribeByName(_name.current, formState.name, exact)) {
+                updateValue(cloneObject(generateWatchOutput(_name.current, control._names, formState.values || control._formValues, false, defaultValue)));
+            }
         },
-        exact,
-        callback: (formState) => !disabled &&
-            updateValue(generateWatchOutput(name, control._names, formState.values || control._formValues, false, _defaultValue.current)),
-    }), [name, control, disabled, exact]);
+    });
+    const [value, updateValue] = React__default.useState(control._getWatch(name, defaultValue));
     React__default.useEffect(() => control._removeUnmounted());
     return value;
 }
@@ -368,7 +410,6 @@ function useController(props) {
         name,
         exact: true,
     });
-    const _props = React__default.useRef(props);
     const _registerProps = React__default.useRef(control.register(name, {
         ...props.rules,
         value,
@@ -396,49 +437,47 @@ function useController(props) {
             get: () => get(formState.errors, name),
         },
     }), [formState, name]);
-    const onChange = React__default.useCallback((event) => _registerProps.current.onChange({
-        target: {
-            value: getEventValue(event),
-            name: name,
-        },
-        type: EVENTS.CHANGE,
-    }), [name]);
-    const onBlur = React__default.useCallback(() => _registerProps.current.onBlur({
-        target: {
-            value: get(control._formValues, name),
-            name: name,
-        },
-        type: EVENTS.BLUR,
-    }), [name, control._formValues]);
-    const ref = React__default.useCallback((elm) => {
-        const field = get(control._fields, name);
-        if (field && elm) {
-            field._f.ref = {
-                focus: () => elm.focus(),
-                select: () => elm.select(),
-                setCustomValidity: (message) => elm.setCustomValidity(message),
-                reportValidity: () => elm.reportValidity(),
-            };
-        }
-    }, [control._fields, name]);
     const field = React__default.useMemo(() => ({
         name,
         value,
         ...(isBoolean(disabled) || formState.disabled
             ? { disabled: formState.disabled || disabled }
             : {}),
-        onChange,
-        onBlur,
-        ref,
-    }), [name, disabled, formState.disabled, onChange, onBlur, ref, value]);
+        onChange: (event) => _registerProps.current.onChange({
+            target: {
+                value: getEventValue(event),
+                name: name,
+            },
+            type: EVENTS.CHANGE,
+        }),
+        onBlur: () => _registerProps.current.onBlur({
+            target: {
+                value: get(control._formValues, name),
+                name: name,
+            },
+            type: EVENTS.BLUR,
+        }),
+        ref: (elm) => {
+            const field = get(control._fields, name);
+            if (field && elm) {
+                field._f.ref = {
+                    focus: () => elm.focus(),
+                    select: () => elm.select(),
+                    setCustomValidity: (message) => elm.setCustomValidity(message),
+                    reportValidity: () => elm.reportValidity(),
+                };
+            }
+        },
+    }), [
+        name,
+        control._formValues,
+        disabled,
+        formState.disabled,
+        value,
+        control._fields,
+    ]);
     React__default.useEffect(() => {
         const _shouldUnregisterField = control._options.shouldUnregister || shouldUnregister;
-        control.register(name, {
-            ..._props.current.rules,
-            ...(isBoolean(_props.current.disabled)
-                ? { disabled: _props.current.disabled }
-                : {}),
-        });
         const updateMounted = (name, value) => {
             const field = get(control._fields, name);
             if (field && field._f) {
@@ -463,8 +502,9 @@ function useController(props) {
         };
     }, [name, control, isArrayField, shouldUnregister]);
     React__default.useEffect(() => {
-        control._setDisabledField({
+        control._updateDisabledField({
             disabled,
+            fields: control._fields,
             name,
         });
     }, [disabled, name, control]);
@@ -644,70 +684,67 @@ var appendErrors = (name, validateAllFieldCriteria, errors, type, message) => va
     }
     : {};
 
-var convertToArrayPayload = (value) => (Array.isArray(value) ? value : [value]);
-
-var createSubject = () => {
-    let _observers = [];
-    const next = (value) => {
-        for (const observer of _observers) {
-            observer.next && observer.next(value);
-        }
-    };
-    const subscribe = (observer) => {
-        _observers.push(observer);
-        return {
-            unsubscribe: () => {
-                _observers = _observers.filter((o) => o !== observer);
-            },
-        };
-    };
-    const unsubscribe = () => {
-        _observers = [];
-    };
-    return {
-        get observers() {
-            return _observers;
-        },
-        next,
-        subscribe,
-        unsubscribe,
-    };
+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;
+        return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16);
+    });
 };
 
-var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
+var getFocusFieldName = (name, index, options = {}) => options.shouldFocus || isUndefined(options.shouldFocus)
+    ? options.focusName ||
+        `${name}.${isUndefined(options.focusIndex) ? index : options.focusIndex}.`
+    : '';
 
-function deepEqual(object1, object2) {
-    if (isPrimitive(object1) || isPrimitive(object2)) {
-        return object1 === object2;
-    }
-    if (isDateObject(object1) && isDateObject(object2)) {
-        return object1.getTime() === object2.getTime();
-    }
-    const keys1 = Object.keys(object1);
-    const keys2 = Object.keys(object2);
-    if (keys1.length !== keys2.length) {
-        return false;
-    }
-    for (const key of keys1) {
-        const val1 = object1[key];
-        if (!keys2.includes(key)) {
-            return false;
-        }
-        if (key !== 'ref') {
-            const val2 = object2[key];
-            if ((isDateObject(val1) && isDateObject(val2)) ||
-                (isObject(val1) && isObject(val2)) ||
-                (Array.isArray(val1) && Array.isArray(val2))
-                ? !deepEqual(val1, val2)
-                : val1 !== val2) {
-                return false;
+var getValidationModes = (mode) => ({
+    isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
+    isOnBlur: mode === VALIDATION_MODE.onBlur,
+    isOnChange: mode === VALIDATION_MODE.onChange,
+    isOnAll: mode === VALIDATION_MODE.all,
+    isOnTouch: mode === VALIDATION_MODE.onTouched,
+});
+
+var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
+    (_names.watchAll ||
+        _names.watch.has(name) ||
+        [..._names.watch].some((watchName) => name.startsWith(watchName) &&
+            /^\.\w+/.test(name.slice(watchName.length))));
+
+const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
+    for (const key of fieldsNames || Object.keys(fields)) {
+        const field = get(fields, key);
+        if (field) {
+            const { _f, ...currentField } = field;
+            if (_f) {
+                if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
+                    return true;
+                }
+                else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
+                    return true;
+                }
+                else {
+                    if (iterateFieldsByAction(currentField, action)) {
+                        break;
+                    }
+                }
+            }
+            else if (isObject(currentField)) {
+                if (iterateFieldsByAction(currentField, action)) {
+                    break;
+                }
             }
         }
     }
-    return true;
-}
+    return;
+};
 
-var isEmptyObject = (value) => isObject(value) && !Object.keys(value).length;
+var updateFieldArrayRootError = (errors, error, name) => {
+    const fieldArrayErrors = convertToArrayPayload(get(errors, name));
+    set(fieldArrayErrors, 'root', error[name]);
+    set(errors, name, fieldArrayErrors);
+    return errors;
+};
 
 var isFileInput = (element) => element.type === 'file';
 
@@ -722,532 +759,812 @@ var isHTMLElement = (value) => {
         (owner && owner.defaultView ? owner.defaultView.HTMLElement : HTMLElement));
 };
 
-var isMultipleSelect = (element) => element.type === `select-multiple`;
+var isMessage = (value) => isString(value);
 
 var isRadioInput = (element) => element.type === 'radio';
 
-var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
-
-var live = (ref) => isHTMLElement(ref) && ref.isConnected;
+var isRegex = (value) => value instanceof RegExp;
 
-function baseGet(object, updatePath) {
-    const length = updatePath.slice(0, -1).length;
-    let index = 0;
-    while (index < length) {
-        object = isUndefined(object) ? index++ : object[updatePath[index++]];
-    }
-    return object;
-}
-function isEmptyArray(obj) {
-    for (const key in obj) {
-        if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
-            return false;
+const defaultResult = {
+    value: false,
+    isValid: false,
+};
+const validResult = { value: true, isValid: true };
+var getCheckboxValue = (options) => {
+    if (Array.isArray(options)) {
+        if (options.length > 1) {
+            const values = options
+                .filter((option) => option && option.checked && !option.disabled)
+                .map((option) => option.value);
+            return { value: values, isValid: !!values.length };
         }
+        return options[0].checked && !options[0].disabled
+            ? // @ts-expect-error expected to work in the browser
+                options[0].attributes && !isUndefined(options[0].attributes.value)
+                    ? isUndefined(options[0].value) || options[0].value === ''
+                        ? validResult
+                        : { value: options[0].value, isValid: true }
+                    : validResult
+            : defaultResult;
     }
-    return true;
-}
-function unset(object, path) {
-    const paths = Array.isArray(path)
-        ? path
-        : isKey(path)
-            ? [path]
-            : stringToPath(path);
-    const childObject = paths.length === 1 ? object : baseGet(object, paths);
-    const index = paths.length - 1;
-    const key = paths[index];
-    if (childObject) {
-        delete childObject[key];
-    }
-    if (index !== 0 &&
-        ((isObject(childObject) && isEmptyObject(childObject)) ||
-            (Array.isArray(childObject) && isEmptyArray(childObject)))) {
-        unset(object, paths.slice(0, -1));
-    }
-    return object;
-}
+    return defaultResult;
+};
 
-var objectHasFunction = (data) => {
-    for (const key in data) {
-        if (isFunction(data[key])) {
-            return true;
-        }
-    }
-    return false;
+const defaultReturn = {
+    isValid: false,
+    value: null,
 };
+var getRadioValue = (options) => Array.isArray(options)
+    ? options.reduce((previous, option) => option && option.checked && !option.disabled
+        ? {
+            isValid: true,
+            value: option.value,
+        }
+        : previous, defaultReturn)
+    : defaultReturn;
 
-function markFieldsDirty(data, fields = {}) {
-    const isParentNodeArray = Array.isArray(data);
-    if (isObject(data) || isParentNodeArray) {
-        for (const key in data) {
-            if (Array.isArray(data[key]) ||
-                (isObject(data[key]) && !objectHasFunction(data[key]))) {
-                fields[key] = Array.isArray(data[key]) ? [] : {};
-                markFieldsDirty(data[key], fields[key]);
-            }
-            else if (!isNullOrUndefined(data[key])) {
-                fields[key] = true;
+function getValidateError(result, ref, type = 'validate') {
+    if (isMessage(result) ||
+        (Array.isArray(result) && result.every(isMessage)) ||
+        (isBoolean(result) && !result)) {
+        return {
+            type,
+            message: isMessage(result) ? result : '',
+            ref,
+        };
+    }
+}
+
+var getValueAndMessage = (validationData) => isObject(validationData) && !isRegex(validationData)
+    ? validationData
+    : {
+        value: validationData,
+        message: '',
+    };
+
+var validateField = async (field, disabledFieldNames, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
+    const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, } = field._f;
+    const inputValue = get(formValues, name);
+    if (!mount || disabledFieldNames.has(name)) {
+        return {};
+    }
+    const inputRef = refs ? refs[0] : ref;
+    const setCustomValidity = (message) => {
+        if (shouldUseNativeValidation && inputRef.reportValidity) {
+            inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');
+            inputRef.reportValidity();
+        }
+    };
+    const error = {};
+    const isRadio = isRadioInput(ref);
+    const isCheckBox = isCheckBoxInput(ref);
+    const isRadioOrCheckbox = isRadio || isCheckBox;
+    const isEmpty = ((valueAsNumber || isFileInput(ref)) &&
+        isUndefined(ref.value) &&
+        isUndefined(inputValue)) ||
+        (isHTMLElement(ref) && ref.value === '') ||
+        inputValue === '' ||
+        (Array.isArray(inputValue) && !inputValue.length);
+    const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
+    const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
+        const message = exceedMax ? maxLengthMessage : minLengthMessage;
+        error[name] = {
+            type: exceedMax ? maxType : minType,
+            message,
+            ref,
+            ...appendErrorsCurry(exceedMax ? maxType : minType, message),
+        };
+    };
+    if (isFieldArray
+        ? !Array.isArray(inputValue) || !inputValue.length
+        : required &&
+            ((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||
+                (isBoolean(inputValue) && !inputValue) ||
+                (isCheckBox && !getCheckboxValue(refs).isValid) ||
+                (isRadio && !getRadioValue(refs).isValid))) {
+        const { value, message } = isMessage(required)
+            ? { value: !!required, message: required }
+            : getValueAndMessage(required);
+        if (value) {
+            error[name] = {
+                type: INPUT_VALIDATION_RULES.required,
+                message,
+                ref: inputRef,
+                ...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),
+            };
+            if (!validateAllFieldCriteria) {
+                setCustomValidity(message);
+                return error;
             }
         }
     }
-    return fields;
-}
-function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) {
-    const isParentNodeArray = Array.isArray(data);
-    if (isObject(data) || isParentNodeArray) {
-        for (const key in data) {
-            if (Array.isArray(data[key]) ||
-                (isObject(data[key]) && !objectHasFunction(data[key]))) {
-                if (isUndefined(formValues) ||
-                    isPrimitive(dirtyFieldsFromValues[key])) {
-                    dirtyFieldsFromValues[key] = Array.isArray(data[key])
-                        ? markFieldsDirty(data[key], [])
-                        : { ...markFieldsDirty(data[key]) };
+    if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
+        let exceedMax;
+        let exceedMin;
+        const maxOutput = getValueAndMessage(max);
+        const minOutput = getValueAndMessage(min);
+        if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
+            const valueNumber = ref.valueAsNumber ||
+                (inputValue ? +inputValue : inputValue);
+            if (!isNullOrUndefined(maxOutput.value)) {
+                exceedMax = valueNumber > maxOutput.value;
+            }
+            if (!isNullOrUndefined(minOutput.value)) {
+                exceedMin = valueNumber < minOutput.value;
+            }
+        }
+        else {
+            const valueDate = ref.valueAsDate || new Date(inputValue);
+            const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);
+            const isTime = ref.type == 'time';
+            const isWeek = ref.type == 'week';
+            if (isString(maxOutput.value) && inputValue) {
+                exceedMax = isTime
+                    ? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)
+                    : isWeek
+                        ? inputValue > maxOutput.value
+                        : valueDate > new Date(maxOutput.value);
+            }
+            if (isString(minOutput.value) && inputValue) {
+                exceedMin = isTime
+                    ? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)
+                    : isWeek
+                        ? inputValue < minOutput.value
+                        : valueDate < new Date(minOutput.value);
+            }
+        }
+        if (exceedMax || exceedMin) {
+            getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
+            if (!validateAllFieldCriteria) {
+                setCustomValidity(error[name].message);
+                return error;
+            }
+        }
+    }
+    if ((maxLength || minLength) &&
+        !isEmpty &&
+        (isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {
+        const maxLengthOutput = getValueAndMessage(maxLength);
+        const minLengthOutput = getValueAndMessage(minLength);
+        const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&
+            inputValue.length > +maxLengthOutput.value;
+        const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&
+            inputValue.length < +minLengthOutput.value;
+        if (exceedMax || exceedMin) {
+            getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
+            if (!validateAllFieldCriteria) {
+                setCustomValidity(error[name].message);
+                return error;
+            }
+        }
+    }
+    if (pattern && !isEmpty && isString(inputValue)) {
+        const { value: patternValue, message } = getValueAndMessage(pattern);
+        if (isRegex(patternValue) && !inputValue.match(patternValue)) {
+            error[name] = {
+                type: INPUT_VALIDATION_RULES.pattern,
+                message,
+                ref,
+                ...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),
+            };
+            if (!validateAllFieldCriteria) {
+                setCustomValidity(message);
+                return error;
+            }
+        }
+    }
+    if (validate) {
+        if (isFunction(validate)) {
+            const result = await validate(inputValue, formValues);
+            const validateError = getValidateError(result, inputRef);
+            if (validateError) {
+                error[name] = {
+                    ...validateError,
+                    ...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),
+                };
+                if (!validateAllFieldCriteria) {
+                    setCustomValidity(validateError.message);
+                    return error;
                 }
-                else {
-                    getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
+            }
+        }
+        else if (isObject(validate)) {
+            let validationResult = {};
+            for (const key in validate) {
+                if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
+                    break;
+                }
+                const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
+                if (validateError) {
+                    validationResult = {
+                        ...validateError,
+                        ...appendErrorsCurry(key, validateError.message),
+                    };
+                    setCustomValidity(validateError.message);
+                    if (validateAllFieldCriteria) {
+                        error[name] = validationResult;
+                    }
                 }
             }
-            else {
-                dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
+            if (!isEmptyObject(validationResult)) {
+                error[name] = {
+                    ref: inputRef,
+                    ...validationResult,
+                };
+                if (!validateAllFieldCriteria) {
+                    return error;
+                }
             }
         }
     }
-    return dirtyFieldsFromValues;
+    setCustomValidity(true);
+    return error;
+};
+
+var appendAt = (data, value) => [
+    ...data,
+    ...convertToArrayPayload(value),
+];
+
+var fillEmptyArray = (value) => Array.isArray(value) ? value.map(() => undefined) : undefined;
+
+function insert(data, index, value) {
+    return [
+        ...data.slice(0, index),
+        ...convertToArrayPayload(value),
+        ...data.slice(index),
+    ];
 }
-var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
 
-const defaultResult = {
-    value: false,
-    isValid: false,
-};
-const validResult = { value: true, isValid: true };
-var getCheckboxValue = (options) => {
-    if (Array.isArray(options)) {
-        if (options.length > 1) {
-            const values = options
-                .filter((option) => option && option.checked && !option.disabled)
-                .map((option) => option.value);
-            return { value: values, isValid: !!values.length };
-        }
-        return options[0].checked && !options[0].disabled
-            ? // @ts-expect-error expected to work in the browser
-                options[0].attributes && !isUndefined(options[0].attributes.value)
-                    ? isUndefined(options[0].value) || options[0].value === ''
-                        ? validResult
-                        : { value: options[0].value, isValid: true }
-                    : validResult
-            : defaultResult;
+var moveArrayAt = (data, from, to) => {
+    if (!Array.isArray(data)) {
+        return [];
     }
-    return defaultResult;
+    if (isUndefined(data[to])) {
+        data[to] = undefined;
+    }
+    data.splice(to, 0, data.splice(from, 1)[0]);
+    return data;
 };
 
-var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value)
-    ? value
-    : valueAsNumber
-        ? value === ''
-            ? NaN
-            : value
-                ? +value
-                : value
-        : valueAsDate && isString(value)
-            ? new Date(value)
-            : setValueAs
-                ? setValueAs(value)
-                : value;
-
-const defaultReturn = {
-    isValid: false,
-    value: null,
-};
-var getRadioValue = (options) => Array.isArray(options)
-    ? options.reduce((previous, option) => option && option.checked && !option.disabled
-        ? {
-            isValid: true,
-            value: option.value,
-        }
-        : previous, defaultReturn)
-    : defaultReturn;
+var prependAt = (data, value) => [
+    ...convertToArrayPayload(value),
+    ...convertToArrayPayload(data),
+];
 
-function getFieldValue(_f) {
-    const ref = _f.ref;
-    if (isFileInput(ref)) {
-        return ref.files;
-    }
-    if (isRadioInput(ref)) {
-        return getRadioValue(_f.refs).value;
-    }
-    if (isMultipleSelect(ref)) {
-        return [...ref.selectedOptions].map(({ value }) => value);
-    }
-    if (isCheckBoxInput(ref)) {
-        return getCheckboxValue(_f.refs).value;
+function removeAtIndexes(data, indexes) {
+    let i = 0;
+    const temp = [...data];
+    for (const index of indexes) {
+        temp.splice(index - i, 1);
+        i++;
     }
-    return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
+    return compact(temp).length ? temp : [];
 }
+var removeArrayAt = (data, index) => isUndefined(index)
+    ? []
+    : removeAtIndexes(data, convertToArrayPayload(index).sort((a, b) => a - b));
 
-var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
-    const fields = {};
-    for (const name of fieldsNames) {
-        const field = get(_fields, name);
-        field && set(fields, name, field._f);
-    }
-    return {
-        criteriaMode,
-        names: [...fieldsNames],
-        fields,
-        shouldUseNativeValidation,
-    };
-};
-
-var isRegex = (value) => value instanceof RegExp;
-
-var getRuleValue = (rule) => isUndefined(rule)
-    ? rule
-    : isRegex(rule)
-        ? rule.source
-        : isObject(rule)
-            ? isRegex(rule.value)
-                ? rule.value.source
-                : rule.value
-            : rule;
-
-var getValidationModes = (mode) => ({
-    isOnSubmit: !mode || mode === VALIDATION_MODE.onSubmit,
-    isOnBlur: mode === VALIDATION_MODE.onBlur,
-    isOnChange: mode === VALIDATION_MODE.onChange,
-    isOnAll: mode === VALIDATION_MODE.all,
-    isOnTouch: mode === VALIDATION_MODE.onTouched,
-});
-
-const ASYNC_FUNCTION = 'AsyncFunction';
-var hasPromiseValidation = (fieldReference) => !!fieldReference &&
-    !!fieldReference.validate &&
-    !!((isFunction(fieldReference.validate) &&
-        fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
-        (isObject(fieldReference.validate) &&
-            Object.values(fieldReference.validate).find((validateFunction) => validateFunction.constructor.name === ASYNC_FUNCTION)));
-
-var hasValidation = (options) => options.mount &&
-    (options.required ||
-        options.min ||
-        options.max ||
-        options.maxLength ||
-        options.minLength ||
-        options.pattern ||
-        options.validate);
-
-var isWatched = (name, _names, isBlurEvent) => !isBlurEvent &&
-    (_names.watchAll ||
-        _names.watch.has(name) ||
-        [..._names.watch].some((watchName) => name.startsWith(watchName) &&
-            /^\.\w+/.test(name.slice(watchName.length))));
-
-const iterateFieldsByAction = (fields, action, fieldsNames, abortEarly) => {
-    for (const key of fieldsNames || Object.keys(fields)) {
-        const field = get(fields, key);
-        if (field) {
-            const { _f, ...currentField } = field;
-            if (_f) {
-                if (_f.refs && _f.refs[0] && action(_f.refs[0], key) && !abortEarly) {
-                    return true;
-                }
-                else if (_f.ref && action(_f.ref, _f.name) && !abortEarly) {
-                    return true;
-                }
-                else {
-                    if (iterateFieldsByAction(currentField, action)) {
-                        break;
-                    }
-                }
-            }
-            else if (isObject(currentField)) {
-                if (iterateFieldsByAction(currentField, action)) {
-                    break;
-                }
-            }
-        }
-    }
-    return;
+var swapArrayAt = (data, indexA, indexB) => {
+    [data[indexA], data[indexB]] = [data[indexB], data[indexA]];
 };
 
-function schemaErrorLookup(errors, _fields, name) {
-    const error = get(errors, name);
-    if (error || isKey(name)) {
-        return {
-            error,
-            name,
-        };
+function baseGet(object, updatePath) {
+    const length = updatePath.slice(0, -1).length;
+    let index = 0;
+    while (index < length) {
+        object = isUndefined(object) ? index++ : object[updatePath[index++]];
     }
-    const names = name.split('.');
-    while (names.length) {
-        const fieldName = names.join('.');
-        const field = get(_fields, fieldName);
-        const foundError = get(errors, fieldName);
-        if (field && !Array.isArray(field) && name !== fieldName) {
-            return { name };
-        }
-        if (foundError && foundError.type) {
-            return {
-                name: fieldName,
-                error: foundError,
-            };
+    return object;
+}
+function isEmptyArray(obj) {
+    for (const key in obj) {
+        if (obj.hasOwnProperty(key) && !isUndefined(obj[key])) {
+            return false;
         }
-        names.pop();
     }
-    return {
-        name,
-    };
+    return true;
 }
-
-var shouldRenderFormState = (formStateData, _proxyFormState, updateFormState, isRoot) => {
-    updateFormState(formStateData);
-    const { name, ...formState } = formStateData;
-    return (isEmptyObject(formState) ||
-        Object.keys(formState).length >= Object.keys(_proxyFormState).length ||
-        Object.keys(formState).find((key) => _proxyFormState[key] ===
-            (!isRoot || VALIDATION_MODE.all)));
-};
-
-var shouldSubscribeByName = (name, signalName, exact) => !name ||
-    !signalName ||
-    name === signalName ||
-    convertToArrayPayload(name).some((currentName) => currentName &&
-        (exact
-            ? currentName === signalName
-            : currentName.startsWith(signalName) ||
-                signalName.startsWith(currentName)));
-
-var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
-    if (mode.isOnAll) {
-        return false;
-    }
-    else if (!isSubmitted && mode.isOnTouch) {
-        return !(isTouched || isBlurEvent);
-    }
-    else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
-        return !isBlurEvent;
-    }
-    else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
-        return isBlurEvent;
+function unset(object, path) {
+    const paths = Array.isArray(path)
+        ? path
+        : isKey(path)
+            ? [path]
+            : stringToPath(path);
+    const childObject = paths.length === 1 ? object : baseGet(object, paths);
+    const index = paths.length - 1;
+    const key = paths[index];
+    if (childObject) {
+        delete childObject[key];
     }
-    return true;
-};
-
-var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
-
-var updateFieldArrayRootError = (errors, error, name) => {
-    const fieldArrayErrors = convertToArrayPayload(get(errors, name));
-    set(fieldArrayErrors, 'root', error[name]);
-    set(errors, name, fieldArrayErrors);
-    return errors;
-};
-
-var isMessage = (value) => isString(value);
-
-function getValidateError(result, ref, type = 'validate') {
-    if (isMessage(result) ||
-        (Array.isArray(result) && result.every(isMessage)) ||
-        (isBoolean(result) && !result)) {
-        return {
-            type,
-            message: isMessage(result) ? result : '',
-            ref,
-        };
+    if (index !== 0 &&
+        ((isObject(childObject) && isEmptyObject(childObject)) ||
+            (Array.isArray(childObject) && isEmptyArray(childObject)))) {
+        unset(object, paths.slice(0, -1));
     }
+    return object;
 }
 
-var getValueAndMessage = (validationData) => isObject(validationData) && !isRegex(validationData)
-    ? validationData
-    : {
-        value: validationData,
-        message: '',
-    };
+var updateAt = (fieldValues, index, value) => {
+    fieldValues[index] = value;
+    return fieldValues;
+};
 
-var validateField = async (field, disabledFieldNames, formValues, validateAllFieldCriteria, shouldUseNativeValidation, isFieldArray) => {
-    const { ref, refs, required, maxLength, minLength, min, max, pattern, validate, name, valueAsNumber, mount, } = field._f;
-    const inputValue = get(formValues, name);
-    if (!mount || disabledFieldNames.has(name)) {
-        return {};
-    }
-    const inputRef = refs ? refs[0] : ref;
-    const setCustomValidity = (message) => {
-        if (shouldUseNativeValidation && inputRef.reportValidity) {
-            inputRef.setCustomValidity(isBoolean(message) ? '' : message || '');
-            inputRef.reportValidity();
-        }
+/**
+ * A custom hook that exposes convenient methods to perform operations with a list of dynamic inputs that need to be appended, updated, removed etc. • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn) • [Video](https://youtu.be/4MrbfGSFY2A)
+ *
+ * @remarks
+ * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn)
+ *
+ * @param props - useFieldArray props
+ *
+ * @returns methods - functions to manipulate with the Field Arrays (dynamic inputs) {@link UseFieldArrayReturn}
+ *
+ * @example
+ * ```tsx
+ * function App() {
+ *   const { register, control, handleSubmit, reset, trigger, setError } = useForm({
+ *     defaultValues: {
+ *       test: []
+ *     }
+ *   });
+ *   const { fields, append } = useFieldArray({
+ *     control,
+ *     name: "test"
+ *   });
+ *
+ *   return (
+ *     <form onSubmit={handleSubmit(data => console.log(data))}>
+ *       {fields.map((item, index) => (
+ *          <input key={item.id} {...register(`test.${index}.firstName`)}  />
+ *       ))}
+ *       <button type="button" onClick={() => append({ firstName: "bill" })}>
+ *         append
+ *       </button>
+ *       <input type="submit" />
+ *     </form>
+ *   );
+ * }
+ * ```
+ */
+function useFieldArray(props) {
+    const methods = useFormContext();
+    const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
+    const [fields, setFields] = React__default.useState(control._getFieldArray(name));
+    const ids = React__default.useRef(control._getFieldArray(name).map(generateId));
+    const _fieldIds = React__default.useRef(fields);
+    const _name = React__default.useRef(name);
+    const _actioned = React__default.useRef(false);
+    _name.current = name;
+    _fieldIds.current = fields;
+    control._names.array.add(name);
+    rules &&
+        control.register(name, rules);
+    useSubscribe({
+        next: ({ values, name: fieldArrayName, }) => {
+            if (fieldArrayName === _name.current || !fieldArrayName) {
+                const fieldValues = get(values, _name.current);
+                if (Array.isArray(fieldValues)) {
+                    setFields(fieldValues);
+                    ids.current = fieldValues.map(generateId);
+                }
+            }
+        },
+        subject: control._subjects.array,
+    });
+    const updateValues = React__default.useCallback((updatedFieldArrayValues) => {
+        _actioned.current = true;
+        control._updateFieldArray(name, updatedFieldArrayValues);
+    }, [control, name]);
+    const append = (value, options) => {
+        const appendValue = convertToArrayPayload(cloneObject(value));
+        const updatedFieldArrayValues = appendAt(control._getFieldArray(name), appendValue);
+        control._names.focus = getFocusFieldName(name, updatedFieldArrayValues.length - 1, options);
+        ids.current = appendAt(ids.current, appendValue.map(generateId));
+        updateValues(updatedFieldArrayValues);
+        setFields(updatedFieldArrayValues);
+        control._updateFieldArray(name, updatedFieldArrayValues, appendAt, {
+            argA: fillEmptyArray(value),
+        });
     };
-    const error = {};
-    const isRadio = isRadioInput(ref);
-    const isCheckBox = isCheckBoxInput(ref);
-    const isRadioOrCheckbox = isRadio || isCheckBox;
-    const isEmpty = ((valueAsNumber || isFileInput(ref)) &&
-        isUndefined(ref.value) &&
-        isUndefined(inputValue)) ||
-        (isHTMLElement(ref) && ref.value === '') ||
-        inputValue === '' ||
-        (Array.isArray(inputValue) && !inputValue.length);
-    const appendErrorsCurry = appendErrors.bind(null, name, validateAllFieldCriteria, error);
-    const getMinMaxMessage = (exceedMax, maxLengthMessage, minLengthMessage, maxType = INPUT_VALIDATION_RULES.maxLength, minType = INPUT_VALIDATION_RULES.minLength) => {
-        const message = exceedMax ? maxLengthMessage : minLengthMessage;
-        error[name] = {
-            type: exceedMax ? maxType : minType,
-            message,
-            ref,
-            ...appendErrorsCurry(exceedMax ? maxType : minType, message),
-        };
+    const prepend = (value, options) => {
+        const prependValue = convertToArrayPayload(cloneObject(value));
+        const updatedFieldArrayValues = prependAt(control._getFieldArray(name), prependValue);
+        control._names.focus = getFocusFieldName(name, 0, options);
+        ids.current = prependAt(ids.current, prependValue.map(generateId));
+        updateValues(updatedFieldArrayValues);
+        setFields(updatedFieldArrayValues);
+        control._updateFieldArray(name, updatedFieldArrayValues, prependAt, {
+            argA: fillEmptyArray(value),
+        });
     };
-    if (isFieldArray
-        ? !Array.isArray(inputValue) || !inputValue.length
-        : required &&
-            ((!isRadioOrCheckbox && (isEmpty || isNullOrUndefined(inputValue))) ||
-                (isBoolean(inputValue) && !inputValue) ||
-                (isCheckBox && !getCheckboxValue(refs).isValid) ||
-                (isRadio && !getRadioValue(refs).isValid))) {
-        const { value, message } = isMessage(required)
-            ? { value: !!required, message: required }
-            : getValueAndMessage(required);
-        if (value) {
-            error[name] = {
-                type: INPUT_VALIDATION_RULES.required,
-                message,
-                ref: inputRef,
-                ...appendErrorsCurry(INPUT_VALIDATION_RULES.required, message),
-            };
-            if (!validateAllFieldCriteria) {
-                setCustomValidity(message);
-                return error;
-            }
-        }
-    }
-    if (!isEmpty && (!isNullOrUndefined(min) || !isNullOrUndefined(max))) {
-        let exceedMax;
-        let exceedMin;
-        const maxOutput = getValueAndMessage(max);
-        const minOutput = getValueAndMessage(min);
-        if (!isNullOrUndefined(inputValue) && !isNaN(inputValue)) {
-            const valueNumber = ref.valueAsNumber ||
-                (inputValue ? +inputValue : inputValue);
-            if (!isNullOrUndefined(maxOutput.value)) {
-                exceedMax = valueNumber > maxOutput.value;
-            }
-            if (!isNullOrUndefined(minOutput.value)) {
-                exceedMin = valueNumber < minOutput.value;
-            }
-        }
-        else {
-            const valueDate = ref.valueAsDate || new Date(inputValue);
-            const convertTimeToDate = (time) => new Date(new Date().toDateString() + ' ' + time);
-            const isTime = ref.type == 'time';
-            const isWeek = ref.type == 'week';
-            if (isString(maxOutput.value) && inputValue) {
-                exceedMax = isTime
-                    ? convertTimeToDate(inputValue) > convertTimeToDate(maxOutput.value)
-                    : isWeek
-                        ? inputValue > maxOutput.value
-                        : valueDate > new Date(maxOutput.value);
+    const remove = (index) => {
+        const updatedFieldArrayValues = removeArrayAt(control._getFieldArray(name), index);
+        ids.current = removeArrayAt(ids.current, index);
+        updateValues(updatedFieldArrayValues);
+        setFields(updatedFieldArrayValues);
+        !Array.isArray(get(control._fields, name)) &&
+            set(control._fields, name, undefined);
+        control._updateFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
+            argA: index,
+        });
+    };
+    const insert$1 = (index, value, options) => {
+        const insertValue = convertToArrayPayload(cloneObject(value));
+        const updatedFieldArrayValues = insert(control._getFieldArray(name), index, insertValue);
+        control._names.focus = getFocusFieldName(name, index, options);
+        ids.current = insert(ids.current, index, insertValue.map(generateId));
+        updateValues(updatedFieldArrayValues);
+        setFields(updatedFieldArrayValues);
+        control._updateFieldArray(name, updatedFieldArrayValues, insert, {
+            argA: index,
+            argB: fillEmptyArray(value),
+        });
+    };
+    const swap = (indexA, indexB) => {
+        const updatedFieldArrayValues = control._getFieldArray(name);
+        swapArrayAt(updatedFieldArrayValues, indexA, indexB);
+        swapArrayAt(ids.current, indexA, indexB);
+        updateValues(updatedFieldArrayValues);
+        setFields(updatedFieldArrayValues);
+        control._updateFieldArray(name, updatedFieldArrayValues, swapArrayAt, {
+            argA: indexA,
+            argB: indexB,
+        }, false);
+    };
+    const move = (from, to) => {
+        const updatedFieldArrayValues = control._getFieldArray(name);
+        moveArrayAt(updatedFieldArrayValues, from, to);
+        moveArrayAt(ids.current, from, to);
+        updateValues(updatedFieldArrayValues);
+        setFields(updatedFieldArrayValues);
+        control._updateFieldArray(name, updatedFieldArrayValues, moveArrayAt, {
+            argA: from,
+            argB: to,
+        }, false);
+    };
+    const update = (index, value) => {
+        const updateValue = cloneObject(value);
+        const updatedFieldArrayValues = updateAt(control._getFieldArray(name), index, updateValue);
+        ids.current = [...updatedFieldArrayValues].map((item, i) => !item || i === index ? generateId() : ids.current[i]);
+        updateValues(updatedFieldArrayValues);
+        setFields([...updatedFieldArrayValues]);
+        control._updateFieldArray(name, updatedFieldArrayValues, updateAt, {
+            argA: index,
+            argB: updateValue,
+        }, true, false);
+    };
+    const replace = (value) => {
+        const updatedFieldArrayValues = convertToArrayPayload(cloneObject(value));
+        ids.current = updatedFieldArrayValues.map(generateId);
+        updateValues([...updatedFieldArrayValues]);
+        setFields([...updatedFieldArrayValues]);
+        control._updateFieldArray(name, [...updatedFieldArrayValues], (data) => data, {}, true, false);
+    };
+    React__default.useEffect(() => {
+        control._state.action = false;
+        isWatched(name, control._names) &&
+            control._subjects.state.next({
+                ...control._formState,
+            });
+        if (_actioned.current &&
+            (!getValidationModes(control._options.mode).isOnSubmit ||
+                control._formState.isSubmitted)) {
+            if (control._options.resolver) {
+                control._executeSchema([name]).then((result) => {
+                    const error = get(result.errors, name);
+                    const existingError = get(control._formState.errors, name);
+                    if (existingError
+                        ? (!error && existingError.type) ||
+                            (error &&
+                                (existingError.type !== error.type ||
+                                    existingError.message !== error.message))
+                        : error && error.type) {
+                        error
+                            ? set(control._formState.errors, name, error)
+                            : unset(control._formState.errors, name);
+                        control._subjects.state.next({
+                            errors: control._formState.errors,
+                        });
+                    }
+                });
             }
-            if (isString(minOutput.value) && inputValue) {
-                exceedMin = isTime
-                    ? convertTimeToDate(inputValue) < convertTimeToDate(minOutput.value)
-                    : isWeek
-                        ? inputValue < minOutput.value
-                        : valueDate < new Date(minOutput.value);
+            else {
+                const field = get(control._fields, name);
+                if (field &&
+                    field._f &&
+                    !(getValidationModes(control._options.reValidateMode).isOnSubmit &&
+                        getValidationModes(control._options.mode).isOnSubmit)) {
+                    validateField(field, control._names.disabled, control._formValues, control._options.criteriaMode === VALIDATION_MODE.all, control._options.shouldUseNativeValidation, true).then((error) => !isEmptyObject(error) &&
+                        control._subjects.state.next({
+                            errors: updateFieldArrayRootError(control._formState.errors, error, name),
+                        }));
+                }
             }
         }
-        if (exceedMax || exceedMin) {
-            getMinMaxMessage(!!exceedMax, maxOutput.message, minOutput.message, INPUT_VALIDATION_RULES.max, INPUT_VALIDATION_RULES.min);
-            if (!validateAllFieldCriteria) {
-                setCustomValidity(error[name].message);
-                return error;
-            }
+        control._subjects.values.next({
+            name,
+            values: { ...control._formValues },
+        });
+        control._names.focus &&
+            iterateFieldsByAction(control._fields, (ref, key) => {
+                if (control._names.focus &&
+                    key.startsWith(control._names.focus) &&
+                    ref.focus) {
+                    ref.focus();
+                    return 1;
+                }
+                return;
+            });
+        control._names.focus = '';
+        control._updateValid();
+        _actioned.current = false;
+    }, [fields, name, control]);
+    React__default.useEffect(() => {
+        !get(control._formValues, name) && control._updateFieldArray(name);
+        return () => {
+            (control._options.shouldUnregister || shouldUnregister) &&
+                control.unregister(name);
+        };
+    }, [name, control, keyName, shouldUnregister]);
+    return {
+        swap: React__default.useCallback(swap, [updateValues, name, control]),
+        move: React__default.useCallback(move, [updateValues, name, control]),
+        prepend: React__default.useCallback(prepend, [updateValues, name, control]),
+        append: React__default.useCallback(append, [updateValues, name, control]),
+        remove: React__default.useCallback(remove, [updateValues, name, control]),
+        insert: React__default.useCallback(insert$1, [updateValues, name, control]),
+        update: React__default.useCallback(update, [updateValues, name, control]),
+        replace: React__default.useCallback(replace, [updateValues, name, control]),
+        fields: React__default.useMemo(() => fields.map((field, index) => ({
+            ...field,
+            [keyName]: ids.current[index] || generateId(),
+        })), [fields, keyName]),
+    };
+}
+
+var createSubject = () => {
+    let _observers = [];
+    const next = (value) => {
+        for (const observer of _observers) {
+            observer.next && observer.next(value);
         }
+    };
+    const subscribe = (observer) => {
+        _observers.push(observer);
+        return {
+            unsubscribe: () => {
+                _observers = _observers.filter((o) => o !== observer);
+            },
+        };
+    };
+    const unsubscribe = () => {
+        _observers = [];
+    };
+    return {
+        get observers() {
+            return _observers;
+        },
+        next,
+        subscribe,
+        unsubscribe,
+    };
+};
+
+var isPrimitive = (value) => isNullOrUndefined(value) || !isObjectType(value);
+
+function deepEqual(object1, object2) {
+    if (isPrimitive(object1) || isPrimitive(object2)) {
+        return object1 === object2;
     }
-    if ((maxLength || minLength) &&
-        !isEmpty &&
-        (isString(inputValue) || (isFieldArray && Array.isArray(inputValue)))) {
-        const maxLengthOutput = getValueAndMessage(maxLength);
-        const minLengthOutput = getValueAndMessage(minLength);
-        const exceedMax = !isNullOrUndefined(maxLengthOutput.value) &&
-            inputValue.length > +maxLengthOutput.value;
-        const exceedMin = !isNullOrUndefined(minLengthOutput.value) &&
-            inputValue.length < +minLengthOutput.value;
-        if (exceedMax || exceedMin) {
-            getMinMaxMessage(exceedMax, maxLengthOutput.message, minLengthOutput.message);
-            if (!validateAllFieldCriteria) {
-                setCustomValidity(error[name].message);
-                return error;
+    if (isDateObject(object1) && isDateObject(object2)) {
+        return object1.getTime() === object2.getTime();
+    }
+    const keys1 = Object.keys(object1);
+    const keys2 = Object.keys(object2);
+    if (keys1.length !== keys2.length) {
+        return false;
+    }
+    for (const key of keys1) {
+        const val1 = object1[key];
+        if (!keys2.includes(key)) {
+            return false;
+        }
+        if (key !== 'ref') {
+            const val2 = object2[key];
+            if ((isDateObject(val1) && isDateObject(val2)) ||
+                (isObject(val1) && isObject(val2)) ||
+                (Array.isArray(val1) && Array.isArray(val2))
+                ? !deepEqual(val1, val2)
+                : val1 !== val2) {
+                return false;
             }
         }
     }
-    if (pattern && !isEmpty && isString(inputValue)) {
-        const { value: patternValue, message } = getValueAndMessage(pattern);
-        if (isRegex(patternValue) && !inputValue.match(patternValue)) {
-            error[name] = {
-                type: INPUT_VALIDATION_RULES.pattern,
-                message,
-                ref,
-                ...appendErrorsCurry(INPUT_VALIDATION_RULES.pattern, message),
-            };
-            if (!validateAllFieldCriteria) {
-                setCustomValidity(message);
-                return error;
-            }
+    return true;
+}
+
+var isMultipleSelect = (element) => element.type === `select-multiple`;
+
+var isRadioOrCheckbox = (ref) => isRadioInput(ref) || isCheckBoxInput(ref);
+
+var live = (ref) => isHTMLElement(ref) && ref.isConnected;
+
+var objectHasFunction = (data) => {
+    for (const key in data) {
+        if (isFunction(data[key])) {
+            return true;
         }
     }
-    if (validate) {
-        if (isFunction(validate)) {
-            const result = await validate(inputValue, formValues);
-            const validateError = getValidateError(result, inputRef);
-            if (validateError) {
-                error[name] = {
-                    ...validateError,
-                    ...appendErrorsCurry(INPUT_VALIDATION_RULES.validate, validateError.message),
-                };
-                if (!validateAllFieldCriteria) {
-                    setCustomValidity(validateError.message);
-                    return error;
-                }
+    return false;
+};
+
+function markFieldsDirty(data, fields = {}) {
+    const isParentNodeArray = Array.isArray(data);
+    if (isObject(data) || isParentNodeArray) {
+        for (const key in data) {
+            if (Array.isArray(data[key]) ||
+                (isObject(data[key]) && !objectHasFunction(data[key]))) {
+                fields[key] = Array.isArray(data[key]) ? [] : {};
+                markFieldsDirty(data[key], fields[key]);
+            }
+            else if (!isNullOrUndefined(data[key])) {
+                fields[key] = true;
             }
         }
-        else if (isObject(validate)) {
-            let validationResult = {};
-            for (const key in validate) {
-                if (!isEmptyObject(validationResult) && !validateAllFieldCriteria) {
-                    break;
+    }
+    return fields;
+}
+function getDirtyFieldsFromDefaultValues(data, formValues, dirtyFieldsFromValues) {
+    const isParentNodeArray = Array.isArray(data);
+    if (isObject(data) || isParentNodeArray) {
+        for (const key in data) {
+            if (Array.isArray(data[key]) ||
+                (isObject(data[key]) && !objectHasFunction(data[key]))) {
+                if (isUndefined(formValues) ||
+                    isPrimitive(dirtyFieldsFromValues[key])) {
+                    dirtyFieldsFromValues[key] = Array.isArray(data[key])
+                        ? markFieldsDirty(data[key], [])
+                        : { ...markFieldsDirty(data[key]) };
                 }
-                const validateError = getValidateError(await validate[key](inputValue, formValues), inputRef, key);
-                if (validateError) {
-                    validationResult = {
-                        ...validateError,
-                        ...appendErrorsCurry(key, validateError.message),
-                    };
-                    setCustomValidity(validateError.message);
-                    if (validateAllFieldCriteria) {
-                        error[name] = validationResult;
-                    }
+                else {
+                    getDirtyFieldsFromDefaultValues(data[key], isNullOrUndefined(formValues) ? {} : formValues[key], dirtyFieldsFromValues[key]);
                 }
             }
-            if (!isEmptyObject(validationResult)) {
-                error[name] = {
-                    ref: inputRef,
-                    ...validationResult,
-                };
-                if (!validateAllFieldCriteria) {
-                    return error;
-                }
+            else {
+                dirtyFieldsFromValues[key] = !deepEqual(data[key], formValues[key]);
             }
         }
     }
-    setCustomValidity(true);
-    return error;
-};
+    return dirtyFieldsFromValues;
+}
+var getDirtyFields = (defaultValues, formValues) => getDirtyFieldsFromDefaultValues(defaultValues, formValues, markFieldsDirty(formValues));
 
-const defaultOptions = {
-    mode: VALIDATION_MODE.onSubmit,
-    reValidateMode: VALIDATION_MODE.onChange,
-    shouldFocusError: true,
+var getFieldValueAs = (value, { valueAsNumber, valueAsDate, setValueAs }) => isUndefined(value)
+    ? value
+    : valueAsNumber
+        ? value === ''
+            ? NaN
+            : value
+                ? +value
+                : value
+        : valueAsDate && isString(value)
+            ? new Date(value)
+            : setValueAs
+                ? setValueAs(value)
+                : value;
+
+function getFieldValue(_f) {
+    const ref = _f.ref;
+    if (isFileInput(ref)) {
+        return ref.files;
+    }
+    if (isRadioInput(ref)) {
+        return getRadioValue(_f.refs).value;
+    }
+    if (isMultipleSelect(ref)) {
+        return [...ref.selectedOptions].map(({ value }) => value);
+    }
+    if (isCheckBoxInput(ref)) {
+        return getCheckboxValue(_f.refs).value;
+    }
+    return getFieldValueAs(isUndefined(ref.value) ? _f.ref.value : ref.value, _f);
+}
+
+var getResolverOptions = (fieldsNames, _fields, criteriaMode, shouldUseNativeValidation) => {
+    const fields = {};
+    for (const name of fieldsNames) {
+        const field = get(_fields, name);
+        field && set(fields, name, field._f);
+    }
+    return {
+        criteriaMode,
+        names: [...fieldsNames],
+        fields,
+        shouldUseNativeValidation,
+    };
 };
-function createFormControl(props = {}) {
+
+var getRuleValue = (rule) => isUndefined(rule)
+    ? rule
+    : isRegex(rule)
+        ? rule.source
+        : isObject(rule)
+            ? isRegex(rule.value)
+                ? rule.value.source
+                : rule.value
+            : rule;
+
+const ASYNC_FUNCTION = 'AsyncFunction';
+var hasPromiseValidation = (fieldReference) => !!fieldReference &&
+    !!fieldReference.validate &&
+    !!((isFunction(fieldReference.validate) &&
+        fieldReference.validate.constructor.name === ASYNC_FUNCTION) ||
+        (isObject(fieldReference.validate) &&
+            Object.values(fieldReference.validate).find((validateFunction) => validateFunction.constructor.name === ASYNC_FUNCTION)));
+
+var hasValidation = (options) => options.mount &&
+    (options.required ||
+        options.min ||
+        options.max ||
+        options.maxLength ||
+        options.minLength ||
+        options.pattern ||
+        options.validate);
+
+function schemaErrorLookup(errors, _fields, name) {
+    const error = get(errors, name);
+    if (error || isKey(name)) {
+        return {
+            error,
+            name,
+        };
+    }
+    const names = name.split('.');
+    while (names.length) {
+        const fieldName = names.join('.');
+        const field = get(_fields, fieldName);
+        const foundError = get(errors, fieldName);
+        if (field && !Array.isArray(field) && name !== fieldName) {
+            return { name };
+        }
+        if (foundError && foundError.type) {
+            return {
+                name: fieldName,
+                error: foundError,
+            };
+        }
+        names.pop();
+    }
+    return {
+        name,
+    };
+}
+
+var skipValidation = (isBlurEvent, isTouched, isSubmitted, reValidateMode, mode) => {
+    if (mode.isOnAll) {
+        return false;
+    }
+    else if (!isSubmitted && mode.isOnTouch) {
+        return !(isTouched || isBlurEvent);
+    }
+    else if (isSubmitted ? reValidateMode.isOnBlur : mode.isOnBlur) {
+        return !isBlurEvent;
+    }
+    else if (isSubmitted ? reValidateMode.isOnChange : mode.isOnChange) {
+        return isBlurEvent;
+    }
+    return true;
+};
+
+var unsetEmptyArray = (ref, name) => !compact(get(ref, name)).length && unset(ref, name);
+
+const defaultOptions = {
+    mode: VALIDATION_MODE.onSubmit,
+    reValidateMode: VALIDATION_MODE.onChange,
+    shouldFocusError: true,
+};
+function createFormControl(props = {}) {
     let _options = {
         ...defaultOptions,
         ...props,
@@ -1255,7 +1572,6 @@ function createFormControl(props = {}) {
     let _formState = {
         submitCount: 0,
         isDirty: false,
-        isReady: false,
         isLoading: isFunction(_options.defaultValues),
         isValidating: false,
         isSubmitted: false,
@@ -1268,7 +1584,7 @@ function createFormControl(props = {}) {
         errors: _options.errors || {},
         disabled: _options.disabled || false,
     };
-    const _fields = {};
+    let _fields = {};
     let _defaultValues = isObject(_options.defaultValues) || isObject(_options.values)
         ? cloneObject(_options.defaultValues || _options.values) || {}
         : {};
@@ -1298,25 +1614,22 @@ function createFormControl(props = {}) {
         isValid: false,
         errors: false,
     };
-    let _proxySubscribeFormState = {
-        ..._proxyFormState,
-    };
     const _subjects = {
+        values: createSubject(),
         array: createSubject(),
         state: createSubject(),
     };
+    const validationModeBeforeSubmit = getValidationModes(_options.mode);
+    const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
     const shouldDisplayAllAssociatedErrors = _options.criteriaMode === VALIDATION_MODE.all;
     const debounce = (callback) => (wait) => {
         clearTimeout(timer);
         timer = setTimeout(callback, wait);
     };
-    const _setValid = async (shouldUpdateValid) => {
-        if (!_options.disabled &&
-            (_proxyFormState.isValid ||
-                _proxySubscribeFormState.isValid ||
-                shouldUpdateValid)) {
+    const _updateValid = async (shouldUpdateValid) => {
+        if (!_options.disabled && (_proxyFormState.isValid || shouldUpdateValid)) {
             const isValid = _options.resolver
-                ? isEmptyObject((await _runSchema()).errors)
+                ? isEmptyObject((await _executeSchema()).errors)
                 : await executeBuiltInValidation(_fields, true);
             if (isValid !== _formState.isValid) {
                 _subjects.state.next({
@@ -1327,10 +1640,7 @@ function createFormControl(props = {}) {
     };
     const _updateIsValidating = (names, isValidating) => {
         if (!_options.disabled &&
-            (_proxyFormState.isValidating ||
-                _proxyFormState.validatingFields ||
-                _proxySubscribeFormState.isValidating ||
-                _proxySubscribeFormState.validatingFields)) {
+            (_proxyFormState.isValidating || _proxyFormState.validatingFields)) {
             (names || Array.from(_names.mount)).forEach((name) => {
                 if (name) {
                     isValidating
@@ -1344,7 +1654,7 @@ function createFormControl(props = {}) {
             });
         }
     };
-    const _setFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
+    const _updateFieldArray = (name, values = [], method, args, shouldSetValues = true, shouldUpdateFieldsAndState = true) => {
         if (args && method && !_options.disabled) {
             _state.action = true;
             if (shouldUpdateFieldsAndState && Array.isArray(get(_fields, name))) {
@@ -1357,14 +1667,13 @@ function createFormControl(props = {}) {
                 shouldSetValues && set(_formState.errors, name, errors);
                 unsetEmptyArray(_formState.errors, name);
             }
-            if ((_proxyFormState.touchedFields ||
-                _proxySubscribeFormState.touchedFields) &&
+            if (_proxyFormState.touchedFields &&
                 shouldUpdateFieldsAndState &&
                 Array.isArray(get(_formState.touchedFields, name))) {
                 const touchedFields = method(get(_formState.touchedFields, name), args.argA, args.argB);
                 shouldSetValues && set(_formState.touchedFields, name, touchedFields);
             }
-            if (_proxyFormState.dirtyFields || _proxySubscribeFormState.dirtyFields) {
+            if (_proxyFormState.dirtyFields) {
                 _formState.dirtyFields = getDirtyFields(_defaultValues, _formValues);
             }
             _subjects.state.next({
@@ -1401,7 +1710,7 @@ function createFormControl(props = {}) {
                 shouldSkipSetValueAs
                 ? set(_formValues, name, shouldSkipSetValueAs ? defaultValue : getFieldValue(field._f))
                 : setFieldValue(name, defaultValue);
-            _state.mount && _setValid();
+            _state.mount && _updateValid();
         }
     };
     const updateTouchAndDirty = (name, fieldValue, isBlurEvent, shouldDirty, shouldRender) => {
@@ -1411,22 +1720,24 @@ function createFormControl(props = {}) {
             name,
         };
         if (!_options.disabled) {
+            const disabledField = !!(get(_fields, name) &&
+                get(_fields, name)._f &&
+                get(_fields, name)._f.disabled);
             if (!isBlurEvent || shouldDirty) {
-                if (_proxyFormState.isDirty || _proxySubscribeFormState.isDirty) {
+                if (_proxyFormState.isDirty) {
                     isPreviousDirty = _formState.isDirty;
                     _formState.isDirty = output.isDirty = _getDirty();
                     shouldUpdateField = isPreviousDirty !== output.isDirty;
                 }
-                const isCurrentFieldPristine = deepEqual(get(_defaultValues, name), fieldValue);
-                isPreviousDirty = !!get(_formState.dirtyFields, name);
-                isCurrentFieldPristine
+                const isCurrentFieldPristine = disabledField || deepEqual(get(_defaultValues, name), fieldValue);
+                isPreviousDirty = !!(!disabledField && get(_formState.dirtyFields, name));
+                isCurrentFieldPristine || disabledField
                     ? unset(_formState.dirtyFields, name)
                     : set(_formState.dirtyFields, name, true);
                 output.dirtyFields = _formState.dirtyFields;
                 shouldUpdateField =
                     shouldUpdateField ||
-                        ((_proxyFormState.dirtyFields ||
-                            _proxySubscribeFormState.dirtyFields) &&
+                        (_proxyFormState.dirtyFields &&
                             isPreviousDirty !== !isCurrentFieldPristine);
             }
             if (isBlurEvent) {
@@ -1436,8 +1747,7 @@ function createFormControl(props = {}) {
                     output.touchedFields = _formState.touchedFields;
                     shouldUpdateField =
                         shouldUpdateField ||
-                            ((_proxyFormState.touchedFields ||
-                                _proxySubscribeFormState.touchedFields) &&
+                            (_proxyFormState.touchedFields &&
                                 isPreviousFieldTouched !== isBlurEvent);
                 }
             }
@@ -1447,7 +1757,7 @@ function createFormControl(props = {}) {
     };
     const shouldRenderByError = (name, isValid, error, fieldState) => {
         const previousFieldError = get(_formState.errors, name);
-        const shouldUpdateValid = (_proxyFormState.isValid || _proxySubscribeFormState.isValid) &&
+        const shouldUpdateValid = _proxyFormState.isValid &&
             isBoolean(isValid) &&
             _formState.isValid !== isValid;
         if (_options.delayError && error) {
@@ -1477,14 +1787,14 @@ function createFormControl(props = {}) {
             _subjects.state.next(updatedFormState);
         }
     };
-    const _runSchema = async (name) => {
+    const _executeSchema = 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);
+        const { errors } = await _executeSchema(names);
         if (names) {
             for (const name of names) {
                 const error = get(errors, name);
@@ -1557,1034 +1867,689 @@ function createFormControl(props = {}) {
                     ? { [names]: defaultValue }
                     : defaultValue),
     }, isGlobal, defaultValue);
-    const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get(_defaultValues, name, []) : []));
-    const setFieldValue = (name, value, options = {}) => {
-        const field = get(_fields, name);
-        let fieldValue = value;
-        if (field) {
-            const fieldReference = field._f;
-            if (fieldReference) {
-                !fieldReference.disabled &&
-                    set(_formValues, name, getFieldValueAs(value, fieldReference));
-                fieldValue =
-                    isHTMLElement(fieldReference.ref) && isNullOrUndefined(value)
-                        ? ''
-                        : value;
-                if (isMultipleSelect(fieldReference.ref)) {
-                    [...fieldReference.ref.options].forEach((optionRef) => (optionRef.selected = fieldValue.includes(optionRef.value)));
-                }
-                else if (fieldReference.refs) {
-                    if (isCheckBoxInput(fieldReference.ref)) {
-                        fieldReference.refs.forEach((checkboxRef) => {
-                            if (!checkboxRef.defaultChecked || !checkboxRef.disabled) {
-                                if (Array.isArray(fieldValue)) {
-                                    checkboxRef.checked = !!fieldValue.find((data) => data === checkboxRef.value);
-                                }
-                                else {
-                                    checkboxRef.checked =
-                                        fieldValue === checkboxRef.value || !!fieldValue;
-                                }
-                            }
-                        });
-                    }
-                    else {
-                        fieldReference.refs.forEach((radioRef) => (radioRef.checked = radioRef.value === fieldValue));
-                    }
-                }
-                else if (isFileInput(fieldReference.ref)) {
-                    fieldReference.ref.value = '';
-                }
-                else {
-                    fieldReference.ref.value = fieldValue;
-                    if (!fieldReference.ref.type) {
-                        _subjects.state.next({
-                            name,
-                            values: cloneObject(_formValues),
-                        });
-                    }
-                }
-            }
-        }
-        (options.shouldDirty || options.shouldTouch) &&
-            updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true);
-        options.shouldValidate && trigger(name);
-    };
-    const setValues = (name, value, options) => {
-        for (const fieldKey in value) {
-            if (!value.hasOwnProperty(fieldKey)) {
-                return;
-            }
-            const fieldValue = value[fieldKey];
-            const fieldName = `${name}.${fieldKey}`;
-            const field = get(_fields, fieldName);
-            (_names.array.has(name) ||
-                isObject(fieldValue) ||
-                (field && !field._f)) &&
-                !isDateObject(fieldValue)
-                ? setValues(fieldName, fieldValue, options)
-                : setFieldValue(fieldName, fieldValue, options);
-        }
-    };
-    const setValue = (name, value, options = {}) => {
-        const field = get(_fields, name);
-        const isFieldArray = _names.array.has(name);
-        const cloneValue = cloneObject(value);
-        set(_formValues, name, cloneValue);
-        if (isFieldArray) {
-            _subjects.array.next({
-                name,
-                values: cloneObject(_formValues),
-            });
-            if ((_proxyFormState.isDirty ||
-                _proxyFormState.dirtyFields ||
-                _proxySubscribeFormState.isDirty ||
-                _proxySubscribeFormState.dirtyFields) &&
-                options.shouldDirty) {
-                _subjects.state.next({
-                    name,
-                    dirtyFields: getDirtyFields(_defaultValues, _formValues),
-                    isDirty: _getDirty(name, cloneValue),
-                });
-            }
-        }
-        else {
-            field && !field._f && !isNullOrUndefined(cloneValue)
-                ? setValues(name, cloneValue, options)
-                : setFieldValue(name, cloneValue, options);
-        }
-        isWatched(name, _names) && _subjects.state.next({ ..._formState });
-        _subjects.state.next({
-            name: _state.mount ? name : undefined,
-            values: cloneObject(_formValues),
-        });
-    };
-    const onChange = async (event) => {
-        _state.mount = true;
-        const target = event.target;
-        let name = target.name;
-        let isFieldValueUpdated = true;
-        const field = get(_fields, name);
-        const _updateIsFieldValueUpdated = (fieldValue) => {
-            isFieldValueUpdated =
-                Number.isNaN(fieldValue) ||
-                    (isDateObject(fieldValue) && isNaN(fieldValue.getTime())) ||
-                    deepEqual(fieldValue, get(_formValues, name, fieldValue));
-        };
-        const validationModeBeforeSubmit = getValidationModes(_options.mode);
-        const validationModeAfterSubmit = getValidationModes(_options.reValidateMode);
-        if (field) {
-            let error;
-            let isValid;
-            const fieldValue = target.type
-                ? getFieldValue(field._f)
-                : getEventValue(event);
-            const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
-            const shouldSkipValidation = (!hasValidation(field._f) &&
-                !_options.resolver &&
-                !get(_formState.errors, name) &&
-                !field._f.deps) ||
-                skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);
-            const watched = isWatched(name, _names, isBlurEvent);
-            set(_formValues, name, fieldValue);
-            if (isBlurEvent) {
-                field._f.onBlur && field._f.onBlur(event);
-                delayErrorCallback && delayErrorCallback(0);
-            }
-            else if (field._f.onChange) {
-                field._f.onChange(event);
-            }
-            const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent);
-            const shouldRender = !isEmptyObject(fieldState) || watched;
-            !isBlurEvent &&
-                _subjects.state.next({
-                    name,
-                    type: event.type,
-                    values: cloneObject(_formValues),
-                });
-            if (shouldSkipValidation) {
-                if (_proxyFormState.isValid || _proxySubscribeFormState.isValid) {
-                    if (_options.mode === 'onBlur') {
-                        if (isBlurEvent) {
-                            _setValid();
-                        }
-                    }
-                    else if (!isBlurEvent) {
-                        _setValid();
-                    }
-                }
-                return (shouldRender &&
-                    _subjects.state.next({ name, ...(watched ? {} : fieldState) }));
-            }
-            !isBlurEvent && watched && _subjects.state.next({ ..._formState });
-            if (_options.resolver) {
-                const { errors } = await _runSchema([name]);
-                _updateIsFieldValueUpdated(fieldValue);
-                if (isFieldValueUpdated) {
-                    const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
-                    const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
-                    error = errorLookupResult.error;
-                    name = errorLookupResult.name;
-                    isValid = isEmptyObject(errors);
-                }
-            }
-            else {
-                _updateIsValidating([name], true);
-                error = (await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
-                _updateIsValidating([name]);
-                _updateIsFieldValueUpdated(fieldValue);
-                if (isFieldValueUpdated) {
-                    if (error) {
-                        isValid = false;
-                    }
-                    else if (_proxyFormState.isValid ||
-                        _proxySubscribeFormState.isValid) {
-                        isValid = await executeBuiltInValidation(_fields, true);
-                    }
-                }
-            }
-            if (isFieldValueUpdated) {
-                field._f.deps &&
-                    trigger(field._f.deps);
-                shouldRenderByError(name, isValid, error, fieldState);
-            }
-        }
-    };
-    const _focusInput = (ref, key) => {
-        if (get(_formState.errors, key) && ref.focus) {
-            ref.focus();
-            return 1;
-        }
-        return;
-    };
-    const trigger = async (name, options = {}) => {
-        let isValid;
-        let validationResult;
-        const fieldNames = convertToArrayPayload(name);
-        if (_options.resolver) {
-            const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);
-            isValid = isEmptyObject(errors);
-            validationResult = name
-                ? !fieldNames.some((name) => get(errors, name))
-                : isValid;
-        }
-        else if (name) {
-            validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
-                const field = get(_fields, fieldName);
-                return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
-            }))).every(Boolean);
-            !(!validationResult && !_formState.isValid) && _setValid();
-        }
-        else {
-            validationResult = isValid = await executeBuiltInValidation(_fields);
-        }
-        _subjects.state.next({
-            ...(!isString(name) ||
-                ((_proxyFormState.isValid || _proxySubscribeFormState.isValid) &&
-                    isValid !== _formState.isValid)
-                ? {}
-                : { name }),
-            ...(_options.resolver || !name ? { isValid } : {}),
-            errors: _formState.errors,
-        });
-        options.shouldFocus &&
-            !validationResult &&
-            iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
-        return validationResult;
-    };
-    const getValues = (fieldNames) => {
-        const values = {
-            ...(_state.mount ? _formValues : _defaultValues),
-        };
-        return isUndefined(fieldNames)
-            ? values
-            : isString(fieldNames)
-                ? get(values, fieldNames)
-                : fieldNames.map((name) => get(values, name));
-    };
-    const getFieldState = (name, formState) => ({
-        invalid: !!get((formState || _formState).errors, name),
-        isDirty: !!get((formState || _formState).dirtyFields, name),
-        error: get((formState || _formState).errors, name),
-        isValidating: !!get(_formState.validatingFields, name),
-        isTouched: !!get((formState || _formState).touchedFields, name),
-    });
-    const clearErrors = (name) => {
-        name &&
-            convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
-        _subjects.state.next({
-            errors: name ? _formState.errors : {},
-        });
-    };
-    const setError = (name, error, options) => {
-        const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
-        const currentError = get(_formState.errors, name) || {};
-        // Don't override existing error messages elsewhere in the object tree.
-        const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;
-        set(_formState.errors, name, {
-            ...restOfErrorTree,
-            ...error,
-            ref,
-        });
-        _subjects.state.next({
-            name,
-            errors: _formState.errors,
-            isValid: false,
-        });
-        options && options.shouldFocus && ref && ref.focus && ref.focus();
-    };
-    const watch = (name, defaultValue) => isFunction(name)
-        ? _subjects.state.subscribe({
-            next: (payload) => name(_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)) {
-                props.callback({
-                    values: { ..._formValues },
-                    ..._formState,
-                    ...formState,
-                });
-            }
-        },
-    }).unsubscribe;
-    const subscribe = (props) => {
-        _state.mount = true;
-        _proxySubscribeFormState = {
-            ..._proxySubscribeFormState,
-            ...props.formState,
-        };
-        return _subscribe({
-            ...props,
-            formState: _proxySubscribeFormState,
-        });
-    };
-    const unregister = (name, options = {}) => {
-        for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
-            _names.mount.delete(fieldName);
-            _names.array.delete(fieldName);
-            if (!options.keepValue) {
-                unset(_fields, fieldName);
-                unset(_formValues, fieldName);
-            }
-            !options.keepError && unset(_formState.errors, fieldName);
-            !options.keepDirty && unset(_formState.dirtyFields, fieldName);
-            !options.keepTouched && unset(_formState.touchedFields, fieldName);
-            !options.keepIsValidating &&
-                unset(_formState.validatingFields, fieldName);
-            !_options.shouldUnregister &&
-                !options.keepDefaultValue &&
-                unset(_defaultValues, fieldName);
-        }
-        _subjects.state.next({
-            values: cloneObject(_formValues),
-        });
-        _subjects.state.next({
-            ..._formState,
-            ...(!options.keepDirty ? {} : { isDirty: _getDirty() }),
-        });
-        !options.keepIsValid && _setValid();
-    };
-    const _setDisabledField = ({ disabled, name, }) => {
-        if ((isBoolean(disabled) && _state.mount) ||
-            !!disabled ||
-            _names.disabled.has(name)) {
-            disabled ? _names.disabled.add(name) : _names.disabled.delete(name);
-        }
-    };
-    const register = (name, options = {}) => {
-        let field = get(_fields, name);
-        const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
-        set(_fields, name, {
-            ...(field || {}),
-            _f: {
-                ...(field && field._f ? field._f : { ref: { name } }),
-                name,
-                mount: true,
-                ...options,
-            },
-        });
-        _names.mount.add(name);
-        if (field) {
-            _setDisabledField({
-                disabled: isBoolean(options.disabled)
-                    ? options.disabled
-                    : _options.disabled,
-                name,
-            });
-        }
-        else {
-            updateValidAndValue(name, true, options.value);
-        }
-        return {
-            ...(disabledIsDefined
-                ? { disabled: options.disabled || _options.disabled }
-                : {}),
-            ...(_options.progressive
-                ? {
-                    required: !!options.required,
-                    min: getRuleValue(options.min),
-                    max: getRuleValue(options.max),
-                    minLength: getRuleValue(options.minLength),
-                    maxLength: getRuleValue(options.maxLength),
-                    pattern: getRuleValue(options.pattern),
-                }
-                : {}),
-            name,
-            onChange,
-            onBlur: onChange,
-            ref: (ref) => {
-                if (ref) {
-                    register(name, options);
-                    field = get(_fields, name);
-                    const fieldRef = isUndefined(ref.value)
-                        ? ref.querySelectorAll
-                            ? ref.querySelectorAll('input,select,textarea')[0] || ref
-                            : ref
-                        : ref;
-                    const radioOrCheckbox = isRadioOrCheckbox(fieldRef);
-                    const refs = field._f.refs || [];
-                    if (radioOrCheckbox
-                        ? refs.find((option) => option === fieldRef)
-                        : fieldRef === field._f.ref) {
-                        return;
-                    }
-                    set(_fields, name, {
-                        _f: {
-                            ...field._f,
-                            ...(radioOrCheckbox
-                                ? {
-                                    refs: [
-                                        ...refs.filter(live),
-                                        fieldRef,
-                                        ...(Array.isArray(get(_defaultValues, name)) ? [{}] : []),
-                                    ],
-                                    ref: { type: fieldRef.type, name },
-                                }
-                                : { ref: fieldRef }),
-                        },
-                    });
-                    updateValidAndValue(name, false, undefined, fieldRef);
-                }
-                else {
-                    field = get(_fields, name, {});
-                    if (field._f) {
-                        field._f.mount = false;
-                    }
-                    (_options.shouldUnregister || options.shouldUnregister) &&
-                        !(isNameInFieldArray(_names.array, name) && _state.action) &&
-                        _names.unMount.add(name);
-                }
-            },
-        };
-    };
-    const _focusError = () => _options.shouldFocusError &&
-        iterateFieldsByAction(_fields, _focusInput, _names.mount);
-    const _disableForm = (disabled) => {
-        if (isBoolean(disabled)) {
-            _subjects.state.next({ disabled });
-            iterateFieldsByAction(_fields, (ref, name) => {
-                const currentField = get(_fields, name);
-                if (currentField) {
-                    ref.disabled = currentField._f.disabled || disabled;
-                    if (Array.isArray(currentField._f.refs)) {
-                        currentField._f.refs.forEach((inputRef) => {
-                            inputRef.disabled = currentField._f.disabled || disabled;
-                        });
-                    }
-                }
-            }, 0, false);
-        }
-    };
-    const handleSubmit = (onValid, onInvalid) => async (e) => {
-        let onValidError = undefined;
-        if (e) {
-            e.preventDefault && e.preventDefault();
-            e.persist &&
-                e.persist();
-        }
-        let fieldValues = cloneObject(_formValues);
-        _subjects.state.next({
-            isSubmitting: true,
-        });
-        if (_options.resolver) {
-            const { errors, values } = await _runSchema();
-            _formState.errors = errors;
-            fieldValues = values;
-        }
-        else {
-            await executeBuiltInValidation(_fields);
-        }
-        if (_names.disabled.size) {
-            for (const name of _names.disabled) {
-                set(fieldValues, name, undefined);
-            }
-        }
-        unset(_formState.errors, 'root');
-        if (isEmptyObject(_formState.errors)) {
-            _subjects.state.next({
-                errors: {},
-            });
-            try {
-                await onValid(fieldValues, e);
-            }
-            catch (error) {
-                onValidError = error;
-            }
-        }
-        else {
-            if (onInvalid) {
-                await onInvalid({ ..._formState.errors }, e);
-            }
-            _focusError();
-            setTimeout(_focusError);
-        }
-        _subjects.state.next({
-            isSubmitted: true,
-            isSubmitting: false,
-            isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,
-            submitCount: _formState.submitCount + 1,
-            errors: _formState.errors,
-        });
-        if (onValidError) {
-            throw onValidError;
-        }
-    };
-    const resetField = (name, options = {}) => {
-        if (get(_fields, name)) {
-            if (isUndefined(options.defaultValue)) {
-                setValue(name, cloneObject(get(_defaultValues, name)));
-            }
-            else {
-                setValue(name, options.defaultValue);
-                set(_defaultValues, name, cloneObject(options.defaultValue));
-            }
-            if (!options.keepTouched) {
-                unset(_formState.touchedFields, name);
-            }
-            if (!options.keepDirty) {
-                unset(_formState.dirtyFields, name);
-                _formState.isDirty = options.defaultValue
-                    ? _getDirty(name, cloneObject(get(_defaultValues, name)))
-                    : _getDirty();
-            }
-            if (!options.keepError) {
-                unset(_formState.errors, name);
-                _proxyFormState.isValid && _setValid();
-            }
-            _subjects.state.next({ ..._formState });
-        }
-    };
-    const _reset = (formValues, keepStateOptions = {}) => {
-        const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
-        const cloneUpdatedValues = cloneObject(updatedValues);
-        const isEmptyResetValues = isEmptyObject(formValues);
-        const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;
-        if (!keepStateOptions.keepDefaultValues) {
-            _defaultValues = updatedValues;
-        }
-        if (!keepStateOptions.keepValues) {
-            if (keepStateOptions.keepDirtyValues) {
-                const fieldsToCheck = new Set([
-                    ..._names.mount,
-                    ...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));
-                }
-            }
-            else {
-                if (isWeb && isUndefined(formValues)) {
-                    for (const name of _names.mount) {
-                        const field = get(_fields, name);
-                        if (field && field._f) {
-                            const fieldReference = Array.isArray(field._f.refs)
-                                ? field._f.refs[0]
-                                : field._f.ref;
-                            if (isHTMLElement(fieldReference)) {
-                                const form = fieldReference.closest('form');
-                                if (form) {
-                                    form.reset();
-                                    break;
-                                }
-                            }
-                        }
-                    }
-                }
-                for (const fieldName of _names.mount) {
-                    setValue(fieldName, get(values, fieldName));
-                }
-            }
-            _formValues = cloneObject(values);
-            _subjects.array.next({
-                values: { ...values },
-            });
-            _subjects.state.next({
-                values: { ...values },
-            });
-        }
-        _names = {
-            mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
-            unMount: new Set(),
-            array: new Set(),
-            disabled: new Set(),
-            watch: new Set(),
-            watchAll: false,
-            focus: '',
-        };
-        _state.mount =
-            !_proxyFormState.isValid ||
-                !!keepStateOptions.keepIsValid ||
-                !!keepStateOptions.keepDirtyValues;
-        _state.watch = !!_options.shouldUnregister;
-        _subjects.state.next({
-            submitCount: keepStateOptions.keepSubmitCount
-                ? _formState.submitCount
-                : 0,
-            isDirty: isEmptyResetValues
-                ? false
-                : keepStateOptions.keepDirty
-                    ? _formState.isDirty
-                    : !!(keepStateOptions.keepDefaultValues &&
-                        !deepEqual(formValues, _defaultValues)),
-            isSubmitted: keepStateOptions.keepIsSubmitted
-                ? _formState.isSubmitted
-                : false,
-            dirtyFields: isEmptyResetValues
-                ? {}
-                : keepStateOptions.keepDirtyValues
-                    ? keepStateOptions.keepDefaultValues && _formValues
-                        ? getDirtyFields(_defaultValues, _formValues)
-                        : _formState.dirtyFields
-                    : keepStateOptions.keepDefaultValues && formValues
-                        ? getDirtyFields(_defaultValues, formValues)
-                        : keepStateOptions.keepDirty
-                            ? _formState.dirtyFields
-                            : {},
-            touchedFields: keepStateOptions.keepTouched
-                ? _formState.touchedFields
-                : {},
-            errors: keepStateOptions.keepErrors ? _formState.errors : {},
-            isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful
-                ? _formState.isSubmitSuccessful
-                : false,
-            isSubmitting: false,
-        });
-    };
-    const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
-        ? formValues(_formValues)
-        : formValues, keepStateOptions);
-    const setFocus = (name, options = {}) => {
-        const field = get(_fields, name);
-        const fieldReference = field && field._f;
-        if (fieldReference) {
-            const fieldRef = fieldReference.refs
-                ? fieldReference.refs[0]
-                : fieldReference.ref;
-            if (fieldRef.focus) {
-                fieldRef.focus();
-                options.shouldSelect &&
-                    isFunction(fieldRef.select) &&
-                    fieldRef.select();
-            }
-        }
-    };
-    const _setFormState = (updatedFormState) => {
-        _formState = {
-            ..._formState,
-            ...updatedFormState,
-        };
-    };
-    const _resetDefaultValues = () => isFunction(_options.defaultValues) &&
-        _options.defaultValues().then((values) => {
-            reset(values, _options.resetOptions);
-            _subjects.state.next({
-                isLoading: false,
-            });
-        });
-    const methods = {
-        control: {
-            register,
-            unregister,
-            getFieldState,
-            handleSubmit,
-            setError,
-            _subscribe,
-            _runSchema,
-            _getWatch,
-            _getDirty,
-            _setValid,
-            _setFieldArray,
-            _setDisabledField,
-            _setErrors,
-            _getFieldArray,
-            _reset,
-            _resetDefaultValues,
-            _removeUnmounted,
-            _disableForm,
-            _subjects,
-            _proxyFormState,
-            get _fields() {
-                return _fields;
-            },
-            get _formValues() {
-                return _formValues;
-            },
-            get _state() {
-                return _state;
-            },
-            set _state(value) {
-                _state = value;
-            },
-            get _defaultValues() {
-                return _defaultValues;
-            },
-            get _names() {
-                return _names;
-            },
-            set _names(value) {
-                _names = value;
-            },
-            get _formState() {
-                return _formState;
-            },
-            get _options() {
-                return _options;
-            },
-            set _options(value) {
-                _options = {
-                    ..._options,
-                    ...value,
-                };
-            },
-        },
-        subscribe,
-        trigger,
-        register,
-        handleSubmit,
-        watch,
-        setValue,
-        getValues,
-        reset,
-        resetField,
-        clearErrors,
-        unregister,
-        setError,
-        setFocus,
-        getFieldState,
-    };
-    return {
-        ...methods,
-        formControl: methods,
-    };
-}
-
-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;
-        return (c == 'x' ? r : (r & 0x3) | 0x8).toString(16);
-    });
-};
-
-var getFocusFieldName = (name, index, options = {}) => options.shouldFocus || isUndefined(options.shouldFocus)
-    ? options.focusName ||
-        `${name}.${isUndefined(options.focusIndex) ? index : options.focusIndex}.`
-    : '';
-
-var appendAt = (data, value) => [
-    ...data,
-    ...convertToArrayPayload(value),
-];
-
-var fillEmptyArray = (value) => Array.isArray(value) ? value.map(() => undefined) : undefined;
-
-function insert(data, index, value) {
-    return [
-        ...data.slice(0, index),
-        ...convertToArrayPayload(value),
-        ...data.slice(index),
-    ];
-}
-
-var moveArrayAt = (data, from, to) => {
-    if (!Array.isArray(data)) {
-        return [];
-    }
-    if (isUndefined(data[to])) {
-        data[to] = undefined;
-    }
-    data.splice(to, 0, data.splice(from, 1)[0]);
-    return data;
-};
-
-var prependAt = (data, value) => [
-    ...convertToArrayPayload(value),
-    ...convertToArrayPayload(data),
-];
-
-function removeAtIndexes(data, indexes) {
-    let i = 0;
-    const temp = [...data];
-    for (const index of indexes) {
-        temp.splice(index - i, 1);
-        i++;
-    }
-    return compact(temp).length ? temp : [];
-}
-var removeArrayAt = (data, index) => isUndefined(index)
-    ? []
-    : removeAtIndexes(data, convertToArrayPayload(index).sort((a, b) => a - b));
-
-var swapArrayAt = (data, indexA, indexB) => {
-    [data[indexA], data[indexB]] = [data[indexB], data[indexA]];
-};
-
-var updateAt = (fieldValues, index, value) => {
-    fieldValues[index] = value;
-    return fieldValues;
-};
-
-/**
- * A custom hook that exposes convenient methods to perform operations with a list of dynamic inputs that need to be appended, updated, removed etc. • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn) • [Video](https://youtu.be/4MrbfGSFY2A)
- *
- * @remarks
- * [API](https://react-hook-form.com/docs/usefieldarray) • [Demo](https://codesandbox.io/s/react-hook-form-usefieldarray-ssugn)
- *
- * @param props - useFieldArray props
- *
- * @returns methods - functions to manipulate with the Field Arrays (dynamic inputs) {@link UseFieldArrayReturn}
- *
- * @example
- * ```tsx
- * function App() {
- *   const { register, control, handleSubmit, reset, trigger, setError } = useForm({
- *     defaultValues: {
- *       test: []
- *     }
- *   });
- *   const { fields, append } = useFieldArray({
- *     control,
- *     name: "test"
- *   });
- *
- *   return (
- *     <form onSubmit={handleSubmit(data => console.log(data))}>
- *       {fields.map((item, index) => (
- *          <input key={item.id} {...register(`test.${index}.firstName`)}  />
- *       ))}
- *       <button type="button" onClick={() => append({ firstName: "bill" })}>
- *         append
- *       </button>
- *       <input type="submit" />
- *     </form>
- *   );
- * }
- * ```
- */
-function useFieldArray(props) {
-    const methods = useFormContext();
-    const { control = methods.control, name, keyName = 'id', shouldUnregister, rules, } = props;
-    const [fields, setFields] = React__default.useState(control._getFieldArray(name));
-    const ids = React__default.useRef(control._getFieldArray(name).map(generateId));
-    const _fieldIds = React__default.useRef(fields);
-    const _name = React__default.useRef(name);
-    const _actioned = React__default.useRef(false);
-    _name.current = name;
-    _fieldIds.current = fields;
-    control._names.array.add(name);
-    rules &&
-        control.register(name, rules);
-    React__default.useEffect(() => control._subjects.array.subscribe({
-        next: ({ values, name: fieldArrayName, }) => {
-            if (fieldArrayName === _name.current || !fieldArrayName) {
-                const fieldValues = get(values, _name.current);
-                if (Array.isArray(fieldValues)) {
-                    setFields(fieldValues);
-                    ids.current = fieldValues.map(generateId);
+    const _getFieldArray = (name) => compact(get(_state.mount ? _formValues : _defaultValues, name, _options.shouldUnregister ? get(_defaultValues, name, []) : []));
+    const setFieldValue = (name, value, options = {}) => {
+        const field = get(_fields, name);
+        let fieldValue = value;
+        if (field) {
+            const fieldReference = field._f;
+            if (fieldReference) {
+                !fieldReference.disabled &&
+                    set(_formValues, name, getFieldValueAs(value, fieldReference));
+                fieldValue =
+                    isHTMLElement(fieldReference.ref) && isNullOrUndefined(value)
+                        ? ''
+                        : value;
+                if (isMultipleSelect(fieldReference.ref)) {
+                    [...fieldReference.ref.options].forEach((optionRef) => (optionRef.selected = fieldValue.includes(optionRef.value)));
+                }
+                else if (fieldReference.refs) {
+                    if (isCheckBoxInput(fieldReference.ref)) {
+                        fieldReference.refs.length > 1
+                            ? fieldReference.refs.forEach((checkboxRef) => (!checkboxRef.defaultChecked || !checkboxRef.disabled) &&
+                                (checkboxRef.checked = Array.isArray(fieldValue)
+                                    ? !!fieldValue.find((data) => data === checkboxRef.value)
+                                    : fieldValue === checkboxRef.value))
+                            : fieldReference.refs[0] &&
+                                (fieldReference.refs[0].checked = !!fieldValue);
+                    }
+                    else {
+                        fieldReference.refs.forEach((radioRef) => (radioRef.checked = radioRef.value === fieldValue));
+                    }
+                }
+                else if (isFileInput(fieldReference.ref)) {
+                    fieldReference.ref.value = '';
+                }
+                else {
+                    fieldReference.ref.value = fieldValue;
+                    if (!fieldReference.ref.type) {
+                        _subjects.values.next({
+                            name,
+                            values: { ..._formValues },
+                        });
+                    }
                 }
             }
-        },
-    }).unsubscribe, [control]);
-    const updateValues = React__default.useCallback((updatedFieldArrayValues) => {
-        _actioned.current = true;
-        control._setFieldArray(name, updatedFieldArrayValues);
-    }, [control, name]);
-    const append = (value, options) => {
-        const appendValue = convertToArrayPayload(cloneObject(value));
-        const updatedFieldArrayValues = appendAt(control._getFieldArray(name), appendValue);
-        control._names.focus = getFocusFieldName(name, updatedFieldArrayValues.length - 1, options);
-        ids.current = appendAt(ids.current, appendValue.map(generateId));
-        updateValues(updatedFieldArrayValues);
-        setFields(updatedFieldArrayValues);
-        control._setFieldArray(name, updatedFieldArrayValues, appendAt, {
-            argA: fillEmptyArray(value),
+        }
+        (options.shouldDirty || options.shouldTouch) &&
+            updateTouchAndDirty(name, fieldValue, options.shouldTouch, options.shouldDirty, true);
+        options.shouldValidate && trigger(name);
+    };
+    const setValues = (name, value, options) => {
+        for (const fieldKey in value) {
+            const fieldValue = value[fieldKey];
+            const fieldName = `${name}.${fieldKey}`;
+            const field = get(_fields, fieldName);
+            (_names.array.has(name) ||
+                isObject(fieldValue) ||
+                (field && !field._f)) &&
+                !isDateObject(fieldValue)
+                ? setValues(fieldName, fieldValue, options)
+                : setFieldValue(fieldName, fieldValue, options);
+        }
+    };
+    const setValue = (name, value, options = {}) => {
+        const field = get(_fields, name);
+        const isFieldArray = _names.array.has(name);
+        const cloneValue = cloneObject(value);
+        set(_formValues, name, cloneValue);
+        if (isFieldArray) {
+            _subjects.array.next({
+                name,
+                values: { ..._formValues },
+            });
+            if ((_proxyFormState.isDirty || _proxyFormState.dirtyFields) &&
+                options.shouldDirty) {
+                _subjects.state.next({
+                    name,
+                    dirtyFields: getDirtyFields(_defaultValues, _formValues),
+                    isDirty: _getDirty(name, cloneValue),
+                });
+            }
+        }
+        else {
+            field && !field._f && !isNullOrUndefined(cloneValue)
+                ? setValues(name, cloneValue, options)
+                : setFieldValue(name, cloneValue, options);
+        }
+        isWatched(name, _names) && _subjects.state.next({ ..._formState });
+        _subjects.values.next({
+            name: _state.mount ? name : undefined,
+            values: { ..._formValues },
         });
     };
-    const prepend = (value, options) => {
-        const prependValue = convertToArrayPayload(cloneObject(value));
-        const updatedFieldArrayValues = prependAt(control._getFieldArray(name), prependValue);
-        control._names.focus = getFocusFieldName(name, 0, options);
-        ids.current = prependAt(ids.current, prependValue.map(generateId));
-        updateValues(updatedFieldArrayValues);
-        setFields(updatedFieldArrayValues);
-        control._setFieldArray(name, updatedFieldArrayValues, prependAt, {
-            argA: fillEmptyArray(value),
+    const onChange = async (event) => {
+        _state.mount = true;
+        const target = event.target;
+        let name = target.name;
+        let isFieldValueUpdated = true;
+        const field = get(_fields, name);
+        const getCurrentFieldValue = () => target.type ? getFieldValue(field._f) : getEventValue(event);
+        const _updateIsFieldValueUpdated = (fieldValue) => {
+            isFieldValueUpdated =
+                Number.isNaN(fieldValue) ||
+                    (isDateObject(fieldValue) && isNaN(fieldValue.getTime())) ||
+                    deepEqual(fieldValue, get(_formValues, name, fieldValue));
+        };
+        if (field) {
+            let error;
+            let isValid;
+            const fieldValue = getCurrentFieldValue();
+            const isBlurEvent = event.type === EVENTS.BLUR || event.type === EVENTS.FOCUS_OUT;
+            const shouldSkipValidation = (!hasValidation(field._f) &&
+                !_options.resolver &&
+                !get(_formState.errors, name) &&
+                !field._f.deps) ||
+                skipValidation(isBlurEvent, get(_formState.touchedFields, name), _formState.isSubmitted, validationModeAfterSubmit, validationModeBeforeSubmit);
+            const watched = isWatched(name, _names, isBlurEvent);
+            set(_formValues, name, fieldValue);
+            if (isBlurEvent) {
+                field._f.onBlur && field._f.onBlur(event);
+                delayErrorCallback && delayErrorCallback(0);
+            }
+            else if (field._f.onChange) {
+                field._f.onChange(event);
+            }
+            const fieldState = updateTouchAndDirty(name, fieldValue, isBlurEvent, false);
+            const shouldRender = !isEmptyObject(fieldState) || watched;
+            !isBlurEvent &&
+                _subjects.values.next({
+                    name,
+                    type: event.type,
+                    values: { ..._formValues },
+                });
+            if (shouldSkipValidation) {
+                if (_proxyFormState.isValid) {
+                    if (_options.mode === 'onBlur' && isBlurEvent) {
+                        _updateValid();
+                    }
+                    else if (!isBlurEvent) {
+                        _updateValid();
+                    }
+                }
+                return (shouldRender &&
+                    _subjects.state.next({ name, ...(watched ? {} : fieldState) }));
+            }
+            !isBlurEvent && watched && _subjects.state.next({ ..._formState });
+            if (_options.resolver) {
+                const { errors } = await _executeSchema([name]);
+                _updateIsFieldValueUpdated(fieldValue);
+                if (isFieldValueUpdated) {
+                    const previousErrorLookupResult = schemaErrorLookup(_formState.errors, _fields, name);
+                    const errorLookupResult = schemaErrorLookup(errors, _fields, previousErrorLookupResult.name || name);
+                    error = errorLookupResult.error;
+                    name = errorLookupResult.name;
+                    isValid = isEmptyObject(errors);
+                }
+            }
+            else {
+                _updateIsValidating([name], true);
+                error = (await validateField(field, _names.disabled, _formValues, shouldDisplayAllAssociatedErrors, _options.shouldUseNativeValidation))[name];
+                _updateIsValidating([name]);
+                _updateIsFieldValueUpdated(fieldValue);
+                if (isFieldValueUpdated) {
+                    if (error) {
+                        isValid = false;
+                    }
+                    else if (_proxyFormState.isValid) {
+                        isValid = await executeBuiltInValidation(_fields, true);
+                    }
+                }
+            }
+            if (isFieldValueUpdated) {
+                field._f.deps &&
+                    trigger(field._f.deps);
+                shouldRenderByError(name, isValid, error, fieldState);
+            }
+        }
+    };
+    const _focusInput = (ref, key) => {
+        if (get(_formState.errors, key) && ref.focus) {
+            ref.focus();
+            return 1;
+        }
+        return;
+    };
+    const trigger = async (name, options = {}) => {
+        let isValid;
+        let validationResult;
+        const fieldNames = convertToArrayPayload(name);
+        if (_options.resolver) {
+            const errors = await executeSchemaAndUpdateState(isUndefined(name) ? name : fieldNames);
+            isValid = isEmptyObject(errors);
+            validationResult = name
+                ? !fieldNames.some((name) => get(errors, name))
+                : isValid;
+        }
+        else if (name) {
+            validationResult = (await Promise.all(fieldNames.map(async (fieldName) => {
+                const field = get(_fields, fieldName);
+                return await executeBuiltInValidation(field && field._f ? { [fieldName]: field } : field);
+            }))).every(Boolean);
+            !(!validationResult && !_formState.isValid) && _updateValid();
+        }
+        else {
+            validationResult = isValid = await executeBuiltInValidation(_fields);
+        }
+        _subjects.state.next({
+            ...(!isString(name) ||
+                (_proxyFormState.isValid && isValid !== _formState.isValid)
+                ? {}
+                : { name }),
+            ...(_options.resolver || !name ? { isValid } : {}),
+            errors: _formState.errors,
         });
+        options.shouldFocus &&
+            !validationResult &&
+            iterateFieldsByAction(_fields, _focusInput, name ? fieldNames : _names.mount);
+        return validationResult;
     };
-    const remove = (index) => {
-        const updatedFieldArrayValues = removeArrayAt(control._getFieldArray(name), index);
-        ids.current = removeArrayAt(ids.current, index);
-        updateValues(updatedFieldArrayValues);
-        setFields(updatedFieldArrayValues);
-        !Array.isArray(get(control._fields, name)) &&
-            set(control._fields, name, undefined);
-        control._setFieldArray(name, updatedFieldArrayValues, removeArrayAt, {
-            argA: index,
+    const getValues = (fieldNames) => {
+        const values = {
+            ...(_state.mount ? _formValues : _defaultValues),
+        };
+        return isUndefined(fieldNames)
+            ? values
+            : isString(fieldNames)
+                ? get(values, fieldNames)
+                : fieldNames.map((name) => get(values, name));
+    };
+    const getFieldState = (name, formState) => ({
+        invalid: !!get((formState || _formState).errors, name),
+        isDirty: !!get((formState || _formState).dirtyFields, name),
+        error: get((formState || _formState).errors, name),
+        isValidating: !!get(_formState.validatingFields, name),
+        isTouched: !!get((formState || _formState).touchedFields, name),
+    });
+    const clearErrors = (name) => {
+        name &&
+            convertToArrayPayload(name).forEach((inputName) => unset(_formState.errors, inputName));
+        _subjects.state.next({
+            errors: name ? _formState.errors : {},
         });
     };
-    const insert$1 = (index, value, options) => {
-        const insertValue = convertToArrayPayload(cloneObject(value));
-        const updatedFieldArrayValues = insert(control._getFieldArray(name), index, insertValue);
-        control._names.focus = getFocusFieldName(name, index, options);
-        ids.current = insert(ids.current, index, insertValue.map(generateId));
-        updateValues(updatedFieldArrayValues);
-        setFields(updatedFieldArrayValues);
-        control._setFieldArray(name, updatedFieldArrayValues, insert, {
-            argA: index,
-            argB: fillEmptyArray(value),
+    const setError = (name, error, options) => {
+        const ref = (get(_fields, name, { _f: {} })._f || {}).ref;
+        const currentError = get(_formState.errors, name) || {};
+        // Don't override existing error messages elsewhere in the object tree.
+        const { ref: currentRef, message, type, ...restOfErrorTree } = currentError;
+        set(_formState.errors, name, {
+            ...restOfErrorTree,
+            ...error,
+            ref,
+        });
+        _subjects.state.next({
+            name,
+            errors: _formState.errors,
+            isValid: false,
         });
+        options && options.shouldFocus && ref && ref.focus && ref.focus();
     };
-    const swap = (indexA, indexB) => {
-        const updatedFieldArrayValues = control._getFieldArray(name);
-        swapArrayAt(updatedFieldArrayValues, indexA, indexB);
-        swapArrayAt(ids.current, indexA, indexB);
-        updateValues(updatedFieldArrayValues);
-        setFields(updatedFieldArrayValues);
-        control._setFieldArray(name, updatedFieldArrayValues, swapArrayAt, {
-            argA: indexA,
-            argB: indexB,
-        }, false);
-    };
-    const move = (from, to) => {
-        const updatedFieldArrayValues = control._getFieldArray(name);
-        moveArrayAt(updatedFieldArrayValues, from, to);
-        moveArrayAt(ids.current, from, to);
-        updateValues(updatedFieldArrayValues);
-        setFields(updatedFieldArrayValues);
-        control._setFieldArray(name, updatedFieldArrayValues, moveArrayAt, {
-            argA: from,
-            argB: to,
-        }, false);
-    };
-    const update = (index, value) => {
-        const updateValue = cloneObject(value);
-        const updatedFieldArrayValues = updateAt(control._getFieldArray(name), index, updateValue);
-        ids.current = [...updatedFieldArrayValues].map((item, i) => !item || i === index ? generateId() : ids.current[i]);
-        updateValues(updatedFieldArrayValues);
-        setFields([...updatedFieldArrayValues]);
-        control._setFieldArray(name, updatedFieldArrayValues, updateAt, {
-            argA: index,
-            argB: updateValue,
-        }, true, false);
+    const watch = (name, defaultValue) => isFunction(name)
+        ? _subjects.values.subscribe({
+            next: (payload) => name(_getWatch(undefined, defaultValue), payload),
+        })
+        : _getWatch(name, defaultValue, true);
+    const unregister = (name, options = {}) => {
+        for (const fieldName of name ? convertToArrayPayload(name) : _names.mount) {
+            _names.mount.delete(fieldName);
+            _names.array.delete(fieldName);
+            if (!options.keepValue) {
+                unset(_fields, fieldName);
+                unset(_formValues, fieldName);
+            }
+            !options.keepError && unset(_formState.errors, fieldName);
+            !options.keepDirty && unset(_formState.dirtyFields, fieldName);
+            !options.keepTouched && unset(_formState.touchedFields, fieldName);
+            !options.keepIsValidating &&
+                unset(_formState.validatingFields, fieldName);
+            !_options.shouldUnregister &&
+                !options.keepDefaultValue &&
+                unset(_defaultValues, fieldName);
+        }
+        _subjects.values.next({
+            values: { ..._formValues },
+        });
+        _subjects.state.next({
+            ..._formState,
+            ...(!options.keepDirty ? {} : { isDirty: _getDirty() }),
+        });
+        !options.keepIsValid && _updateValid();
     };
-    const replace = (value) => {
-        const updatedFieldArrayValues = convertToArrayPayload(cloneObject(value));
-        ids.current = updatedFieldArrayValues.map(generateId);
-        updateValues([...updatedFieldArrayValues]);
-        setFields([...updatedFieldArrayValues]);
-        control._setFieldArray(name, [...updatedFieldArrayValues], (data) => data, {}, true, false);
+    const _updateDisabledField = ({ disabled, name, field, fields, }) => {
+        if ((isBoolean(disabled) && _state.mount) ||
+            !!disabled ||
+            _names.disabled.has(name)) {
+            disabled ? _names.disabled.add(name) : _names.disabled.delete(name);
+            updateTouchAndDirty(name, getFieldValue(field ? field._f : get(fields, name)._f), false, false, true);
+        }
     };
-    React__default.useEffect(() => {
-        control._state.action = false;
-        isWatched(name, control._names) &&
-            control._subjects.state.next({
-                ...control._formState,
+    const register = (name, options = {}) => {
+        let field = get(_fields, name);
+        const disabledIsDefined = isBoolean(options.disabled) || isBoolean(_options.disabled);
+        set(_fields, name, {
+            ...(field || {}),
+            _f: {
+                ...(field && field._f ? field._f : { ref: { name } }),
+                name,
+                mount: true,
+                ...options,
+            },
+        });
+        _names.mount.add(name);
+        if (field) {
+            _updateDisabledField({
+                field,
+                disabled: isBoolean(options.disabled)
+                    ? options.disabled
+                    : _options.disabled,
+                name,
             });
-        if (_actioned.current &&
-            (!getValidationModes(control._options.mode).isOnSubmit ||
-                control._formState.isSubmitted) &&
-            !getValidationModes(control._options.reValidateMode).isOnSubmit) {
-            if (control._options.resolver) {
-                control._runSchema([name]).then((result) => {
-                    const error = get(result.errors, name);
-                    const existingError = get(control._formState.errors, name);
-                    if (existingError
-                        ? (!error && existingError.type) ||
-                            (error &&
-                                (existingError.type !== error.type ||
-                                    existingError.message !== error.message))
-                        : error && error.type) {
-                        error
-                            ? set(control._formState.errors, name, error)
-                            : unset(control._formState.errors, name);
-                        control._subjects.state.next({
-                            errors: control._formState.errors,
+        }
+        else {
+            updateValidAndValue(name, true, options.value);
+        }
+        return {
+            ...(disabledIsDefined
+                ? { disabled: options.disabled || _options.disabled }
+                : {}),
+            ...(_options.progressive
+                ? {
+                    required: !!options.required,
+                    min: getRuleValue(options.min),
+                    max: getRuleValue(options.max),
+                    minLength: getRuleValue(options.minLength),
+                    maxLength: getRuleValue(options.maxLength),
+                    pattern: getRuleValue(options.pattern),
+                }
+                : {}),
+            name,
+            onChange,
+            onBlur: onChange,
+            ref: (ref) => {
+                if (ref) {
+                    register(name, options);
+                    field = get(_fields, name);
+                    const fieldRef = isUndefined(ref.value)
+                        ? ref.querySelectorAll
+                            ? ref.querySelectorAll('input,select,textarea')[0] || ref
+                            : ref
+                        : ref;
+                    const radioOrCheckbox = isRadioOrCheckbox(fieldRef);
+                    const refs = field._f.refs || [];
+                    if (radioOrCheckbox
+                        ? refs.find((option) => option === fieldRef)
+                        : fieldRef === field._f.ref) {
+                        return;
+                    }
+                    set(_fields, name, {
+                        _f: {
+                            ...field._f,
+                            ...(radioOrCheckbox
+                                ? {
+                                    refs: [
+                                        ...refs.filter(live),
+                                        fieldRef,
+                                        ...(Array.isArray(get(_defaultValues, name)) ? [{}] : []),
+                                    ],
+                                    ref: { type: fieldRef.type, name },
+                                }
+                                : { ref: fieldRef }),
+                        },
+                    });
+                    updateValidAndValue(name, false, undefined, fieldRef);
+                }
+                else {
+                    field = get(_fields, name, {});
+                    if (field._f) {
+                        field._f.mount = false;
+                    }
+                    (_options.shouldUnregister || options.shouldUnregister) &&
+                        !(isNameInFieldArray(_names.array, name) && _state.action) &&
+                        _names.unMount.add(name);
+                }
+            },
+        };
+    };
+    const _focusError = () => _options.shouldFocusError &&
+        iterateFieldsByAction(_fields, _focusInput, _names.mount);
+    const _disableForm = (disabled) => {
+        if (isBoolean(disabled)) {
+            _subjects.state.next({ disabled });
+            iterateFieldsByAction(_fields, (ref, name) => {
+                const currentField = get(_fields, name);
+                if (currentField) {
+                    ref.disabled = currentField._f.disabled || disabled;
+                    if (Array.isArray(currentField._f.refs)) {
+                        currentField._f.refs.forEach((inputRef) => {
+                            inputRef.disabled = currentField._f.disabled || disabled;
                         });
                     }
-                });
+                }
+            }, 0, false);
+        }
+    };
+    const handleSubmit = (onValid, onInvalid) => async (e) => {
+        let onValidError = undefined;
+        if (e) {
+            e.preventDefault && e.preventDefault();
+            e.persist && e.persist();
+        }
+        let fieldValues = cloneObject(_formValues);
+        if (_names.disabled.size) {
+            for (const name of _names.disabled) {
+                set(fieldValues, name, undefined);
+            }
+        }
+        _subjects.state.next({
+            isSubmitting: true,
+        });
+        if (_options.resolver) {
+            const { errors, values } = await _executeSchema();
+            _formState.errors = errors;
+            fieldValues = values;
+        }
+        else {
+            await executeBuiltInValidation(_fields);
+        }
+        unset(_formState.errors, 'root');
+        if (isEmptyObject(_formState.errors)) {
+            _subjects.state.next({
+                errors: {},
+            });
+            try {
+                await onValid(fieldValues, e);
+            }
+            catch (error) {
+                onValidError = error;
+            }
+        }
+        else {
+            if (onInvalid) {
+                await onInvalid({ ..._formState.errors }, e);
+            }
+            _focusError();
+            setTimeout(_focusError);
+        }
+        _subjects.state.next({
+            isSubmitted: true,
+            isSubmitting: false,
+            isSubmitSuccessful: isEmptyObject(_formState.errors) && !onValidError,
+            submitCount: _formState.submitCount + 1,
+            errors: _formState.errors,
+        });
+        if (onValidError) {
+            throw onValidError;
+        }
+    };
+    const resetField = (name, options = {}) => {
+        if (get(_fields, name)) {
+            if (isUndefined(options.defaultValue)) {
+                setValue(name, cloneObject(get(_defaultValues, name)));
+            }
+            else {
+                setValue(name, options.defaultValue);
+                set(_defaultValues, name, cloneObject(options.defaultValue));
+            }
+            if (!options.keepTouched) {
+                unset(_formState.touchedFields, name);
+            }
+            if (!options.keepDirty) {
+                unset(_formState.dirtyFields, name);
+                _formState.isDirty = options.defaultValue
+                    ? _getDirty(name, cloneObject(get(_defaultValues, name)))
+                    : _getDirty();
+            }
+            if (!options.keepError) {
+                unset(_formState.errors, name);
+                _proxyFormState.isValid && _updateValid();
+            }
+            _subjects.state.next({ ..._formState });
+        }
+    };
+    const _reset = (formValues, keepStateOptions = {}) => {
+        const updatedValues = formValues ? cloneObject(formValues) : _defaultValues;
+        const cloneUpdatedValues = cloneObject(updatedValues);
+        const isEmptyResetValues = isEmptyObject(formValues);
+        const values = isEmptyResetValues ? _defaultValues : cloneUpdatedValues;
+        if (!keepStateOptions.keepDefaultValues) {
+            _defaultValues = updatedValues;
+        }
+        if (!keepStateOptions.keepValues) {
+            if (keepStateOptions.keepDirtyValues) {
+                const fieldsToCheck = new Set([
+                    ..._names.mount,
+                    ...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));
+                }
             }
             else {
-                const field = get(control._fields, name);
-                if (field &&
-                    field._f &&
-                    !(getValidationModes(control._options.reValidateMode).isOnSubmit &&
-                        getValidationModes(control._options.mode).isOnSubmit)) {
-                    validateField(field, control._names.disabled, control._formValues, control._options.criteriaMode === VALIDATION_MODE.all, control._options.shouldUseNativeValidation, true).then((error) => !isEmptyObject(error) &&
-                        control._subjects.state.next({
-                            errors: updateFieldArrayRootError(control._formState.errors, error, name),
-                        }));
+                if (isWeb && isUndefined(formValues)) {
+                    for (const name of _names.mount) {
+                        const field = get(_fields, name);
+                        if (field && field._f) {
+                            const fieldReference = Array.isArray(field._f.refs)
+                                ? field._f.refs[0]
+                                : field._f.ref;
+                            if (isHTMLElement(fieldReference)) {
+                                const form = fieldReference.closest('form');
+                                if (form) {
+                                    form.reset();
+                                    break;
+                                }
+                            }
+                        }
+                    }
                 }
+                _fields = {};
             }
+            _formValues = _options.shouldUnregister
+                ? keepStateOptions.keepDefaultValues
+                    ? cloneObject(_defaultValues)
+                    : {}
+                : cloneObject(values);
+            _subjects.array.next({
+                values: { ...values },
+            });
+            _subjects.values.next({
+                values: { ...values },
+            });
         }
-        control._subjects.state.next({
-            name,
-            values: cloneObject(control._formValues),
+        _names = {
+            mount: keepStateOptions.keepDirtyValues ? _names.mount : new Set(),
+            unMount: new Set(),
+            array: new Set(),
+            disabled: new Set(),
+            watch: new Set(),
+            watchAll: false,
+            focus: '',
+        };
+        _state.mount =
+            !_proxyFormState.isValid ||
+                !!keepStateOptions.keepIsValid ||
+                !!keepStateOptions.keepDirtyValues;
+        _state.watch = !!_options.shouldUnregister;
+        _subjects.state.next({
+            submitCount: keepStateOptions.keepSubmitCount
+                ? _formState.submitCount
+                : 0,
+            isDirty: isEmptyResetValues
+                ? false
+                : keepStateOptions.keepDirty
+                    ? _formState.isDirty
+                    : !!(keepStateOptions.keepDefaultValues &&
+                        !deepEqual(formValues, _defaultValues)),
+            isSubmitted: keepStateOptions.keepIsSubmitted
+                ? _formState.isSubmitted
+                : false,
+            dirtyFields: isEmptyResetValues
+                ? {}
+                : keepStateOptions.keepDirtyValues
+                    ? keepStateOptions.keepDefaultValues && _formValues
+                        ? getDirtyFields(_defaultValues, _formValues)
+                        : _formState.dirtyFields
+                    : keepStateOptions.keepDefaultValues && formValues
+                        ? getDirtyFields(_defaultValues, formValues)
+                        : keepStateOptions.keepDirty
+                            ? _formState.dirtyFields
+                            : {},
+            touchedFields: keepStateOptions.keepTouched
+                ? _formState.touchedFields
+                : {},
+            errors: keepStateOptions.keepErrors ? _formState.errors : {},
+            isSubmitSuccessful: keepStateOptions.keepIsSubmitSuccessful
+                ? _formState.isSubmitSuccessful
+                : false,
+            isSubmitting: false,
         });
-        control._names.focus &&
-            iterateFieldsByAction(control._fields, (ref, key) => {
-                if (control._names.focus &&
-                    key.startsWith(control._names.focus) &&
-                    ref.focus) {
-                    ref.focus();
-                    return 1;
-                }
-                return;
-            });
-        control._names.focus = '';
-        control._setValid();
-        _actioned.current = false;
-    }, [fields, name, control]);
-    React__default.useEffect(() => {
-        !get(control._formValues, name) && control._setFieldArray(name);
-        return () => {
-            const updateMounted = (name, value) => {
-                const field = get(control._fields, name);
-                if (field && field._f) {
-                    field._f.mount = value;
-                }
-            };
-            control._options.shouldUnregister || shouldUnregister
-                ? control.unregister(name)
-                : updateMounted(name, false);
+    };
+    const reset = (formValues, keepStateOptions) => _reset(isFunction(formValues)
+        ? formValues(_formValues)
+        : formValues, keepStateOptions);
+    const setFocus = (name, options = {}) => {
+        const field = get(_fields, name);
+        const fieldReference = field && field._f;
+        if (fieldReference) {
+            const fieldRef = fieldReference.refs
+                ? fieldReference.refs[0]
+                : fieldReference.ref;
+            if (fieldRef.focus) {
+                fieldRef.focus();
+                options.shouldSelect &&
+                    isFunction(fieldRef.select) &&
+                    fieldRef.select();
+            }
+        }
+    };
+    const _updateFormState = (updatedFormState) => {
+        _formState = {
+            ..._formState,
+            ...updatedFormState,
         };
-    }, [name, control, keyName, shouldUnregister]);
+    };
+    const _resetDefaultValues = () => isFunction(_options.defaultValues) &&
+        _options.defaultValues().then((values) => {
+            reset(values, _options.resetOptions);
+            _subjects.state.next({
+                isLoading: false,
+            });
+        });
     return {
-        swap: React__default.useCallback(swap, [updateValues, name, control]),
-        move: React__default.useCallback(move, [updateValues, name, control]),
-        prepend: React__default.useCallback(prepend, [updateValues, name, control]),
-        append: React__default.useCallback(append, [updateValues, name, control]),
-        remove: React__default.useCallback(remove, [updateValues, name, control]),
-        insert: React__default.useCallback(insert$1, [updateValues, name, control]),
-        update: React__default.useCallback(update, [updateValues, name, control]),
-        replace: React__default.useCallback(replace, [updateValues, name, control]),
-        fields: React__default.useMemo(() => fields.map((field, index) => ({
-            ...field,
-            [keyName]: ids.current[index] || generateId(),
-        })), [fields, keyName]),
+        control: {
+            register,
+            unregister,
+            getFieldState,
+            handleSubmit,
+            setError,
+            _executeSchema,
+            _getWatch,
+            _getDirty,
+            _updateValid,
+            _removeUnmounted,
+            _updateFieldArray,
+            _updateDisabledField,
+            _getFieldArray,
+            _reset,
+            _resetDefaultValues,
+            _updateFormState,
+            _disableForm,
+            _subjects,
+            _proxyFormState,
+            _setErrors,
+            get _fields() {
+                return _fields;
+            },
+            get _formValues() {
+                return _formValues;
+            },
+            get _state() {
+                return _state;
+            },
+            set _state(value) {
+                _state = value;
+            },
+            get _defaultValues() {
+                return _defaultValues;
+            },
+            get _names() {
+                return _names;
+            },
+            set _names(value) {
+                _names = value;
+            },
+            get _formState() {
+                return _formState;
+            },
+            set _formState(value) {
+                _formState = value;
+            },
+            get _options() {
+                return _options;
+            },
+            set _options(value) {
+                _options = {
+                    ..._options,
+                    ...value,
+                };
+            },
+        },
+        trigger,
+        register,
+        handleSubmit,
+        watch,
+        setValue,
+        getValues,
+        reset,
+        resetField,
+        clearErrors,
+        unregister,
+        setError,
+        setFocus,
+        getFieldState,
     };
 }
 
@@ -2634,55 +2599,27 @@ function useForm(props = {}) {
         validatingFields: {},
         errors: props.errors || {},
         disabled: props.disabled || false,
-        isReady: false,
         defaultValues: isFunction(props.defaultValues)
             ? undefined
             : props.defaultValues,
     });
     if (!_formControl.current) {
         _formControl.current = {
-            ...(props.formControl ? props.formControl : createFormControl(props)),
+            ...createFormControl(props),
             formState,
         };
-        if (props.formControl &&
-            props.defaultValues &&
-            !isFunction(props.defaultValues)) {
-            props.formControl.reset(props.defaultValues, props.resetOptions);
-        }
     }
     const control = _formControl.current.control;
     control._options = props;
-    useIsomorphicLayoutEffect(() => {
-        const sub = control._subscribe({
-            formState: control._proxyFormState,
-            callback: () => updateFormState({ ...control._formState }),
-            reRenderRoot: true,
-        });
-        updateFormState((data) => ({
-            ...data,
-            isReady: true,
-        }));
-        control._formState.isReady = true;
-        return sub;
-    }, [control]);
+    useSubscribe({
+        subject: control._subjects.state,
+        next: (value) => {
+            if (shouldRenderFormState(value, control._proxyFormState, control._updateFormState, true)) {
+                updateFormState({ ...control._formState });
+            }
+        },
+    });
     React__default.useEffect(() => control._disableForm(props.disabled), [control, props.disabled]);
-    React__default.useEffect(() => {
-        if (props.mode) {
-            control._options.mode = props.mode;
-        }
-        if (props.reValidateMode) {
-            control._options.reValidateMode = props.reValidateMode;
-        }
-        if (props.errors && !isEmptyObject(props.errors)) {
-            control._setErrors(props.errors);
-        }
-    }, [control, props.errors, props.mode, props.reValidateMode]);
-    React__default.useEffect(() => {
-        props.shouldUnregister &&
-            control._subjects.state.next({
-                values: control._getWatch(),
-            });
-    }, [control, props.shouldUnregister]);
     React__default.useEffect(() => {
         if (control._proxyFormState.isDirty) {
             const isDirty = control._getDirty();
@@ -2702,10 +2639,15 @@ function useForm(props = {}) {
         else {
             control._resetDefaultValues();
         }
-    }, [control, props.values]);
+    }, [props.values, control]);
+    React__default.useEffect(() => {
+        if (props.errors) {
+            control._setErrors(props.errors);
+        }
+    }, [props.errors, control]);
     React__default.useEffect(() => {
         if (!control._state.mount) {
-            control._setValid();
+            control._updateValid();
             control._state.mount = true;
         }
         if (control._state.watch) {
@@ -2714,9 +2656,15 @@ function useForm(props = {}) {
         }
         control._removeUnmounted();
     });
+    React__default.useEffect(() => {
+        props.shouldUnregister &&
+            control._subjects.values.next({
+                values: control._getWatch(),
+            });
+    }, [props.shouldUnregister, control]);
     _formControl.current.formState = getProxyFormState(formState, control);
     return _formControl.current;
 }
 
-export { Controller, Form, FormProvider, appendErrors, createFormControl, get, set, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
+export { Controller, Form, FormProvider, appendErrors, get, set, useController, useFieldArray, useForm, useFormContext, useFormState, useWatch };
 //# sourceMappingURL=index.esm.js.map