Tree View

Data

Hierarchical tree navigator with expand/collapse, selection and keyboard navigation.

🚧

Demo coming soon

Add a demo component to DEMOS in _showcase.tsx for data/tree-view

Instalação via CLI

$ npx kikitocn add tree-view

Exemplo de uso

Tree ViewExample.tsx

import { TreeView } from "@/components/ui/cn/tree-view/TreeView";

export function TreeViewExample() {
  return (
    <TreeView />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`nodes*`	`TreeNode[]`	—	Array de nós { id, label, children?, icon? }
`selected`	`string`	—	ID do nó selecionado (controlado)
`expanded`	`string[]`	—	IDs dos nós expandidos (controlado)
`defaultExpanded`	`string[]`	—	IDs expandidos por padrão
`onSelect`	`(id: string, node: TreeNode) => void`	—	Callback ao selecionar nó
`onExpand`	`(expanded: string[]) => void`	—	Callback ao expandir/colapsar
`className`	`string`	—	Classes CSS extras

Carregando…