ns-ui
A kanban board drawn as box-drawing frames, each column header showing its card count against its WIP limit; going over turns the frame accent and appends the overflow count, mid-drag, before you release.
Use when a kanban or triage board where each column's work-in-progress limit must be readable in the header and visibly crossed while a card is still in the air; pick reorder-drag-wake instead when there is a single vertical list and the interest is the physics of neighbours shouldering aside rather than a per-column capacity signal, or queue-triage-ratchet when items advance through one queue rather than moving between columns.
Install
npx shadcn add https://design.helpmarq.comns-ui / board-kanban-ascii-wip
drag a card, or focus one and use the arrow keys · Review is 2 over its limit
| Prop | Type | Default | Description |
|---|---|---|---|
| columns | WipColumn[] | — | — |
| width? | number | — | column width in monospace character cells (the frame tiles to exactly this) |
| onChange? | (columns: WipColumn[]) => void | — | fires on every committed move, pointer or keyboard |
| onOverLimit? | (columnId: string, over: number) => void | — | fires per commit for the receiving column: `over` is count - limit, 0 when within policy |
| className? | string | — | — |
| aria-label? | string | — | — |