# FAQ accordion

> A FAQ section: questions and answers built on Base UI's Accordion. Each question is a button inside a heading, browser search finds text in closed answers, and you can add FAQPage structured data.

Facade UI item `faq-accordion` (block, section).
Docs page: https://facadeui.dev/components/faq-accordion · Registry JSON: https://facadeui.dev/r/faq-accordion.json

## Install

```bash
npx shadcn@latest add @facade/faq-accordion
```

Or by URL: `npx shadcn@latest add https://facadeui.dev/r/faq-accordion.json`. The CLI also installs what it needs: @base-ui-components/react@1.0.0-rc.0, lucide-react@^1.47.0, @facade/container, @facade/heading, @facade/section, @facade/section-header, @facade/types, @facade/utils.

Files: `components/sections/faq-accordion.tsx`

Usage example as an installable item: `npx shadcn@latest add @facade/faq-accordion-demo` (lands in components/examples/).

## Usage

The source of the preview on the docs page. `./content` holds sample data.

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

import { FAQS } from "./content"

export function Demo() {
  return (
    <FaqAccordion
      eyebrow="FAQ"
      title="Questions, answered"
      items={FAQS}
      defaultOpen={["faq-is-facade-ui-free"]}
      align="center"
      schemaOrg
    />
  )
}
```

## Props

### FaqAccordionProps

Extends SectionBaseProps, ListSlotProps.

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `items` (required) | `FaqItem[]` |  |  |
| `title` | `string` |  |  |
| `eyebrow` | `string` |  |  |
| `description` | `string` |  |  |
| `defaultOpen` | `string[]` | `[]` | Questions that start open, by `value` (or question slug). |
| `multiple` | `boolean` | `false` | Allow several answers open at once. Default `false`. |
| `itemHeadingLevel` | `HeadingLevel` |  |  |
| `hiddenUntilFound` | `boolean` | `true` | Lets browser find-in-page reach closed answers. Default `true`. |
| `align` | `"start" \| "center"` | `"start"` |  |
| `schemaOrg` | `boolean` | `false` | Adds FAQPage JSON-LD for the items with plain-text answers. |