storybook

CSF3-format Storybook stories automatically generate comprehensive component documentation through autodocs. Write stories for your UI components following naming conventions and required autodocs tags to create standardized, accessible documentation across your React application.

Create tiered story coverage in CSF3 format showing different variants, sizes, and states—such as default, primary, secondary, and disabled. This enforces consistent behavior and makes all component variants discoverable through Storybook's autodocs.

Yes. CSF3 stories include interaction test skeletons and decorators that standardize testing patterns across component tiers. Apply these enforced conventions to shared/ui, shared/patterns, and features/*/components directories to maintain consistency.

Generate 4-6 CSF3-format stories for your component covering required story types, naming conventions, and autodocs tags. Include decorators, providers, and interaction test skeletons; apply this to components in shared/ui or shared/patterns directories.

CSF3 enables automatic autodocs generation and enforces modern naming conventions and story structure. It provides standardized component documentation, cleaner syntax, and better integration with design systems compared to older Storybook formats.

The skill enforces naming conventions and required autodocs tags that guide story creation. Basic React component knowledge is sufficient; the standardized CSF3 structure and tiered story requirements make the process straightforward and consistent.