i am trying to create a type for PolymorphicComponents (with 'as' prop).
Independently it is working.
export type PolymorphicComponentProps<C extends ElementType, Props> = Props & {
as?: C;
} & ComponentPropsWithoutRef<C>;
However when i try to use it with styled-components all props disappear from type checking:
declare function MyComponent<C extends ElementType>(
props: PropsWithChildren<PolymorphicComponentProps<C, { prop: "mandatory" }>>
): JSX.Element;
const Override = styled(MyComponent)``;
function Test() {
return <Override prop="no type checking" />; // here we do not have any errors, but should
}
Also inside MyComponent when i use some styled component i still have no type checker
Here is codesandbox https://codesandbox.io/s/styled-components-as-prop-8n5rsm?file=/src/App.tsx