## Status Picker (S—129)

Set your status from presets or custom text, choose when it clears, and see it on your avatar badge right away.

- URL: https://sundaeui.dev/components/status-picker
- Category: Forms & inputs · 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/status-picker.json`
- Tags: slack, presence, status, availability, profile, away

Presets like In a meeting or Focusing fill the field with a symbol and default duration. Custom text works too, and Clear after picks from 30 minutes to Don’t clear.
The avatar preview at the top updates live, and the badge shows Away, Busy or Available.

### Usage

```tsx
import { StatusPicker } from '@/components/sundae/status-picker'

<StatusPicker />
```

### Props

- `presets` (`{ icon: string; text: string; clear: string }[]`): Preset statuses.
- `onSave` (`(s: { text: string; icon: string; clear: string; presence: string }) => void`): Called on save.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- Team chat, collaboration and support tools.

### When not to use

- Consumer apps where presence is a privacy risk.

### Accessibility

- Presets are buttons; presence is a radiogroup; Clear after is a native select.
- Saving is announced.
- Reduced motion removes the movement and keeps every state change.