Дерево навигации

NavigationTree поддерживает вложенные пункты с иконками, описаниями и завершающим содержимым, управляемое и неуправляемое раскрытие и сворачивание, опциональный выбор чекбоксами с автовыбором родителей и потомков, плоский вариант и вариант с рамками групп, направляющие линии и полную навигацию с клавиатуры с единой точкой табуляции.

Пример

Интерактивный пример

Использование

Импортируйте компонент из публичной точки входа пакета.

import { NavigationTree } from "denjs-ui";

const items = [
  {
    id: "acme",
    label: "Acme Inc",
    description: "2 teams",
    href: "#acme",
    children: [
      { id: "design", label: "Design", href: "#design", current: true },
      { id: "engineering", label: "Engineering", href: "#engineering" },
    ],
  },
];

export function Example() {
  return <NavigationTree aria-label="Organizations" items={items} />;
}