Add TTransformedValues generic to more places

react-hook-form · May 21, 2024 · 7570504 · 7570504
1 parent b8e4953
commit 7570504
Show file tree

Hide file tree

Showing 8 changed files with 44 additions and 26 deletions.
diff --git a/src/controller.tsx b/src/controller.tsx
@@ -46,8 +46,10 @@ import { useController } from './useController';
 const Controller = <
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+  TTransformedValues extends FieldValues = TFieldValues,
 >(
-  props: ControllerProps<TFieldValues, TName>,
-) => props.render(useController<TFieldValues, TName>(props));
+  props: ControllerProps<TFieldValues, TName, TTransformedValues>,
+) =>
+  props.render(useController<TFieldValues, TName, TTransformedValues>(props));
 
 export { Controller };
diff --git a/src/form.tsx b/src/form.tsx
@@ -28,10 +28,9 @@ const POST_REQUEST = 'post';
  * }
  * ```
  */
-function Form<
-  T extends FieldValues,
-  U extends FieldValues | undefined = undefined,
->(props: FormProps<T, U>) {
+function Form<T extends FieldValues, U extends FieldValues = T>(
+  props: FormProps<T, U>,
+) {
   const methods = useFormContext<T>();
   const [mounted, setMounted] = React.useState(false);
   const {

diff --git a/src/types/controller.ts b/src/types/controller.ts
@@ -35,6 +35,7 @@ export type ControllerRenderProps<
 export type UseControllerProps<
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+  TTransformedValues extends FieldValues = TFieldValues,
 > = {
   name: TName;
   rules?: Omit<
@@ -43,7 +44,7 @@ export type UseControllerProps<
   >;
   shouldUnregister?: boolean;
   defaultValue?: FieldPathValue<TFieldValues, TName>;
-  control?: Control<TFieldValues>;
+  control?: Control<TFieldValues, any, TTransformedValues>;
   disabled?: boolean;
 };
 
@@ -80,6 +81,7 @@ export type UseControllerReturn<
 export type ControllerProps<
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+  TTransformedValues extends FieldValues = TFieldValues,
 > = {
   render: ({
     field,
@@ -90,4 +92,4 @@ export type ControllerProps<
     fieldState: ControllerFieldState;
     formState: UseFormStateReturn<TFieldValues>;
   }) => React.ReactElement;
-} & UseControllerProps<TFieldValues, TName>;
+} & UseControllerProps<TFieldValues, TName, TTransformedValues>;
diff --git a/src/types/fieldArray.ts b/src/types/fieldArray.ts
@@ -7,10 +7,11 @@ export type UseFieldArrayProps<
   TFieldValues extends FieldValues = FieldValues,
   TFieldArrayName extends FieldArrayPath<TFieldValues> = FieldArrayPath<TFieldValues>,
   TKeyName extends string = 'id',
+  TTransformedValues extends FieldValues = TFieldValues,
 > = {
   name: TFieldArrayName;
   keyName?: TKeyName;
-  control?: Control<TFieldValues>;
+  control?: Control<TFieldValues, any, TTransformedValues>;
   rules?: {
     validate?:
       | Validate<FieldArray<TFieldValues, TFieldArrayName>[], TFieldValues>

diff --git a/src/types/form.ts b/src/types/form.ts
@@ -848,8 +848,11 @@ export type UseFormReturn<
   setFocus: UseFormSetFocus<TFieldValues>;
 };
 
-export type UseFormStateProps<TFieldValues extends FieldValues> = Partial<{
-  control?: Control<TFieldValues>;
+export type UseFormStateProps<
+  TFieldValues extends FieldValues,
+  TTransformedValues extends FieldValues = TFieldValues,
+> = Partial<{
+  control?: Control<TFieldValues, any, TTransformedValues>;
   disabled?: boolean;
   name?:
     | FieldPath<TFieldValues>
@@ -861,14 +864,17 @@ export type UseFormStateProps<TFieldValues extends FieldValues> = Partial<{
 export type UseFormStateReturn<TFieldValues extends FieldValues> =
   FormState<TFieldValues>;
 
-export type UseWatchProps<TFieldValues extends FieldValues = FieldValues> = {
+export type UseWatchProps<
+  TFieldValues extends FieldValues = FieldValues,
+  TTransformedValues extends FieldValues = TFieldValues,
+> = {
   defaultValue?: unknown;
   disabled?: boolean;
   name?:
     | FieldPath<TFieldValues>
     | FieldPath<TFieldValues>[]
     | readonly FieldPath<TFieldValues>[];
-  control?: Control<TFieldValues>;
+  control?: Control<TFieldValues, any, TTransformedValues>;
   exact?: boolean;
 };
 
@@ -882,10 +888,10 @@ export type FormProviderProps<
 
 export type FormProps<
   TFieldValues extends FieldValues,
-  TTransformedValues extends FieldValues | undefined = undefined,
+  TTransformedValues extends FieldValues = TFieldValues,
 > = Omit<React.FormHTMLAttributes<HTMLFormElement>, 'onError' | 'onSubmit'> &
   Partial<{
-    control: Control<TFieldValues>;
+    control: Control<TFieldValues, any, TTransformedValues>;
     headers: Record<string, string>;
     validateStatus: (status: number) => boolean;
     onError: ({

diff --git a/src/useController.ts b/src/useController.ts
@@ -49,10 +49,11 @@ import { set } from './utils';
 export function useController<
   TFieldValues extends FieldValues = FieldValues,
   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+  TTransformedValues extends FieldValues = TFieldValues,
 >(
-  props: UseControllerProps<TFieldValues, TName>,
+  props: UseControllerProps<TFieldValues, TName, TTransformedValues>,
 ): UseControllerReturn<TFieldValues, TName> {
-  const methods = useFormContext<TFieldValues>();
+  const methods = useFormContext<TFieldValues, any, TTransformedValues>();
   const { name, disabled, control = methods.control, shouldUnregister } = props;
   const isArrayField = isNameInFieldArray(control._names.array, name);
   const value = useWatch({

diff --git a/src/useFormState.ts b/src/useFormState.ts
@@ -43,10 +43,13 @@ import { useSubscribe } from './useSubscribe';
  * }
  * ```
  */
-function useFormState<TFieldValues extends FieldValues = FieldValues>(
-  props?: UseFormStateProps<TFieldValues>,
+function useFormState<
+  TFieldValues extends FieldValues = FieldValues,
+  TTransformedValues extends FieldValues = TFieldValues,
+>(
+  props?: UseFormStateProps<TFieldValues, TTransformedValues>,
 ): UseFormStateReturn<TFieldValues> {
-  const methods = useFormContext<TFieldValues>();
+  const methods = useFormContext<TFieldValues, any, TTransformedValues>();
   const { control = methods.control, disabled, name, exact } = props || {};
   const [formState, updateFormState] = React.useState(control._formState);
   const _mounted = React.useRef(true);

diff --git a/src/useWatch.ts b/src/useWatch.ts
@@ -39,9 +39,10 @@ import { useSubscribe } from './useSubscribe';
  */
 export function useWatch<
   TFieldValues extends FieldValues = FieldValues,
+  TTransformedValues extends FieldValues = TFieldValues,
 >(props: {
   defaultValue?: DeepPartialSkipArrayKey<TFieldValues>;
-  control?: Control<TFieldValues>;
+  control?: Control<TFieldValues, any, TTransformedValues>;
   disabled?: boolean;
   exact?: boolean;
 }): DeepPartialSkipArrayKey<TFieldValues>;
@@ -68,10 +69,11 @@ export function useWatch<
 export function useWatch<
   TFieldValues extends FieldValues = FieldValues,
   TFieldName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
+  TTransformedValues extends FieldValues = TFieldValues,
 >(props: {
   name: TFieldName;
   defaultValue?: FieldPathValue<TFieldValues, TFieldName>;
-  control?: Control<TFieldValues>;
+  control?: Control<TFieldValues, any, TTransformedValues>;
   disabled?: boolean;
   exact?: boolean;
 }): FieldPathValue<TFieldValues, TFieldName>;
@@ -101,10 +103,11 @@ export function useWatch<
 export function useWatch<
   TFieldValues extends FieldValues = FieldValues,
   TFieldNames extends readonly FieldPath<TFieldValues>[] = readonly FieldPath<TFieldValues>[],
+  TTransformedValues extends FieldValues = TFieldValues,
 >(props: {
   name: readonly [...TFieldNames];
   defaultValue?: DeepPartialSkipArrayKey<TFieldValues>;
-  control?: Control<TFieldValues>;
+  control?: Control<TFieldValues, any, TTransformedValues>;
   disabled?: boolean;
   exact?: boolean;
 }): FieldPathValues<TFieldValues, TFieldNames>;
@@ -140,9 +143,10 @@ export function useWatch<
  * })
  * ```
  */
-export function useWatch<TFieldValues extends FieldValues>(
-  props?: UseWatchProps<TFieldValues>,
-) {
+export function useWatch<
+  TFieldValues extends FieldValues,
+  TTransformedValues extends FieldValues = TFieldValues,
+>(props?: UseWatchProps<TFieldValues, TTransformedValues>) {
   const methods = useFormContext();
   const {
     control = methods.control,