Is that possible to infer form value from SubmitHandler instead of defining it ourselves?

[mattchannn]

export type SubmitHandler<T> = (data: T, event?: React.BaseSyntheticEvent) => unknown | Promise<unknown>

Looks like every time we want to submit we'll need to provide our own FormValue instead of using those properties we registered using register method.

Would react-hook-form be intelligent enough to provide an inferred type for us to use just like the RootState that Redux provides?

[Pleo2]

TypeScript cannot build a form type in reverse from separate register('...') calls. useForm() and handleSubmit() are typed before those calls happen, and field names may also be conditional or dynamic.

The usual approach is to define one source of truth and infer from that source, rather than repeating the shape manually. For example, with a schema:

const schema = z.object({
  email: z.string().email(),
  age: z.number().int(),
})

type FormValues = z.input<typeof schema>

const { register, handleSubmit } = useForm<FormValues>({
  resolver: zodResolver(schema),
})

const onSubmit: SubmitHandler<FormValues> = (data) => {
  // data is { email: string; age: number }
}

For simple forms, typeof defaultValues can be the source:

const defaultValues = { email: '', age: 0 }

type FormValues = typeof defaultValues
const form = useForm<FormValues>({ defaultValues })

You also do not have to annotate a separate handler at all. Once useForm<FormValues>() is typed, an inline callback is inferred:

<form onSubmit={handleSubmit((data) => {
  // data is FormValues
})}>

Redux can expose RootState because the configured store/reducer is a statically typed value from which a state type can be derived. A sequence of register() calls does not produce an equivalent compile-time object, so RHF's type direction is intentionally FormValues -> register/path/submit, not the reverse.

TypeScript reference: https://react-hook-form.com/ts