Animated list
List whose items stagger in, insert at the top, reorder with layout springs and collapse on exit, with swipe or Delete to dismiss and an optional max length.
Preview
Notifications
4Swipe a card sideways, press Delete on it, or use ×.
Standings
Round 1- 1Orchard1,284
- 2Pebble1,210
- 3Lumen1,176
- 4Tidewater1,092
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| max | number | — | AnimatedList: keep at most this many items; the tail exits. |
| stagger | boolean | true | AnimatedList: cascade the items present on first paint. |
| gap | number | 8 | AnimatedList: px between rows, as padding so a removed row collapses fully. |
| onDismiss | () => void | — | AnimatedListItem: enables swipe-to-dismiss and the Delete key; called after it leaves. |
| swipeThreshold | number | 96 | AnimatedListItem: px of travel (or a fast flick) that dismisses. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.