ns-ui
File/directory tree drawn with real box-drawing connectors, whose glyphs redraw themselves as folders expand and collapse instead of static per-level guides.
Use when a tree whose connector glyphs (├── └── │) are the medium itself, drawn in monospace with a bottom-up retract sequence that flips a sibling's ├── into └── the instant its neighbor's row vanishes; pick tree-root-trace instead for an SVG-drawn indent guide with a continuous root-system animation.
Install
npx shadcn add https://design.helpmarq.com /r/tree-box-drawing.jsonns-ui / tree-box-drawing
arrow keys move · → expands · ← collapses · enter selects
| Prop | Type | Default | Description |
|---|---|---|---|
| label | string | — | Accessible name for the tree, e.g. "Project files". |
| nodes | BoughNode[] | — | — |
| defaultExpandedIds? | string[] | — | Node ids expanded on first render, statically — no reveal sequence for these. |
| className? | string | — | — |