Accordion
Stacked sections that open independently, or one at a time in exclusive mode. Buttons and regions, nothing fancy.
Multiple open
Every visual decision reads a CSS custom property.
Reading, no. Interactive controls ship their own script only when used.
Exclusive
Standard (3 days), express (1 day), or pickup.
30 days, no questions, prepaid label included.
<Accordion exclusive>
<AccordionItem id="acc-ship" title="Shipping options">
<p>Standard, express, or pickup.</p>
</AccordionItem>
...
</Accordion>Props
| Prop | Type | Default | Description |
|---|---|---|---|
exclusive (Accordion) | boolean | false | One open at a time. |
id / title (Item) | string | - | Wiring + trigger text. |
expanded (Item) | boolean | false | Open on load. |
Accessibility
- Trigger is a button with
aria-expandedandaria-controls; panel is a labeled region. - Triggers keep their heading level (h3) for document structure.