samagotchi 0.147.0 → 0.149.0

data/lib/samagotchi/web/message_display.rb

@@ -7,6 +7,7 @@ require_relative "../context_note"
 require_relative "../image_store"
 require_relative "../message_parts"
 require_relative "../message_time"
+require_relative "../objectives"
 require_relative "../output_formatter"
 require_relative "../recap_store"
 require_relative "../ref"
@@ -95,11 +96,19 @@ module Samagotchi
         list = Array(msgs)
         # The outputs' ✂ marks (LLM context edits), by id, for the parts.
         marks = parts ? MessageParts.edit_marks(list) : {}
+        # The list before each objectives note, for what its entry says changed.
+        objectives = nil
         list.each_with_index do |m, index|
           role = (m[:role] || m["role"]).to_s
           content = (m[:content] || m["content"]).to_s
           if Samagotchi::ContextNote.note?(m)
             note = { role: "note", content: Samagotchi::ContextNote.text_of(m), label: Samagotchi::ContextNote.label_of(m), **time_of(m) }
+            payload = Samagotchi::ContextNote.fetch(m, :objectives)
+            entry = payload && Samagotchi::Objectives.entry(payload, before: objectives)
+            if entry
+              note[:objectives] = entry
+              objectives = Samagotchi::Objectives.from_payload(payload)
+            end
             # A context wake turn's note starts that turn (Steer.turn_prompt?):
             # the page opens the turn with it and pairs it with its record.
             if Samagotchi::Steer.turn_prompt?(m)

data/lib/samagotchi/web/participant_view.rb

@@ -82,7 +82,7 @@ module Samagotchi
         after_generation after_tool_call after_turn answer_display before_generation before_tool_call before_turn
         card command_output command_queued command_ran context_added context_status empty_answer_retry
         generation_cancelled generation_completed generation_progress generation_started guardrail_warning hook_notice
-        llm_context_edited merged_input participants_changed pending_input_merged plugin_init_finished
+        llm_context_edited merged_input objectives_updated participants_changed pending_input_merged plugin_init_finished
         plugin_init_started plugin_init_wait prompt_restored question question_relay reasoning_history_refused
         recap_ready reminder_injected sampling_refused session_end session_start side_usage steer_cut thinking_dropped
         thinking_refused tool_dispatch_completed tool_dispatch_started used_memories_updated working_set_updated

data/lib/samagotchi/web/public/app.js

@@ -54,6 +54,7 @@ import { createBubbles, hintEl, outputBubbleTemplate } from "./bubbles.js";
 import { createCardsPlace } from "./cards_place.js";
 import { createStageView } from "./stage_view.js";
 import { createWorkingSet, groupItems } from "./working_set_view.js";
+import { createObjectives } from "./objectives_wiring.js";
 import { turnGroups } from "./timing.js";
 import { createGapClock, lastActivity } from "./time_gaps.js";
 import { createMarkdownPlace } from "./markdown_place.js";
@@ -421,6 +422,10 @@ const deliveryControl = createDeliveryControl({
 // This tab's id in the session's events: tells its own prompts from the
 // ones other clients (an attached TUI, another tab, reminders) sent.
 const clientId = newClientId();
+const objectives = createObjectives({
+  el: $("#objectivesStrip"), historyEl, session: () => store.selected, running: () => liveTurn.running, holding: () => turnDom.holds(), commands: () => store.current.commands,
+  clientId, sendCommand, sendTurn, follow: () => followWokenWorker(), toast: (...args) => showToast(...args),
+});
 // The question and continue cards in the history (question_cards.js).
 const questionCards = createQuestionCards({
   sessionId: () => store.selected,
@@ -1017,6 +1022,7 @@ function forgetSession({ keepVerify = false } = {}) {
   });
   commandList.close();
   resetTurnView();
+  objectives.reset();
   seedInitTasks(initTasks, []);
   renderInitRow();
   setMarkdownWarning(null);
@@ -1178,6 +1184,7 @@ function renderSessionView(data, { kept = [] } = {}) {
   if (data.messages && data.messages.length) renderHistory(data.messages);
   else renderHistory(data.history || []);
   seedWorkingSet(data);
+  objectives.seed(data.objectives);
   restoreCommandBubbles(historyEl, kept);
   // A failed turn's prompt went back to the user: shown after the
   // conversation, marked failed, as it was live (prompt_restored).
@@ -1761,6 +1768,8 @@ const streamHandlers = createStreamHandlers({
   // cards_place.js
   upsertCard, refreshCardBodies,
   syncModelPick: startPage.commandRan,
+  objectivesUpdated: (data) => objectives.update(data),
+  cardActionFailed: cards.actionFailed,
 });
 
 async function refreshTimingFromSession() {
@@ -2204,6 +2213,7 @@ store.on("settingsPanel", () => settingsControl.refresh());
 store.on("workingSetStrategy", () => workingSet?.strategyChanged());
 store.on("featureGates", () => featureGates.check(store.current));
 store.on("composer", updateComposerMode);
+store.on("composer", () => objectives.redraw());
 // The answers' Revise buttons follow liveTurn.running too (none on the
 // running turn's answer), which touches the composer.
 store.on("composer", () => reviseStacks.decorate());

data/lib/samagotchi/web/public/cards_place.js

@@ -48,6 +48,8 @@ export function turnAnswerEl(turnEls) {
 // @param api {getSession, sendCommand} (data.js)
 // @return {cardElement(id), upsertCard(card, {before}), placeSnapshotCards(entries),
 //   refreshCardBodies(), onCardAction(event)}
+const HELD_UNTIL_ANSWERED = /^\/objectives --card /;
+
 export function createCardsPlace({
   historyEl, turnDom, findInTurnRoots, selected, clientId, questionCards, bubbles,
   followWokenWorker, api = { getSession, sendCommand },
@@ -162,7 +164,18 @@ export function createCardsPlace({
     }, 150);
   }
 
-  // A card's action button (a click anywhere in the turn roots).
+  // Its command line's card is back in play: the worker refused the action.
+  function actionFailed(line) {
+    for (const button of findInTurnRoots(".plugin-card .card-action")) {
+      if (button.dataset.command === line) {
+        button.closest(".plugin-card").querySelectorAll(".card-action").forEach((b) => { b.disabled = false; });
+      }
+    }
+  }
+
+  // A card's action button (a click anywhere in the turn roots). A proposal
+  // card's buttons stay off until its folded card replaces them or the
+  // action fails (actionFailed): a second tap has nothing to do.
   function onCardAction(e) {
     const button = e.target.closest(".plugin-card .card-action");
     const id = selected();
@@ -170,7 +183,9 @@ export function createCardsPlace({
     const card = button.closest(".plugin-card");
     const err = card.querySelector(".card-error");
     err.classList.add("hidden");
-    button.disabled = true;
+    const held = HELD_UNTIL_ANSWERED.test(button.dataset.command);
+    const off = held ? [...card.querySelectorAll(".card-action")] : [button];
+    off.forEach((b) => { b.disabled = true; });
     api.sendCommand(id, button.dataset.command, { clientId, card: true })
       .then(() => {
         // The command woke the worker: follow its stream if none is open
@@ -180,9 +195,10 @@ export function createCardsPlace({
       .catch((error) => {
         err.textContent = error.message;
         err.classList.remove("hidden");
+        off.forEach((b) => { b.disabled = false; });
       })
-      .finally(() => { button.disabled = false; });
+      .finally(() => { if (!held) button.disabled = false; });
   }
 
-  return { cardElement, upsertCard, placeSnapshotCards, refreshCardBodies, onCardAction };
+  return { cardElement, upsertCard, placeSnapshotCards, refreshCardBodies, onCardAction, actionFailed };
 }

data/lib/samagotchi/web/public/commands.js

@@ -163,6 +163,8 @@ export function continueLine(choice, reason = "") {
 const QUEUED_TEXT = "queued: runs after this turn";
 const APPLY_TEXT = "Apply (restarts the cache)";
 
+const OBJECTIVES_LINE = /^\/objectives\b/;
+
 export function commandView(event, myId) {
   const own = isOwn(event.client_id, myId);
   const waiting = event.waits === "turn_end";
@@ -181,7 +183,8 @@ export function commandView(event, myId) {
     commandId: event.command_id || null,
     confirm: typeof event.confirm?.line === "string" ? event.confirm.line : null,
     // A card's action (Nudge…): no bubble unless it says something back.
-    hidden: event.card === true && !event.output && event.status !== "error",
+    // A tap's /objectives edit: the strip and the entry are its answer.
+    hidden: event.card === true && event.status !== "error" && (!event.output || OBJECTIVES_LINE.test(event.line || "")),
   };
 }
 

data/lib/samagotchi/web/public/index.html

@@ -14,6 +14,7 @@
 <link rel="stylesheet" href="/assets/annotate_bar.css">
 <link rel="stylesheet" href="/assets/composer.css">
 <link rel="stylesheet" href="/assets/forms.css">
+<link rel="stylesheet" href="/assets/objectives.css">
 <style>
 /* Icon masks shared by the phone info bar and the all view's cards (the stroke only shapes the mask; the icon takes currentColor); the image icon is composer.css's. */
 :root{--icon-archive:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='2.75' width='12' height='3.5' rx='1'/%3E%3Cpath d='M3.25 6.25v6a1 1 0 0 0 1 1h7.5a1 1 0 0 0 1-1v-6M6.5 9h3'/%3E%3C/svg%3E");--icon-unarchive:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2' y='2.75' width='12' height='3.5' rx='1'/%3E%3Cpath d='M3.25 6.25v6a1 1 0 0 0 1 1h7.5a1 1 0 0 0 1-1v-6M8 11.5V8.25M6.5 9.75 8 8.25l1.5 1.5'/%3E%3C/svg%3E")}
@@ -1788,6 +1789,7 @@ a{color:var(--accent)}
     <div id="stage">
       <div id="markdownWarning" class="markdown-warning" hidden></div>
       <div id="markdownTip" class="markdown-tip" hidden><span class="markdown-tip-text"></span><button type="button" class="markdown-tip-close" aria-label="Dismiss tip" title="Dismiss tip">×</button></div>
+      <div id="objectivesStrip" hidden></div>
       <div id="history"></div>
       <div id="empty"></div>
       <div id="notice" role="status" hidden></div>

data/lib/samagotchi/web/public/objectives.css

@@ -0,0 +1,80 @@
+/* The session's objectives (objectives_strip.js, objectives_entry.js). Colours are tokens.css's only. */
+#objectivesStrip{flex:none;padding:6px max(16px,calc((100% - 960px)/2));border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--bg-panel) 60%,transparent)}
+#objectivesStrip[hidden]{display:none}
+.obj-strip{display:flex;align-items:center;gap:8px;min-height:32px}
+.obj-chips{display:flex;flex-wrap:wrap;gap:6px;min-width:0;flex:1}
+.obj-chip{display:inline-flex;align-items:baseline;gap:6px;max-width:280px;min-width:0;padding:3px 10px;border-radius:999px;border:1px solid var(--accent-border);background:var(--accent-bg);color:var(--text-2);font-size:13px;line-height:1.4}
+.obj-chip.done{background:transparent;border-color:var(--border-strong);color:var(--text-muted)}
+.obj-id{flex:none;font:700 12px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--accent)}
+.obj-chip.done .obj-id{color:var(--text-muted)}
+.obj-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
+.obj-count{flex:none;color:var(--text-muted);font-size:12px;font-variant-numeric:tabular-nums}
+/* An objectives note in the conversation: pills for a list, a line for an edit. */
+.bubble.note.objectives-entry{display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:transparent;border:0;padding:2px 0;white-space:normal}
+.obj-entry-label{color:var(--text-muted);font-size:12px;margin-right:2px}
+.obj-pill{display:inline-block;padding:2px 10px;border-radius:999px;border:1px solid var(--accent-border);background:var(--accent-bg);color:var(--text-2);font-size:13px;line-height:1.45}
+.obj-pill.done{background:transparent;border-color:var(--border-strong);color:var(--text-muted)}
+.bubble.note.objectives-entry.change{flex-wrap:nowrap;gap:10px;color:var(--text-muted);font-size:13px}
+.obj-rule{flex:1 1 16px;min-width:16px;height:1px;background:var(--border-strong)}
+.obj-change{min-width:0;text-align:center;overflow-wrap:anywhere}
+/* The strip's chips open the edit list. */
+button.obj-chip{cursor:pointer;font:inherit;font-size:13px;line-height:1.4;text-align:left}
+@media(hover:hover){button.obj-chip:hover:not(:disabled){filter:none;border-color:var(--accent)}}
+.obj-edit{flex:none;background:transparent;color:var(--text-muted);padding:3px 8px;font-size:12px}
+@media(hover:hover){.obj-edit:hover:not(:disabled){filter:none;color:var(--text-bright)}}
+.obj-waiting{flex:none;color:var(--warn-text);font-size:12px}
+/* The edit list (chip_popover.js's shell, .ctx-popover; a bottom sheet on a phone). */
+.obj-panel{display:flex;flex-direction:column;gap:10px;overflow:auto}
+.obj-rows{display:flex;flex-direction:column;gap:2px}
+.obj-row{display:flex;align-items:flex-start;gap:8px;padding:6px 0;border-top:1px solid var(--border)}
+.obj-row:first-child{border-top:0}
+.obj-row .obj-id{padding-top:3px}
+.obj-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
+.obj-row-text{display:block;width:100%;padding:2px 0;background:transparent;color:var(--text);text-align:left;font-size:14px;line-height:1.4;border-radius:4px;white-space:normal;overflow-wrap:anywhere}
+@media(hover:hover){.obj-row-text:hover:not(:disabled){filter:none;text-decoration:underline dotted var(--text-muted)}}
+.obj-row.done .obj-row-text{color:var(--text-muted)}
+.obj-row.dropped .obj-row-text{color:var(--text-faint);text-decoration:line-through}
+.obj-row.done .obj-id,.obj-row.dropped .obj-id{color:var(--text-muted)}
+.obj-row-sub{display:flex;flex-direction:column;gap:1px;color:var(--text-muted);font-size:12px;overflow-wrap:anywhere}
+.obj-row-acts{flex:none;display:flex;gap:4px}
+.obj-check.refuted{color:var(--warn-text)}
+.obj-check.confirmed{color:var(--text-2)}
+.obj-act{padding:3px 10px;font-size:12px;border-radius:6px}
+.obj-act.ghost{background:var(--bg-raised);color:var(--text-2)}
+form.obj-row{align-items:center}
+.obj-input{flex:1;min-width:0;padding:5px 8px;border-radius:6px;border:1px solid var(--border-strong);background:var(--bg-inset);color:var(--text);font-size:14px}
+.obj-add{display:flex;gap:6px;align-items:center}
+.obj-note{color:var(--text-muted);font-size:12px}
+/* A phone: one line, the objective being worked on and how far along, and the whole list a tap away in a bottom sheet (chip_popover.js), never pushing the conversation down. */
+@media(max-width:600px){
+  #objectivesStrip{padding:4px 12px}
+  .obj-strip{min-height:36px}
+  .obj-chips{flex-wrap:nowrap}
+  .obj-chip:not(.first){display:none}
+  .obj-chip.first{flex:1;max-width:none;min-height:36px;align-items:center;border-radius:10px}
+  .obj-edit{padding:8px;min-height:36px}
+  .obj-waiting{max-width:90px;font-size:11px;line-height:1.2}
+  .obj-pill{font-size:12.5px}
+  .bubble.note.objectives-entry.change{font-size:12.5px;gap:6px}
+}
+.obj-panel.sheet{font-size:15px;max-height:85dvh}
+.obj-panel.sheet .obj-row{align-items:flex-start;flex-wrap:wrap;padding:8px 0}
+.obj-panel.sheet form.obj-row{align-items:center;flex-wrap:nowrap}
+/* The text keeps the row's width and the buttons get their own line: a phone reads a reason. */
+.obj-panel.sheet .obj-row-main{flex:1 1 calc(100% - 40px)}
+.obj-panel.sheet .obj-row-text{font-size:15px;min-height:32px}
+.obj-panel.sheet .obj-row-acts{flex:1 1 100%;flex-wrap:wrap;justify-content:flex-end;gap:6px}
+.obj-panel.sheet .obj-act{min-height:44px;min-width:56px;padding:0 8px;font-size:14px;border-radius:10px}
+.obj-panel.sheet .obj-input{min-height:44px;font-size:16px;border-radius:10px}
+.obj-panel.sheet .obj-note{font-size:12px}
+@media (prefers-reduced-motion:reduce){.obj-chip,.obj-act{transition:none}}
+/* A move: a turn's line above its answer, a tool row's chip, a decision card's "Concerns". */
+.obj-pill.obj-mark{padding:0 7px;font:700 11.5px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--accent)}
+.obj-moves{display:flex;flex-direction:column;gap:2px;margin-bottom:-4px;font-size:13px}
+.obj-move-line{display:flex;align-items:baseline;gap:8px;color:var(--text-2);flex-wrap:wrap}
+.obj-move-note{min-width:0;flex:1 1 200px;overflow-wrap:anywhere}
+.obj-concerns .obj-pill{margin-right:4px}
+.obj-notyet{flex:none}
+.obj-moves:not(.newest) .obj-notyet{display:none}
+@media (pointer:coarse){.obj-notyet{min-height:36px}}
+.obj-short{display:flex;justify-content:flex-end;margin-top:-6px}

data/lib/samagotchi/web/public/objectives_entry.js

@@ -0,0 +1,22 @@
+// An objectives note in the conversation, in place of the plain note bubble
+// (turn_html.js noteBubbleTemplate): the list as pills, or, for a later edit, one
+// line saying what the user changed. Read-only: the strip above the history is
+// where the list is edited (objectives_strip.js). The raw note text stays the
+// tooltip. A module of its own: static JS is cached at unversioned URLs.
+import { html, nothing } from "./vendor/lit-html.js";
+import { DROPPED, entryLine } from "./objectives_model.js";
+
+function pill(item) {
+  const klass = `obj-pill ${item.status}`;
+  return html`<span class=${klass} title=${item.done_when ? `done when: ${item.done_when}` : nothing}><span class="obj-id">${item.id}</span> ${item.status === "done" ? "✓ " : ""}${item.text}</span>`;
+}
+
+export function objectivesEntryTemplate(note, timeTitle = "") {
+  const line = entryLine(note.objectives);
+  const tip = [timeTitle, note.content].filter(Boolean).join("\n");
+  if (line) {
+    return html`<div class="bubble note objectives-entry change" title=${tip}><span class="obj-rule" aria-hidden="true"></span><span class="obj-change">${line}</span><span class="obj-rule" aria-hidden="true"></span></div>`;
+  }
+  const items = (note.objectives?.items || []).filter((i) => i.status !== DROPPED);
+  return html`<div class="bubble note objectives-entry" title=${tip}><span class="obj-entry-label">Objectives</span>${items.map(pill)}</div>`;
+}

data/lib/samagotchi/web/public/objectives_model.js

@@ -0,0 +1,100 @@
+// The session's objectives as the page reads them (pure, no DOM): the fold the
+// server sends (Objectives.view: {items: [{id, text, status, done_when?,
+// move?, check?}], pending}) and what a list note's entry says (Objectives.entry:
+// {items, changes?}). See docs/internals/objectives.md.
+
+export const ACTIVE = "active";
+export const DONE = "done";
+export const DROPPED = "dropped";
+
+const itemsOf = (list) => (Array.isArray(list?.items) ? list.items : []);
+
+// The objectives the strip shows: active first, then done; a dropped one only
+// in the edit list.
+export function stripItems(list) {
+  const items = itemsOf(list);
+  return [...items.filter((i) => i.status === ACTIVE), ...items.filter((i) => i.status === DONE)];
+}
+
+// Done of the ones still meant (a dropped one doesn't count).
+export function progress(list) {
+  const kept = itemsOf(list).filter((i) => i.status !== DROPPED);
+  return { done: kept.filter((i) => i.status === DONE).length, total: kept.length };
+}
+
+// The one objective a one-line strip names: the first still active, else the
+// last one done.
+export function headline(list) {
+  const items = stripItems(list);
+  return items.find((i) => i.status === ACTIVE) || items[items.length - 1] || null;
+}
+
+// One change as words after "You": "marked O2 done", "reworded O3: old → new".
+export function changeText(change) {
+  const { id, kind, text, was } = change || {};
+  switch (kind) {
+    case "added": return `added ${id} ${text}`;
+    case "reworded": return `reworded ${id}: ${was} → ${text}`;
+    case DONE: return `marked ${id} done`;
+    case DROPPED: return `dropped ${id} ${text}`;
+    case "reopened": return `reopened ${id}`;
+    default: return String(id ?? "");
+  }
+}
+
+// An entry's line: what the user did, or null when it has nothing to say (a
+// first list, a list sent again), which then shows the list itself.
+export function entryLine(entry) {
+  const changes = Array.isArray(entry?.changes) ? entry.changes : [];
+  return changes.length ? `You ${changes.map(changeText).join(" · ")}` : null;
+}
+
+// The one route to an edit: the lines /objectives takes (ObjectivesCommand).
+const oneLine = (text) => String(text ?? "").replace(/\s+/g, " ").trim();
+export const markLine = (verb, id) => `/objectives ${verb} ${id}`;
+export const addLine = (text) => (oneLine(text) ? `/objectives add ${oneLine(text)}` : null);
+export const rewordLine = (id, text) => (oneLine(text) ? `/objectives edit ${id} ${oneLine(text)}` : null);
+
+// An item's text as the edit box shows it: the form /objectives reads back.
+export function editableText(item) {
+  return item?.done_when ? `${item.text} (done when: ${item.done_when})` : String(item?.text ?? "");
+}
+
+// What the strip says about an edit waiting for the running turn's end. Idle,
+// it lands in a moment and says nothing.
+export function pendingText(list, running) {
+  return list?.pending && running ? "Applies after this turn" : null;
+}
+
+// A check's line in the list: its verdict and reason, or that it runs. Information
+// only (ObjectivesCheck). null: no check of the latest move.
+export function checkText(check) {
+  if (!check) return null;
+  if (check.running) return "Checking…";
+  const word = check.verdict === "no_answer" ? "no answer" : check.verdict;
+  return `Check: ${word}${check.reason ? ` — ${check.reason}` : ""}`;
+}
+
+// When the soonest running check runs out, in ms; null with none. No event says so
+// when its worker dies.
+export function nextExpiry(list) {
+  const times = itemsOf(list).filter((i) => i.check?.running && i.check.until).map((i) => Date.parse(i.check.until)).filter(Number.isFinite);
+  return times.length ? Math.min(...times) : null;
+}
+
+// +list+ without the running checks past their time.
+export function expireChecks(list, now) {
+  if (!list) return list;
+  const gone = (i) => i.check?.running && Date.parse(i.check.until) <= now;
+  if (!itemsOf(list).some(gone)) return list;
+  return { ...list, items: list.items.map((i) => {
+    if (!gone(i)) return i;
+    const { check: _gone, ...rest } = i;
+    return rest;
+  }) };
+}
+
+// What a tap on Not yet tells the agent: a normal message, as if typed.
+export function notYetText(item) {
+  return `Not yet on ${item.id} (${item.text}).`;
+}

data/lib/samagotchi/web/public/objectives_moves.js

@@ -0,0 +1,145 @@
+// The model's moves on the objectives, as chips in the conversation. A tool row
+// of the objectives tool shows its id as a chip (moveRowText, turn_html.js, live
+// and reloaded alike), but a finished turn's steps collapse, so a finished turn
+// also gets a line of its moves between its block and its answer (mockup G). The
+// rows are the record: one observer on the history reads them back, as
+// answer_fold.js decorates its answers, so every path that fills it is covered.
+// Nothing is drawn for a turn with no move. A decision-card's "Concerns O2" gets
+// the same chip. The newest long answer of a session with a list offers its
+// short version where the bundle's /short is there (decision-card): the card
+// lands under it, so the button sits there too. A module of its own: static JS is cached at unversioned URLs.
+import { foldable } from "./answer_fold.js";
+import { keepFollowing } from "./scroll.js";
+import { html, nothing, render } from "./vendor/lit-html.js";
+
+const ROW_TITLE = /^(O\d+)\s+([^]*)$/;
+const RECORDED = /Recorded a move on /;
+const CONCERNS = /^Concerns (O\d+)\b/;
+
+// A row's move: {id, note}, null for any other row, and for a call that recorded
+// nothing (no list, a refusal: Tools::ObjectivesTool).
+export function moveOfRow(row) {
+  if (row?.tool !== "objectives" || !RECORDED.test(String(row.output || ""))) return null;
+  const found = ROW_TITLE.exec(String(row.title || row.params || ""));
+  return found ? { id: found[1], note: found[2] } : null;
+}
+
+// The row's title, its objective a chip, marked for the line above an answer
+// when the call recorded a move.
+export function moveRowText(row, shown) {
+  if (row?.tool !== "objectives") return shown;
+  const found = ROW_TITLE.exec(String(shown ?? ""));
+  if (!found) return shown;
+  const move = moveOfRow(row);
+  return html`<span class="obj-pill obj-mark" data-move-id=${move ? move.id : nothing} data-move-note=${move ? move.note : nothing}>${found[1]}</span> ${found[2]}`;
+}
+
+// A finished turn block's moves, in order.
+export function movesInBlock(block) {
+  return [...block.querySelectorAll("[data-move-id]")].map((el) => ({ id: el.dataset.moveId, note: el.dataset.moveNote || "" }));
+}
+
+// A card body's "Concerns O2 …" paragraph: the id a chip. Idempotent.
+export function chipConcerns(body) {
+  for (const p of body.querySelectorAll("p")) {
+    const first = p.firstChild;
+    if (first?.nodeType !== 3) continue;
+    const found = CONCERNS.exec(first.textContent);
+    if (!found) continue;
+    const chip = body.ownerDocument.createElement("span");
+    chip.className = "obj-pill obj-mark";
+    chip.textContent = found[1];
+    first.textContent = first.textContent.slice(found[0].length);
+    p.insertBefore(chip, first);
+    p.classList.add("obj-concerns");
+  }
+}
+
+function lineFor(block) {
+  const next = block.nextElementSibling;
+  return next?.classList.contains("obj-moves") ? next : null;
+}
+
+// @param historyEl the history
+// @param notYet (id) the tap on a move's Not yet (the newest turn's only: CSS)
+// @param canShorten () whether the newest long answer offers its short version
+// @param shorten () the tap on it
+export function createObjectivesMoves({ historyEl, notYet = () => {}, canShorten = () => false, shorten = () => {} }) {
+  // Off once tapped; back when +ask+ answers false (a failure, already told).
+  const once = (e, ask) => {
+    const button = e.currentTarget;
+    button.disabled = true;
+    Promise.resolve(ask()).then((sent) => {
+      if (sent === false) button.disabled = false;
+    });
+  };
+  const drawLine = (line, moves) => render(html`${moves.map((m) => html`<div class="obj-move-line">
+    <span class="obj-pill obj-mark">${m.id}</span><span class="obj-move-note">${m.note}</span>
+    <button type="button" class="obj-act ghost obj-notyet" title=${`Tell the agent: not yet on ${m.id}`} @click=${(e) => once(e, () => notYet(m.id))}>Not yet</button>
+  </div>`)}`, line);
+
+  const markNewest = () => {
+    const lines = [...historyEl.querySelectorAll(":scope > .obj-moves")];
+    lines.forEach((line, i) => line.classList.toggle("newest", i === lines.length - 1));
+  };
+
+  // After an answer's own rows (its Revise row, its timing line: the bubble's
+  // next siblings, one of which CSS reads by adjacency).
+  function shortRowPlace(answer) {
+    let place = answer;
+    while (place.nextElementSibling?.matches(".revise-row, .turn-timing")) place = place.nextElementSibling;
+    return place;
+  }
+
+  function placeShort() {
+    const answers = canShorten() ? historyEl.querySelectorAll(":scope > .bubble.output:not(.streaming)") : [];
+    const answer = answers[answers.length - 1];
+    const long = answer && foldable(answer.dataset.copySource || answer.textContent);
+    let row = historyEl.querySelector(":scope > .obj-short");
+    if (!long) {
+      row?.remove();
+      return;
+    }
+    if (!row) {
+      row = historyEl.ownerDocument.createElement("div");
+      row.className = "obj-short";
+      render(html`<button type="button" class="obj-act ghost" title="Ask for the short version; nothing enters the conversation"
+        @click=${(e) => once(e, shorten)}>Short version</button>`, row);
+    }
+    const place = shortRowPlace(answer);
+    if (place.nextElementSibling !== row) {
+      row.querySelector("button").disabled = false;
+      keepFollowing(historyEl, () => place.after(row));
+    }
+  }
+
+  function decorate() {
+    for (const block of historyEl.querySelectorAll(":scope > .turn-work")) {
+      const moves = movesInBlock(block);
+      const line = lineFor(block);
+      if (!moves.length) {
+        line?.remove();
+        continue;
+      }
+      const sig = JSON.stringify(moves);
+      if (line?.dataset.sig === sig) continue;
+      keepFollowing(historyEl, () => {
+        const el = line || historyEl.ownerDocument.createElement("div");
+        el.className = "obj-moves";
+        el.dataset.sig = sig;
+        drawLine(el, moves);
+        if (!line) block.after(el);
+      });
+    }
+    markNewest();
+    placeShort();
+    for (const card of historyEl.querySelectorAll(".plugin-card .card-body")) {
+      if (card.closest(".plugin-card").querySelector(".card-source")?.textContent === "decision-card") chipConcerns(card);
+    }
+  }
+
+  // The class toggle isn't a childList change, so this doesn't feed itself.
+  new MutationObserver(decorate).observe(historyEl, { childList: true, subtree: true });
+  decorate();
+  return { decorate };
+}