Getting started

Feature Kits is a pnpm monorepo of workspace packages. This guide gets a fresh checkout running, then points to the foundation pages for application integration.

PrerequisitesCopy Anchor Link

• Node.js 24+
• pnpm 9+

Run the playgroundCopy Anchor Link

git clone https://github.com/jayantrohila57/feature-kit.git
cd feature-kit
pnpm install
pnpm dev

Open http://localhost:3000 for the landing page and /docs for kit documentation with live previews.

Production build (Vercel uses apps/web as the app root):

pnpm build

Monorepo layoutCopy Anchor Link

Add a kit to your appCopy Anchor Link

// apps/your-app/package.json
"dependencies": {
    "form": "workspace:*"
    "data-table": "workspace:*"
    "layout": "workspace:*"
}

// next.config.ts
transpilePackages: ["form", "data-table", "layout"]

import { FormKit } from "form"
import { DataTable, DataTableNuqsAdapter } from "data-table"
import { FormSection, Breadcrumbs } from "layout"

List every workspace kit you import in transpilePackages inside apps/web/next.config.ts. See Installation for the complete integration path.

Configure providersCopy Anchor Link

Most examples assume the playground providers in apps/web/src/app/providers.tsx. Their roles and a reusable composition are documented in Providers.

Documentation mapCopy Anchor Link

1. Introduction — positioning and composition model
2. Architecture — package boundaries and ownership
3. Installation and Providers — app setup
4. Kit pages — Form, Data table, Layout, Uploader, UI
5. Examples — isolated previews per scenario

Each kit page follows the same recipe: when to use → install → preview + code → recipes → props → gotchas → examples.

Other workspace packagesCopy Anchor Link

Inspect package.json exports and feature/*/src for the full public API.

Next stepsCopy Anchor Link

• Build a form with Form
• Add a listing with Data table
• Browse Examples for copy-paste starting points