tree-links

PreviousNext
Docs
takiexample

Preview

Loading preview…
registry/new-york/examples/tree-links.tsx
import { Tree, TreeItem } from "@/registry/new-york/ui/tree"

export default function TreeLinksDemo() {
  return (
    <Tree
      aria-label="Navigation"
      className="w-64"
      defaultExpandedKeys={["components", "hooks"]}
    >
      <TreeItem id="components" title="Components">
        <TreeItem id="button" title="Button" href="/docs/components/button" />
        <TreeItem id="input" title="Input" href="/docs/components/input" />
        <TreeItem id="tree" title="Tree" href="/docs/components/tree" />
      </TreeItem>
      <TreeItem id="hooks" title="Hooks">
        <TreeItem
          id="use-state"
          title="useState"
          href="/docs/hooks/use-state"
        />
        <TreeItem
          id="use-effect"
          title="useEffect"
          href="/docs/hooks/use-effect"
        />
      </TreeItem>
    </Tree>
  )
}

Installation

npx shadcn@latest add @taki/tree-links

Usage

import { TreeLinks } from "@/components/tree-links"
<TreeLinks />