Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

Typescript error with style prop #53

Open
mjfwebb opened this issue May 7, 2023 · 0 comments · May be fixed by #54
Open

Typescript error with style prop #53

mjfwebb opened this issue May 7, 2023 · 0 comments · May be fixed by #54

Comments

@mjfwebb
Copy link

mjfwebb commented May 7, 2023

Here's a basic example which shows the issue: https://codesandbox.io/s/nifty-river-olt52e?file=/src/App.tsx

When we add a styles prop to a Breakpoint we get a Typescript error:

No overload matches this call.
  Overload 1 of 2, '(props: Props | Readonly<Props>): Breakpoint', gave the following error.
    Type '{ children: string; style: { background: string; }; sm: true; down: true; }' is not assignable to type 'Readonly<Props>'.
      Property 'style' is incompatible with index signature.
        Type '{ background: string; }' is not assignable to type 'ReactNode'.
          Property 'background' does not exist on type 'ReactElement<any, string | JSXElementConstructor<any>> | ReactFragment | ReactPortal'.
  Overload 2 of 2, '(props: Props, context: any): Breakpoint', gave the following error.
    Type '{ children: string; style: { background: string; }; sm: true; down: true; }' is not assignable to type 'Readonly<Props>'.
      Property 'style' is incompatible with index signature.
        Type '{ background: string; }' is not assignable to type 'ReactNode'.
          Property 'background' does not exist on type 'ReactElement<any, string | JSXElementConstructor<any>> | ReactFragment | ReactPortal'.ts(2769)

Essentially the problem is the [key: string]: React.ReactNode | string | boolean; on ReactSocks.Props

One way to fix it is to change it to this:

[key: string]: React.ReactNode | React.CSSProperties | string | boolean;

@abdulraheemabid abdulraheemabid linked a pull request Apr 7, 2024 that will close this issue
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

1 participant