roast-my-design-system 4.0.0 → 4.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -49,7 +49,26 @@ The same report in light mode (one file, built-in toggle):
|
|
|
49
49
|
npx roast-my-design-system
|
|
50
50
|
```
|
|
51
51
|
|
|
52
|
-
Run it inside any repo. Same scanner, same report, straight from npm.
|
|
52
|
+
Run it inside any repo. Same scanner, same report, straight from npm. The Claude Code skill below adds the conversation on top: the roast in chat, then a punch list you can actually work through with Claude.
|
|
53
|
+
|
|
54
|
+
## Every command
|
|
55
|
+
|
|
56
|
+
One scan powers all of it; the flags decide what lands on disk. Combine freely.
|
|
57
|
+
|
|
58
|
+
| Command | What you get |
|
|
59
|
+
|---|---|
|
|
60
|
+
| `npx roast-my-design-system` | The scan and `design-system-roast.html`, opened in your browser |
|
|
61
|
+
| `npx roast-my-design-system <path>` | Scan a different repo than the current directory |
|
|
62
|
+
| `... --apply` | The generated agent rules injected straight into your `CLAUDE.md`, `AGENTS.md`, `.cursorrules` or `.cursor/rules/`, inside a marked block. Re-running replaces only that block, never your own text |
|
|
63
|
+
| `... --rules` | The same rules written to `design-system-rules.md` instead, for pasting by hand |
|
|
64
|
+
| `... --card` | `roast-card.svg`: a shareable 1200x630 card with the score and worst findings. Pure SVG, embeds in a README |
|
|
65
|
+
| `... --sarif` | `design-system-roast.sarif` for GitHub code scanning: upload it in CI and findings appear in the Security tab, annotated on files |
|
|
66
|
+
| `... --by "Ada Lovelace"` | A requester credit in the report header, next to the scan date |
|
|
67
|
+
| `... --json` | The scan summary as JSON on stdout, for scripts and pipelines |
|
|
68
|
+
| `... --theme light` / `--out <file>` / `--no-open` | Light report, custom report path, don't open the browser |
|
|
69
|
+
| `/roast-my-design-system` (in Claude Code) | The full experience: the roast in chat, the report, the rules offer, and the fix loop with Claude on your own numbers |
|
|
70
|
+
|
|
71
|
+
Every scan also checks the agent rules you already have and flags stale references, no flag needed.
|
|
53
72
|
|
|
54
73
|
**Claude Code (recommended):**
|
|
55
74
|
|
package/bin/roast.mjs
CHANGED
|
@@ -52,6 +52,8 @@ Usage: npx roast-my-design-system [path] [options]
|
|
|
52
52
|
the score and worst findings (pure SVG, embeds in READMEs)
|
|
53
53
|
--sarif also write design-system-roast.sarif for GitHub code
|
|
54
54
|
scanning: findings annotated on files in the Security tab
|
|
55
|
+
--by <name> put a requester credit in the report header, next to the
|
|
56
|
+
scan date ("commissioned by <name>")
|
|
55
57
|
--json print the scan summary as JSON on stdout (implies --no-open)
|
|
56
58
|
|
|
57
59
|
Read-only scan (--apply and --rules write only the files they name).
|
|
@@ -66,6 +68,7 @@ const wantSarif = flag('sarif') === true;
|
|
|
66
68
|
const asJson = flag('json') === true;
|
|
67
69
|
const noOpen = flag('no-open') === true || asJson;
|
|
68
70
|
const theme = opt('theme', 'dark');
|
|
71
|
+
const commissionedBy = opt('by', null);
|
|
69
72
|
const target = resolve(argv.find((a) => !a.startsWith('--')) || process.cwd());
|
|
70
73
|
if (!existsSync(target) || !statSync(target).isDirectory()) {
|
|
71
74
|
console.error(`Not a directory: ${target}`);
|
|
@@ -90,7 +93,8 @@ const say = (s) => { if (!asJson) console.log(s); };
|
|
|
90
93
|
say(`roast-my-design-system ${VERSION} · read-only scan, nothing leaves your machine\n`);
|
|
91
94
|
run('harvest/index.mjs', [target, '--out', harvestPath]);
|
|
92
95
|
say('');
|
|
93
|
-
run('diagnose/index.mjs', [harvestPath, '--out', outPath, '--theme', theme, '--summary', summaryPath
|
|
96
|
+
run('diagnose/index.mjs', [harvestPath, '--out', outPath, '--theme', theme, '--summary', summaryPath,
|
|
97
|
+
...(commissionedBy ? ['--by', commissionedBy] : [])]);
|
|
94
98
|
|
|
95
99
|
const rulesPath = resolve(join(target, 'design-system-rules.md'));
|
|
96
100
|
if (wantRules) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "roast-my-design-system",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.1.0",
|
|
4
4
|
"description": "Roast your design system with real data. A deterministic, zero-dependency scanner that counts everything that betrays a design system, from colours and their near-identical twins to greys, spacing values, typefaces, duplicated and never-imported components, inline styles, !important and arbitrary Tailwind values, scores it 0-100 against Ideal Design System norms and a 34-repo benchmark, scores monorepos package by package from the workspace declaration, generates a shareable HTML diagnosis, flags stale references in the agent rules you already have, and with --apply injects the generated rules file straight into CLAUDE.md, AGENTS.md or .cursor/rules so the mess stops coming back. Also ships --card (shareable SVG roast card) and --sarif (GitHub code scanning export).",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"design-system",
|
|
@@ -113,6 +113,9 @@ const THEMES = {
|
|
|
113
113
|
},
|
|
114
114
|
};
|
|
115
115
|
const themeName = arg('theme', 'dark');
|
|
116
|
+
// Requester credit ("commissioned by"): their name up top next to the scan
|
|
117
|
+
// date; the generated-by authorship stays in the footer, never confused.
|
|
118
|
+
const commissionedBy = arg('by', null);
|
|
116
119
|
const T = THEMES[themeName];
|
|
117
120
|
if (!T) { console.error(`Unknown theme "${themeName}" (dark | light)`); process.exit(1); }
|
|
118
121
|
|
|
@@ -1193,7 +1196,7 @@ const html = `<!doctype html>
|
|
|
1193
1196
|
<div>
|
|
1194
1197
|
<div class="kicker"><span class="dot"></span>Scan complete · ${h.tookMs}ms · ${n(h.files.code)} code files</div>
|
|
1195
1198
|
<h1>Design System Diagnosis</h1>
|
|
1196
|
-
<div class="meta"><span class="mono">${esc(repoName)}</span> · scanned ${esc((h.harvestedAt ?? '').slice(0, 10))}</div>
|
|
1199
|
+
<div class="meta"><span class="mono">${esc(repoName)}</span> · scanned ${esc((h.harvestedAt ?? '').slice(0, 10))}${commissionedBy ? ` · commissioned by ${esc(commissionedBy)}` : ''}</div>
|
|
1197
1200
|
</div>
|
|
1198
1201
|
${healthScore !== null ? `<div class="score${noSystemLikely ? ' muted' : ''}">${eyebrow('Health score')}<div class="val">${healthScore}<span class="slash">/</span><span class="of">100</span></div>${noSystemLikely ? '<div class="note">little here to score · see the note below</div>' : ''}</div>` : ''}
|
|
1199
1202
|
</div>
|
|
@@ -1286,6 +1289,7 @@ if (summaryPath) {
|
|
|
1286
1289
|
writeFileSync(resolve(summaryPath), JSON.stringify({
|
|
1287
1290
|
repo: repoName,
|
|
1288
1291
|
version: VERSION,
|
|
1292
|
+
...(commissionedBy ? { commissionedBy } : {}),
|
|
1289
1293
|
score: healthScore,
|
|
1290
1294
|
noSystemLikely,
|
|
1291
1295
|
verdict,
|