Overview
The Accordion component wraps collapsible content sections. Use it for FAQ sections or edge-case details that most readers can skip.
Props
Accordion (container)
| Prop | Type | Default | Description |
|---|
children | ReactNode | — | One or more <AccordionItem> elements |
defaultOpen | boolean | false | Open the first item by default |
AccordionItem
| Prop | Type | Default | Description |
|---|
title | string | — | Clickable header text |
children | ReactNode | — | Collapsible body content |
defaultOpen | boolean | false | Start this item in open state |
Usage
MDX source
<Accordion>
<AccordionItem title="Question here">Answer here.</AccordionItem>
<AccordionItem title="Another question">Another answer.</AccordionItem>
</Accordion>