[ListItem] <ListItem component /> require to forwardRef

Prior to upgrading to the 5.x alpha, the following code from the docs worked:

const link = (p: unknown) => <Link to={route} {...p} />;
<ListItem button key={route} component={link}>

• The issue is present in the latest release.
• I have searched the issues of this repository and believe that this is not a duplicate.

I also looked at the release notes and the specs provided in the source code, but can’t seem to find anything.

Current Behavior 😯

Throws a runtime error:

Warning: Failed prop type: Invalid prop `component` supplied to `ForwardRef(ButtonBase)`. Expected an element type that can hold a ref. Did you accidentally provide a plain function component instead?

And:

Function components cannot be given refs. Attempts to access this ref will fail. Did you mean to use React.forwardRef()?

The component does render correctly, though.

Expected Behavior 🤔

No runtime errors 😉

Your Environment 🌎

Tech	Version
Material-UI	v5.0.0-alpha16
React	17.0.0
Browser	Chrome
TypeScript	Yes (4x)
etc.

[eps1lon]

Thanks. I’ll take a look later what’s wrong with the types. In the meantime, don’t create components during render.

[huzaima]

Can I take this if nobody is working on this?