@12ui/design 0.2.80 → 0.2.82

package/dist/mcp-slate-ui-script-more.js

@@ -1,298 +1,25 @@
 /**
- * Generate more: a dashed tile with a plus and the words Generate more, and
- * the panel it opens directly below it. In the card it is the last tile of the
- * strip, whose thumbnails wrap rather than scroll sideways, and the panel
- * opens below the strip; in the workspace it is a slim bar on top of the
- * selection, before the newest round in the column's flow (rounds are newest
- * first, so it sits where the next round will land), and the panel opens under
- * the bar. Either way it is in view without a scroll from where the thumbnails
- * rest. The panel is the only way to start a round, and it says what it will
- * do:
- *
- * - a heading and one helper line that follows the state (fresh references,
- *   the selected inspiration, or close to the shown design);
- * - a switch, with a picture of the design at its left, "Based on <code>", off by default: off draws new options, on
- *   draws options close to the design that is shown (mode "like" from the
- *   shown version at the moment of Generate);
- * - the selected inspiration as small chips, each with a remove button that is
- *   the same selection write as the Inspiration tab's toggle (adding is done
- *   in that tab);
- * - an optional note, how many (1, 2, 4, 6, 8 or 12, default 6) and Cancel and
- *   Generate.
- *
- * Clicking the tile again, Cancel or Escape collapses it. While a round runs
- * (or the request is in flight) the tile is off; the new round's pending
- * options are already in the thumbnails, because the returned view carries
- * them.
- *
- * In the card the panel takes its room from the large image rather than
- * growing the frame. The host grows the frame downward and does not scroll
- * the thread, so a panel added below the thumbnails lands under the host's
- * composer, out of sight (the frame's own document has nothing to scroll).
- * While the panel is open the image is shortened by the panel's height, and
- * folded away when what would be left is too small to read, so the card keeps
- * its height and the panel sits where the bottom of the card already was.
+ * How a new round starts. The Designs tab's More (with its 6 or 12, mcp-slate-ui-script-designs.ts) and the
+ * Inspiration tab's Generate both come here: the inspiration selection is committed first, so the round uses what the
+ * person sees, then the run is recorded and the returned view already carries the round's loading tiles. While a round
+ * runs, or the request is in flight, More and Branch are off.
  */
 export const SLATE_UI_MORE = String.raw `
   var MORE = __MORE__;
-  var ICON_PLUS = "M12 5v14M5 12h14";
 
-  // A round that is running, or the panel's own request still in flight, keeps the tile off until it settles.
   function moreBusy() {
-    return (!!state.view && runningOps().some(function (o) { return o.kind === "round"; })) || !!(state.more && state.more.committing);
+    return (!!state.view && runningOps().some(function (o) { return o.kind === "round"; })) || designs.filling;
   }
 
-  // One tile per place: the card's strip and the workspace's selection each build their own.
-  function moreTile() {
-    var b = button("", "moretile", toggleMore);
-    b.setAttribute("aria-label", t("generateMore"));
-    b.setAttribute("aria-expanded", "false");
-    b.setAttribute("aria-controls", "morepanel");
-    b.title = t("generateMore");
-    b.innerHTML = '<svg viewBox="0 0 24 24" width="28" height="28" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" aria-hidden="true"><path d="' + ICON_PLUS + '"/></svg>';
-    b.appendChild(el("span", "", t("generateMore")));
-    return b;
-  }
-  function moreTiles() { return Array.prototype.slice.call(document.querySelectorAll(".moretile")); }
-  function moreHosts() { return [$("more"), stageEls && stageEls.more].filter(Boolean); }
-
-  function toggleMore() {
-    if (state.more) { closeMore(true); return; }
-    openMore();
-  }
-  function openMore() {
-    if (!state.view || state.view.candidates.length === 0 || moreBusy()) return;
-    if (state.more) resetMore();
-    state.more = { id: uuid4(), like: false, note: "", count: MORE.initial, committing: false, error: "", sig: "", els: {} };
-    buildMore();
-    syncMore();
-    state.more.els.note.focus();
-  }
-  // The shortest the card's image gets while the panel is open; below this it folds away, and the thumbnails stay.
-  var HERO_FLOOR_PX = 120;
-  function fitMore() {
-    var hero = $("hero");
-    if (!hero) return;
-    hero.style.removeProperty("--cap");
-    hero.classList.remove("folded");
-    var m = state.more;
-    if (!m || isFullscreen() || m.els.box.parentNode !== $("more")) return;
-    // The panel's host holds the panel and the gap above it, so its height is all the room the panel takes.
-    var natural = hero.getBoundingClientRect().height;
-    var need = $("more").getBoundingClientRect().height;
-    if (!(natural > 0) || !(need > 0)) return;
-    var left = Math.floor(natural - need);
-    if (left >= HERO_FLOOR_PX) hero.style.setProperty("--cap", left + "px");
-    else hero.classList.add("folded");
-  }
-  function closeMore(refocus) {
-    var m = state.more;
-    if (!m || m.committing) return;
-    state.more = null;
-    moreHosts().forEach(function (host) { host.textContent = ""; });
-    syncMore();
-    fitMore();
-    if (refocus) {
-      var back = moreTiles().filter(function (t) { return !t.disabled && !isHiddenNode(t); })[0];
-      if (back) back.focus();
-    }
-    reportSize();
-  }
-  // A different run replaces the workspace: whatever was typed belongs to the old one.
-  function resetMore() {
-    state.more = null;
-    moreHosts().forEach(function (host) { host.textContent = ""; });
-    fitMore();
-  }
-  function isHiddenNode(node) {
-    for (var n = node; n && n.classList; n = n.parentElement) if (n.classList.contains("hidden")) return true;
-    return false;
-  }
-
-  // The design the switch is about: the one that is shown when Generate is clicked, so it follows the selection.
-  function moreBase() { var v = selectedVersion(); return pickable(v) ? v : null; }
-
-  function buildMore() {
-    var m = state.more;
-    var box = el("div", "morepanel");
-    box.id = "morepanel";
-    box.setAttribute("role", "group");
-    var title = el("h2", "morehead", t("generateMore"));
-    title.id = "morehead";
-    box.setAttribute("aria-labelledby", "morehead");
-    box.appendChild(title);
-    m.els.help = el("p", "help");
-    box.appendChild(m.els.help);
-
-    // The switch: a native checkbox that reads as a switch, with a picture of the design it is about.
-    var label = el("label", "moreswitch");
-    m.els.toggle = el("input");
-    m.els.toggle.type = "checkbox";
-    m.els.toggle.setAttribute("role", "switch");
-    m.els.toggle.addEventListener("change", function () { m.like = m.els.toggle.checked; syncMore(); });
-    m.els.thumb = el("img", "morethumb empty");
-    m.els.thumb.alt = "";
-    m.els.switchText = el("span", "moreswitchtext");
-    label.appendChild(m.els.thumb);
-    label.appendChild(m.els.switchText);
-    label.appendChild(m.els.toggle);
-    box.appendChild(label);
-
-    // The inspiration that is selected, read back from the view; removing one is the tab's own selection write.
-    m.els.chipsWrap = el("div", "morechips hidden");
-    m.els.chipsWrap.appendChild(el("span", "lbl", t("moreInspirationLabel")));
-    m.els.chips = el("div", "refchips");
-    m.els.chipsWrap.appendChild(m.els.chips);
-    box.appendChild(m.els.chipsWrap);
-
-    var note = el("textarea");
-    note.setAttribute("rows", "2");
-    note.setAttribute("maxlength", "600");
-    note.setAttribute("placeholder", t("moreNotePlaceholder"));
-    note.setAttribute("aria-label", t("moreNotePlaceholder"));
-    note.addEventListener("input", function () { m.note = note.value; });
-    // The wrapper's hidden twin of the placeholder gives the field the height its words need at this width.
-    var noteWrap = el("div", "notewrap");
-    noteWrap.setAttribute("data-placeholder", t("moreNotePlaceholder"));
-    noteWrap.appendChild(note);
-    box.appendChild(noteWrap);
-    var row = el("div", "morerow");
-    var seg = el("div", "seg");
-    seg.setAttribute("role", "radiogroup");
-    seg.setAttribute("aria-label", t("moreCountLabel"));
-    MORE.choices.forEach(function (n) {
-      var option = el("label", "segopt");
-      var input = el("input");
-      input.type = "radio";
-      input.name = "morecount";
-      input.value = String(n);
-      input.checked = n === m.count;
-      input.addEventListener("change", function () { m.count = n; });
-      option.appendChild(input);
-      option.appendChild(el("span", "", String(n)));
-      seg.appendChild(option);
-    });
-    row.appendChild(seg);
-    // Cancel and Generate stay together: on a narrow card they drop to the next line as a pair, at the right.
-    var buttons = el("span", "morebtns");
-    buttons.appendChild(button(t("cancel"), "", function () { closeMore(true); }));
-    m.els.primary = button(t("generate"), "primary", commitMore);
-    buttons.appendChild(m.els.primary);
-    row.appendChild(buttons);
-    box.appendChild(row);
-    m.els.alert = el("p", "alert hidden");
-    m.els.alert.setAttribute("role", "alert");
-    box.appendChild(m.els.alert);
-    m.els.box = box;
-    m.els.note = note;
-  }
-
-  // The chips follow the selection, the switch follows the shown design; each is rebuilt only when what it shows changed.
-  function syncMoreBody(m) {
-    var base = moreBase();
-    var likeOn = m.like && !!base;
-    var selected = currentSelected().slice(0, MAX_SELECTED);
-    m.els.toggle.checked = likeOn;
-    m.els.toggle.disabled = !base || m.committing;
-    m.els.switchText.textContent = t("moreBasedOn", { label: base ? base.label : (selectedVersion() ? selectedVersion().label : "") });
-    m.els.switchText.parentNode.title = base ? "" : t("moreLikeUnavailable");
-    m.els.help.textContent = likeOn ? t("moreHelpLike", { label: base.label }) : selected.length > 0 ? t("moreHelpSelected") : t("moreHelpFresh");
-    var shown = base || selectedVersion();
-    var thumbSig = shown ? shown.versionId + ":" + shown.sha256 : "";
-    if (m.thumbSig !== thumbSig) {
-      m.thumbSig = thumbSig;
-      var fresh = el("img", "morethumb empty");
-      fresh.alt = "";
-      m.els.thumb.parentNode.replaceChild(fresh, m.els.thumb);
-      m.els.thumb = fresh;
-      if (shown) {
-        var cached = state.thumbs[imageKey(shown, "thumb")];
-        if (cached) { fresh.src = cached; fresh.classList.remove("empty"); }
-        else bindImage(fresh, shown, "thumb", false);
-      }
-    }
-    var chipSig = JSON.stringify(selected);
-    if (m.chipSig !== chipSig) {
-      m.chipSig = chipSig;
-      m.els.chips.textContent = "";
-      selected.forEach(function (id) {
-        var chip = el("span", "refchip");
-        var img = el("img", "refchipimg empty shimmer");
-        img.alt = "";
-        chip.appendChild(img);
-        bindReference(img, id, "thumb");
-        var remove = button("", "refchipx", function () { toggleRef(id); });
-        remove.setAttribute("aria-label", t("removeReference", { name: refDescription(id) }));
-        remove.title = t("removeReference", { name: refDescription(id) });
-        remove.innerHTML = '<svg viewBox="0 0 24 24" width="12" height="12" fill="none" stroke="currentColor" stroke-width="3" stroke-linecap="round" aria-hidden="true"><path d="M6 6l12 12M18 6L6 18"/></svg>';
-        chip.appendChild(remove);
-        m.els.chips.appendChild(chip);
-      });
-    }
-    m.els.chipsWrap.classList.toggle("hidden", selected.length === 0);
-  }
-
-  // The one way a round starts: the selection is committed first, so the round uses the inspiration the person sees.
   function roundAction(request) {
     var action = { kind: "round", mode: request.mode, count: request.count };
     var note = (request.note || "").trim();
     if (note) action.note = note;
     if (request.mode === "like") action.fromVersionId = request.fromVersionId;
-    return action;
+    return withBrief(action);
   }
   function startRound(opId, request) {
     return whenSelectionSettled().then(function () { return runAction(roundAction(request), opId); });
   }
-
-  function commitMore() {
-    var m = state.more;
-    if (!m || m.committing || moreBusy() || !localImage().ready) return;
-    var base = m.like ? moreBase() : null;
-    m.committing = true;
-    m.error = "";
-    syncMore();
-    startRound(m.id, { mode: base ? "like" : "new", note: m.note, count: m.count, fromVersionId: base ? base.versionId : undefined }).then(function () {
-      m.committing = false;
-      if (state.more === m) closeMore(false);
-      syncMore();
-    }, function (err) {
-      m.committing = false;
-      if (state.more !== m) return;
-      m.error = errText(err);
-      syncMore();
-    });
-  }
-
-  // The tiles follow the view; the panel sits in the host of the current mode, and keeps what was typed across polls and modes.
-  function syncMore() {
-    if (!state.view) return;
-    var m = state.more;
-    if (m && state.view.candidates.length === 0) { m.committing = false; closeMore(false); m = state.more; }
-    var busy = moreBusy();
-    moreTiles().forEach(function (t) {
-      t.disabled = busy;
-      t.setAttribute("aria-expanded", m ? "true" : "false");
-    });
-    if (!m) return;
-    var host = isFullscreen() ? stageEls.more : $("more");
-    if (host && m.els.box.parentNode !== host) {
-      moreHosts().forEach(function (h) { if (h !== host) h.textContent = ""; });
-      host.appendChild(m.els.box);
-    }
-    syncMoreBody(m);
-    var local = localImage();
-    m.els.primary.disabled = m.committing || busy || !local.ready;
-    m.els.alert.textContent = m.error || (!local.ready ? localReason() : "");
-    m.els.alert.classList.toggle("hidden", !m.els.alert.textContent);
-    // Fitted before the size report, so the host never sees the taller card.
-    fitMore();
-    reportSize();
-  }
-  window.addEventListener("resize", function () { if (state.more) { fitMore(); reportSize(); } });
-
-  document.addEventListener("keydown", function (e) {
-    if (e.key !== "Escape" || !state.more || state.dialog || state.more.committing) return;
-    closeMore(true);
-  });
 `;
 //# sourceMappingURL=mcp-slate-ui-script-more.js.map

package/dist/mcp-slate-ui-script-more.js.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-slate-ui-script-more.js","sourceRoot":"","sources":["../src/mcp-slate-ui-script-more.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqQtC,CAAC"}
+{"version":3,"file":"mcp-slate-ui-script-more.js","sourceRoot":"","sources":["../src/mcp-slate-ui-script-more.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;CAiBtC,CAAC"}

package/dist/mcp-slate-ui-script-pause.d.ts

@@ -3,22 +3,26 @@
  * before it is drawn while this screen is in sight. The server owns every rule (workers/api/src/slate/store/pause.ts);
  * this fragment shows the wait and sends the person's two answers.
  *
- * - The pause bar (in the card above the large image, in the workspace above the picture, and in the Inspiration tab
- *   in place of Generate) says "Starting in 42 s. Change any reference, or press Continue." and counts down calmly:
- *   the words change once a second (a timer role, so assistive technology is not told every second) and a thin line
- *   shortens with them, without animation when motion is reduced. Change opens the Inspiration tab; Continue goes on.
+ * - A new wait opens the Inspiration tab (unless the person chose a tab since), with the round's references picked;
+ *   when the wait ends (Continue, or the countdown on the server) the screen moves back to Designs, where the options
+ *   now draw. Moving on to Designs by hand continues the round with the picks (`setTab`).
+ * - In the Inspiration tab the tray carries the countdown ("Starts in 42 s") beside Continue. On Designs (the
+ *   workspace's picture, or the card when the person went there) the pause bar says "Starts in 42 s" beside Change and
+ *   Continue, and counts down calmly: the words change once a second (a timer role, so assistive
+ *   technology is not told every second) and a thin line shortens with them, without animation when motion is
+ *   reduced. Change opens the Inspiration tab; Continue goes on.
  * - Each option of the round shows the reference it will be drawn from, on its tile and in the large image, instead
  *   of the drawing shimmer: nothing is being drawn yet.
  * - Any touch of the screen (a press or click, a key, a wheel or touch scroll of the picker, focus in the search box)
  *   holds the round. A wheel or touch counts only inside the picker's scrolling lists (the Inspiration results, the
  *   workspace's selection): elsewhere, the inline card's large image say, it is the conversation being scrolled past
  *   the card, which must not hold a round nobody then sees. A hold stops the countdown for good and the bar says
- *   "Paused. Press Continue when ready." One hold is sent to the server. A scroll the page makes by itself (a grid
+ *   "Paused". One hold is sent to the server. A scroll the page makes by itself (a grid
  *   laid out again) is not a touch, so `scroll` is not listened to; the person's scrolling arrives as a wheel, a touch
  *   or a key.
  * - In the Inspiration tab the round's references are the round's own list until the person changes it: a tile there
  *   adds or removes a reference (at most one per option), and Continue sends the list when it differs, which the
- *   server gives the options in order.
+ *   server gives the options in order, and the design prompt when the person edited it.
  * - A round that awaits a screen (`awaiting`, recorded before this screen existed) is seen at once with one status
  *   call, which starts its countdown on the server.
  *

package/dist/mcp-slate-ui-script-pause.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-slate-ui-script-pause.d.ts","sourceRoot":"","sources":["../src/mcp-slate-ui-script-pause.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,cAAc,QA4K1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,QAY7B,CAAC"}
+{"version":3,"file":"mcp-slate-ui-script-pause.d.ts","sourceRoot":"","sources":["../src/mcp-slate-ui-script-pause.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,cAAc,QAuL1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,iBAAiB,QAY7B,CAAC"}

package/dist/mcp-slate-ui-script-pause.js

@@ -3,22 +3,26 @@
  * before it is drawn while this screen is in sight. The server owns every rule (workers/api/src/slate/store/pause.ts);
  * this fragment shows the wait and sends the person's two answers.
  *
- * - The pause bar (in the card above the large image, in the workspace above the picture, and in the Inspiration tab
- *   in place of Generate) says "Starting in 42 s. Change any reference, or press Continue." and counts down calmly:
- *   the words change once a second (a timer role, so assistive technology is not told every second) and a thin line
- *   shortens with them, without animation when motion is reduced. Change opens the Inspiration tab; Continue goes on.
+ * - A new wait opens the Inspiration tab (unless the person chose a tab since), with the round's references picked;
+ *   when the wait ends (Continue, or the countdown on the server) the screen moves back to Designs, where the options
+ *   now draw. Moving on to Designs by hand continues the round with the picks (`setTab`).
+ * - In the Inspiration tab the tray carries the countdown ("Starts in 42 s") beside Continue. On Designs (the
+ *   workspace's picture, or the card when the person went there) the pause bar says "Starts in 42 s" beside Change and
+ *   Continue, and counts down calmly: the words change once a second (a timer role, so assistive
+ *   technology is not told every second) and a thin line shortens with them, without animation when motion is
+ *   reduced. Change opens the Inspiration tab; Continue goes on.
  * - Each option of the round shows the reference it will be drawn from, on its tile and in the large image, instead
  *   of the drawing shimmer: nothing is being drawn yet.
  * - Any touch of the screen (a press or click, a key, a wheel or touch scroll of the picker, focus in the search box)
  *   holds the round. A wheel or touch counts only inside the picker's scrolling lists (the Inspiration results, the
  *   workspace's selection): elsewhere, the inline card's large image say, it is the conversation being scrolled past
  *   the card, which must not hold a round nobody then sees. A hold stops the countdown for good and the bar says
- *   "Paused. Press Continue when ready." One hold is sent to the server. A scroll the page makes by itself (a grid
+ *   "Paused". One hold is sent to the server. A scroll the page makes by itself (a grid
  *   laid out again) is not a touch, so `scroll` is not listened to; the person's scrolling arrives as a wheel, a touch
  *   or a key.
  * - In the Inspiration tab the round's references are the round's own list until the person changes it: a tile there
  *   adds or removes a reference (at most one per option), and Continue sends the list when it differs, which the
- *   server gives the options in order.
+ *   server gives the options in order, and the design prompt when the person edited it.
  * - A round that awaits a screen (`awaiting`, recorded before this screen existed) is seen at once with one status
  *   call, which starts its countdown on the server.
  *
@@ -27,7 +31,7 @@
 export const SLATE_UI_PAUSE = String.raw `
   var PAUSE_COUNTDOWN_MS = 60000;
   var PAUSE_TICK_MS = 1000;
-  var pause = { opId: null, roundId: null, endsAt: 0, held: false, chosen: null, sending: false, error: "", timer: null, asked: false, sighted: false };
+  var pause = { opId: null, roundId: null, endsAt: 0, held: false, chosen: null, sending: false, error: "", timer: null, asked: false, sighted: false, autoTab: false };
   function pauseClock() { return typeof performance !== "undefined" && performance.now ? performance.now() : Date.now(); }
 
   function waitingRound() {
@@ -49,6 +53,9 @@ export const SLATE_UI_PAUSE = String.raw `
       endPause();
       pause.opId = op.opId;
       pause.roundId = round.roundId;
+      // The person chooses the references of a waiting round in Inspiration: it opens there (no event, so no hold).
+      if (state.tab !== "inspiration") { state.tab = "inspiration"; syncTabs(); }
+      pause.autoTab = true;
     }
     if (round.pause.state === "held") pause.held = true;
     else if (!pause.held && round.pause.state === "countdown") { pause.endsAt = pauseClock() + round.pause.remainingMs; pause.asked = false; }
@@ -60,7 +67,9 @@ export const SLATE_UI_PAUSE = String.raw `
   }
   function endPause() {
     if (pause.timer !== null) clearInterval(pause.timer);
-    pause = { opId: null, roundId: null, endsAt: 0, held: false, chosen: null, sending: false, error: "", timer: null, asked: false, sighted: false };
+    // The wait is over and the options draw: show them, unless the person chose a tab of their own meanwhile.
+    if (pause.opId && pause.autoTab && state.tab === "inspiration") { state.tab = "designs"; syncTabs(); }
+    pause = { opId: null, roundId: null, endsAt: 0, held: false, chosen: null, sending: false, error: "", timer: null, asked: false, sighted: false, autoTab: false };
   }
   function pauseLeftMs() { return Math.max(0, pause.endsAt - pauseClock()); }
   function pauseText() {
@@ -68,7 +77,7 @@ export const SLATE_UI_PAUSE = String.raw `
     if (pause.sending) return t("pauseStarting");
     if (pause.held) return t("pauseHeld");
     var left = Math.ceil(pauseLeftMs() / 1000);
-    return left > 0 ? t("pauseCountdown", { n: left }) : t("pauseStarting");
+    return left > 0 ? t("startsIn", { n: left }) : t("pauseStarting");
   }
   function tickPause() {
     if (!pause.opId) return;
@@ -77,16 +86,22 @@ export const SLATE_UI_PAUSE = String.raw `
   }
   function syncPauseBars() {
     var words = pauseText();
+    var left = Math.ceil(pauseLeftMs() / 1000);
+    // The tray's clock: the seconds left, nothing once held, and "Starting." when the round goes.
+    var clock = pause.error ? pause.error : pause.sending || (!pause.held && left <= 0) ? t("pauseStarting") : pause.held ? "" : t("startsIn", { n: left });
+    var clocks = document.querySelectorAll("[data-pause-clock]");
+    for (var c = 0; c < clocks.length; c++) if (clocks[c].textContent !== clock) clocks[c].textContent = clock;
     var share = pause.held ? 0 : pauseLeftMs() / PAUSE_COUNTDOWN_MS;
-    var nodes = document.querySelectorAll("[data-pause-text]");
-    for (var i = 0; i < nodes.length; i++) if (nodes[i].textContent !== words) nodes[i].textContent = words;
-    var lines = document.querySelectorAll(".pauseline > span");
-    for (var j = 0; j < lines.length; j++) lines[j].style.transform = "scaleX(" + (Math.round(share * 1000) / 1000) + ")";
-    var lineBoxes = document.querySelectorAll(".pauseline");
-    for (var k = 0; k < lineBoxes.length; k++) lineBoxes[k].classList.toggle("hidden", pause.held || pause.sending);
-    var goes = document.querySelectorAll("[data-continue]");
-    for (var m = 0; m < goes.length; m++) goes[m].disabled = pause.sending || pauseChosen().length === 0;
+    // Only the bars themselves are walked, never the whole document: this runs every second while a round waits.
+    pauseBoxes = pauseBoxes.filter(function (box) { return box.isConnected !== false; });
+    pauseBoxes.forEach(function (box) {
+      if (box.__words.textContent !== words) box.__words.textContent = words;
+      box.__line.firstChild.style.transform = "scaleX(" + (Math.round(share * 1000) / 1000) + ")";
+      box.__line.classList.toggle("hidden", pause.held || pause.sending);
+      box.__go.disabled = pause.sending || pauseChosen().length === 0;
+    });
   }
+  var pauseBoxes = [];
 
   function pauseChosen() {
     if (pause.chosen) return pause.chosen;
@@ -105,7 +120,7 @@ export const SLATE_UI_PAUSE = String.raw `
       if (cur.length >= round.count) { setInspStatus(t("pauseAtMost", { n: round.count }), ""); return; }
       cur.push(id);
     }
-    setInspStatus(cur.length === 0 ? t("pauseNone") : "", "");
+    setInspStatus("", "");
     pause.chosen = cur;
     renderAll();
   }
@@ -129,14 +144,17 @@ export const SLATE_UI_PAUSE = String.raw `
   }
   function continuePause() {
     if (!pause.opId || pause.sending || pauseChosen().length === 0) return;
-    var action = { kind: "continue" };
+    var action = withBrief({ kind: "continue" });
     if (pauseChanged()) action.referenceIds = pause.chosen.slice();
     pause.sending = true;
     pause.error = "";
     syncPauseBars();
-    callTool(TOOLS.run, { runDir: state.view.runDir, opId: pause.opId, action: action }).then(function (result) {
+    var opId = pause.opId;
+    callTool(TOOLS.run, { runDir: state.view.runDir, opId: opId, action: action }).then(function (result) {
       var sc = result.structuredContent || {};
       if (sc.view) applyView(sc.view, true);
+      // The workspace runner draws the round now; the agent is told only if no runner has taken it after its grace.
+      if (TARGET === "remote") remoteAfterRun({ kind: "continue" }, opId, { alive: true });
     }, function (err) {
       pause.sending = false;
       pause.error = errText(err);
@@ -145,7 +163,7 @@ export const SLATE_UI_PAUSE = String.raw `
   }
   // A wheel or a touch counts only where it scrolls the picker: the Inspiration results and the workspace's
   // selection. Anywhere else (the card's large image, say) it is the person scrolling the conversation past the card.
-  var PICKER_SCROLLERS = ".results, .rail";
+  var PICKER_SCROLLERS = ".results, #stage .designs";
   function onScreenTouch(e) {
     if (!pause.opId || pause.held || pause.sending) return;
     var t = e.target;
@@ -177,6 +195,10 @@ export const SLATE_UI_PAUSE = String.raw `
     line.setAttribute("aria-hidden", "true");
     line.appendChild(el("span"));
     bar.appendChild(line);
+    bar.__words = words;
+    bar.__line = line;
+    bar.__go = go;
+    pauseBoxes.push(bar);
     return bar;
   }
   function syncPauseHost(host, withChange) {
@@ -189,21 +211,15 @@ export const SLATE_UI_PAUSE = String.raw `
       if (pause.opId) host.appendChild(pauseBar(withChange));
     }
   }
-  function pauseChoiceText() {
-    var round = pauseRound();
-    var chosen = pauseChosen();
-    if (!round) return "";
-    if (chosen.length === 0) return t("pauseNone");
-    return t("pauseFrom", { n: round.count, m: chosen.length });
-  }
 `;
 /**
  * The local plugin's and the browser page's screens: their views never carry `rounds[].pause` (only the hosted server
  * pauses), so the same names answer that nothing waits, and the document does not carry the pause's code.
  */
 export const SLATE_UI_NO_PAUSE = String.raw `
-  var pause = { opId: null };
+  var pause = { opId: null, autoTab: false };
   function pauseActive() { return false; }
+  function continuePause() {}
   function pauseRound() { return null; }
   function pauseChosen() { return []; }
   function pausedFor() { return false; }
@@ -212,6 +228,5 @@ export const SLATE_UI_NO_PAUSE = String.raw `
   function syncPause() {}
   function syncPauseBars() {}
   function syncPauseHost(host) { if (host) host.classList.add("hidden"); }
-  function pauseChoiceText() { return ""; }
 `;
 //# sourceMappingURL=mcp-slate-ui-script-pause.js.map

package/dist/mcp-slate-ui-script-pause.js.map

@@ -1 +1 @@
-{"version":3,"file":"mcp-slate-ui-script-pause.js","sourceRoot":"","sources":["../src/mcp-slate-ui-script-pause.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4KvC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;CAY1C,CAAC"}
+{"version":3,"file":"mcp-slate-ui-script-pause.js","sourceRoot":"","sources":["../src/mcp-slate-ui-script-pause.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuLvC,CAAC;AAEF;;;GAGG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;CAY1C,CAAC"}

package/dist/mcp-slate-ui-script-references.d.ts

@@ -0,0 +1,19 @@
+/**
+ * The References tab: live screenshots of real, relevant websites (`view.sites`), gathered by the person's own agents
+ * and captured by the 12ui command line while a round waits on them. It is the Inspiration tab's gallery, large view
+ * and tray (mcp-slate-ui-script-inspiration-gallery.ts, mcp-slate-ui-script-inspiration-grid.ts) over the sites:
+ *
+ * - The sites arrive one by one while the tab is open (the status poll brings each, or the tab's own short watch below)
+ *   and join the end of the grid; nothing already shown moves.
+ * - A click selects or deselects a site exactly like an Inspiration reference (`toggleRef`: the selection for the next
+ *   round, or, while a round waits on the person, that round's references), with the same ring, check and tray.
+ * - The large view adds Open site, which opens the live page through the host.
+ * - Pictures load straight from their URLs (`imageUrl`, `thumbUrl`); where a server gives none (the local plugin) they
+ *   come through the reference tool like any reference.
+ * - Nothing yet: one short line, "Finding sites…" only while gathering is possible (the gather window is open and a
+ *   runner or the draw command holds a running round), else "No websites".
+ *
+ * Fragment of the view's script; String.raw, no backtick, no dollar-brace.
+ */
+export declare const SLATE_UI_REFERENCES: string;
+//# sourceMappingURL=mcp-slate-ui-script-references.d.ts.map

package/dist/mcp-slate-ui-script-references.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mcp-slate-ui-script-references.d.ts","sourceRoot":"","sources":["../src/mcp-slate-ui-script-references.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,mBAAmB,QAmF/B,CAAC"}