Design System Documentation Writer

Write the documentation for the [COMPONENT_NAME] component in the [DESIGN_SYSTEM_NAME] design system. The component is used for: [COMPONENT_PURPOSE]. Structure the documentation page as: (1) Overview — 2–3 sentences describing what the component is and when to use it, (2) Anatomy — list and describe each sub-element of the component (e.g., label, icon, container) in a bulleted list, (3) Variants — document each variant: [VARIANTS_LIST] with a description of when each is appropriate, (4) States — document each interactive state: [STATES — e.g., default, hover, active, disabled, loading, error] with a one-sentence description, (5) Usage guidelines — 3–4 "Do" and 3–4 "Don't" rules with specific examples, (6) Accessibility notes — keyboard behavior, ARIA roles/attributes required, and screen reader behavior, (7) Code snippet — a sample implementation in [FRAMEWORK — e.g., React, Vue] with props table showing: Prop Name, Type, Default, Required, Description. Write for an audience of product designers and frontend engineers.