@tutti-os/agent-gui 0.0.3 → 0.0.4

package/dist/{chunk-AF5CXBJN.js → chunk-5Q36BEUM.js}

@@ -101,7 +101,8 @@ function getExplicitWindowTestAgentActivityRuntime() {
 // agentActivityHost.tsx
 import {
   createContext as createContext2,
-  useContext as useContext2
+  useContext as useContext2,
+  useMemo
 } from "react";
 
 // host/agentHostApi.ts
@@ -132,7 +133,10 @@ function AgentActivityHostProvider({
   agentHostApi,
   children
 }) {
-  const resolvedAgentHostApi = agentHostApi ? toAgentHostRuntimeApi(agentHostApi) : null;
+  const resolvedAgentHostApi = useMemo(
+    () => agentHostApi ? toAgentHostRuntimeApi(agentHostApi) : null,
+    [agentHostApi]
+  );
   currentAgentHostApi = resolvedAgentHostApi;
   return /* @__PURE__ */ jsx2(AgentActivityRuntimeProvider, { runtime: agentActivityRuntime, children: /* @__PURE__ */ jsx2(AgentActivityHostContext.Provider, { value: resolvedAgentHostApi, children }) });
 }
@@ -183,42 +187,6 @@ function getExplicitWindowTestAgentHostApi() {
   return testAgentHostApi ? toAgentHostRuntimeApi(testAgentHostApi) : null;
 }
 
-// app/renderer/assets/icons/agents/manage-agent-claude-code.png
-var manage_agent_claude_code_default = "./manage-agent-claude-code-F6VPQETB.png";
-
-// app/renderer/assets/icons/agents/manage-agent-codex.png
-var manage_agent_codex_default = "./manage-agent-codex-SC63MZAW.png";
-
-// app/renderer/assets/icons/agents/manage-agent-gemini.png
-var manage_agent_gemini_default = "./manage-agent-gemini-O4KAJFIM.png";
-
-// app/renderer/assets/icons/agents/manage-agent-hermes.png
-var manage_agent_hermes_default = "./manage-agent-hermes-QGDHBNRJ.png";
-
-// app/renderer/assets/icons/agents/manage-agent-nextop.png
-var manage_agent_nextop_default = "./manage-agent-nextop-UFAQ22K2.png";
-
-// app/renderer/assets/icons/agents/manage-agent-openclaw.png
-var manage_agent_openclaw_default = "./manage-agent-openclaw-24U7O6CA.png";
-
-// app/renderer/assets/icons/agents/claude-rounded.png
-var claude_rounded_default = "./claude-rounded-F6VPQETB.png";
-
-// app/renderer/assets/icons/agents/codex-rounded.png
-var codex_rounded_default = "./codex-rounded-SC63MZAW.png";
-
-// app/renderer/assets/icons/agents/gemini-rounded.png
-var gemini_rounded_default = "./gemini-rounded-O4KAJFIM.png";
-
-// app/renderer/assets/icons/agents/hermes-rounded.png
-var hermes_rounded_default = "./hermes-rounded-QGDHBNRJ.png";
-
-// app/renderer/assets/icons/agents/nextop-doc-rounded.png
-var nextop_doc_rounded_default = "./nextop-doc-rounded-UFAQ22K2.png";
-
-// app/renderer/assets/icons/agents/openclaw-rounded.png
-var openclaw_rounded_default = "./openclaw-rounded-24U7O6CA.png";
-
 // shared/managedAgentProviders.ts
 function normalizeManagedAgentProvider(provider) {
   const normalized = provider?.trim().toLowerCase().replace(/[_\s]+/gu, "-") ?? "";
@@ -234,25 +202,47 @@ function normalizeManagedAgentProvider(provider) {
   }
 }
 
+// managedAgentIconAssets.ts
+function agentIconUrl(fileName) {
+  return new URL(
+    `./app/renderer/assets/icons/agents/${fileName}`,
+    import.meta.url
+  ).href;
+}
+var manageAgentClaudeCodeUrl = agentIconUrl(
+  "manage-agent-claude-code.png"
+);
+var manageAgentCodexUrl = agentIconUrl("manage-agent-codex.png");
+var manageAgentGeminiUrl = agentIconUrl("manage-agent-gemini.png");
+var manageAgentHermesUrl = agentIconUrl("manage-agent-hermes.png");
+var manageAgentNextopUrl = agentIconUrl("manage-agent-nextop.png");
+var manageAgentOpenclawUrl = agentIconUrl("manage-agent-openclaw.png");
+var claudeRoundedUrl = agentIconUrl("claude-rounded.png");
+var codexRoundedUrl = agentIconUrl("codex-rounded.png");
+var geminiRoundedUrl = agentIconUrl("gemini-rounded.png");
+var hermesRoundedUrl = agentIconUrl("hermes-rounded.png");
+var nextopDocRoundedUrl = agentIconUrl("nextop-doc-rounded.png");
+var openclawRoundedUrl = agentIconUrl("openclaw-rounded.png");
+
 // shared/managedAgentIcons.ts
 var MANAGED_AGENT_ICON_URLS = {
-  "claude-code": manage_agent_claude_code_default,
-  codex: manage_agent_codex_default,
-  gemini: manage_agent_gemini_default,
-  hermes: manage_agent_hermes_default,
-  nextop: manage_agent_nextop_default,
-  openclaw: manage_agent_openclaw_default
+  "claude-code": manageAgentClaudeCodeUrl,
+  codex: manageAgentCodexUrl,
+  gemini: manageAgentGeminiUrl,
+  hermes: manageAgentHermesUrl,
+  nextop: manageAgentNextopUrl,
+  openclaw: manageAgentOpenclawUrl
 };
 var MANAGED_AGENT_ICON_ROUNDED_URLS = {
-  "claude-code": claude_rounded_default,
-  codex: codex_rounded_default,
-  gemini: gemini_rounded_default,
-  hermes: hermes_rounded_default,
-  nextop: nextop_doc_rounded_default,
-  openclaw: openclaw_rounded_default
+  "claude-code": claudeRoundedUrl,
+  codex: codexRoundedUrl,
+  gemini: geminiRoundedUrl,
+  hermes: hermesRoundedUrl,
+  nextop: nextopDocRoundedUrl,
+  openclaw: openclawRoundedUrl
 };
-var MANAGED_AGENT_ROUNDED_ICON_FALLBACK_URL = nextop_doc_rounded_default;
-var MANAGED_AGENT_ICON_FALLBACK_URL = manage_agent_nextop_default;
+var MANAGED_AGENT_ROUNDED_ICON_FALLBACK_URL = nextopDocRoundedUrl;
+var MANAGED_AGENT_ICON_FALLBACK_URL = manageAgentNextopUrl;
 function managedAgentRoundedIconUrl(provider) {
   return MANAGED_AGENT_ICON_ROUNDED_URLS[normalizeManagedAgentProvider(provider)] ?? MANAGED_AGENT_ROUNDED_ICON_FALLBACK_URL;
 }
@@ -478,7 +468,7 @@ function numericValue(value) {
 import {
   useCallback as useCallback2,
   useEffect as useEffect2,
-  useMemo,
+  useMemo as useMemo2,
   useRef as useRef2,
   useState
 } from "react";
@@ -754,7 +744,7 @@ function ApprovalPromptSurface({
   labels
 }) {
   "use memo";
-  const promptDetails = useMemo(
+  const promptDetails = useMemo2(
     () => formatToolDetails(prompt.input ?? null),
     [prompt.input]
   );
@@ -762,7 +752,7 @@ function ApprovalPromptSurface({
     prompt.title,
     promptDetails.length
   );
-  const details = useMemo(
+  const details = useMemo2(
     () => filterDuplicatePromptTitleDetails(promptDetails, visiblePromptTitle),
     [promptDetails, visiblePromptTitle]
   );
@@ -774,7 +764,7 @@ function ApprovalPromptSurface({
   const feedbackTextareaRef = useRef2(null);
   const agentHostApi = useOptionalAgentHostApi() ?? getOptionalAgentHostApi();
   const isDarwin = isDarwinPlatform(agentHostApi?.meta?.platform);
-  const feedbackOptionId = useMemo(
+  const feedbackOptionId = useMemo2(
     () => approvalFeedbackOptionId(prompt.options),
     [prompt.options]
   );
@@ -1055,7 +1045,7 @@ function AskUserPromptSurface({
   const freeText = question ? freeTextByQuestionId[question.id] ?? "" : "";
   const canAdvance = question !== null && (selected.length > 0 || freeText.trim() !== "" || question.options.length === 0);
   const isLast = index >= prompt.questions.length - 1;
-  const payload = useMemo(() => {
+  const payload = useMemo2(() => {
     const answersByQuestionId = {};
     const answers = [];
     for (const current of prompt.questions) {
@@ -1379,12 +1369,13 @@ function interactiveOptionLabel(label, description) {
 // shared/AgentMessageMarkdown.tsx
 import {
   createContext as createContext3,
-  startTransition,
+  startTransition as startTransition2,
   useCallback as useCallback3,
-  useEffect as useEffect3,
+  useEffect as useEffect4,
   useContext as useContext3,
-  useMemo as useMemo2,
-  useState as useState2
+  memo,
+  useMemo as useMemo3,
+  useState as useState3
 } from "react";
 
 // app/renderer/components/ZoomableImage.tsx
@@ -1685,13 +1676,320 @@ function isDirectAgentGeneratedImagePath(path) {
   return /\.(?:png|jpe?g|gif|webp|bmp)$/i.test(path);
 }
 
+// shared/streamingMarkdownTailStabilizer.ts
+var DEFAULT_MAX_TAIL_CHARS = 4096;
+function stabilizeStreamingMarkdownTail(content, options) {
+  if (!options.streaming || content.length === 0) {
+    return { content, changed: false };
+  }
+  const maxTailChars = Math.max(
+    256,
+    options.maxTailChars ?? DEFAULT_MAX_TAIL_CHARS
+  );
+  const tailStart = Math.max(0, content.length - maxTailChars);
+  const tail = content.slice(tailStart);
+  const fence = findOpenFence(tail);
+  if (fence) {
+    return {
+      content: `${content}
+${fence.marker.repeat(fence.length)}`,
+      changed: true,
+      reason: "open-fence"
+    };
+  }
+  const incompleteLink = stabilizeIncompleteTailLink(content);
+  if (incompleteLink) {
+    return incompleteLink;
+  }
+  const listMarker = stabilizeDanglingListMarker(content);
+  if (listMarker) {
+    return listMarker;
+  }
+  const tableRow = stabilizePartialTableRow(content);
+  if (tableRow) {
+    return tableRow;
+  }
+  const inlineCode = findOpenInlineCodeSpan(tail);
+  if (inlineCode) {
+    return {
+      content: `${content}${"`".repeat(inlineCode.length)}`,
+      changed: true,
+      reason: "open-inline-code"
+    };
+  }
+  const emphasis = stabilizeTrailingEmphasisMarker(content);
+  if (emphasis) {
+    return emphasis;
+  }
+  return { content, changed: false };
+}
+function findOpenFence(tail) {
+  let openFence = null;
+  for (const line of tail.replace(/\r\n?/g, "\n").split("\n")) {
+    const fence = parseFenceLine(line);
+    if (!fence) {
+      continue;
+    }
+    if (!openFence) {
+      openFence = fence;
+      continue;
+    }
+    if (fence.marker === openFence.marker && fence.length >= openFence.length) {
+      openFence = null;
+    }
+  }
+  return openFence;
+}
+function parseFenceLine(line) {
+  let index = 0;
+  while (index < line.length && line[index] === " " && index < 4) {
+    index += 1;
+  }
+  const marker = line[index];
+  if (marker !== "`" && marker !== "~") {
+    return null;
+  }
+  let length = 0;
+  while (line[index + length] === marker) {
+    length += 1;
+  }
+  return length >= 3 ? { marker, length } : null;
+}
+function stabilizeIncompleteTailLink(content) {
+  const lineStart = content.lastIndexOf("\n") + 1;
+  const line = content.slice(lineStart);
+  const linkStart = line.lastIndexOf("[");
+  const imageStart = line.lastIndexOf("![");
+  const openBracketIndex = imageStart >= 0 && imageStart + 1 === linkStart ? imageStart : linkStart;
+  if (openBracketIndex < 0) {
+    return null;
+  }
+  const absoluteOpenIndex = lineStart + openBracketIndex;
+  const suffix = content.slice(absoluteOpenIndex);
+  const closeLabelIndex = suffix.indexOf("]");
+  if (closeLabelIndex < 0) {
+    const label2 = suffix.startsWith("![") ? suffix.slice(2) : suffix.slice(1);
+    return {
+      content: `${content.slice(0, absoluteOpenIndex)}${label2}`,
+      changed: true,
+      reason: "incomplete-link-label"
+    };
+  }
+  if (suffix[closeLabelIndex + 1] !== "(" || suffix.includes(")")) {
+    return null;
+  }
+  const label = suffix.startsWith("![") ? suffix.slice(2, closeLabelIndex) : suffix.slice(1, closeLabelIndex);
+  return {
+    content: `${content.slice(0, absoluteOpenIndex)}${label}`,
+    changed: true,
+    reason: "incomplete-link-target"
+  };
+}
+function stabilizeDanglingListMarker(content) {
+  const lineStart = content.lastIndexOf("\n") + 1;
+  const line = content.slice(lineStart);
+  const trimmed = line.trim();
+  const isBullet = trimmed === "-" || trimmed === "*" || trimmed === "+";
+  const isOrdered = trimmed.length >= 2 && trimmed.endsWith(".") && [...trimmed.slice(0, -1)].every((char) => char >= "0" && char <= "9");
+  if (!isBullet && !isOrdered) {
+    return null;
+  }
+  return {
+    content: content.slice(0, lineStart),
+    changed: true,
+    reason: "dangling-list-marker"
+  };
+}
+function stabilizePartialTableRow(content) {
+  if (content.endsWith("\n")) {
+    return null;
+  }
+  const lines = content.replace(/\r\n?/g, "\n").split("\n");
+  const currentLine = lines.at(-1) ?? "";
+  const previousLine = lines.at(-2) ?? "";
+  if (!currentLine.includes("|") || !previousLine.includes("|")) {
+    return null;
+  }
+  if (currentLine.trimEnd().endsWith("|")) {
+    return null;
+  }
+  if (countChar(previousLine, "|") < 2) {
+    return null;
+  }
+  return {
+    content: `${content} |`,
+    changed: true,
+    reason: "partial-table-row"
+  };
+}
+function findOpenInlineCodeSpan(tail) {
+  const lastParagraph = tail.slice(tail.lastIndexOf("\n\n") + 2);
+  let openLength = 0;
+  for (let index = 0; index < lastParagraph.length; index += 1) {
+    if (lastParagraph[index] !== "`") {
+      continue;
+    }
+    let length = 1;
+    while (lastParagraph[index + length] === "`") {
+      length += 1;
+    }
+    if (length >= 3) {
+      index += length - 1;
+      continue;
+    }
+    openLength = openLength === length ? 0 : length;
+    index += length - 1;
+  }
+  return openLength > 0 ? { length: openLength } : null;
+}
+function stabilizeTrailingEmphasisMarker(content) {
+  const marker = content.at(-1);
+  if (marker !== "*" && marker !== "_") {
+    return null;
+  }
+  const previous = content.at(-2);
+  const nextContent = previous === marker ? content.slice(0, -2) : content.slice(0, -1);
+  return {
+    content: nextContent,
+    changed: true,
+    reason: "trailing-emphasis-marker"
+  };
+}
+function countChar(value, char) {
+  let count = 0;
+  for (const current of value) {
+    if (current === char) {
+      count += 1;
+    }
+  }
+  return count;
+}
+
+// shared/useStreamingVisibleText.ts
+import {
+  startTransition,
+  useEffect as useEffect3,
+  useRef as useRef3,
+  useState as useState2
+} from "react";
+var DEFAULT_FRAME_MS = 24;
+var DEFAULT_MAX_CHARS_PER_SECOND = 6e3;
+var DEFAULT_TRAILING_FLUSH_CHARS = 0;
+function useStreamingVisibleText(sourceText, options) {
+  const {
+    enabled,
+    frameMs = DEFAULT_FRAME_MS,
+    maxCharsPerSecond = DEFAULT_MAX_CHARS_PER_SECOND,
+    trailingFlushChars = DEFAULT_TRAILING_FLUSH_CHARS
+  } = options;
+  const [visibleText, setVisibleText] = useState2(sourceText);
+  const sourceRef = useRef3(sourceText);
+  const visibleRef = useRef3(visibleText);
+  const timerRef = useRef3(null);
+  useEffect3(() => {
+    visibleRef.current = visibleText;
+  }, [visibleText]);
+  useEffect3(
+    () => () => {
+      clearStreamingVisibleTextTimer(timerRef);
+    },
+    []
+  );
+  useEffect3(() => {
+    sourceRef.current = sourceText;
+    if (!enabled) {
+      clearStreamingVisibleTextTimer(timerRef);
+      visibleRef.current = sourceText;
+      setVisibleText(sourceText);
+      return;
+    }
+    if (sourceText === visibleRef.current || timerRef.current !== null) {
+      return;
+    }
+    timerRef.current = setTimeout(
+      () => {
+        timerRef.current = null;
+        const nextVisibleText = advanceStreamingVisibleText({
+          visibleText: visibleRef.current,
+          sourceText: sourceRef.current,
+          frameMs,
+          maxCharsPerSecond,
+          trailingFlushChars
+        });
+        if (nextVisibleText === visibleRef.current) {
+          return;
+        }
+        visibleRef.current = nextVisibleText;
+        startTransition(() => {
+          setVisibleText(nextVisibleText);
+        });
+      },
+      Math.max(1, frameMs)
+    );
+    return void 0;
+  }, [
+    enabled,
+    frameMs,
+    maxCharsPerSecond,
+    sourceText,
+    trailingFlushChars,
+    visibleText
+  ]);
+  return enabled ? visibleText : sourceText;
+}
+function advanceStreamingVisibleText({
+  visibleText,
+  sourceText,
+  frameMs = DEFAULT_FRAME_MS,
+  maxCharsPerSecond = DEFAULT_MAX_CHARS_PER_SECOND,
+  trailingFlushChars = DEFAULT_TRAILING_FLUSH_CHARS
+}) {
+  if (visibleText === sourceText) {
+    return visibleText;
+  }
+  const prefixLength = sourceText.startsWith(visibleText) ? visibleText.length : commonPrefixLength(visibleText, sourceText);
+  const stablePrefix = sourceText.slice(0, prefixLength);
+  const remainingLength = sourceText.length - prefixLength;
+  if (remainingLength <= trailingFlushChars) {
+    return sourceText;
+  }
+  const charsPerFrame = Math.max(
+    1,
+    Math.ceil(Math.max(1, maxCharsPerSecond) * Math.max(1, frameMs) / 1e3)
+  );
+  return sourceText.slice(
+    0,
+    Math.min(sourceText.length, stablePrefix.length + charsPerFrame)
+  );
+}
+function commonPrefixLength(left, right) {
+  const maxLength = Math.min(left.length, right.length);
+  for (let index = 0; index < maxLength; index += 1) {
+    if (left.charCodeAt(index) !== right.charCodeAt(index)) {
+      return index;
+    }
+  }
+  return maxLength;
+}
+function clearStreamingVisibleTextTimer(timerRef) {
+  if (timerRef.current === null) {
+    return;
+  }
+  clearTimeout(timerRef.current);
+  timerRef.current = null;
+}
+
 // shared/AgentMessageMarkdown.tsx
-import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 var COLLAPSED_LINE_LIMIT = 8;
 var APPROX_CHARS_PER_LINE = 34;
 var DEFERRED_LONG_MARKDOWN_CHAR_THRESHOLD = 4096;
+var STREAMING_MARKDOWN_EMERGENCY_PLAIN_CHAR_THRESHOLD = 96e3;
 var DEFERRED_LONG_MARKDOWN_FALLBACK_DELAY_MS = 80;
 var DEFERRED_LONG_MARKDOWN_IDLE_TIMEOUT_MS = 700;
+var STREAMING_MARKDOWN_FRAME_MS = 24;
+var STREAMING_MARKDOWN_MAX_CHARS_PER_SECOND = 6e3;
+var STREAMING_MARKDOWN_TAIL_FLUSH_CHARS = 0;
 var PLAIN_SESSION_MENTION_AGENT_LABELS = [
   "Claude Code",
   "Nexight",
@@ -1718,34 +2016,47 @@ function AgentMessageMarkdown({
   inline = false,
   normalizePlainIssueMentionTitle = false,
   deferLongContentRender = false,
-  enableImageZoom = false
+  enableImageZoom = false,
+  streaming = false
 }) {
   "use memo";
   const { t } = useTranslation();
+  const visibleContent = useStreamingVisibleText(content, {
+    enabled: streaming,
+    frameMs: STREAMING_MARKDOWN_FRAME_MS,
+    maxCharsPerSecond: STREAMING_MARKDOWN_MAX_CHARS_PER_SECOND,
+    trailingFlushChars: STREAMING_MARKDOWN_TAIL_FLUSH_CHARS
+  });
+  const stabilizedContent = useMemo3(
+    () => stabilizeStreamingMarkdownTail(visibleContent, {
+      streaming
+    }).content,
+    [streaming, visibleContent]
+  );
   const workspaceRoot = workspaceLinkContext?.workspaceRoot ?? null;
   const basePath = workspaceLinkContext?.basePath ?? null;
   const workspaceLinkSource = workspaceLinkContext?.source ?? null;
-  const [isExpanded, setIsExpanded] = useState2(false);
+  const [isExpanded, setIsExpanded] = useState3(false);
   const resolvedExpandLabel = expandLabel ?? t("agentHost.workspaceAgentMessageExpand");
-  const shouldCollapse = collapsible && isLikelyLongerThanLineLimit(content);
+  const shouldCollapse = collapsible && isLikelyLongerThanLineLimit(stabilizedContent);
   const isCollapsed = shouldCollapse && !isExpanded;
   const ContainerTag = inline ? "span" : "div";
-  const contentSignature = useMemo2(
-    () => hashMarkdownProfilerContent(content),
-    [content]
+  const contentSignature = useMemo3(
+    () => hashMarkdownProfilerContent(stabilizedContent),
+    [stabilizedContent]
   );
-  const normalizedContent = useMemo2(
+  const normalizedContent = useMemo3(
     () => linkBareLocalAbsolutePaths(
       normalizeMentionMarkdownLinks(
         normalizePlainIssueMentionTitle ? normalizePlainIssueMentionTitleContent(
-          normalizePlainSessionMentionTitle(content)
-        ) : normalizePlainSessionMentionTitle(content)
+          normalizePlainSessionMentionTitle(stabilizedContent)
+        ) : normalizePlainSessionMentionTitle(stabilizedContent)
       )
     ),
-    [content, normalizePlainIssueMentionTitle]
+    [normalizePlainIssueMentionTitle, stabilizedContent]
   );
   const isMentionOnly = isMentionOnlyMarkdownContent(normalizedContent);
-  const shouldDeferMarkdownRender = deferLongContentRender && !inline && content.length >= DEFERRED_LONG_MARKDOWN_CHAR_THRESHOLD && !isExpanded;
+  const shouldDeferMarkdownRender = deferLongContentRender && !inline && content.length >= (streaming ? STREAMING_MARKDOWN_EMERGENCY_PLAIN_CHAR_THRESHOLD : DEFERRED_LONG_MARKDOWN_CHAR_THRESHOLD) && !isExpanded;
   const markdownRenderReady = useDeferredMarkdownRenderReady(
     contentSignature,
     shouldDeferMarkdownRender
@@ -1780,7 +2091,7 @@ function AgentMessageMarkdown({
     },
     [handleLinkClick]
   );
-  const markdownComponents = useMemo2(
+  const markdownComponents = useMemo3(
     () => ({
       a: (props) => /* @__PURE__ */ jsx6(
         MarkdownLink,
@@ -1836,7 +2147,13 @@ function AgentMessageMarkdown({
             "data-agent-mention-only": isMentionOnly ? "true" : void 0,
             "data-collapsed": isCollapsed ? "true" : "false",
             onClickCapture: handleAnchorClickCapture,
-            children: markdownRenderReady ? /* @__PURE__ */ jsx6(
+            children: markdownRenderReady ? streaming ? /* @__PURE__ */ jsx6(
+              StreamingMarkdownBlocks,
+              {
+                content: normalizedContent,
+                components: markdownComponents
+              }
+            ) : /* @__PURE__ */ jsx6(
               ReactMarkdown,
               {
                 remarkPlugins: [remarkGfm],
@@ -1868,6 +2185,92 @@ function AgentMessageMarkdown({
     }
   );
 }
+function StreamingMarkdownBlocks({
+  content,
+  components
+}) {
+  const blocks = useMemo3(
+    () => splitStreamingMarkdownBlocks(content),
+    [content]
+  );
+  return /* @__PURE__ */ jsx6(Fragment2, { children: blocks.map((block, index) => /* @__PURE__ */ jsx6(
+    MemoizedMarkdownBlock,
+    {
+      content: block.content,
+      components
+    },
+    `${index}:${hashMarkdownProfilerContent(block.initialKeyContent)}`
+  )) });
+}
+var MemoizedMarkdownBlock = memo(function MemoizedMarkdownBlock2({
+  content,
+  components
+}) {
+  return /* @__PURE__ */ jsx6(
+    ReactMarkdown,
+    {
+      remarkPlugins: [remarkGfm],
+      rehypePlugins: [[rehypeSanitize, MARKDOWN_SANITIZE_SCHEMA]],
+      urlTransform: markdownUrlTransform,
+      components,
+      children: content
+    }
+  );
+});
+function splitStreamingMarkdownBlocks(content) {
+  const normalized = content.replace(/\r\n?/g, "\n");
+  if (!normalized) {
+    return [{ content: "", initialKeyContent: "" }];
+  }
+  const lines = normalized.split("\n");
+  const blocks = [];
+  const current = [];
+  let fence = null;
+  for (const line of lines) {
+    current.push(line);
+    const lineFence = parseStreamingFence(line);
+    if (lineFence) {
+      if (!fence) {
+        fence = lineFence;
+      } else if (lineFence.marker === fence.marker && lineFence.length >= fence.length) {
+        fence = null;
+      }
+      continue;
+    }
+    if (!fence && line.trim() === "") {
+      pushStreamingMarkdownBlock(blocks, current);
+    }
+  }
+  pushStreamingMarkdownBlock(blocks, current);
+  return blocks.length > 0 ? blocks : [{ content: normalized, initialKeyContent: normalized }];
+}
+function pushStreamingMarkdownBlock(blocks, lines) {
+  if (lines.length === 0) {
+    return;
+  }
+  const content = lines.join("\n");
+  if (!content) {
+    lines.length = 0;
+    return;
+  }
+  blocks.push({
+    content,
+    initialKeyContent: content
+  });
+  lines.length = 0;
+}
+function parseStreamingFence(line) {
+  const trimmed = line.trimStart();
+  const marker = trimmed[0];
+  if (marker !== "`" && marker !== "~") {
+    return null;
+  }
+  let length = 0;
+  while (trimmed[length] === marker) {
+    length += 1;
+  }
+  return length >= 3 ? { marker, length } : null;
+}
 function resolveMarkdownAnchorHref(target) {
   if (!(target instanceof Element)) {
     return null;
@@ -1907,11 +2310,11 @@ function activateMarkdownLinkFromPointer(event, href, onLinkClick) {
   activateMarkdownLink(event, href, onLinkClick);
 }
 function useDeferredMarkdownRenderReady(contentSignature, shouldDefer) {
-  const [readySignature, setReadySignature] = useState2(
+  const [readySignature, setReadySignature] = useState3(
     shouldDefer ? null : contentSignature
   );
   const renderReady = !shouldDefer || readySignature === contentSignature;
-  useEffect3(() => {
+  useEffect4(() => {
     if (!shouldDefer) {
       setReadySignature(contentSignature);
       return;
@@ -1923,7 +2326,7 @@ function useDeferredMarkdownRenderReady(contentSignature, shouldDefer) {
       if (canceled) {
         return;
       }
-      startTransition(() => {
+      startTransition2(() => {
         setReadySignature(contentSignature);
       });
     };
@@ -2232,10 +2635,10 @@ function MarkdownImage({
   const canReadWorkspaceImage = Boolean(workspacePath && readWorkspaceImage);
   const shouldEnableZoom = enableZoom && !isInsideLink;
   const resolvedSrc = typeof src === "string" ? resolveRenderableMarkdownImageSrc(src) : src;
-  const [state, setState] = useState2(
+  const [state, setState] = useState3(
     () => canReadWorkspaceImage && workspacePath ? peekCachedMarkdownImageState(workspacePath) ?? { status: "loading" } : null
   );
-  useEffect3(() => {
+  useEffect4(() => {
     if (!workspacePath || !readWorkspaceImage) {
       setState(null);
       return;
@@ -2784,9 +3187,9 @@ function workspaceAgentActivityStatusLabel(status, t) {
 import {
   forwardRef as forwardRef2,
   useCallback as useCallback4,
-  useEffect as useEffect4,
-  useRef as useRef3,
-  useState as useState3
+  useEffect as useEffect5,
+  useRef as useRef4,
+  useState as useState4
 } from "react";
 import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
 var MIN_THUMB_HEIGHT = 24;
@@ -2799,14 +3202,14 @@ function CustomScrollbar({
   syncKey
 }) {
   "use memo";
-  const trackRef = useRef3(null);
-  const dragStateRef = useRef3(null);
-  const [scrollbarState, setScrollbarState] = useState3({
+  const trackRef = useRef4(null);
+  const dragStateRef = useRef4(null);
+  const [scrollbarState, setScrollbarState] = useState4({
     scrollable: false,
     thumbHeight: 0,
     thumbTop: 0
   });
-  const [dragging, setDragging] = useState3(false);
+  const [dragging, setDragging] = useState4(false);
   const syncScrollbarState = useCallback4(() => {
     const viewport = getViewport();
     if (!viewport) {
@@ -2908,7 +3311,7 @@ function CustomScrollbar({
     },
     [getViewport, scrollbarState.scrollable, scrollbarState.thumbHeight]
   );
-  useEffect4(() => {
+  useEffect5(() => {
     if (!dragging) {
       return;
     }
@@ -2933,7 +3336,7 @@ function CustomScrollbar({
       window.removeEventListener("mouseup", handleMouseUp);
     };
   }, [dragging, getViewport, syncScrollbarState]);
-  useEffect4(() => {
+  useEffect5(() => {
     const viewport = getViewport();
     if (!viewport) {
       setScrollbarState({ scrollable: false, thumbHeight: 0, thumbTop: 0 });
@@ -2987,7 +3390,7 @@ var CustomScrollArea = forwardRef2(function CustomScrollArea2({
   ...viewportProps
 }, forwardedRef) {
   "use memo";
-  const viewportRef = useRef3(null);
+  const viewportRef = useRef4(null);
   const getViewport = useCallback4(() => viewportRef.current, []);
   return /* @__PURE__ */ jsxs5(
     "div",
@@ -3072,4 +3475,4 @@ export {
   normalizeWorkspaceAgentActivityDisplayStatus,
   workspaceAgentActivityStatusLabel
 };
-//# sourceMappingURL=chunk-AF5CXBJN.js.map
+//# sourceMappingURL=chunk-5Q36BEUM.js.map