@runtypelabs/persona 3.37.0 → 4.1.0

package/src/utils/__fixtures__/unified-translator.oracle.ts

@@ -36,7 +36,9 @@ class UnifiedEventTranslator {
   private kind: ExecutionKind = "flow";
   private blockCounter = 0;
   private openText: string | null = null;
+  private openTextBuffer = "";
   private openReasoning: string | null = null;
+  private openReasoningBuffer = "";
 
   constructor(
     private readonly sink: (chunk: string) => void,
@@ -56,40 +58,78 @@ class UnifiedEventTranslator {
     this.sink(`event: ${type}\ndata: ${JSON.stringify(frame)}\n\n`);
   }
 
-  private emitTextDelta(delta: unknown): void {
+  /**
+   * Parent model tool-call id stamped by the `tool_nested` FilteredStream as
+   * `toolContext.toolId` (a flow running as a tool enriches its frames this way).
+   * Surfaced on the text/reasoning channel as `parentToolCallId` so consumers can
+   * route nested streamed output into the parent tool's row (PR #4602). Undefined
+   * for top-level output.
+   */
+  private parentToolCallId(data: Json): string | undefined {
+    const toolContext = data.toolContext;
+    if (toolContext && typeof toolContext === "object") {
+      const toolId = (toolContext as Json).toolId;
+      if (typeof toolId === "string" && toolId) return toolId;
+    }
+    return undefined;
+  }
+
+  private emitTextDelta(delta: unknown, parentToolCallId?: string): void {
     if (delta == null || delta === "") return;
     if (!this.openText) {
       this.openText = this.mint("text");
+      this.openTextBuffer = "";
       this.out("text_start", {
         id: this.openText,
         ...(this.kind === "agent" ? { role: "assistant" } : {}),
+        ...(parentToolCallId ? { parentToolCallId } : {}),
       });
     }
-    this.out("text_delta", { id: this.openText, delta: String(delta) });
+    const text = String(delta);
+    this.openTextBuffer += text;
+    this.out("text_delta", { id: this.openText, delta: text });
   }
 
   private closeText(): void {
     if (!this.openText) return;
-    this.out("text_complete", { id: this.openText });
+    // U2: carry the assembled text so a non-streaming consumer can read the
+    // finished message off `text_complete` instead of re-concatenating deltas.
+    this.out("text_complete", {
+      id: this.openText,
+      ...(this.openTextBuffer ? { text: this.openTextBuffer } : {}),
+    });
     this.openText = null;
+    this.openTextBuffer = "";
   }
 
-  private ensureReasoningOpen(scope?: "turn" | "loop"): void {
+  private ensureReasoningOpen(scope?: "turn" | "loop", parentToolCallId?: string): void {
     if (this.openReasoning) return;
     this.openReasoning = this.mint("reason");
-    this.out("reasoning_start", { id: this.openReasoning, ...(scope ? { scope } : {}) });
+    this.openReasoningBuffer = "";
+    this.out("reasoning_start", {
+      id: this.openReasoning,
+      ...(scope ? { scope } : {}),
+      ...(parentToolCallId ? { parentToolCallId } : {}),
+    });
   }
 
-  private emitReasoningDelta(delta: unknown): void {
+  private emitReasoningDelta(delta: unknown, parentToolCallId?: string): void {
     if (delta == null || delta === "") return;
-    this.ensureReasoningOpen();
-    this.out("reasoning_delta", { id: this.openReasoning, delta: String(delta) });
+    this.ensureReasoningOpen(undefined, parentToolCallId);
+    const text = String(delta);
+    this.openReasoningBuffer += text;
+    this.out("reasoning_delta", { id: this.openReasoning, delta: text });
   }
 
   private closeReasoning(): void {
     if (!this.openReasoning) return;
-    this.out("reasoning_complete", { id: this.openReasoning });
+    // U2: carry the assembled reasoning text (parity with text_complete).
+    this.out("reasoning_complete", {
+      id: this.openReasoning,
+      ...(this.openReasoningBuffer ? { text: this.openReasoningBuffer } : {}),
+    });
     this.openReasoning = null;
+    this.openReasoningBuffer = "";
   }
 
   private closeChannels(): void {
@@ -391,7 +431,7 @@ class UnifiedEventTranslator {
         });
         break;
       case "step_delta":
-        this.emitTextDelta(data.text ?? data.delta);
+        this.emitTextDelta(data.text ?? data.delta, this.parentToolCallId(data));
         break;
       case "step_complete":
         this.closeChannels();
@@ -492,23 +532,31 @@ class UnifiedEventTranslator {
         });
         break;
       case "chunk":
-        this.emitTextDelta(data.text);
+        this.emitTextDelta(data.text, this.parentToolCallId(data));
         break;
 
       case "text_start":
         if (!this.openText) {
           this.openText = (data.id as string) ?? this.mint("text");
-          this.out("text_start", { id: this.openText });
+          this.openTextBuffer = "";
+          const parentToolCallId = this.parentToolCallId(data);
+          this.out("text_start", {
+            id: this.openText,
+            ...(parentToolCallId ? { parentToolCallId } : {}),
+          });
         }
         break;
       case "text_end":
         this.closeText();
         break;
       case "reason_start":
-        this.ensureReasoningOpen();
+        this.ensureReasoningOpen(undefined, this.parentToolCallId(data));
         break;
       case "reason_delta":
-        this.emitReasoningDelta(data.reasoningText ?? data.delta ?? data.text);
+        this.emitReasoningDelta(
+          data.reasoningText ?? data.delta ?? data.text,
+          this.parentToolCallId(data)
+        );
         break;
       case "reason_complete":
         this.closeReasoning();

package/src/utils/copy-selection.test.ts

@@ -0,0 +1,37 @@
+import { describe, it, expect } from "vitest";
+import { normalizeCopiedSelectionText } from "./copy-selection";
+
+describe("normalizeCopiedSelectionText", () => {
+  it("strips a single trailing newline left by block-element serialization", () => {
+    const raw = "Create a markdown document titled \"Bridge Test Report\".\n";
+    expect(normalizeCopiedSelectionText(raw)).toBe(
+      "Create a markdown document titled \"Bridge Test Report\"."
+    );
+  });
+
+  it("strips multiple trailing blank lines and whitespace", () => {
+    expect(normalizeCopiedSelectionText("hello\n\n  \n")).toBe("hello");
+  });
+
+  it("strips leading blank lines", () => {
+    expect(normalizeCopiedSelectionText("\n\nhello")).toBe("hello");
+  });
+
+  it("preserves interior newlines (multi-paragraph / multi-message selection)", () => {
+    expect(normalizeCopiedSelectionText("first\n\nsecond\n")).toBe("first\n\nsecond");
+  });
+
+  it("preserves leading indentation on the first line (copied code)", () => {
+    expect(normalizeCopiedSelectionText("    indented line\nnext\n")).toBe(
+      "    indented line\nnext"
+    );
+  });
+
+  it("returns an unchanged string when there is nothing to trim", () => {
+    expect(normalizeCopiedSelectionText("clean text")).toBe("clean text");
+  });
+
+  it("returns an empty string for whitespace-only input", () => {
+    expect(normalizeCopiedSelectionText("\n\n  \n")).toBe("");
+  });
+});

package/src/utils/copy-selection.ts

@@ -0,0 +1,19 @@
+/**
+ * Normalize text pulled from a native browser selection before it is written to
+ * the clipboard.
+ *
+ * When a user triple-clicks a chat bubble and presses Ctrl/Cmd-C, the browser
+ * serializes the DOM selection itself. Markdown is rendered into block-level
+ * elements (`<p>`, `<li>`, `<pre>`, …), and browsers emit surrounding newlines
+ * for those blocks — so copying a single message drags along stray leading
+ * blank lines and a trailing newline that the user never visually selected.
+ *
+ * This trims the outer whitespace so the clipboard matches the visible
+ * selection, while preserving:
+ *   - interior newlines (a multi-paragraph or multi-message selection keeps its
+ *     line breaks), and
+ *   - leading indentation on the first line (e.g. copied code keeps its indent;
+ *     only fully-blank leading lines are dropped).
+ */
+export const normalizeCopiedSelectionText = (text: string): string =>
+  text.replace(/^\n+/, "").replace(/\s+$/, "");

package/src/utils/event-stream-capture.test.ts

@@ -304,28 +304,9 @@ describe("Event Capture Pipeline - no interference with message processing", ()
 
   it("should still create assistant message correctly when event capture is active", async () => {
     global.fetch = createMockFetch([
-      sseData({
-        type: "step_chunk",
-        id: "step_1",
-        name: "Prompt 1",
-        executionType: "prompt",
-        index: 1,
-        text: "Hello"
-      }),
-      sseData({
-        type: "step_chunk",
-        id: "step_1",
-        name: "Prompt 1",
-        executionType: "prompt",
-        index: 2,
-        text: " there"
-      }),
-      sseData({
-        type: "flow_complete",
-        flowId: "flow_1",
-        success: true,
-        duration: 100
-      })
+      sseData({ type: "text_delta", id: "text_1", delta: "Hello" }),
+      sseData({ type: "text_delta", id: "text_1", delta: " there" }),
+      sseData({ type: "execution_complete", kind: "flow", success: true })
     ]);
 
     await client.dispatch(
@@ -374,20 +355,8 @@ describe("Event Capture Pipeline - no interference with message processing", ()
         duration: 250,
         completedAt: "2025-01-01T00:00:01.000Z"
       }),
-      sseData({
-        type: "step_chunk",
-        id: "step_1",
-        name: "Prompt 1",
-        executionType: "prompt",
-        index: 1,
-        text: "Found results"
-      }),
-      sseData({
-        type: "flow_complete",
-        flowId: "flow_1",
-        success: true,
-        duration: 500
-      })
+      sseData({ type: "text_delta", id: "text_1", delta: "Found results" }),
+      sseData({ type: "execution_complete", kind: "flow", success: true })
     ]);
 
     await client.dispatch(
@@ -442,20 +411,8 @@ describe("Event Capture Pipeline - no interference with message processing", ()
     });
 
     global.fetch = createMockFetch([
-      sseData({
-        type: "step_chunk",
-        id: "step_1",
-        name: "Prompt 1",
-        executionType: "prompt",
-        index: 1,
-        text: "Works fine"
-      }),
-      sseData({
-        type: "flow_complete",
-        flowId: "flow_1",
-        success: true,
-        duration: 50
-      })
+      sseData({ type: "text_delta", id: "text_1", delta: "Works fine" }),
+      sseData({ type: "execution_complete", kind: "flow", success: true })
     ]);
 
     const events: AgentWidgetEvent[] = [];
@@ -496,20 +453,8 @@ describe("Event Capture Pipeline - no interference with message processing", ()
     });
 
     global.fetch = createMockFetch([
-      sseData({
-        type: "step_chunk",
-        id: "step_1",
-        name: "Prompt 1",
-        executionType: "prompt",
-        index: 1,
-        text: "Still works"
-      }),
-      sseData({
-        type: "flow_complete",
-        flowId: "flow_1",
-        success: true,
-        duration: 50
-      })
+      sseData({ type: "text_delta", id: "text_1", delta: "Still works" }),
+      sseData({ type: "execution_complete", kind: "flow", success: true })
     ]);
 
     const events: AgentWidgetEvent[] = [];

package/src/utils/streaming-table.test.ts

@@ -0,0 +1,100 @@
+import { describe, it, expect } from "vitest";
+import { stabilizeStreamingTables } from "./streaming-table";
+import { createMarkdownProcessor } from "../postprocessors";
+
+describe("stabilizeStreamingTables", () => {
+  it("leaves text without pipes untouched", () => {
+    const md = "# Heading\n\nA paragraph with no tables.";
+    expect(stabilizeStreamingTables(md)).toBe(md);
+  });
+
+  it("does not treat a header-only line as a table (no delimiter yet)", () => {
+    // Ambiguous: could just be inline pipe text. Leave it alone until a
+    // delimiter row starts streaming in.
+    const md = "| Name | Price |";
+    expect(stabilizeStreamingTables(md)).toBe(md);
+  });
+
+  it("completes a partial delimiter row so the table renders immediately", () => {
+    const md = "| Name | Price |\n| --";
+    expect(stabilizeStreamingTables(md)).toBe("| Name | Price |\n| --- | --- |");
+  });
+
+  it("completes a delimiter that is just a leading pipe with one dash", () => {
+    const md = "| A | B | C |\n|-";
+    expect(stabilizeStreamingTables(md)).toBe("| A | B | C |\n| --- | --- | --- |");
+  });
+
+  it("pads a partial trailing row to the header column count", () => {
+    const md = "| Name | Price |\n| --- | --- |\n| Apple";
+    expect(stabilizeStreamingTables(md)).toBe(
+      "| Name | Price |\n| --- | --- |\n| Apple |  |"
+    );
+  });
+
+  it("keeps a complete table stable (idempotent)", () => {
+    const md = "| Name | Price |\n| --- | --- |\n| Apple | $1 |";
+    expect(stabilizeStreamingTables(md)).toBe(md);
+    expect(stabilizeStreamingTables(stabilizeStreamingTables(md))).toBe(md);
+  });
+
+  it("counts columns from a header without outer pipes", () => {
+    const md = "Name | Price\n---";
+    expect(stabilizeStreamingTables(md)).toBe("Name | Price\n| --- | --- |");
+  });
+
+  it("normalizes rows with extra cells down to the header column count", () => {
+    const md = "| A | B |\n| --- | --- |\n| 1 | 2 | 3 |";
+    expect(stabilizeStreamingTables(md)).toBe("| A | B |\n| --- | --- |\n| 1 | 2 |");
+  });
+
+  it("stops the table region at a blank line and leaves following text alone", () => {
+    const md = "| A | B |\n| --- | --- |\n| 1 | 2 |\n\nSome | trailing | text";
+    expect(stabilizeStreamingTables(md)).toBe(md);
+  });
+
+  it("preserves leading prose before a streaming table", () => {
+    const md = "Here you go:\n\n| A | B |\n| -";
+    expect(stabilizeStreamingTables(md)).toBe("Here you go:\n\n| A | B |\n| --- | --- |");
+  });
+
+  it("handles two separate tables in one stream", () => {
+    const md =
+      "| A | B |\n| --- | --- |\n| 1 | 2 |\n\nmiddle\n\n| C | D | E |\n| --";
+    expect(stabilizeStreamingTables(md)).toBe(
+      "| A | B |\n| --- | --- |\n| 1 | 2 |\n\nmiddle\n\n| C | D | E |\n| --- | --- | --- |"
+    );
+  });
+
+  it("preserves alignment-colon delimiters as a valid table start", () => {
+    const md = "| A | B |\n| :-";
+    // Detection accepts colons; the synthesized delimiter normalizes to dashes
+    // (alignment reappears in the untouched final render).
+    expect(stabilizeStreamingTables(md)).toBe("| A | B |\n| --- | --- |");
+  });
+});
+
+describe("stabilizeStreamingTables → marked integration", () => {
+  const md = createMarkdownProcessor();
+
+  it("renders a <table> from a header + partial delimiter that marked alone would not", () => {
+    const partial = "| Name | Price |\n| --";
+
+    // Without stabilization marked sees no complete delimiter → no table.
+    expect(md(partial)).not.toContain("<table");
+
+    const html = md(stabilizeStreamingTables(partial));
+    expect(html).toContain("<table");
+    expect(html).toContain("<th>Name</th>");
+    expect(html).toContain("<th>Price</th>");
+  });
+
+  it("renders a body row for a partial trailing row", () => {
+    const partial = "| Name | Price |\n| --- | --- |\n| Apple";
+    const html = md(stabilizeStreamingTables(partial));
+    expect(html).toContain("<table");
+    expect(html).toContain("<td>Apple</td>");
+    // The padded empty cell keeps the column count stable.
+    expect(html.match(/<td/g)?.length).toBe(2);
+  });
+});

package/src/utils/streaming-table.ts

@@ -0,0 +1,103 @@
+/**
+ * Streaming markdown table stabilizer (Telegram-style space reservation).
+ *
+ * During SSE streaming the full accumulated markdown is re-parsed by `marked`
+ * on every chunk. For GFM tables that produces two jarring jolts:
+ *
+ *  1. The paragraph→table flip. GFM only recognizes a table once the *delimiter*
+ *     row (`| --- | --- |`) has arrived, so a freshly-streamed header line first
+ *     renders as a plain paragraph and then snaps into a `<table>`.
+ *  2. Partial-row flicker. The in-flight last row grows cell-by-cell.
+ *
+ * This module rewrites table-in-progress regions so a real `<table>` renders
+ * from the first row onward with a stable column count: it completes the
+ * delimiter row as soon as it starts streaming and pads the trailing partial
+ * row to the header's column count. Combined with `table-layout: fixed` while
+ * streaming (see `.persona-content-streaming table` in widget.css), columns lock
+ * to even widths so rows append vertically without horizontal reflow.
+ *
+ * It runs ONLY while a message is streaming; the final render uses the real,
+ * untouched `marked` output, so correctness is never affected.
+ */
+
+/**
+ * A GFM delimiter row, full or still streaming in: only delimiter characters
+ * (`-`, `:`, `|`, whitespace) and at least one dash. Matches `|`-led partials
+ * like `| -`, `|--`, `| :--`, and complete rows like `| --- | :--: |`.
+ */
+const DELIMITER_RE = /^\s*\|?[\s:|-]*-[\s:|-]*$/;
+
+/** A candidate table row contains at least one pipe. */
+const hasPipe = (line: string): boolean => line.includes("|");
+
+/** Split a markdown table row into trimmed cell strings, ignoring outer pipes. */
+const splitCells = (line: string): string[] => {
+  let s = line.trim();
+  if (s.startsWith("|")) s = s.slice(1);
+  if (s.endsWith("|")) s = s.slice(0, -1);
+  return s.split("|").map((cell) => cell.trim());
+};
+
+/** Render cells back into a normalized, pipe-delimited row. */
+const buildRow = (cells: string[]): string => `| ${cells.join(" | ")} |`;
+
+/** Build a complete delimiter row with the given column count. */
+const buildDelimiter = (cols: number): string =>
+  `| ${Array.from({ length: cols }, () => "---").join(" | ")} |`;
+
+/** Pad (or trim) a row's cells to exactly `cols` columns. */
+const fitCells = (cells: string[], cols: number): string[] => {
+  if (cells.length >= cols) return cells.slice(0, cols);
+  return cells.concat(Array.from({ length: cols - cells.length }, () => ""));
+};
+
+/**
+ * Normalize any streaming-in-progress GFM tables in `markdown` so they render as
+ * complete tables with a stable column count. Returns the input unchanged when
+ * there is nothing to stabilize (cheap fast-path for the common no-table case).
+ */
+export const stabilizeStreamingTables = (markdown: string): string => {
+  if (!markdown || !markdown.includes("|")) return markdown;
+
+  const lines = markdown.split("\n");
+  let changed = false;
+
+  for (let i = 0; i < lines.length - 1; i++) {
+    const header = lines[i];
+    const delimiter = lines[i + 1];
+
+    // A table starts at a header line (has a pipe, is not itself a delimiter)
+    // immediately followed by a delimiter row that is full or still streaming.
+    if (!hasPipe(header) || DELIMITER_RE.test(header)) continue;
+    if (!DELIMITER_RE.test(delimiter)) continue;
+
+    const cols = splitCells(header).length;
+    if (cols < 1) continue;
+
+    // Complete the delimiter to match the header's column count so `marked`
+    // recognizes the table immediately instead of waiting for it to finish.
+    const fullDelimiter = buildDelimiter(cols);
+    if (lines[i + 1] !== fullDelimiter) {
+      lines[i + 1] = fullDelimiter;
+      changed = true;
+    }
+
+    // Normalize body rows (including a partial trailing one) to `cols` columns
+    // so each row occupies its slot instead of growing cell-by-cell. The region
+    // ends at the first blank or pipe-less line.
+    let j = i + 2;
+    for (; j < lines.length; j++) {
+      const row = lines[j];
+      if (row.trim() === "" || !hasPipe(row)) break;
+      const normalized = buildRow(fitCells(splitCells(row), cols));
+      if (lines[j] !== normalized) {
+        lines[j] = normalized;
+        changed = true;
+      }
+    }
+
+    i = j - 1; // resume scanning after this table region
+  }
+
+  return changed ? lines.join("\n") : markdown;
+};