Download Button
A controlled download pill: a progress ring inside the button with cancel on hover, a done check, then an Open state, with retry on error and no width change.
Preview
q3-board-report.pdf
PDF · 12.4 MB
brand-assets.zip
ZIP · 126 MB
Download failed
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| state | "idle" | "downloading" | "complete" | "error" | — | Controlled phase. complete shows a brief check, then Open. Required. |
| progress | number | 0 | 0 to 1 while downloading; fills the ring inside the button. |
| onStart / onCancel / onOpen | () => void | — | Click handlers for idle or error, downloading, and the Open phase. |
| label / meta / openLabel | ReactNode | "Download" / — / "Open" | Idle label, a size beside it, and the finished label. |
| doneHold | number | 1200 | Ms the Downloaded check shows before Open. |
| variant | "primary" | "secondary" | "primary" | The lit key, or a raised card pill. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.