## Voice Recorder (S—175)

Record a voice clip: live level bars scroll while recording, pause / resume, then review with play and discard.

- URL: https://sundaeui.dev/components/voice-recorder
- Category: UI components · Art direction: Refined
- Access: Sundae Pro (authenticated install)
- Stack: React 18+, TypeScript, plain CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/voice-recorder.json`
- Tags: voice, audio, recorder, record, microphone, waveform

Pressing record starts a timer and a scrolling strip of level bars from the microphone (or a simulation in the demo). Pause freezes both; Stop moves to review.
Review shows the captured waveform with Play, Discard and Send. Uses MediaRecorder and an AnalyserNode when you pass getStream.

### Usage

```tsx
import { VoiceRecorder } from '@/components/sundae/voice-recorder'

<VoiceRecorder />
```

### Props

- `getStream` (`() => Promise<MediaStream>`): Provide a mic stream; omit for the simulated demo.
- `onSend` (`(blob: Blob | null, seconds: number) => void`): Called on Send.
- `maxSeconds` (`number`, default `120`): Stop automatically after this long.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Chat, support, voice notes, interview answers.

### When not to use

- Long recordings: use a full recorder with editing.

### Accessibility

- Record / pause / stop are labelled buttons; the timer is a timer role announced each 10 seconds.
- Microphone errors are announced.
- Reduced motion removes the movement and keeps every state change.