Preview
Accordion renders open panel content during SSR, but coordinated disclosure behavior requires the client runtime. This server-rendered page does not imitate client behavior. Open the live playground.
Usage
Accordion usage<Accordion defaultValue="tokens"><AccordionItem value="tokens" title="What ships?">Details</AccordionItem></Accordion>API
Accordion APIAccordionProps
| prop | type | notes |
|---|---|---|
| type? | 'single' | 'multiple' | 'single' (default): one item open at a time. 'multiple': independent items. |
| defaultValue? | string | string[] | Item value(s) open on first render — a string for single, string[] for multiple. |
| collapsible? | boolean | Single mode: allow closing the open item (default true — a set you cannot fully close is a trap). |
| disabled? | boolean | Disables every item. |
| children? | RemixNode | AccordionItem children. |
| mix? | MixInput |
AccordionItemProps
| prop | type | notes |
|---|---|---|
| value | string | Identity within the set (matches defaultValue). |
| title | RemixNode | Trigger row content. |
| disabled? | boolean | |
| heading? | 'h2' | 'h3' | 'h4' | Heading element wrapping the trigger (default 'h3'). Match your outline — items directly under the page h1 should be 'h2'. |
| children? | RemixNode | Panel content. |
| mix? | MixInput |