@vegintech/langchain-react-agent 0.0.37 → 0.0.40

package/dist/index.mjs

@@ -2,7 +2,6 @@ import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo
 import { Actions, Bubble, Sender, Think, ThoughtChain } from "@ant-design/x";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Streamdown } from "streamdown";
-import { code } from "@streamdown/code";
 import { useStream } from "@langchain/langgraph-sdk/react";
 //#region src/components/ChatInput.tsx
 const slotConfig = [];
@@ -181,12 +180,17 @@ const ContentBlock = ({ block, index, components, securityConfig }) => {
 		},
 		allowedTags: securityConfig?.allowedTags,
 		literalTagContent: securityConfig?.literalTagContent,
-		plugins: { code },
-		controls: { table: {
-			copy: false,
-			download: false,
-			fullscreen: false
-		} },
+		controls: {
+			table: {
+				copy: false,
+				download: false,
+				fullscreen: false
+			},
+			code: {
+				copy: false,
+				download: false
+			}
+		},
 		children: String(block.text)
 	}, index);
 	if (block.type === "image_url" && "image_url" in block) {
@@ -243,11 +247,17 @@ const MessageContentRenderer = ({ content, components, securityConfig }) => {
 		},
 		allowedTags: securityConfig?.allowedTags,
 		literalTagContent: securityConfig?.literalTagContent,
-		controls: { table: {
-			copy: false,
-			download: false,
-			fullscreen: false
-		} },
+		controls: {
+			table: {
+				copy: false,
+				download: false,
+				fullscreen: false
+			},
+			code: {
+				copy: false,
+				download: false
+			}
+		},
 		children: content
 	});
 	return /* @__PURE__ */ jsx(Fragment, { children: content.map((block, index) => /* @__PURE__ */ jsx(ContentBlock, {
@@ -958,6 +968,59 @@ const styles = `
 .tool-call-wrapper {
   width: 100%;
 }
+
+/* 代码块卡片 - 自适应任意主题背景 */
+[data-streamdown="code-block"] {
+  margin: 12px 0;
+  border: 1px solid rgba(128, 128, 128, 0.25);
+  border-radius: 8px;
+  overflow: hidden;
+  background-color: rgba(128, 128, 128, 0.12);
+  color: inherit;
+}
+
+[data-streamdown="code-block-header"] {
+  display: flex;
+  align-items: center;
+  padding: 8px 16px;
+  background-color: rgba(128, 128, 128, 0.06);
+  border-bottom: 1px solid rgba(128, 128, 128, 0.2);
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+  font-size: 12px;
+  color: inherit;
+  min-height: 36px;
+  box-sizing: border-box;
+}
+
+[data-streamdown="code-block-header"] span {
+  font-family: inherit;
+  font-size: inherit;
+  color: inherit;
+  opacity: 0.65;
+  text-transform: lowercase;
+}
+
+[data-streamdown="code-block-body"] {
+  background-color: transparent;
+  padding: 16px;
+  overflow-x: auto;
+  max-width: 100%;
+}
+
+[data-streamdown="code-block-body"] pre,
+[data-streamdown="code-block"] pre {
+  margin: 0;
+  padding: 0;
+  background: transparent;
+  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;
+  font-size: 13px;
+  line-height: 1.6;
+  color: inherit;
+  white-space: pre-wrap;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  max-width: 100%;
+}
 `;
 let injected = false;
 function injectStyles() {
@@ -1144,7 +1207,8 @@ function DebugPanel({ streamState, visible = true }) {
 			startX: e.clientX,
 			startY: e.clientY,
 			initialX: buttonPos.x,
-			initialY: buttonPos.y
+			initialY: buttonPos.y,
+			hasMoved: false
 		};
 		setIsDraggingButton(true);
 	}, [buttonPos]);
@@ -1164,6 +1228,7 @@ function DebugPanel({ streamState, visible = true }) {
 			if (isDraggingButton && buttonDragRef.current) {
 				const dx = e.clientX - buttonDragRef.current.startX;
 				const dy = e.clientY - buttonDragRef.current.startY;
+				if (Math.abs(dx) > 3 || Math.abs(dy) > 3) buttonDragRef.current.hasMoved = true;
 				setButtonPos({
 					x: buttonDragRef.current.initialX + dx,
 					y: buttonDragRef.current.initialY + dy
@@ -1451,7 +1516,9 @@ function DebugPanel({ streamState, visible = true }) {
 	return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("button", {
 		style: buttonStyle,
 		onMouseDown: handleButtonMouseDown,
-		onClick: () => !isDraggingButton && setIsOpen(true),
+		onClick: () => {
+			if (!buttonDragRef.current?.hasMoved) setIsOpen(true);
+		},
 		title: "打开调试面板",
 		children: "🐛"
 	}), isOpen && /* @__PURE__ */ jsxs("div", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vegintech/langchain-react-agent",
-  "version": "0.0.37",
+  "version": "0.0.40",
   "description": "LangChain Agent UI component library for React",
   "license": "MIT",
   "files": [
@@ -25,7 +25,6 @@
   "dependencies": {
     "@ant-design/x": "^2.4.0",
     "@langchain/langgraph-sdk": "^1.8.7",
-    "@streamdown/code": "catalog:",
     "streamdown": "^2.5.0"
   },
   "devDependencies": {