import { Meta, Title, Subtitle, Description, Primary, Controls, Stories, Canvas } from '@storybook/addon-docs/blocks';
import * as TreeViewStories from './tree-view.stories';

<Meta of={TreeViewStories} />

<Title />
<Subtitle>An interactive hierarchical view for navigating nested data structures.</Subtitle>

<Description />

<Primary />

---

## Variations

<Stories />

---

## AI Best Practices

> [!IMPORTANT]
> - **Unique Identifiers** — Every node in the data array must have a globally unique `id` to properly manage collapse and selection states.
> - **Icon Consistency** — Use the same icon set (e.g., Lucide) and sizing (`h-4 w-4`) across all tree nodes for a professional look.
> - **Recursive Layout** — The component handles recursion automatically; you only need to provide the nested `children` array in your data object.