Support TypeScript > v4.5

[joshblack]

Starting in typescript@>4.5, we receive type errors in the following files:

• src/AvatarPair.tsx
• src/deprecated/ChoiceInputField.tsx
• src/deprecated/InputField/InputField.tsx
• src/FormControl/FormControl.tsx

Error message

src/AvatarPair.tsx:20:34 - error TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type '{ size: number; }' is not assignable to parameter of type 'Partial<unknown> & Attributes'.
      Object literal may only specify known properties, and 'size' does not exist in type 'Partial<unknown> & Attributes'.

20       React.cloneElement(child, {size: 40})
                                    ~~~~~~~~

  node_modules/@types/react/index.d.ts:329:14
    329     function cloneElement<P>(
                     ~~~~~~~~~~~~
    The last overload is declared here.

src/deprecated/ChoiceInputField.tsx:90:19 - error TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type '{ id: string; disabled: boolean | undefined; "aria-describedby": string | undefined; }' is not assignable to parameter of type 'Partial<unknown> & Attributes'.
      Object literal may only specify known properties, and 'id' does not exist in type 'Partial<unknown> & Attributes'.

90                   id,
                     ~~

  node_modules/@types/react/index.d.ts:329:14
    329     function cloneElement<P>(
                     ~~~~~~~~~~~~
    The last overload is declared here.

src/deprecated/InputField/InputField.tsx:138:17 - error TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type '{ id: string; required: boolean | undefined; disabled: boolean | undefined; "aria-describedby": string; }' is not assignable to parameter of type 'Partial<unknown> & Attributes'.
      Object literal may only specify known properties, and 'id' does not exist in type 'Partial<unknown> & Attributes'.

138                 id,
                    ~~

  node_modules/@types/react/index.d.ts:329:14
    329     function cloneElement<P>(
                     ~~~~~~~~~~~~
    The last overload is declared here.

src/FormControl/FormControl.tsx:145:21 - error TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type '{ id: string; disabled: boolean | undefined; "aria-describedby": string | 0 | undefined; }' is not assignable to parameter of type 'Partial<unknown> & Attributes'.
      Object literal may only specify known properties, and 'id' does not exist in type 'Partial<unknown> & Attributes'.

145                     id,
                        ~~

  node_modules/@types/react/index.d.ts:329:14
    329     function cloneElement<P>(
                     ~~~~~~~~~~~~
    The last overload is declared here.

src/FormControl/FormControl.tsx:170:55 - error TS2571: Object is of type 'unknown'.

170               {(React.isValidElement(slots.Label) && !slots.Label.props.visuallyHidden) || slots.Caption ? (
                                                          ~~~~~~~~~~~~~~~~~

src/FormControl/FormControl.tsx:198:19 - error TS2698: Spread types may only be created from object types.

198                   ...InputComponent.props
                      ~~~~~~~~~~~~~~~~~~~~~~~


Found 6 errors in 4 files.

Errors  Files
     1  src/AvatarPair.tsx:20
     1  src/deprecated/ChoiceInputField.tsx:90
     1  src/deprecated/InputField/InputField.tsx:138
     3  src/FormControl/FormControl.tsx:145

The goal of this PR is to support TypeScripts versions >4.5, I believe addressing this will result in support for 4.6, 4.7, and 4.8. Addressing 4.8 would also enable us to unblock the consumer-test range over in: #2290

[joshblack]

Closed by #2360