Create a Component Library Documentation

Write documentation for a UI component library / design system:

Product / company: [name]
Component to document: [e.g. Button / Modal / Form Input / Data Table / Navigation]
Tech stack: [e.g. React / Vue / HTML/CSS / Figma component]
Audience: [developers using the library / designers / both]

For each component, write complete documentation covering:

1. Overview: what this component is and when to use it (and when NOT to)
2. Props / variants:
   - Table of all props with type, default value, required/optional, description
   - Visual variants (e.g. primary / secondary / destructive / ghost)
   - Size variants
   - State variants (default / hover / active / disabled / loading / error)
3. Usage examples: code snippets for the 3 most common use cases
4. Accessibility requirements: ARIA roles, keyboard navigation, focus management, screen reader behaviour
5. Design guidelines: spacing, colour usage, icon placement, text length limits
6. Do's and don'ts: 3 of each with visual example descriptions
7. Related components: what to use instead in specific situations