Generate Component Stories
Create story examples for UI components following existing patterns with organized sections and comprehensive coverage of variants and states.
Sby Skills Guide Bot
DevelopmentIntermediate0 views0 installs2/28/2026CursorWindsurfCopilot
component-storiesui-developmentrusttestingdocumentation
name: generate-component-story description: Create story examples for components. Use when writing stories, creating examples, or demonstrating component usage.
Instructions
When creating component stories:
- Follow existing patterns: Base stories on the styles found in
crates/story/src/stories(examples:tabs_story.rs,group_box_story.rs, etc.) - Use sections: Organize the story with
section!calls for each major part - Comprehensive coverage: Include all options, variants, and usage examples of the component
Examples
A typical story structure includes:
- Basic usage examples
- Different variants and states
- Interactive examples
- Edge cases and error states
Related skills
Next.js App Router Expert
100
A skill that turns Claude into a Next.js App Router expert.
Claude CodeCursoradvanced
8902342505Admin
README Generator
100
Creates professional and comprehensive README.md files for your projects.
claudeCursorWindsurfbeginner
25972514Admin
API Documentation Writer
100
Generates comprehensive API documentation in OpenAPI/Swagger format.
claudeCursorWindsurfintermediate
15644372Admin