## Split Button (S—115)

A primary action with a chevron that opens related variants; picking one makes it the new default action.

- URL: https://sundaeui.dev/components/split-button
- 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/split-button.json`
- Tags: actions, merge, menu, split-button, dropdown, button

The main half runs the current action. The chevron half opens a menu of alternatives, each with a short description. Choosing one runs it and, optionally, remembers it as the default, so the label morphs to match.
Common for Merge / Squash / Rebase, Save / Save as draft, Send / Schedule.

### Usage

```tsx
import { SplitButton } from '@/components/sundae/split-button'

<SplitButton />
```

### Props

- `actions` (`{ id: string; label: string; detail?: string }[]`, required): Actions; the first is the default.
- `onAction` (`(id: string) => void`): Called when an action runs.
- `remember` (`boolean`, default `true`): Make the last chosen action the default.
- `fill` (`'dark' | 'light'`, default `'dark'`): Surface: dark or light.

### When to use

- A primary action with a few closely related alternatives.

### When not to use

- Unrelated actions: use a plain menu.

### Accessibility

- Two buttons in a group: the action, and a menu button with aria-haspopup and aria-expanded.
- The menu uses role="menuitemradio" with the default checked.
- Reduced motion removes the movement and keeps every state change.

### Keyboard

- ↓ (on chevron): Open menu
- ↑ / ↓: Move
- Esc: Close