Let's say I have the following component with 1 prop - title:
<StyledBaseButton title="test" />
I would add the prop type like this:
const StyledBaseButton = styled(BaseButton)<{ title: string }>`
background-color: ${colors.primary600};
border-color: ${colors.primary600};
`;
However, if I want to add a second prop like this:
<StyledBaseButton title="test" wide />
And attempt to add the second prop to the styled component like this:
const StyledBaseButton = styled(BaseButton)<{ title: string, wide: boolean }>`
background-color: ${colors.primary600};
border-color: ${colors.primary600};
`;
It doesn't work and I imagine I'm messing up the styled component syntax. I tried google-ing the issue, but all the solutions always show how to do it with 1 prop only, and I can already do that. What I can't figure out is how to use more than one props.