@litfamily/litopencode 1.0.21 → 1.0.23

package/dist/tui/mission-text.js

@@ -2,7 +2,7 @@
 // (Hangul and emoji take two cells), truncation, the gradient bar, and the coloured segments the TUI
 // renders as spans. Every frame of motion is drawn from a MotionFrame, so all of it is testable here.
 import { ease, mixHex, rowEntryStart, seg, slideIn, motionTiming } from "./mission-motion.js";
-import { missionRowKeys, missionStatus } from "./mission-model.js";
+import { currentStepIndex, missionRowKeys, missionStatus, stepName } from "./mission-model.js";
 /** Panel box width in cells, and the content width inside its border and one cell of padding per side. */
 export const panelWidth = 36;
 export const panelInnerWidth = panelWidth - 4;
@@ -49,6 +49,7 @@ export function paletteFromTheme(theme, mode = "dark") {
     const neutral = mode === "light" ? "#f2f2f2" : "#1c1c1c";
     return {
         primary: pick("primary", "#ff6337"),
+        secondary: pick("secondary", "#ff2d95"),
         accent: pick("accent", "#b48cff"),
         info: pick("info", "#0aa6c2"),
         warning: pick("warning", "#ffaf3c"),
@@ -182,27 +183,34 @@ export function progressBar(ratio, cells, palette, sweep = -1) {
         segments.push({ text: "─".repeat(cells - used), fg: palette.borderSubtle });
     return segments;
 }
-function microBar(ratio, palette) {
-    const filled = Math.max(0, Math.min(5, Math.round(Math.max(0, Math.min(1, ratio)) * 5)));
+/** The stage colour ramp: the theme's primary through secondary to accent, so every theme keeps its own feel. */
+export function stageColor(index, count, palette) {
+    return gradientAt([palette.primary, palette.secondary, palette.accent], count <= 1 ? 0 : index / (count - 1));
+}
+function microBar(ratio, palette, cells = 5) {
+    const filled = Math.max(0, Math.min(cells, Math.round(Math.max(0, Math.min(1, ratio)) * cells)));
     const segments = [];
-    for (let index = 0; index < 5; index += 1) {
-        segments.push(index < filled ? { text: "▰", fg: gradientAt([palette.primary, palette.accent], index / 4) } : { text: "▱", fg: palette.borderSubtle });
+    for (let index = 0; index < cells; index += 1) {
+        segments.push(index < filled ? { text: "▰", fg: gradientAt([palette.primary, palette.secondary, palette.accent], cells <= 1 ? 0 : index / (cells - 1)) } : { text: "▱", fg: palette.borderSubtle });
     }
     return segments;
 }
 function countText(view) {
     return view.progress === undefined ? "" : `${view.progress.done}/${view.progress.total}`;
 }
-/** The step state to draw: during the completion moment WORK and REVIEW flip to done one after the other. */
-function shownState(step, view, frame) {
+/**
+ * The step state to draw. During the completion moment the stage that was running and every stage
+ * after it flip to done one after the other, 60 ms apart.
+ */
+function shownState(step, index, frame) {
     const t = frame.celebrate;
-    if (t === undefined || step.state !== "done" || step.id === "plan")
+    const from = frame.celebrateFrom;
+    if (t === undefined || from === undefined || step.state !== "done" || index < from)
         return { state: step.state, doneMix: step.state === "done" ? 1 : 0 };
-    const at = step.id === "work" ? motionTiming.workDoneAt : motionTiming.reviewDoneAt;
-    const mix = ease.inOutCubic(seg(t, at, motionTiming.crossfade));
+    const at = motionTiming.workDoneAt + (index - from) * (motionTiming.reviewDoneAt - motionTiming.workDoneAt);
     if (t < at)
-        return { state: step.id === "work" ? "now" : "todo", doneMix: 0 };
-    return { state: "done", doneMix: mix };
+        return { state: index === from ? "now" : "todo", doneMix: 0 };
+    return { state: "done", doneMix: ease.inOutCubic(seg(t, at, motionTiming.crossfade)) };
 }
 function pillStyle(state, palette, warn) {
     if (state === "done")
@@ -212,64 +220,120 @@ function pillStyle(state, palette, warn) {
     const level = state === "warn" ? Math.max(warn, 0.5) : warn;
     return { fg: palette.onFill, bg: mixHex(palette.info, palette.warning, level), bold: true };
 }
-function blendStyle(from, to, amount, palette) {
-    if (amount <= 0)
-        return from;
-    if (amount >= 1)
-        return to;
-    const bgFrom = from.bg ?? palette.mixBase;
-    const bgTo = to.bg ?? palette.mixBase;
-    return { fg: mixHex(from.fg, to.fg, amount), bg: mixHex(bgFrom, bgTo, amount), bold: amount < 0.5 ? from.bold : to.bold };
-}
-function stepLabel(step, state, view) {
-    const name = step.id.toUpperCase();
-    const count = step.id === "work" && view.progress !== undefined ? countText(view) : "";
-    if (state === "done")
-        return [name, count, "✓"].filter((part) => part !== "").join(" ");
+/** A light pass over the running stage: once when the map moves forward, and during the completion moment. */
+export function stageFlash(frame) {
+    if (frame.stageFrom !== undefined && frame.t <= motionTiming.shimmer)
+        return -0.2 + 1.4 * seg(frame.t, 0, motionTiming.shimmer);
+    return shimmerAt(frame);
+}
+/**
+ * The colour of the connector into stage `index`. It carries the stage ramp once the stage before it is
+ * behind the map, and fills in turn, 60 ms apart, when the map has just moved forward.
+ */
+export function linkColor(view, index, frame, palette, idle) {
+    const before = view.steps[index - 1];
+    if (before === undefined)
+        return idle;
+    const state = shownState(before, index - 1, frame).state;
+    if (state !== "done" && state !== "skip")
+        return idle;
+    const color = stageColor(index - 0.5, view.steps.length, palette);
+    if (frame.stageFrom === undefined || index <= frame.stageFrom)
+        return color;
+    return mixHex(idle, color, ease.outCubic(seg(frame.t, (index - frame.stageFrom - 1) * motionTiming.stagger, motionTiming.entry)));
+}
+/**
+ * One stage of the breadcrumb. Behind the map a stage is its name in its ramp colour with `✓` (or `–`
+ * when skipped); ahead it is a muted name; the running stage is a filled capital pill followed by an
+ * optional `bar`-cell bar and the count.
+ */
+export function crumb(view, index, frame, palette, bar, flash = -1) {
+    const step = view.steps[index];
+    const { state, doneMix } = shownState(step, index, frame);
+    const name = stepName(step.id, view);
+    const counted = step.id === "work" && view.progress !== undefined;
+    if (state === "done") {
+        const color = stageColor(index, view.steps.length, palette);
+        return [{ text: [name, counted ? countText(view) : "", "✓"].filter((part) => part !== "").join(" "), fg: doneMix >= 1 ? color : mixHex(index === frame.celebrateFrom ? palette.info : palette.muted, color, doneMix) }];
+    }
     if (state === "skip")
-        return `${name} –`;
-    if (state === "warn")
-        return [name, "⚑", count].filter((part) => part !== "").join(" ");
-    return [name, state === "now" ? count : ""].filter((part) => part !== "").join(" ");
+        return [{ text: `${name} –`, fg: palette.muted }];
+    if (state === "todo")
+        return [{ text: name, fg: palette.muted }];
+    const style = pillStyle(state, palette, frame.warn);
+    const label = ` ${name.toUpperCase()}${state === "warn" ? " ⚑" : ""} `;
+    const chars = [...label];
+    const pill = flash < 0
+        ? [{ text: label, fg: style.fg, ...(style.bg === undefined ? {} : { bg: style.bg }), bold: style.bold }]
+        : chars.map((char, position) => ({ text: char, fg: style.fg, bg: shine(style.bg ?? palette.info, palette, position / (chars.length - 1), flash, 0.3), bold: true }));
+    if (!counted)
+        return pill;
+    return [...pill, ...(bar > 0 ? [{ text: " ", fg: palette.muted }, ...microBar(frame.barRatio, palette, bar)] : []), { text: ` ${countText(view)}`, fg: palette.text, bold: true }];
+}
+const spinnerFrames = "⠋⠙⠹⠸⠼⠴⠦⠧⠇⠏";
+function clockText(seconds) {
+    const minutes = Math.floor(seconds / 60);
+    const rest = String(seconds % 60).padStart(2, "0");
+    return minutes < 60 ? `${minutes}:${rest}` : `${Math.floor(minutes / 60)}:${String(minutes % 60).padStart(2, "0")}:${rest}`;
 }
-export function stepPill(step, view, frame, palette) {
-    const { state, doneMix } = shownState(step, view, frame);
-    const before = pillStyle(step.id === "work" ? "now" : "todo", palette, frame.warn);
-    const style = state === "done" && doneMix < 1 ? blendStyle(before, pillStyle("done", palette, frame.warn), doneMix, palette) : pillStyle(state, palette, frame.warn);
-    return { text: ` ${stepLabel(step, state, view)} `, fg: style.fg, ...(style.bg === undefined ? {} : { bg: style.bg }), bold: style.bold };
+/**
+ * The live step: the running tool's name and how long it has run, `⠹ bash · 0:48`. The spinner moves
+ * with the elapsed second, so it changes only when the time does. Nothing of the tool's input is shown.
+ */
+export function liveSegments(view, frame, palette, room) {
+    if (view.live === undefined || view.complete || room < 4)
+        return [];
+    const seconds = frame.now === undefined ? undefined : Math.max(0, Math.floor((frame.now - view.live.start) / 1000));
+    const spin = [...spinnerFrames][(seconds ?? 0) % 10];
+    const time = seconds === undefined ? "" : ` · ${clockText(seconds)}`;
+    return [
+        { text: `${spin} `, fg: palette.warning },
+        { text: truncateCells(view.live.tool, Math.max(1, room - 2 - cellWidth(time))), fg: palette.text },
+        { text: time, fg: palette.muted }
+    ];
 }
 function brandPill(palette, sweep) {
     const chars = [" ", "🔥", " ", "L", "I", "T", " "];
     return chars.map((char, index) => ({ text: char, fg: palette.onFill, bg: shine(palette.primary, palette, index / (chars.length - 1), sweep, 0.3), bold: true }));
 }
-/** The chip's pill groups for a tier; the five-segment bar is appended unless `withMicroBar` is false. */
-export function chipGroups(view, frame, palette, tier, withMicroBar = true) {
-    const sweep = shimmerAt(frame);
+/**
+ * The chip's groups for a tier. The full tier is the brand and the breadcrumb around the running stage
+ * (the one before, the running one with a seven-cell bar, the one after); medium keeps the running
+ * stage and the next with a five-cell bar; tight keeps only the count.
+ */
+export function chipGroups(view, frame, palette, tier) {
     const space = { text: " ", fg: palette.muted };
-    const separator = { text: " › ", fg: palette.borderActive };
     const flame = { text: "🔥", fg: palette.text };
+    const count = view.steps.length;
+    const reached = currentStepIndex(view);
+    const current = Math.min(count - 1, Math.max(0, reached));
+    const flash = stageFlash(frame);
     const groups = [];
+    const trail = (from, to, bar) => {
+        for (let index = Math.max(0, from); index <= Math.min(count - 1, to); index += 1) {
+            const lead = index === Math.max(0, from) ? space : { text: " › ", fg: linkColor(view, index, frame, palette, palette.borderActive) };
+            groups.push([lead, ...crumb(view, index, frame, palette, bar, index === current ? flash : -1)]);
+        }
+    };
+    // A finished map keeps its last stages in view, so the completion moment can flip them in turn.
+    const anchor = reached >= count ? count - 2 : current;
     if (tier === "full") {
-        groups.push(brandPill(palette, sweep));
-        view.steps.forEach((step, index) => groups.push([index === 0 ? space : separator, stepPill(step, view, frame, palette)]));
+        groups.push(brandPill(palette, shimmerAt(frame)));
+        trail(anchor - 1, anchor + 1, 7);
     }
     else if (tier === "medium") {
         groups.push([flame]);
-        const current = view.steps.findIndex((step) => step.state === "now" || step.state === "warn");
-        const from = current >= 0 ? current : view.complete ? 1 : 0;
-        view.steps.slice(from, from + 2).forEach((step, index) => groups.push([index === 0 ? space : separator, stepPill(step, view, frame, palette)]));
+        trail(anchor, anchor + 1, 5);
     }
     else {
         groups.push([flame]);
-        const current = view.steps.find((step) => step.state === "now" || step.state === "warn") ?? view.steps[1];
-        const count = countText(view);
-        const done = view.complete && (frame.celebrate === undefined || frame.celebrate >= motionTiming.workDoneAt);
-        const value = done ? `✓ ${count}`.trim() : current.state === "warn" ? `⚑ ${count}`.trim() : count || current.id.toUpperCase();
-        const style = pillStyle(done ? "done" : current.state === "warn" ? "warn" : "now", palette, frame.warn);
+        const step = view.steps[current];
+        const shown = shownState(step, current, frame).state;
+        const done = view.complete && shown === "done";
+        const value = done ? `✓ ${countText(view)}`.trim() : step.state === "warn" ? `⚑ ${countText(view)}`.trim() : countText(view) || stepName(step.id, view).toUpperCase();
+        const style = pillStyle(done ? "done" : step.state === "warn" ? "warn" : "now", palette, frame.warn);
         groups.push([space, { text: ` ${value} `, fg: style.fg, ...(style.bg === undefined ? {} : { bg: style.bg }), bold: style.bold }]);
     }
-    if (withMicroBar && view.progress !== undefined)
-        groups.push([space, ...microBar(frame.barRatio, palette)]);
     return groups;
 }
 export function groupsWidth(groups) {
@@ -314,14 +378,20 @@ export function chipTier(view, frame, palette, budget) {
     return "tight";
 }
 /**
- * The phase chip on the right of the prompt's agent/model row: `🔥 LIT` `PLAN` › `WORK n/m` › `REVIEW`
- * and a five-segment bar, shedding labels before values as `budget` shrinks. Idle sessions render nothing.
+ * The map chip on the right of the prompt's agent/model row: `🔥 LIT  plan ✓ › WORK ▰▰▰▱▱▱▱ 3/7 › review`,
+ * then the live step when the full chip leaves room for it, shedding labels before values as `budget`
+ * shrinks. Idle sessions render nothing.
  */
 export function chipLine(view, frame, palette, budget) {
     if (!view.active)
         return [];
     const tier = chipTier(view, frame, palette, budget);
     const groups = chipGroups(view, frame, palette, tier);
+    if (tier === "full") {
+        const live = liveSegments(view, frame, palette, 24);
+        if (live.length > 0 && groupsWidth(groups) + 2 + lineWidth(live) <= budget)
+            groups.push([{ text: "  ", fg: palette.muted }, ...live]);
+    }
     const out = [];
     if (frame.celebrate !== undefined && groupsWidth(groups) + chipSparkWidth <= budget)
         out.push(...(chipSparkCells(frame.celebrate, palette) ?? []));
@@ -367,20 +437,35 @@ export function statusSegments(view, frame, palette) {
     };
     return { segments: [fade(pill, progress <= 0 ? 0 : ease.outCubic(progress), palette)], offset: Math.max(-1, slideIn(progress)) };
 }
-function stepsRow(view, frame, palette) {
-    const out = [];
-    let previousDone = false;
-    view.steps.forEach((step, index) => {
-        const { state, doneMix } = shownState(step, view, frame);
-        const live = mixHex(palette.info, palette.warning, state === "warn" ? Math.max(frame.warn, 0.5) : frame.warn);
-        const color = state === "done" ? mixHex(step.id === "work" ? palette.info : palette.muted, palette.success, doneMix) : state === "now" || state === "warn" ? live : palette.muted;
-        const glyph = state === "done" ? "✓" : state === "skip" ? "–" : state === "warn" ? "⚑" : state === "now" ? "●" : "○";
-        if (index > 0)
-            out.push({ text: " ── ", fg: previousDone ? palette.success : palette.borderSubtle });
-        out.push({ text: `${glyph} ${step.id.toUpperCase()}`, fg: color, bold: state === "now" || state === "warn" });
-        previousDone = state === "done";
-    });
-    return out;
+/**
+ * One stage of the sidebar's vertical map: `◆` behind, `◉` running in bold, `⚑` flagged, `◇` ahead,
+ * with the plan's task count or the loop's iteration on the right.
+ */
+function stepperRow(view, index, frame, palette, width) {
+    const step = view.steps[index];
+    const { state, doneMix } = shownState(step, index, frame);
+    const counted = step.id === "work" && view.progress !== undefined ? ` ${countText(view)}` : "";
+    const name = `${stepName(step.id, view)}${counted}`;
+    const note = step.id === "plan" && view.planTasks !== undefined ? `${view.planTasks} tasks` : step.id === "work" && view.iteration !== undefined ? `iter ${view.iteration}` : "";
+    const live = mixHex(palette.info, palette.warning, state === "warn" ? Math.max(frame.warn, 0.5) : frame.warn);
+    let head;
+    if (state === "done") {
+        const color = stageColor(index, view.steps.length, palette);
+        head = [{ text: "◆ ", fg: doneMix >= 1 ? color : mixHex(palette.info, color, doneMix) }, { text: name, fg: palette.text }];
+    }
+    else if (state === "now" || state === "warn") {
+        head = [{ text: `${state === "warn" ? "⚑" : "◉"} ${name}`, fg: live, bold: true }];
+    }
+    else {
+        head = [{ text: `◇ ${name}${state === "skip" ? " –" : ""}`, fg: palette.muted }];
+    }
+    if (note === "")
+        return head;
+    const room = width - cellWidth(note) - 1;
+    const used = lineWidth(head);
+    if (used > room)
+        return head;
+    return [...head, { text: " ".repeat(width - used - cellWidth(note)), fg: palette.muted }, { text: note, fg: palette.muted }];
 }
 function criterionSegment(id, status, palette) {
     if (status === "pass")
@@ -510,9 +595,9 @@ function withEmbers(rows, t, palette) {
 }
 /**
  * The sidebar mission panel: a rounded box whose border carries the state (accent while working,
- * warning on a warning, success when complete), a tiny LIT header, the goal title, the phase line,
- * the bar, the next item, criteria, warnings and the evidence timeline. Rows are at most
- * `panelInnerWidth` cells.
+ * warning on a warning, success when complete), a tiny LIT header, the goal title, the vertical stage
+ * map with its connectors, the bar, the detail line, the live step, criteria, warnings and the
+ * evidence timeline. Rows are at most `panelInnerWidth` cells.
  */
 export function missionPanel(view, frame, palette) {
     if (!view.active)
@@ -528,12 +613,22 @@ export function missionPanel(view, frame, palette) {
     rows.set("b1", []);
     if (view.goal !== undefined)
         rows.set("title", [{ text: truncateCells(view.goal.title, width), fg: palette.text, bold: true }]);
-    rows.set("steps", stepsRow(view, frame, palette));
+    view.steps.forEach((step, index) => {
+        if (index > 0) {
+            const color = linkColor(view, index, frame, palette, palette.borderSubtle);
+            rows.set(`link:${index}`, [{ text: color === palette.borderSubtle ? "┆" : "┃", fg: color }]);
+        }
+        rows.set(`step:${step.id}`, stepperRow(view, index, frame, palette, width));
+    });
     if (view.progress !== undefined)
         rows.set("bar", progressBar(frame.barRatio, width, palette, sweep));
     rows.set("b2", []);
-    if (view.next !== undefined)
-        rows.set("next", [{ text: "next ", fg: palette.muted }, { text: truncateCells(`▸ ${view.next}`, width - 5), fg: palette.text }]);
+    // The detail line: `└ task 3 · next ▸ …`, or a research run's claim counts.
+    const lead = view.detail === undefined ? "" : truncateCells(view.detail, width - 2);
+    const gap = lead !== "" && view.next !== undefined ? " · " : "";
+    const next = view.next === undefined ? "" : truncateCells(`next ▸ ${view.next}`, Math.max(0, width - 2 - cellWidth(lead) - cellWidth(gap)));
+    rows.set("detail", [{ text: "└ ", fg: palette.muted }, { text: lead + (next === "" ? "" : gap), fg: palette.muted }, ...(next === "" ? [] : [{ text: next, fg: palette.text }])]);
+    rows.set("live", liveSegments(view, frame, palette, width));
     if (view.goal !== undefined) {
         const criteria = [{ text: "crit", fg: palette.muted }];
         for (const criterion of view.goal.criteria) {
@@ -573,7 +668,7 @@ export function missionPanel(view, frame, palette) {
     const enter = frame.chipEnter ? ease.outCubic(seg(frame.t, 0, motionTiming.entry)) : 1;
     const done = view.complete ? (frame.celebrate === undefined ? 1 : ease.inOutCubic(seg(frame.celebrate, 0, motionTiming.crossfade))) : 0;
     const border = mixHex(palette.mixBase, mixHex(mixHex(palette.accent, palette.warning, frame.warn), palette.success, done), enter);
-    const phase = view.complete ? "COMPLETE" : view.phase.toUpperCase();
+    const phase = view.complete ? "COMPLETE" : stepName(view.phase, view).toUpperCase();
     const flagged = view.warnings.length > 0 && !view.complete ? " ⚑" : "";
     const bottom = view.goal !== undefined
         ? ` ${view.goal.passed}/${view.goal.total} criteria${view.complete ? " ✓" : ""} `

package/dist/tui.js

@@ -4,14 +4,15 @@ import { jsx } from "@opentui/solid/jsx-runtime";
 import { buildMissionView, lastMission, leadingNotice, missionNotices } from "./tui/mission-model.js";
 import { idleMotion, motionTiming, planMotion, sampleMotion } from "./tui/mission-motion.js";
 import { chipBudget, chipLine, homeLine, missionPanel, paletteFromTheme, panelWidth } from "./tui/mission-text.js";
-import { createLedgerReader, missionProjectRoot, readCardInput, readMissionInput } from "./tui/mission-source.js";
+import { createLedgerReader, createWorkReader, missionProjectRoot, readCardInput, readLatestResearchRun, readMissionInput } from "./tui/mission-source.js";
 import { chipShimmer, idleChipMotion, planChipMotion } from "./tui/mission-skills.js";
-import { bandCard, readBandOptions, statusCard } from "./tui/mission-band.js";
+import { bandCard, readBandOptions, readNotifyOptions, statusCard } from "./tui/mission-band.js";
 export const litOpenCodeTuiPluginId = "litopencode";
 const homeLineWidth = 69;
 const refreshDelayMs = 80;
 const ledgerPollMs = 2000;
 const toastMs = 4000;
+const liveTickMs = 1000;
 const trackedSessionLimit = 4;
 const refreshEvents = [
     "message.updated",
@@ -38,7 +39,9 @@ function lineElement(line) {
 const tui = async (api, options) => {
     const motionEnabled = options?.motion !== false;
     const band = readBandOptions(options);
+    const notify = readNotifyOptions(options);
     const readLedger = createLedgerReader();
+    const readWork = createWorkReader();
     const sessions = new Map();
     const tracked = [];
     const [revision, setRevision] = createSignal(0);
@@ -46,6 +49,7 @@ const tui = async (api, options) => {
     let frameTimer;
     let refreshTimer;
     let pollTimer;
+    let liveTimer;
     const state = () => api.state;
     const palette = () => paletteFromTheme(api.theme.current, api.theme.mode());
     // OpenCode keeps the sidebar choice in its KV store under "sidebar" ("auto" or "hide"); a child
@@ -79,20 +83,45 @@ const tui = async (api, options) => {
             }
         }, motionTiming.frameMs);
     }
+    // The live step's elapsed time is the only steady change: one tick a second while a tool runs, and
+    // no timer at all otherwise.
+    function syncLiveTick() {
+        const running = [...sessions.values()].some((entry) => entry.view.live !== undefined);
+        if (running && liveTimer === undefined)
+            liveTimer = setInterval(() => setClock(Date.now()), liveTickMs);
+        if (!running && liveTimer !== undefined) {
+            clearInterval(liveTimer);
+            liveTimer = undefined;
+        }
+    }
+    // The finish alert is off unless tui.json opts in; OpenCode's own attention settings still decide
+    // whether a desktop notification or a sound actually plays.
+    function alertFinish(notice) {
+        if (!notify.enabled)
+            return;
+        void api.attention
+            .notify({ title: "🔥 LIT complete", message: notice.message, notification: notify.desktop, sound: notify.sound ? { name: "done" } : false })
+            .catch(() => undefined);
+    }
     function refresh(sessionID) {
         const now = Date.now();
         const source = state();
-        const ledger = readLedger(missionProjectRoot(source.path));
-        const next = buildMissionView(readMissionInput(source, sessionID, ledger, now));
+        const root = missionProjectRoot(source.path);
+        const ledger = readLedger(root);
+        const next = buildMissionView(readMissionInput(source, sessionID, ledger, now, { work: readWork(root, sessionID), research: readLatestResearchRun(root) }));
         const card = readCardInput(source, sessionID);
         const entry = sessions.get(sessionID);
         const viewChanged = entry === undefined || JSON.stringify(entry.view) !== JSON.stringify(next);
         if (!viewChanged && JSON.stringify(entry.card) === JSON.stringify(card))
             return;
         if (entry !== undefined && viewChanged) {
-            const notice = leadingNotice(missionNotices(entry.view, next));
+            const notices = missionNotices(entry.view, next);
+            const notice = leadingNotice(notices);
             if (notice !== undefined)
                 api.ui.toast({ variant: notice.variant, title: notice.title, message: notice.message, duration: toastMs });
+            const finish = notices.find((candidate) => candidate.celebrate === true);
+            if (finish !== undefined)
+                alertFinish(finish);
         }
         sessions.set(sessionID, {
             view: next,
@@ -103,6 +132,7 @@ const tui = async (api, options) => {
         setClock(now);
         setRevision(revision() + 1);
         ensureFrames();
+        syncLiveTick();
     }
     function refreshTracked() {
         refreshTimer = undefined;
@@ -177,6 +207,8 @@ const tui = async (api, options) => {
             clearTimeout(refreshTimer);
         if (pollTimer !== undefined)
             clearInterval(pollTimer);
+        if (liveTimer !== undefined)
+            clearInterval(liveTimer);
         sessions.clear();
     });
     api.slots.register({

package/docs/assets/readme/badge-version.svg

@@ -1 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="146" height="20" role="img" aria-label="release: 1.0.21"><title>release: 1.0.21</title><g shape-rendering="crispEdges"><rect width="49" height="20" fill="#080d14"/><rect x="49" width="97" height="20" fill="#ff6337"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" textLength="390" transform="scale(.1)">release</text><text x="965" y="140" textLength="870" transform="scale(.1)" fill="#080D14">1.0.21</text></g></svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="146" height="20" role="img" aria-label="release: 1.0.23"><title>release: 1.0.23</title><g shape-rendering="crispEdges"><rect width="49" height="20" fill="#080d14"/><rect x="49" width="97" height="20" fill="#ff6337"/></g><g fill="#fff" text-anchor="middle" font-family="Verdana,Geneva,DejaVu Sans,sans-serif" text-rendering="geometricPrecision" font-size="110"><text x="255" y="140" textLength="390" transform="scale(.1)">release</text><text x="965" y="140" textLength="870" transform="scale(.1)" fill="#080D14">1.0.23</text></g></svg>

package/docs/reference-Ko-KR.md

@@ -257,25 +257,46 @@ OpenCode 1.18은 `tui.json`이나 `tui.jsonc`의 `plugin` 배열에 적힌 TUI
 
 화면에 그리는 것:
 
-- 입력창 아래 agent/model 줄 오른쪽의 단계 칩: `🔥 LIT` 알약 뒤에 `PLAN` › `WORK n/m` › `REVIEW`
-  알약과 다섯 칸 `▰▱` 막대가 붙습니다. 자리가 좁으면 이름부터 덜어 내서, `🔥`와 지금·다음 단계만,
-  더 좁으면 `🔥`와 개수만 남깁니다. 자리는 OpenCode에 저장된 사이드바 설정과 세션 종류(하위 세션에는
-  사이드바가 없음)로 계산합니다. 설정을 아직 읽을 수 없으면 사이드바가 열려 있다고 보고 좁게 잡습니다.
+- 작업 흐름 지도: 어떤 스킬이 돌았는지만이 아니라 지금 LIT 작업 흐름의 어디쯤인지 보여 줍니다.
+  세션마다 단계표 하나를 따릅니다.
+  - 기본 흐름 `interview › plan › work n/m › review › done`
+  - lit-loop의 기준 반복: 단계는 같고, lit-loop나 litgoal 세션이 할 일 대신 목표 기준을 셀 때
+    work 단계가 `criterion n/m`으로 바뀝니다.
+  - litresearch 실행: 세션이 litresearch를 돌리고 있거나 세션이 쓴 실행 폴더가 아직 열려 있으면
+    `decompose › wave n › expand › verify › synthesis`를 따릅니다.
+
+  하지 않고 지나간 단계에는 `–`가 붙습니다. 범위가 정해진 `lit-task`는 계획을 만들지 않으므로 plan
+  단계를 건너뛴 것으로 보여 주고, 했다고 표시하지 않습니다. `review-work` 없이 할 일만 모두 끝내도
+  review는 `–`로 남습니다. 리뷰 명령, 리뷰 막힘, ledger CLI로 끝낸 목표(완료 관문이 리뷰를 포함함)가 있어야
+  완료로 바뀝니다. 에이전트가 직접 쓴 `goals.json`에서 끝났다고 표시한 목표는 관문을 거치지 않았으므로
+  review를 `–`로 둡니다. 지나온 단계는 테마의 primary에서
+  secondary를 거쳐 accent로 가는 색을 차례로 받고, 앞으로 할 단계는 흐리게 그립니다.
+- 입력창 아래 agent/model 줄 오른쪽의 지도 칩: `🔥 LIT` 알약 뒤에 지금 단계 앞뒤를 이어 쓴
+  `plan ✓ › WORK ▰▰▰▱▱▱▱ 3/7 › review`가 붙습니다. 지금 단계는 채운 알약과 일곱 칸 막대로 보입니다.
+  자리가 넉넉하면 지금 하는 일(`⠹ bash · 0:48`)이 뒤따릅니다. 자리가 좁으면 지금 하는 일을 먼저 빼고,
+  다음에는 브랜드와 지난 단계를 빼서 `🔥`, 지금·다음 단계, 다섯 칸 막대만 남기고, 더 좁으면 `🔥`와
+  개수만 남깁니다. 자리는 OpenCode에 저장된 사이드바 설정과 세션 종류(하위 세션에는 사이드바가
+  없음)로 계산합니다. 설정을 아직 읽을 수 없으면 사이드바가 열려 있다고 보고 좁게 잡습니다.
 - 세션 사이드바 맨 위의 미션 패널: 36칸짜리 둥근 상자이고, 위 테두리에 `🔥 LIT ▸ <단계>`, 아래
   테두리에 `n/m criteria`가 붙습니다. 테두리 색이 상태를 보여 줍니다. 일하는 중에는 테마 accent,
   경고가 있으면 warning, 끝나면 success 색입니다. 안에는 두 줄짜리 `LIT`과 그 옆의 작업 이름·상태,
-  굵은 목표 제목, 단계 줄, 1/8칸 블록으로 칠하고 빈 곳은 가는 선으로 둔 그라데이션 막대, 다음 할 일이나
-  아직 통과하지 못한 기준, 기준 목록, 경고, 최근 증거 네 개가 들어갑니다.
+  굵은 목표 제목, 세로 단계 지도가 들어갑니다. 지도에서 지난 단계는 `◆`, 지금 단계는 굵은 `◉`,
+  경고가 걸린 단계는 `⚑`, 남은 단계는 `◇`입니다. 지금 단계까지는 단계 색의 `┃`로, 그 뒤로는 점선
+  `┆`로 잇고, plan 옆에는 저장된 계획의 할 일 수, work 옆에는 `iter k`를 적습니다. 그 아래로 1/8칸
+  블록으로 칠하고 빈 곳은 가는 선으로 둔 그라데이션 막대, 자세히 한 줄 `└ task 3 · next ▸ <항목>`
+  (조사 실행에서는 주장 수와 검증된 수), 지금 하는 일, 기준 목록, 경고, 최근 증거 네 개가 이어집니다.
+- 지금 하는 일: 세션이 돌리고 있는 도구의 이름과 걸린 시간입니다. 실행 중인 도구 part의 이름과 시작
+  시각만 읽고, 입력(명령, 경로, 인자)은 읽지도 보여 주지도 않습니다. 턴이 도는 동안에만 보입니다.
 - 띠(band): 화면 맨 아래에 붙는 상태 카드입니다(OpenCode의 `app_bottom` 자리). 세션과 사이드바
   아래를 모두 가로지릅니다. lit을 쓰든 안 쓰든 세션 내내 보이고, 쉴 때나 일할 때나 똑같이 네 줄이라
   입력창이 움직이지 않습니다.
   - 위 테두리 왼쪽에 `🔥 LIT · <작업 이름>`, 오른쪽에 단계가 붙습니다(`● WORK`, `⚑ review blocked`,
     `✓ COMPLETE`, lit 턴 전과 세션이 턴을 돌리지 않는 동안에는 `○ IDLE`. 이때는 OpenCode의 `session.status`를
     읽고, 밝게 켜진 단계가 없습니다).
-  - 첫째 줄은 칩과 같은 알약으로 그린 단계 줄 `PLAN ━ WORK ━ REVIEW`, 1/8칸 막대, 목표의
-    `n/m criteria`, 다음 할 일입니다. 경고가 열려 있는 동안에는 `▸ 다음 일` 자리에 `⚑ <내용>`이
-    들어갑니다. 쉬는 세션에서는 흐린 단계 줄 옆에 프로젝트의 마지막 목표를, 목표가 없으면
-    `add lit to a prompt to start`를 보여 줍니다.
+  - 첫째 줄은 단계 전체를 이어 쓴 지도 `interview – ━ plan ✓ ━ WORK 3/7 ─ review ─ done`, 1/8칸
+    막대, 목표의 `n/m criteria`(단계가 이미 기준을 세는 기준 반복에서는 빠집니다), 지금 하는 일, 다음 할 일입니다. 경고가 열려 있는 동안에는 지금 하는
+    일과 `▸ 다음 일` 자리에 `⚑ <내용>`이 들어갑니다. 쉬는 세션에서는 흐린 지도 옆에 프로젝트의
+    마지막 목표를, 목표가 없으면 `add lit to a prompt to start`를 보여 줍니다.
   - 둘째 줄은 스킬 칩입니다. 세션에서 실행된 LitOpenCode 스킬이 여러 개 함께 보입니다. 지금 요청에서
     실행된 스킬은 요청이 도는 동안 accent 색 알약으로 밝게 보이고, 새로 들어온 칩에는 빛이 짧게 한 번
     지나갑니다. 턴이 끝나면 흐려져 최근 목록으로 남고(최근 것이 앞), 다시 실행되면 다시 밝아집니다.
@@ -284,8 +305,8 @@ OpenCode 1.18은 `tui.json`이나 `tui.jsonc`의 `plugin` 배열에 적힌 TUI
     붙습니다.
 
   하위(subagent) 세션에서는 부모 세션의 카드를 `· in lane`과 함께 보여 주고, 홈 화면에는 띠가
-  없습니다. 폭이 좁으면 줄마다 덜 중요한 것부터 덜어 냅니다. 단계 줄은 다음 할 일 글자, 막대 길이,
-  막대, 기준 개수, 단계 이름 순서로, 아래 테두리는 브랜치, 시간, context 사용량 순서로 뺍니다. 줄을
+  없습니다. 폭이 좁으면 줄마다 덜 중요한 것부터 덜어 냅니다. 단계 줄은 지금 하는 일과 다음 할 일
+  글자, 막대 길이, 막대, 기준 개수를 차례로 빼고, 마지막에는 지금 단계만 남깁니다. 아래 테두리는 브랜치, 시간, context 사용량 순서로 뺍니다. 줄을
   넘기지는 않습니다. 완료 순간도 여기서 함께 보입니다.
 - 홈 화면 입력창 아래, OpenCode 팁 다음 줄: `🔥 lit ready · last: <목표> ✓ n/m`. 프로젝트 ledger에
   목표가 있을 때만 보입니다.
@@ -293,9 +314,14 @@ OpenCode 1.18은 `tui.json`이나 `tui.jsonc`의 `plugin` 배열에 적힌 TUI
   때문입니다. 알파가 0인 테마 바탕(system, lucent-orng)은 검게 칠하지 않고 비워 둡니다.
 - 관문 사건마다 토스트 하나: 계획 저장 또는 저장 실패, 목표 설정, 기준 통과, 리뷰 막힘과 해결, 완료.
   한 번에 여러 사건이 생기면 가장 급한 것 하나로 합칩니다.
-- 목표가 끝나거나 할 일이 모두 끝나면 1.2초 안에 끝나는 완료 순간을 보여 줍니다. 테두리가 초록으로
-  바뀌고 막대가 끝까지 차며, `WORK`와 `REVIEW`가 차례로 완료로 바뀝니다. 브랜드에 빛이 한 번 지나가고,
-  패널 안으로 불씨가 올라가며, `COMPLETE`가 살짝 넘쳤다가 제자리로 옵니다.
+- 목표가 끝나거나, 할 일이 모두 끝나거나, 조사 실행이 보고서를 쓰면 1.2초 안에 끝나는 완료 순간을
+  보여 줍니다. 테두리가 초록으로 바뀌고 막대가 끝까지 차며, 돌던 단계와 그 뒤 단계가 60ms 간격으로
+  차례로 완료로 바뀝니다. 브랜드에 빛이 한 번 지나가고, 패널 안으로 불씨가 올라가며, `COMPLETE`가
+  살짝 넘쳤다가 제자리로 옵니다.
+- 같은 순간에 켤 때만 울리는 끝 알림: OpenCode의 `attention.notify`로 데스크톱 알림과 호스트의
+  `done` 소리를 보냅니다. 기본은 꺼져 있고, 켜는 법은 아래 옵션에 있습니다. 실제로 울릴지는 OpenCode
+  자체의 `attention` 설정이 정합니다. 이 설정은 tui.json에서 `"attention": { "enabled": true }`로 켜기
+  전까지 꺼져 있고, 꺼져 있으면 OpenCode가 `attention_disabled`로 답합니다.
 
 데이터는 이미 있는 것만 읽고, TUI를 위해 새로 쓰는 파일은 없습니다.
 
@@ -306,16 +332,36 @@ OpenCode 1.18은 `tui.json`이나 `tui.jsonc`의 `plugin` 배열에 적힌 TUI
   동안 마지막 사용자 메시지 이후에 실행된 것을 뜻합니다.
 - `lit`이 모드를 켜거나 명령이 실행될 때(`save-plan` 포함) 이 플러그인이 사용자 메시지 part에 붙이는
   `metadata.litopencode` 표시. 표시가 없는 세션은 쉬는 상태로 보고, 기본 `lit-loop` agent여도 칩과
-  패널을 숨깁니다.
+  패널을 숨깁니다. `/litresearch` 같은 슬래시 명령은 OpenCode의 명령 hook으로 지도에 표시되므로
+  `litopencode install`이 쓰는 명령 파일이 있어야 합니다. `plugin` 항목만 있으면 OpenCode가 이를
+  평범한 글로 보내고, 지도에는 아무것도 표시되지 않습니다.
 - 세션의 OpenCode 할 일 목록(진행도와 다음 항목), 상태(재시도), 대기 중인 권한 요청과 질문, 마지막
   assistant 메시지 기준 context 사용량(75%부터 주황).
 - 프로젝트 루트의 `.litopencode/litgoal/lit-loop/goals.json`. 심볼릭 링크와 1 MiB가 넘는 파일은 읽지
-  않습니다. 세션의 첫 lit 턴보다 먼저 마지막으로 바뀐 목표는 이전 작업으로 보고 빼 둡니다.
+  않습니다. CLI가 쓰는 ledger 형태(`goals`와 `activeGoalId`) 말고도 에이전트가 직접 쓴 형태, 곧 맨 위의
+  목표 하나, `goal` 아래의 목표, `goals` 목록의 마지막 항목도 읽고, `completed`나 `done`은 통과한 기준이나
+  끝난 목표로 셉니다. 세션의 첫 lit 턴보다 먼저 마지막으로 바뀐 목표는 이전 작업으로 보고 빼 둡니다. 목표의
+  checkpoint 수가 기준 반복의 iter 수가 됩니다.
+- `/start-work`가 남기는 범위 작업 기록 `.litopencode/litgoal/lit-loop/work-schema-3.json`. 이 세션의
+  것이고 취소되지 않았을 때만 읽습니다. `work.progressed` 기록 수가 work 단계의 iter 수가 되고, 기록이
+  가리키는 계획 파일에서 맨 앞에 붙은 `- [ ]` / `- [x]` 줄을 세어 할 일 수와 다음 항목을 얻습니다.
+  계획 파일은 프로젝트 루트 안의 일반 파일일 때만 읽습니다.
+- `.litopencode/litgoal/lit-loop/research/` 아래에서 가장 최근에 쓴 실행 폴더. `report.md`가 있으면
+  synthesis, `claim-graph.jsonl`에 관문 결과(`verified`, `abstained`, `unresolved`, `refuted`)가 붙은
+  주장이 있으면 verify, `journal.md`의 마지막 제목이 `EXPAND`로 시작하면 expand, 주장이 있으면 wave(가장
+  큰 `wave` 값이나 `## Wave` 제목 수로 번호를 붙임), 아무것도 없으면 decompose입니다. 세션의 첫 lit
+  턴보다 먼저 쓴 폴더는 이전 작업으로 봅니다.
+- 지금 하는 일을 위해 세션의 마지막 assistant 메시지에서 실행 중인 도구 part. 도구 이름과 `time.start`만
+  씁니다.
 
 움직임은 전환이 일어나는 동안에만 짧은 프레임 타이머로 돌고 끝나면 멈춥니다. 새 줄과 알약은
 ease-out-back으로 160ms씩, 60ms 간격으로 들어오고, 막대는 300ms에 차오릅니다. 경고 줄은 220ms에
-걸쳐 들어오고 색은 140ms 동안 넘어가며, 빛이 지나가는 데는 400ms가 걸립니다. lit 세션이
-열려 있는 동안만 2초마다 목표 ledger를 다시 읽고, 쉬는 세션은 읽지 않습니다. 색은 지금 OpenCode
+걸쳐 들어오고 색은 140ms 동안 넘어가며, 빛이 지나가는 데는 400ms가 걸립니다. 지도가 다음 단계로
+넘어가면 옛 단계와 새 단계 사이의 세로 선이 위에서 아래로 60ms 간격으로 차오르고, 지금 단계 알약이
+한 번 빛납니다. 계속 도는 움직임은 없습니다. 지금 하는 일은 미끄러져 들어오지 않고 제자리에서
+바뀌며, 도구가 도는 동안에만 걸린 시간이 1초에 한 번 바뀝니다. 도는 도구가 없으면 타이머도
+없습니다. lit 세션이 열려 있는 동안만 2초마다 목표 ledger, 범위 작업 기록, 조사 폴더를 다시 읽고,
+쉬는 세션은 읽지 않습니다. 색은 지금 OpenCode
 테마에서 가져옵니다. 움직임을 끄려면 `tui.json`에 `["@litfamily/litopencode@<version>", { "motion": false }]`
 처럼 적고, 플러그인 자체를 끄려면 OpenCode 플러그인 관리자나 `plugin_enabled`에서 id `litopencode`를 끕니다.
 
@@ -326,6 +372,11 @@ ease-out-back으로 160ms씩, 60ms 간격으로 들어오고, 막대는 300ms에
   목표가 있는 동안 카드는 네 줄로 고정되어, 경고가 생기거나 사라져도 입력창이 움직이지 않습니다.
   카드는 기본으로 꺼져 있습니다.
 
+끝 알림도 같은 객체에 적으며, 적지 않으면 꺼져 있습니다.
+
+- `{ "notify": true }`는 미션이 끝날 때 데스크톱 알림을 보내고 `done` 소리를 냅니다.
+- `{ "notify": { "sound": false } }`는 알림만, `{ "notify": { "desktop": false } }`는 소리만 남깁니다.
+
 다른 터미널에서 쓴 ledger(예: `litopencode record-evidence`)는 OpenCode 이벤트를 만들지 않습니다.
 그래서 2초마다 도는 공용 ledger 확인이 이를 잡고, 칩·패널·띠가 같은 프레임 시계로 함께 바뀝니다.