mockpit 1.0.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/8jW0xiTo6KOZQ1GIwyS6VZDZpgXO46maUGg4lEwGWCwEIcwEIcwEIcwEIcwNLuRxNGMsbastIftcanGgRNJw8LBD2u3vobE2CaTjdx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",
+    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/eventLog.d.ts

@@ -0,0 +1,27 @@
+import type { MiddlewareHandler } from "hono";
+export interface LogEntry {
+    t: string;
+    op: string;
+    client: string;
+    status: number;
+    ms: number;
+    session?: string;
+    project?: string;
+    mock?: string;
+    state?: string | null;
+    variant?: string;
+    version?: number;
+    delivered?: number[];
+    pending?: string[];
+    nudges?: number;
+    reply?: number;
+    viewing?: string;
+    key?: string;
+    error?: string;
+}
+export type LogSink = (entry: LogEntry) => void;
+export declare function clientOf(header: string | undefined, viewer: boolean, mcp: boolean): string;
+export declare function fromRequest(query: URLSearchParams, body: unknown, pathMock: string | undefined): Partial<LogEntry>;
+export declare function fromResponse(body: unknown): Partial<LogEntry>;
+export declare function writeLog(sink: LogSink | undefined, entry: LogEntry): void;
+export declare function logMiddleware(sink: LogSink): MiddlewareHandler;

package/dist/server/eventLog.js

@@ -0,0 +1,187 @@
+// The event log: one entry per call that moves the loop (agent writes and
+// reads, viewer writes, the viewer's live feed), so a session can be diagnosed
+// after the fact — which client sent what, which reply seqs it was handed, what
+// the agent was told was pending. Shapes and ids only, never html or comment
+// text: the store already holds the content under the same ids, and a log that
+// copied it would be a second, unbounded store. `scripts/inspect.ts` reads it.
+const MAX_ERROR = 300;
+const CLIENT = /^[\w.@/-]{1,64}$/;
+export function clientOf(header, viewer, mcp) {
+    if (header && CLIENT.test(header))
+        return header;
+    if (viewer)
+        return "viewer";
+    return mcp ? "mcp-http" : "http";
+}
+const isObj = (v) => typeof v === "object" && v !== null && !Array.isArray(v);
+const text = (v) => typeof v === "string" && v ? v.slice(0, 200) : undefined;
+// What the request itself names, for calls whose response doesn't (errors,
+// feedback reads).
+export function fromRequest(query, body, pathMock) {
+    const b = isObj(body) ? body : {};
+    return prune({
+        session: text(query.get("session")) ?? text(b.session),
+        project: text(query.get("project")) ?? text(b.project),
+        mock: pathMock ?? text(b.mock),
+        variant: text(b.variant),
+        viewing: text(query.get("viewing")),
+    });
+}
+// What a flow's response body says about the call.
+export function fromResponse(body) {
+    if (!isObj(body))
+        return {};
+    const mock = isObj(body.mock) ? body.mock : undefined;
+    const post = isObj(body.post) ? body.post : undefined;
+    // POST /api/sessions answers with the bare session (201 new, 200 reclaimed by key).
+    const session = typeof body.agentSeq === "number" ? body : undefined;
+    const delivered = deliveredSeqs(body.feedback);
+    const pending = pendingLines(body.pending);
+    return prune({
+        session: text(body.sessionId) ?? text(post?.sessionId) ?? text(session?.id),
+        key: text(session?.key),
+        project: text(mock?.project) ?? text(body.project) ?? text(session?.project),
+        mock: text(mock?.slug) ??
+            text(body.slug) ??
+            (typeof body.mock === "string" ? text(body.mock) : undefined),
+        state: post ? (post.state ?? null) : undefined,
+        variant: text(post?.variant),
+        version: typeof post?.version === "number" ? post.version : undefined,
+        delivered: delivered.length ? delivered : undefined,
+        pending: pending.length ? pending : undefined,
+        nudges: Array.isArray(body.nudges) && body.nudges.length ? body.nudges.length : undefined,
+        reply: isObj(body.reply) && typeof body.reply.seq === "number" ? body.reply.seq : undefined,
+        error: typeof body.error === "string" ? body.error.slice(0, MAX_ERROR) : undefined,
+    });
+}
+function deliveredSeqs(feedback) {
+    if (!Array.isArray(feedback))
+        return [];
+    const seqs = [];
+    for (const batch of feedback) {
+        if (!isObj(batch))
+            continue;
+        if (isObj(batch.reply) && typeof batch.reply.seq === "number")
+            seqs.push(batch.reply.seq);
+        for (const c of Array.isArray(batch.comments) ? batch.comments : []) {
+            if (isObj(c) && typeof c.seq === "number")
+                seqs.push(c.seq);
+        }
+    }
+    return seqs.sort((a, b) => a - b);
+}
+function pendingLines(pending) {
+    const rows = Array.isArray(pending) ? pending : isObj(pending) ? [pending] : [];
+    return rows.flatMap((p) => {
+        if (!isObj(p) || typeof p.mock !== "string")
+            return [];
+        if (isObj(p.draft))
+            return [`${p.mock} ${p.draft.answered}/${p.draft.of} answered`];
+        return p.viewerOpen ? [`${p.mock} open`] : [];
+    });
+}
+function prune(entry) {
+    for (const k of Object.keys(entry))
+        if (entry[k] === undefined)
+            delete entry[k];
+    return entry;
+}
+// A sink that throws must never fail the request it describes.
+export function writeLog(sink, entry) {
+    if (!sink)
+        return;
+    try {
+        sink(entry);
+    }
+    catch {
+        // The log is diagnostics; losing an entry beats losing the call.
+    }
+}
+// The viewer's reads (it refetches on every feed event) would drown the agent's
+// calls, so only its writes and its feed connection are logged.
+function loggable(c, viewer) {
+    const path = c.req.path;
+    if (path === "/mcp")
+        return c.req.method === "POST";
+    if (!path.startsWith("/api/"))
+        return false;
+    return path === "/api/events" || c.req.method !== "GET" || !viewer;
+}
+const isJson = (type) => !!type?.includes("application/json");
+export function logMiddleware(sink) {
+    return async (c, next) => {
+        const start = Date.now();
+        await next();
+        const viewer = c.req.header("sec-fetch-site") === "same-origin";
+        if (!loggable(c, viewer))
+            return;
+        try {
+            const url = new URL(c.req.url);
+            // Handlers already parsed the body; Hono hands back its cached copy.
+            const reqBody = isJson(c.req.header("content-type"))
+                ? await c.req.json().catch(() => undefined)
+                : undefined;
+            // Never clone a non-JSON body: a clone of the SSE stream is a tee branch
+            // nobody reads, which buffers every event for the connection's life.
+            const resBody = isJson(c.res.headers.get("content-type"))
+                ? await c.res
+                    .clone()
+                    .json()
+                    .catch(() => undefined)
+                : undefined;
+            const mcp = c.req.path === "/mcp";
+            const entry = {
+                t: new Date().toISOString(),
+                op: mcp ? mcpOp(reqBody) : `${c.req.method} ${c.req.path}`,
+                client: clientOf(c.req.header("x-mockpit-client"), viewer, mcp),
+                status: c.res.status,
+                ms: Date.now() - start,
+            };
+            if (mcp) {
+                const call = isObj(reqBody) && isObj(reqBody.params) ? reqBody.params : {};
+                Object.assign(entry, fromRequest(url.searchParams, call.arguments, undefined));
+                Object.assign(entry, fromMcpResult(resBody));
+            }
+            else {
+                const pathMock = /^\/api\/mocks\/([^/]+)/.exec(c.req.path)?.[1];
+                Object.assign(entry, fromRequest(url.searchParams, reqBody, pathMock));
+                Object.assign(entry, fromResponse(resBody));
+            }
+            writeLog(sink, entry);
+        }
+        catch {
+            // Same as writeLog: diagnostics never fail the call.
+        }
+    };
+}
+function mcpOp(body) {
+    if (!isObj(body))
+        return "mcp";
+    if (body.method === "tools/call" && isObj(body.params)) {
+        return `mcp ${text(body.params.name) ?? "?"}`;
+    }
+    return `mcp ${text(body.method) ?? "?"}`;
+}
+// A tool result carries the flow's JSON body: structured where the tool
+// declares an output schema, else as its text content.
+function fromMcpResult(body) {
+    if (!isObj(body))
+        return {};
+    if (isObj(body.error))
+        return { error: String(body.error.message).slice(0, MAX_ERROR) };
+    const result = isObj(body.result) ? body.result : {};
+    if (isObj(result.structuredContent))
+        return fromResponse(result.structuredContent);
+    const first = Array.isArray(result.content) ? result.content[0] : undefined;
+    const raw = isObj(first) && typeof first.text === "string" ? first.text : undefined;
+    if (raw === undefined)
+        return {};
+    if (result.isError)
+        return { error: raw.slice(0, MAX_ERROR) };
+    try {
+        return fromResponse(JSON.parse(raw));
+    }
+    catch {
+        return {};
+    }
+}

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;