Accordion

Expandable panels with a smooth height animation, single & multiple modes, and full keyboard support.

@akex/accordion

Installation

npm install @akex/accordion

Usage

import {
  Accordion,
  AccordionItem,
  AccordionTrigger,
  AccordionContent,
} from "@akex/accordion";

<Accordion type="single" defaultValue="a">
  <AccordionItem value="a">
    <AccordionTrigger>Is it accessible?</AccordionTrigger>
    <AccordionContent>Yes — it follows the WAI-ARIA pattern.</AccordionContent>
  </AccordionItem>
</Accordion>

Single — one panel open at a time

Akex is a monorepo of small, accessible, animated React components published as scoped npm packages.

Multiple — open several at once

Props

Prop	Type	Default	Description
type	string	"single"	"single" closes others; "multiple" allows many open
defaultValue	string \| string[]	—	Initially open item(s) when uncontrolled
value	string \| string[]	—	Controlled open item(s)
onValueChange	(value: string[]) => void	—	Called with the new open values on every toggle

Back