TreeView

TreeView + TreeNode — pattern.

patternsstablea11y: untested3/3 coverageEdit on GitHub ↗
patterns-treeview--defaultOpen all variants →

When to use

  • File / folder browsers, dataset hierarchies, label taxonomies, organisation charts.
  • Nested data where the user benefits from collapsing / expanding sub-branches.
  • When parent → child structure carries meaning (a flat list wouldn't read).

When not to use

  • Flat list with no nesting → use `StructuredList` or a plain <ul>.
  • Multi-select hierarchy (checkboxes on every node) → roll your own; TreeView ships single-select only today.
  • Heavy data-grid with sort / filter — even hierarchical → `DataTable` with row grouping.