One default action, with the alternatives attached
The label fires the primary action directly; the chevron opens a menu of variants. One pill silhouette, two segments, so the common case stays one click away while the rest stays discoverable. All three variants come in default and compact sizes; hover and press the segments to see their interactive states, and the loading rows keep full colour while blocking clicks.
Primary
Secondary
Neutral
Primary, compact
Secondary, compact
Neutral, compact
// From the npm package
import { SplitButton } from 'rift-ds/components/SplitButton/SplitButton';
// Or as source you own, via the shadcn CLI
npx shadcn@latest add https://rift-ds.com/r/split-button.json