KQ-178 · EXPANDER/TREE

Expander Tree

A nested disclosure that opens with a little procession. Expanding a node glides its panel to height while a guide line draws down the indent and the children arrive one after another, so the hierarchy reads as it unfolds rather than snapping open.

KQ-178 · EXPANDER/TREE
    • utils.ts

Expand children cascade in

Install

One command — the source lands in your repo. Or copy it from the Code tab.

$ pnpm dlx shadcn@latest add @kinetiq/expander-tree

Props

PropTypeDefaultDescription
nodesTreeNode[]The tree; each node has a label and optional children.
defaultExpandedstring[]Node ids expanded on first render.