Component Documentation Generator
Generate comprehensive component documentation including props, usage guidelines, do's and don'ts, and accessibility notes from a component's code.
The Prompt
Generate comprehensive documentation for this design system component.
Include:
1. **Overview** — One paragraph describing what the component does and when to use it
2. **Props Table** — All props with types, defaults, and descriptions
3. **Usage Examples** — 3-4 common usage patterns with code snippets
4. **Do's and Don'ts** — 4 bullet points each
5. **Accessibility** — ARIA attributes, keyboard navigation, screen reader behavior
6. **Related Components** — What components are commonly used alongside this one
Here's the component code:
[paste component code here]
Tips
- Include both the component code and any existing TypeScript interfaces
- Mention your documentation format (MDX, Storybook, etc.) for better output
- Ask for specific framework syntax (React, Vue, etc.)