Weekly active
18,240+6.2%
Masonry Grid
Balanced masonry layout from measured heights with container-driven columns, DOM-order placement for sensible Tab order, animated re-layout on filter, filter chips and load more.
Preview
Stat Note Launch checklist
Freeze copy Thursday. Ines owns the changelog; Malik checks the status page. Screenshots in both themes.
Chart Signups10 weeks
Quote “The new export saved our finance team a full day every month.”
— Priya, ops lead Note Retro
Keep: pairing on reviews. Change: fewer status meetings.
Stat Median load
212 ms−38 ms
Chart Churn10 weeks
Quote “Setup took ten minutes, not ten days.”
— Tomás, founder Note Ideas
Saved views per team. Keyboard-first command bar. A calmer empty state for new workspaces, with one clear next step.
Install
Pro source requires Pebble Pro. Try the full preview above.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| items / getKey / renderItem | T[] / (item) => string / (item, index) => ReactNode | — | Data, stable keys (drive the move animation) and the item renderer. |
| minColumnWidth / maxColumns | number | 220 / 4 | Column count follows the container width within these bounds. |
| gap | number | 12 | Space between items in px. |
| defaultColumns | number | 3 | Columns before measuring (server render, CSS columns fallback). |
| hasMore / loading / onLoadMore | boolean / boolean / () => void | false | Load more button under the grid. |
| empty | ReactNode | — | Shown when there are no items. |
| label | string | "Items" | Accessible name of the list. |
| MasonryFilters | { options; value; onValueChange } | — | Single-select filter chip row with optional counts. |
Pro component
Try the full preview above. Editable source and build guides require Pebble Pro.