@dunnewold-labs/mr-manager 0.4.46 → 0.4.48

package/dist/index.mjs

@@ -185,7 +185,7 @@ import { fileURLToPath } from "url";
 // cli/package.json
 var package_default = {
   name: "@dunnewold-labs/mr-manager",
-  version: "0.4.46",
+  version: "0.4.48",
   description: "Mr. Manager - Task and project management CLI",
   bin: {
     mr: "./dist/index.mjs"
@@ -550,7 +550,7 @@ var contextCommand = new Command8("context").description("Output project context
 import { Command as Command9 } from "commander";
 import { spawn as spawn4, exec } from "child_process";
 import { randomUUID } from "crypto";
-import { resolve as resolve2 } from "path";
+import { resolve as resolve2, extname } from "path";
 import { readFileSync as readFileSync5, readdirSync, unlinkSync, existsSync as existsSync7, statSync, writeFileSync as writeFileSync3, mkdirSync as mkdirSync3, rmdirSync } from "fs";
 import * as readline from "readline";
 
@@ -2341,12 +2341,94 @@ function describeVariance(variance) {
     ]
   };
 }
+var EXEMPLAR_POOLS = [
+  ["Linear", "Vercel", "Arc", "Things 3"],
+  ["Stripe", "Notion", "Figma", "Cron"],
+  ["Raycast", "Superhuman", "Height", "Campsite"],
+  ["Apple", "Readymag", "Family", "Stripe Press"],
+  [
+    "Awwwards Site of the Day winners",
+    "indie SaaS",
+    "editorial / magazine sites",
+    "design-studio portfolios"
+  ]
+];
+function pickExemplars(seed) {
+  let hash = 0;
+  for (let i = 0; i < seed.length; i++) {
+    hash = hash * 31 + seed.charCodeAt(i) | 0;
+  }
+  return EXEMPLAR_POOLS[Math.abs(hash) % EXEMPLAR_POOLS.length].join(", ");
+}
+function buildReferenceSection(referenceImagePaths) {
+  if (referenceImagePaths.length === 0) return [];
+  return [
+    `## Reference Designs (CRITICAL \u2014 these define the visual direction)`,
+    ``,
+    `The user attached ${referenceImagePaths.length} reference image(s), saved on disk at:`,
+    ...referenceImagePaths.map((p) => `- \`${p}\``),
+    ``,
+    `Before designing anything, open and study each reference image (read the files at the paths above with your image-reading capability).`,
+    `The references define the intended look and feel: layout structure, color palette, typography, spacing, component styling, density, and overall mood. Match them closely.`,
+    `Where the references conflict with any generic style guidance below, THE REFERENCES WIN \u2014 do not override the user's attached direction with a default "design-led SaaS" look.`,
+    `Treat multiple references as one combined moodboard: extract the consistent visual language across them.`,
+    `You may still vary layout and composition across variants per the Design Variance section \u2014 but every variant must clearly belong to the reference designs' visual world.`,
+    ``
+  ];
+}
+async function downloadReferenceImages(proto, baseDir, prefix) {
+  const refs = proto.referenceImages;
+  if (!Array.isArray(refs) || refs.length === 0) return { paths: [], dir: null };
+  const dir = resolve2(baseDir, `.mr-proto-refs-${shortId(proto.id)}`);
+  try {
+    mkdirSync3(dir, { recursive: true });
+  } catch {
+    return { paths: [], dir: null };
+  }
+  const paths = [];
+  for (let i = 0; i < refs.length; i++) {
+    const ref = refs[i];
+    if (!ref || typeof ref.url !== "string") continue;
+    try {
+      const res = await fetch(ref.url);
+      if (!res.ok) {
+        logWarn(prefix, `Reference image ${i + 1} \u2192 HTTP ${res.status}, skipping`);
+        continue;
+      }
+      const buf = Buffer.from(await res.arrayBuffer());
+      let ext = extname(new URL(ref.url).pathname).toLowerCase();
+      if (!ext || ext.length > 5) ext = ".png";
+      const dest = resolve2(dir, `reference-${i + 1}${ext}`);
+      writeFileSync3(dest, buf);
+      paths.push(dest);
+    } catch (err) {
+      logWarn(prefix, `Failed to download reference image ${i + 1}: ${err.message}`);
+    }
+  }
+  return { paths, dir: paths.length > 0 ? dir : null };
+}
+function cleanupRefDir(dir) {
+  if (!dir) return;
+  try {
+    for (const f of readdirSync(dir)) {
+      try {
+        unlinkSync(resolve2(dir, f));
+      } catch {
+      }
+    }
+    rmdirSync(dir);
+  } catch {
+  }
+}
 function buildPrototypePrompt(proto, repoDir, options = {}) {
   const prototypeType = proto.prototypeType ?? "web_app";
   const variantsToProduce = options.variantsToProduce ?? proto.variantCount;
   const startIndex = options.variantStartIndex ?? 1;
   const variance = typeof proto.designVariance === "number" ? proto.designVariance : 70;
   const varianceInfo = describeVariance(variance);
+  const referenceImagePaths = options.referenceImagePaths ?? [];
+  const hasReferences = referenceImagePaths.length > 0;
+  const exemplars = pickExemplars(proto.id);
   const variantSteps = [];
   for (let i = 0; i < variantsToProduce; i++) {
     const idx = startIndex + i;
@@ -2354,7 +2436,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
     variantSteps.push(
       `### Variant ${idx}: ${filename}`,
       `1. ${varianceInfo.perVariantDirective}`,
-      `2. Spend a moment composing a real, opinionated design before you start typing HTML. Imagine the screen on Dribbble or in a Linear / Stripe / Vercel / Arc / Things-style portfolio.`,
+      `2. Spend a moment composing a real, opinionated design before you start typing HTML. ${hasReferences ? "Imagine the screen sitting alongside the reference designs the user attached \u2014 it should look like it belongs in the same set." : `Imagine the screen on Dribbble, holding its own next to ${exemplars}.`}`,
       `3. Write the complete self-contained HTML to \`${repoDir}/${filename}\` using the Write tool.`,
       `4. Verify the file was created by reading the first few lines of \`${repoDir}/${filename}\`.`,
       ``
@@ -2367,7 +2449,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
   const sharedQualityBar = [
     `## Craft & Polish Bar (this is the most important section \u2014 read carefully)`,
     ``,
-    `These are PORTFOLIO-QUALITY prototypes, not throwaway sketches. The reviewer will judge them at a glance against work from Linear, Vercel, Stripe, Arc, Things, Things 3, Notion, Figma, Apple, Cron, Raycast, Superhuman, and indie SaaS that wins design awards. Your output must look like it belongs in that company.`,
+    hasReferences ? `These are PORTFOLIO-QUALITY prototypes, not throwaway sketches. They must match the visual direction of the reference designs the user attached (see the Reference Designs section above) while hitting a high craft bar. Study the references first \u2014 everything below is secondary to them.` : `These are PORTFOLIO-QUALITY prototypes, not throwaway sketches. The reviewer will judge them at a glance against the craft level of ${exemplars}, and indie SaaS that wins design awards. Your output must look like it belongs in that company \u2014 but interpret the brief on its own terms, don't imitate any one of them.`,
     ``,
     `**Composition & layout**`,
     `- Use a real grid with intentional spacing (multiples of 4 or 8). No cramped or arbitrary padding.`,
@@ -2376,12 +2458,12 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
     `- Consider "uncommon" navigation: side-scrolling, vertical headers, command-palette-first interfaces, or minimalist "zen" modes.`,
     ``,
     `**Typography**`,
-    `- Pair a real display face with a clean text face. Pull from Google Fonts via \`<link>\` (Inter, Geist, Space Grotesk, Instrument Serif, Fraunces, S\xF6hne-style fallbacks, JetBrains Mono, IBM Plex, Manrope, DM Sans, Playfair Display, Caladea, Bricolage Grotesque). Tailwind CDN does NOT ship custom fonts \u2014 link them yourself.`,
+    hasReferences ? `- Match the typography of the reference designs \u2014 identify the display and text faces they use (or the closest Google Fonts equivalents) and pull them in via \`<link>\`. Tailwind CDN does NOT ship custom fonts \u2014 link them yourself.` : `- Pair a real display face with a clean text face, pulled from Google Fonts via \`<link>\`. Good starting points: Inter, Geist, Space Grotesk, Instrument Serif, Fraunces, JetBrains Mono, IBM Plex, Manrope, DM Sans, Playfair Display, Bricolage Grotesque \u2014 but don't feel limited to this list; pick faces that fit the brief and vary them across variants. Tailwind CDN does NOT ship custom fonts \u2014 link them yourself.`,
     `- Use real type scales (e.g. 12 / 14 / 16 / 20 / 28 / 40 / 64). Tighten tracking on display sizes (-0.02em to -0.05em). Use weight contrast (300 vs 600), not just size.`,
     `- Pay attention to line-height (1.5-1.6 for body, 1.1-1.2 for headers).`,
     ``,
     `**Color & material**`,
-    `- Pick a deliberate palette per variant. Avoid default Tailwind blue-500 / gray-900 unless that IS the design intent. Mix off-whites (#F9F9F9), warm neutrals, deep ink colors (#0A0A0B), accent pops, gradients, noise textures.`,
+    hasReferences ? `- Derive the palette from the reference designs \u2014 sample their actual colors (backgrounds, ink, accents) rather than defaulting to a generic scheme. Avoid default Tailwind blue-500 / gray-900 unless the references use them.` : `- Pick a deliberate palette per variant. Avoid default Tailwind blue-500 / gray-900. Off-whites, warm neutrals, deep inks, accent pops, gradients, and noise textures are all fair game \u2014 specific values like #F9F9F9 or #0A0A0B are illustrations, not a required palette. Commit to a distinct color story per variant.`,
     `- Use depth: soft shadows (e.g. \`0 10px 30px rgba(0,0,0,0.05)\`), subtle borders (1px @ low opacity), inner glows, glassmorphism (backdrop-blur), grain overlays, or mesh gradients. No flat-default look unless that's the chosen aesthetic.`,
     `- Use "subtle motion" even in static colors: very soft gradients that feel like lighting, not just a color ramp.`,
     ``,
@@ -2405,7 +2487,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
   ];
   const typeConfig = {
     web_app: {
-      role: "You are a senior product designer at a top-tier design-led startup, comfortable in Figma and shipping production HTML/CSS. You design at the level of Linear, Vercel, Stripe, and Arc.",
+      role: "You are a senior product designer at a top-tier design-led startup, comfortable in Figma and shipping production HTML/CSS.",
       guidelines: [
         `- **Layout DNA**: bento grid, editorial split, command-bar driven, three-pane mail-style, dashboard with sidebar + canvas, marketing landing with pinned hero, terminal/CLI-inspired, doc-style long-form.`,
         `- **Aesthetic**: Swiss minimal, brutalist editorial, glassmorphism, neumorphic, retro 90s web revival, hand-drawn / sketchy, dark IDE, pastel friendly, monochrome high-contrast, neo-skeuomorphic, "soft-ui" with deep shadows.`,
@@ -2434,7 +2516,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
       ]
     },
     desktop_app: {
-      role: "You are a senior desktop product designer who has shipped work on Linear, Things 3, Cron, Raycast, Notion, and Arc. You design at the level of those apps and don't settle for generic.",
+      role: "You are a senior desktop product designer who ships polished, best-in-class, native-feeling apps and doesn't settle for generic.",
       guidelines: [
         `- **Window chrome**: include realistic traffic-light controls or Windows controls, an integrated title bar, sidebar/main split, optional inspector pane.`,
         `- **Layout DNA**: three-pane mail-style, sidebar + canvas + inspector, command-bar driven (kbar / Raycast), tabbed workspace, ribbon toolbar, split-pane editor, agenda + detail, "spatial" layout with floating windows.`,
@@ -2473,6 +2555,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
     logo: "Logo"
   };
   const agentNote = options.agentLabel ? `You are one of several models collaborating on this prototype set. You are the "${options.agentLabel}" track, responsible for variants ${startIndex} through ${startIndex + variantsToProduce - 1}. Bring YOUR creative perspective \u2014 don't try to be a generic averaged designer.` : `You are the sole designer on this prototype set \u2014 bring a strong, opinionated point of view.`;
+  const creativeAnchor = hasReferences ? `The user attached reference designs for this prototype \u2014 they are the single most important input. Treat them as the definitive brief for look and feel (details in the Reference Designs section below).` : `Aim for the craft level of ${exemplars} \u2014 but interpret this brief on its own terms, don't imitate any one product.`;
   const creativeDirection = [
     `## Creative Direction & Polish`,
     `- **Be Opinionated**: Do not design generic "safe" UIs. Imagine you are designing for a product that wants to win "Site of the Day" on Awwwards or be featured in a "Best of Linear-style design" gallery.`,
@@ -2486,6 +2569,8 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
     ``,
     agentNote,
     ``,
+    creativeAnchor,
+    ``,
     `Working directory: ${repoDir}`,
     ``,
     `## Prototype Request`,
@@ -2496,6 +2581,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
     `## Design Prompt`,
     `${proto.prompt}`,
     ``,
+    ...buildReferenceSection(referenceImagePaths),
     `## Instructions`,
     ``,
     `Generate exactly ${variantsToProduce} HTML file(s) covering variants ${startIndex} through ${startIndex + variantsToProduce - 1}: ${variantList.join(", ")}. Follow the steps below IN ORDER. Do NOT collapse or skip variants. Each file must be completely self-contained (inline all CSS and JS, plus any Google Fonts \`<link>\` you reference). Tailwind CDN is acceptable.`,
@@ -2536,6 +2622,7 @@ function buildPrototypePrompt(proto, repoDir, options = {}) {
   ].join("\n");
 }
 function buildRefinementPrompt(proto, parentFiles, repoDir, options = {}) {
+  const referenceImagePaths = options.referenceImagePaths ?? [];
   const variantsToProduce = options.variantsToProduce ?? proto.variantCount;
   const startIndex = options.variantStartIndex ?? 1;
   const variance = typeof proto.designVariance === "number" ? proto.designVariance : 70;
@@ -2600,6 +2687,7 @@ function buildRefinementPrompt(proto, parentFiles, repoDir, options = {}) {
     `## Original Design Prompt`,
     `${proto.prompt}`,
     ``,
+    ...buildReferenceSection(referenceImagePaths),
     `## User Feedback (IMPORTANT \u2014 this is what you must address)`,
     `${proto.refinementFeedback}`,
     ``,
@@ -3408,6 +3496,14 @@ var watchCommand = new Command9("watch").description(
       } catch {
       }
     }
+    const { paths: refImagePaths, dir: refImageDir } = await downloadReferenceImages(
+      proto,
+      repoDir,
+      prefix
+    );
+    if (refImagePaths.length > 0) {
+      logDispatch(prefix, `${refImagePaths.length} reference image(s) attached`);
+    }
     const validAgents = ["claude", "codex", "gemini"];
     const requested = Array.isArray(proto.selectedAgents) ? proto.selectedAgents.filter(
       (a) => validAgents.includes(a)
@@ -3428,13 +3524,15 @@ var watchCommand = new Command9("watch").description(
         return buildRefinementPrompt(proto, parentFiles, sliceDir, {
           variantStartIndex: startIndex,
           variantsToProduce,
-          agentLabel
+          agentLabel,
+          referenceImagePaths: refImagePaths
         });
       }
       return buildPrototypePrompt(proto, sliceDir, {
         variantStartIndex: startIndex,
         variantsToProduce,
-        agentLabel
+        agentLabel,
+        referenceImagePaths: refImagePaths
       });
     };
     if (dedupedRequested.length <= 1) {
@@ -3444,6 +3542,7 @@ var watchCommand = new Command9("watch").description(
         logError(prefix, `No available agents found for ${preferred}`);
         await api.patch(`/api/prototypes/${proto.id}`, { status: "failed" }).catch(() => {
         });
+        cleanupRefDir(refImageDir);
         queued.delete(key);
         return;
       }
@@ -3528,6 +3627,7 @@ var watchCommand = new Command9("watch").description(
               }
             }
           } finally {
+            cleanupRefDir(refImageDir);
             queued.delete(key);
             finishing.delete(key);
           }
@@ -3563,6 +3663,7 @@ var watchCommand = new Command9("watch").description(
       logError(prefix, `Could not assign any variants to selected agents`);
       await api.patch(`/api/prototypes/${proto.id}`, { status: "failed" }).catch(() => {
       });
+      cleanupRefDir(refImageDir);
       queued.delete(key);
       return;
     }
@@ -3684,6 +3785,7 @@ var watchCommand = new Command9("watch").description(
       } catch {
       }
     } finally {
+      cleanupRefDir(refImageDir);
       queued.delete(key);
       finishing.delete(key);
     }
@@ -4456,6 +4558,17 @@ ${summaryBlock}${lines.join("\n")}`;
         }
         const vcs = review.branchUrl.includes("gitlab") ? "gitlab" : "github";
         const prLabel = vcs === "gitlab" ? "MR" : "PR";
+        const preMergeStatus = await checkPrStatus(review.branchUrl, repoDir, vcs);
+        if (preMergeStatus?.merged) {
+          logSuccess(prefix, `${prLabel} already merged \u2014 recording auto-merge as complete`);
+          try {
+            await api.patch(`/api/reviews/${review.id}`, { autoMergeStatus: "merged" });
+            await postTaskUpdate(taskId, `Auto-merge complete \u2014 ${prLabel} was already merged`, "system");
+          } catch (err) {
+            logError(prefix, `Failed to record auto-merge success: ${err.message}`);
+          }
+          continue;
+        }
         logDispatch(prefix, `Sanity review clean \u2014 merging ${prLabel} ${paint("cyan", review.branchUrl)}`);
         const mergeResult = await mergePrViaCli(review.branchUrl, repoDir, vcs);
         if (!mergeResult.ok) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dunnewold-labs/mr-manager",
-  "version": "0.4.46",
+  "version": "0.4.48",
   "description": "Mr. Manager - Task and project management CLI",
   "bin": {
     "mr": "./dist/index.mjs"