# FAQ accordion (goodtabs UI)

A single list of questions with native details and summary disclosure.

## Install

```bash
npx shadcn@latest add https://ui.goodtabs.co/r/faq-accordion.json
```

Or, with the @goodtabs namespace configured in components.json: `npx shadcn@latest add @goodtabs/faq-accordion`

## Usage

```tsx
import { FaqAccordion } from "@/components/faq-accordion"

<FaqAccordion name="faq" items={[{ question: "Is it free?", answer: "Yes, MIT licensed." }]} />
```

## Props

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| items | `FaqItem[]` |  | question and answer, in order. |
| name | `string` |  | Shared name so opening one closes the rest. |
| defaultOpen | `number` |  | Index of an item that starts open. |

## When to use

- A short FAQ of three to eight questions
- When find in page and no JavaScript matter
- Pricing, signup and support pages

## When not to use

- For grouped questions, use faq-tabs
- For app navigation with nested items
- When panels need animated height

## Notes for agents

- Server component built on details and summary, so semantics and keyboard are native
- The name attribute gives exclusive opening in current browsers
- Chevron rotates 150ms and is removed under reduced motion
- Items are keyed by question text, keep questions unique

Docs: https://ui.goodtabs.co/components/faq-accordion