Confetti Button
A celebrate button: pending spinner, then a drawn-tick success morph and a short burst of drawn confetti from the button, with an error shake on failure.
Preview
Changelog · draft
2.14: Shared views
Save a filter set and send it to your team. 6 sections, 2 images.
Visible to 1,284 subscribers
Shipped
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| onAction | () => unknown | — | The action. Return a promise for a pending state; resolving celebrates. |
| successLabel / pendingLabel / errorLabel | ReactNode | "Done" / children / "Try again" | Labels for each state. |
| variant | "primary" | "secondary" | "primary" | The lit key, or a raised card pill. |
| size | "md" | "lg" | "md" | 36 or 44 px tall. |
| particles | number | 28 | Confetti pieces per burst; 0 for none. |
| resetAfter | number | 2400 | Ms before returning to idle after success or error. 0 stays. |
| status / onStatusChange | "idle" | "pending" | "success" | "error" | — | Controlled status, e.g. a finished state in a static mock. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.