synthesisui 0.16.81 → 0.16.82

package/dist/commands/import.js

@@ -2,7 +2,7 @@ import { mkdir, readdir, readFile, stat, writeFile } from "node:fs/promises";
 import { basename, dirname, join, relative } from "node:path";
 import { resolveAnatomy, resolveFlatParts, safePartName, } from "../anatomy-read.js";
 import { readCredentials, readToken, resolveRegistry, sameRegistry, } from "../config.js";
-import { describeArchitecture, describeChoice, detectArchitectures, } from "../doctor/architecture.js";
+import { architectureRule, describeArchitecture, describeChoice, detectArchitectures, } from "../doctor/architecture.js";
 import { findBrokenRefs } from "../doctor/broken-refs.js";
 import { nestingRules, propRules, readDefinitionProps, readNesting, } from "../doctor/call-sites.js";
 import { describeClassStyle, detectClassStyle, } from "../doctor/class-style.js";
@@ -16,6 +16,7 @@ import { diagnose, scanSource } from "../doctor/scan.js";
 import { parseSchemeBlocks } from "../doctor/scheme-blocks.js";
 import { buildTable } from "../doctor/tokens.js";
 import { rootClasses, rootTag, transcribe, } from "../doctor/transcribe.js";
+import { transcribeVariants } from "../doctor/variant-read.js";
 import { body, paint, section } from "../output.js";
 import { startProgress } from "../progress.js";
 import { detectStack, resolveDeps } from "../stack.js";
@@ -242,6 +243,8 @@ export async function takeCensus(root, opts) {
     const nesting = new Map();
     /** Component → what its own definition names and whether it forwards the rest. */
     const propsOf = new Map();
+    /** Component → the axes its own `cva` declares. See `variant-read.ts`. */
+    const variantAxes = new Map();
     /**
      * A census over a real monorepo reads 2797 files, and the terminal said nothing for
      * most of it. Twenty silent minutes is indistinguishable from twenty broken ones
@@ -313,12 +316,45 @@ export async function takeCensus(root, opts) {
             // not attempt.
             if (found.length > 0) {
                 const t = transcribe(rootClasses(src), declaredValues);
-                const size = Object.keys(t.base).length +
+                /**
+                 * THE VARIANT STYLES, FOLDED IN.
+                 *
+                 * `rootClasses` reads the class string ON the element, which for a component
+                 * built with `cva` is a call - `className={cn(buttonVariants({ variant }))}` -
+                 * and carries none of the nine variants' colours. The definition does, in an
+                 * object literal, and reading it is deterministic (see `variant-read.ts`).
+                 *
+                 * Folded here rather than reported separately because this is the one funnel:
+                 * the reader was computing 23 layers for a real Button and nobody was asking
+                 * for the result, which is the "valid and unread" failure this pipeline has
+                 * paid for twice already.
+                 */
+                const v = transcribeVariants(src, declaredValues);
+                const base = { ...v.base.base, ...t.base };
+                const states = { ...v.base.states, ...t.states };
+                const size = Object.keys(base).length +
                     Object.keys(t.dark).length +
-                    Object.keys(t.states).length;
+                    Object.keys(states).length +
+                    v.layers.length;
                 const tag = rootTag(src);
                 if (size > 0 || tag) {
-                    looks[found[0].name] = tag ? { ...t, rootTag: tag } : t;
+                    looks[found[0].name] = {
+                        ...t,
+                        base,
+                        states,
+                        ...(tag ? { rootTag: tag } : {}),
+                        ...(v.layers.length > 0 ? { layers: v.layers } : {}),
+                        ...(Object.keys(v.axes).length > 0 ? { declaredAxes: v.axes } : {}),
+                        ...(Object.keys(v.defaults).length > 0
+                            ? { defaults: v.defaults }
+                            : {}),
+                    };
+                }
+                // Their variant DEFINITION beats what usage happened to pick, and it is the
+                // better source: usage shows what somebody chose, the declaration shows what
+                // the author designed.
+                if (Object.keys(v.axes).length > 0) {
+                    variantAxes.set(found[0].name, v.axes);
                 }
             }
         }
@@ -408,12 +444,25 @@ export async function takeCensus(root, opts) {
         files: 0,
         props: {
             ...Object.fromEntries(Object.entries(d.axes)),
+            ...Object.fromEntries(Object.entries(variantAxes.get(d.name) ?? {})),
             ...Object.fromEntries(d.flags.map((f) => [f, ["true"]])),
         },
         propFiles: {},
         // Their own rung, off the folder. It travels from the DEFINITION because
         // that is the only reading that knows which file the component lives in.
         ...(d.tier ? { tier: d.tier } : {}),
+        /**
+         * The axes, kept BESIDE `props` as well as in it.
+         *
+         * A library composes nothing, so its components arrive through this branch and
+         * `declaredAxes` is where the contract writer looks. Leaving it out meant a
+         * Button whose `cva` declares nine variants reported none of them (probe,
+         * 01/08) - the styles reached the recipe and the axis names did not.
+         */
+        ...(Object.keys({ ...d.axes, ...(variantAxes.get(d.name) ?? {}) })
+            .length > 0
+            ? { declaredAxes: { ...d.axes, ...(variantAxes.get(d.name) ?? {}) } }
+            : {}),
     }));
     /**
      * A composed component that is ALSO defined keeps its usage and gains the
@@ -435,13 +484,22 @@ export async function takeCensus(root, opts) {
     const declaredBy = new Map(defined.map((d) => [d.name, d]));
     const enriched = inventory.map((c) => {
         const d = declaredBy.get(c.name);
-        if (!d)
+        const fromVariants = variantAxes.get(c.name);
+        if (!d && !fromVariants)
             return c;
-        const tier = d.tier ? { tier: d.tier } : {};
-        if (Object.keys(d.axes).length === 0) {
+        const tier = d?.tier ? { tier: d.tier } : {};
+        /**
+         * THREE SOURCES FOR AN AXIS, and this is their order.
+         *
+         * The `cva` definition is the strongest: it declares the option AND what the
+         * option does. The prop type is next - it declares the closed set. Usage is last,
+         * because it shows what somebody happened to pick.
+         */
+        const axes = { ...(d?.axes ?? {}), ...(fromVariants ?? {}) };
+        if (Object.keys(axes).length === 0) {
             return Object.keys(tier).length > 0 ? { ...c, ...tier } : c;
         }
-        return { ...c, declaredAxes: d.axes, ...tier };
+        return { ...c, declaredAxes: axes, ...tier };
     });
     const scoped = [...enriched, ...fromTypes];
     /**
@@ -625,8 +683,25 @@ export async function takeCensus(root, opts) {
         observed: distinctValues(d),
         ...(components.length > 0 ? { components } : {}),
         ...(defined.length > 0 ? { defined } : {}),
+        /**
+         * THE SHAPE, AND THE RULE IT BECOMES.
+         *
+         * `rule` travels with each one so the platform writes it without owning a second
+         * copy of the sentence. The reader picks which architecture has PRIORITY; absent a
+         * choice the first is the one, which is the shape holding the most code.
+         *
+         * Carried rather than only printed: the whole point of the feature is that the
+         * chosen shape reaches CLAUDE.md, and a version of this that detected the shape,
+         * printed it, and never turned it into a rule is a feature that does nothing (dono,
+         * 01/08).
+         */
         ...(architectures.length > 0
-            ? { architectures: architectures.slice(0, 6) }
+            ? {
+                architectures: architectures.slice(0, 6).map((a) => ({
+                    ...a,
+                    rule: architectureRule(a),
+                })),
+            }
             : {}),
         ...(skips.length > 0
             ? {

package/dist/doctor/transcribe.js

@@ -598,20 +598,3 @@ export function rootClasses(source) {
         .flatMap((m) => m[1].split(/\s+/))
         .filter((c) => c.length > 0 && !c.includes("${"));
 }
-/**
- * Transcribe the parts a skill named, using the same reader the root used.
- *
- * `declared` comes from the census itself on the `--census` path, so a run that
- * only sends a file it was handed still resolves their tokens by name.
- */
-export function transcribeParts(parts, declared) {
-    const out = {};
-    for (const part of parts) {
-        const name = part.name?.trim();
-        if (!name || typeof part.classes !== "string")
-            continue;
-        const t = transcribe(part.classes.split(/\s+/).filter(Boolean), declared);
-        out[name] = { base: t.base, dark: t.dark, states: t.states };
-    }
-    return out;
-}

package/package.json

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