---
name: accordion
category: disclosure
summary: "Collapsible panels, one or multiple open at a time"
subpath: "@42/core/accordion"
---

Collapsible panels. One or multiple open at a time.

```html
<div data-c42-accordion>
  <div data-c42-accordion-item data-value="a">
    <button data-c42-accordion-trigger>Title</button>
    <div data-c42-accordion-panel>Content</div>
  </div>
</div>
```

```ts
import { Accordion } from '@42/core/accordion';
new Accordion(root, { multiple: false, collapsible: true, defaultValue: null });
```

Options: `multiple`, `collapsible`, `defaultValue`
Events: `accordion:change` → `{ value: string[] }`