@vegintech/langchain-react-agent 0.0.6 → 0.0.8

package/dist/index.d.mts

@@ -1,9 +1,18 @@
 import * as react from "react";
-import { ReactNode } from "react";
+import { CSSProperties, ReactNode } from "react";
 import { Components } from "streamdown";
 import { BaseNode, InsertPosition, NodeRender, SenderProps, SkillType, SlotConfigType } from "@ant-design/x/es/sender/interface.ts";
 
 //#region src/types.d.ts
+/** ToolCard 各部件的样式配置 */
+interface ToolCardStyles {
+  /** icon 容器的样式 */
+  icon?: CSSProperties;
+  /** prefix 文本的样式 */
+  prefix?: CSSProperties;
+  /** content 文本的样式 */
+  content?: CSSProperties;
+}
 /** ToolCard 组件 Props */
 interface ToolCardProps {
   /**
@@ -18,6 +27,14 @@ interface ToolCardProps {
    * 左侧图标
    */
   icon: ReactNode;
+  /**
+   * 根节点样式
+   */
+  style?: CSSProperties;
+  /**
+   * 各部件的样式配置，可分别设置 icon、prefix、content 的样式
+   */
+  styles?: ToolCardStyles;
 }
 /** Interrupt 事件数据结构 */
 interface InterruptEvent {
@@ -247,4 +264,4 @@ declare const AgentChat: react.ForwardRefExoticComponent<AgentChatProps & react.
  */
 declare const ToolCard: React.FC<ToolCardProps>;
 //#endregion
-export { AgentChat, type AgentChatInputRef, type AgentChatProps, type AgentChatRef, type BackendTool, type ChatMessage, type ContextItem, type EmptyStateConfig, type FrontendTool, type InputConfig, type InterruptConfig, type InterruptEvent, type InterruptManagerProps, type InterruptRenderProps, type MessageConfig, type MessageType, type SenderCustomizationProps, type SenderSlotConfig, type SenderSubmitParams, type ToolCallInput, ToolCard, type ToolCardProps, type ToolDefinition, type ToolExecutionRecord, type ToolExecutionStatus, type ToolParameterSchema, type ToolRenderProps };
+export { AgentChat, type AgentChatInputRef, type AgentChatProps, type AgentChatRef, type BackendTool, type ChatMessage, type ContextItem, type EmptyStateConfig, type FrontendTool, type InputConfig, type InterruptConfig, type InterruptEvent, type InterruptManagerProps, type InterruptRenderProps, type MessageConfig, type MessageType, type SenderCustomizationProps, type SenderSlotConfig, type SenderSubmitParams, type ToolCallInput, ToolCard, type ToolCardProps, type ToolCardStyles, type ToolDefinition, type ToolExecutionRecord, type ToolExecutionStatus, type ToolParameterSchema, type ToolRenderProps };

package/dist/index.mjs

@@ -208,22 +208,6 @@ const CustomParagraph = (props) => {
 	const { node, ...rest } = props;
 	return /* @__PURE__ */ jsx("span", { ...rest });
 };
-const renderMarkdown = (content, customComponents, securityConfig) => {
-	return /* @__PURE__ */ jsx(Streamdown, {
-		components: {
-			p: CustomParagraph,
-			...customComponents
-		},
-		allowedTags: securityConfig?.allowedTags,
-		literalTagContent: securityConfig?.literalTagContent,
-		controls: { table: {
-			copy: false,
-			download: false,
-			fullscreen: false
-		} },
-		children: content ?? ""
-	});
-};
 const renderMessageContent = (message, isLastMessage, isLoading, tools, toolExecutions, components, securityConfig) => {
 	const hasToolCalls = message.toolCalls && message.toolCalls.length > 0;
 	const shouldBlink = isLastMessage && isLoading && !message.content && message.toolCalls?.length == 0;
@@ -267,19 +251,10 @@ const renderMessageContent = (message, isLastMessage, isLoading, tools, toolExec
 	}, message.id);
 };
 const toBubbleItem = (message, isLastMessage, isLoading, tools, toolExecutions, components, securityConfig) => {
-	const hasReasoning = !!message.reasoningContent;
-	const hasToolCalls = message.toolCalls && message.toolCalls.length > 0;
-	if (hasReasoning || hasToolCalls) return {
-		key: message.id,
-		role: message.type === "human" ? "user" : "ai",
-		content: renderMessageContent(message, isLastMessage, isLoading, tools, toolExecutions, components, securityConfig),
-		placement: message.type === "human" ? "end" : "start"
-	};
 	return {
 		key: message.id,
 		role: message.type === "human" ? "user" : "ai",
-		content: message.content,
-		contentRender: (content) => renderMarkdown(content, components, securityConfig),
+		content: renderMessageContent(message, isLastMessage, isLoading, tools, toolExecutions, components, securityConfig),
 		placement: message.type === "human" ? "end" : "start"
 	};
 };
@@ -884,32 +859,39 @@ AgentChat.displayName = "AgentChat";
 * ToolCard 组件 - 用于展示工具调用结果
 * 样式：圆角矩形框，左侧 icon，label 分两行显示（prefix 小字体，content 默认字体）
 */
-const ToolCard = ({ prefix, content, icon }) => {
+const ToolCard = ({ prefix, content, icon, style, styles }) => {
 	return /* @__PURE__ */ jsxs("div", {
 		style: {
 			display: "inline-flex",
 			alignItems: "center",
 			gap: 8,
 			borderRadius: 8,
-			fontSize: 13
+			fontSize: 13,
+			...style
 		},
 		children: [/* @__PURE__ */ jsx("span", {
 			style: {
 				display: "flex",
-				alignItems: "center"
+				alignItems: "center",
+				...styles?.icon
 			},
 			children: icon
 		}), /* @__PURE__ */ jsxs("span", {
 			style: {
 				display: "flex",
 				alignItems: "center",
-				gap: 4,
-				color: "rgba(0, 0, 0, 0.45)"
+				gap: 4
 			},
 			children: [/* @__PURE__ */ jsx("span", {
-				style: { fontSize: 12 },
+				style: {
+					fontSize: 12,
+					...styles?.prefix
+				},
 				children: prefix
-			}), /* @__PURE__ */ jsx("span", { children: content })]
+			}), /* @__PURE__ */ jsx("span", {
+				style: { ...styles?.content },
+				children: content
+			})]
 		})]
 	});
 };

package/package.json

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