Typescript says a prop does not exist on a component I wrapped with styled-components

Question

I am using semantic-ui-react and along with styled-components. I am wrapping the Tab component with styled-components to customize its look. Here is that code

const CustomTab = styled(Tab)<{props: TabProps}>`
    flex: 1;
    display: flex;
    margin-top: 10px;
    flex-direction: column;
`;

As you can see I am trying to specify that the props for CustomTab will be the same props as the Tab component. I did this based on this answer.

The problem is that typescript still seems to think that Menu props does not exits on my CustomTab component.

Where am I going wrong?

score 2 · Accepted Answer · answered Feb 13 '20 at 22:08

2

Try const CustomTab = styled(Tab)<TabProps>

You basically defined your props as an object that looks like this: {props: {TabProps}}

answered Feb 13 '20 at 22:08

h-des

767
5
9

Typescript says a prop does not exist on a component I wrapped with styled-components

1 Answers1