# Setup & Configuration

> Generated reference (regen-owned; see [index.md](index.md)). Loads only under `primitives: nurix` — this is the wiring a project needs before any `@nurix/components` import resolves.

## Package

`@nurix/components` — published to the public npm registry (`registry.npmjs.org`) under the restricted `@nurix` scope. Only `dist/` ships. Peer dependencies: `react ^19`, `react-dom ^19`. Source of truth: `github.com/nurixlabs/components`.

## Installing

The scope is restricted, so the consumer project needs an npm token with read access to `@nurix` in its `.npmrc`:

```ini
//registry.npmjs.org/:_authToken=${NPM_READ_TOKEN}
```

Then install with the project's package manager (detect from the lockfile): `npm install @nurix/components`.

## Styles (required)

In the consumer's CSS entry, after Tailwind v4:

```css
@import "tailwindcss";
@import "@nurix/components/styles.css";
```

The shipped `styles.css` is **not** precompiled — it carries the design tokens, base layer, and an embedded `@source "./**/*.js"` directive, so the consumer's Tailwind v4 build scans the package's compiled JS and generates every utility class the components use. The project must have Tailwind v4 set up; it does **not** add its own `@source` for this package.

The design skill's token artifact (CSS custom properties emitted from the project `design.md`) layers over these tokens — theme blocks carry specificity armor precisely so this package's `:root` block cannot defeat them.

## Import pattern

Use subpath imports — each published entry maps to one; never import from the root barrel in generated code:

```tsx
import { Button } from "@nurix/components/element/button";
import { Cell } from "@nurix/components/compound/cell";
import { defineColumn } from "@nurix/components/block/table";
```