roast-my-design-system 5.1.2 → 5.1.3

package/bin/roast.mjs

@@ -211,6 +211,13 @@ if (wantApply && !asJson) {
 say(`\nWant the fixes, not just the roast? The free Claude Code skill runs this same
 scan, then walks the punch list with you: https://github.com/pencilrebel/roast-my-design-system`);
 
+// The ask for feedback, worded and linked in one place (scripts/lib/feedback.mjs)
+// so the terminal and the report footer can never say different things.
+if (!asJson) {
+  const { feedbackUrl, FEEDBACK_ASK, FEEDBACK_CTA } = await import(pathToFileURL(join(SCRIPTS, 'lib/feedback.mjs')).href);
+  say(`\n${FEEDBACK_ASK} ${FEEDBACK_CTA}:\n${feedbackUrl(VERSION)}`);
+}
+
 if (!noOpen) {
   // Windows: `start` treats a first quoted arg as the window TITLE, and Node
   // quotes paths containing spaces — pass an empty title so the path lands

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "roast-my-design-system",
-  "version": "5.1.2",
+  "version": "5.1.3",
   "mcpName": "io.github.pencilrebel/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 34 public repos, 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

@@ -22,6 +22,7 @@ import { rulesMarkdown } from '../rules/build.mjs';
 import { nearColorPairs } from '../lib/nearpairs.mjs';
 import { neverImportedComponents } from '../lib/neverimported.mjs';
 import { VERSION } from '../lib/version.mjs';
+import { feedbackUrl, FEEDBACK_ASK, FEEDBACK_CTA } from '../lib/feedback.mjs';
 
 // The benchmark (Ideal-2026 norms + scanned-repo stats) ships next to the
 // code so the page works offline; degrade gracefully when absent.
@@ -318,6 +319,11 @@ const ICONS = {
   info: '',
 };
 
+// Feather "activity", the pulse line, points reversed so it traces left to
+// right. Sits before the footer's feedback link
+// and inherits its colour through currentColor, so it follows the theme.
+const PULSE_ICON = '<svg class="pulse" viewBox="0 0 24 24" aria-hidden="true"><polyline points="2 12 6 12 9 3 15 21 18 12 22 12"/></svg>';
+
 // Comparison rows inside a tile: your number vs each yardstick.
 // ▼ mint = you sit at or under the reference, ▲ coral = you're over it.
 function row(label, valText, refVal, value) {
@@ -1210,6 +1216,17 @@ const html = `<!doctype html>
     border-top:1px solid var(--line); margin-top:40px; padding-top:22px; color:var(--dim); font-size:11.5px; }
   .foot-left { display:grid; gap:5px; }
   .foot-sub { color:var(--dim2); }
+  .foot-sub .feedback { color:var(--accent); font-weight:700; text-decoration:none; }
+  .foot-sub .feedback:hover { text-decoration:underline; }
+  .foot-sub .pulse { width:14px; height:14px; vertical-align:-3px; margin-right:5px; fill:none;
+    stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
+  /* The line traces itself and sweeps out, like a heart monitor. 46 is the
+     polyline's own length, so the dash covers it exactly. */
+  .foot-sub .pulse polyline { stroke-dasharray:46; animation:pulse-trace 3.4s cubic-bezier(.5,0,.5,1) infinite; }
+  @keyframes pulse-trace { 0% { stroke-dashoffset:46; } 55% { stroke-dashoffset:0; } 100% { stroke-dashoffset:-46; } }
+  @media (prefers-reduced-motion: reduce) {
+    .foot-sub .pulse polyline { animation:none; stroke-dashoffset:0; }
+  }
   .scan-id { font-family:var(--mono); font-size:11px; letter-spacing:.04em; }
   footer .brand { color:var(--accent); font-weight:700; text-decoration:none; }
   footer .brand:hover { text-decoration:underline; }
@@ -1338,7 +1355,7 @@ ${componentsSection()}
 <footer>
   <div class="foot-left">
     <div>Generated by <a class="brand" href="https://github.com/pencilrebel/roast-my-design-system">roast-my-design-system</a> <span class="ver">ver. ${VERSION}</span>, free on npm and as a Claude Code + Codex skill</div>
-    <div class="foot-sub">Designed and built by <a class="author" href="https://gregkozakiewicz.com"><span class="gk-mark"></span>Greg Kozakiewicz</a> · <span class="scan-id" title="scan id">${scanId}</span></div>
+    <div class="foot-sub">Designed and built by <a class="author" href="https://gregkozakiewicz.com/?utm_source=roast-report"><span class="gk-mark"></span>Greg Kozakiewicz</a> · <span class="scan-id" title="scan id">${scanId}</span> · ${FEEDBACK_ASK} <a class="feedback" href="${feedbackUrl(VERSION).replace(/&/g, '&amp;')}">${PULSE_ICON}${FEEDBACK_CTA}</a></div>
   </div>
   <span class="creds"><span>Non-destructive scan</span><span>Read-only</span><span>Paths are real</span></span>
 </footer>

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

@@ -0,0 +1,19 @@
+// The one place feedback is asked for. Used by the report footer and by the
+// npx CLI's outro, so the wording and the link never drift apart.
+//
+// It is a plain link to a GitHub issue form (.github/ISSUE_TEMPLATE/feedback.yml
+// in the public repo, which is where the questions and Greg's note live, so the
+// wording can change without a release). Nothing is sent and nothing is
+// collected: the tool promises that nothing leaves the machine, and the link
+// carries the version only, so a scan can never publish itself by accident.
+
+const REPO = 'https://github.com/pencilrebel/roast-my-design-system';
+
+export const FEEDBACK_ASK = 'Think it got something wrong?';
+export const FEEDBACK_CTA = 'Say so, and say which bit';
+
+export function feedbackUrl(version) {
+  // `version` matches the input id in feedback.yml, which is how GitHub issue
+  // forms accept a prefilled value.
+  return `${REPO}/issues/new?template=feedback.yml&version=${encodeURIComponent(version)}`;
+}

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 = '5.1.2';
+export const VERSION = '5.1.3';