search

styled-components / styled-components

Visual primitives for the component age. Use the best bits of ES6 and CSS to style your apps without stress 💅
https://styled-components.com
MIT License
40.11k stars 2.48k forks source link

Having to explicitly set the 'children' prop for EVERY component? #4264

Open SteveAtKlover opened 2 months ago

SteveAtKlover commented 2 months ago

Hi, I use Styled Components all over my app, nested inside of each other many levels deep. I just upgraded to React 18 and now I have 200+ error messages saying I need to explicitly define the children prop for every single styled component that has a child. That seems utterly ridiculous and time-consuming. Is there an easy to way to get past this issue?

multivoltage commented 2 months ago

can you paste an example?

SteveAtKlover commented 2 months ago

Here is my JSX...

const HeadlineLink = styled.a'
  color: ${theme.colors.text};
  text-decoration: none;

  &:hover {
    text-decoration: underline;
  }
';

<HeadlineLink href={url} target="_blank" rel="noreferrer">
            <Headline>{title}</Headline>
</HeadlineLink>

and i get the error Property 'children' does not exist on type 'IntrinsicAttributes & {} & { theme?: any; } & { as?: string | undefined; forwardedAs?: string | undefined; }'.

multivoltage commented 2 months ago

What version of styled component? What version of types react/react-dom?

I had similar issue in a project when I upgraded to react 18