Search

Jump to any block or page in the showcase.

Tree

One tree, three capability tiers.

Read only

Rows, icons, selection and disclosure. Five props, no hook, and not a byte of drag handler.

src
level 1
level 2
file-2.ts
file-1.ts
LICENSE
README.md

Drag and drop

The 28/44/28 zones, the drop markers, and a branch dropped into its own subtree refused.

empty
src
level 1
level 2
file-2.ts
file-1.ts
LICENSE
README.md

Resolved parent: nothing moved yet

A branch row splits 28% / 44% / 28% into before, inside and after. A leaf splits in half, because it cannot hold children. Drag a branch onto anything inside itself and nothing happens: the line above does not move.

Full editor

Inline rename, a context menu of your own verbs, the pane resizer and a trailing badge.

empty
src
level 1
level 2
file-2.ts2
file-1.ts1
LICENSE
README.md3

Right-click a row for the menu. The verbs are this page's, not the component's: it takes a slot and wraps the row in a trigger only when one is given.

Drag the edge to resize, double-click it to reset. The handle reports the width and never clamps it, so bounds stay where the pane's owner put them.