@runtypelabs/persona 4.29.0 → 4.29.2

package/src/ui.ts

@@ -1,3 +1,4 @@
+import { isBrowserLocalApproval } from "./utils/restored-browser-state";
 import { activityVariant, activityDuration, createActivityLifecycle, createActivityGroup } from "./components/activity-row";
 import { applyStatusIndicatorState, placeStatusIndicator } from "./utils/status-indicator";
 import { usesSessionVoice } from "./utils/voice-support";
@@ -331,7 +332,8 @@ import {
   defaultActionHandlers,
   defaultJsonActionParser
 } from "./utils/actions";
-import { createLocalStorageAdapter } from "./utils/storage";
+import { createLocalStorageAdapter, transcriptStorageKey } from "./utils/storage";
+import { isLocalOnlyMessage } from "./utils/local-only-message";
 import { createVisitorStore, type VisitorStore } from "./utils/visitor-store";
 import { loadHistoryView } from "./history-view-loader";
 import { getHistoryShellSync, loadHistoryShell, type HistoryShellModule } from "./history-shell-loader";
@@ -501,11 +503,13 @@ const ensureRecord = (value: unknown): Record<string, unknown> => {
   return { ...(value as Record<string, unknown>) };
 };
 
-const stripStreamingFromMessages = (messages: AgentWidgetMessage[]) =>
-  messages.map((message) => ({
-    ...message,
-    streaming: false
-  }));
+const messagesForStorage = (messages: AgentWidgetMessage[]) =>
+  messages
+    .filter((message) => !isLocalOnlyMessage(message))
+    .map((message) => ({
+      ...message,
+      streaming: false
+    }));
 
 type Controller = {
   update: (config: AgentWidgetConfigPatch) => void;
@@ -1064,7 +1068,12 @@ export const createAgentExperience = (
   const storageAdapter: AgentWidgetStorageAdapter | null =
     messagePersistenceDisabled
       ? null
-      : (config.storageAdapter ?? createLocalStorageAdapter());
+      : (config.storageAdapter ??
+        createLocalStorageAdapter(
+          transcriptStorageKey(
+            typeof config.persistState === "object" ? config.persistState.keyPrefix : undefined
+          )
+        ));
   const personaOwnsClientTokenRecovery =
     Boolean(config.clientToken) && typeof config.reconnectStream !== "function";
   let persistentMetadata: Record<string, unknown> = {};
@@ -3055,8 +3064,8 @@ export const createAgentExperience = (
 
     // WebMCP gate approvals resolve a local Promise the bridge is parked on
     // (no server round-trip); server-driven approvals call the API. The
-    // `toolType` marker set in `requestWebMcpApproval` discriminates the two.
-    if (approvalMessage.approval.toolType === "webmcp") {
+    // `toolType` marker and absent execution id identify browser-local gates.
+    if (isBrowserLocalApproval(approvalMessage.approval)) {
       session.resolveWebMcpApproval(messageId, decision);
     } else {
       session.resolveApproval(approvalMessage.approval, decision);
@@ -4926,6 +4935,13 @@ export const createAgentExperience = (
 
   let isStreaming = false;
   const messageCache = createMessageCache();
+  // Assistant message ids seen streaming in a coalesced (never-applied)
+  // transcript snapshot; see `coalesceStreamingChange`.
+  const coalescedStreamingIds = new Set<string>();
+  // Fingerprint each live transcript row was last morphed to, by message id.
+  // A row whose message still has that fingerprint is left in place by the
+  // next render pass instead of being cloned from the cache and re-morphed.
+  let liveRowFingerprints = new Map<string, string>();
   // Tracks the last fingerprint we rendered a plugin-rendered ask_user_question
   // bubble for, per message id. Lets us skip unnecessary rebuilds across
   // re-renders so user state inside the plugin (typed text, focus) survives.
@@ -5159,7 +5175,7 @@ export const createAgentExperience = (
 
   const getMessagesForPersistence = () =>
     session
-      ? stripStreamingFromMessages(session.getMessages()).filter(msg => !(msg as any).__skipPersist)
+      ? messagesForStorage(session.getMessages()).filter(msg => !(msg as any).__skipPersist)
       : [];
 
   let storageMutationTail: Promise<void> | null = null;
@@ -5209,7 +5225,7 @@ export const createAgentExperience = (
 
     // Allow saving even if session doesn't exist yet (for metadata during init)
     const messages = messagesOverride
-      ? stripStreamingFromMessages(messagesOverride)
+      ? messagesForStorage(messagesOverride)
       : session
         ? getMessagesForPersistence()
         : [];
@@ -6020,7 +6036,7 @@ export const createAgentExperience = (
 
       if (
         message.role === "assistant" &&
-        previous?.streaming &&
+        (previous?.streaming || coalescedStreamingIds.has(message.id)) &&
         message.streaming === false
       ) {
         eventBus.emit("assistant:complete", message);
@@ -6040,6 +6056,7 @@ export const createAgentExperience = (
     nextState.forEach((value, key) => {
       messageState.set(key, value);
     });
+    coalescedStreamingIds.clear();
   };
 
 
@@ -6106,6 +6123,21 @@ export const createAgentExperience = (
     // Build new content in a temporary container for morphing
     const tempContainer = document.createElement("div");
 
+    // Unchanged messages keep their live row: the pass appends an empty
+    // `data-persona-reuse` stub that `morphMessages` matches by id and skips,
+    // so a render costs O(changed rows) rather than a deep clone, serialize,
+    // and morph of the whole transcript. Tool grouping restyles and re-parents
+    // rows after this loop, so grouped transcripts always rebuild.
+    const reuseLiveRows = !config.features?.toolCallDisplay?.grouped;
+    const liveRows = new Set<string>();
+    if (reuseLiveRows) {
+      for (const child of Array.from(container.children)) {
+        const id = child.getAttribute("data-wrapper-id");
+        if (id) liveRows.add(id);
+      }
+    }
+    const nextLiveRowFingerprints = new Map<string, string>();
+
     // Create inline loading indicator renderer using priority chain: plugin -> config -> default
     const getInlineLoadingIndicatorRenderer = (): LoadingIndicatorRenderer | undefined => {
       // Check if any plugin has renderLoadingIndicator
@@ -6239,7 +6271,8 @@ export const createAgentExperience = (
       return (
         dropCompletedToolCalls &&
         message.variant === "tool" &&
-        message.toolCall?.status === "complete"
+        message.toolCall?.status === "complete" &&
+        !message.toolCall.interrupted
       );
     };
 
@@ -6318,7 +6351,19 @@ export const createAgentExperience = (
         ? null
         : getCachedWrapper(messageCache, message.id, fingerprint);
       if (cachedWrapper) {
-        tempContainer.appendChild(cachedWrapper.cloneNode(true));
+        if (
+          liveRows.has(message.id) &&
+          liveRowFingerprints.get(message.id) === fingerprint
+        ) {
+          const stub = document.createElement("div");
+          stub.id = `wrapper-${message.id}`;
+          stub.setAttribute("data-wrapper-id", message.id);
+          stub.setAttribute("data-persona-reuse", "true");
+          tempContainer.appendChild(stub);
+        } else {
+          tempContainer.appendChild(cachedWrapper.cloneNode(true));
+        }
+        if (reuseLiveRows) nextLiveRowFingerprints.set(message.id, fingerprint);
         // Keep the overlay sheet alive only while the server is actively
         // waiting on the user (awaitingLocalTool === true). Before await
         // fires, or after the answer resumes the flow, omit from
@@ -6507,7 +6552,7 @@ export const createAgentExperience = (
               ?.getMessages()
               .find((m) => m.id === approvalMessageId);
             if (!live?.approval) return;
-            if (live.approval.toolType === "webmcp") {
+            if (isBrowserLocalApproval(live.approval)) {
               sessionRef.current?.resolveWebMcpApproval(live.id, decision);
             } else {
               sessionRef.current?.resolveApproval(live.approval, decision, options);
@@ -6774,6 +6819,7 @@ export const createAgentExperience = (
       wrapper.appendChild(bubble);
       setCachedWrapper(messageCache, message.id, fingerprint, wrapper);
       tempContainer.appendChild(wrapper);
+      if (reuseLiveRows) nextLiveRowFingerprints.set(message.id, fingerprint);
     });
 
     // Prune any ask_user_question sheets whose source message is no longer in
@@ -6801,7 +6847,7 @@ export const createAgentExperience = (
           // A tool call hidden by `completedVisibility: "removed"` does not
           // create a visible break in the transcript, so it should not split
           // an otherwise contiguous group.
-          if (dropCompletedToolCalls && message.toolCall.status === "complete") {
+          if (dropCompletedToolCalls && message.toolCall.status === "complete" && !message.toolCall.interrupted) {
             return;
           }
           currentGroup.push(message);
@@ -6859,10 +6905,12 @@ export const createAgentExperience = (
             id, name: `${group.length} tools`, status: active ? "running" : "complete",
             chunks: group.flatMap(item => item.toolCall?.chunks ?? []),
             success: !group.some(item => item.toolCall?.success === false),
+            interrupted: !active && group.some(item => item.toolCall?.interrupted),
           } };
           activityIds.add(id);
           activityLifecycle.observe(synthetic, "tool", toolExpansionState, config.features.toolCallDisplay);
-          const label = `${active ? "Using" : "Used"} ${group.length} tools`;
+          const label = synthetic.toolCall?.interrupted ? `${group.length} tools · Interrupted`
+            : `${active ? "Using" : "Used"} ${group.length} tools`;
           const custom = config.toolCall?.renderGroupedSummary?.({ messages: group, toolCalls: group.map(item => item.toolCall!), defaultSummary: label, config });
           const row = createActivityGroup(synthetic, config, toolExpansionState.has(id), custom ?? label);
           row.bubble.classList.add("persona-tool-group");
@@ -6888,7 +6936,9 @@ export const createAgentExperience = (
           "persona-tool-group-summary persona-text-xs persona-text-persona-muted";
         summary.id = `tool-group-summary-${group[0].id}`;
 
-        const defaultSummary = `Called ${group.length} ${group.length === 1 ? "tool" : "tools"}`;
+        const toolCount = `${group.length} ${group.length === 1 ? "tool" : "tools"}`;
+        const defaultSummary = group.some(item => item.toolCall?.interrupted)
+          ? `${toolCount} · Interrupted` : `Called ${toolCount}`;
         const renderedSummary = config.toolCall?.renderGroupedSummary?.({
           messages: group,
           toolCalls: group
@@ -7106,6 +7156,16 @@ export const createAgentExperience = (
 
     // Use idiomorph to morph the container contents
     morphMessages(container, tempContainer);
+    liveRowFingerprints = nextLiveRowFingerprints;
+    // A stub idiomorph inserted instead of matching to its live row would
+    // leave an empty row; restore it from the cache.
+    for (const stub of Array.from(
+      container.querySelectorAll<HTMLElement>(":scope > [data-persona-reuse]")
+    )) {
+      const cached = messageCache.get(stub.getAttribute("data-wrapper-id") ?? "");
+      if (cached) stub.replaceWith(cached.wrapper.cloneNode(true));
+      else stub.remove();
+    }
 
     // Set initial edge-fade state on the live table wrappers and attach the
     // delegated scroll listener (once) that keeps the fades in sync.
@@ -8582,74 +8642,48 @@ export const createAgentExperience = (
     }, 100);
   };
 
-  const isDeepEqual = (left: unknown, right: unknown): boolean => {
-    if (Object.is(left, right)) return true;
-    if (left === null || right === null) return false;
-    if (typeof left !== "object" || typeof right !== "object") return false;
-    if (Array.isArray(left) || Array.isArray(right)) {
-      if (!Array.isArray(left) || !Array.isArray(right) || left.length !== right.length) {
-        return false;
-      }
-      return left.every((value, index) => isDeepEqual(value, right[index]));
-    }
-    const leftRecord = left as Record<string, unknown>;
-    const rightRecord = right as Record<string, unknown>;
-    const leftKeys = Object.keys(leftRecord);
-    const rightKeys = Object.keys(rightRecord);
-    return (
-      leftKeys.length === rightKeys.length &&
-      leftKeys.every(
-        (key) =>
-          Object.prototype.hasOwnProperty.call(rightRecord, key) &&
-          isDeepEqual(leftRecord[key], rightRecord[key])
-      )
-    );
-  };
-
-  const withoutStreamingText = (message: AgentWidgetMessage) => {
-    const { content: _content, rawContent: _rawContent, llmContent: _llmContent, ...rest } = message;
-    return rest;
-  };
-
-  const isPlainStreamingAssistant = (message: AgentWidgetMessage) =>
-    message.role === "assistant" &&
-    message.streaming === true &&
-    !message.variant &&
-    !message.toolCall &&
-    !message.tools &&
-    !message.approval &&
-    !message.reasoning &&
-    !message.contentParts &&
-    !message.stopReason &&
-    !hasComponentDirective(message);
+  /**
+   * Changes that must reach the DOM (and storage) in the same task rather than
+   * on the next animation frame: a new or edited user message drives send
+   * anchoring and `user:message`, and an approval or a pending local tool
+   * (ask_user_question, WebMCP) is waiting on the user and must be durable
+   * before the page can unload. Everything else in a streaming burst is
+   * coalesced.
+   */
+  const needsImmediateApply = (message: AgentWidgetMessage) =>
+    message.role === "user" ||
+    message.variant === "approval" ||
+    message.agentMetadata?.awaitingLocalTool === true ||
+    isAskUserQuestionMessage(message);
 
-  const isPureStreamingTextProgression = (
+  /**
+   * One pass over a streaming update: returns false when a changed entry needs
+   * an immediate apply, and otherwise remembers assistant messages that
+   * streamed inside the coalesced burst, so `trackMessages` still emits
+   * `assistant:complete` when a message starts and finishes between two
+   * applied snapshots. The session copies only the messages it changes, so
+   * identity marks the changed entries; this pointer scan costs no more than
+   * the array copy the session makes for every update.
+   */
+  const coalesceStreamingChange = (
     previous: AgentWidgetMessage[],
-    next: AgentWidgetMessage[],
-    candidate: { index: number; id: string }
+    next: AgentWidgetMessage[]
   ) => {
-    if (previous.length !== next.length) return false;
-    const before = previous[candidate.index];
-    const after = next[candidate.index];
-    if (!before || !after || before.id !== candidate.id || after.id !== candidate.id) {
-      return false;
+    if (next.length < previous.length) return false;
+    for (let index = 0; index < next.length; index += 1) {
+      const message = next[index];
+      if (message === previous[index]) continue;
+      if (needsImmediateApply(message)) return false;
+      if (message.role === "assistant" && message.streaming) {
+        coalescedStreamingIds.add(message.id);
+      }
     }
-    const textChanged =
-      !Object.is(before.content, after.content) ||
-      !Object.is(before.rawContent, after.rawContent) ||
-      !Object.is(before.llmContent, after.llmContent);
-    return (
-      textChanged &&
-      isPlainStreamingAssistant(before) &&
-      isPlainStreamingAssistant(after) &&
-      isDeepEqual(withoutStreamingText(before), withoutStreamingText(after))
-    );
+    return true;
   };
 
   let lastAppliedMessages: AgentWidgetMessage[] | null = null;
-  let activeStreamingTextCandidate: { index: number; id: string } | null = null;
-  let pendingStreamingTextMessages: AgentWidgetMessage[] | null = null;
-  let streamingTextRAF: number | null = null;
+  let pendingMessages: AgentWidgetMessage[] | null = null;
+  let pendingMessagesRAF: number | null = null;
   let pendingDurablePersistenceMessages: AgentWidgetMessage[] | null = null;
 
   const persistMessages = (messages: AgentWidgetMessage[]) => {
@@ -8658,7 +8692,9 @@ export const createAgentExperience = (
     queueMicrotask(() => {
       if (pendingDurablePersistenceMessages === messages) {
         pendingDurablePersistenceMessages = null;
-        persistState(messages);
+        // The resume cursor is read now, so save the newest snapshot: updates
+        // coalesced after this one (still waiting on a frame) already advanced it.
+        persistState(pendingMessages ?? messages);
       }
     });
   };
@@ -8667,17 +8703,13 @@ export const createAgentExperience = (
     lastAppliedMessages = messages;
     let lastUserMessage: AgentWidgetMessage | undefined;
     let lastAssistantMessage: AgentWidgetMessage | undefined;
-    activeStreamingTextCandidate = null;
     for (let index = messages.length - 1; index >= 0; index -= 1) {
       const message = messages[index];
       if (!lastUserMessage && message.role === "user") lastUserMessage = message;
       if (!lastAssistantMessage && message.role === "assistant") {
         lastAssistantMessage = message;
       }
-      if (!activeStreamingTextCandidate && isPlainStreamingAssistant(message)) {
-        activeStreamingTextCandidate = { index, id: message.id };
-      }
-      if (lastUserMessage && lastAssistantMessage && activeStreamingTextCandidate) break;
+      if (lastUserMessage && lastAssistantMessage) break;
     }
     renderMessagesWithPlugins(messagesWrapper, messages, postprocess);
     // Freshly (re)built inline artifact blocks render from their persisted
@@ -8726,52 +8758,48 @@ export const createAgentExperience = (
     syncComposerBarPeek();
   };
 
-  const flushPendingStreamingText = () => {
-    if (streamingTextRAF !== null) {
-      cancelAnimationFrame(streamingTextRAF);
-      streamingTextRAF = null;
+  const flushPendingMessages = () => {
+    if (pendingMessagesRAF !== null) {
+      cancelAnimationFrame(pendingMessagesRAF);
+      pendingMessagesRAF = null;
     }
-    const pending = pendingStreamingTextMessages;
-    pendingStreamingTextMessages = null;
+    const pending = pendingMessages;
+    pendingMessages = null;
     if (pending) applyMessagesChanged(pending);
   };
 
-  const discardPendingStreamingText = () => {
-    if (streamingTextRAF !== null) cancelAnimationFrame(streamingTextRAF);
-    streamingTextRAF = null;
-    pendingStreamingTextMessages = null;
+  const discardPendingMessages = () => {
+    if (pendingMessagesRAF !== null) cancelAnimationFrame(pendingMessagesRAF);
+    pendingMessagesRAF = null;
+    pendingMessages = null;
   };
 
+  // While a turn streams, every SSE frame changes the transcript, and a render
+  // pass costs O(messages). Applying each frame synchronously makes a burst of
+  // N frames (a long tool run, or a finished transcript replayed through
+  // `connectStream`) cost O(N²) and block the main thread. Coalesce streaming
+  // updates to one render per animation frame; the stream ending, a clear, or
+  // a change in `needsImmediateApply` flushes synchronously.
   const handleMessagesChanged = (messages: AgentWidgetMessage[]) => {
-    const comparison = pendingStreamingTextMessages ?? lastAppliedMessages;
-    if (
-      isStreaming &&
-      comparison &&
-      activeStreamingTextCandidate &&
-      isPureStreamingTextProgression(
-        comparison,
-        messages,
-        activeStreamingTextCandidate
-      )
-    ) {
-      pendingStreamingTextMessages = messages;
-      if (streamingTextRAF === null) {
-        streamingTextRAF = requestAnimationFrame(() => {
-          streamingTextRAF = null;
-          const pending = pendingStreamingTextMessages;
-          pendingStreamingTextMessages = null;
+    if (messages.length === 0) {
+      discardPendingMessages();
+      applyMessagesChanged(messages);
+      return;
+    }
+    const comparison = pendingMessages ?? lastAppliedMessages;
+    if (isStreaming && comparison && coalesceStreamingChange(comparison, messages)) {
+      pendingMessages = messages;
+      if (pendingMessagesRAF === null) {
+        pendingMessagesRAF = requestAnimationFrame(() => {
+          pendingMessagesRAF = null;
+          const pending = pendingMessages;
+          pendingMessages = null;
           if (pending) applyMessagesChanged(pending);
         });
       }
       return;
     }
-
-    if (messages.length === 0) {
-      discardPendingStreamingText();
-      applyMessagesChanged(messages);
-      return;
-    }
-    flushPendingStreamingText();
+    flushPendingMessages();
     applyMessagesChanged(messages);
   };
 
@@ -8797,9 +8825,9 @@ export const createAgentExperience = (
     onStreamingChanged(streaming) {
       if (!streaming) {
         if (session?.getMessages().length === 0) {
-          discardPendingStreamingText();
+          discardPendingMessages();
         } else {
-          flushPendingStreamingText();
+          flushPendingMessages();
         }
       }
       isStreaming = streaming;
@@ -13277,8 +13305,8 @@ export const createAgentExperience = (
       // Mirror the in-panel click handler: WebMCP gate bubbles resolve a local
       // Promise the bridge is parked on (no server round-trip and they carry an
       // empty executionId/agentId), so they must NOT hit the server approval
-      // API. Route by the `toolType` marker set in `requestWebMcpApproval`.
-      if (approvalMessage.approval.toolType === "webmcp") {
+      // API. Server-backed approvals retain their execution id and use the API.
+      if (isBrowserLocalApproval(approvalMessage.approval)) {
         session.resolveWebMcpApproval(approvalMessage.id, decision);
         return;
       }
@@ -13421,7 +13449,7 @@ export const createAgentExperience = (
       // Commit the latest coalesced transcript while the live DOM and storage
       // pipeline still exist, then let the normal teardown cancel any work
       // scheduled by that final apply.
-      flushPendingStreamingText();
+      flushPendingMessages();
       if (toolElapsedTimerId != null) {
         clearInterval(toolElapsedTimerId);
         toolElapsedTimerId = null;

package/src/ui.typing-indicator.test.ts

@@ -145,9 +145,27 @@ describe("standalone typing indicator with hidden activity rows", () => {
     document.body.innerHTML = "";
     if (typeof localStorage !== "undefined") localStorage.clear();
     vi.restoreAllMocks();
+    vi.unstubAllGlobals();
   });
 
+  // Streaming transcript updates render once per animation frame; queue the
+  // frames so each injection can be rendered synchronously.
+  let frames = new Map<number, (time: number) => void>();
+  let nextFrameId = 1;
+  const renderFrame = () => {
+    const pending = [...frames.values()];
+    frames.clear();
+    pending.forEach((callback) => callback(0));
+  };
+
   const mountStreaming = async (config: Record<string, unknown>) => {
+    frames = new Map();
+    vi.stubGlobal("requestAnimationFrame", (callback: (time: number) => void) => {
+      const id = nextFrameId++;
+      frames.set(id, callback);
+      return id;
+    });
+    vi.stubGlobal("cancelAnimationFrame", (id: number) => frames.delete(id));
     global.fetch = vi.fn().mockImplementation(
       () => new Promise(() => {})
     ) as unknown as typeof fetch;
@@ -190,6 +208,7 @@ describe("standalone typing indicator with hidden activity rows", () => {
         toolCall: { id, name: "lookup", status },
       },
     });
+    renderFrame();
   };
 
   const injectReasoning = (
@@ -211,6 +230,7 @@ describe("standalone typing indicator with hidden activity rows", () => {
         reasoning: { id, status, chunks: ["thinking"] },
       },
     });
+    renderFrame();
   };
 
   const typingIndicator = (mount: HTMLElement) =>
@@ -344,6 +364,7 @@ describe("standalone typing indicator with hidden activity rows", () => {
         streaming: true,
       },
     });
+    renderFrame();
     expect(typingIndicator(mount)).toBeNull();
 
     controller.destroy();

package/src/utils/formatting.test.ts

@@ -1,5 +1,5 @@
 import { describe, it, expect } from "vitest";
-import { createJsonStreamParser, parseFormattedTemplate, computeReasoningElapsed } from "./formatting";
+import { createJsonStreamParser, parseFormattedTemplate, computeReasoningElapsed, computeToolElapsed } from "./formatting";
 
 describe("JSON Stream Parser", () => {
   it("should extract text field incrementally as JSON streams in", () => {
@@ -268,3 +268,11 @@ describe("computeReasoningElapsed", () => {
     expect(result).toBe("<0.1s");
   });
 });
+
+it("never invents an interrupted tool's duration, including elapsed render hooks", () => {
+  const tool = { id: "browser", status: "complete" as const, interrupted: true };
+  expect(computeToolElapsed(tool)).toBe("");
+  expect(computeToolElapsed({ ...tool, startedAt: 1 })).toBe("");
+  expect(computeToolElapsed({ ...tool, durationMs: 2000 })).toBe("2s");
+  expect(computeToolElapsed({ ...tool, startedAt: 1000, completedAt: 4000 })).toBe("3s");
+});

package/src/utils/formatting.ts

@@ -124,6 +124,10 @@ export const formatElapsedMs = (ms: number): string => {
  * Computes the current elapsed time string for a tool call.
  */
 export const computeToolElapsed = (tool: AgentWidgetToolCall): string => {
+  if (
+    tool.interrupted && tool.duration === undefined && tool.durationMs === undefined &&
+    (tool.startedAt === undefined || tool.completedAt === undefined)
+  ) return "";
   const durationMs =
     typeof tool.duration === "number"
       ? tool.duration

package/src/utils/local-only-message.ts

@@ -0,0 +1,15 @@
+import type { AgentWidgetMessage } from "../types";
+
+/** Id prefix of the bubble the durable reconnect loop posts when it gives up. */
+export const RECONNECT_FAILED_ID_PREFIX = "reconnect-failed-";
+
+/**
+ * A widget-generated notice that is shown in this browser only: never sent as
+ * conversation history and never written to the storage adapter. The id check
+ * covers reconnect-failure bubbles persisted before `localOnly` existed.
+ */
+export const isLocalOnlyMessage = (message: AgentWidgetMessage): boolean =>
+  message.localOnly === true ||
+  (message.role === "assistant" &&
+    typeof message.id === "string" &&
+    message.id.startsWith(RECONNECT_FAILED_ID_PREFIX));

package/src/utils/message-fingerprint.test.ts

@@ -35,6 +35,15 @@ describe("computeMessageFingerprint", () => {
     expect(fp1).toBe(fp2);
   });
 
+  it("changes when tool args are replaced with a longer object", () => {
+    const toolMessage = (args: unknown) =>
+      makeMessage({ variant: "tool", toolCall: { status: "running", args } });
+    const fp1 = computeMessageFingerprint(toolMessage({ q: "a" }), 0);
+    const fp2 = computeMessageFingerprint(toolMessage({ q: "a", limit: 10 }), 0);
+    expect(fp1).not.toBe(fp2);
+    expect(computeMessageFingerprint(toolMessage({ q: "a" }), 0)).toBe(fp1);
+  });
+
   it("changes when content changes", () => {
     const fp1 = computeMessageFingerprint(makeMessage({ content: "Hello" }), 0);
     const fp2 = computeMessageFingerprint(makeMessage({ content: "Hello world" }), 0);

package/src/utils/message-fingerprint.ts

@@ -35,6 +35,23 @@ export type MessageCacheEntry = {
 
 export type MessageCache = Map<string, MessageCacheEntry>;
 
+// Every render pass fingerprints every message, so re-stringifying tool args
+// each time would cost O(total args bytes) per pass. Streaming replaces the
+// args object rather than mutating it, so the length is memoized per object.
+const argsLengths = new WeakMap<object, number>();
+
+function argsLength(args: unknown): number {
+  if (typeof args === "string") return args.length;
+  if (!args) return 0;
+  if (typeof args !== "object") return JSON.stringify(args)?.length ?? 0;
+  let length = argsLengths.get(args);
+  if (length === undefined) {
+    length = JSON.stringify(args)?.length ?? 0;
+    argsLengths.set(args, length);
+  }
+  return length;
+}
+
 /**
  * Compute a fast fingerprint for a message to detect changes.
  * Uses string concatenation with a delimiter rather than JSON.stringify for performance.
@@ -62,11 +79,7 @@ export function computeMessageFingerprint(
     message.toolCall?.name ?? "",
     message.toolCall?.chunks?.length ?? 0,
     message.toolCall?.chunks?.[message.toolCall.chunks.length - 1]?.slice(-32) ?? "",
-    typeof message.toolCall?.args === "string"
-      ? message.toolCall.args.length
-      : message.toolCall?.args
-        ? JSON.stringify(message.toolCall.args).length
-        : 0,
+    argsLength(message.toolCall?.args),
     message.reasoning?.chunks?.length ?? 0,
     message.reasoning?.chunks?.[message.reasoning.chunks.length - 1]?.length ?? 0,
     message.reasoning?.chunks?.[message.reasoning.chunks.length - 1]?.slice(-32) ?? "",

package/src/utils/morph.ts

@@ -24,6 +24,16 @@ export const morphMessages = (
       beforeNodeMorphed(oldNode: Node, newNode: Node): boolean | void {
         if (!(oldNode instanceof HTMLElement)) return;
 
+        // Render passes stand in an unchanged transcript row with an empty
+        // `data-persona-reuse` stub: keep the live row as is.
+        if (
+          newNode instanceof HTMLElement &&
+          newNode.hasAttribute("data-persona-reuse") &&
+          oldNode.id === newNode.id
+        ) {
+          return false;
+        }
+
         // Preserve typing indicator dots to maintain animation continuity
         // Also preserve elements with data-preserve-animation attribute for custom loading indicators
         if (preserveTypingAnimation) {