ns-ui
A dock/toolbar where items lean like books on a shelf — hover or focus straightens one and cants its neighbors away, reorder is a pick-up/move/drop cycle, nothing ever scales.
Use when Use when a dock, favorites bar or pinned-item row needs a quieter emphasis mechanic than magnification — hover/focus straightens one item and leans its neighbors away by a few degrees, with a small breathing gap, so labels and hit areas never move except a 2px lift. Pick dock-cursor-magnify instead when cursor-proximity magnification and Gaussian falloff scale is the wanted effect; pick dock-shelf-lean when scale must stay fixed (stable hit targets, denser rows, a more restrained posture-only read) and when the row also needs first-class keyboard reordering.
Install
npx shadcn add https://design.helpmarq.com /r/dock-shelf-lean.json| Prop | Type | Default | Description |
|---|---|---|---|
| items | ShelfCantItem[] | — | — |
| label? | string | — | accessible name for the toolbar row itself |
| onReorder? | (items: ShelfCantItem[]) => void | — | fires with the new order after every reorder step (swap or drop) |
| className? | string | — | — |