generate-component-story
Create story examples for components. Use when writing stories, creating examples, or demonstrating component usage.
Best use case
generate-component-story is best used when you need a repeatable AI agent workflow instead of a one-off prompt.
Create story examples for components. Use when writing stories, creating examples, or demonstrating component usage.
Teams using generate-component-story should expect a more consistent output, faster repeated execution, less prompt rewriting.
When to use this skill
- You want a reusable workflow that can be run more than once with consistent structure.
When not to use this skill
- You only need a quick one-off answer and do not need a reusable workflow.
- You cannot install or maintain the underlying files, dependencies, or repository context.
Installation
Claude Code / Cursor / Codex
Manual Installation
- Download SKILL.md from GitHub
- Place it in
.claude/skills/generate-component-story/SKILL.mdinside your project - Restart your AI agent — it will auto-discover the skill
How generate-component-story Compares
| Feature / Agent | generate-component-story | Standard Approach |
|---|---|---|
| Platform Support | Not specified | Limited / Varies |
| Context Awareness | High | Baseline |
| Installation Complexity | Unknown | N/A |
Frequently Asked Questions
What does this skill do?
Create story examples for components. Use when writing stories, creating examples, or demonstrating component usage.
Where can I find the source code?
You can find the source code on GitHub using the link provided at the top of the page.
SKILL.md Source
## Instructions When creating component stories: 1. **Follow existing patterns**: Base stories on the styles found in `crates/story/src/stories` (examples: `tabs_story.rs`, `group_box_story.rs`, etc.) 2. **Use sections**: Organize the story with `section!` calls for each major part 3. **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
generate-llms
Generate llms.txt and llms-full.txt files for AI agent consumption following the llmstxt.org standard. Use when updating site content that should be reflected in the llms files, or when building/deploying the site.
data-storytelling
Transform data into compelling narratives using visualization, context, and persuasive structure. Use when presenting analytics to stakeholders, creating data reports, or building executive present...
convex-component-authoring
How to create, structure, and publish self-contained Convex components with proper isolation, exports, and dependency management
nano-image-generate
Generate images using Nano Banana (Flash) or Nano Banana Pro. Use 'flash' for speed/efficiency and 'pro' for high quality, text rendering, and complex prompt adherence. Triggers include 'generate image', 'create logo', 'fast image', 'high quality image'.
Generate educational content with fixed sections
Generate educational content about any topic following a user-specified structure: include a set number of learning tips/tricks or activities, fun facts, Q&A pairs, jokes, and optionally extend with additional lines. Always list supplies for activities when requested.
fal-generate
Generate images and videos using fal.ai AI models
agent-ops-git-story
Generate narrative summaries from git history for onboarding, retrospectives, changelogs, and exploration. LLM-enhanced when available, works without LLM too.
u08871-ethical-dilemma-navigation-for-marketing-and-storytelling
Operate the "Ethical Dilemma Navigation for marketing and storytelling" capability in production for marketing and storytelling workflows. Use when mission execution explicitly requires this capability and outcomes must be reproducible, policy-gated, and handoff-ready.
u01874-handoff-contracting-for-marketing-and-storytelling
Operate the "Handoff Contracting for marketing and storytelling" capability in production for marketing and storytelling workflows. Use when mission execution explicitly requires this capability and outcomes must be reproducible, policy-gated, and handoff-ready.
agentuity-cli-project-auth-generate
Generate SQL schema for Agentuity Auth tables. Use for managing authentication credentials
chatgpt-history
Search and extract data from ChatGPT conversation history. Use when the user asks to find, search, or extract information from their ChatGPT history, conversations, or past chats.
bgo
Automates the complete Blender build-go workflow, from building and packaging your extension/add-on to removing old versions, installing, enabling, and launching Blender for quick testing and iteration.