march-cli 0.1.39 → 0.1.40

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "march-cli",
-  "version": "0.1.39",
+  "version": "0.1.40",
   "description": "March CLI — terminal-native coding agent with context reconstruction",
   "type": "module",
   "main": "./src/main.mjs",

package/src/cli/input/keybindings.mjs

@@ -9,6 +9,7 @@ export const DEFAULT_KEYBINDINGS = Object.freeze({
   thinkingSelector: "Ctrl+T",
   modelSelector: "Ctrl+L",
   externalEditor: "Ctrl+G",
+  clearInput: "Ctrl+U",
   toggleToolOutput: "Ctrl+O",
   toggleShellDrawer: "Alt+S",
   nextShell: "Alt+N",
@@ -27,6 +28,7 @@ export const KEYBINDING_ACTIONS = Object.freeze({
   thinkingSelector: "Open thinking selector",
   modelSelector: "Open model selector",
   externalEditor: "Open external editor ($VISUAL or $EDITOR)",
+  clearInput: "Clear current input draft",
   toggleToolOutput: "Toggle tool output collapsed/expanded",
   toggleShellDrawer: "Toggle right-side shell pane",
   nextShell: "Select next shell in pane",

package/src/cli/startup/app-runtime.mjs

@@ -94,7 +94,7 @@ export async function createCliAppRuntime({ args, config, cwd, argv, stateRoot }
     ui,
     activeProjectId: currentProjectInfo.projectId,
     activeSessionId: sessionState.sessionId,
-    onRenderTimelineChange: persistRenderTimeline,
+    onPersistRenderTimeline: persistRenderTimeline,
   });
   const runtimeUi = outputRouter.createProjectUi(currentProjectInfo.projectId, () => sessionState.sessionId);
   let turnRunning = false;
@@ -213,8 +213,8 @@ export async function createCliAppRuntime({ args, config, cwd, argv, stateRoot }
   outputRouter.setActiveSession(currentProjectInfo.projectId, sessionState.sessionId, { renderTimeline: loadStoredRenderTimeline(projectMarchDir, sessionState.sessionId) });
   refreshStatusBar();
 
-  function persistRenderTimeline({ projectId, sessionId, events, event }) {
-    if (!sessionId || !shouldPersistRenderEvent(event?.method)) return;
+  function persistRenderTimeline({ projectId, sessionId, events }) {
+    if (!sessionId) return;
     const routeProjectMarchDir = projectMarchDirs.get(projectId);
     if (!routeProjectMarchDir) return;
     try {
@@ -259,10 +259,6 @@ function loadStoredRenderTimeline(projectMarchDir, sessionId) {
   }
 }
 
-function shouldPersistRenderEvent(method) {
-  return method === "turnEnd" || method === "assistantReplyEnd" || method === "toolEnd" || method === "writeln" || method === "clearOutput";
-}
-
 async function handleNotificationActivation({ activation, stateRoot, workspaceSupervisor, ui }) {
   if (activation?.type !== "workspace-session" || !activation.projectId) return;
   if (!workspaceSupervisor) throw new Error("workspace supervisor is not ready");

package/src/cli/tui/output/timeline-block-restore.mjs

@@ -0,0 +1,45 @@
+import { createToolCardBlock, writeToolEnd } from "../tool-rendering.mjs";
+import { formatRecallLines } from "../recall-rendering.mjs";
+
+export function restoreTimelineBlocksToOutputBuffer(output, blocks) {
+  output.clear();
+  for (const block of Array.isArray(blocks) ? blocks : []) appendTimelineBlock(output, block);
+  output.invalidate?.();
+}
+
+function appendTimelineBlock(output, block) {
+  if (!block || typeof block !== "object") return;
+  switch (block.type) {
+    case "assistant":
+      if (block.content) output.addBlock({ type: "markdown", text: String(block.content), sealed: Boolean(block.closed), cache: new Map() });
+      break;
+    case "thinking":
+      output.addBlock({ type: "thinking", tokens: block.tokens ?? 0, content: splitLines(block.content) });
+      break;
+    case "tool": {
+      const card = createToolCardBlock({ name: block.name, args: block.args });
+      output.addBlock(card);
+      if (block.closed) writeToolEnd({ output, name: block.name, isError: block.isError, result: block.result, toolBlock: card });
+      break;
+    }
+    case "output":
+      if (block.newline) output.writeln(String(block.content ?? ""));
+      else output.write(String(block.content ?? ""));
+      break;
+    case "status":
+      output.addBlock({ type: "status", lines: [String(block.content ?? "")] });
+      break;
+    case "recall":
+      output.addBlock({ type: "plain", lines: formatRecallLines(block.hints ?? []) });
+      break;
+    case "editDiff":
+      output.addBlock({ type: "diff", path: block.path, diffLines: block.diffLines ?? [] });
+      break;
+    default:
+      break;
+  }
+}
+
+function splitLines(value) {
+  return String(value ?? "").split("\n");
+}

package/src/cli/tui/output-buffer.mjs

@@ -2,6 +2,7 @@ import { brightBlack, dim } from "./ui-theme.mjs";
 import { renderToolCardBlock } from "./output/tool-card-renderer.mjs";
 import { renderMarkdown, renderStreamingMarkdown } from "./markdown-renderer.mjs";
 import { renderEditDiffBlock } from "./tui-diff-rendering.mjs";
+import { restoreTimelineBlocksToOutputBuffer } from "./output/timeline-block-restore.mjs";
 import { OutputScrollState } from "./output/scroll-state.mjs";
 import { appendTextLines, wrapLine } from "./output/text-line-renderer.mjs";
 import { appendSelectableEntries, copySourceTextForRange, sliceEntriesWithTail } from "./output/selectable-copy.mjs";
@@ -89,6 +90,10 @@ export class OutputBuffer {
     this._baseEntriesCache = new Map();
   }
 
+  restoreTimelineBlocks(blocks) {
+    restoreTimelineBlocksToOutputBuffer(this, blocks);
+  }
+
   write(text) { this._writeText(text, false); }
   writeMarkdown(text) { this._writeText(text, true); }
 

package/src/cli/tui/tui-input-controller.mjs

@@ -40,6 +40,14 @@ export function createTuiInputController({ editor, requestRender, historyStore =
       requestRender();
     },
 
+    clearInput() {
+      attachmentTokens.clear();
+      editor.lastAction = null;
+      editor.historyIndex = -1;
+      setEditorText("");
+      requestRender();
+    },
+
     insertAttachmentAtCursor({ marker, label }) {
       const token = uniqueAttachmentToken(label || "[image]", attachmentTokens);
       attachmentTokens.set(token, marker);
@@ -59,4 +67,12 @@ export function createTuiInputController({ editor, requestRender, historyStore =
       historyStore?.save?.(editor.history);
     } catch {}
   }
+
+  function setEditorText(text) {
+    if (typeof editor.setTextInternal === "function") {
+      editor.setTextInternal(text);
+      return;
+    }
+    editor.setText?.(text);
+  }
 }

package/src/cli/ui.mjs

@@ -87,6 +87,7 @@ export function createTuiUI({
       thinkingSelector: () => onCtrlTHandler?.(),
       modelSelector: () => onCtrlLHandler?.(),
       externalEditor: () => openExternalEditor(),
+      clearInput: () => inputController.clearInput(),
       toggleToolOutput: () => toggleToolOutput(),
       toggleShellDrawer: () => shellDrawerControls.toggle(),
       nextShell: () => shellDrawerControls.selectNext(),
@@ -216,10 +217,13 @@ export function createTuiUI({
     },
 
     clearOutput: () => {
-      ensureStarted(); flushStreamDeltas(); spinnerStatus.stop(); retryStatus.stop(); output.clear(); requestRender();
+      ensureStarted(); flushStreamDeltas(); spinnerStatus.stop(); retryStatus.stop(); activeToolBlocks.length = 0; output.clear(); requestRender();
+    },
+    restoreTimelineBlocks: (blocks) => {
+      ensureStarted(); flushStreamDeltas(); spinnerStatus.stop(); retryStatus.stop(); activeToolBlocks.length = 0; output.restoreTimelineBlocks(blocks); requestRender();
     },
     restoreTranscript: (turns) => {
-      ensureStarted(); flushStreamDeltas(); spinnerStatus.stop(); retryStatus.stop(); output.clear(); writeTranscriptToOutput(output, turns); requestRender();
+      ensureStarted(); flushStreamDeltas(); spinnerStatus.stop(); retryStatus.stop(); activeToolBlocks.length = 0; output.clear(); writeTranscriptToOutput(output, turns); requestRender();
     },
 
     setStatusBar: (text) => {

package/src/cli/workspace/output-router.mjs

@@ -1,3 +1,7 @@
+import { createTuiTimelineRegistry } from "./tui-timeline.mjs";
+
+const PERSIST_FLUSH_METHODS = new Set(["turnEnd", "assistantReplyEnd", "toolEnd"]);
+
 const RENDER_METHODS = new Set([
   "turnStart",
   "turnEnd",
@@ -19,11 +23,18 @@ const RENDER_METHODS = new Set([
   "clearOutput",
 ]);
 
-const MAX_RENDER_EVENTS_PER_ROUTE = 4000;
-
-export function createWorkspaceOutputRouter({ ui, activeProjectId, activeSessionId = null, onRenderTimelineChange = null }) {
+export function createWorkspaceOutputRouter({
+  ui,
+  activeProjectId,
+  activeSessionId = null,
+  onPersistRenderTimeline = null,
+  persistDebounceMs,
+} = {}) {
   let active = routeKey(activeProjectId, activeSessionId);
-  const timelines = new Map();
+  const timelineRegistry = createTuiTimelineRegistry({
+    persistDebounceMs,
+    onPersistTimeline: (change) => onPersistRenderTimeline?.({ ...parseRouteKey(change.key), ...change }),
+  });
 
   return {
     setActiveProject(projectId) {
@@ -31,8 +42,9 @@ export function createWorkspaceOutputRouter({ ui, activeProjectId, activeSession
     },
     setActiveSession(projectId, sessionId, { renderTimeline = null } = {}) {
       const next = routeKey(projectId, sessionId);
-      if (Array.isArray(renderTimeline)) setRenderEvents(next, renderTimeline);
+      timelineRegistry.ensure(next, { events: renderTimeline });
       if (next === active) return renderRoute(next);
+      timelineRegistry.flush(active, "session-switch");
       active = next;
       return renderRoute(next);
     },
@@ -72,43 +84,43 @@ export function createWorkspaceOutputRouter({ ui, activeProjectId, activeSession
       return renderRoute(active);
     },
     getRenderEvents(projectId, sessionId = null) {
-      return [...(timelines.get(routeKey(projectId, sessionId)) ?? [])];
+      return timelineRegistry.getEvents(routeKey(projectId, sessionId));
+    },
+    getRenderBlocks(projectId, sessionId = null) {
+      return timelineRegistry.getBlocks(routeKey(projectId, sessionId));
     },
     setRenderEvents(projectId, sessionId = null, events = []) {
-      setRenderEvents(routeKey(projectId, sessionId), events);
+      const key = routeKey(projectId, sessionId);
+      timelineRegistry.replaceEvents(key, events);
     },
     getRenderEventCount(projectId, sessionId = null) {
-      return timelines.get(routeKey(projectId, sessionId))?.length ?? 0;
+      return timelineRegistry.getEventCount(routeKey(projectId, sessionId));
+    },
+    getRenderTimelineMetadata(projectId, sessionId = null) {
+      return timelineRegistry.getMetadata(routeKey(projectId, sessionId));
+    },
+    flushRenderTimeline(projectId, sessionId = null, reason = "manual") {
+      return timelineRegistry.flush(routeKey(projectId, sessionId), reason);
+    },
+    flushAllRenderTimelines(reason = "manual") {
+      return timelineRegistry.flushAll(reason);
     },
   };
 
   function renderRoute(key) {
-    ui.clearOutput?.();
-    const events = timelines.get(key) ?? [];
-    for (const event of events) applyRenderEvent(event);
-    return events.length;
-  }
-
-  function applyRenderEvent({ method, args }) {
-    const value = ui[method];
-    if (typeof value === "function") value.apply(ui, args);
+    const timeline = timelineRegistry.ensure(key);
+    if (typeof ui.restoreTimelineBlocks !== "function") ui.clearOutput?.();
+    return timeline.replayTo(ui);
   }
 
   function recordRenderEvent(key, method, args) {
     if (method === "clearOutput") {
-      timelines.delete(key);
-      onRenderTimelineChange?.({ ...parseRouteKey(key), events: [], event: { method, args } });
+      timelineRegistry.clear(key);
       return;
     }
-    const events = timelines.get(key) ?? [];
-    events.push({ method, args, at: Date.now() });
-    if (events.length > MAX_RENDER_EVENTS_PER_ROUTE) events.splice(0, events.length - MAX_RENDER_EVENTS_PER_ROUTE);
-    timelines.set(key, events);
-    onRenderTimelineChange?.({ ...parseRouteKey(key), events: [...events], event: { method, args } });
-  }
-
-  function setRenderEvents(key, events) {
-    timelines.set(key, normalizeRenderEvents(events));
+    const timeline = timelineRegistry.ensure(key);
+    timeline.apply(method, args);
+    if (PERSIST_FLUSH_METHODS.has(method)) timeline.flushPersist(method);
   }
 }
 
@@ -120,8 +132,3 @@ function parseRouteKey(key) {
   const [projectId, sessionId = ""] = String(key ?? "").split(":", 2);
   return { projectId: projectId || null, sessionId: sessionId || null };
 }
-
-function normalizeRenderEvents(events) {
-  if (!Array.isArray(events)) return [];
-  return events.filter((event) => typeof event?.method === "string" && Array.isArray(event.args));
-}

package/src/cli/workspace/tui-timeline-projection.mjs

@@ -0,0 +1,179 @@
+export function createTuiTimelineProjection() {
+  let blocks = [];
+  let openAssistantBlock = null;
+  let openThinkingBlock = null;
+  let openToolBlocks = [];
+  let nextBlockIndex = 1;
+
+  return {
+    apply(event) {
+      applyProjectionEvent(event);
+    },
+    rebuild(events) {
+      resetProjection();
+      for (const event of events) applyProjectionEvent(event);
+    },
+    clear() {
+      resetProjection();
+    },
+    getBlocks() {
+      return blocks.map((block) => structuredCloneSafe(block));
+    },
+    getMetadata() {
+      return {
+        blockCount: blocks.length,
+        openAssistant: Boolean(openAssistantBlock),
+        openThinking: Boolean(openThinkingBlock),
+        openToolCount: openToolBlocks.length,
+      };
+    },
+  };
+
+  function applyProjectionEvent(event) {
+    const [first, second, third] = event.args ?? [];
+    switch (event.method) {
+      case "turnStart":
+        closeAssistantBlock();
+        blocks.push(createBlock("turn", event.at, { phase: "start" }));
+        break;
+      case "turnEnd":
+        closeAssistantBlock(event.at);
+        closeThinkingBlock(event.at);
+        blocks.push(createBlock("turn", event.at, { phase: "end" }));
+        break;
+      case "textDelta":
+        ensureAssistantBlock(event.at).content += String(first ?? "");
+        touchBlock(openAssistantBlock, event.at);
+        break;
+      case "assistantReplyEnd":
+        closeAssistantBlock(event.at);
+        break;
+      case "thinkingStart":
+        closeThinkingBlock(event.at);
+        openThinkingBlock = createBlock("thinking", event.at, { content: "", closed: false });
+        blocks.push(openThinkingBlock);
+        break;
+      case "thinkingDelta":
+        ensureThinkingBlock(event.at).content += String(first ?? "");
+        touchBlock(openThinkingBlock, event.at);
+        break;
+      case "thinkingEnd":
+        ensureThinkingBlock(event.at).tokens = first ?? null;
+        closeThinkingBlock(event.at);
+        break;
+      case "thinkingBlock":
+        closeThinkingBlock(event.at);
+        blocks.push(createBlock("thinking", event.at, { tokens: first ?? null, content: String(second ?? ""), closed: true }));
+        break;
+      case "toolStart": {
+        closeAssistantBlock(event.at);
+        const block = createBlock("tool", event.at, { name: first ?? null, args: second ?? null, result: null, isError: false, closed: false });
+        blocks.push(block);
+        openToolBlocks.push(block);
+        break;
+      }
+      case "toolEnd": {
+        const block = popOpenToolBlock(first);
+        if (block) {
+          block.name ??= first ?? null;
+          block.isError = Boolean(second);
+          block.result = third ?? null;
+          block.closed = true;
+          touchBlock(block, event.at);
+        } else {
+          blocks.push(createBlock("tool", event.at, { name: first ?? null, isError: Boolean(second), result: third ?? null, closed: true }));
+        }
+        break;
+      }
+      case "write":
+      case "writeln":
+        closeAssistantBlock(event.at);
+        blocks.push(createBlock("output", event.at, { content: String(first ?? ""), newline: event.method === "writeln" }));
+        break;
+      case "status":
+        blocks.push(createBlock("status", event.at, { content: String(first ?? "") }));
+        break;
+      case "recall":
+        blocks.push(createBlock("recall", event.at, { hints: first?.hints ?? [] }));
+        break;
+      case "editDiff":
+        closeAssistantBlock(event.at);
+        blocks.push(createBlock("editDiff", event.at, { path: first ?? null, diffLines: second ?? [] }));
+        break;
+      case "retryStart":
+      case "retryEnd":
+        blocks.push(createBlock("retry", event.at, { method: event.method, payload: first ?? null }));
+        break;
+      default:
+        blocks.push(createBlock("event", event.at, { method: event.method, args: event.args ?? [] }));
+        break;
+    }
+  }
+
+  function ensureAssistantBlock(at) {
+    if (!openAssistantBlock) {
+      openAssistantBlock = createBlock("assistant", at, { content: "", closed: false });
+      blocks.push(openAssistantBlock);
+    }
+    return openAssistantBlock;
+  }
+
+  function closeAssistantBlock(at = null) {
+    if (!openAssistantBlock) return;
+    openAssistantBlock.closed = true;
+    touchBlock(openAssistantBlock, at);
+    openAssistantBlock = null;
+  }
+
+  function ensureThinkingBlock(at) {
+    if (!openThinkingBlock) {
+      openThinkingBlock = createBlock("thinking", at, { content: "", closed: false });
+      blocks.push(openThinkingBlock);
+    }
+    return openThinkingBlock;
+  }
+
+  function closeThinkingBlock(at = null) {
+    if (!openThinkingBlock) return;
+    openThinkingBlock.closed = true;
+    touchBlock(openThinkingBlock, at);
+    openThinkingBlock = null;
+  }
+
+  function popOpenToolBlock(name) {
+    if (openToolBlocks.length === 0) return null;
+    if (name == null) return openToolBlocks.pop();
+    const index = findLastIndex(openToolBlocks, (block) => block.name === name);
+    if (index < 0) return openToolBlocks.pop();
+    return openToolBlocks.splice(index, 1)[0];
+  }
+  function resetProjection() {
+    blocks = [];
+    openAssistantBlock = null;
+    openThinkingBlock = null;
+    openToolBlocks = [];
+    nextBlockIndex = 1;
+  }
+
+  function createBlock(type, at, fields = {}) {
+    const id = `${type}-${nextBlockIndex++}`;
+    return { id, type, createdAt: at ?? null, updatedAt: at ?? null, ...fields };
+  }
+}
+
+function touchBlock(block, at = null) {
+  if (!block || at == null) return;
+  block.updatedAt = at;
+}
+
+function findLastIndex(items, predicate) {
+  for (let index = items.length - 1; index >= 0; index -= 1) {
+    if (predicate(items[index], index)) return index;
+  }
+  return -1;
+}
+
+function structuredCloneSafe(value) {
+  if (typeof structuredClone === "function") return structuredClone(value);
+  return JSON.parse(JSON.stringify(value));
+}

package/src/cli/workspace/tui-timeline.mjs

@@ -0,0 +1,247 @@
+import { createTuiTimelineProjection } from "./tui-timeline-projection.mjs";
+
+export const DEFAULT_MAX_TIMELINE_EVENTS = 4000;
+export const DEFAULT_TIMELINE_PERSIST_DEBOUNCE_MS = 250;
+
+export function createTuiTimelineRegistry({
+  maxEventsPerTimeline = DEFAULT_MAX_TIMELINE_EVENTS,
+  persistDebounceMs = DEFAULT_TIMELINE_PERSIST_DEBOUNCE_MS,
+  onPersistTimeline = null,
+} = {}) {
+  const timelines = new Map();
+
+  return {
+    ensure(key, { events = null } = {}) {
+      let timeline = timelines.get(key);
+      if (!timeline) {
+        timeline = createTuiTimelineInstance({
+          key,
+          maxEvents: maxEventsPerTimeline,
+          persistDebounceMs,
+          onPersist: onPersistTimeline,
+        });
+        timelines.set(key, timeline);
+      }
+      if (Array.isArray(events)) timeline.hydrateIfEmpty(events);
+      return timeline;
+    },
+    get(key) {
+      return timelines.get(key) ?? null;
+    },
+    has(key) {
+      return timelines.has(key);
+    },
+    clear(key, options) {
+      const timeline = this.ensure(key);
+      timeline.clear(options);
+      return timeline;
+    },
+    flush(key, reason = "manual") {
+      return this.get(key)?.flushPersist(reason) ?? false;
+    },
+    flushAll(reason = "manual") {
+      let flushed = 0;
+      for (const timeline of timelines.values()) {
+        if (timeline.flushPersist(reason)) flushed += 1;
+      }
+      return flushed;
+    },
+    replaceEvents(key, events) {
+      const timeline = this.ensure(key);
+      timeline.replaceEvents(events);
+      return timeline;
+    },
+    getEvents(key) {
+      return this.get(key)?.getEvents() ?? [];
+    },
+    getBlocks(key) {
+      return this.get(key)?.getBlocks() ?? [];
+    },
+    getEventCount(key) {
+      return this.get(key)?.getEventCount() ?? 0;
+    },
+    getMetadata(key) {
+      return this.get(key)?.getMetadata() ?? null;
+    },
+  };
+}
+
+export function createTuiTimelineInstance({
+  key,
+  maxEvents = DEFAULT_MAX_TIMELINE_EVENTS,
+  persistDebounceMs = DEFAULT_TIMELINE_PERSIST_DEBOUNCE_MS,
+  onPersist = null,
+} = {}) {
+  let events = [];
+  const projection = createTuiTimelineProjection();
+  let hydrated = false;
+  let dirty = false;
+  let lastAccessedAt = Date.now();
+  let lastUpdatedAt = null;
+  let lastPersistedAt = null;
+  let estimatedBytes = 0;
+  let persistTimer = null;
+
+  return {
+    key,
+    apply(method, args, { at = Date.now(), persist = true } = {}) {
+      touch();
+      const event = { method, args, at };
+      events.push(event);
+      projection.apply(event);
+      trimToBudget();
+      dirty = true;
+      lastUpdatedAt = at;
+      if (persist) schedulePersist("debounce");
+      return event;
+    },
+    hydrateIfEmpty(nextEvents) {
+      touch();
+      if (events.length > 0) return false;
+      replaceEvents(nextEvents, { markHydrated: true });
+      return true;
+    },
+    replaceEvents(nextEvents) {
+      touch();
+      replaceEvents(nextEvents, { markHydrated: false });
+    },
+    clear({ flush = true } = {}) {
+      touch();
+      events = [];
+      projection.clear();
+      dirty = true;
+      lastUpdatedAt = Date.now();
+      estimatedBytes = 0;
+      if (flush) this.flushPersist("clear");
+      else schedulePersist("debounce");
+    },
+    replayTo(ui) {
+      touch();
+      if (typeof ui.restoreTimelineBlocks === "function") {
+        const blocks = projection.getBlocks();
+        ui.restoreTimelineBlocks(blocks);
+        return blocks.length;
+      }
+      for (const event of events) applyRenderEvent(ui, event);
+      return events.length;
+    },
+    flushPersist(reason = "manual") {
+      clearPersistTimer();
+      if (!dirty || typeof onPersist !== "function") return false;
+      onPersist({ key, events: this.getEvents(), reason, timeline: this.getMetadata() });
+      dirty = false;
+      lastPersistedAt = Date.now();
+      return true;
+    },
+    getEvents() {
+      touch();
+      return cloneEvents(events);
+    },
+    getBlocks() {
+      touch();
+      return projection.getBlocks();
+    },
+    getEventCount() {
+      return events.length;
+    },
+    markPersisted() {
+      clearPersistTimer();
+      dirty = false;
+      lastPersistedAt = Date.now();
+    },
+    getMetadata() {
+      return buildMetadata();
+    },
+  };
+
+  function schedulePersist(reason) {
+    if (typeof onPersist !== "function") return;
+    clearPersistTimer();
+    persistTimer = setTimeout(() => {
+      persistTimer = null;
+      if (!dirty) return;
+      onPersist({ key, events: cloneEvents(events), reason, timeline: buildMetadata() });
+      dirty = false;
+      lastPersistedAt = Date.now();
+    }, Math.max(0, persistDebounceMs));
+    persistTimer.unref?.();
+  }
+
+  function clearPersistTimer() {
+    if (!persistTimer) return;
+    clearTimeout(persistTimer);
+    persistTimer = null;
+  }
+
+  function replaceEvents(nextEvents, { markHydrated }) {
+    clearPersistTimer();
+    events = normalizeTimelineEvents(nextEvents);
+    trimToBudget();
+    rebuildProjection();
+    hydrated = markHydrated;
+    dirty = false;
+    lastUpdatedAt = events.at(-1)?.at ?? null;
+    lastPersistedAt = null;
+    updateEstimatedBytes();
+  }
+
+  function trimToBudget() {
+    if (events.length > maxEvents) {
+      events.splice(0, events.length - maxEvents);
+      rebuildProjection();
+    }
+    updateEstimatedBytes();
+  }
+
+  function rebuildProjection() {
+    projection.rebuild(events);
+  }
+
+  function updateEstimatedBytes() {
+    estimatedBytes = estimateJsonBytes(events) + estimateJsonBytes(projection.getBlocks());
+  }
+
+  function touch() {
+    lastAccessedAt = Date.now();
+  }
+
+  function buildMetadata() {
+    return {
+      key,
+      eventCount: events.length,
+      maxEvents,
+      hydrated,
+      dirty,
+      lastAccessedAt,
+      lastUpdatedAt,
+      lastPersistedAt,
+      estimatedBytes,
+      persistScheduled: Boolean(persistTimer),
+      ...projection.getMetadata(),
+    };
+  }
+}
+
+export function normalizeTimelineEvents(events) {
+  if (!Array.isArray(events)) return [];
+  return events
+    .filter((event) => typeof event?.method === "string" && Array.isArray(event.args))
+    .map((event) => ({ method: event.method, args: event.args, at: event.at ?? null }));
+}
+
+function applyRenderEvent(ui, { method, args }) {
+  const value = ui[method];
+  if (typeof value === "function") value.apply(ui, args);
+}
+
+function cloneEvents(items) {
+  return items.map((event) => ({ method: event.method, args: event.args, at: event.at ?? null }));
+}
+
+function estimateJsonBytes(value) {
+  try {
+    return JSON.stringify(value).length;
+  } catch {
+    return 0;
+  }
+}

package/src/session/state/march-session-state.mjs

@@ -45,7 +45,7 @@ export function saveMarchSessionState({ projectMarchDir, sessionId, engine, back
 export function saveMarchSessionStateValue({ projectMarchDir, sessionId, state }) {
   if (!sessionId) throw new Error("March session id is required");
   const existing = loadMarchSessionState({ projectMarchDir, sessionId })?.state ?? null;
-  const nextState = normalizeMarchSessionStateForSave({ ...existing, ...state, renderTimeline: state.renderTimeline ?? existing?.renderTimeline });
+  const nextState = normalizeMarchSessionStateForSave({ ...existing, ...state });
   validateMarchSessionState(nextState);
   const dir = getMarchSessionStateDir(projectMarchDir, sessionId);
   mkdirSync(dir, { recursive: true });
@@ -135,22 +135,12 @@ function validateMarchSessionState(state) {
 function isValidMarchSessionState(state) {
   return state?.version === MARCH_SESSION_STATE_VERSION
     && Boolean(state.cwd)
-    && Array.isArray(state.turns)
-    && Array.isArray(state.renderTimeline);
+    && Array.isArray(state.turns);
 }
 
 function normalizeMarchSessionStateForSave(state) {
-  return {
-    ...state,
-    renderTimeline: normalizePersistedRenderTimeline(state.renderTimeline),
-  };
-}
-
-function normalizePersistedRenderTimeline(events) {
-  if (!Array.isArray(events)) return [];
-  return events
-    .filter((event) => typeof event?.method === "string" && Array.isArray(event.args))
-    .map((event) => ({ method: event.method, args: event.args, at: event.at ?? null }));
+  const { renderTimeline: _renderTimeline, renderTimelineUpdatedAt: _renderTimelineUpdatedAt, ...coreState } = state ?? {};
+  return coreState;
 }
 
 function normalizeSessionRef(sessionRef) {

package/src/session/state/march-session-ui-state.mjs

@@ -1,29 +1,45 @@
-import { existsSync, readFileSync } from "node:fs";
-import { getMarchSessionStatePath, loadMarchSessionState, saveMarchSessionStateValue } from "./march-session-state.mjs";
+import { existsSync, mkdirSync, readFileSync, writeFileSync } from "node:fs";
+import { dirname, join } from "node:path";
+import { getMarchSessionStatePath, loadMarchSessionState, normalizeSessionId } from "./march-session-state.mjs";
+
+export const TUI_SESSION_TIMELINE_VERSION = 1;
+
+export function getTuiSessionUiStateRoot(projectMarchDir) {
+  return join(projectMarchDir, "ui", "tui", "sessions");
+}
+
+export function getTuiSessionTimelinePath(projectMarchDir, sessionId) {
+  return join(getTuiSessionUiStateRoot(projectMarchDir), normalizeSessionId(sessionId), "timeline.json");
+}
 
 export function loadMarchSessionRenderTimeline({ projectMarchDir, sessionId }) {
-  const persistedRender = readPersistedRenderTimelineInfo({ projectMarchDir, sessionId });
+  const tuiTimeline = loadTuiRenderTimeline({ projectMarchDir, sessionId });
+  if (tuiTimeline) return tuiTimeline;
+
+  const legacyTimeline = loadLegacyCoreRenderTimeline({ projectMarchDir, sessionId });
+  if (legacyTimeline) return legacyTimeline;
+
   const stored = loadMarchSessionState({ projectMarchDir, sessionId });
   if (!stored) return null;
-  const renderTimeline = normalizeSessionRenderTimeline(stored.state.renderTimeline);
   return {
     path: stored.path,
-    renderTimeline: persistedRender.hasUiOwnedTimeline ? renderTimeline : renderTimelineFromTurns(stored.state.turns ?? []),
+    renderTimeline: renderTimelineFromTurns(stored.state.turns ?? []),
+    source: "core-turns",
   };
 }
 
 export function saveMarchSessionRenderTimeline({ projectMarchDir, sessionId, renderTimeline }) {
-  const stored = loadMarchSessionState({ projectMarchDir, sessionId });
-  if (!stored) return null;
-  return saveMarchSessionStateValue({
-    projectMarchDir,
+  if (!sessionId) throw new Error("March session id is required");
+  const state = {
+    version: TUI_SESSION_TIMELINE_VERSION,
+    savedAt: new Date().toISOString(),
     sessionId,
-    state: {
-      ...stored.state,
-      renderTimeline: normalizeSessionRenderTimeline(renderTimeline),
-      renderTimelineUpdatedAt: new Date().toISOString(),
-    },
-  });
+    renderTimeline: normalizeSessionRenderTimeline(renderTimeline),
+  };
+  const path = getTuiSessionTimelinePath(projectMarchDir, sessionId);
+  mkdirSync(dirname(path), { recursive: true });
+  writeFileSync(path, JSON.stringify(state, null, 2), "utf8");
+  return { path, renderTimeline: state.renderTimeline, state };
 }
 
 export function normalizeSessionRenderTimeline(events) {
@@ -33,15 +49,28 @@ export function normalizeSessionRenderTimeline(events) {
     .map((event) => ({ method: event.method, args: event.args, at: event.at ?? null }));
 }
 
-function readPersistedRenderTimelineInfo({ projectMarchDir, sessionId }) {
+function loadTuiRenderTimeline({ projectMarchDir, sessionId }) {
+  try {
+    const path = getTuiSessionTimelinePath(projectMarchDir, sessionId);
+    if (!existsSync(path)) return null;
+    const state = JSON.parse(readFileSync(path, "utf8"));
+    if (state?.version !== TUI_SESSION_TIMELINE_VERSION) return null;
+    return { path, renderTimeline: normalizeSessionRenderTimeline(state.renderTimeline), source: "tui" };
+  } catch {
+    return null;
+  }
+}
+
+function loadLegacyCoreRenderTimeline({ projectMarchDir, sessionId }) {
   try {
     const path = getMarchSessionStatePath(projectMarchDir, sessionId);
-    if (!existsSync(path)) return { hasUiOwnedTimeline: false };
+    if (!existsSync(path)) return null;
     const raw = JSON.parse(readFileSync(path, "utf8"));
     const rawTimeline = normalizeSessionRenderTimeline(raw.renderTimeline);
-    return { hasUiOwnedTimeline: Boolean(raw.renderTimelineUpdatedAt) || rawTimeline.length > 0 };
+    if (!raw.renderTimelineUpdatedAt && rawTimeline.length === 0) return null;
+    return { path, renderTimeline: rawTimeline, source: "legacy-core-render" };
   } catch {
-    return { hasUiOwnedTimeline: false };
+    return null;
   }
 }
 

package/src/workspace/supervisor.mjs

@@ -96,12 +96,13 @@ export function createWorkspaceSessionSupervisor({ initialRuntime, createProject
     let runtime = session?.id ? runtimes.get(runtimeKey(project.projectId, session.id)) : findIdleRuntime(project.projectId);
     if (!runtime) runtime = await createProjectRuntime(project);
 
+    const targetSessionId = session?.id ?? null;
     let restoreState = null;
-    if (session?.path && getRuntimeSessionId(runtime) !== session.id) {
+    if (session?.path && getRuntimeSessionId(runtime) !== targetSessionId) {
       restoreState = loadWorkspaceMarchSessionState({ runtime, session });
       await runtime.runner.switchPiSession(session.path, restoreState);
-      syncSessionState(runtime, session.id);
     }
+    if (targetSessionId) syncSessionState(runtime, targetSessionId);
 
     active = runtime;
     rememberRuntime(runtime);
@@ -153,12 +154,11 @@ function loadWorkspaceMarchSessionState({ runtime, session }) {
   if (stored.state.cwd && stored.state.cwd !== runtime.runner.engine.cwd) {
     throw new Error(`March session state cwd mismatch for ${session.id}: ${stored.state.cwd}`);
   }
-  const { renderTimeline: _renderTimeline, ...contextState } = stored.state;
-  return contextState;
+  return stored.state;
 }
 
 function getRuntimeSessionId(runtime) {
-  return runtime.runner.getSessionStats?.()?.sessionId ?? runtime.sessionState?.sessionId ?? null;
+  return runtime.sessionState?.sessionId ?? runtime.runner.getSessionStats?.()?.sessionId ?? null;
 }
 
 function syncSessionState(runtime, sessionId) {