Namespace UI Kit is the Namespace design-system package built on HeroUI v3. It preserves HeroUI's accessible React component APIs while applying Namespace theme colors and providing shared hooks, utilities, and icons.

This pnpm and Turborepo monorepo contains:

• packages/uikit — the publishable @thenamespace/uikit package.
• apps/storybook — the component catalogue and visual development environment.

See the package README for installation, imports, theming, component subpaths, and API usage.

Requirements:

• Node.js 24 or newer
• pnpm 11

Install dependencies:

pnpm install

Start Storybook:

pnpm dev

Run the complete validation suite:

pnpm check

Build all workspace projects:

pnpm build

Install the package:

pnpm add @thenamespace/uikit

Import Tailwind CSS followed by the Namespace stylesheet in the application's main CSS entry:

@import "tailwindcss";
@import "@thenamespace/uikit/styles.css";

Import components from the root package or individual component subpaths:

import { Button, Card } from "@thenamespace/uikit";
import { Input } from "@thenamespace/uikit/input";

Component behavior and composition follow the HeroUI component documentation.

Namespace theme variables live in packages/uikit/src/styles/globals.css. After changing them, synchronize Storybook's generated theme data:

pnpm sync-theme

User-facing package changes require a Changesets entry:

pnpm changeset

The release workflow versions and publishes @thenamespace/uikit to npm. The Storybook application is private and excluded from releases.

Apache-2.0