Installation

TreeKit is published as a single package with no required peer dependencies beyond React itself.

Requirements

React 18 or newer (React 19 is supported).
A bundler that handles ES modules — Vite, Next.js, Create React App, Remix, etc.

$ npm install @treekit-ui/core

Import the stylesheet

TreeKit ships one small CSS file with sensible defaults, built entirely on CSS custom properties. Import it once, anywhere in your app's entry point:

import "@treekit-ui/core/styles.css";

Using Next.js App Router?

Import it in your root app/layout.tsx alongside your global stylesheet. It works identically in Server and Client Components — the import itself has no runtime behavior, it just registers the CSS.

TypeScript

No separate @types package is needed — TreeKit ships its own type declarations. Every export, including the generic TreeNode<T> type, is fully typed out of the box.

Verifying the install

Render a minimal tree to confirm everything is wired up correctly:

App.tsx

import { TreeKit } from "@treekit-ui/core";
import "@treekit-ui/core/styles.css";

export default function App() {
  return <TreeKit data={[{ id: "1", label: "Hello, TreeKit" }]} />;
}

If you see a single row reading "Hello, TreeKit" with default TreeKit styling (rounded hover states, a checkbox), the install is complete. Continue to Quick Start to build a real tree.

← PreviousIntroduction Next →Quick Start