storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
83.41k stars 9.12k forks source link

[Bug]: subcomponents get type error #27535

Open c-vetter opened 1 month ago

c-vetter commented 1 month ago

Describe the bug

See the repro. In short, when using subcomponents, I get this error:

src/stories/Header.stories.ts:11:5 - error TS2322: Type '({ primary, size, backgroundColor, label, ...props }: ButtonProps) => JSX.Element' is not assignable
to type 'ComponentType<unknown>'.
  Type '({ primary, size, backgroundColor, label, ...props }: ButtonProps) => JSX.Element' is not assignable to type 'FunctionComponent<unknown>'.
    Types of parameters '__0' and 'props' are incompatible.
      Type 'unknown' is not assignable to type 'ButtonProps'.

Reproduction link

https://github.com/c-vetter/repro_storybook_subcomponents-type-error

Reproduction steps

  1. npx storybook init
  2. Add a subcomponent to a story
  3. Boom! error

System

Storybook Environment Info:

  System:
    OS: Windows 10 10.0.19045
    CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
  Binaries:
    Node: 20.12.2 - ~\scoop\apps\nvm\current\nodejs\nodejs\node.EXE
    Yarn: 1.22.22 - ~\scoop\apps\yarn\current\bin\yarn.CMD
    npm: 10.5.0 - ~\scoop\apps\nvm\current\nodejs\nodejs\npm.CMD <----- active
    pnpm: 8.15.4 - ~\scoop\apps\nvm\current\nodejs\nodejs\pnpm.CMD
  Browsers:
    Edge: Chromium (123.0.2420.97)
  npmPackages:
    @storybook/addon-essentials: ^8.1.5 => 8.1.5
    @storybook/addon-interactions: ^8.1.5 => 8.1.5
    @storybook/addon-links: ^8.1.5 => 8.1.5
    @storybook/addon-onboarding: ^8.1.5 => 8.1.5
    @storybook/blocks: ^8.1.5 => 8.1.5
    @storybook/react: ^8.1.5 => 8.1.5
    @storybook/react-vite: ^8.1.5 => 8.1.5
    @storybook/test: ^8.1.5 => 8.1.5
    eslint-plugin-storybook: ^0.8.0 => 0.8.0
    storybook: ^8.1.5 => 8.1.5

Additional context

Looking for a solution, I came across #21253

By updating that one's repro, I was able to get it to work: https://github.com/c-vetter/repro_storybook_subcomponents-type-error/tree/alt/21253

I'm unsure as to what is the relevant difference, will update here with any findings.

MarioSimou commented 3 weeks ago

Any update on this?