# Accordion

Vertically stacked sections that expand and collapse.

Group: Basics

## Import

```tsx
import { Accordion } from "@indoku/ui"
```

## Examples

### Basic usage

```tsx
function AccordionDemo() {
  return (
    <Accordion.Root maxW="lg" collapsible defaultValue={["a1"]}>
      <Accordion.Item value="a1">
        <Accordion.ItemTrigger>
          Is it accessible?
          <Accordion.ItemIndicator />
        </Accordion.ItemTrigger>
        <Accordion.ItemContent>
          <Accordion.ItemBody>Yes, it follows the WAI-ARIA design pattern.</Accordion.ItemBody>
        </Accordion.ItemContent>
      </Accordion.Item>
      <Accordion.Item value="a2">
        <Accordion.ItemTrigger>
          Is it styled?
          <Accordion.ItemIndicator />
        </Accordion.ItemTrigger>
        <Accordion.ItemContent>
          <Accordion.ItemBody>Yes, it's themed ala shadcn di @indoku/ui.</Accordion.ItemBody>
        </Accordion.ItemContent>
      </Accordion.Item>
    </Accordion.Root>
  )
}
```