mockpit 1.1.0 → 1.2.0

package/dist/server/appIcon.d.ts

@@ -0,0 +1,22 @@
+import { type Mode } from "./themes.ts";
+export declare const ICON_SVG: string;
+export declare const ICON_SIZES: readonly [180, 192, 512];
+export type IconSize = (typeof ICON_SIZES)[number];
+export declare const themeColor: (mode: Mode) => string;
+export declare function webManifest(mode: Mode, startUrl?: string): {
+    name: string;
+    short_name: string;
+    description: string;
+    id: string;
+    start_url: string;
+    scope: string;
+    display: string;
+    background_color: string;
+    theme_color: string;
+    icons: {
+        src: string;
+        sizes: string;
+        type: string;
+        purpose: string;
+    }[];
+};

package/dist/server/appIcon.js

@@ -0,0 +1,43 @@
+// The installable app: its web app manifest and its icon. Runtime-agnostic (no
+// `node:` imports) so the Worker serves the same bytes. The PNG renders of the
+// icon are generated from ICON_SVG by scripts/app-icons.ts into appIconPng.ts,
+// because iOS takes no SVG for a home-screen icon.
+import { DIALKIT } from "./themes.js";
+const BG = DIALKIT.dark.bg;
+const ACCENT = DIALKIT.dark.info.text;
+// A stage frame with a comment pin on its corner. Full-bleed background and the
+// mark inside the central 80% circle, so the same art works as `maskable`.
+export const ICON_SVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+<rect width="512" height="512" fill="${BG}"/>
+<rect x="126" y="142" width="260" height="196" rx="34" fill="none" stroke="${ACCENT}" stroke-width="28"/>
+<path d="M170 206h120M170 262h76" stroke="${ACCENT}" stroke-width="24" stroke-linecap="round" opacity="0.55"/>
+<circle cx="366" cy="338" r="58" fill="${ACCENT}" stroke="${BG}" stroke-width="22"/>
+</svg>`;
+export const ICON_SIZES = [180, 192, 512];
+export const themeColor = (mode) => DIALKIT[mode].bg;
+// Relative URLs resolve against the manifest's own URL, so the app works under
+// any base path. `startUrl` carries `?key=` on a tokened workspace: a
+// home-screen app may not share Safari's cookie jar, and the key is how the
+// viewer gets its cookie back on first launch.
+export function webManifest(mode, startUrl = "./") {
+    return {
+        name: "mockpit",
+        short_name: "mockpit",
+        description: "Answer your agent's design questions.",
+        id: "./",
+        start_url: startUrl,
+        scope: "./",
+        display: "standalone",
+        background_color: themeColor(mode),
+        theme_color: themeColor(mode),
+        icons: [
+            { src: "icon.svg", sizes: "any", type: "image/svg+xml", purpose: "any" },
+            ...ICON_SIZES.filter((s) => s !== 180).map((s) => ({
+                src: `icon-${s}.png`,
+                sizes: `${s}x${s}`,
+                type: "image/png",
+                purpose: "any maskable",
+            })),
+        ],
+    };
+}

package/dist/server/appIconPng.d.ts

@@ -0,0 +1 @@
+export declare const ICON_PNG_BASE64: Record<number, string>;

package/dist/server/appIconPng.js

@@ -0,0 +1,6 @@
+// Generated by scripts/app-icons.ts from ICON_SVG; do not edit.
+export const ICON_PNG_BASE64 = {
+    180: "iVBORw0KGgoAAAANSUhEUgAAALQAAAC0CAIAAACyr5FlAAAKnklEQVR4nOzdfXAU9R3H8W9yyT0k95BcEhJCHgiJEXkIjTRqRAYUpDyNQBGKteq0xZbOtDqdtuPUGTt22k7/czr9wz+EtsoMijwjT/IgIGIxahRJCCQBQsjzcy6Xu9xDHlzMwDDmvktCbve3e/m8Jn/dLoTk3uz+9rd7uzEOh4MAQokmAAbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiABbiAFYMaVV+zvL7p62clDTDbEq0mJ1mk40ihc/v7vN1+vxdLe0XK68drL5+hDQpSmtPTbDFT55f9Mqs+9cbY+NoYggEveWVO858/s9ebwtpiYbiMBntCx95rajgRZqoSs6/KSXiD7hJG7QSh92a8eyqfUmJeTSxtXVceveDtW5PI2mAwWw2k2hpKXNeWPuhw5ZBE158XMqs/Kdr6j/2eFtJNPFHK4mOac+tORBnSSL4jjU+9fkfH3Im5JJoguMwmxzS3kQabRDcQfqF/PSpPcZYwQdoIuOIjo7ZsHJngj2LYIQEe/b6Fe9GRYl8g0SOOYoKfl048wUChtSHx9vW1PoVCSJyEqy48OVRrtnT29jlqhkaGiL9i4qKSnTk2K3po1l53g//UFq+hQQRFscDuats1jT5dXz+nsOnf3+19rg/0EORRRps5WY9uWzhG2aT3HjLbp0szRRX1RwmEYTt0qbnrZJfobntwlvvPVpRvTvyyqCb3bsuVu+SfsDWjovyaz6Qt5oEERNHdHRsfs4ymRXcnuZ3di/t6a2niCb9gG/vWur2NMmsk5+zVPp1kQhi4piW+URsjEVmhX3HNgb7vTQBBILufcd+JbOCdFibk7mQRBATR2rKbJmlja1f1zacpQmjtuGTxpbzMiukJReQCGLiMMvOetU1nqMJpr65RGap0ShmNkxMHPJTonVNn9EEI/8jW0xiTo6KOZQ1GIwyS6VZDZpgXO46maUGg4lEwGWCwEIcwEIcwEIcwEIcwNLuRxNGMsbastIftcanGgRNJw8LBD2u3vobE2CaTjdx2G2ZhTOel590V01q8qy0pFml5f8dGAxQ5NLHbkU60C+Y/oxGyhhmt2UIPF+qDn3EkWDLMmvvOtNJyTMpoukjDrMpgbQnOspgMmrr84LhpY8xh9fXTtozMBj0B1wUufSx5ehy1Xr62khj6ptKKKLpZZ5jsLxqV7C/jzSjp7fhau0Jimi6OZR19zac++rfWpnncNfdaPyUIp2eJsECQfeV2qMEasH0ObAQB7AQB7AQB7AQB7AQB7AQB7AQB7AQB7AQB7D0NH2elHBfbtai+Pg0Q3SY/9nSKd+G5i8nwumSMdFNHOmpc2fkrSFlxFtS8nOWWePTKqp3E9yij92KyehQrozb0icVpjhnENyijzgS7dmkCtxf+056GnOoIorgFn3E0e2+Qaro7L5KcIs+dis+f/f1+jOkMFfPjdaOclLe0Ah9vq6GllKt3ZhEN7uVK7UnhoimTpkfFaXIlr+9s7K8aicp5s477I78EbpcV/+3cxF99/Gt7PR5udmLc7MWJzvzSSgdjTkGr9Yeq6k7ZY1LNRjCeQ3p4OBAn68zEOwlZQxnMcqmBwb81+pOSl/H6VW7NWPu7I0PzdlEguhsQDo4GNTdzUnveVMn/aSnzr1eWrZ5WuYiqTCFNpkycLSilDFtMGT09Dacv7RV/TIIcShHyNsZXjjxBizEEU7Dx6WkMNUeLYLdStiMfpAxedKD0sGqNW6Sxey0mJyBoNvb19nn72xsKb1Se1w6YJH/49K3UGd8ijjC5q7vVpwlubjwpZn56+zWydw6gaC3uubIFxfekr/htTp9IA41mE2O4sKXH5rzm9jYu9ycyBgbNzN/rfRVVXPk5Lm/tnde5tbElkMf5P8TOxPyfrZ6v906hcYiP2dZXvaSD05sUnTeVh4GpGEgU8aUtKJfrPtorGUMi442rF6yeX7RKzLrKDo4FRNHIOiRWSqN1Eg/ZN6erPR5P3/6uHl8zzxY8PCfF8/7O93TP2CcxMQhf5ue1GS5R/VoDbfZcNiy1i3fRuHwSOFvfzDjORrLdw8LQXF45B7Urq84QjLG2p5dtddiDtt97pYv/FdG2sMhFynXh5g4WmQvm8ib+qS0qybNk9meP178l/A+jF4af6z50RbuSYAK7VnExNHY8mWfr5tbGmMwbVi5w+kI5y9XTdLw80EFnrTtuHkPZ1Uf4C3saKWm7pTMUos5ceOGT4oKNunxok7p+EL+UVT37LGiP8YYQjxeXqE9i7Bn2fsCroLpG2RWMBhi87IX5+eskOaY+/t9vd5m0piQb4kh2rhm6X+ioxWZQDIZrc1t37R3VY1cpMSEqbBJsJq60/XNX2TcbWyRljJb+nq8+DXSmJa28s3vPzby9cz04hglH8k2NXPB5WsHSBUiJ8E+LvkH6VavtyXk6zkZC0hJUxX+++8kMg5p4/HNpfDMBKiPiyPZOZ2UlJx4n2rjMMHT5wdP/k6nD5/2eENP1UgjJFJYnCWJVCE4jqGhwR2HnmntuER6w03yWpR/wIMK/Q0Tf+LNH3C/vWuJtIshXQl5SEk3Txsp9RGH2/rVuge8Js7KBoLubfvXlJx/k/Qjnjk72OttJYWp9sE47ZyyHzp+9tWte1Y0t5WRHnCnjj0KxyHNLA8NDZAqtHU9x43GT7e8P3/vsRdr6hT/ZOw4xVlSQr7e3HaBlCRNgpFatHgl2MWqndKX2ZQwPfep5MR8sykxzuKUznOSlrjcoT94V339Q6I3SDHV19V7boR2LxP0+bvPV2wlvXF7GlvaL6Yq9mzAKyrGgcsE7x13ory0bAspo66ppNMV+g4iSpx7Qxzh93XFO909taSAo2f+FPL1iLqeIzJw/1mlmb2P/v86hVtF9T6lR7vfI+yUfWTgTpS3d15OTZ4tjaYpTNye5h0Hf8I9AlGh6zmw5RgXmXdl79FftnZUUDj0D/i3H1jn9XWEXBppV59HEu696R/wbT+wvssVhsHHvqMbW9rLuO+u3AXG2K2Ml8x74w/0lFW+NyWtKMGeRffE29e5bf+qa7KXVCIOvZL2CGWV2x22jLSUAhojaa+0dc+yNv7jsqTw51YQR3jIbt6HqmoO1zd9nux8wBafSqMgnUA5/dnfDp18SZoJJHGiHI5xfVgPbhvN7n9a5hM5mQuzpsybkjp35NIu1/XahrPSCabKa4ekXZL89yLlP2iPOMJmrG+YxZwUZ3bGWZL8AXefr9PtaaJRU+fmLYgDWDiUBRZu3qIIdcYESkMcighvFrfn2VSuDXEoa5ybEFFZDEMcyhq+7d/wwcXoDzHkH7GgGsShuNvv7nAfI5d+78Xh9bUwXkEcqgr5lo98USMjWRzKAgtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAAtxAOtbAAAA///AiU20AAAABklEQVQDACqqSjMYRDobAAAAAElFTkSuQmCC",
+    192: "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",
+    512: "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",
+};

package/dist/server/askNudges.d.ts

@@ -0,0 +1,3 @@
+import type { Ask } from "./types.ts";
+export declare const looksVisual: (label: string) => boolean;
+export declare function askNudges(added: Ask[], all: Ask[]): string[];

package/dist/server/askNudges.js

@@ -0,0 +1,40 @@
+// Ask discipline on `ask`: the two habits that make the user type or re-answer
+// what they could have seen. Pure, so the rules are tested on their own.
+// Words that name how something looks, matched on option labels only: a
+// question's text names the topic, not the options. Words with a common
+// non-visual sense ("size", "background", "compact", "white") are left out, so
+// a pill about file size or a background job is not flagged.
+const VISUAL = /\b(colou?rs?|borders?|radius|rounded|corners?|spacing|padding|fonts?|typeface|serif|shadows?|tint|hue|opacity|red|orange|yellow|green|olive|teal|blue|navy|purple|violet|pink|gr[ae]y|\d+\s?(px|rem|em|pt))\b|#[0-9a-f]{3,8}\b/i;
+const plain = (o) => !o.variant && !(o.set && Object.keys(o.set).length);
+export const looksVisual = (label) => VISUAL.test(label);
+// A Look-style ask: one whose options choose between variants.
+const bindsVariants = (a) => a.options.some((o) => o.variant);
+const quoted = (opts) => opts.map((o) => `"${o.label}"`).join(", ");
+export function askNudges(added, all) {
+    const out = [];
+    for (const ask of added) {
+        const pills = ask.options.filter(plain);
+        if (!pills.length)
+            continue;
+        const visual = pills.filter((o) => looksVisual(o.label));
+        const look = ask.scope === "part" || bindsVariants(ask)
+            ? undefined
+            : all.find((a) => a.id !== ask.id &&
+                a.scope !== "part" &&
+                bindsVariants(a) &&
+                (a.scope === "mock" || ask.scope === "mock" || a.state === ask.state));
+        // Only a pill that names a look or reads visual overlaps the variants; a
+        // plain question on another axis ("Drawer or Margin?") stands beside them.
+        const names = new Set(look?.options.flatMap((o) => [o.label, o.variant ?? ""].map((n) => n.toLowerCase())));
+        const reask = look
+            ? pills.filter((o) => names.has(o.label.toLowerCase()) || looksVisual(o.label))
+            : [];
+        if (look && reask.length) {
+            out.push(`ask "${ask.id}": ${quoted(reask)} may re-ask what "${look.id}" decides. Drop it or use knob sets.`);
+        }
+        else if (visual.length) {
+            out.push(`ask "${ask.id}": ${quoted(visual)} look visual. Give each a knob set or variant.`);
+        }
+    }
+    return out;
+}

package/dist/server/base64.d.ts

@@ -1 +1,2 @@
 export declare function decodeBase64(b64: string): Uint8Array;
+export declare function encodeBase64(bytes: Uint8Array): string;

package/dist/server/base64.js

@@ -14,3 +14,11 @@ export function decodeBase64(b64) {
         bytes[i] = bin.charCodeAt(i);
     return bytes;
 }
+// bytes -> base64, in chunks so a multi-MB image never spreads into one call.
+export function encodeBase64(bytes) {
+    let bin = "";
+    for (let i = 0; i < bytes.length; i += 0x8000) {
+        bin += String.fromCharCode(...bytes.subarray(i, i + 0x8000));
+    }
+    return btoa(bin);
+}

package/dist/server/designGuide.js

@@ -29,7 +29,7 @@ export function iconsLine(design) {
 }
 const TOPIC_SUMMARY = {
     knobs: "every knob shape, how values reach html",
-    asks: "the ask JSON, scopes, Look, Which one?, multi",
+    asks: "the ask JSON, scopes, the Look ask, multi",
     surfaces: "markdown, diff, mermaid, code, terminal, json, image; uploads",
     html: "the contract, finish rules, tokens, kits, Tailwind, icons",
     feedback: "the feedback JSON, pending, delivery, export",
@@ -227,7 +227,7 @@ project › mock › state › variant › version. A project is the repo; a moc
 page or component, by slug; a state is one moment of it in the user's words
 ("Writing"), omitted for a single-state mock; a variant is a parallel design of
 a state; versions are its history. A part is an element marked \`data-part\`.
-Asks are questions, knobs are values; the user presses Send once, you get one reply.
+The user answers asks, tunes knobs, presses Send once; you get one reply.
 
 ## The loop
 
@@ -245,7 +245,7 @@ mockpit export  --mock writer   # the accepted html per state
 \`\`\`
 
 Server: \`$MOCKPIT_URL\` (default http://localhost:8228; \`mockpit serve\`).
-MCP tools have the verb names (\`publish\`, \`feedback\`, …).
+MCP tools share the verb names.
 
 ## Parts
 
@@ -256,8 +256,10 @@ declare geometry; the viewer measures it.
 
 ## Ask or knob
 
-A choice is several variants plus one ask that binds them. Look question
-first. One render plus a control: declare a knob with \`--knobs '{...}'\`.
+A choice is several variants plus one ask that binds them. Ask it first. A
+variant decides everything it differs on; don't re-ask it. Visual options
+carry a \`variant\` or knob \`set\`. One render plus a control: a knob,
+\`--knobs '{...}'\`.
 
 | knob | control |
 | --- | --- |
@@ -267,19 +269,19 @@ first. One render plus a control: declare a knob with \`--knobs '{...}'\`.
 | \`"trim.position": {"type": "select", "options": ["top", "bottom"]}\` | select |
 
 Values reach the html unitless: \`calc(var(--k-body-size, 17) * 1px)\`, and as
-\`data-k-trim-position\` on \`<html>\`. Topics \`knobs\` and \`asks\` have the rest.
+\`data-k-trim-position\` on \`<html>\`.
 
 ## Feedback
 
 \`feedback\` returns \`{feedback, pending}\`. A batch is \`{mock, reply: {asks, tuned,
-mix, comments, decision, text}, accepted, archived}\`. In order: answers decide
-structure (a variant answer already accepted it and archived its siblings);
-tuned values become new defaults; mix names a part to take from another variant;
-address each comment on its part; decision (accept, revise, drop) stands in for
-answers when there were no asks. Each Send arrives exactly once: in a write's
+mix, comments, reactions, decision, text}, accepted, archived}\`. In order: answers
+decide structure (a variant answer already accepted it); tuned values become
+defaults; mix names a part to take from another variant (if it conflicts with an
+answer, the answer wins); address each comment and reaction on its part; decision
+(accept, revise, drop) replaces answers when there were no asks. Each Send arrives exactly once: in a write's
 \`feedback\`, \`mockpit feedback\` or a \`mockpit watch\` line.
-A \`pending\` draft means the user is still answering. Variants no ask binds
-earn a \`suggestedAsk\` on publish: send it with \`ask\`.
+A \`pending\` draft means the user is still answering. Send a nudge's
+\`suggestedAsk\` with \`ask\`.
 
 ## HTML
 

package/dist/server/feedbackBatch.d.ts

@@ -1,4 +1,4 @@
-import { type AskOption, type Comment, type CommentAnchor, type Mock, OTHER_ID, type Post, type Reply, type Store } from "./types.ts";
+import { type AskOption, type Comment, type CommentAnchor, type Mock, OTHER_ID, type PartComment, type Post, type Reaction, type Reply, type Store } from "./types.ts";
 export interface VariantRef {
     state: string | null;
     variant: string;
@@ -13,21 +13,28 @@ export interface FeedbackComment {
     anchors?: Comment["anchors"];
     viewport?: number;
 }
+export interface ImageRef {
+    id: string;
+    url: string;
+}
 export interface OtherChoice {
     id: typeof OTHER_ID;
     label: string;
     other: true;
+    images?: ImageRef[];
 }
 export interface AnsweredAsk {
     ask: string;
     text: string;
     chosen: (AskOption | OtherChoice)[];
     note?: string;
+    noteImages?: ImageRef[];
 }
-export interface FeedbackReply extends Omit<Reply, "others" | "notes"> {
+export interface FeedbackReply extends Omit<Reply, "others" | "notes" | "otherImages" | "noteImages"> {
     seq: number;
     at: string;
     asks: AnsweredAsk[];
+    reactions?: string[];
 }
 export interface FeedbackBatch {
     mockId: string | null;
@@ -38,6 +45,11 @@ export interface FeedbackBatch {
     comments: FeedbackComment[];
     accepted: VariantRef[];
     archived: VariantRef[];
+    handoff?: string;
 }
-export declare function groupFeedback(comments: Comment[], mocks: Map<string, Mock>, posts: Map<string, Post[]>): FeedbackBatch[];
-export declare function buildFeedbackBatches(store: Store, comments: Comment[]): Promise<FeedbackBatch[]>;
+export declare function reactionLine(c: PartComment & {
+    reaction: Reaction;
+}): string;
+export declare function groupFeedback(comments: Comment[], mocks: Map<string, Mock>, posts: Map<string, Post[]>, base?: string): FeedbackBatch[];
+export declare function buildFeedbackBatches(store: Store, comments: Comment[], base: string): Promise<FeedbackBatch[]>;
+export declare function feedbackImages(batches: FeedbackBatch[]): ImageRef[];

package/dist/server/feedbackBatch.js

@@ -2,11 +2,35 @@
 // The `feedback` verb, the watch long-poll and the write piggyback all return this,
 // so an agent reads one grouped object instead of re-deriving which mock a flat
 // comment list belongs to. Runtime-agnostic (no node imports).
-import { builtinAsk, OTHER_ID, } from "./types.js";
+import { builtinAsk, DEFAULT_VARIANT, OTHER_ID, } from "./types.js";
 const ref = (p) => ({ state: p.state, variant: p.variant });
-function answered(reply, mock, posts) {
+const REACTION_LEAD = {
+    up: "👍",
+    down: "👎",
+    more: "more like this:",
+};
+// `👍 part "hero" (variant B, state Mobile)`, `👎 variant B`, `more like this: the page`.
+export function reactionLine(c) {
+    // A mock published without variant names has only "default": naming it is noise.
+    const variant = c.variant && c.variant !== DEFAULT_VARIANT ? c.variant : null;
+    const where = [
+        c.part !== null && variant ? `variant ${variant}` : "",
+        c.state ? `state ${c.state}` : "",
+    ].filter(Boolean);
+    const target = c.part !== null
+        ? `part ${JSON.stringify(c.part)}`
+        : variant
+            ? `variant ${variant}`
+            : "the page";
+    const tail = where.length ? ` (${where.join(", ")})` : "";
+    const note = c.text ? ` “${c.text}”` : "";
+    return `${REACTION_LEAD[c.reaction]} ${target}${tail}${note}`;
+}
+const isReaction = (c) => !!c.reaction;
+function answered(reply, mock, posts, base) {
     const others = reply.others ?? {};
     const notes = reply.notes ?? {};
+    const refs = (ids) => (ids ?? []).map((id) => ({ id, url: `${base}/a/${encodeURIComponent(id)}` }));
     const askIds = new Set([
         ...Object.keys(reply.answers),
         ...Object.keys(others),
@@ -18,13 +42,21 @@ function answered(reply, mock, posts) {
         const answer = reply.answers[askId];
         const ids = answer === undefined ? [] : Array.isArray(answer) ? answer : [answer];
         const chosen = ids.map((id) => ask?.options.find((o) => o.id === id) ?? { id, label: id });
+        const otherImages = refs(reply.otherImages?.[askId]);
         if (others[askId] !== undefined)
-            chosen.push({ id: OTHER_ID, label: others[askId], other: true });
+            chosen.push({
+                id: OTHER_ID,
+                label: others[askId],
+                other: true,
+                ...(otherImages.length ? { images: otherImages } : {}),
+            });
+        const noteImages = refs(reply.noteImages?.[askId]);
         out.push({
             ask: askId,
             text: ask?.text ?? "",
             chosen,
             ...(notes[askId] !== undefined ? { note: notes[askId] } : {}),
+            ...(noteImages.length ? { noteImages } : {}),
         });
     }
     return out;
@@ -33,8 +65,8 @@ function answered(reply, mock, posts) {
 // one. A mock gets a fresh batch whenever a second reply arrives for it, so a
 // batch carries at most one reply and nothing is merged away. A comment whose
 // mock is unknown still gets a batch — feedback is never dropped for want of
-// context.
-export function groupFeedback(comments, mocks, posts) {
+// context. `base` (origin + base path) makes image URLs absolute.
+export function groupFeedback(comments, mocks, posts, base = "") {
     const batches = [];
     const open = new Map();
     for (const c of comments) {
@@ -57,12 +89,15 @@ export function groupFeedback(comments, mocks, posts) {
             batches.push(batch);
         }
         if (c.kind === "reply" && c.payload) {
-            const { others: _others, notes: _notes, ...payload } = c.payload;
+            const { others: _others, notes: _notes, otherImages: _otherImages, noteImages: _noteImages, ...payload } = c.payload;
+            const reactions = (payload.comments ?? []).filter(isReaction).map(reactionLine);
             batch.reply = {
                 ...payload,
+                comments: (payload.comments ?? []).filter((x) => !x.reaction),
                 seq: c.seq,
                 at: c.createdAt,
-                asks: answered(c.payload, mock, mockPosts),
+                asks: answered(c.payload, mock, mockPosts, base),
+                ...(reactions.length ? { reactions } : {}),
             };
             batch.accepted = mockPosts.filter((p) => p.status === "accepted").map(ref);
             batch.archived = mockPosts.filter((p) => p.status === "archived").map(ref);
@@ -82,7 +117,7 @@ export function groupFeedback(comments, mocks, posts) {
     }
     return batches;
 }
-export async function buildFeedbackBatches(store, comments) {
+export async function buildFeedbackBatches(store, comments, base) {
     const mocks = new Map();
     const posts = new Map();
     for (const c of comments) {
@@ -94,5 +129,20 @@ export async function buildFeedbackBatches(store, comments) {
         mocks.set(c.mockId, mock);
         posts.set(c.mockId, await store.listPosts({ mockId: c.mockId }));
     }
-    return groupFeedback(comments, mocks, posts);
+    return groupFeedback(comments, mocks, posts, base);
+}
+// Every image a list of batches carries, in order — what the MCP tiers attach
+// as image content so the model sees what the user attached.
+export function feedbackImages(batches) {
+    const out = [];
+    for (const b of batches) {
+        for (const a of b.reply?.asks ?? []) {
+            for (const c of a.chosen)
+                if ("other" in c && c.images)
+                    out.push(...c.images);
+            if (a.noteImages)
+                out.push(...a.noteImages);
+        }
+    }
+    return out;
 }

package/dist/server/handoff.d.ts

@@ -0,0 +1,6 @@
+import type { Comment, Session } from "./types.ts";
+export declare const HANDOFF_GRACE_MS: number;
+export declare const HANDOFF_NOTE = "Sent to an earlier agent session in this project that has gone quiet; it is yours now. Read the mock before acting.";
+export declare const ownerActiveAt: (s: Session) => string;
+export declare function supersedes(taker: Session, owner: Session, listening: boolean): boolean;
+export declare function handoffReady(comment: Comment, owner: Session, taker: Session, now: number): boolean;

package/dist/server/handoff.js

@@ -0,0 +1,38 @@
+// Orphaned replies: a Send lands on the session that owns the mock, and when
+// that agent restarts into a new session (a new conversation, /clear, a crash)
+// nobody would ever read it. The rule below decides when a newer session may
+// take such a reply instead. Runtime-agnostic (no node imports).
+//
+// The danger is the other way round: two agents can work in one repo at once,
+// and an agent waiting on the user looks exactly like a dead one — both are
+// silent. So each clause narrows who counts as "the same agent, restarted":
+//
+// - Same project, same cwd, same agent name. A restart reopens the same harness
+//   in the same checkout; a different worktree or tool is a parallel worker.
+// - The owner was created first and has made no call since the taker appeared
+//   (agentActiveAt, which the user's own Sends don't bump). An owner that kept
+//   working after the taker started is running alongside it, not gone.
+// - The owner has no feedback long-poll open right now (`mockpit watch`).
+//
+// A reply also waits HANDOFF_GRACE_MS after the Send, so the owner — the agent
+// the user is most likely about to tell — gets first claim. The one exception:
+// a keyless owner (no harness conversation id) can never come back, so a reply
+// it got before the taker existed goes at once — the user answered, then
+// restarted. A keyed owner always gets the grace: its conversation may resume.
+export const HANDOFF_GRACE_MS = 2 * 60_000;
+export const HANDOFF_NOTE = "Sent to an earlier agent session in this project that has gone quiet; it is yours now. Read the mock before acting.";
+export const ownerActiveAt = (s) => s.agentActiveAt ?? s.lastActiveAt;
+export function supersedes(taker, owner, listening) {
+    return (owner.id !== taker.id &&
+        owner.project !== null &&
+        owner.project === taker.project &&
+        owner.cwd === taker.cwd &&
+        owner.agent === taker.agent &&
+        owner.createdAt < taker.createdAt &&
+        ownerActiveAt(owner) < taker.createdAt &&
+        !listening);
+}
+export function handoffReady(comment, owner, taker, now) {
+    return ((!owner.keyed && comment.createdAt < taker.createdAt) ||
+        now - Date.parse(comment.createdAt) >= HANDOFF_GRACE_MS);
+}

package/dist/server/knobs.js

@@ -320,11 +320,10 @@ export function checkKnobValues(raw, mock, posts, what) {
     return { ok: true, value: out };
 }
 // How many discrete choices a knob offers, or null when it is continuous. A knob
-// with only a handful is usually a decision dressed as a control (plan D12).
+// with only a handful is usually a decision dressed as a control (plan D12). A
+// toggle is null: on/off reads fine on one render.
 export function discreteChoices(config) {
     const knob = explicitKnob(config);
-    if (knob.type === "toggle")
-        return 2;
     if (knob.type === "select")
         return knob.options.length;
     if (knob.type === "image" && knob.options)

package/dist/server/mcpHttp.d.ts

@@ -23,11 +23,11 @@ export interface McpFlows {
         },
         ctx: FlowContext
     ]>;
-    say: Flow<[ref: unknown, body: any]>;
+    say: Flow<[ref: unknown, body: any, ctx: FlowContext]>;
     feedback: Flow<[query: {
         session?: unknown;
         project?: unknown;
-    }]>;
+    }, ctx: FlowContext]>;
 }
 export interface McpDeps {
     store: Store;

package/dist/server/mcpHttp.js

@@ -1,6 +1,6 @@
 import { decodeBase64 } from "./base64.js";
 import { isGuideTopic, unknownTopicMessage } from "./designGuide.js";
-import { HTTP_MCP_TOOLS, HTTP_RUN_TOOLS, MCP_INSTRUCTIONS, MCP_SERVER_INFO, runToolResult, toolResult, } from "./mcpSpec.js";
+import { HTTP_MCP_TOOLS, HTTP_RUN_TOOLS, MCP_INSTRUCTIONS, MCP_SERVER_INFO, runToolResult, toolResult, withFeedbackImages, } from "./mcpSpec.js";
 import { RUN_INSTRUCTIONS } from "./runApi.js";
 // A flow's error status becomes a tool error carrying the same JSON body the
 // REST tier returns, so the agent sees the hint (states, variants) either way.
@@ -24,6 +24,10 @@ export function registerMcp(app, deps) {
         const projects = await store.listProjects();
         return projects[0]?.name ?? "workspace";
     }
+    async function loadImage(ref) {
+        const asset = await store.getAsset(ref.id);
+        return asset ? { data: asset.data, mimeType: asset.contentType } : null;
+    }
     async function callTool(name, args, ctx) {
         switch (name) {
             case "publish":
@@ -39,9 +43,9 @@ export function registerMcp(app, deps) {
                     history: args.history === true,
                 }));
             case "feedback":
-                return unwrap(await flows.feedback({ session: args.session, project: args.project }));
+                return unwrap(await flows.feedback({ session: args.session, project: args.project }, ctx));
             case "say":
-                return unwrap(await flows.say(args.mock, args));
+                return unwrap(await flows.say(args.mock, args, ctx));
             case "export":
                 return unwrap(await flows.exportMock(args.mock, args, ctx));
             case "upload": {
@@ -124,9 +128,11 @@ export function registerMcp(app, deps) {
                 const name = msg.params?.name;
                 if (name === "run") {
                     const args = msg.params?.arguments ?? {};
-                    return rpc(msg.id, runToolResult(unwrap(await deps.run(args, ctx))));
+                    const envelope = unwrap(await deps.run(args, ctx));
+                    return rpc(msg.id, await withFeedbackImages(runToolResult(envelope), envelope, loadImage));
                 }
-                return rpc(msg.id, toolResult(name, await callTool(name, msg.params?.arguments ?? {}, ctx)));
+                const value = await callTool(name, msg.params?.arguments ?? {}, ctx);
+                return rpc(msg.id, await withFeedbackImages(toolResult(name, value), value, loadImage));
             }
             catch (err) {
                 return rpc(msg.id, {

package/dist/server/mcpSpec.d.ts

@@ -1,4 +1,5 @@
 import * as z from "zod/v4";
+import { type ImageRef } from "./feedbackBatch.ts";
 export declare const MCP_SERVER_INFO: {
     name: string;
     version: string;
@@ -180,6 +181,13 @@ export declare function toolResult(name: string, value: unknown): {
         text: string;
     }[];
 };
+export declare const MAX_RESULT_IMAGES = 8;
+export declare function withFeedbackImages<T extends {
+    content: unknown[];
+}>(result: T, value: unknown, load: (ref: ImageRef) => Promise<{
+    data: Uint8Array;
+    mimeType: string;
+} | null>): Promise<T>;
 export declare function runToolResult(envelope: unknown): {
     isError?: boolean | undefined;
     structuredContent?: Record<string, unknown> | undefined;

package/dist/server/mcpSpec.js

@@ -1,5 +1,7 @@
 import * as z from "zod/v4";
+import { encodeBase64 } from "./base64.js";
 import { GUIDE_TOPICS } from "./designGuide.js";
+import { feedbackImages } from "./feedbackBatch.js";
 import { KIT_IDS } from "./kits.js";
 import { RUN_DESCRIPTION } from "./runApi.js";
 import { SURFACE_KINDS } from "./types.js";
@@ -245,6 +247,7 @@ const feedbackSchema = o({
         mix: bag,
         tuned: bag,
         comments: z.array(o({ part: nullStr, text: str })),
+        reactions: strs.optional().describe('One-tap reactions, e.g. 👍 part "hero" (variant B)'),
     })
         .nullable()
         .describe("The user's Send; null if only comments"),
@@ -288,7 +291,13 @@ const OUTPUT_SCHEMAS = {
         session: nullStr,
     },
     publish: writeOutput,
-    ask: { asks: z.array(o({ id: str, text: str })), open: num, url: str, feedback: feedbackRide },
+    ask: {
+        asks: z.array(o({ id: str, text: str })),
+        open: num,
+        url: str,
+        nudges: strs.optional(),
+        feedback: feedbackRide,
+    },
     feedback: {
         feedback: z.array(feedbackSchema).describe("One batch per mock; empty when nothing is new"),
         pending: z.array(pendingSchema),
@@ -394,6 +403,22 @@ export function toolResult(name, value) {
         ...(structured ? { structuredContent: value } : {}),
     };
 }
+// The images a result's feedback carries, inlined as image content so the
+// model sees what the user attached instead of only its URL. Capped per result:
+// the rest stay reachable by URL in the JSON.
+export const MAX_RESULT_IMAGES = 8;
+export async function withFeedbackImages(result, value, load) {
+    const batches = value?.feedback;
+    if (!Array.isArray(batches))
+        return result;
+    const images = [];
+    for (const ref of feedbackImages(batches).slice(0, MAX_RESULT_IMAGES)) {
+        const bytes = await load(ref).catch(() => null);
+        if (bytes)
+            images.push({ type: "image", data: encodeBase64(bytes.data), mimeType: bytes.mimeType });
+    }
+    return images.length ? { ...result, content: [...result.content, ...images] } : result;
+}
 // A run that failed is still a full envelope (calls, feedback); isError tells
 // the client the script did not finish.
 export function runToolResult(envelope) {

package/dist/server/run.js

@@ -170,13 +170,13 @@ export function createRunFlow(deps) {
                 return [value, `${value.mock} ${value.asks.length} ask(s)`];
             },
             async feedback() {
-                const value = await take(flows.feedback(await mine({})));
+                const value = await take(flows.feedback(await mine({}), flowCtx));
                 const n = value.feedback.length;
                 return [value, n ? `${n} batch(es)` : "no feedback"];
             },
             async say([v, message]) {
                 const r = plain(v);
-                await take(flows.say(r.mock, { ...(await mine(r)), message }));
+                await take(flows.say(r.mock, { ...(await mine(r)), message }, flowCtx));
                 return [null, String(r.mock ?? "?")];
             },
             async upload([data, opts]) {