# Data Tree View

Accessible tree view with expand and collapse, keyboard navigation and checkboxes with indeterminate state.

- id: `data-tree-view`
- Page: https://agentic-ui-kit.com/components/data-tree-view
- Live preview: https://agentic-ui-kit.com/live/component/data-tree-view?piece=data-tree-view

## Install

```bash
agentic-ui add data-tree-view
npx shadcn@4.17.0 add @agentic-ui/data-tree-view
```

## Metadata

- **Level:** block
- **Category:** block
- **Installable in:** Radix UI (registry variant new-york), Base UI (registry variant base-vega)
- **Capabilities:** wai-aria-tree, roving-tabindex, type-ahead, expand-collapse, tri-state-checkboxes, drag-and-drop-reorder, keyboard-reorder, virtualized-rows, live-announcements, reduced-motion, dark-mode
- **Intents:** navigate, manage-collection, configure
- **Suits domains:** devtools, knowledge, settings, saas, operations, ai-workspace
- **Interaction:** keyboard-focus, expand-collapse, check, drag-drop, type-ahead
- **Screen role:** management
- **Density:** comfortable
- **Dark mode:** yes
- **Use it for:** accessible tree view with expand and collapse, keyboard navigation and checkboxes with indeterminate state, draggable tree to reorder categories or help center articles, nested folders, drag and drop, virtualized tree view for thousands of nodes with type-ahead and roving tabindex, permissions or taxonomy picker as a checkable tree where parents show partial selection
- **Avoid when:** a table whose rows have a hierarchy and several data columns (use table-tree-hierarchy), files in a code workspace with change badges and a context menu (use data-file-tree), a flat list of options: a listbox or select is simpler
- **Preserve when adapting:** aria-tree-roles, roving-tabindex, leaf-only-checked-set, keyboard-reorder
- **Replace when adapting:** nodes, labels, meta, height
- **Adaptation effort:** low
- **Coupling:** low
- **Quality breakdown:** visual 9/10, responsive 9/10, accessibility 9/10, code 9/10
- **npm dependencies:** lucide-react, @dnd-kit/core, @tanstack/react-virtual
- **npm dependencies (registry):** @dnd-kit/core@6.3.1, @tanstack/react-virtual@^3.13.12, lucide-react@0.577.0
- **Registry dependencies:** lib-primitives