Typescript styled-component error: "Type '{ children: string; }' has no properties in common with type 'IntrinsicAttributes'."

Ok like it was stated above just to clarify if you create a component

   <DeliverNow>

        </DeliverNow>

it automatically passes props to it and if when u declare it

const DeliverNow = () => {}

Typescript would tell you that they don't match cuz, in reality, DeliverNow takes in some props

so in actual sense, its meant to be

const DeliverNow = (props:any) => {}

<Note>{props.message}</Note> is same as Note({ children: props.message }) so typescript is complaining that function Note doesn't take any arguments and function type doesn't match. It has nothing to do with styled-components.

(IntrinsicAttributes is probably the default interface you extend when you write a functional component. Or something like that idk xD)

My best guess is you want const Note = props.error ? NotificationError : NotificationSuccess; instead of what you have written.

PS. I might be wrong but I'm mostly sure this is the case.