## FAQ Search (S—215)

A searchable FAQ: matches highlight in questions and answers, topics filter the list, and answers open in place.

- URL: https://sundaeui.dev/components/faq-search
- Category: UI components · Art direction: Refined
- Access: Free (no account needed)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/faq-search.json`
- Tags: search, help-center, support, accordion, highlight, faq

Typing filters questions and answers together and highlights every match. Matching answers open automatically so the hit is visible.
Topic chips narrow the list; a no-results state offers a contact link. Each answer has a “Was this helpful?” pair.

### Usage

```tsx
import { FaqSearch } from '@/components/sundae/faq-search'

<FaqSearch />
```

### Props

- `items` (`{ q: string; a: string; topic: string }[]`, required): Questions.
- `contactHref` (`string`): Link for no results.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Help centres, pricing pages, onboarding.

### When not to use

- Long documentation: use full search with pages.

### Accessibility

- Questions are buttons with aria-expanded controlling their answers.
- The result count is announced; highlights use <mark>.
- Reduced motion removes the movement and keeps every state change.