Tree View

A collapsible hierarchical list — file explorers, org charts, taxonomy editors. Folders auto-pick a Folder/FolderOpen icon, leaves pick a File icon, and the indent scales with indentSize.

Installation

Props

PropTypeDefaultDescription
data*
TreeNode[]Hierarchical data. Each node has id, name, optional children, optional icon, and optional data payload.
selectedId
stringHighlighted node id.
onSelect
(node: TreeNode) => voidCalled when a node is clicked.
expandedIds
string[]Controlled list of expanded folder ids.
onExpandChange
(ids: string[]) => voidCalled when folders are expanded or collapsed.
showIcons
booleantrueRender default folder/file icons.
indentSize
number16Pixel indent per level.