> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cognite.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Tree view

> A Tree view primitive displays hierarchical data in a nested structure. Each row in the Tree view can be expanded to reveal child elements or collapsed to hide them. Rows can also be selected, dragged, etc., depending on the primitive’s configuration.

## Tree view

<Badge color="orange">In progress</Badge> | *Storybook link coming soon*

### When to use

* When you need to show a large structure of items with multiple levels of nested information. This primitive is ideal for presenting complex relationships and hierarchies in a clear, navigable format. For example:
  * Folders, files and related items can use the Tree primitive to illustrate their structure and relationships.
  * The primitive can be used for geographic or organizational locations or sites.
  * When you need progressive disclosure and want to minimize initial UI clutter, Tree view hierarchies can be collapsed by default, allowing the user to expand and explore only what they need.

### When to use something else

* Flat lists without nested rows: use a simple list or [Data grid](/aura-design-system/primitives/data-grid) if you need columns.
* Tabular, sortable, many attributes per row: prefer [Data grid](/aura-design-system/primitives/data-grid).
* Non-hierarchical filters for the page: use [Tabs](/aura-design-system/primitives/tabs) (including vertical tabs) or [Segmented control](/aura-design-system/primitives/segmented-control).
* Location in site hierarchy: use [Breadcrumbs](/aura-design-system/primitives/breadcrumbs); primary app nav stays in the shell pattern.

### Behavior

* Expand/collapse per node; keyboard navigation should follow tree semantics (arrows, Home/End per implementation).
* Selection may be single or multi; drag-and-drop reorder is optional and must not break accessibility when enabled.

### Often used with

* Row [Checkbox](/aura-design-system/primitives/checkbox), row [Menu](/aura-design-system/primitives/menu), [Badge](/aura-design-system/primitives/badge) for type/status; drag handles when reorder is enabled; selection highlights paired with side detail or [Data grid](/aura-design-system/primitives/data-grid) elsewhere if used in split view.

*This document is maintained by the Aura team. For questions or to propose updates, post in `#topic-aura`.*