synthesisui 0.16.289 → 0.16.291

package/dist/commands/add.js

@@ -268,6 +268,8 @@ export async function add(slug, opts) {
          * repositório, e é ele que avisa quando uma delas deixa de resolver.
          */
         ...(theirVars.pointed > 0 ? { theirVars: theirVars.pointed } : {}),
+        /** Ver `RootLock.tokenMap`: o fato, ao lado do número que ele produz. */
+        ...(theirVars.pairs.length > 0 ? { tokenMap: theirVars.pairs } : {}),
         ...(scope ? { scope } : {}),
         ...(systems.length > 0 ? { scopes: systems } : {}),
         ...(usage.length > 0 ? { usage } : {}),
@@ -394,6 +396,29 @@ export async function add(slug, opts) {
      * `var(--color-ink-500)` num arquivo "gerenciado pelo synthesisui" e não tem como saber de onde
      * veio. Dito assim, ele lê a linha como o que ela é - o sistema seguindo o vocabulário dele.
      */
+    /**
+     * ELE RENOMEOU UM TOKEN, E A GENTE DIZ - antes era um silêncio que o sistema pagava.
+     *
+     * `their-vars.ts` decidiu NÃO emitir `var(--x, #valor)` justamente para não pintar o valor velho
+     * por cima de um rename dele: *"se ele renomear, quebra, e o `doctor` diz qual"* (dono, 22/08). A
+     * quebra é deliberada e continua. O que faltava era ele saber ANTES de abrir a tela e ver a cor
+     * sumida - o mapa anterior está no `.lock`, o novo acabou de ser calculado, e a diferença é uma
+     * comparação.
+     *
+     * SÓ O RENAME, e não a troca de valor: trocar o valor não quebra nada - a folha aponta para o nome
+     * dele e a cor nova passa a valer, que é o comportamento que a gente promete. Renomear é o que
+     * deixa a referência apontando para o vazio.
+     */
+    const renamed = (prev?.tokenMap ?? []).filter((before) => {
+        const now = theirVars.pairs.find((p) => p.ours === before.ours);
+        return now && now.theirs !== before.theirs;
+    });
+    if (renamed.length > 0) {
+        console.log(`  ${renamed.length} token${renamed.length === 1 ? "" : "s"} you renamed since the last install: ${renamed
+            .slice(0, 3)
+            .map((r) => `${r.theirs} → ${theirVars.pairs.find((p) => p.ours === r.ours)?.theirs ?? "?"}`)
+            .join(", ")}${renamed.length > 3 ? ", …" : ""}. The system follows the new name from here.`);
+    }
     if (theirVars.pointed > 0)
         console.log(`  ${theirVars.pointed} value${theirVars.pointed === 1 ? "" : "s"} in tokens.css now point at the name YOUR code already gives ${theirVars.pointed === 1 ? "it" : "them"} - change yours and the system follows${theirVars.pruned > 0 ? `; ${theirVars.pruned} matched but your build does not emit ${theirVars.pruned === 1 ? "that name" : "those names"}, so ${theirVars.pruned === 1 ? "it keeps" : "they keep"} the value` : ""}`);
     /**

package/dist/commands/component.js

@@ -8,6 +8,7 @@ import { hasInteractiveTemplate, interactiveTemplate, } from "../interactive-tem
 import { body, section, snippet } from "../output.js";
 import { findCollision, reactMajorOf, readInstalledConvention, readInstalledScheme, } from "../project-facts.js";
 import { fetchComponent, RegistryError } from "../registry.js";
+import { inTheirTongue, tongueOf } from "../their-tongue.js";
 import { readCensus, unreadComment, unreadForComponent, } from "../unread-for-component.js";
 /**
  * Writes the shared `cn.ts` next to the components, built from THIS project's
@@ -65,12 +66,41 @@ export async function component(slug, name, opts) {
     // o .tsx é materializado logo abaixo, ninguém as lê depois (medido na
     // auditoria de 16/08), e cada arquivo a mais no repo dele é superfície.
     const config = await readProjectConfig(root);
+    /**
+     * O CSS PASSA A FALAR A LÍNGUA DELE - ver `inTheirTongue`.
+     *
+     * O QUE MUDA NO ARQUIVO QUE ELE ABRE: `color: var(--ds-color-ink-900)` vira
+     * `color: var(--color-ink-900)`, o nome que o código dele já dá àquele valor. É isso que faz a
+     * nossa folha de 3945 linhas deixar de ser necessária no repositório de origem - o `globals.css`
+     * dele já declara o token, e a decisão continua sendo dele.
+     *
+     * AQUI E NÃO NO SERVIDOR, que é onde o CSS é compilado: o mapa descreve ESTE repositório. O mesmo
+     * sistema instalado em outro projeto dele não tem os mesmos nomes declarados, e traduzir lá
+     * apagaria a cor. Um projeto de destino chega sem mapa no `.lock`, nada é traduzido, e a folha
+     * continua sendo o caminho - o comando DIZ qual dos dois aconteceu.
+     */
+    const tongue = await tongueFor(root, slug);
+    const spoken = tongue ? inTheirTongue(res.css, tongue) : null;
+    const css = spoken ? spoken.css : res.css;
+    /**
+     * E ELE FICA SABENDO - traduzir em silêncio é a outra metade do mesmo erro.
+     *
+     * A última linha é a que decide se a nossa folha ainda é necessária aqui, e ela é a diferença
+     * entre "seu repositório dispensa a folha" e "quase" - dizer a primeira quando a verdade é a
+     * segunda é a promessa que quebra na tela dele.
+     */
+    if (spoken && (spoken.named > 0 || spoken.inlined > 0)) {
+        console.log(`  ${spoken.named} reference${spoken.named === 1 ? "" : "s"} now speak${spoken.named === 1 ? "s" : ""} the name YOUR code gives the value${spoken.inlined > 0 ? `, and ${spoken.inlined} carr${spoken.inlined === 1 ? "ies" : "y"} the value because your code names no token for it` : ""}.`);
+        console.log(spoken.left.length === 0
+            ? `  Nothing in this file points at our stylesheet - it renders on your own tokens alone.`
+            : `  ${spoken.left.length} still point${spoken.left.length === 1 ? "s" : ""} at our stylesheet (${spoken.left.slice(0, 3).join(", ")}${spoken.left.length > 3 ? ", …" : ""}), so tokens.css is still needed here.`);
+    }
     const artifactsAreTheProduct = opts.artifactsOnly === true || config.target !== "next";
     if (artifactsAreTheProduct) {
         const dir = join(root, "_synthesisui", "ds", slug, "components");
         await mkdir(dir, { recursive: true });
         await writeFile(join(dir, `${res.name}.json`), `${JSON.stringify(res.recipe, null, 2)}\n`, "utf8");
-        await writeFile(join(dir, `${res.name}.css`), `${res.css}\n`, "utf8");
+        await writeFile(join(dir, `${res.name}.css`), `${css}\n`, "utf8");
         console.log(`✓ ${res.name} → _synthesisui/ds/${slug}/components/${res.name}.{json,css}  (${slug} v${res.version})`);
     }
     // 2. YOUR component - a real, importable `export function <Pascal>()` in the
@@ -151,12 +181,12 @@ export async function component(slug, name, opts) {
             // template drives itself off the .ds-* classes.
             const tsx = interactiveTemplate(res.name);
             await writeFile(join(compDir, `${res.name}.tsx`), tsx, "utf8");
-            await writeFile(join(compDir, `${res.name}.css`), `${res.css}\n`, "utf8");
+            await writeFile(join(compDir, `${res.name}.css`), `${css}\n`, "utf8");
             await writeFile(join(compDir, "index.ts"), `export * from "./${res.name}";\n`, "utf8");
             filenames = [`${res.name}.tsx`, `${res.name}.css`, "index.ts"];
         }
         else {
-            const files = generateComponentFiles(slug, res.name, res.recipe, res.css, res.version, config.styles, await reactMajorOf(root), 
+            const files = generateComponentFiles(slug, res.name, res.recipe, css, res.version, config.styles, await reactMajorOf(root), 
             /**
              * THE SPELLING, FROM THE VERSION WE JUST FETCHED.
              *
@@ -246,3 +276,35 @@ export async function component(slug, name, opts) {
     }
     console.log("");
 }
+/**
+ * O VOCABULÁRIO DESTE REPOSITÓRIO, do que o `add` já deixou na pasta - ver `tongueOf`.
+ *
+ * `null` quando não há mapa: é a resposta de um projeto de destino, de um repositório que nunca
+ * buildou, ou de um install feito por um CLI anterior a 0.16.290. Nos três casos nada é traduzido e
+ * a folha instalada continua sendo o caminho, que é o comportamento de sempre.
+ */
+async function tongueFor(root, slug) {
+    const dir = join(root, "_synthesisui", "ds", slug);
+    const lock = await readFile(join(dir, ".lock"), "utf8").catch(() => null);
+    if (!lock)
+        return null;
+    let map = [];
+    let version = 0;
+    try {
+        const parsed = JSON.parse(lock);
+        map = parsed.tokenMap ?? [];
+        version = parsed.version ?? 0;
+    }
+    catch {
+        return null;
+    }
+    if (map.length === 0)
+        return null;
+    /**
+     * O VALOR COMPILADO MORA NA PASTA DA VERSÃO - a folha da raiz é um re-export de uma linha, escrito
+     * assim de propósito para que o `@import` dele nunca mude entre updates (ver `add.ts`). É de lá
+     * que sai o literal para as variáveis que não têm nome dele.
+     */
+    const installed = await readFile(join(dir, `v${version}`, "tokens.css"), "utf8").catch(() => "");
+    return tongueOf(map, installed);
+}

package/dist/commands/generate.js

@@ -1,7 +1,8 @@
-import { mkdir, readdir, readFile, writeFile } from "node:fs/promises";
+import { mkdir, readFile, writeFile } from "node:fs/promises";
 import { join } from "node:path";
 import { generateComponentFiles } from "../component-codegen.js";
 import { readProjectConfig, resolveRegistry } from "../config.js";
+import { installedSlugs } from "../installed.js";
 import { reactMajorOf, readInstalledConvention, readInstalledScheme, } from "../project-facts.js";
 import { postGenerate, RegistryError } from "../registry.js";
 /** PascalCase para o hint de import (course-card → CourseCard). */
@@ -20,17 +21,6 @@ async function readActiveVersion(root, slug) {
     }
 }
 /** Slugs materialized under `_synthesisui/ds/` in the project. */
-async function installedSlugs(root) {
-    try {
-        const entries = await readdir(join(root, "_synthesisui", "ds"), {
-            withFileTypes: true,
-        });
-        return entries.filter((e) => e.isDirectory()).map((e) => e.name);
-    }
-    catch {
-        return [];
-    }
-}
 /**
  * Generates a token-only component recipe for the project's design system
  * (chat-gen PRO, hosted) and materializes it additively under

package/dist/commands/refit.js

@@ -1,35 +1,13 @@
-import { access, mkdir, readdir, readFile, writeFile } from "node:fs/promises";
+import { access, mkdir, readFile, writeFile } from "node:fs/promises";
 import { basename, join } from "node:path";
 import { generateComponentFiles } from "../component-codegen.js";
 import { readProjectConfig, resolveRegistry } from "../config.js";
+import { installedSlugs } from "../installed.js";
 import { body, section, snippet } from "../output.js";
 import { reactMajorOf, readInstalledConvention, readInstalledScheme, } from "../project-facts.js";
 import { fetchComponent, postRefit, postSaveComponent, RegistryError, } from "../registry.js";
 /** Slugs INSTALLED under `_synthesisui/ds/` (a `.lock` marks a real install -
  *  a folder holding only refit artifacts doesn't count). */
-async function installedSlugs(root) {
-    try {
-        const entries = await readdir(join(root, "_synthesisui", "ds"), {
-            withFileTypes: true,
-        });
-        const slugs = [];
-        for (const entry of entries) {
-            if (!entry.isDirectory())
-                continue;
-            try {
-                await access(join(root, "_synthesisui", "ds", entry.name, ".lock"));
-                slugs.push(entry.name);
-            }
-            catch {
-                // artifacts-only folder (e.g. a refit before `add`) - not installed
-            }
-        }
-        return slugs;
-    }
-    catch {
-        return [];
-    }
-}
 /** True when the system is actually installed (tokens.css present). */
 async function isInstalled(root, slug) {
     try {

package/dist/index.js

@@ -30,6 +30,7 @@ import { template } from "./commands/template.js";
 import { upgrade } from "./commands/upgrade.js";
 import { use } from "./commands/use.js";
 import { appendEvent } from "./doctor/ledger.js";
+import { blueprintTarget, installedSlugs } from "./installed.js";
 import { RegistryError } from "./registry.js";
 /** Our own version, for pinning the hook and MCP commands we write into a
  *  project. Read from the package we are running out of, so a pinned command
@@ -44,8 +45,10 @@ Usage - deterministic, FREE:
   synthesisui list [options]               list the published design systems
   synthesisui list --mine                  your own systems, with their group
   synthesisui add <slug> [options]         materialize a DS into _synthesisui/ds/<slug>/
-  synthesisui component <slug> <name>      bring one EXISTING component in as YOUR <Pascal>.tsx
-  synthesisui bp <slug> <name>             the same command, short for blueprint
+  synthesisui bp <name>                    bring one EXISTING blueprint in as YOUR <Pascal>.tsx
+                                           (the slug is optional - this repo's system answers for it)
+  synthesisui bp <slug> <name>             the same, from another system
+  synthesisui blueprint | component        the same command, spelled in full
   synthesisui template <slug> <name>       materialize a whole page from a DS template
                                            (--as landing-home names the output - multi-page safe)
   synthesisui upgrade <slug>               update an installed DS + regenerate your components + migration brief
@@ -468,14 +471,42 @@ async function main() {
          * que apelido nenhum.
          */
         case "bp":
+        case "blueprint":
         case "component": {
-            const slug = args[0];
-            const name = args[1];
-            if (!slug || !name) {
-                console.error("error: provide slug and component name - `synthesisui component <slug> <name>`");
+            /**
+             * O SLUG É OPCIONAL, e o repositório responde por ele.
+             *
+             * `synthesisui bp card` num repositório que tem UM sistema instalado é a forma que a pessoa
+             * escreve naturalmente - ela está dentro do projeto, o sistema dela é aquele, e repetir o nome
+             * dele é a plataforma pedindo uma informação que ela já tem no disco.
+             *
+             * COM DOIS ARGUMENTOS o primeiro é o slug, que é o comportamento de sempre e o que permite
+             * trazer um blueprint de OUTRO sistema para cá.
+             *
+             * E O CASO AMBÍGUO É RECUSADO EM VEZ DE ADIVINHADO: um argumento só que é exatamente o nome do
+             * sistema instalado - `synthesisui bp codelevel-ds` - é o erro que o comentário acima registra,
+             * e ele tem duas leituras opostas ("instale este sistema" / "materialize um blueprint chamado
+             * codelevel-ds"). Escolher uma em silêncio seria acertar metade das vezes.
+             */
+            const root = dir ?? process.cwd();
+            const installed = await installedSlugs(root);
+            const target = blueprintTarget({
+                args: [args[0], args[1]],
+                local: installed.length === 1 ? installed[0] : null,
+                installed,
+            });
+            if ("error" in target) {
+                console.error(target.error === "ambiguous"
+                    ? `error: "${target.name}" is the system installed here, not a blueprint name - say which blueprint you want: \`synthesisui bp <name>\``
+                    : target.error === "no-name"
+                        ? "error: provide a blueprint name - `synthesisui bp <name>`, or `synthesisui bp <slug> <name>` for another system"
+                        : target.error === "no-system"
+                            ? "error: no design system installed here - run `synthesisui add <slug>` first, or name one: `synthesisui bp <slug> <name>`"
+                            : `error: ${installed.length} systems installed here (${installed.join(", ")}) - say which: \`synthesisui bp <slug> <name>\``);
                 process.exitCode = 1;
                 return;
             }
+            const { slug, name } = target;
             let version;
             if (typeof flags.version === "string") {
                 version = Number.parseInt(flags.version.replace(/^v/i, ""), 10);

package/dist/install-marks.js

@@ -128,7 +128,7 @@
  * é sempre o bump deste PR - nunca o número que o `package.json` já carrega, porque alguém pode
  * publicar no meio.
  */
-export const MATERIALISER_SINCE = "0.16.285";
+export const MATERIALISER_SINCE = "0.16.290";
 /**
  * A ÚLTIMA VERSÃO EM QUE O QUE O HOOK RODA MUDOU.
  *

package/dist/installed.js

@@ -0,0 +1,68 @@
+import { access, readdir } from "node:fs/promises";
+import { join } from "node:path";
+/**
+ * QUAIS SISTEMAS ESTÃO INSTALADOS NESTE REPOSITÓRIO - um lugar só, e a resposta certa.
+ *
+ * ESTA FUNÇÃO EXISTIA DUAS VEZES, em `refit.ts` e `generate.ts`, e elas discordavam: a primeira
+ * exigia o `.lock` - o arquivo que prova que o `add` rodou - e a segunda listava a pasta. Uma pasta
+ * `ds/<slug>/` existe assim que qualquer comando escreve um artefato ali, então o `generate`
+ * enxergava como instalado um sistema que ainda não tinha nada materializado, e a mensagem que ele
+ * daria ao cliente seria sobre um sistema que ele não pode usar.
+ *
+ * O `.lock` é o portão porque ele é o que o `add` escreve por último: se ele está lá, os arquivos
+ * estão. Ver `RootLock` em `add.ts`.
+ *
+ * E COM ISTO O SLUG PASSA A SER OPCIONAL nos comandos que agem sobre um sistema. Quem está num
+ * repositório que tem um sistema instalado não deveria precisar repetir o nome dele - o repositório
+ * já sabe.
+ */
+export async function installedSlugs(root) {
+    try {
+        const dsDir = join(root, "_synthesisui", "ds");
+        const entries = await readdir(dsDir, { withFileTypes: true });
+        const slugs = [];
+        for (const entry of entries) {
+            if (!entry.isDirectory())
+                continue;
+            try {
+                await access(join(dsDir, entry.name, ".lock"));
+                slugs.push(entry.name);
+            }
+            catch {
+                // pasta de artefato (um refit antes do `add`, por exemplo) - não é um install
+            }
+        }
+        return slugs.sort();
+    }
+    catch {
+        return [];
+    }
+}
+/**
+ * O SISTEMA DESTE REPOSITÓRIO, quando há exatamente um - e `null` quando a pergunta não tem resposta.
+ *
+ * Nenhum instalado e dois instalados são situações diferentes com a mesma consequência: a plataforma
+ * não pode escolher por ele. Escolher o primeiro em ordem alfabética seria a pior forma de errar -
+ * silenciosa, e correta na metade dos casos. Quem chama diz o que fazer com o `null`, e o que ele
+ * tem a dizer é diferente nos dois casos, então `installedSlugs` continua disponível para nomear os
+ * candidatos na mensagem.
+ */
+export async function theInstalledSlug(root) {
+    const slugs = await installedSlugs(root);
+    return slugs.length === 1 ? slugs[0] : null;
+}
+export function blueprintTarget(input) {
+    const [first, second] = input.args;
+    if (first && second)
+        return { slug: first, name: second };
+    const name = first;
+    if (!name)
+        return { error: "no-name" };
+    if (input.local && name === input.local)
+        return { error: "ambiguous", name };
+    if (!input.local)
+        return input.installed.length > 1
+            ? { error: "many-systems" }
+            : { error: "no-system" };
+    return { slug: input.local, name };
+}

package/dist/repo-state.js

@@ -63,6 +63,15 @@ export async function repoStateOf(projectRoot, slug, cli) {
     const payload = {
         ...(typeof lock?.version === "number" ? { installed: lock.version } : {}),
         ...(lock?.adopted === true ? { adopted: true } : {}),
+        /**
+         * O MAPA, do `.lock` - ver `RepoStatePayload.tokenMap`.
+         *
+         * Lido e não recalculado: o cruzamento é caro (varre as folhas dele e o build) e já foi feito
+         * pelo `add`, que é quem tinha o payload em mãos. Aqui ele só viaja.
+         */
+        ...(lock?.tokenMap && lock.tokenMap.length > 0
+            ? { tokenMap: lock.tokenMap }
+            : {}),
         cli,
         ...(doctor?.at ? { doctorAt: doctor.at } : {}),
         ...(typeof doctor?.phantoms === "number"

package/dist/their-tongue.js

@@ -0,0 +1,47 @@
+/** `var(--ds-x)` e `var(--ds-x, fallback)` - o que a folha compilada escreve. */
+const OUR_VAR = /var\(\s*(--ds-[a-zA-Z0-9_-]+)\s*(?:,([^()]*))?\)/g;
+export function inTheirTongue(css, tongue) {
+    let named = 0;
+    let inlined = 0;
+    const left = new Set();
+    const out = css.replace(OUR_VAR, (whole, name, fallback) => {
+        const theirName = tongue.names.get(name);
+        if (theirName) {
+            named += 1;
+            /**
+             * O FALLBACK NÃO VIAJA. `var(--x, #valor)` sobreviveria a um rename DELE pintando o valor
+             * velho - a plataforma decidindo por cima da decisão dele. Se ele renomear, quebra, e o
+             * `doctor` diz qual (dono, 22/08).
+             */
+            return `var(${theirName})`;
+        }
+        const value = tongue.values.get(name);
+        if (value) {
+            inlined += 1;
+            return value;
+        }
+        left.add(name);
+        return fallback ? whole : whole;
+    });
+    return { css: out, named, inlined, left: [...left].sort() };
+}
+/**
+ * O VOCABULÁRIO DESTE REPOSITÓRIO, montado do que o `add` já deixou na pasta.
+ *
+ * `map` vem do `.lock` (`tokenMap`) e é o que a máquina dele descobriu; `declared` vem do
+ * `tokens.css` instalado, que é onde cada variável nossa tem o valor compilado. Nenhuma medição
+ * nova: as duas coisas já estão no disco.
+ */
+export function tongueOf(map, installedCss) {
+    const names = new Map(map.map((p) => [p.ours, p.theirs]));
+    const values = new Map();
+    for (const m of installedCss.matchAll(/^\s*(--ds-[a-zA-Z0-9_-]+)\s*:\s*([^;]+);/gm)) {
+        const value = m[2].trim();
+        /** Uma linha que aponta para outra variável não é um valor - seguir a cadeia é do navegador. */
+        if (value.includes("var("))
+            continue;
+        if (!values.has(m[1]))
+            values.set(m[1], value);
+    }
+    return { names, values };
+}

package/dist/their-vars.js

@@ -95,12 +95,18 @@ export async function resolvableVars(root) {
  * ou `null` quando não há build - e aí nada é reescrito.
  */
 export function pointAtTheirNames(css, theirs, resolvable) {
+    /**
+     * SEM BUILD, SEM MAPA - a mesma regra da reescrita, e pelo mesmo motivo: um repositório que nunca
+     * buildou não tem como provar o que resolve, e um par afirmado sem prova é pior que par nenhum.
+     */
     if (!resolvable || theirs.byName.size === 0)
-        return { css, pointed: 0, pruned: 0 };
+        return { css, pointed: 0, pruned: 0, pairs: [] };
     const ours = buildTable({ css, source: "installed" });
     const alias = theirNames(ours, theirs);
     let pointed = 0;
     let pruned = 0;
+    /** Ver `PointedAt.pairs`: o mapa sai do mesmo casamento que reescreve a linha. */
+    const pairs = [];
     const out = css.replace(/^(\s*)(--ds-[a-zA-Z0-9_-]+)(\s*:\s*)([^;]+);/gm, (line, indent, name, sep, value) => {
         /** Uma linha que já aponta para outra variável não é uma cópia de valor. */
         if (value.includes("var("))
@@ -116,9 +122,10 @@ export function pointAtTheirNames(css, theirs, resolvable) {
             return line;
         }
         pointed += 1;
+        pairs.push({ ours: name, theirs: theirName, value: value.trim() });
         return `${indent}${name}${sep}var(${theirName});`;
     });
-    return { css: out, pointed, pruned };
+    return { css: out, pointed, pruned, pairs };
 }
 /**
  * O PREFIXO DA NOSSA VARIÁVEL -> A FAMÍLIA, e a chave que `theirNames` devolve é `<família>:<valor>`.
@@ -142,7 +149,7 @@ const FAMILY_KIND = {
 export async function pointTokensAtTheirNames(root, payload) {
     const css = payload.artifacts["tokens.css"] ?? "";
     if (!css)
-        return { css, pointed: 0, pruned: 0 };
+        return { css, pointed: 0, pruned: 0, pairs: [] };
     const [theirs, resolvable] = await Promise.all([
         harvestTheirCss(root),
         resolvableVars(root),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "synthesisui",
-  "version": "0.16.289",
+  "version": "0.16.291",
   "description": "Bring SynthesisUI design systems into any project - tokens, typed components, whole pages and an agent-ready CLAUDE.md manifest.",
   "type": "module",
   "bin": {