Bug: IconButton triggers a compilation error when passed a React-Router-Dom Link component for as attribute

[yhafez]

Steps to reproduce

Create a valid IconButton component and pass it a Link component for the as attribute.

Expected Behavior

The IconButton renders properly using a Link React-Router-Dom component as the component it renders. It does not cause a linter error or a compilation error.

Actual Behavior

A linter error and compilation error occur.

Version

6.4.0

What browsers are you experiencing the problem on?

No response

Relevant log output

Linter error:

Type '<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null' is not assignable to type '(("button" | "a") & (<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null)) | undefined'.
  Type '<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null' is not assignable to type '"button" & (<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null)'.
    Type '<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null' is not assignable to type '"button"'.ts(2322)
polymorphicComponent.d.ts(4, 5): The expected type comes from property 'as' which is declared here on type 'IntrinsicAttributes & Omit<LinkProps<unknown> & RefAttributes<HTMLAnchorElement>, keyof IconButtonProps> & IconButtonProps & { ...; }'
(property) as?: (("button" | "a") & (<S = H.LocationState>(props: LinkProps<S> & React.RefAttributes<HTMLAnchorElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null)) | undefined

Compilation error:

ERROR in ./src/modules/axe-watcher/components/projects/ProjectRow.tsx:76:9
TS2322: Type '<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null' is not assignable to type '(("a" | "button") & (<S = H.LocationState>(props: LinkProps<S> & RefAttributes<HTMLAnchorElement>) => ReactElement<any, string | JSXElementConstructor<any>> | null)) | undefined'.
    74 |     <div className={styles.actions}>
    75 |       <IconButton
  > 76 |         as={Link}
       |         ^^
    77 |         to={url}
    78 |         icon="eye"
    79 |         label={t('View {{name}}', { name: project.name })}

Anything else we should know?

Additional information

Noticed in Walnut when attempting to update to latest version of cauldron