mockpit 1.1.0 → 1.3.0

package/dist/server/types.d.ts

@@ -8,6 +8,8 @@ export interface Session {
     lastActiveAt: string;
     agentSeq: number;
     project: string | null;
+    agentActiveAt: string | null;
+    keyed: boolean;
 }
 export declare const SURFACE_KINDS: readonly ["html", "diff", "image", "markdown", "terminal", "mermaid", "json", "code"];
 export type SurfaceKind = (typeof SURFACE_KINDS)[number];
@@ -195,14 +197,22 @@ export interface PadValue {
 }
 export type KnobValue = number | boolean | string | PadValue | SpringKnob | EasingKnob;
 export type MockKind = "page" | "component";
-export type PostStatus = "open" | "accepted" | "archived";
+export type PostStatus = "open" | "accepted" | "archived" | "dropped";
+export declare const isLive: (status: PostStatus) => boolean;
+export declare const inUseVersion: (post: Pick<Post, "status" | "version" | "acceptedVersion">) => number;
+export declare function postAtVersion(post: Post, version: number): Post | null;
+export declare function versionAt(post: Pick<Post, "version" | "history">, n: number): number;
 export interface AskOption {
     id: string;
     label: string;
     variant?: string;
+    version?: number;
     set?: Record<string, KnobValue>;
 }
 export type AskAnswer = string | string[];
+export declare const optionState: (ask: Pick<Ask, "state">, mock: {
+    states: string[];
+}) => string | null;
 export interface Ask {
     id: string;
     text: string;
@@ -211,9 +221,13 @@ export interface Ask {
     part?: string;
     options: AskOption[];
     multi?: boolean;
+    after?: string;
     answer?: AskAnswer;
     other?: string;
     note?: string;
+    otherImages?: string[];
+    noteImages?: string[];
+    dismissed?: true;
     at: string;
 }
 export declare const OTHER_ID = "other";
@@ -222,17 +236,23 @@ export interface PartCommentAnchor {
     quote?: string;
     selector?: string;
     box?: number[];
+    width?: number;
 }
+export declare const REACTIONS: readonly ["up", "down", "more"];
+export type Reaction = (typeof REACTIONS)[number];
 export interface PartComment {
     part: string | null;
     state: string | null;
     text: string;
     anchor?: PartCommentAnchor;
+    reaction?: Reaction;
+    variant?: string;
 }
 export interface ReplyDecision {
     kind: "accept" | "revise" | "drop";
     state: string | null;
     variant: string;
+    version?: number;
 }
 export interface Draft {
     version: number;
@@ -242,6 +262,8 @@ export interface Draft {
     comments: PartComment[];
     others?: Record<string, string>;
     notes?: Record<string, string>;
+    otherImages?: Record<string, string[]>;
+    noteImages?: Record<string, string[]>;
     updatedAt: string;
 }
 export interface Reply {
@@ -253,8 +275,13 @@ export interface Reply {
     comments: PartComment[];
     others?: Record<string, string>;
     notes?: Record<string, string>;
+    otherImages?: Record<string, string[]>;
+    noteImages?: Record<string, string[]>;
     text?: string;
     decision?: ReplyDecision;
+    resolved?: {
+        dismissed: string[];
+    };
 }
 export interface Mock {
     id: string;
@@ -265,15 +292,18 @@ export interface Mock {
     states: string[];
     asks: Ask[];
     knobs: Knobs;
+    widths: number[];
     draft: Draft | null;
     sessionId: string | null;
+    resolvedAt: string | null;
     createdAt: string;
     updatedAt: string;
 }
-export interface Slot {
+export interface Embed {
     slug: string;
     variant: string;
     version: number;
+    pinned?: true;
 }
 export interface PostVersion {
     version: number;
@@ -284,6 +314,10 @@ export interface PostVersion {
     prompt?: string;
     author?: string;
 }
+export interface ForkRef {
+    variant: string;
+    version: number;
+}
 export interface Post {
     id: string;
     sessionId: string;
@@ -298,11 +332,28 @@ export interface Post {
     version: number;
     history: PostVersion[];
     knobs?: Knobs;
-    slots: Slot[];
+    note?: string;
+    embeds: Embed[];
+    forkedFrom?: ForkRef;
+    starred?: true;
+    acceptedVersion?: number;
+    hiddenVersions?: number[];
     from?: number;
     prompt?: string;
     author?: string;
 }
+export interface FlowStep {
+    mock: string;
+    state: string | null;
+}
+export interface Flow {
+    project: string;
+    name: string;
+    steps: FlowStep[];
+    createdAt: string;
+    updatedAt: string;
+}
+export declare const sameScreen: (a: FlowStep, b: FlowStep) => boolean;
 export interface ProjectSummary {
     name: string;
     mocks: number;
@@ -457,6 +508,7 @@ export interface CreateMockInput {
     kind?: MockKind;
     states?: string[];
     knobs?: Knobs;
+    widths?: number[];
     sessionId?: string | null;
 }
 export interface UpdateMockInput {
@@ -465,7 +517,9 @@ export interface UpdateMockInput {
     states?: string[];
     asks?: Ask[];
     knobs?: Knobs;
+    widths?: number[];
     sessionId?: string | null;
+    resolvedAt?: string | null;
 }
 export interface CreatePostInput {
     sessionId: string;
@@ -475,7 +529,9 @@ export interface CreatePostInput {
     title?: string;
     surfaces: Surface[];
     knobs?: Knobs;
-    slots?: Slot[];
+    note?: string;
+    embeds?: Embed[];
+    forkedFrom?: ForkRef;
     from?: number;
     prompt?: string;
     author?: string;
@@ -484,7 +540,8 @@ export interface UpdatePostInput {
     title?: string;
     surfaces?: Surface[];
     knobs?: Knobs | null;
-    slots?: Slot[];
+    note?: string;
+    embeds?: Embed[];
     from?: number;
     prompt?: string;
     author?: string;
@@ -515,21 +572,29 @@ export interface CommitReplyInput {
     text: string;
     payload: Reply;
     asks: Ask[];
-    accept: string[];
+    accept: {
+        id: string;
+        version: number;
+    }[];
     archive: string[];
+    drop?: string[];
+    resolvedAt?: string;
+    keepDraft?: true;
 }
 export interface PostQuery {
     mockId?: string;
     sessionId?: string;
 }
 export interface Store {
-    listSessions(): Promise<Session[]>;
+    listSessions(project?: string): Promise<Session[]>;
     getSession(id: string): Promise<Session | null>;
     getSessionByKey(key: string): Promise<Session | null>;
     createSession(input: CreateSessionInput): Promise<Session>;
     renameSession(id: string, title: string): Promise<Session | null>;
     removeSession(id: string): Promise<boolean>;
     markAgentSeen(sessionId: string, seq: number): Promise<void>;
+    touchAgent(sessionId: string): Promise<void>;
+    handOff(sessionId: string, seen: Pick<Session, "agentSeq" | "agentActiveAt">, toSeq: number): Promise<boolean>;
     getSetting(key: string): Promise<string | null>;
     setSetting(key: string, value: string): Promise<void>;
     listProjects(): Promise<ProjectSummary[]>;
@@ -539,6 +604,8 @@ export interface Store {
     createMock(input: CreateMockInput): Promise<Mock>;
     updateMock(id: string, patch: UpdateMockInput): Promise<Mock | null>;
     removeMock(id: string): Promise<boolean>;
+    listFlows(project: string): Promise<Flow[]>;
+    placeFlowStep(project: string, name: string, screen: FlowStep, step: number): Promise<Flow | null>;
     putDraft(mockId: string, draft: Draft | null): Promise<Mock | null>;
     listPosts(query?: PostQuery): Promise<Post[]>;
     countPostsBySession(): Promise<Map<string, number>>;
@@ -547,7 +614,9 @@ export interface Store {
     createPost(input: CreatePostInput): Promise<Post | null>;
     updatePost(id: string, patch: UpdatePostInput): Promise<Post | null>;
     removePost(id: string): Promise<boolean>;
-    setPostStatus(id: string, status: PostStatus): Promise<Post | null>;
+    setPostStatus(id: string, status: PostStatus, acceptedVersion?: number): Promise<Post | null>;
+    setPostStarred(id: string, starred: boolean): Promise<Post | null>;
+    setVersionHidden(id: string, version: number, hidden: boolean): Promise<Post | null>;
     listComments(query: CommentQuery): Promise<Comment[]>;
     createComment(input: CreateCommentInput): Promise<Comment | null>;
     removeComment(id: string): Promise<Comment | null>;
@@ -572,6 +641,8 @@ export declare const HISTORY_LIMIT = 20;
 export declare function reservedAgent(name: string): string;
 export declare function stripNul<T extends string | null | undefined>(s: T): T;
 export declare const MAX_ASSET_BYTES: number;
+export declare const ATTACHABLE_IMAGE_TYPES: ReadonlySet<string>;
+export declare const MAX_ASK_IMAGES = 6;
 export declare const MAX_WORKSPACE_ASSET_BYTES: number;
 export declare const newId: () => string;
 export declare function hashAssetId(data: Uint8Array): Promise<string>;
@@ -583,13 +654,27 @@ export declare function projectFromCwd(cwd: string | null | undefined): string |
 export declare const htmlSurface: (html: string, kits?: unknown) => HtmlSurface;
 export declare const askAnswered: (a: Pick<Ask, "answer" | "other" | "note">) => boolean;
 export declare const openAsks: (mock: Pick<Mock, "asks">) => Ask[];
-export declare function builtinAskCount(mock: Pick<Mock, "asks" | "states">, posts: Pick<Post, "mock" | "state" | "variant" | "status">[], mockId: string): number;
-export declare const openCount: (mock: Pick<Mock, "id" | "asks" | "states">, posts: Pick<Post, "mock" | "state" | "variant" | "status">[]) => number;
+export declare function builtinAskIds(mock: Pick<Mock, "asks" | "states"> & {
+    resolvedAt?: string | null;
+}, posts: Pick<Post, "mock" | "state" | "variant" | "status">[], mockId: string): string[];
+export declare const builtinAskCount: (mock: Pick<Mock, "asks" | "states"> & {
+    resolvedAt?: string | null;
+}, posts: Pick<Post, "mock" | "state" | "variant" | "status">[], mockId: string) => number;
+export declare const openCount: (mock: Pick<Mock, "id" | "asks" | "states"> & {
+    resolvedAt?: string | null;
+}, posts: Pick<Post, "mock" | "state" | "variant" | "status">[]) => number;
+export declare function draftedCount(mock: Pick<Mock, "id" | "asks" | "states" | "draft"> & {
+    resolvedAt?: string | null;
+}, posts: Pick<Post, "mock" | "state" | "variant" | "status">[]): number | null;
 export declare const BUILTIN_ASK_ID = "variant";
 export declare function builtinAsk(mock: Pick<Mock, "states">, posts: Pick<Post, "state" | "variant">[], id: string): Ask | undefined;
 export declare function summarizeProjects(mocks: Mock[], sessions: Session[], posts?: Post[]): ProjectSummary[];
 export declare function surfacesByteLength(surfaces: Surface[]): number;
 export declare function collectAssetIds(surfaces: Surface[], out: Set<string>): void;
+export declare function collectAttachedIds(holder: {
+    otherImages?: unknown;
+    noteImages?: unknown;
+} | null | undefined, out: Set<string>): void;
 export interface EvictionCandidate {
     id: string;
     byteLength: number;

package/dist/server/types.js

@@ -51,9 +51,50 @@ export function isSurfaceKind(kind) {
 export function isSandboxedSurfaceKind(kind) {
     return isSurfaceKind(kind) && SURFACE_KIND_METADATA[kind].sandboxed;
 }
+// Still in the running: what the user can choose between.
+export const isLive = (status) => status === "open" || status === "accepted";
+// The version a variant is resolved at when nothing names one: the version in
+// use when accepted, else its latest.
+export const inUseVersion = (post) => post.status === "accepted" ? (post.acceptedVersion ?? post.version) : post.version;
+// A variant as it stood at one of its versions (current or retained), or null
+// when that version is gone.
+export function postAtVersion(post, version) {
+    if (version === post.version)
+        return post;
+    const old = post.history.find((h) => h.version === version);
+    if (!old)
+        return null;
+    const { from: _f, prompt: _p, author: _a, ...rest } = post;
+    return {
+        ...rest,
+        version: old.version,
+        title: old.title,
+        surfaces: old.surfaces,
+        updatedAt: old.at,
+        ...(old.from === undefined ? {} : { from: old.from }),
+        ...(old.prompt === undefined ? {} : { prompt: old.prompt }),
+        ...(old.author === undefined ? {} : { author: old.author }),
+    };
+}
+// The variant's newest version not after mock version `n` — what the stage
+// showed when a draft or reply was bound to n (the viewer's frameVersion).
+export function versionAt(post, n) {
+    const versions = [post.version, ...post.history.map((h) => h.version)];
+    const fit = versions.filter((v) => v <= n);
+    return fit.length ? Math.max(...fit) : Math.min(...versions);
+}
+// The state a version option names a version in: the ask's state, else the
+// mock's first (`ask` accepts version options without a state only while the
+// mock has one).
+export const optionState = (ask, mock) => ask.state ?? mock.states[0] ?? null;
 // The viewer's write-in option on every ask. Reserved, so a delivered
 // `{id: "other", other: true}` choice never shadows an option the agent declared.
 export const OTHER_ID = "other";
+// A one-tap verdict on a part (or, with part null, on the variant itself),
+// for a reviewer on a phone who would rather not type: like, dislike, or
+// "more like this". Rides as a part comment, so it travels in the one reply.
+export const REACTIONS = ["up", "down", "more"];
+export const sameScreen = (a, b) => a.mock === b.mock && a.state === b.state;
 export const HISTORY_LIMIT = 20;
 // "user" is the reserved trust label for genuine human comments. A session
 // agent with that name could otherwise have its programmatic comments delivered
@@ -73,6 +114,15 @@ export function stripNul(s) {
 // budget the store evicts down to. One Durable Object holds the whole workspace, so
 // the budget sits well under its ~10 GB SQLite ceiling.
 export const MAX_ASSET_BYTES = 5 * 1024 * 1024;
+// What the user may attach to a write-in or a note: raster formats a model can
+// read. SVG is active content, so it is never attachable.
+export const ATTACHABLE_IMAGE_TYPES = new Set([
+    "image/png",
+    "image/jpeg",
+    "image/webp",
+    "image/gif",
+]);
+export const MAX_ASK_IMAGES = 6;
 export const MAX_WORKSPACE_ASSET_BYTES = 2 * 1024 * 1024 * 1024;
 // Short, unguessable id: 8 random bytes (64 bits) as 11 url-safe base64 chars.
 // These double as bearer capabilities: in publicRead mode `/s/:id` and
@@ -139,15 +189,18 @@ export const htmlSurface = (html, kits) => ({
 // An open ask is one no reply has answered yet: a write-in or a note alone
 // answers it too ("Neither, because…").
 export const askAnswered = (a) => a.answer !== undefined || a.other !== undefined || a.note !== undefined;
-export const openAsks = (mock) => mock.asks.filter((a) => !askAnswered(a));
+export const openAsks = (mock) => mock.asks.filter((a) => !askAnswered(a) && !a.dismissed);
 // How many built-in "Which one?" asks the viewer shows: one mock-wide when every
 // state needs one and the live names line up, else one per needing state. Same
 // rule as viewer/src/logic.ts builtinAsks, so Home, `read` and `pending` count
 // the question the user actually sees. Answering it archives the losers, which
 // is what makes it stop counting.
-export function builtinAskCount(mock, posts, mockId) {
+export function builtinAskIds(mock, posts, mockId) {
+    // Resolving closed the choice along with every other open question.
+    if (mock.resolvedAt)
+        return [];
     const live = (state) => posts
-        .filter((p) => p.mock === mockId && p.state === state && p.status !== "archived")
+        .filter((p) => p.mock === mockId && p.state === state && isLive(p.status))
         .map((p) => p.variant);
     const needs = (state) => {
         const names = live(state);
@@ -159,14 +212,30 @@ export function builtinAskCount(mock, posts, mockId) {
     const states = mock.states.length ? mock.states : [null];
     const needing = states.filter(needs);
     if (!needing.length)
-        return 0;
+        return [];
     const key = (state) => [...live(state)].sort().join("\n");
     const first = key(needing[0]);
     return needing.length === states.length && states.every((st) => key(st) === first)
-        ? 1
-        : needing.length;
+        ? [BUILTIN_ASK_ID]
+        : needing.map((st) => (st === null ? BUILTIN_ASK_ID : `${BUILTIN_ASK_ID}:${st}`));
 }
+export const builtinAskCount = (mock, posts, mockId) => builtinAskIds(mock, posts, mockId).length;
 export const openCount = (mock, posts) => openAsks(mock).length + builtinAskCount(mock, posts, mock.id);
+// How many of the open asks the user's unsent draft already speaks for (a
+// pick, a write-in or a note), so Home can show a started mock as "draft 2/4";
+// null when there is no draft. A count only: the draft's content stays private.
+export function draftedCount(mock, posts) {
+    const d = mock.draft;
+    if (!d)
+        return null;
+    const open = [...openAsks(mock).map((a) => a.id), ...builtinAskIds(mock, posts, mock.id)];
+    const said = (id) => {
+        const a = d.answers[id];
+        const picked = Array.isArray(a) ? a.length > 0 : a !== undefined;
+        return picked || d.others?.[id] !== undefined || d.notes?.[id] !== undefined;
+    };
+    return open.filter(said).length;
+}
 // The viewer's built-in "Which one?" for variants no agent ask binds: `variant`
 // mock-wide, `variant:<state>` per state. Never stored; synthesized from the
 // variants so a reply answering it validates, flips and reads like any ask. An
@@ -275,6 +344,20 @@ export function collectAssetIds(surfaces, out) {
             out.add(p.assetId);
     }
 }
+// The images a draft, a reply or a sent ask carries (all keep the user's
+// attachments in otherImages / noteImages).
+export function collectAttachedIds(holder, out) {
+    for (const map of [holder?.otherImages, holder?.noteImages]) {
+        if (!map || typeof map !== "object")
+            continue;
+        for (const ids of Array.isArray(map) ? [map] : Object.values(map)) {
+            if (Array.isArray(ids))
+                for (const id of ids)
+                    if (typeof id === "string")
+                        out.add(id);
+        }
+    }
+}
 // Pick the assets to evict so `incomingBytes` fits under `budget`. Oldest
 // (lastAccessedAt) first, but unreferenced assets go before referenced ones —
 // a live embed is only evicted as a last resort, once unreferenced candidates

package/dist/server/viewerRequest.d.ts

@@ -0,0 +1,2 @@
+export declare const VIEWER_CLIENT = "viewer";
+export declare function isViewerRequest(request: Request): boolean;

package/dist/server/viewerRequest.js

@@ -0,0 +1,14 @@
+// Whether a request comes from the trusted viewer, the page this server
+// served: only it may act as the user (drafts, replies, user comments).
+// Fetch Metadata says so directly, but browsers omit it on plain http away
+// from localhost (a LAN or tailnet address), where the viewer then looked
+// like any other client and every draft call failed. The viewer also names
+// itself with a custom header, which a cross-origin caller cannot send: that
+// header forces a CORS preflight, and this server answers none, so a sandboxed
+// surface (opaque origin) or another site is refused by the browser itself.
+export const VIEWER_CLIENT = "viewer";
+export function isViewerRequest(request) {
+    if (request.headers.get("sec-fetch-site") === "same-origin")
+        return true;
+    return request.headers.get("x-mockpit-client") === VIEWER_CLIENT;
+}

package/extensions/mockpit.js

@@ -220,6 +220,7 @@ function feedbackLines(feedback) {
   const lines = [];
   for (const batch of feedback ?? []) {
     const prefix = batch.mock ? `${batch.mock}: ` : "";
+    if (batch.handoff) lines.push(`- ${prefix}${batch.handoff}`);
     const reply = batch.reply;
     if (reply) {
       for (const a of reply.asks ?? []) {

package/guide/topics/asks.md

@@ -7,9 +7,12 @@ where to look and end your turn.
 
 ```sh
 mockpit ask --mock writer "Which look?" --option Quiet=quiet --option Dark=dark --id look
+mockpit ask --mock writer "Trim?" --option Above=knob:trim.position=top --option Below=knob:trim.position=bottom
 mockpit ask --mock writer --asks asks.json
 ```
 
+`=knob:` sets one knob; for an option that sets several, use `--asks` JSON.
+
 ## Shape
 
 The same JSON goes to `--asks`, MCP `ask` and `POST /api/mocks/:id/asks`:
@@ -49,39 +52,95 @@ The same JSON goes to `--asks`, MCP `ask` and `POST /api/mocks/:id/asks`:
 ## Scope
 
 `scope` says what an ask decides: `mock` (the default), `state` (add `state`)
-or `part` (add `part`, the `data-part` name).
+or `part` (add `part`, the `data-part` name). Scope also says where the user
+sees it: the viewer shows each state with its own questions. A `state` ask
+shows on that state, a `part` ask on every state that marks the part, and a
+`mock` ask whose options name variants on every state that has them (any
+other `mock` ask on every state); answered once, it counts once.
+
+Only open asks are shown and counted ("1 of 3"). Once a Send answers one, it
+folds into a read-only Answered list and stays out of the next round, so ask
+new questions for what is still open rather than re-sending answered ones; the
+user changes a sent answer only on purpose, and the change arrives as a normal
+Send.
 
 ## Options
 
 An option binds to one of:
 
 - a `variant`: picking it accepts that variant and archives its siblings in
-  that state.
+  that state. Add `version` to offer one version of it (`"version": 2`, CLI
+  `--option Before=quiet@2`): two options can be two versions of one variant,
+  and the picked one is put in use. It needs the ask's `state` when the mock
+  has several.
 - a knob `set`: picking it applies those values live.
 - nothing: a plain pill.
 
+Options that change how something looks carry a `variant` or a knob `set`,
+so the user sees them live. Plain pills only for what can't be seen.
+
+When one question only makes sense once another is answered (an accent's
+placement depends on the palette), give it `after: "<that ask's id>"` (CLI
+`--after palette`). It stays closed until that one is answered, then its
+pictures render with that answer and say so. Ask the deciding question first.
+
 The viewer shows a picture of each option it can render. `multi: true` allows
 several answers. Option ids default to the slugged label. Reusing an ask `id`
 replaces that ask. The viewer adds an "Other…" write-in and a note to every
-ask, so don't add your own; the option id `other` is reserved.
+ask (both take attached images), so don't add your own; the option id `other`
+is reserved.
+
+## Slots
+
+A slot is one region with alternative fills, in one html. Give each
+alternative the same `data-part` and its own `data-fill`:
+
+```html
+<section data-part="entry" data-part-label="Entry" data-fill="dots" data-fill-label="Typing dots">
+  …
+</section>
+<section data-part="entry" data-fill="skeleton">…</section>
+<section data-part="entry" data-fill="filling" data-fill-default>…</section>
+```
+
+The first fill is the default unless one carries `data-fill-default`. The
+server derives a select knob at the part's name and shows only the chosen
+fill, so you write no switching CSS; give each fill whatever display it
+needs. Draw anything inside a fill, including further slots: a slot inside a
+fill is asked only while that fill is chosen, right after its parent's
+question.
+
+Publish returns the slots it found and, for each one no ask binds, a ready
+`suggestedSlotAsks` entry: `scope: "part"`, one option per fill with
+`set: {"entry": "<fill>"}`. Send them with `ask`, relabelled if you like. On a
+pick the viewer outlines the fill on stage. `fills` in publish replaces or
+adds one fill without resending the page (topic `feedback`).
+
+Use a slot when the alternatives differ in one region; use variants when the
+whole screen differs. Both mix: variants are looks, each look may have slots.
 
 ## The Look ask
 
 When you publish variants, ask `scope: "mock"` with one option per variant, and
 ask it first. Questions appear in the order you ask them. This one is titled
-"Look" and unlocks Mix, which lets the user borrow a part from another look.
+"Look". Tune then offers, per part, to borrow it from another look.
 Variants without a Look ask get a plain switcher in the frame header.
 
+A variant decides everything it differs on; don't re-ask it. Ask other axes as
+knob `set`s.
+
 ## When you forget to ask
 
 A publish that leaves a state with two or more open variants and no ask
 binding them returns a nudge and a ready `suggestedAsk` (mock-wide when the
-variant names line up across states, else for that state). Send it as is with
-`ask`, or write your own question with options bound to the variants. The CLI
-prints the `mockpit ask` command for you.
-
-Until an ask binds them, the viewer shows a built-in "Which one?" with a
-picture of each variant, so the user can still choose in one Send. Its answer
+variant names line up across states, else for that state), or your existing
+ask plus the new variants. Send it as is with `ask`, or write your own question
+with options bound to the variants. The CLI prints the `mockpit ask` command
+for you. Sending it stops the nudge and keeps the answered Look ask on the
+mock; the built-in one is gone once answered.
+
+Until an ask binds them, the viewer shows a built-in Look ask with a picture
+of each variant, so the user can still choose in one Send. Its answer
 reads like any other ask under the reserved id `variant` (per state:
 `variant:<state>`), and accepts and archives per state. Your own ask over
 those variants replaces it.