roast-my-design-system 4.2.2 → 4.2.4

package/bin/roast.mjs

@@ -95,9 +95,10 @@ const tmp = mkdtempSync(join(tmpdir(), 'roast-'));
 const harvestPath = join(tmp, 'harvest.json');
 const summaryPath = join(tmp, 'summary.json');
 
-function run(script, args) {
+function run(script, args, env) {
   // --json keeps stdout clean for the JSON payload; child chatter is dropped
-  const r = spawnSync(process.execPath, [join(SCRIPTS, script), ...args], { stdio: asJson ? 'ignore' : 'inherit' });
+  const r = spawnSync(process.execPath, [join(SCRIPTS, script), ...args],
+    { stdio: asJson ? 'ignore' : 'inherit', ...(env ? { env: { ...process.env, ...env } } : {}) });
   if (r.status !== 0) {
     rmSync(tmp, { recursive: true, force: true });
     process.exit(r.status ?? 1);
@@ -106,8 +107,10 @@ function run(script, args) {
 const say = (s) => { if (!asJson) console.log(s); };
 
 say(`roast-my-design-system ${VERSION} · read-only scan, nothing leaves your machine\n`);
+// the harvest goes to a temp dir this wrapper deletes right after; tell the
+// script so it does not print a path that will be gone seconds later
 run('harvest/index.mjs', [target, '--out', harvestPath,
-  ...excludes.flatMap((e) => ['--exclude', e])]);
+  ...excludes.flatMap((e) => ['--exclude', e])], { ROAST_EPHEMERAL_OUT: '1' });
 say('');
 run('diagnose/index.mjs', [harvestPath, '--out', outPath, '--theme', theme, '--summary', summaryPath,
   ...(commissionedBy ? ['--by', commissionedBy] : [])]);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "roast-my-design-system",
-  "version": "4.2.2",
+  "version": "4.2.4",
   "description": "Your AI can write the UI. This makes sure it writes your UI. A deterministic scanner counts every colour, spacing value and duplicate component, scores you 0-100 against 34 public repos, scopes the scan with .roastignore, injects agent rules with --apply.",
   "keywords": [
     "design-system",

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

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * Diagnose — step 2 of the Proffer pipeline. Renders a harvest.json into a
+ * Diagnose — step 2 of the pipeline. Renders a harvest.json into a
  * single self-contained HTML report: the visceral, shareable "here's your
  * mess" page with real file paths. No dependencies, no server — one file.
  *

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

@@ -1,7 +1,7 @@
 /**
  * Component harvest — every component defined in the repo, with its REAL prop
  * signature and where it is actually used. Parsers lifted from 1.0's
- * compile-skill.mjs (proffer-spine/tools) — brace/string-aware regex parsing,
+ * compile-skill.mjs — brace/string-aware regex parsing,
  * no AST dependency — then extended to scan the whole repo, not one ui/ dir.
  */
 import { readFileSync } from 'node:fs';

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

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 /**
- * Harvest — step 1 of the Proffer pipeline. Non-destructive scan of a repo:
+ * Harvest — step 1 of the pipeline. Non-destructive scan of a repo:
  * components (real props, real usages), all styling, implicit tokens with
  * frequency counts, duplicates, context files. Writes harvest.json; prints a
  * one-screen summary (the seed of the step-2 diagnosis).
@@ -159,23 +159,45 @@ writeFileSync(outPath, JSON.stringify(harvest, null, 2));
 // ---------- one-screen summary ----------
 const nonPage = components.filter((c) => !c.isPage);
 const hexColors = tokens.colors.filter((c) => c.value.startsWith('#'));
-const top = (list, n = 5) => list.slice(0, n).map((e) => `${e.value} ×${e.count}`).join(', ');
+// A truncated capture like "rgba(var(--ink-rgb)" reads as a glitch in the
+// terminal; the token reference inside it is the real story, so show that.
+const showVal = (v) => {
+  const m = /var\((--[A-Za-z0-9_-]+)/.exec(v);
+  const balanced = (v.match(/\(/g) ?? []).length === (v.match(/\)/g) ?? []).length;
+  return m && !balanced ? `var(${m[1]})` : v;
+};
+// A "top" list is only news when something repeats; all-×1 says nothing.
+const top = (list, n = 5) => list.some((e) => e.count > 1)
+  ? `   top: ${list.slice(0, n).map((e) => `${showVal(e.value)} ×${e.count}`).join(', ')}`
+  : (list.length ? ', none repeated' : '');
 
 console.log(`\nHarvest: ${profile.name ?? target}`);
 console.log(`  framework: ${profile.framework}${profile.typescript ? ' + TS' : ''}   design system: ${profile.designSystem.kind}${profile.designSystem.name ? ` (${profile.designSystem.name})` : ''}   styling: ${profile.stylingDeps.join(', ') || 'none detected'}`);
 console.log(`  files: ${files.code.length} code, ${files.styles.length} style`);
 if (exclusions.patterns.length) {
-  const list = exclusions.patterns.map((p) => `${p.pattern} (${p.files} files, ${p.source})`).join(', ');
-  console.log(`  excluded by you: ${list}`);
+  // Same voice as the report header: source named once, slashes on folders,
+  // and the total at the end because that is the number that lands.
+  const groups = [...new Set(exclusions.patterns.map((p) => p.source))].map((src) => {
+    const own = exclusions.patterns.filter((p) => p.source === src);
+    return `(${src}): ${own.map((p, i) => `${p.pattern}/ ${p.files}${i === 0 ? ' files' : ''}`).join(', ')}`;
+  });
+  const total = exclusions.patterns.reduce((sum, p) => sum + p.files, 0);
+  console.log(`  excluded by you ${groups.join(' · ')} · ${total} files kept out of this scan`);
 }
 console.log(`\n  components: ${components.length} defined (${nonPage.length} reusable, ${components.length - nonPage.length} pages)`);
 console.log(`  duplicates: ${duplicates.exactDuplicates.length} exact same-name, ${duplicates.families.length} name families`);
 for (const d of duplicates.exactDuplicates.slice(0, 3)) console.log(`    · ${d.name} defined in ${d.files.length} files`);
 for (const f of duplicates.families.slice(0, 3)) console.log(`    · ${f.root} family: ${f.members.map((m) => m.name).join(', ')}`);
-console.log(`\n  colours: ${tokens.colors.length} distinct (${hexColors.length} hex, of which ${tokens.greyCount} greys)   top: ${top(tokens.colors, 4)}`);
-console.log(`  spacing: ${tokens.spacing.length} distinct CSS values   top: ${top(tokens.spacing, 5)}`);
+console.log(`\n  colours: ${tokens.colors.length} distinct (${hexColors.length} hex, of which ${tokens.greyCount} greys)${top(tokens.colors, 4)}`);
+console.log(`  spacing: ${tokens.spacing.length} distinct CSS values${top(tokens.spacing, 5)}`);
 console.log(`  radii: ${tokens.radii.length}   font sizes: ${tokens.fontSizes.length}   font families: ${tokens.fontFamilies.length}   shadows: ${tokens.shadows.length}`);
 console.log(`  tailwind: ${tokens.tailwind.colors.length} colour utils, ${tokens.tailwind.spacing.length} spacing utils, ${tokens.tailwind.textSizes.length} text sizes`);
 console.log(`  inline styles: ${tokens.inlineStyles.count} blocks`);
 console.log(`  context files: ${context.map((c) => c.file).join(', ') || 'none'}`);
-console.log(`\n  → ${outPath}   (${harvest.tookMs}ms)\n`);
+// The npx wrapper writes the harvest to a temp dir it deletes right after;
+// pointing the user at a path that will not exist is noise there.
+if (process.env.ROAST_EPHEMERAL_OUT === '1') {
+  console.log(`\n  scanned in ${harvest.tookMs}ms\n`);
+} else {
+  console.log(`\n  → ${outPath}   (${harvest.tookMs}ms)\n`);
+}

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

@@ -1,5 +1,5 @@
 /**
- * File walker + repo profile. Adapted from 1.0's repo-inspect (proffer-spine),
+ * File walker + repo profile. Adapted from an earlier internal repo inspector,
  * widened: the harvester must see EVERYTHING that styles the app — code,
  * stylesheets of any flavor, and config — not just a happy-path shadcn layout.
  */
@@ -142,11 +142,15 @@ export function profileRepo(root, files) {
   deps = { ...deps, ...pkg.dependencies, ...pkg.devDependencies };
   const monorepo = pkgFiles.some((f) => f !== 'package.json');
 
+  // Hand-built sites are a real category, not a detection failure: "unknown"
+  // next to a good score reads like a shrug, so name what is actually there.
+  const htmlFiles = files.other.filter((f) => /\.html?$/.test(f)).length;
   const framework =
     deps.next ? 'next'
     : deps['@remix-run/react'] || deps['@react-router/dev'] ? 'remix'
     : deps.vite && deps.react ? 'vite-react'
     : deps.react ? 'react'
+    : htmlFiles > 0 ? 'static HTML/CSS'
     : 'unknown';
 
   const componentsJson = readJSON(join(root, 'components.json'));
@@ -156,10 +160,19 @@ export function profileRepo(root, files) {
   const knownLib = KNOWN_LIBRARIES.find((d) => deps[d.pkg]);
   const homegrown = files.code.filter((f) => /(^|\/)components\//.test(f) && !/\/components\/ui\//.test(f) && /\.(tsx|jsx)$/.test(f));
 
+  // A design system does not have to arrive through npm. A stylesheet defining
+  // a real set of CSS custom properties IS one — arguably the purest form —
+  // and calling it "none" undersells exactly the discipline the ideal asks for.
+  const tokenDefs = files.styles.slice(0, 8).reduce((sum, f) => {
+    const css = read(join(root, f));
+    return sum + (css ? (css.match(/--[A-Za-z0-9_-]+\s*:/g) ?? []).length : 0);
+  }, 0);
+
   let designSystem;
   if (isShadcn) designSystem = { kind: 'shadcn', name: 'shadcn/ui', confidence: 'high' };
   else if (knownLib) designSystem = { kind: 'library', name: knownLib.name, pkg: knownLib.pkg, confidence: 'high' };
   else if (homegrown.length >= 3) designSystem = { kind: 'custom', name: 'custom (unrecognized)', confidence: 'low' };
+  else if (tokenDefs >= 5) designSystem = { kind: 'custom', name: 'CSS tokens', confidence: 'medium' };
   else designSystem = { kind: 'none', confidence: 'high' };
 
   // Import alias from tsconfig paths or components.json
@@ -171,7 +184,10 @@ export function profileRepo(root, files) {
     if (key) alias = key.replace('/*', '');
   }
 
-  const styling = STYLING_DEPS.filter((s) => deps[s.pkg]).map((s) => s.label);
+  // No toolchain in package.json does not mean no styling: if the walk found
+  // real stylesheets, plain CSS is what is there — say so, not "none detected".
+  let styling = STYLING_DEPS.filter((s) => deps[s.pkg]).map((s) => s.label);
+  if (!styling.length && files.styles.length) styling = ['plain CSS'];
 
   // The git remote is a far better identity than package.json's name field
   // ("chatbot" vs "vercel/ai-chatbot"). Parsed from .git/config, no git exec.

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

@@ -1,4 +1,4 @@
 // 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 = '4.2.2';
+export const VERSION = '4.2.4';