{fieldState.isTouched && \"Touched\"}
\n *{formState.isSubmitted ? \"submitted\" : \"\"}
\n * \n * );\n * }\n * ```\n */function useController(t){const s=useFormContext();const{name:a,control:n=s.control,shouldUnregister:o}=t;const i=isNameInFieldArray(n._names.array,a);const u=useWatch({control:n,name:a,defaultValue:get(n._formValues,a,get(n._defaultValues,a,t.defaultValue)),exact:true});const l=useFormState({control:n,name:a});const c=e.useRef(n.register(a,{...t.rules,value:u}));c.current=n.register(a,t.rules);e.useEffect((()=>{const e=n._options.shouldUnregister||o;const updateMounted=(e,t)=>{const r=get(n._fields,e);r&&(r._f.mount=t)};updateMounted(a,true);if(e){const e=cloneObject(get(n._options.defaultValues,a));set(n._defaultValues,a,e);isUndefined(get(n._formValues,a))&&set(n._formValues,a,e)}return()=>{(i?e&&!n._state.action:e)?n.unregister(a):updateMounted(a,false)}}),[a,n,i,o]);return{field:{name:a,value:u,onChange:e.useCallback((e=>c.current.onChange({target:{value:getEventValue(e),name:a},type:r.CHANGE})),[a]),onBlur:e.useCallback((()=>c.current.onBlur({target:{value:get(n._formValues,a),name:a},type:r.BLUR})),[a,n]),ref:e=>{const t=get(n._fields,a);t&&e&&(t._f.ref={focus:()=>e.focus(),select:()=>e.select(),setCustomValidity:t=>e.setCustomValidity(t),reportValidity:()=>e.reportValidity()})}},formState:l,fieldState:Object.defineProperties({},{invalid:{enumerable:true,get:()=>!!get(l.errors,a)},isDirty:{enumerable:true,get:()=>!!get(l.dirtyFields,a)},isTouched:{enumerable:true,get:()=>!!get(l.touchedFields,a)},error:{enumerable:true,get:()=>get(l.errors,a)}})}}\n/**\n * Component based on `useController` hook to work with controlled component.\n *\n * @remarks\n * [API](https://react-hook-form.com/docs/usecontroller/controller) \u2022 [Demo](https://codesandbox.io/s/react-hook-form-v6-controller-ts-jwyzw) \u2022 [Video](https://www.youtube.com/watch?v=N2UNk_UCVyA)\n *\n * @param props - the path name to the form field value, and validation rules.\n *\n * @returns provide field handler functions, field and form state.\n *\n * @example\n * ```tsx\n * function App() {\n * const { control } = useForm