Reference
@309-thingspire/ui CLI
Copies component source, types, and tokens into your project. No runtime dependency — once installed the files are yours to edit.
Quick start
From the root of any React 19 project:
npx @309-thingspire/ui@latest initnpx @309-thingspire/ui@latest add button checkbox inputnpx @309-thingspire/ui@latest add iconsCommands
| Command | What it does |
|---|---|
init | Create a design-library.json at the cwd with registry URL, components dir, and tokens path. |
add <slug…> | Fetch one or more components from the registry intocomponentsDir. On conflict, existing files are skipped unless --overwrite is passed. |
list | Print every available slug grouped by category (atoms / molecules / organisms). |
help | Print command reference. |
Flags & environment
| Name | Effect |
|---|---|
--registry <url> | Override registry URL for this invocation. |
--overwrite | Replace existing local files when running add (default: skip on conflict). |
THINGSPIRE_UI_REGISTRY | Environment variable that overrides the registry URL globally. |
design-library.json
Generated by init. Edit any field if your project layout differs — the CLI reads it on every add.
{
"registry": "https://thingspire-dsg.vercel.app/r",
"componentsDir": "components",
"tokensCss": "styles/tokens.css"
}Registry endpoints
Static JSON mirrors are served from the CDN; the same shape is also available from a Next.js API route as a fallback.
| URL | Content |
|---|---|
/r/index.json | Array of { slug, label, category, description } |
/r/<slug>.json | Full bundle: { name, slug, files: [{ path, type, content }], dependencies, registryDependencies } |
/r/icons.json | IconLibrary metadata + every generated icon-*.tsx + barrel index.ts / types.ts in one bundle. |
/api/registry | Same shape as /r/index.json. |
/api/registry/<slug> | Same shape as /r/<slug>.json. |
Examples
Add a curated set
npx @309-thingspire/ui add button checkbox input dropdown badgeRefresh after the upstream library updated
npx @309-thingspire/ui add button --overwritePin to a specific deployment
Each Vercel deployment keeps its own immutable URL. Set the env var to lock against drift:
export THINGSPIRE_UI_REGISTRY=https://thingspire-<deployment>.vercel.app/r
npx @309-thingspire/ui add buttonInspect what a slug ships
curl -s https://thingspire-dsg.vercel.app/r/button.json | jq '.files[] | .path'