issue: `Control` type regression

Version Number

7.33.1

Codesandbox/Expo snack

https://codesandbox.io/s/youthful-elion-r6wrtw?file=/src/App.tsx

Problem description

In our prod application, we have a SharedFields component that renders some standard fields that several forms use. In order to do this, we pass a control prop that we take from the result of each useForm() hook. Since we don’t know the exact form data type, we use Control<any> for this prop type. This was working fine up to 7.33.0, but now TS throws an error.

Steps to reproduce

1. Go to App.tsx
2. See the error on SharedFields control prop.

This same code example works fine up to 7.33.0.

Expected behaviour

Control type should be able to handle generic types.

What browsers are you seeing the problem on?

No response

Relevant log output

Type 'Control<FormValues, object>' is not assignable to type 'Control<any, any>'.
  The types of '_subjects.state' are incompatible between these types.
    Type 'FormStateSubjectRef<FormValues>' is not assignable to type 'FormStateSubjectRef<any>'.
      Type 'FormStateSubjectRef<FormValues>' is not assignable to type '{ readonly observers: Observer<Partial<FormState<any>> & { name?: string | undefined; }>[]; subscribe: (value: Observer<Partial<FormState<any>> & { ...; }>) => Subscription; unsubscribe: Noop; }'.
        Types of property 'subscribe' are incompatible.
          Type '(value: Observer<Partial<FormState<FormValues>> & { name?: string | undefined; }>) => Subscription' is not assignable to type '(value: Observer<Partial<FormState<any>> & { name?: string | undefined; }>) => Subscription'.
            Types of parameters 'value' and 'value' are incompatible.
              Type 'Observer<Partial<FormState<any>> & { name?: string | undefined; }>' is not assignable to type 'Observer<Partial<FormState<FormValues>> & { name?: string | undefined; }>'.
                Type 'Partial<FormState<FormValues>> & { name?: string | undefined; }' is not assignable to type 'Partial<FormState<any>> & { name?: string | undefined; }'.
                  Type 'Partial<FormState<FormValues>> & { name?: string | undefined; }' is not assignable to type 'Partial<FormState<any>>'.
                    Types of property 'errors' are incompatible.
                      Type 'FieldErrorsImpl<DeepRequired<FormValues>> | undefined' is not assignable to type 'FieldErrorsImpl<DeepRequired<any>> | undefined'.
                        Type 'FieldErrorsImpl<DeepRequired<FormValues>>' is not assignable to type 'FieldErrorsImpl<DeepRequired<any>>'.
                          Property 'otherField' is incompatible with index signature.
                            Type 'FieldError' is not assignable to type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>>'.
                              Property 'type' is incompatible with index signature.
                                Type 'LiteralUnion<"pattern" | "valueAsNumber" | "valueAsDate" | "setValueAs" | "disabled" | "required" | "min" | "max" | "maxLength" | "minLength" | "validate" | "value" | "shouldUnregister" | "onChange" | "onBlur" | "deps", string>' is not assignable to type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>> | undefined'.
                                  Type '"pattern"' is not assignable to type 'Merge<FieldError, FieldErrorsImpl<DeepRequired<any>>> | undefined'.ts(2322)

Code of Conduct

• I agree to follow this project’s Code of Conduct

[bluebill1049]

I did a deeper look at this issue. This can not be resolved with the newly updated field errors type, you are skipping the type check for the control so you will have to simply set it to any.

[meotimdihia]

Hi, then how to solve this problem? I don’t understand what @bluebill1049 was talking about. There is my problem https://stackblitz.com/edit/next-typescript-pokptk-wuiput?file=pages%2Finput2.tsx,pages%2Findex.tsx I appreciate it if someone helps me to solve it. It took 5-6 hours, but I can’t fix it. I am not really good with Typescript.