synthesisui 0.16.98 → 0.16.100

package/dist/anatomy-read.js

@@ -305,7 +305,24 @@ sketch) {
             "")
         : "";
     const paints = rootPainted ? { classes: rootPainted } : {};
-    if (rootRaw && /^[A-Z]/.test(rootRaw)) {
+    /**
+     * A LIBRARY ROOT WHOSE NAME IS NOT DOTTED.
+     *
+     * Three components return a Base UI primitive imported under a single word -
+     * `Pill` and `SelectionCard` return `Toggle`, `RadioCardGroup` returns
+     * `RadioGroup` - and `"root": "Toggle"` would point at THEIR own Toggle (a
+     * switch), inventing a relation that does not exist. There was no way to say
+     * "a library component with a bare name", so `root` was left out on all three
+     * (not-expressed.md, dono, 01/08).
+     *
+     * `from` says it: the PACKAGE disambiguates what the name cannot. It wins over
+     * the name, because a caller that sends both is telling us where it came from.
+     */
+    const rootFrom = String(rootObj?.from ?? "").trim();
+    if (rootFrom) {
+        rootOut = { from: rootFrom, ...paints };
+    }
+    else if (rootRaw && /^[A-Z]/.test(rootRaw)) {
         if (rootRaw.includes(".")) {
             rootOut = { from: rootRaw, ...paints };
         }

package/dist/commands/mcp.js

@@ -437,6 +437,25 @@ async function resolveAtNodes(root, entries) {
                         ],
                     }
                     : {}),
+                /**
+                 * THE PARTS, which is where a provider-rooted component keeps
+                 * EVERYTHING.
+                 *
+                 * `Tooltip` returns `<BaseTooltip.Provider>` - a context provider that
+                 * renders no element and carries no style - and its whole look (fill,
+                 * radius, padding, shadow) is on the popup PART. The merge carried
+                 * `base` and `layers` and stopped there, so the validator judged a
+                 * component with no declarations anywhere and said BELOW THE FLOOR
+                 * about one that draws fine (not-expressed.md, dono, 01/08).
+                 */
+                ...(look?.parts && Object.keys(look.parts).length > 0
+                    ? {
+                        parts: {
+                            ...look.parts,
+                            ...(recipe0.parts ?? {}),
+                        },
+                    }
+                    : {}),
                 /**
                  * THE ROOT TAG TRAVELS, so the validator can name the KIND.
                  *

package/dist/doctor/sketch.js

@@ -82,8 +82,24 @@ function staticCallClasses(body) {
             argStart = i + 1;
         }
     }
+    /**
+     * A COMMENT BEFORE THE STRING IS STILL THE STRING.
+     *
+     * Real code annotates these lists - `// Light mode`, `// Shadow with subtle
+     * brand tint` - and the argument then reads as `// Light mode\n"bg-darkgray-800
+     * …"`, which is not a bare literal, so it was dropped. The Tooltip kept only
+     * its last two arguments (the two with no comment above them) and lost its
+     * fill, radius, padding and shadow - and it only came to light because the
+     * floor check flagged it (not-expressed.md, dono, 01/08). Measured: SIX of 36
+     * components in that library annotate a `cn()` this way.
+     */
     const classes = args
-        .map((a) => a.trim())
+        .map((a) => a
+        // block comments first, so a `/* … */` spanning the line cannot leave
+        // a stray `*/` behind for the line rule to keep
+        .replace(/\/\*[\s\S]*?\*\//g, "")
+        .replace(/(^|\n)\s*\/\/[^\n]*/g, "$1")
+        .trim())
         .filter((a) => /^(["'`]).*\1$/.test(a) && !a.includes("${"))
         .map((a) => a.slice(1, -1).trim())
         .filter(Boolean);

package/dist/doctor/transcribe.js

@@ -241,6 +241,15 @@ const TAILWIND_COLOR = {
     white: "#ffffff",
     black: "#000000",
     transparent: "transparent",
+    /**
+     * KEYWORDS ARE VALUES. `bg-current` is `background-color: currentColor` and
+     * `text-inherit` is `color: inherit` - real CSS, no palette needed, and they
+     * were being dropped as unreadable. Nine utilities across the owner's library,
+     * and `bg-current` is how a spinner takes its colour from its parent - drop it
+     * and the spinner is invisible (not-expressed.md, dono, 01/08).
+     */
+    current: "currentColor",
+    inherit: "inherit",
     // zinc and blue, because a real Select is styled entirely in them and every
     // reference read as nothing (test14, 01/08). Tailwind's own values, verbatim.
     "zinc-50": "#fafafa",
@@ -351,6 +360,9 @@ const STATE_SPELLING = {
     first: "first",
     last: "last",
     empty: "empty",
+    /** Base UI's enter/exit faces - `data-[starting-style]:opacity-0`. */
+    "starting-style": "startingStyle",
+    "ending-style": "endingStyle",
 };
 const DATA_STATE = /^data-\[(?:state=)?([a-z-]+)\]$/;
 /**
@@ -837,6 +849,33 @@ function refFor(name) {
         return `{color.${name}}`;
     return `{color.${m[1]}.${m[2]}}`;
 }
+/** Their breakpoint names, as Tailwind ships them. A project that renames these
+ *  declares its own, and the census carries that - this is the default ladder. */
+const BREAKPOINT = /^(sm|md|lg|xl|2xl|min-\[[^\]]+\]|max-\[[^\]]+\])$/;
+/**
+ * The layer for one set of conditions, created once and reused.
+ *
+ * Reused rather than appended per utility, because `dark:hover:bg-x` and
+ * `dark:hover:border-y` are ONE conditional look with two declarations - two
+ * layers with identical conditions would compile to two identical rules.
+ */
+function layerFor(out, when, at) {
+    out.layers ??= [];
+    const same = out.layers.find((l) => (l.at ?? null) === (at ?? null) &&
+        (l.when?.state ?? null) === (when.state ?? null) &&
+        (l.when?.within ?? null) === (when.within ?? null) &&
+        (l.when?.scheme ?? null) === (when.scheme ?? null) &&
+        l.when?.variant == null);
+    if (same)
+        return same;
+    const created = {
+        ...(Object.keys(when).length > 0 ? { when } : {}),
+        ...(at ? { at } : {}),
+        style: {},
+    };
+    out.layers.push(created);
+    return created;
+}
 /**
  * Read every class in a component's root element and route each declaration by
  * its modifier.
@@ -1005,20 +1044,63 @@ export function transcribe(classes, declared) {
         if (rest.length === 0) {
             target = isDark ? out.dark : out.base;
         }
-        else if (rest.length === 1 && !isDark) {
-            const raw = STATE_SPELLING[rest[0]] != null
-                ? rest[0]
-                : (DATA_STATE.exec(rest[0])?.[1] ?? null);
-            const state = raw ? (STATE_SPELLING[raw] ?? null) : null;
-            if (state)
-                target = out.states[state] ?? (out.states[state] = {});
-            else
-                unslotted = true;
-        }
         else {
-            // A state under `dark:` is the dark scheme's version of that state, and a
-            // recipe has no slot for it.
-            unslotted = true;
+            /**
+             * EVERY MODIFIER GETS A SLOT, and the contract has had one all along.
+             *
+             * This used to route a bare state and drop everything else, on a comment
+             * that said "a recipe has no slot for it" - true when it was written and
+             * false since the transcription grew `layers`, which hold `scheme`,
+             * `state`, `within` and `at` TOGETHER. Measured on the owner's library:
+             * 29 real decisions dropped on that stale line, most of them a `dark:`
+             * over a state (not-expressed.md, dono, 01/08).
+             *
+             * A recipe that reconstructs the component must carry them, so the router
+             * reads the whole modifier list and only gives up on a modifier that
+             * genuinely has no home - and then it SAYS so.
+             */
+            const when = {};
+            let at;
+            for (const mod of rest) {
+                /** `group-hover:`, `group-data-[checked]:` - the PARENT's state. */
+                const group = /^group-(.+)$/.exec(mod);
+                const bare = group ? group[1] : mod;
+                const raw = STATE_SPELLING[bare] != null
+                    ? bare
+                    : (DATA_STATE.exec(bare)?.[1] ?? null);
+                const state = raw ? (STATE_SPELLING[raw] ?? null) : null;
+                if (state) {
+                    if (group)
+                        when.within = state;
+                    else
+                        when.state = state;
+                    continue;
+                }
+                /** `md:`, `lg:` - a breakpoint of theirs, by their own name. */
+                if (BREAKPOINT.test(mod) && !at) {
+                    at = mod;
+                    continue;
+                }
+                unslotted = true;
+            }
+            if (!unslotted) {
+                if (isDark)
+                    when.scheme = "dark";
+                // A bare single state with no scheme keeps its own slot: `states` is what
+                // the compiler and every lens already read, and moving it to a layer
+                // would be a shape change nothing asked for.
+                if (when.state &&
+                    !when.within &&
+                    !when.scheme &&
+                    !at &&
+                    rest.length === 1) {
+                    target = out.states[when.state] ?? (out.states[when.state] = {});
+                }
+                else {
+                    const layer = layerFor(out, when, at);
+                    target = layer.style;
+                }
+            }
         }
         const decl = readUtility(utility, declared);
         if (unslotted) {

package/dist/skill-import.js

@@ -622,6 +622,17 @@ depth appears anyway.
 }
 \`\`\`
 
+**A library root whose name is not dotted needs its PACKAGE.** \`Pill\` returns Base UI's
+\`Toggle\`, and \`"root": "Toggle"\` would point at THEIR own Toggle - a switch - inventing a
+relation that does not exist. Send where it came from instead:
+
+\`\`\`json
+"Pill": { "root": { "from": "@base-ui/react/toggle" }, "anatomy": [ … ] }
+\`\`\`
+
+\`Radio.Root\` needs none of this: the dot already says it is somebody's namespace. Leaving the
+root out was the old workaround and it cost the surface its name (not-expressed.md, dono, 01/08).
+
 **The root takes what the PARENT paints on it.** When the returned root carries an override at
 the call site - \`MetricCard\` returns \`<Card className="flex-1 dark:bg-darkgray-300">\` - send the
 object form and point \`at\` the sketch node: \`{ "name": "Card", "at": 1 }\`. The string form still

package/package.json

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