ilinxa/pro-ui

Production-ready React components distributed via the shadcn-registry model. Built on shadcn/ui primitives + Tailwind CSS v4 + React 19. Install components into your Next.js (or any React) app with pnpm dlx shadcn@latest add @ilinxa/<slug> — source files copy into your repo, you own the code.

Demo: ui.ilinxa.com · Catalog: /r/registry.json · AI reference: /llms.txt

Install components in your app

Prerequisites

Your consumer app needs three things in place before installing any @ilinxa/* component. The CLI handles peer deps; it does NOT seed the design system itself.

1. Any React 19 host — Next.js is not required.

Components are pure React. They import only react, sibling shadcn primitives, and explicitly-declared third-party deps — never next/*. Any React 19 host works: Next.js 14/15/16 (App Router or Pages), Vite, Remix, Astro islands, RSPack, etc. Many components ship with a leading "use client" directive — load-bearing in the Next.js App Router, a harmless no-op everywhere else.

2. Tailwind CSS v4 with the shadcn token set.

This is a hard requirement, not a styling preference. Components render against semantic class names (bg-card, text-foreground, border-border, bg-primary, text-muted-foreground, ring-ring, …). Those classes only exist when Tailwind v4 reads a matching @theme inline block. Without it, the classes don't compile.

Concretely, the consumer's globals.css needs the canonical shadcn CSS variables (--background, --foreground, --card, --popover, --primary, --secondary, --muted, --accent, --destructive, --border, --input, --ring, --radius) defined under :root and .dark, plus an @theme inline block that maps them onto --color-* / --radius-* tokens. Running pnpm dlx shadcn@latest init against a v4 project does this for you.

A few components rely on extra tokens beyond the canonical set:

You don't need to copy the brand values — keep your own --primary, --background, etc. Every ilinxa component reads tokens by name, so it inherits whatever palette the host ships. The brand identity (signal-lime + cool off-white + graphite-cool dark) is only authoritative on this demo site.

3. shadcn initialized in the project.

pnpm dlx shadcn@latest init

This seeds lib/utils.ts (the cn helper that every primitive imports) and components.json (alias config). Skip if you've already used any shadcn component in the project.

Install a component

The @ilinxa namespace is listed in the official shadcn registry directory, so the CLI resolves it with zero configuration — no components.json setup needed.

# Lean install (component only)pnpm dlx shadcn@latest add @ilinxa/properties-form
# With dummy-data fixtures (separate item)pnpm dlx shadcn@latest add @ilinxa/properties-form-fixtures

The CLI auto-installs:

• shadcn primitives the component depends on (button, popover, etc.)
• npm peer deps (lucide-react, @dnd-kit/*, @codemirror/*, marked, etc.)

Files land at components/<slug>/... with the sealed folder intact — src/components/<slug>/... if your project uses a src/ directory. A custom aliases.components doesn't relocate them (imports are rewritten to your aliases either way, so the install compiles as-is).

Fallback — if your CLI can't resolve @ilinxa (older or pinned CLI versions, self-hosted mirrors), register the namespace manually in your components.json (merge with your existing config):

"registries": {  "@ilinxa": "https://ui.ilinxa.com/r/{name}.json"}

Use it

import { PropertiesForm } from "@/components/properties-form";
export function TaskEditor() {  return (    <PropertiesForm      schema={taskSchema}      values={task}      onSubmit={async (next) => { /* persist */ }}    />  );}

Per-component API + worked examples on the demo site at /components/<slug>.

Update an installed component

shadcn-registry copies source verbatim — you own the code. To pull upstream changes:

pnpm dlx shadcn@latest add @ilinxa/<slug> --overwrite

Diff against your local modifications (use --dry-run first if unsure), merge, ship.

Available components

64 components across 9 categories, each with an optional -fixtures sibling for example data. Generated from registry.json [blocked] — run pnpm build:llms after registry changes.

Compatibility

• React host — any React 19 framework. Tested on Next.js 14 / 15 / 16 (App Router & Pages Router); works in Vite, Remix, Astro, RSPack, etc. Components never import next/*.
• React version — 19 (or 18 with graceful primitive variants).
• Tailwind CSS — v4 required (CSS-vars-only config; no tailwind.config.*). The components are written against semantic Tailwind tokens (bg-card, text-foreground, border-border, …) registered through @theme inline. v3 + JS config won't compile the class names. See Prerequisites §2.
• Design tokens — canonical shadcn token set required (--background, --foreground, --card, --popover, --primary, --secondary, --muted, --accent, --destructive, --border, --input, --ring, --radius). A few components also need --chart-*, --sidebar*, --warning* — see the table in Prerequisites §2.
• Package managers — pnpm / bun / yarn. npm + React 19 needs --legacy-peer-deps.

AI / LLM access

A concise, AI-friendly registry reference is at /llms.txt.

Point Claude Code, Cursor, GitHub Copilot, or any AI assistant at this URL when working on a project that consumes the registry. It contains install steps, the full component list, common gotchas, and the fallback registry config — everything an AI needs to install components correctly without guessing.

Troubleshooting

Longer-form troubleshooting + context: /docs#troubleshooting.

FAQ

How is this different from shadcn/ui? shadcn/ui gives you primitives — button, dialog, select. pro-ui distributes what you'd normally build from those primitives: kanban boards, gantt timelines, calendars, media editors, rich-text surfaces. Same install model (source copies into your project, you own it), one level higher in composition. Every component depends on shadcn/ui; none duplicates it.

Does it work without Next.js? Yes. Components are pure React 19 and never import next/*. Vite, Remix, Astro islands, and RSPack hosts all work; the "use client" directives are no-ops outside the App Router.

Do I need Tailwind CSS v4? Yes — it's a compile-time requirement, not a preference. Components render semantic token classes (bg-card, text-foreground) that only exist when Tailwind v4 maps them via @theme inline. Tailwind v3 with a JS config won't compile them. See Prerequisites §2.

Is it free for commercial use? Yes — MIT. The installed code lands in your repo under your control, so there's no license coupling beyond the standard MIT notice.

Can an AI coding assistant install and use these components? Yes. Point it at ui.ilinxa.com/llms.txt, or use the shadcn MCP server — @ilinxa is listed in the official shadcn registry directory, so it resolves without any namespace configuration, and the registry follows the standard shadcn item schema, so search / view / add all work.

Do components update automatically after install? No — by design. The registry copies source; upstream changes only arrive when you re-run add with --overwrite. See Update an installed component.

Contributing — building components

Bug reports and PRs welcome — read CONTRIBUTING.md [blocked] first (setup, gates, PR conventions). Security reports go through SECURITY.md [blocked], other help routes through SUPPORT.md [blocked].

Stack: Next.js 16 (App Router, Turbopack, React Compiler) · React 19 · Tailwind v4 · shadcn CLI v4 · TypeScript 5 · pnpm 10 Building or modifying components? See docs/component-guide.md [blocked] — comprehensive developer reference covering anatomy, rules, design system, lifecycle, and a worked end-to-end example.

Local dev

pnpm installpnpm dev                # http://localhost:3000pnpm registry:build     # regenerate public/r/*.json from registry.json

Add a new component

pnpm new:component <category>/<slug># e.g. pnpm new:component data/stat-card

The scaffolder copies the canonical template at src/registry/components/_template/_template/, replaces tokens, writes a fresh meta.ts, and prints the 3 lines to paste into src/registry/manifest.ts. After implementing, add the component to registry.json (one base item + one -fixtures sibling) following the pattern of existing items. The vercel-build script regenerates the catalog automatically on each Vercel deploy.

Categories live in src/registry/categories.ts — data, forms, navigation, feedback, overlays, marketing, layout, media, auth.

Project shape

src/├── app/                     # docs site (consumes the registry)├── components/│   ├── site/                # site chrome — header, footer, theme toggle│   └── ui/                  # shadcn primitives (treat as third-party)├── lib/utils.ts└── registry/                # THE LIBRARY — keep portable for distribution    ├── categories.ts    ├── manifest.ts    ├── types.ts    └── components/        ├── _template/       # canonical template (excluded from manifest)        └── <category>/<slug>/            ├── <slug>.tsx   # main export            ├── parts/, hooks/, lib/            ├── types.ts            ├── dummy-data.ts # ships in <slug>-fixtures item            ├── demo.tsx     # docs-site only — NOT shipped via registry            ├── usage.tsx    # docs-site only — NOT shipped via registry            ├── meta.ts      # docs-site only — NOT shipped via registry            └── index.tsregistry.json                # source of truth for the shadcn-registry catalogpublic/r/                    # build artifacts — auto-regenerated by vercel-buildscripts/new-component.mjs

Registry import rules — registry code may import only react, @/components/ui/*, @/lib/utils, and explicitly-declared third-party deps. Never next/* or app-level concerns. This keeps every sealed folder portable across consumer projects.

Design system

• Type: Onest (sans), JetBrains Mono (mono)
• Accent: signal-lime — oklch(0.80 0.20 132) light / oklch(0.86 0.18 132) dark — paired with near-black foreground (lime is too bright for white text)
• Light surfaces: cool off-white page (oklch(0.975 0.003 250)); cards lifted to pure white for visible elevation
• Dark surfaces: graphite-cool — 0.13 base / 0.17 raised / 0.22 subtle, all at hue 250
• Motion: one orchestrated reveal-up per major page (60ms stagger), guarded by prefers-reduced-motion

Full token reference: src/app/globals.css [blocked]. The don'ts: no Inter / Roboto / Geist / system-font defaults, no pure-white page backgrounds, no neon-saturated lime, no purple-on-white gradient clichés.

Status & roadmap

User-facing changes land in CHANGELOG.md [blocked]; per-component versions in docs/component-versions.md [blocked]; the current catalog is always the live registry index.

Scripts

pnpm dev                                # next dev (Turbopack)pnpm build                              # next build (local; production uses vercel-build)pnpm vercel-build                       # shadcn build && next build (used by Vercel)pnpm registry:build                     # shadcn build only — regenerate public/r/*.jsonpnpm lint                               # ESLintpnpm tsc --noEmit                       # typecheckpnpm new:component <category>/<slug>    # scaffold a new componentpnpm dlx shadcn@latest add <name>       # add a shadcn primitive

License

MIT [blocked] — open source since 2026-08-11.