Tree View

1import { TreeView, TreeViewLabel, TreeViewTree, TreeViewNode } from "@/components/ui/tree-view";
2
3<TreeView />

1"use client";
2
3import { ark } from "@ark-ui/react/factory";
4import {
5  TreeView as ArkTreeView,
6  createTreeCollection as arkCreateTreeCollection,
7  type TreeCollection as arkTreeCollection,
8  useTreeViewContext as useArkTreeViewContext,
9} from "@ark-ui/react/tree-view";
10import {
11  CheckIcon,
12  ChevronRightIcon,
13  FileIcon,
14  FolderIcon,
15  FolderOpenIcon,
16  MinusIcon,
17} from "lucide-react";
18import React from "react";
19import { tv } from "tailwind-variants";
20import { cn } from "@/lib/utils";
21import { checkboxVariants } from "@/registry/react/components/checkbox";
22
23export const useTreeView = useArkTreeViewContext;
24
25export interface TreeNodeType<T = unknown> {
26  children?: TreeNodeType<T>[] | undefined;
27  expandedIcon?: React.JSX.ElementType | null;
28  icon?: React.JSX.ElementType | null;