I want to use the "component" prop with a MUI component (ListItem for example) using the styled() API. My setup below causes an error saying that "component" is not a valid prop. What is the correct way to do this? I can't find any example of this in the docs. Is my only option to use the sx syntax?
const StyledListItem = styled(ListItem)`
// some styles here
`;
const MyComponent = () => (
<StyledListItem component="a" target="_blank" href="#"/>
);
Should I use shouldForwardProps here?
what you currently have for component is not the correct type of value. It needs to be a elementType which is actually a component and not a string.
<StyledListItem component="a" target="_blank" href="#" />
something like this...
<StyledListItem component={element} target="_blank" href="#" />