roast-my-design-system 9.1.1 → 9.2.0

package/README.md

@@ -63,9 +63,9 @@ This tool draws the map.
 
 ## What you get
 
-### Where agents will invent
+### Where will your agent have to guess?
 
-The places where the repo has no answer yet.
+The first thing the report says: the places where the repo has no answer yet, or "No gaps found".
 
 - the gap, in one line
 - the files that prove it
@@ -142,11 +142,11 @@ Eleven reports, hosted exactly as the tool writes them. Every number determinist
 
 The full report for vercel/ai-chatbot. The verdict answers what the agent will learn here, the gap section comes first, then "What the repo teaches the agent", Claude's read of the scan:
 
-![The full diagnosis report for vercel/ai-chatbot in dark mode: a fixed side panel with the health score and what it measures, the stack, how the repo was read as a shadcn install, an index of every section and what is not the team's and not counted; then the verdict on where the agent will have to guess, the Where agents will invent section, the What the repo teaches the agent analysis written by Claude, priced Fix what makes agents guess moves each with its copy-the-fix-prompt button, the wrapped present with the agent rules, an agent trap callout, 3-yardstick tiles including the 2 shadcn tiles, the adoption map treemap, palette forensics, the shadcn theme variable by variable, spacing receipts, typography specimens, offenders, duplicates, and the component usage ledger](assets/report-full-dark.png?v=9.1.1)
+![The full diagnosis report for vercel/ai-chatbot in dark mode: a fixed side panel with the health score and what it measures, the stack, how the repo was read as a shadcn install, an index of every section and what is not the team's and not counted; then where the agent will have to guess, the What the repo teaches the agent analysis written by Claude, priced Fix what makes agents guess moves each with its copy-the-fix-prompt button, the wrapped present with the agent rules, an agent trap callout, 3-yardstick tiles including the 2 shadcn tiles, the adoption map treemap, palette forensics, the shadcn theme variable by variable, spacing receipts, typography specimens, offenders, duplicates, and the component usage ledger](assets/report-full-dark.png?v=9.1.2)
 
 The same report in light mode (one file, built-in toggle):
 
-![The diagnosis report in light mode](assets/report-light-hero.png?v=9.1.1)
+![The diagnosis report in light mode](assets/report-light-hero.png?v=9.1.2)
 
 ## Why the numbers hold
 
@@ -245,7 +245,7 @@ Four calls, under 800 tokens, and the new component reads the theme instead of a
 
 Charts get their own rule, because a chart needs several colours that differ from each other and most design systems never name them. Where a repo keeps a chart palette, a colour written by hand in a chart file is a finding that names the palette. Where a repo has charts but no palette, a new chart that paints by hand gets one warning that names the existing chart doing the same and asks for the palette once. That warning is the gap report, live.
 
-The server reads the repo the way the report does. On a product built on MUI, Mantine, Chakra UI or Ant Design, the context names the theme file and the kit's own way of reading it, `roast_find_token` answers in spacing steps, and the checks flag a colour or a pixel size written onto a kit component where the theme has a value. On a Tailwind theme or a shadcn repo they flag a palette class such as `text-gray-500` where the theme names a colour of that kind.
+The server reads the repo the way the report does. On a product built on MUI, Mantine, Chakra UI or Ant Design, the context names the theme file and the kit's own way of reading it, `roast_find_token` answers in spacing steps, and the checks flag a colour or a pixel size written onto a kit component where the theme has a value. On a Tailwind theme or a shadcn repo they flag a palette class such as `text-gray-500` where the theme names a colour of that kind. A token's raw value pasted into a component is flagged with the token's name, and a button built from scratch where the repo already has a well-used Button gets a warning that names the import line to use.
 
 The `roast-fix` prompt serves the top Where-to-start move from a fresh scan, byte-identical to the report's copy buttons. In Claude Code type `/mcp__roast__roast-fix`, add a number to jump the queue. Fix it, ask again, and the next move has risen to the top: the scan is the progress bar.
 
@@ -348,7 +348,7 @@ You get the roast in chat plus `design-system-roast.html` at your repo root, a s
 - a **light/dark theme toggle** in one file
 - the usage-weighted palette bar, the grey ramp, the off-scale spacing receipts, the duplicate-component receipts with clickable file paths, and the worst-offenders ledger
 - a **Fix what makes agents guess** list: up to 3 moves derived from your repo's own numbers, each with a file-path receipt
-- a **Where agents will invent** section, first under the verdict: the gaps where the repo has no answer yet, with the files that prove each one and the move that closes it, or the honest empty state when none is found
+- **Where will your agent have to guess?** opens the report: the gaps where the repo has no answer yet, with the files that prove each one and the move that closes it, or "No gaps found"
 - **Give the agent the answers**: `design-system-rules.md` wrapped inside the report as a present. Unwrap, then copy or download the agent rules generated from your scan
 
 After the roast, the skill offers to write `design-system-rules.md` to disk and merge it into your CLAUDE.md, `.cursor/rules` or AGENTS.md.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "roast-my-design-system",
-  "version": "9.1.1",
+  "version": "9.2.0",
   "mcpName": "io.github.gregkozakiewicz/roast-my-design-system",
   "description": "Your AI can write the UI. This makes sure it writes your UI. A deterministic scanner scores your design system 0-100 against 112 public repos, reads React and web components (Stencil, Lit), hands you a copy-paste fix prompt for each top finding, writes rules for Claude, Cursor, Copilot and Windsurf with --apply, and runs as a local MCP server with --mcp.",
   "keywords": [

package/skills/roast-my-design-system/scripts/diagnose/index.mjs

@@ -354,13 +354,20 @@ let verdict = noSystemLikely
 // The lead line answers the report's first question, where will the agent
 // have to guess, before the measured verdict does. A repo with an answer gets
 // copied; a repo with no answer gets guessed at. A gap named here is one
-// lib/gaps admitted after a fleet probe; nothing else is called a gap.
+// lib/gaps admitted after a fleet probe; nothing else is called a gap. The
+// card never talks about the scan's reach: a reader came for a diagnosis,
+// not for the limits of the instrument (Greg, 28 Sep 2026).
 const gapLead = (noSystemLikely || fresh) ? '' : (() => {
   const gaps = h.gaps ?? [];
-  if (!gaps.length) return 'Nowhere that this scan checks: your repo gives the agent a clear answer to copy.';
-  const named = gaps.map((g) => g.title.charAt(0).toLowerCase() + g.title.slice(1));
-  return `${gaps.length === 1 ? 'In one place' : `In ${gaps.length} places`} your repo gives the agent no clear answer: ${esc(named.join('; '))}. Asked to build there, it has to decide for itself.`;
+  return gaps.length ? `${gaps.length} gap${gaps.length === 1 ? '' : 's'} found.` : 'No gaps found.';
 })();
+// Under the headline: the condition, and nothing about the scan's reach.
+// What the fixes do to the score is said once, in the fixes section.
+function gapSub() {
+  return (h.gaps ?? []).length
+    ? 'The agent has no clear answer for these parts of the system.'
+    : 'Your repo gives the agent a clear answer for every check in this scan.';
+}
 if (bench && findings.length && !fresh) {
   const core = [['colors', tokenLed ? colorStrays : colors.length], ['greys', tokenLed ? greyStrays : greys.length],
     ['spacing', spacingTotal], ['typefaces', typefaces.length], ['exactDuplicates', hardDupes.length], ['inlineStyles', inline.count]];
@@ -1214,9 +1221,9 @@ function whereToStartSection() {
   for (const item of top3) if (item.metric && item.after !== undefined && item.delta > 0) applied.set(item.metric, item.after);
   const after = projectedScore(applied);
   startProjection = { count: top3.length, after };
-  const words = ['One tweak', 'Two tweaks', 'Three tweaks'][top3.length - 1];
+  const words = ['One fix', 'Two fixes', 'Three fixes'][top3.length - 1];
   const head = healthScore !== null && after > healthScore
-    ? `${words} · <b class="proj">${healthScore} &rarr; ${after}</b>`
+    ? `${words} could raise the design system health score from <b class="proj">${healthScore} to ${after}</b>.`
     : `${words} to increase your score.`;
   const chip = (item) => item.delta > 0
     ? `<span class="delta" title="once all of them are done">+${item.delta}</span>`
@@ -1258,24 +1265,17 @@ function whereToStartSection() {
 // A gap is a place where the next piece of UI has nothing to reuse (lib/gaps).
 // The September 2026 runs showed agents inventing exactly there; the section
 // names the gap, the files that prove it and the one move that closes it.
-function gapsSection() {
+function gapsList() {
   if (noSystemLikely || fresh) return '';
   const gaps = h.gaps ?? [];
-  if (!gaps.length) {
-    return `<section class="glass pad" style="margin-top:16px">
-    ${sectionHead('Where agents will invent', 'No gap found: the gaps where a design system has no answer yet are all closed here. This scan checks for one kind of gap so far, a chart palette, and this repo either has one or has no charts. The list grows as more gap kinds are measured on real agent runs; a clean result here says the known gaps are closed, and no more than that.')}
-</section>`;
-  }
-  const head = `The gaps where your design system has no answer yet. ${gaps.length === 1 ? 'One place' : `${gaps.length} places`} where this repo gives an agent nothing to copy; asked to build there, an agent invents, because that is what the repo taught it. Nothing here is a violation: there is no rule yet to break. Define the answer once and every agent after that inherits it.`;
-  return `<section class="glass pad" style="margin-top:16px">
-    ${sectionHead('Where agents will invent', head)}
-    <div class="ledger">${gaps.map((g, i) => `
+  if (!gaps.length) return '';
+  return `<div class="ledger gaps-list">${gaps.map((g, i) => `
       <div class="ledger-row gap-row">
         <span class="ledger-idx">${String(i + 1).padStart(2, '0')}</span>
         <div class="start-body"><div class="start-head"><div class="start-title">${esc(g.title)}</div></div><div class="sub">${esc(g.detail)}</div>
         <div class="sub" style="margin-top:6px"><b>Close it:</b> ${esc(g.fix)}</div>
         ${g.files?.length ? `<div class="chips-row" style="margin-top:8px">${g.files.map((f) => `<span class="chip mono">${esc(f)}</span>`).join('')}</div>` : ''}</div>
-      </div>`).join('')}</div></section>`;
+      </div>`).join('')}</div>`;
 }
 
 // ---------- package by package ----------
@@ -1561,16 +1561,16 @@ function ogTags() {
 // index of what rendered, and what is not the team's and not counted.
 function sidePanel() {
   const date = esc((h.harvestedAt ?? '').slice(0, 10));
-  const def = 'How safely an AI agent can build on this repo without going off-system.';
+  const def = 'How well this repo follows the design system rules Roast checks.';
   const lift = startProjection && healthScore !== null && startProjection.after > healthScore
-    ? ` <b>${['One fix lifts', 'Two fixes lift', 'Three fixes lift'][startProjection.count - 1] ?? 'The fixes lift'} it to ${startProjection.after}.</b>` : '';
+    ? ` <b>${['One fix', 'Two fixes', 'Three fixes'][startProjection.count - 1] ?? 'The fixes'} could raise it to ${startProjection.after}.</b>` : '';
   const rp = P.shadcn?.registryPaint ?? null;
   const bd = breakdown.ownScore !== null && breakdown.installedPoints > 0 && rp
     ? `<div class="bd">Of which <b>${breakdown.installedPoints} point${breakdown.installedPoints === 1 ? '' : 's'}</b> come from installed code you did not write: ${esc(rp.dirs.map((d) => basename(d)).join(', '))} (${n(rp.files)} file${rp.files === 1 ? '' : 's'}, ${n(rp.tinUses)} palette colour${rp.tinUses === 1 ? '' : 's'}). Your own code alone would score <b>${breakdown.ownScore}</b>. Kept in the score because your agent reads those files like everything else; left out of the fixes because they are not yours to edit.</div>` : '';
   const scoreBlock = healthScore !== null
-    ? `<div class="score">${eyebrow('Health score')}<div class="val">${healthScore}<span class="slash">/</span><span class="of">100</span></div><div class="def">${def}${lift}</div>${bd}</div>`
+    ? `<div class="score">${eyebrow('Design system health')}<div class="val">${healthScore}<span class="slash">/</span><span class="of">100</span></div><div class="def">${def}${lift}</div>${bd}</div>`
     : noSystemLikely
-    ? `<div class="score muted">${eyebrow('Health score')}<div class="val">&mdash;</div><div class="note">nothing here was measured · see the note</div><div class="def">${def}</div></div>` : '';
+    ? `<div class="score muted">${eyebrow('Design system health')}<div class="val">&mdash;</div><div class="note">nothing here was measured · see the note</div><div class="def">${def}</div></div>` : '';
   const chips = `<div class="chips">${stack.map((c) => `<span class="chip">${esc(c)}</span>`).join('')}${(P.shadcn?.sheet?.tweakcnPresent ?? 0) >= 10 ? '<span class="chip">tweakcn theme</span>' : ''}${P.shadcn?.lint ? '<span class="chip">shadcn/lint</span>' : ''}${dsUnrecognised ? '<span class="chip chip-dim">design system: unrecognised</span>' : ''}${legacyChip ? `<span class="chip chip-dim">${esc(legacyChip)}</span>` : ''}${agentFiles.map((c) => `<span class="chip chip-agent">${esc(c.file)}</span>`).join('')}</div>`;
   const facts = [
     shadcnReceipt(),
@@ -1788,6 +1788,7 @@ ${ogTags()}
   .verdict-card .b2 { left:-40px; bottom:-80px; width:224px; height:224px; background:var(--blob2); filter:blur(48px); }
   .verdict { position:relative; font:600 clamp(18px,2.6vw,24px)/1.45 var(--disp); letter-spacing:-.01em; margin-top:10px; }
   .verdict-sub { position:relative; margin-top:12px; font-size:14.5px; line-height:1.6; color:var(--dim); }
+  .verdict-card .gaps-list { position:relative; margin-top:18px; }
   .gap-empty { padding:0 26px 22px; color:var(--dim); font-size:14px; line-height:1.6; }
   .gap-why { margin-top:6px; color:var(--dim); font-size:13.5px; }
 
@@ -2112,11 +2113,9 @@ ${sidePanel()}
   <div class="glass verdict-card">
     <div class="blob b1"></div><div class="blob b2"></div>
     ${eyebrow(noSystemLikely || fresh ? 'Summary' : 'Where will your agent have to guess?')}
-    ${gapLead ? `<div class="verdict">${gapLead}</div><div class="verdict-sub">${esc(verdict)}</div>` : `<div class="verdict">${esc(verdict)}</div>`}
+    ${gapLead ? `<div class="verdict">${gapLead}</div><div class="verdict-sub">${gapSub()}</div>${gapsList()}` : `<div class="verdict">${esc(verdict)}</div>`}
   </div>
 
-${gapsSection()}
-
 ${notesSection()}
 
 ${extraSectionsHtml()}

package/skills/roast-my-design-system/scripts/harvest/components.mjs

@@ -6,6 +6,37 @@
  */
 import { join, basename, posix } from 'node:path';
 import { readSource } from './walk.mjs';
+import { resolveWorkspaces } from '../lib/workspaces.mjs';
+
+/**
+ * Import aliases a tsconfig declares: "@sentry/scraps/*": ["./static/app/
+ * components/core/*"] means a file importing @sentry/scraps/button means the
+ * copy under static/app/components/core. Read tolerantly (tsconfig is JSON
+ * with comments and trailing commas); a bare "*" catch-all is not an alias.
+ * @returns [{ prefix, dir }] longest prefix first
+ */
+export function tsconfigAliases(root) {
+  let text;
+  try { text = readSource(join(root, 'tsconfig.json')); } catch { return []; }
+  if (!text) return [];
+  let cfg;
+  try {
+    cfg = JSON.parse(text.replace(/\/\*[\s\S]*?\*\//g, '').replace(/^\s*\/\/.*$/gm, '').replace(/,(\s*[}\]])/g, '$1'));
+  } catch { return []; }
+  const paths = cfg?.compilerOptions?.paths;
+  if (!paths || typeof paths !== 'object') return [];
+  const base = (cfg.compilerOptions.baseUrl ?? '.').replace(/^\.\/?/, '').replace(/\/$/, '');
+  const out = [];
+  for (const [key, targets] of Object.entries(paths)) {
+    if (key === '*' || !Array.isArray(targets) || typeof targets[0] !== 'string') continue;
+    const prefix = key.replace(/\/?\*$/, '');
+    if (!prefix) continue;
+    const target = targets[0].replace(/^\.\/?/, '').replace(/\/?\*$/, '').replace(/\/$/, '');
+    const dir = posix.normalize(base ? `${base}/${target}` : target).replace(/^\.\/?/, '');
+    if (dir && dir !== '.') out.push({ prefix, dir });
+  }
+  return out.sort((a, b) => b.prefix.length - a.prefix.length);
+}
 
 const QUOTES = new Set(['"', "'", '`']);
 
@@ -169,7 +200,7 @@ const stripExt = (f) => f.replace(/\.[cm]?[jt]sx?$/, '');
  * (`../ui` → ui/index.ts) resolves to the copy inside that folder. A file that
  * defines the name itself means its own. Returns [def] or null when unsure.
  */
-function importedDef(src, file, name, defs) {
+function importedDef(src, file, name, defs, workspaces = [], aliases = []) {
   const own = defs.find((d) => d.file === file);
   if (own) return [own];
   for (const m of src.matchAll(/import\s+(?:type\s+)?([^'";]*?)\s+from\s*['"]([^'"]+)['"]/g)) {
@@ -181,7 +212,25 @@ function importedDef(src, file, name, defs) {
     const spec = m[2];
     let target = null, suffix = null;
     if (spec.startsWith('.')) target = posix.normalize(posix.join(posix.dirname(file), spec));
-    else { const a = /^(?:@|~|#)\/(.+)$/.exec(spec); if (a) suffix = a[1]; else return null; }
+    else {
+      const a = /^(?:@|~|#)\/(.+)$/.exec(spec);
+      // a tsconfig alias first: it is the repo's own statement of where the
+      // specifier points, and it can name a folder no workspace declares
+      const al = aliases.find((x) => spec === x.prefix || spec.startsWith(`${x.prefix}/`));
+      if (al) {
+        const rest = spec === al.prefix ? '' : spec.slice(al.prefix.length + 1);
+        target = posix.normalize(rest ? `${al.dir}/${rest}` : al.dir).replace(/\.[cm]?[jt]sx?$/, '');
+      } else if (a) suffix = a[1];
+      else {
+        // A workspace package by name (twenty-ui/input, @calcom/ui): the copy
+        // inside that package's folder. Until now every copy was credited,
+        // so Twenty's marketing-site Button carried the app's 274 uses too.
+        const ws = workspaces.find((w) => spec === w.name || spec.startsWith(`${w.name}/`));
+        if (!ws) return null;
+        const inside = defs.filter((d) => d.file.startsWith(`${ws.dir}/`));
+        return inside.length === 1 ? inside : null;
+      }
+    }
     const hit = defs.filter((d) => {
       const f = stripExt(d.file);
       if (target !== null) return f === target || f === `${target}/index` || d.file.startsWith(`${target}/`);
@@ -226,6 +275,8 @@ export function harvestComponents(root, codeFiles) {
   }
 
   // Pass 2: usages (skip the defining file's own render of itself is fine to count)
+  const workspaces = resolveWorkspaces(root);
+  const aliases = tsconfigAliases(root);
   const byName = new Map();
   for (const c of components) {
     if (!byName.has(c.name)) byName.set(c.name, []);
@@ -244,7 +295,7 @@ export function harvestComponents(root, codeFiles) {
       // features/invoices each "used 12x" (8 and 4 in truth), so neither read
       // as the canon (Ledgerly, 2026-09-24). Unresolved imports keep the old
       // rule and credit every copy.
-      const owners = defs.length > 1 ? importedDef(src, file, name, defs) ?? defs : defs;
+      const owners = defs.length > 1 ? importedDef(src, file, name, defs, workspaces, aliases) ?? defs : defs;
       for (const def of owners) {
         if (def.file === file) continue; // internal render/recursion, not adoption
         def.usageCount += n;

package/skills/roast-my-design-system/scripts/harvest/tokens.mjs

@@ -377,6 +377,7 @@ export function harvestTokens(root, styleFiles, codeFiles) {
     return owner;
   };
   const paletteFiles = new Set();
+  const tailwindConfigs = new Set();
   const listShare = new Map();   // code file → share of its colour literals inside 8+ colour arrays
   const nsDefs = new Map();  // --telekom-x: value  → 'telekom' (definitions)
   const nsRefs = new Map();  // var(--telekom-x)    → 'telekom' (references)
@@ -536,6 +537,7 @@ export function harvestTokens(root, styleFiles, codeFiles) {
     // equivalent of --var definitions). Its fontFamily block is the typeface
     // declaration for the whole app.
     if (/(^|\/)tailwind\.config\.[mc]?[jt]s$/.test(f)) {
+      tailwindConfigs.add(f);
       for (const m of src.matchAll(HEX_RE)) { tokenDefined.add(normalizeHex(m[0])); colors.add(normalizeHex(m[0]), f); }
       const famBlock = src.match(/fontFamily\s*:\s*\{([\s\S]*?)\n\s*\}/);
       if (famBlock) {
@@ -708,6 +710,11 @@ export function harvestTokens(root, styleFiles, codeFiles) {
   // stylesheet is never a list, whatever shape its values take.
   const isList = (f) => /\.[jt]sx?$/.test(f) && !/(^|\/)tailwind\.config\.[mc]?[jt]s$/.test(f) && (listShare.get(f) ?? 0) >= 0.5;
   const candidates = new Set([...tokenColorDefsPerFile.keys(), ...paletteFiles]);
+  // Every file that states a token colour: a stylesheet defining --vars, a
+  // Tailwind config, a palette file. A checker reading one of these must not
+  // tell it to use itself; anywhere else a token's raw value is a paste of
+  // the value where the name belongs (Twenty, Haiku with the hook, 2026-09-29).
+  const tokenSources = [...new Set([...candidates, ...tailwindConfigs])].sort();
   const tokenFile = [...candidates]
     .map((f) => ({ f, tokens: tokenColoursIn.get(f) ?? 0, strays: straysIn.get(f) ?? 0, list: isList(f) ? 1 : 0 }))
     .filter((c) => c.tokens >= 3)
@@ -773,6 +780,7 @@ export function harvestTokens(root, styleFiles, codeFiles) {
   }
   return {
     tokenFile,
+    tokenSources,
     foreignStyles,
     namespaces,
     colors: colorList,

package/skills/roast-my-design-system/scripts/lib/guard-api.mjs

@@ -19,12 +19,14 @@ import { KITS } from '../profiles/kit-common.mjs';
 import { kitPaintFindings } from './kitpaint.mjs';
 import { PALETTE_CLASS_RE, blankComments } from '../harvest/paint.mjs';
 import { harvestTokens, extractStyling, normalizeHex, isGrey } from '../harvest/tokens.mjs';
-import { harvestComponents, definedComponents } from '../harvest/components.mjs';
+import { harvestComponents, definedComponents, tsconfigAliases } from '../harvest/components.mjs';
 import { findDuplicates } from '../harvest/duplicates.mjs';
 import { repoTokenDefs } from './tokentwins.mjs';
 import { dupeCopiesOf } from './avoidedimports.mjs';
 import { loadExclusions } from './exclusions.mjs';
 import { WIDGET_CONFIG_RE } from './exempt.mjs';
+import { buttonCandidates } from './handmade.mjs';
+import { resolveWorkspaces } from './workspaces.mjs';
 import { hexRgb } from './nearpairs.mjs';
 import { typefaceOf, GENERIC_FONTS } from './typefaces.mjs';
 
@@ -63,6 +65,9 @@ export { kitPaintFindings };
 export { tokenTwinFindings, tokenDefsOf } from './tokentwins.mjs';
 export { avoidedImportFindings, canonicalCopy } from './avoidedimports.mjs';
 export { isChartFile, chartSystemOf, chartTier, chartFindings } from './charts.mjs';
+// a button from scratch where the repo has a Button (9.2.0); learnSystem
+// hands over `buttons`, `workspaces` and `packageDeps` for buttonFor
+export { handmadeButtons, handmadeButtonFindings, buttonCandidates, buttonFor, BUTTON_MIN_USES } from './handmade.mjs';
 
 // Radius, font size, shadow and typeface: the patterns, so both checkers agree
 // on what a declaration is and what counts as a disciplined value.
@@ -137,8 +142,26 @@ export function learnSystem(repoRoot, { exclude = [] } = {}) {
     }
   }
 
+  // the Button the repo answers with, per package (lib/handmade.mjs)
+  const workspaces = resolveWorkspaces(repoRoot);
+  const buttons = buttonCandidates(ledger, read, workspaces, tsconfigAliases(repoRoot));
+  const packageDeps = new Map();
+  for (const w of workspaces) {
+    let pj = null;
+    try { pj = JSON.parse(read(`${w.dir}/package.json`) ?? 'null'); } catch { /* not a package after all */ }
+    packageDeps.set(w.dir, new Set(Object.keys({ ...pj?.dependencies, ...pj?.devDependencies, ...pj?.peerDependencies })));
+  }
+
   return {
     tokenFile: t.tokenFile,
+    buttons,
+    workspaces,
+    packageDeps,
+    // The files that state the palette: token stylesheets, a Tailwind config,
+    // palette data, a kit theme. Only there is a token's raw value the
+    // definition; in any other file it is a paste of the value where the
+    // name belongs, and a guard should say so (9.1.3).
+    tokenSources: [...new Set([...(t.tokenSources ?? []), ...(kit?.themeFiles ?? []), t.tokenFile].filter(Boolean))],
     colors: t.colors,
     // Every named colour, variants included — not the counted palette. The
     // report counts a token's base statement only, because a dark theme is

package/skills/roast-my-design-system/scripts/lib/handmade.mjs

@@ -0,0 +1,216 @@
+/**
+ * Hand-made buttons where the repo already has a Button.
+ *
+ * The bad-neighbour tests on Twenty (2026-09-29): with the edit hook on,
+ * Haiku reached zero value findings and still hand-made the button four
+ * times in five, with clean token colours. The value checks cannot see the
+ * choice; this one does. Buttons only, for now.
+ *
+ * Fleet probe, 204 clones (2026-09-29): 52 have a Button, 38 of those still
+ * hand-make buttons in page files, but most of those are clickable rows,
+ * tabs, toggles and "show more" links on a button tag for keyboard access,
+ * which nobody wants replaced. So the trigger is narrow: an element DRESSED
+ * as a button (a real background plus padding, a border or a radius), or
+ * one that calls itself a button by name and renders the raw tag. A reset
+ * (background: none; border: 0) is a row, not a button, and stays silent.
+ *
+ * The Button it points at must be visible from the file's own package. In
+ * Twenty the most-used Button is the marketing site's (313 uses); the app
+ * imports its own from twenty-ui. Pointing the app at the website's button
+ * would be worse than silence.
+ */
+
+import { posix } from 'node:path';
+
+const stripExt = (f) => f.replace(/\.[jt]sx?$/, '').replace(/\/index$/, '');
+
+/** Imports of a Button below this are a stray, not the repo's answer. */
+export const BUTTON_MIN_USES = 20;
+
+const NOT_OWN_CODE_RE = /(^|\/)(stories|__stories__|__tests__|__mocks__|test|tests|spec|docs?|examples?|playground|storybook|showcase|sandbox|demo|fixtures?)\/|\.(stories|test|spec)\.[jt]sx?$|(Sandbox|Showcase|Demo|Playground)\.[jt]sx?$/;
+// the system's own layer: a Button-ish thing here is the system being built
+const SYSTEM_LAYER_RE = /(^|\/)(ui|design-system|primitives|core)\/|[\w.-]*button[\w.-]*\.[jt]sx?$/i;
+// A name that says the element is not the action button: a close cross, a
+// chevron, a tab, a chip, a row that happens to be focusable. The fleet
+// probe (five repos, 2026-09-29) found these were most of the styled
+// buttons in page files, and none of them wants the Button.
+const OTHER_ROLE_RE = /(Icon|Close|Toggle|Expand|Collapse|Tab|Pill|Chip|Row|Item|Menu|Delete|Remove|Clear|Trigger|Header|Segment|Switch|Mode|Dot|Hidden|Tooltip|Info|Avatar|Handle|Link|Nav|Thumb|Step|Card|Tile|Option|Cell|Accordion|Summary|Tree|Folder|Image|Query|Checkbox|Radio|Swatch|Uploader|Container|Place|Bar|Control|Filter|Select|Value|Indicator)/;
+
+// Dressed as a button: real padding, and a real background or a real border.
+// A reset (background: none; border: 0; padding: 0) is a row, not a button.
+// An outline button has a border and padding but no background, so either
+// paint counts (Twenty's wizard SecondaryButton, 2026-09-29).
+// `\s*(?!\s)` pins the value's start: without it the regex backtracks past
+// the space after the colon and reads "background: none" as paint
+const REAL_BG = /(?:^|[\s;{])background(?:-color)?\s*:\s*(?!\s)(?!(?:none|transparent|inherit|unset|initial)\s*[;}])[^;}]*[;}]/i;
+const REAL_BORDER = /(?:^|[\s;{])border(?:-(?:top|bottom|left|right))?\s*:\s*(?!\s)(?!(?:none|0|0px|unset)\s*[;}])[^;}]*[;}]/i;
+const REAL_PAD = /(?:^|[\s;{])padding(?:-(?:top|bottom|left|right|inline|block))?\s*:\s*(?!\s)(?!0(?:px)?\s*[;}])[^;}]*[;}]/i;
+// a pseudo-state block (&:hover { background: ... }) is a state, not the
+// resting paint; a class variant block (&.primary { ... }) still counts
+// `${...}` interpolations carry braces of their own (arrow functions,
+// destructured props), so they are blanked first, by brace count, and each
+// reads as a value, not as an empty one
+const blankInterpolations = (body) => {
+  let out = '', i = 0;
+  while (i < body.length) {
+    if (body[i] === '$' && body[i + 1] === '{') {
+      let depth = 0, j = i + 1;
+      for (; j < body.length; j++) { if (body[j] === '{') depth++; else if (body[j] === '}' && --depth === 0) break; }
+      out += '_'; i = j + 1;
+    } else out += body[i++];
+  }
+  return out;
+};
+const stripStates = (body) => blankInterpolations(body).replace(/&?(?::[\w-]+(?:\([^)]*\))?|\[[^\]]*\])+\s*\{[^{}]*\}/g, ' ');
+// An action button carries a label the designer set (a weight, a size, a
+// transform). A card, a select trigger or a list row on a button tag reads
+// differently: text to the left, content spread apart, a column, a stretch
+// to fill the row, or a fixed position. Fleet probe, fifteen repos
+// (2026-09-29): those tells were nearly every innocent hit.
+const LABEL_CSS = /(?:^|[\s;{])(?:font-weight|font-size|text-transform|font-family|letter-spacing)\s*:/i;
+const OTHER_SHAPE_CSS = /(?:^|[\s;{])(?:text-align\s*:\s*left|justify-content\s*:\s*space-between|flex-direction\s*:\s*column|flex\s*:\s*1\b|width\s*:\s*100%|position\s*:\s*(?:absolute|fixed))/i;
+const dressedCss = (raw) => {
+  const body = stripStates(raw);
+  return REAL_PAD.test(body) && (REAL_BG.test(body) || REAL_BORDER.test(body)) && LABEL_CSS.test(body) && !OTHER_SHAPE_CSS.test(body);
+};
+
+// class strings: a bare bg- or border class (a hover: or focus: variant is a
+// state, not the resting paint) plus non-zero padding
+const TW_BG = /(?:^|\s)bg-(?!transparent|inherit|none)[\w[\]#/.-]/;
+const TW_BORDER = /(?:^|\s)border(?:\s|$|-(?!none|0(?:\s|$)|transparent)[\w[\]#/.-]*)/;
+// vertical padding of a full step or more: a badge (py-0.5), an avatar ring
+// (p-0.5) or a select trigger sized by height alone is not a button
+const TW_PAD = /(?:^|\s)p(?:y)?-(?:[1-9]\d*(?:\.\d+)?|\[)/;
+const TW_LABEL = /(?:^|\s)(?:font-(?:medium|semibold|bold|black)|text-white|text-[\w-]*foreground|uppercase)(?:\s|$)/;
+const TW_OTHER_SHAPE = /(?:^|\s)(?:text-left|justify-between|flex-col|items-start|placeholder:[\w-]+|absolute|fixed|hidden|invisible|border-dashed|rounded-full|(?:h|w|size)-(?:\d+|\[[^\]]*\])(?=\s|$))/;
+const dressedClasses = (cls) => TW_PAD.test(cls) && (TW_BG.test(cls) || TW_BORDER.test(cls)) && TW_LABEL.test(cls) && !TW_OTHER_SHAPE.test(cls);
+
+const INLINE_BG = /background(?:Color)?\s*:\s*(?!\s)['"`](?!transparent|none|inherit)/;
+const INLINE_BORDER = /border(?:Top|Bottom|Left|Right)?\s*:\s*(?!\s)['"`](?!none|0)/;
+const INLINE_PAD = /padding(?:Top|Bottom|Left|Right)?\s*:\s*(?!\s)(?!0(?:[,\s}]|$)|['"`]0(?:px)?['"`])/;
+const INLINE_LABEL = /(?:fontWeight|fontSize|textTransform|fontFamily)\s*:/;
+const dressedInline = (style) => INLINE_PAD.test(style) && (INLINE_BG.test(style) || INLINE_BORDER.test(style)) && INLINE_LABEL.test(style);
+
+/**
+ * The hand-made buttons in a piece of component code, each with where it
+ * starts and how it gave itself away.
+ * @returns [{ index, name, how }]  how: 'styled' | 'tag'
+ */
+export function handmadeButtons(text) {
+  const out = [];
+  const src = String(text ?? '');
+
+  // const StyledX = styled.button`...`  /  styled('button')({...})
+  for (const m of src.matchAll(/(?:const|let|var)\s+(\w+)\s*=\s*styled(?:\.button|\(\s*['"]button['"]\s*\))(?:<[^`(]*?>)?\s*(?:`([\s\S]*?)`|\(\s*\{([\s\S]*?)\}\s*\))/g)) {
+    const name = m[1];
+    if (OTHER_ROLE_RE.test(name)) continue;
+    // an object style ({ backgroundColor: '#fff', padding: 8 }) read as CSS
+    const body = m[2] ?? `${(m[3] ?? '').replace(/,/g, ';').replace(/([A-Z])/g, (c) => `-${c.toLowerCase()}`)};`;
+    if (dressedCss(body)) out.push({ index: m.index, name, how: 'styled' });
+  }
+
+  // <button className="bg-brand px-4 py-2">  /  <button style={{ background: ..., padding: ... }}>
+  for (const m of src.matchAll(/<button\b([^>]*)>/g)) {
+    const attrs = m[1];
+    const cls = /className\s*=\s*(?:"([^"]*)"|'([^']*)'|\{`([^`]*)`\})/.exec(attrs);
+    const style = /style\s*=\s*\{\{([^}]*)\}\}/.exec(attrs);
+    if ((cls && dressedClasses(cls[1] ?? cls[2] ?? cls[3] ?? '')) || (style && dressedInline(style[1]))) out.push({ index: m.index, name: null, how: 'tag' });
+  }
+  return out.sort((a, b) => a.index - b.index);
+}
+
+/**
+ * How the repo imports THIS Button, read from the files that use it: the
+ * most common specifier that resolves to the definition. A relative path
+ * resolves by position, an alias (@/ui/Button) by its tail, a package name
+ * by the workspace it names. The harvest credits every same-named copy when
+ * it cannot resolve a package import, so its usedIn for the website's
+ * Button holds app files importing twenty-ui/input; asking "which spec
+ * resolves to this file" is what keeps the answer honest.
+ */
+function importSpecOf(def, read, workspaces, aliases = []) {
+  const counts = new Map();
+  const stem = stripExt(def.file);
+  const resolves = (spec, from) => {
+    if (spec.startsWith('.')) {
+      const target = posix.normalize(posix.join(posix.dirname(from), spec));
+      return stem === target || stem === `${target}/index` || def.file.startsWith(`${target}/`);
+    }
+    // a tsconfig path alias (@sentry/scraps/button → static/app/components/core/button)
+    const al = aliases.find((x) => spec === x.prefix || spec.startsWith(`${x.prefix}/`));
+    if (al) {
+      const target = posix.normalize(spec === al.prefix ? al.dir : `${al.dir}/${spec.slice(al.prefix.length + 1)}`).replace(/\.[cm]?[jt]sx?$/, '');
+      return stem === target || stem === `${target}/index` || def.file.startsWith(`${target}/`);
+    }
+    const alias = /^[@~#]\/(.+)$/.exec(spec);
+    if (alias) return stem.endsWith(`/${alias[1]}`) || stem.endsWith(`/${alias[1]}/index`) || def.file.includes(`/${alias[1]}/`);
+    const ws = (workspaces ?? []).find((w) => spec === w.name || spec.startsWith(`${w.name}/`));
+    return !!ws && def.file.startsWith(`${ws.dir}/`);
+  };
+  for (const f of def.usedIn ?? []) {
+    const text = read(f);
+    if (!text) continue;
+    for (const m of text.matchAll(/import\s+(?:type\s+)?([^'";]*?)\s+from\s+['"]([^'"]+)['"]/g)) {
+      if (!/\bButton\b/.test(m[1])) continue;
+      if (resolves(m[2], f)) counts.set(m[2], (counts.get(m[2]) ?? 0) + 1);
+      break;
+    }
+  }
+  return [...counts.entries()].sort((a, b) => b[1] - a[1])[0]?.[0] ?? null;
+}
+
+/**
+ * The Buttons a repo could answer with: every reusable component called
+ * Button, in the team's own code, imported at least BUTTON_MIN_USES times.
+ * @returns [{ file, usageCount, spec }]  spec: how the repo imports it, proven
+ */
+export function buttonCandidates(components, read, workspaces = [], aliases = []) {
+  return components
+    .filter((c) => c.name === 'Button' && !c.isPage && c.usageCount >= BUTTON_MIN_USES && !NOT_OWN_CODE_RE.test(c.file))
+    .map((c) => ({ file: c.file, usageCount: c.usageCount, spec: importSpecOf(c, read, workspaces, aliases) }))
+    // no file provably imports it (an alias the repo resolves elsewhere, or a
+    // name the harvest credited from other copies): no answer to point at
+    .filter((c) => c.spec)
+    .sort((a, b) => b.usageCount - a.usageCount);
+}
+
+/** The workspace package a file belongs to, or null. */
+export const packageOf = (file, workspaces) =>
+  (workspaces ?? []).filter((w) => file === w.dir || file.startsWith(`${w.dir}/`)).sort((a, b) => b.dir.length - a.dir.length)[0] ?? null;
+
+/**
+ * The Button a file should reach for: the most-used candidate visible from
+ * the file's package (its own, one it depends on, or code outside every
+ * package). Null when the repo has no answer for this file.
+ */
+export function buttonFor(file, { buttons = [], workspaces = [], packageDeps = new Map() } = {}) {
+  if (!buttons.length) return null;
+  const mine = file ? packageOf(file, workspaces) : null;
+  const deps = mine ? packageDeps.get(mine.dir) ?? new Set() : new Set();
+  const visible = buttons.filter((b) => {
+    const theirs = packageOf(b.file, workspaces);
+    if (!mine || !theirs) return true;
+    return theirs.dir === mine.dir || deps.has(theirs.name);
+  });
+  return visible[0] ?? null;
+}
+
+/**
+ * Findings for the hand-made buttons in a file, against the Button the repo
+ * answers with. Warnings: the check has not yet earned a violation.
+ */
+export function handmadeButtonFindings(text, { file = null } = {}, k) {
+  if (!file || SYSTEM_LAYER_RE.test(file) || NOT_OWN_CODE_RE.test(file)) return [];
+  const button = buttonFor(file, k);
+  if (!button) return [];
+  const out = [];
+  for (const h of handmadeButtons(text)) {
+    const what = h.how === 'styled' ? `A styled button (${h.name})` : 'A button tag styled by hand';
+    out.push({
+      rule: 'handmade-button', severity: 'warning', index: h.index,
+      message: `${what} where the repo already has <Button> (imported ${button.usageCount}x${button.spec ? ` from ${button.spec}` : `, ${button.file}`}).`,
+      fix: `Use ${button.spec ? `import { Button } from '${button.spec}'` : `the Button in ${button.file}`}. If it needs a kind the Button lacks, add a variant there rather than a new button here.`,
+    });
+  }
+  return out;
+}

package/skills/roast-my-design-system/scripts/lib/version.mjs

@@ -1,7 +1,7 @@
 // Single version constant for the engine — imported by diagnose (report
 // footer) and rules (generated-by line). This is the bump spot that used to
 // live as a const inside diagnose/index.mjs.
-export const VERSION = '9.1.1';
+export const VERSION = '9.2.0';
 // The shape of harvest.json and summary.json. Bumped only when a field is
 // renamed, removed or changes meaning; a new field is not a new schema. A
 // tool comparing two scans compares like with like by this number, not by VERSION.

package/skills/roast-my-design-system/scripts/lib/workspaces.mjs

@@ -57,14 +57,37 @@ const memo = new Map();
 const mtime = (p) => { try { return statSync(p).mtimeMs; } catch { return 0; } };
 
 export function resolveWorkspaces(root) {
-  const key = `${mtime(join(root, 'package.json'))}:${mtime(join(root, 'pnpm-workspace.yaml'))}`;
+  const sub = workspaceSubroot(root);
+  const at = sub ? join(root, sub) : root;
+  const key = `${sub ?? ''}:${mtime(join(at, 'package.json'))}:${mtime(join(at, 'pnpm-workspace.yaml'))}`;
   const hit = memo.get(root);
   if (hit && hit.key === key) return hit.value.map((w) => ({ ...w }));
-  const value = resolveWorkspacesUncached(root);
+  const value = resolveWorkspacesUncached(at).map((w) => (sub ? { ...w, dir: `${sub}/${w.dir}` } : w));
   memo.set(root, { key, value });
   return value.map((w) => ({ ...w }));
 }
 
+const declaresWorkspaces = (dir) => {
+  const pkg = readJSON(join(dir, 'package.json'));
+  return !!(Array.isArray(pkg?.workspaces) || Array.isArray(pkg?.workspaces?.packages) || existsSync(join(dir, 'pnpm-workspace.yaml')));
+};
+/**
+ * A polyglot repo keeps its JavaScript one level down: Mattermost's root is
+ * Go and webapp/package.json declares the workspaces (2026-09-29). When the
+ * root declares none, the first immediate subfolder that does is the
+ * workspace root, and every package dir is reported under it.
+ */
+function workspaceSubroot(root) {
+  if (declaresWorkspaces(root)) return null;
+  let entries;
+  try { entries = readdirSync(root, { withFileTypes: true }); } catch { return null; }
+  for (const e of entries.sort((a, b) => a.name.localeCompare(b.name))) {
+    if (!e.isDirectory() || e.name.startsWith('.') || e.name === 'node_modules') continue;
+    if (declaresWorkspaces(join(root, e.name))) return e.name;
+  }
+  return null;
+}
+
 function resolveWorkspacesUncached(root) {
   const patterns = [];
   const pkg = readJSON(join(root, 'package.json'));

package/skills/roast-my-design-system/scripts/mcp/engine.mjs

@@ -23,6 +23,7 @@ import { oklab } from '../lib/color.mjs';
 import { tokenTwinFindings } from '../lib/tokentwins.mjs';
 import { avoidedImportFindings } from '../lib/avoidedimports.mjs';
 import { isChartFile, chartFindings } from '../lib/charts.mjs';
+import { handmadeButtonFindings } from '../lib/handmade.mjs';
 
 // What this engine measures — shipped with every result, clean or not.
 export const CHECKS = [
@@ -43,10 +44,11 @@ export const CHECKS = [
 // MUI repo says the kit check ran.
 export const KIT_CHECK = 'colours and pixel sizes written onto kit components where the theme has a value';
 export const PALETTE_CHECK = 'palette classes where the theme names a colour';
+export const BUTTON_CHECK = 'hand-made buttons where the repo has a Button';
 export function checksFor(k) {
-  if (k?.kit) return [...CHECKS, KIT_CHECK];
-  if (k?.tailwind || k?.shadcn) return [...CHECKS, PALETTE_CHECK];
-  return CHECKS;
+  const list = k?.kit ? [...CHECKS, KIT_CHECK] : (k?.tailwind || k?.shadcn) ? [...CHECKS, PALETTE_CHECK] : [...CHECKS];
+  if (k?.buttons?.length) list.push(BUTTON_CHECK);
+  return list;
 }
 // "an MUI component", "an Ant Design component", "a Mantine component"
 
@@ -197,18 +199,27 @@ export function validateContent(content, k) {
 
   // ---------- colours ----------
   const seenHere = new Set();
+  const statesTokens = !!file && k.tokenSources?.has(file);
   for (const c of got.colors) {
     if (seenHere.has(`${c.value}:${c.index}`)) continue;
     seenHere.add(`${c.value}:${c.index}`);
     if (kitOwnsColours || chartFile) continue; // the kit judge or the chart rule said it, or judged it not paint
     const info = k.colorInfo.get(c.value);
-    if (info?.isToken) continue; // it IS the token's value — the system can see it
+    // A token's raw value is the definition only inside a file that states
+    // the palette (a token stylesheet, a Tailwind config, a kit theme). In a
+    // component it is the value pasted where the name belongs: the system
+    // cannot see it, and the next reader copies the hex. Until 9.1.3 every
+    // exact match walked free, and hooked agents on Twenty wrote
+    // background: #4a38f5 with a clean bill (2026-09-29).
+    if (info?.isToken && statesTokens) continue;
     const near = nearestToken(c.value, k);
     const priors = discount(info?.count, localColor, c.value);
     if (near && near.d === 0) {
+      const names = k.tokenNames?.get(c.value) ?? [];
+      const by = names.length ? `${css ? `var(${names[0]})` : names[0]}` : `the token that already holds ${near.value}`;
       add('hardcoded-colour', 'violation', c.index,
         `Hardcoded colour ${c.value} duplicates an existing token value.`,
-        `Use the token that already holds ${near.value}${k.tokens.tokenFile ? ` (defined in ${k.tokens.tokenFile})` : ''}.`);
+        `Use ${by}${k.tokens.tokenFile ? ` (defined in ${k.tokens.tokenFile})` : ''}.`);
     } else if (near && near.d <= 8) {
       add('near-token-twin', 'violation', c.index,
         `${c.value} is visually identical to the token ${near.value}.`,
@@ -224,6 +235,11 @@ export function validateContent(content, k) {
     }
   }
 
+  // ---------- the choice, not the value: a button from scratch ----------
+  // The value checks above cannot see it. Hooked agents on Twenty passed
+  // them and still hand-made the button four times in five (2026-09-29).
+  if (!css) for (const f of handmadeButtonFindings(text, { file }, k)) add(f.rule, f.severity, f.index, f.message, f.fix);
+
   // ---------- spacing ----------
   for (const s of got.spacing) {
     if (kitPx.has(s.value)) continue; // the kit line above said it

package/skills/roast-my-design-system/scripts/mcp/knowledge.mjs

@@ -19,6 +19,8 @@ import { findDuplicates } from '../harvest/duplicates.mjs';
 import { harvestContext } from '../harvest/context.mjs';
 import { loadExclusions } from '../lib/exclusions.mjs';
 import { resolveWorkspaces } from '../lib/workspaces.mjs';
+import { buttonCandidates } from '../lib/handmade.mjs';
+import { tsconfigAliases } from '../harvest/components.mjs';
 import { neverImportedComponents } from '../lib/neverimported.mjs';
 import { typefaceOf } from '../lib/typefaces.mjs';
 import { hexRgb } from '../lib/nearpairs.mjs';
@@ -80,6 +82,14 @@ export function loadKnowledge(root) {
   const colorInfo = new Map(); // value → { count, isToken }
   for (const c of tokens.colors) colorInfo.set(c.value, { count: c.count, isToken: c.isToken });
   const tokenColors = [...colorInfo.entries()].filter(([, i]) => i.isToken).map(([v]) => v);
+  // value → the custom-property names that hold it, so a check can say
+  // "use var(--color-brand)" rather than only "use the token"
+  const tokenNames = new Map();
+  for (const c of tokens.colors) if (c.names?.length) tokenNames.set(c.value, c.names);
+  // the files that state the palette (token stylesheets, a Tailwind config,
+  // a kit theme, palette data): the only files where a token's raw value is
+  // the definition rather than a paste of it
+  const tokenSources = new Set([...(tokens.tokenSources ?? []), ...(kit?.themeFiles ?? []), tokens.tokenFile].filter(Boolean));
 
   // spacing the repo already uses: raw CSS values with counts, plus whether
   // the repo styles spacing through Tailwind at all (decides what "on-scale" means)
@@ -123,6 +133,18 @@ export function loadKnowledge(root) {
 
   const neverImported = neverImportedComponents(components, profile.uiDir);
 
+  // The Button the repo answers with, per package: the candidates, and what
+  // each workspace package depends on, so a file is pointed at a Button it
+  // can actually import (lib/handmade.mjs).
+  const readK = (f) => readSource(join(root, f));
+  const buttons = buttonCandidates(components, readK, workspaces, tsconfigAliases(root));
+  const packageDeps = new Map();
+  for (const w of workspaces) {
+    let pj = null;
+    try { pj = JSON.parse(readK(`${w.dir}/package.json`) ?? 'null'); } catch { /* not a package after all */ }
+    packageDeps.set(w.dir, new Set(Object.keys({ ...pj?.dependencies, ...pj?.devDependencies, ...pj?.peerDependencies })));
+  }
+
   // The copies of each duplicated name with their usage, and the colours each
   // copy hard-codes: what the avoided-import check names (lib/avoidedimports).
   const read = (file) => readSource(join(root, file));
@@ -152,6 +174,10 @@ export function loadKnowledge(root) {
     workspaces,
     // indexes
     colorInfo,
+    buttons,
+    packageDeps,
+    tokenNames,
+    tokenSources,
     tokenColors,
     tokenColorRgb: tokenColors.map((v) => ({ value: v, rgb: hexRgb(v) })).filter((t) => t.rgb),
     spacingSeen,