@vegintech/langchain-react-agent 0.0.22 → 0.0.24

package/dist/index.d.mts

@@ -211,8 +211,6 @@ interface MessageConfig {
   literalTagContent?: string[];
   /** Loading 动画颜色，支持 CSS 颜色值 */
   loadingColor?: string;
-  /** 空状态配置 */
-  emptyState?: EmptyStateConfig;
 }
 /** 输入框配置 */
 interface InputConfig extends SenderCustomizationProps {
@@ -240,6 +238,8 @@ interface AgentChatProps {
   onAgentStateChange?: (state: Record<string, unknown>) => void;
   /** 是否显示调试面板，默认 false。仅在开发环境生效 */
   showDebug?: boolean;
+  /** 欢迎组件，当消息列表为空且非加载状态时显示 */
+  welcome?: ReactNode;
 }
 /** AgentChat 组件对外暴露的方法 */
 interface AgentChatRef {
@@ -288,12 +288,6 @@ interface MessageListProps {
   loadingColor?: string;
   /** Interrupt 渲染函数，用于在消息列表中渲染中断 UI */
   interruptRender?: () => ReactNode;
-  /** 空状态配置 */
-  emptyState?: {
-    /** 空状态标题 */title?: string; /** 空状态描述 */
-    description?: string; /** 自定义渲染 */
-    render?: () => ReactNode;
-  };
 }
 //#endregion
 //#region src/components/AgentChat.d.ts

package/dist/index.mjs

@@ -314,7 +314,7 @@ const renderMessageContent = (message, isLastMessage, isLoading, tools, toolExec
 				children: /* @__PURE__ */ jsx(ReasoningContent, { content: message.reasoningContent })
 			}),
 			!isContentEmpty && /* @__PURE__ */ jsx("div", {
-				style: { marginTop: message.reasoningContent ? "8px" : "3px" },
+				style: { marginTop: message.type == "human" ? "0px" : "8px" },
 				children: /* @__PURE__ */ jsx(MessageContentRenderer, {
 					content: message.content,
 					components,
@@ -378,7 +378,7 @@ const roleConfig = {
 		}
 	}
 };
-const MessageList = ({ messages, isLoading = false, className = "", tools, toolExecutions, components, securityConfig, loadingColor, interruptRender, emptyState }) => {
+const MessageList = ({ messages, isLoading = false, className = "", tools, toolExecutions, components, securityConfig, loadingColor, interruptRender }) => {
 	const reasoningCacheRef = useRef(/* @__PURE__ */ new Map());
 	const processedMessages = useMemo(() => {
 		const cache = reasoningCacheRef.current;
@@ -444,19 +444,10 @@ const MessageList = ({ messages, isLoading = false, className = "", tools, toolE
 		placement: "start",
 		style: { paddingBlock: 0 }
 	}] : items;
-	if (allItems.length === 0) {
-		if (emptyState?.render) return /* @__PURE__ */ jsx("div", {
-			className: `agent-message-list empty ${className}`,
-			children: emptyState.render()
-		});
-		return /* @__PURE__ */ jsx("div", {
-			className: `agent-message-list empty ${className}`,
-			children: /* @__PURE__ */ jsxs("div", {
-				className: "agent-message-empty",
-				children: [emptyState?.title && /* @__PURE__ */ jsx("h4", { children: emptyState.title }), emptyState?.description ? /* @__PURE__ */ jsx("p", { children: emptyState.description }) : /* @__PURE__ */ jsx("p", { children: "开始对话吧" })]
-			})
-		});
-	}
+	if (allItems.length === 0) return /* @__PURE__ */ jsx("div", {
+		className: `agent-message-list empty ${className}`,
+		children: /* @__PURE__ */ jsx("div", { className: "agent-message-empty" })
+	});
 	return /* @__PURE__ */ jsx(Bubble.List, {
 		className: `agent-message-list ${className}`,
 		items: allItems,
@@ -1358,7 +1349,7 @@ function injectStyles() {
 //#endregion
 //#region src/components/AgentChat.tsx
 injectStyles();
-const AgentChat = forwardRef(({ apiUrl, assistantId, headers, threadId, onThreadIdChange, className = "", tools, contexts, messageConfig, inputConfig, onError, interruptConfig, agentState, onAgentStateChange, showDebug }, ref) => {
+const AgentChat = forwardRef(({ apiUrl, assistantId, headers, threadId, onThreadIdChange, className = "", tools, contexts, messageConfig, inputConfig, onError, interruptConfig, agentState, onAgentStateChange, showDebug, welcome }, ref) => {
 	const { onPreSend, ...chatInputConfig } = inputConfig || {};
 	const chatInputRef = useRef(null);
 	const stream = useStream({
@@ -1409,12 +1400,15 @@ const AgentChat = forwardRef(({ apiUrl, assistantId, headers, threadId, onThread
 			return next;
 		});
 	}, []);
+	const frontendTools = useMemo(() => {
+		return tools?.filter(isFrontendTool) || [];
+	}, [tools]);
 	const submitToStream = useCallback(async (submitMessages) => {
 		await stream.submit({
 			...agentState,
 			messages: submitMessages,
 			agentkit: {
-				actions: tools,
+				actions: frontendTools,
 				context: contexts
 			}
 		}, {
@@ -1431,7 +1425,7 @@ const AgentChat = forwardRef(({ apiUrl, assistantId, headers, threadId, onThread
 		});
 	}, [
 		stream,
-		tools,
+		frontendTools,
 		contexts,
 		agentState
 	]);
@@ -1472,13 +1466,16 @@ const AgentChat = forwardRef(({ apiUrl, assistantId, headers, threadId, onThread
 		onToolResultsBatch: handleToolResultsBatch,
 		completedToolResults: toolResults
 	});
+	const shouldRenderWelcome = messages.length === 0 && !isLoading && welcome;
 	return /* @__PURE__ */ jsxs("div", {
 		className: `agent-chat-container ${className}`,
 		children: [
-			/* @__PURE__ */ jsx(MessageList, {
+			shouldRenderWelcome ? /* @__PURE__ */ jsx("div", {
+				className: "agent-message-list agent-chat-welcome",
+				children: welcome
+			}) : /* @__PURE__ */ jsx(MessageList, {
 				messages,
 				isLoading: stream.isLoading,
-				className: "agent-chat-messages",
 				tools,
 				toolExecutions,
 				components: messageConfig?.components,
@@ -1487,8 +1484,7 @@ const AgentChat = forwardRef(({ apiUrl, assistantId, headers, threadId, onThread
 					literalTagContent: messageConfig?.literalTagContent
 				},
 				loadingColor: messageConfig?.loadingColor,
-				interruptRender,
-				emptyState: messageConfig?.emptyState
+				interruptRender
 			}),
 			/* @__PURE__ */ jsx(ChatInput, {
 				ref: chatInputRef,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vegintech/langchain-react-agent",
-  "version": "0.0.22",
+  "version": "0.0.24",
   "description": "LangChain Agent UI component library for React",
   "license": "MIT",
   "files": [