Enhanced type safety with Storybook 7

Varun Vachhar
Storybook
2 min readFeb 8, 2023

--

TypeScript makes life easier by detecting edge cases and bugs while you code. That’s why Storybook has included built-in TypeScript support since 6.0. However, stories were not strongly typed.

You got great autocomplete features in story files, but no warnings about missing required args.

Storybook 7 solves this issue by combining CSF3 with the TypeScript satisfies operator. Giving you an improved TypeScript experience.

  • 💪 Stricter story types
  • ⌨️ Better in-editor type checking
  • 🌐 Meta and Story objects are linked to infer component level args
  • 🎮 Action args are automatically detected
  • 🤖 Codemod for easy upgrades

Read the full announcement »

Component Story Format 3 is here! This next gen story format is more expressive and requires less boilerplate code. Plus, it’s fully backward compatible, allowing easy migration via a codemod. Learn more »

We’re hiring at Storybook! Join the team behind Storybook + Chromatic. Build tools used by 100s of thousands of frontend developers. Remote-first. View all openings »

--

--