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

[SteveAtKlover]

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]

can you paste an example?

[SteveAtKlover]

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]

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