Componente

CmTreeView

Árvore hierárquica com busca, ações e seleção.

Import

Caminho público recomendado para este componente.

import { CmTreeView, type CmTreeNode } from "cosmemilton-ui";

O prop da árvore é data={nodes}; cada item precisa de id e name.

children recebe subnós recursivos; code e slug entram na busca.

permissionId é usado em selectionMode para seleção de folhas via checkbox; id continua sendo a identidade do nó.

selectedIds é Set<number> de permissionId; crie um novo Set em onSelectionChange.

Operações de movimento usam id: onMove recebe nodeId, newParentId e newOrder.

Use externalSearch/onExternalSearchChange para controlar a busca fora do componente.

onTreeControlsReady entrega expandAll e collapseAll para botões externos.

Desative draggable quando quiser apenas navegar ou selecionar.

Shape dos nodes

Use ids estáveis: expansão, seleção e drag and drop dependem deles.

Campos obrigatórios

id e name definem a identidade e o rótulo do nó.

Campos recursivos

children recebe novos CmTreeNode para formar a hierarquia.

Hierarquia

Clique em um item para ver o caminho
Modo Solitário

Busca e seleção controladas

Controle busca, permissões selecionadas e botões externos de expandir/recolher.

Clique em um item para ver o caminho
Modo Solitário