@blade-hq/agent-react 2610.0.0-beta.29 → 2610.0.0-beta.30

package/README.md

@@ -158,6 +158,8 @@ await replay.exitToAutonomous()                // 退出回放，之后真的运
 
 `ChatView` 的普通展示模式不显示只供诊断的项目说明、可用能力和当前工作环境。需要自建诊断界面时，可直接使用独立的 `ContextCard`，属性见 `ContextCardProps`；状态到文案的映射来自 agent-client 的 `getContextDisplayState`，不需要接入方重复判断。底层数据类型为 `ContextProjectionData` / `ContextProjectionFields`，展示结果为 `ContextDisplayState`，并保留 `ContextAction`、`ContextSourceInfo` 和 `contextProjectionData` 给 headless 消费方。
 
+记忆引用提示可通过 `MemoryRefsHint` 展示，`collectMemoryRefs` 用于从一轮消息中聚合引用，保证宿主自定义消息布局与 SDK 默认界面保持一致。
+
 `onFollowupInteraction` 使用 `FollowupInteractionEvent`，覆盖下一步建议展示/采纳、成果展示/打开/下载以及结果评分。SDK 不内置 PostHog 等分析厂商；宿主回调抛错也不会中断用户点击或下载。
 文件成果以文件名为文本的标准下载链接展示；Vue / 纯 HTML 使用的 `<blade-chat>` 与 `ChatView` 行为一致。
 

package/dist/components/AssistantTurnBlock.d.ts

@@ -1,4 +1,4 @@
-import type { AskUserAnswerData, ChatMessage } from "@blade-hq/agent-client";
+import type { AskUserAnswerData, ChatMessage, MemoryRefInfo } from "@blade-hq/agent-client";
 import { type ToolCallRenderer } from "./ToolCallBlock";
 interface Props {
     messages: ChatMessage[];
@@ -23,4 +23,8 @@ export declare function getExecutionDurationMs({ messages, isStreaming, now, }:
 }): number;
 /** 一轮助手回复：执行过程默认折叠，最终正文始终显示在摘要下方。 */
 export declare function AssistantTurnBlock({ messages, isStreaming, askAnswers, onAnswer, sessionStatus, toolCallRenderer, sessionId, }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function collectMemoryRefs(messages: ChatMessage[]): MemoryRefInfo[];
+export declare function MemoryRefsHint({ refs }: {
+    refs: MemoryRefInfo[];
+}): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/embed/entry.d.ts

@@ -38,6 +38,7 @@ declare const BladeAgent: {
     sortComputers: typeof agentClient.sortComputers;
     ModelsResource: typeof agentClient.ModelsResource;
     buildMessageContent: typeof agentClient.buildMessageContent;
+    chatErrorForDisplay: typeof agentClient.chatErrorForDisplay;
     contentPreview: typeof agentClient.contentPreview;
     extractTextAttachments: typeof agentClient.extractTextAttachments;
     getFileParts: typeof agentClient.getFileParts;

package/dist/index.d.ts

@@ -24,6 +24,7 @@ export type { ReplayMismatchPromptProps } from "./components/ReplayMismatchPromp
 export type { ToolCallRenderer } from "./components/ToolCallBlock";
 export { ContextCard } from "./components/ContextCard";
 export type { ContextCardProps } from "./components/ContextCard";
+export { collectMemoryRefs, MemoryRefsHint } from "./components/AssistantTurnBlock";
 export { isAgentComputerCommand, isAgentComputerToolCall, classifyAgentComputerLaunchOutcome, } from "./lib/agent-computer-command";
 export type { AgentComputerLaunchOutcome } from "./lib/agent-computer-command";
 export * from "@blade-hq/agent-client";

package/dist/index.js

@@ -1221,6 +1221,9 @@ function ReplayMismatchPrompt({ mismatch, className }) {
   );
 }
 
+// src/components/ChatSurface.tsx
+import { chatErrorForDisplay as chatErrorForDisplay2 } from "@blade-hq/agent-client";
+
 // src/components/ChatInput.tsx
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
 function isImeCompositionKey(event) {
@@ -2708,6 +2711,32 @@ function getLastContentMessage(messages) {
   }
   return null;
 }
+function getOrderedMessageParts(message, toolCalls) {
+  const blocks = message.blocks ?? [];
+  if (!blocks.some((block) => block.type === "text") || !blocks.some((block) => block.type === "tool_use")) return [];
+  const toolsById = new Map(toolCalls.map((toolCall) => [toolCall.id, toolCall]));
+  const seenToolIds = /* @__PURE__ */ new Set();
+  const parts = [];
+  for (const [index, block] of blocks.entries()) {
+    if (block.type === "text" && block.content != null && block.content !== "") {
+      const content = Array.isArray(block.content) ? block.content : String(block.content);
+      parts.push({ type: "text", key: `text-${index}`, content });
+    }
+    if (block.type !== "tool_use" || !block.tool_call_id) continue;
+    const toolCall = toolsById.get(block.tool_call_id);
+    if (!toolCall) continue;
+    seenToolIds.add(toolCall.id);
+    const previous = parts[parts.length - 1];
+    if (previous?.type === "tools") previous.toolCalls.push(toolCall);
+    else parts.push({ type: "tools", key: `tools-${index}`, toolCalls: [toolCall] });
+  }
+  const missingTools = toolCalls.filter((toolCall) => !seenToolIds.has(toolCall.id));
+  if (seenToolIds.size === 0) return [];
+  if (missingTools.length > 0) {
+    parts.push({ type: "tools", key: "tools-missing", toolCalls: missingTools });
+  }
+  return parts;
+}
 function findLatestReasoningMessageIndex(messages) {
   for (let index = messages.length - 1; index >= 0; index -= 1) {
     if (messages[index].reasoning) return index;
@@ -2883,6 +2912,13 @@ function AssistantTurnBlock({
     (message) => message.status === "failed" && !hasRenderableMessageContent(message)
   );
   const finalMessage = getLastContentMessage(messages);
+  const turnToolCalls = messages.flatMap((message) => message.tool_calls ?? []);
+  const finalOrderedParts = finalMessage ? getOrderedMessageParts(
+    finalMessage,
+    (finalMessage.tool_calls ?? []).filter(
+      (toolCall) => formatToolName(toolCall.name) !== "AskUserQuestion"
+    )
+  ) : [];
   const hasExecutionProcess = messages.some(
     (message) => message.reasoning || (message.tool_calls?.length ?? 0) > 0
   );
@@ -2921,6 +2957,7 @@ function AssistantTurnBlock({
     return () => window.clearInterval(timer);
   }, [hasLiveStartTime, isStreaming]);
   const liveExecutionDurationMs = isStreaming ? getExecutionDurationMs({ messages, isStreaming, now: clock }) : executionDurationMs;
+  const memoryRefs = collectMemoryRefs(messages);
   if (!hasExecutionProcess) {
     return /* @__PURE__ */ jsxs9(
       "div",
@@ -2928,6 +2965,7 @@ function AssistantTurnBlock({
         "aria-busy": isStreaming || void 0,
         className: "blade-chat-assistant-turn flex flex-col gap-3",
         children: [
+          memoryRefs.length > 0 ? /* @__PURE__ */ jsx11(MemoryRefsHint, { refs: memoryRefs }) : null,
           hasInterrupted && /* @__PURE__ */ jsx11("div", { className: "ml-4 w-fit rounded-full border border-amber-500/30 bg-amber-500/10 px-2.5 py-1 text-[10px] font-medium uppercase tracking-[0.12em] text-amber-300", children: "\u5DF2\u4E2D\u65AD" }),
           hasFailedWithoutContent && /* @__PURE__ */ jsx11("div", { className: "ml-4 w-fit rounded-full border border-red-500/30 bg-red-500/10 px-2.5 py-1 text-[10px] font-medium text-red-400", children: "\u751F\u6210\u5931\u8D25" }),
           messages.map((message, index) => {
@@ -2957,6 +2995,7 @@ function AssistantTurnBlock({
       "aria-busy": isStreaming || void 0,
       className: "blade-chat-assistant-turn flex flex-col gap-3",
       children: [
+        memoryRefs.length > 0 ? /* @__PURE__ */ jsx11(MemoryRefsHint, { refs: memoryRefs }) : null,
         hasInterrupted && /* @__PURE__ */ jsx11("div", { className: "ml-4 w-fit rounded-full border border-amber-500/30 bg-amber-500/10 px-2.5 py-1 text-[10px] font-medium uppercase tracking-[0.12em] text-amber-300", children: "\u5DF2\u4E2D\u65AD" }),
         hasFailedWithoutContent && /* @__PURE__ */ jsx11("div", { className: "ml-4 w-fit rounded-full border border-red-500/30 bg-red-500/10 px-2.5 py-1 text-[10px] font-medium text-red-400", children: "\u751F\u6210\u5931\u8D25" }),
         /* @__PURE__ */ jsxs9("div", { className: "flex w-full items-start gap-2.5", children: [
@@ -3013,6 +3052,7 @@ function AssistantTurnBlock({
           const toolCalls = (message.tool_calls ?? []).filter(
             (toolCall) => formatToolName(toolCall.name) !== "AskUserQuestion"
           );
+          const orderedParts = getOrderedMessageParts(message, toolCalls);
           const showReasoning = !!message.reasoning && isStreaming && index === latestReasoningIndex;
           return /* @__PURE__ */ jsxs9(
             "div",
@@ -3020,7 +3060,21 @@ function AssistantTurnBlock({
               className: "flex flex-col gap-3",
               children: [
                 showReasoning && message.reasoning ? /* @__PURE__ */ jsx11(ThinkingBlock, { reasoning: message.reasoning, isStreaming: streamingThis && !text }) : null,
-                hasRenderableMessageContent(message) && message !== finalMessage ? /* @__PURE__ */ jsx11(
+                orderedParts.length > 0 ? orderedParts.map(
+                  (part) => part.type === "text" ? /* @__PURE__ */ jsx11(
+                    AssistantMessageContent,
+                    {
+                      message: { ...message, content: part.content, tool_calls: turnToolCalls },
+                      sessionId,
+                      streaming: streamingThis,
+                      compact: true
+                    },
+                    part.key
+                  ) : /* @__PURE__ */ jsx11("div", { className: "flex flex-col gap-0.5", children: part.toolCalls.map((toolCall) => {
+                    const custom = toolCallRenderer?.(toolCall);
+                    return custom !== null && custom !== void 0 ? /* @__PURE__ */ jsx11("div", { children: custom }, toolCall.id) : formatToolName(toolCall.name) === "Agent" ? /* @__PURE__ */ jsx11(AgentLoopBlock, { toolCall }, toolCall.id) : /* @__PURE__ */ jsx11(ExecutionToolRow, { toolCall }, toolCall.id);
+                  }) }, part.key)
+                ) : hasRenderableMessageContent(message) && message !== finalMessage ? /* @__PURE__ */ jsx11(
                   AssistantMessageContent,
                   {
                     message,
@@ -3029,7 +3083,7 @@ function AssistantTurnBlock({
                     compact: true
                   }
                 ) : null,
-                toolCalls.length > 0 ? /* @__PURE__ */ jsx11("div", { className: "flex flex-col gap-0.5", children: toolCalls.map((toolCall) => {
+                orderedParts.length === 0 && toolCalls.length > 0 ? /* @__PURE__ */ jsx11("div", { className: "flex flex-col gap-0.5", children: toolCalls.map((toolCall) => {
                   const custom = toolCallRenderer?.(toolCall);
                   return custom !== null && custom !== void 0 ? /* @__PURE__ */ jsx11("div", { children: custom }, toolCall.id) : formatToolName(toolCall.name) === "Agent" ? /* @__PURE__ */ jsx11(AgentLoopBlock, { toolCall }, toolCall.id) : /* @__PURE__ */ jsx11(ExecutionToolRow, { toolCall }, toolCall.id);
                 }) }) : null
@@ -3038,7 +3092,7 @@ function AssistantTurnBlock({
             message.entry_id ?? `${message.timestamp ?? "assistant"}-${index}`
           );
         }) }) : null,
-        finalMessage ? /* @__PURE__ */ jsx11("div", { className: "ml-10", children: /* @__PURE__ */ jsx11(
+        finalMessage && (effectiveMode === "compact" || finalOrderedParts.length === 0) ? /* @__PURE__ */ jsx11("div", { className: "ml-10", children: /* @__PURE__ */ jsx11(
           AssistantMessageContent,
           {
             message: finalMessage,
@@ -3063,6 +3117,33 @@ function AssistantTurnBlock({
     }
   );
 }
+function collectMemoryRefs(messages) {
+  const refs = /* @__PURE__ */ new Map();
+  for (const message of messages) {
+    for (const ref of message.memory_refs ?? []) if (!refs.has(ref.id)) refs.set(ref.id, ref);
+  }
+  return [...refs.values()];
+}
+function MemoryRefsHint({ refs }) {
+  const [expanded, setExpanded] = useState10(false);
+  const label = refs.some((ref) => ref.skill_name) ? "\u53C2\u8003\u4E86\u8BE5\u6280\u80FD\u7684\u5386\u53F2\u7ECF\u9A8C" : "\u53C2\u8003\u4E86\u5386\u53F2\u7ECF\u9A8C";
+  return /* @__PURE__ */ jsxs9("div", { className: "blade-chat-memory-refs ml-1 w-full max-w-[680px]", children: [
+    /* @__PURE__ */ jsxs9("button", { type: "button", onClick: () => setExpanded((value) => !value), className: "inline-flex h-8 items-center gap-1.5 rounded-lg border border-[hsl(var(--primary)/0.22)] bg-[hsl(var(--primary)/0.07)] px-3 text-xs font-medium text-[hsl(var(--primary))]", children: [
+      /* @__PURE__ */ jsx11(BookOpen, { size: 12 }),
+      /* @__PURE__ */ jsxs9("span", { children: [
+        label,
+        "\uFF08",
+        refs.length,
+        "\uFF09"
+      ] }),
+      /* @__PURE__ */ jsx11(ChevronRight, { size: 10, className: cn("transition-transform", expanded && "rotate-90") })
+    ] }),
+    expanded ? /* @__PURE__ */ jsx11("div", { className: "mt-2 flex flex-col gap-2 rounded-xl border border-[hsl(var(--border)/0.8)] bg-[hsl(var(--muted)/0.28)] p-2.5", children: refs.map((ref) => /* @__PURE__ */ jsxs9("div", { className: "rounded-lg border border-[hsl(var(--border)/0.55)] bg-[hsl(var(--background)/0.72)] px-3 py-2.5 text-xs", children: [
+      /* @__PURE__ */ jsx11("p", { className: "line-clamp-2 break-words leading-5", children: ref.content_preview }),
+      ref.skill_name ? /* @__PURE__ */ jsx11("span", { className: "mt-1 inline-flex text-[10px] text-[hsl(var(--primary))]", children: ref.skill_name }) : null
+    ] }, ref.id)) }) : null
+  ] });
+}
 function AssistantMessageContent({
   message,
   sessionId,
@@ -3565,7 +3646,12 @@ function PostChatFollowupBlock({
 }
 
 // src/components/UserMessageBubble.tsx
-import { getFileParts as getFileParts2, getImageParts as getImageParts2, getTextContent as getTextContent2 } from "@blade-hq/agent-client";
+import {
+  chatErrorForDisplay,
+  getFileParts as getFileParts2,
+  getImageParts as getImageParts2,
+  getTextContent as getTextContent2
+} from "@blade-hq/agent-client";
 import { jsx as jsx14, jsxs as jsxs12 } from "react/jsx-runtime";
 function isUserMessage(message) {
   return message.role === "user";
@@ -3610,8 +3696,8 @@ function ErrorMessageBlock({
   message,
   className
 }) {
-  const text = getTextContent2(message.content);
-  return /* @__PURE__ */ jsx14("div", { className: cn("blade-chat-error-row flex justify-center", className), children: /* @__PURE__ */ jsx14("div", { className: "blade-chat-error-block max-w-[85%] border-l-[3px] border-[hsl(var(--border))] px-4 py-1 text-sm leading-7 text-[hsl(var(--muted-foreground))]", children: text }) });
+  const text = chatErrorForDisplay(getTextContent2(message.content));
+  return /* @__PURE__ */ jsx14("div", { className: cn("blade-chat-error-row flex min-w-0 justify-start", className), children: /* @__PURE__ */ jsx14("div", { className: "blade-chat-error-block min-w-0 max-w-full whitespace-pre-wrap break-words border-l-[3px] border-[hsl(var(--border))] px-3 py-1 text-left text-sm leading-7 text-[hsl(var(--muted-foreground))] [overflow-wrap:anywhere]", children: text }) });
 }
 
 // src/components/MessageList.tsx
@@ -3987,7 +4073,7 @@ function ChatSurface({
         banner,
         errorMessage && /* @__PURE__ */ jsxs14("div", { className: "blade-chat-error-bar flex items-start gap-2 border-b px-4 py-3 text-sm", children: [
           /* @__PURE__ */ jsx16(CircleAlert, { size: 16, className: "mt-0.5 shrink-0" }),
-          /* @__PURE__ */ jsx16("span", { children: errorMessage })
+          /* @__PURE__ */ jsx16("span", { className: "min-w-0 whitespace-pre-wrap break-words [overflow-wrap:anywhere]", children: chatErrorForDisplay2(errorMessage) })
         ] }),
         slots?.header,
         /* @__PURE__ */ jsx16(
@@ -4557,9 +4643,11 @@ export {
   ContextCard,
   LlmChat,
   MarkdownContent,
+  MemoryRefsHint,
   ReplayBar,
   ReplayMismatchPrompt,
   classifyAgentComputerLaunchOutcome,
+  collectMemoryRefs,
   isAgentComputerCommand,
   isAgentComputerToolCall,
   useAgentSession,