accordion

Accessible accordion with single or multiple open sections.

A headless accordion (WAI-ARIA) supporting single or multiple open sections.

import { Accordion, AccordionItem, AccordionTrigger, AccordionContent } from '@fluixi/accordion';

<Accordion type="single" collapsible defaultValue="a">
  <AccordionItem value="a">
    <AccordionTrigger>Section A</AccordionTrigger>
    <AccordionContent>…</AccordionContent>
  </AccordionItem>
</Accordion>

type single (default) or multiple; collapsible lets a single accordion close its open item; controlled value or uncontrolled defaultValue.
Triggers expose aria-expanded/aria-controls; content regions are aria-labelledby their trigger and hidden when closed. data-state is open/closed.

Part of the Fluixi UI component library. Made with ☕ by the Fluixi team.

Examples

accordion