issue: Type generics do not work well with TS Unions

[keithrz]

Version Number

7.51.1

Codesandbox/Expo snack

https://codesandbox.io/p/sandbox/loving-golick-swltg4

Steps to reproduce

1. Go to 'App.tsx' in the code sandbox
2. Hover your mouse over the TypeScript error for "control"
3. You should see the following TS error:

Type 'Control<FormValues<Product>>' is not assignable to type 'Control<FormValues<Product | Discount>>'.
  Types of property 'register' are incompatible.
    Type 'UseFormRegister<FormValues<Product>>' is not assignable to type 'UseFormRegister<FormValues<Product | Discount>>'.
      Type 'FormValues<Product | Discount>' is not assignable to type 'FormValues<Product>'.typescript(2322)
InternalField.tsx(14, 3): The expected type comes from property 'control' which is declared here on type 'IntrinsicAttributes & { control: Control<FormValues<Product | Discount>>; trigger: UseFormTrigger<FormValues<Product | Discount>>; }'
(property) control: Control<FormValues<Product | Discount>>

Expected behaviour

No TS error, because Product is part of the TS Union Product | Discount

What browsers are you seeing the problem on?

No response

Relevant log output

No response

Code of Conduct

• [X] I agree to follow this project's Code of Conduct