@ai-group/chat-sdk 2.1.13 → 3.0.1-alpha.2

package/dist/cjs/components/XAiThoughtChain/XAiThoughtChain.stories.js

@@ -0,0 +1,180 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/XAiThoughtChain/XAiThoughtChain.stories.tsx
+var XAiThoughtChain_stories_exports = {};
+__export(XAiThoughtChain_stories_exports, {
+  default: () => XAiThoughtChain_stories_default,
+  基础用法: () => 基础用法
+});
+module.exports = __toCommonJS(XAiThoughtChain_stories_exports);
+var import_react = require("react");
+var import__ = __toESM(require("."));
+var import_jsx_runtime = require("react/jsx-runtime");
+var meta = {
+  title: "AI组件/XAiThoughtChain 思维链",
+  component: import__.default,
+  parameters: {},
+  tags: ["autodocs"],
+  argTypes: {}
+};
+var XAiThoughtChain_stories_default = meta;
+var BasicUsageStory = () => {
+  const [items, setItems] = (0, import_react.useState)([]);
+  const [loading, setLoading] = (0, import_react.useState)(true);
+  const steps = [
+    {
+      type: "text",
+      key: "planning",
+      title: "任务规划",
+      content: "\n为了规划审核路线，我需要明确以下几个步骤：\n1. 确认审核的具体内容或目标（例如：OCR审核、批注生成等）。\n2. 根据审核内容，选择合适的工具（例如：`OCR审核1`、`生成批注pdf1`）。\n3. 提供必要的输入参数（例如：文件链接、日期、流水号等）。\n4. 执行工具并获取结果。\n\n由于用户未提供具体的审核内容或目标，我需要进一步澄清。\n\n"
+    },
+    {
+      type: "text",
+      key: "reasoning",
+      title: "推理分析",
+      content: "\n用户没有提供具体的审核内容或目标，因此无法直接调用工具。我需要请求用户提供更多信息，例如：\n- 审核的文件类型（图片、PDF等）。\n- 审核的具体任务（OCR识别、批注生成等）。\n- 是否有现成的文件链接或其他输入参数。\n\n"
+    },
+    // 待执行工具
+    // {
+    //   type: "tool",
+    //   msg: {
+    //     id: "040c3341-759f-43cb-8f51-d33f8d16063c",
+    //     author: "aaa111",
+    //     invocationId: "e-b8f96c1d-5432-42cf-8cff-c04745538504",
+    //     eventId: "2029398995837837312",
+    //     timestamp: 1772681399674,
+    //     role: "bot",
+    //     functionCall: {
+    //       id: "adk-a30a7fb0-4413-4251-8229-b48e6f9c0b32",
+    //       args: {
+    //         originalFunctionCall: {
+    //           id: "call_8c999d1ae7f34f98ad2666",
+    //           args: {
+    //             size: "1024*1024",
+    //             prompt: "一只猫在草地上，卡通风格",
+    //             n: 1,
+    //           },
+    //           name: "bailian_image_gen",
+    //         },
+    //         toolConfirmation: {
+    //           hint: "Please approve or reject the tool call vdjxxwbgpwlfs() by responding with a FunctionResponse with an expected ToolConfirmation payload.",
+    //           confirmed: false,
+    //         },
+    //       },
+    //       name: "adk_request_confirmation",
+    //     },
+    //   },
+    // },
+    // 确认执行
+    {
+      type: "tool",
+      msg: {
+        id: "99f7dff6-3780-4712-829f-4670707e76cc",
+        author: "aaa111",
+        invocationId: "e-fe701a0d-9fa2-4b82-b338-751c2ab31619",
+        eventId: "2029431631083794432",
+        timestamp: 1772689180523,
+        role: "bot",
+        functionCall: {
+          id: "call_ed77f343b5614de096ce35",
+          args: {
+            size: "1024*1024",
+            prompt: "一只可爱的小猫"
+          },
+          name: "bailian_image_gen"
+        },
+        functionResponse: {
+          id: "call_ed77f343b5614de096ce35",
+          name: "bailian_image_gen",
+          response: {
+            error: "This tool call requires confirmation, please approve or reject."
+          }
+        }
+      }
+    }
+  ];
+  (0, import_react.useEffect)(() => {
+    let stepIndex = 0;
+    let charIndex = 0;
+    let currentContent = "";
+    setItems([
+      {
+        ...steps[0],
+        content: ""
+      }
+    ]);
+    const timer = setInterval(() => {
+      const currentStep = steps[stepIndex];
+      if (!currentStep) {
+        clearInterval(timer);
+        setLoading(false);
+        return;
+      }
+      if (charIndex < currentStep.content.length) {
+        currentContent += currentStep.content[charIndex];
+        charIndex++;
+        setItems((prev) => {
+          const newItems = [...prev];
+          newItems[stepIndex] = {
+            ...currentStep,
+            content: currentContent
+          };
+          return newItems;
+        });
+      } else {
+        stepIndex++;
+        charIndex = 0;
+        currentContent = "";
+        if (stepIndex < steps.length) {
+          setItems((prev) => [
+            ...prev,
+            {
+              ...steps[stepIndex],
+              content: ""
+            }
+          ]);
+        } else {
+          clearInterval(timer);
+          setLoading(false);
+        }
+      }
+    }, 20);
+    return () => clearInterval(timer);
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: { width: 440, border: "1px solid #eee", padding: 20 }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import__.default, { loading, items, defaultOpen: true }) });
+};
+var 基础用法 = {
+  render: BasicUsageStory,
+  args: {}
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  基础用法
+});
+//# sourceMappingURL=XAiThoughtChain.stories.js.map

package/dist/cjs/components/XAiThoughtChain/XAiThoughtChain.stories.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/XAiThoughtChain/XAiThoughtChain.stories.tsx"],
+  "sourcesContent": ["import { useState, useEffect } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-vite\";\nimport XAiThoughtChain from \".\";\n\nconst meta: Meta<typeof XAiThoughtChain> = {\n  title: \"AI组件/XAiThoughtChain 思维链\",\n  component: XAiThoughtChain,\n  parameters: {},\n  tags: [\"autodocs\"],\n  argTypes: {},\n};\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\n// 基础用法\nconst BasicUsageStory = () => {\n  const [items, setItems] = useState<any[]>([]);\n  const [loading, setLoading] = useState(true);\n\n  const steps = [\n    {\n      type: \"text\",\n      key: \"planning\",\n      title: \"任务规划\",\n      content:\n        \"\\n为了规划审核路线，我需要明确以下几个步骤：\\n1. 确认审核的具体内容或目标（例如：OCR审核、批注生成等）。\\n2. 根据审核内容，选择合适的工具（例如：`OCR审核1`、`生成批注pdf1`）。\\n3. 提供必要的输入参数（例如：文件链接、日期、流水号等）。\\n4. 执行工具并获取结果。\\n\\n由于用户未提供具体的审核内容或目标，我需要进一步澄清。\\n\\n\",\n    },\n    {\n      type: \"text\",\n      key: \"reasoning\",\n      title: \"推理分析\",\n      content:\n        \"\\n用户没有提供具体的审核内容或目标，因此无法直接调用工具。我需要请求用户提供更多信息，例如：\\n- 审核的文件类型（图片、PDF等）。\\n- 审核的具体任务（OCR识别、批注生成等）。\\n- 是否有现成的文件链接或其他输入参数。\\n\\n\",\n    },\n    // 待执行工具\n    // {\n    //   type: \"tool\",\n    //   msg: {\n    //     id: \"040c3341-759f-43cb-8f51-d33f8d16063c\",\n    //     author: \"aaa111\",\n    //     invocationId: \"e-b8f96c1d-5432-42cf-8cff-c04745538504\",\n    //     eventId: \"2029398995837837312\",\n    //     timestamp: 1772681399674,\n    //     role: \"bot\",\n    //     functionCall: {\n    //       id: \"adk-a30a7fb0-4413-4251-8229-b48e6f9c0b32\",\n    //       args: {\n    //         originalFunctionCall: {\n    //           id: \"call_8c999d1ae7f34f98ad2666\",\n    //           args: {\n    //             size: \"1024*1024\",\n    //             prompt: \"一只猫在草地上，卡通风格\",\n    //             n: 1,\n    //           },\n    //           name: \"bailian_image_gen\",\n    //         },\n    //         toolConfirmation: {\n    //           hint: \"Please approve or reject the tool call vdjxxwbgpwlfs() by responding with a FunctionResponse with an expected ToolConfirmation payload.\",\n    //           confirmed: false,\n    //         },\n    //       },\n    //       name: \"adk_request_confirmation\",\n    //     },\n    //   },\n    // },\n    // 确认执行\n    {\n      type: \"tool\",\n      msg: {\n        id: \"99f7dff6-3780-4712-829f-4670707e76cc\",\n        author: \"aaa111\",\n        invocationId: \"e-fe701a0d-9fa2-4b82-b338-751c2ab31619\",\n        eventId: \"2029431631083794432\",\n        timestamp: 1772689180523,\n        role: \"bot\",\n        functionCall: {\n          id: \"call_ed77f343b5614de096ce35\",\n          args: {\n            size: \"1024*1024\",\n            prompt: \"一只可爱的小猫\",\n          },\n          name: \"bailian_image_gen\",\n        },\n        functionResponse: {\n          id: \"call_ed77f343b5614de096ce35\",\n          name: \"bailian_image_gen\",\n          response: {\n            error:\n              \"This tool call requires confirmation, please approve or reject.\",\n          },\n        },\n      },\n    },\n  ];\n\n  useEffect(() => {\n    let stepIndex = 0;\n    let charIndex = 0;\n    let currentContent = \"\";\n\n    // 先插入第一个空 step\n    setItems([\n      {\n        ...steps[0],\n        content: \"\",\n      },\n    ]);\n\n    const timer = setInterval(() => {\n      const currentStep = steps[stepIndex];\n\n      if (!currentStep) {\n        clearInterval(timer);\n        setLoading(false);\n        return;\n      }\n\n      if (charIndex < currentStep.content!.length) {\n        currentContent += currentStep.content![charIndex];\n        charIndex++;\n\n        setItems((prev) => {\n          const newItems = [...prev];\n          newItems[stepIndex] = {\n            ...currentStep,\n            content: currentContent,\n          };\n          return newItems;\n        });\n      } else {\n        // 当前 step 打完\n        stepIndex++;\n        charIndex = 0;\n        currentContent = \"\";\n\n        if (stepIndex < steps.length) {\n          setItems((prev) => [\n            ...prev,\n            {\n              ...steps[stepIndex],\n              content: \"\",\n            },\n          ]);\n        } else {\n          clearInterval(timer);\n          setLoading(false);\n        }\n      }\n    }, 20); // 20ms 一个字符\n\n    return () => clearInterval(timer);\n  }, []);\n\n  return (\n    <div style={{ width: 440, border: \"1px solid #eee\", padding: 20 }}>\n      <XAiThoughtChain loading={loading} items={items} defaultOpen />\n    </div>\n  );\n};\n\nexport const 基础用法: Story = {\n  render: BasicUsageStory,\n  args: {},\n};\n"],
+  "mappings": "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",
+  "names": ["XAiThoughtChain"]
+}

package/dist/cjs/components/XAiThoughtChain/index.d.ts

@@ -0,0 +1,4 @@
+import React from "react";
+import { XAiThoughtChainProps } from "../../types";
+declare const XAiThoughtChain: React.FC<XAiThoughtChainProps>;
+export default XAiThoughtChain;

package/dist/cjs/components/XAiThoughtChain/index.js

@@ -0,0 +1,155 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/XAiThoughtChain/index.tsx
+var XAiThoughtChain_exports = {};
+__export(XAiThoughtChain_exports, {
+  default: () => XAiThoughtChain_default
+});
+module.exports = __toCommonJS(XAiThoughtChain_exports);
+var import_react = require("react");
+var import_icons = require("@ant-design/icons");
+var import_MarkdownRender = __toESM(require("../XAdkChatbot/components/MarkdownRender"));
+var import_FunctionCallRender = __toESM(require("../XAdkChatbot/components/FunctionCallRender"));
+var import_styles = require("./styles");
+var import_utils = require("../../utils");
+var import_jsx_runtime = require("react/jsx-runtime");
+var TimelineItem = ({
+  icon,
+  title,
+  children,
+  collapsible = true,
+  defaultOpen = true
+}) => {
+  const [isOpen, setIsOpen] = (0, import_react.useState)(defaultOpen);
+  const styles = (0, import_styles.useStyles)();
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.timelineItem, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.timelineLeft, children: [
+      icon,
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.timelineConnector })
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.timelineRight, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "div",
+        {
+          className: styles.collapsibleHeader,
+          onClick: () => collapsible ? setIsOpen(!isOpen) : void 0,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: title }),
+            collapsible && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.arrowIcon, children: isOpen ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.DownOutlined, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.RightOutlined, {}) })
+          ]
+        }
+      ),
+      isOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.stepContent, children })
+    ] })
+  ] });
+};
+var TimelineTextItem = ({ item }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    TimelineItem,
+    {
+      icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_styles.useStyles)().timelineIcon, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.PartitionOutlined, {}) }),
+      title: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: (0, import_styles.useStyles)().titleText, children: item.title }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_MarkdownRender.default, { text: (0, import_utils.cleanProcessText)(item.content) })
+    }
+  );
+};
+var TimelineToolItem = ({ msg, collapsible, onConfirm, showFnCallDetail }) => {
+  var _a, _b, _c, _d, _e, _f, _g;
+  const styles = (0, import_styles.useStyles)();
+  const needsConfirm = msg.functionCall && !msg.functionResponse;
+  const isDone = !!msg.functionResponse;
+  const toolName = ((_b = (_a = msg.functionCall) == null ? void 0 : _a.args) == null ? void 0 : _b.componentName) || ((_c = msg.functionCall) == null ? void 0 : _c.name) || "组件执行";
+  const statusInfo = ((_e = (_d = msg.functionResponse) == null ? void 0 : _d.response) == null ? void 0 : _e.processData) || ((_g = (_f = msg.functionResponse) == null ? void 0 : _f.response) == null ? void 0 : _g.output);
+  const titleNode = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.toolTitleGroup, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.toolName, children: toolName }),
+    isDone && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.toolStatusTag, children: "执行成功" })
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+    TimelineItem,
+    {
+      icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.timelineIconTool, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.ThunderboltOutlined, {}) }),
+      title: titleNode,
+      collapsible,
+      defaultOpen: needsConfirm,
+      children: [
+        statusInfo && typeof statusInfo === "string" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.statusInfo, children: statusInfo }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          import_FunctionCallRender.default,
+          {
+            msg,
+            showDetail: showFnCallDetail,
+            onConfirm
+          }
+        )
+      ]
+    }
+  );
+};
+var XAiThoughtChain = ({
+  defaultOpen = false,
+  showFnCallDetail = false,
+  title = "思维链已完成",
+  items = [],
+  loading,
+  onConfirm
+}) => {
+  const styles = (0, import_styles.useStyles)();
+  const [isOpen, setIsOpen] = (0, import_react.useState)(defaultOpen);
+  (0, import_react.useEffect)(() => {
+    if (loading)
+      Promise.resolve().then(() => setIsOpen(true));
+  }, [loading]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.thoughtChainBlock, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.thoughtHeader, onClick: () => setIsOpen(!isOpen), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: styles.headerLeft, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: `${styles.caret} ${isOpen ? "open" : ""}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CaretRightOutlined, {}) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.statusIcon, children: loading ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.SyncOutlined, { spin: true, style: { color: "#1677ff" } }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_icons.CheckCircleFilled, { style: { color: "#52c41a" } }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: styles.headerTitle, children: loading ? "深度思考与执行中..." : title })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.headerRight, children: items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", { className: styles.stepCount, children: [
+        items.length,
+        " 个步骤"
+      ] }) })
+    ] }),
+    isOpen && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.thinkingBody, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: styles.timeline, children: items.map(
+      (item, i) => item.type === "text" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimelineTextItem, { item }, item.key || i) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        TimelineToolItem,
+        {
+          msg: item.msg,
+          collapsible: item.collapsible,
+          showFnCallDetail,
+          onConfirm
+        },
+        `tool-${item.key || i}`
+      )
+    ) }) })
+  ] });
+};
+var XAiThoughtChain_default = XAiThoughtChain;
+//# sourceMappingURL=index.js.map

package/dist/cjs/components/XAiThoughtChain/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/XAiThoughtChain/index.tsx"],
+  "sourcesContent": ["import React, { useState, useEffect } from \"react\";\nimport {\n  CheckCircleFilled,\n  SyncOutlined,\n  ThunderboltOutlined,\n  PartitionOutlined,\n  CaretRightOutlined,\n  RightOutlined,\n  DownOutlined,\n} from \"@ant-design/icons\";\nimport MarkdownRender from \"@/components/XAdkChatbot/components/MarkdownRender\";\nimport FunctionCallRender from \"@/components/XAdkChatbot/components/FunctionCallRender\";\nimport { useStyles } from \"./styles\";\nimport {\n  XAiThoughtChainProps,\n  ThoughtChainItemType,\n  TimelineItemProps,\n  FunctionCall,\n  IMessage,\n} from \"@/types\";\nimport { cleanProcessText } from \"@/utils\";\n\nconst TimelineItem = ({\n  icon,\n  title,\n  children,\n  collapsible = true,\n  defaultOpen = true,\n}: TimelineItemProps) => {\n  const [isOpen, setIsOpen] = useState(defaultOpen);\n  const styles = useStyles();\n\n  return (\n    <div className={styles.timelineItem}>\n      <div className={styles.timelineLeft}>\n        {icon}\n        <div className={styles.timelineConnector} />\n      </div>\n      <div className={styles.timelineRight}>\n        <div\n          className={styles.collapsibleHeader}\n          onClick={() => (collapsible ? setIsOpen(!isOpen) : undefined)}\n        >\n          <div>{title}</div>\n          {collapsible && (\n            <span className={styles.arrowIcon}>\n              {isOpen ? <DownOutlined /> : <RightOutlined />}\n            </span>\n          )}\n        </div>\n\n        {isOpen && <div className={styles.stepContent}>{children}</div>}\n      </div>\n    </div>\n  );\n};\n\nconst TimelineTextItem: React.FC<{\n  item: ThoughtChainItemType;\n}> = ({ item }) => {\n  return (\n    <TimelineItem\n      icon={\n        <span className={useStyles().timelineIcon}>\n          <PartitionOutlined />\n        </span>\n      }\n      title={<span className={useStyles().titleText}>{item.title}</span>}\n    >\n      <MarkdownRender text={cleanProcessText(item.content)} />\n    </TimelineItem>\n  );\n};\n\nconst TimelineToolItem: React.FC<{\n  msg: IMessage;\n  collapsible?: boolean;\n  showFnCallDetail: boolean;\n  onConfirm?: (fnCall: FunctionCall, confirmed: boolean) => void;\n}> = ({ msg, collapsible, onConfirm, showFnCallDetail }) => {\n  const styles = useStyles();\n  const needsConfirm = msg.functionCall && !msg.functionResponse;\n  const isDone = !!msg.functionResponse;\n\n  const toolName =\n    msg.functionCall?.args?.componentName ||\n    msg.functionCall?.name ||\n    \"组件执行\";\n\n  const statusInfo =\n    msg.functionResponse?.response?.processData ||\n    msg.functionResponse?.response?.output;\n\n  const titleNode = (\n    <div className={styles.toolTitleGroup}>\n      <span className={styles.toolName}>{toolName}</span>\n      {isDone && <span className={styles.toolStatusTag}>执行成功</span>}\n    </div>\n  );\n\n  return (\n    <TimelineItem\n      icon={\n        <span className={styles.timelineIconTool}>\n          <ThunderboltOutlined />\n        </span>\n      }\n      title={titleNode}\n      collapsible={collapsible}\n      defaultOpen={needsConfirm}\n    >\n      {statusInfo && typeof statusInfo === \"string\" && (\n        <div className={styles.statusInfo}>{statusInfo}</div>\n      )}\n      <FunctionCallRender\n        msg={msg}\n        showDetail={showFnCallDetail}\n        onConfirm={onConfirm}\n      />\n    </TimelineItem>\n  );\n};\n\nconst XAiThoughtChain: React.FC<XAiThoughtChainProps> = ({\n  defaultOpen = false,\n  showFnCallDetail = false,\n  title = \"思维链已完成\",\n  items = [],\n  loading,\n  onConfirm,\n}) => {\n  const styles = useStyles();\n  const [isOpen, setIsOpen] = useState(defaultOpen);\n  useEffect(() => {\n    if (loading) Promise.resolve().then(() => setIsOpen(true));\n  }, [loading]);\n  return (\n    <div className={styles.thoughtChainBlock}>\n      <div className={styles.thoughtHeader} onClick={() => setIsOpen(!isOpen)}>\n        <div className={styles.headerLeft}>\n          <div className={`${styles.caret} ${isOpen ? \"open\" : \"\"}`}>\n            <CaretRightOutlined />\n          </div>\n          <div className={styles.statusIcon}>\n            {loading ? (\n              <SyncOutlined spin style={{ color: \"#1677ff\" }} />\n            ) : (\n              <CheckCircleFilled style={{ color: \"#52c41a\" }} />\n            )}\n          </div>\n          <span className={styles.headerTitle}>\n            {loading ? \"深度思考与执行中...\" : title}\n          </span>\n        </div>\n        <div className={styles.headerRight}>\n          {items.length > 0 && (\n            <span className={styles.stepCount}>{items.length} 个步骤</span>\n          )}\n        </div>\n      </div>\n      {isOpen && (\n        <div className={styles.thinkingBody}>\n          <div className={styles.timeline}>\n            {items.map((item, i) =>\n              item.type === \"text\" ? (\n                <TimelineTextItem key={item.key || i} item={item} />\n              ) : (\n                <TimelineToolItem\n                  key={`tool-${item.key || i}`}\n                  msg={item.msg!}\n                  collapsible={item.collapsible}\n                  showFnCallDetail={showFnCallDetail}\n                  onConfirm={onConfirm}\n                />\n              ),\n            )}\n          </div>\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport default XAiThoughtChain;\n"],
+  "mappings": "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",
+  "names": ["MarkdownRender", "FunctionCallRender"]
+}

package/dist/cjs/components/XAiThoughtChain/styles.d.ts

@@ -0,0 +1,60 @@
+export declare const useStyles: () => {
+    thoughtChainBlock: string;
+    thoughtHeader: string;
+    headerLeft: string;
+    caret: string;
+    statusIcon: string;
+    headerTitle: string;
+    headerRight: string;
+    stepCount: string;
+    thinkingBody: string;
+    timeline: string;
+    timelineItem: string;
+    timelineLeft: string;
+    timelineIcon: string;
+    timelineIconTool: string;
+    timelineConnector: string;
+    timelineItemLastConnector: string;
+    timelineRight: string;
+    collapsibleHeader: string;
+    titleText: string;
+    toolTitleGroup: string;
+    toolName: string;
+    toolStatusTag: string;
+    arrowIcon: string;
+    stepContent: string;
+    statusInfo: string;
+} & {
+    w: (width: string | number) => string;
+    h: (height: string | number) => string;
+    p: (padding: string) => string;
+    pb: (padding: string | number) => string;
+    pt: (padding: string | number) => string;
+    pl: (padding: string | number) => string;
+    pr: (padding: string | number) => string;
+    m: (margin: string) => string;
+    mb: (margin: string | number) => string;
+    mt: (margin: string | number) => string;
+    ml: (margin: string | number) => string;
+    mr: (margin: string | number) => string;
+    text: (size: string | number) => string;
+    weight: (size: number) => string;
+    textColor: (c: string) => string;
+    bg: (c: string) => string;
+    rs: (radius: string | number) => string;
+    gap: (g: string | number) => string;
+    flex: string;
+    flexCenter: string;
+    flexBetween: string;
+    flexColumn: string;
+    flex1: string;
+    cursor: (type: string) => string;
+    border: (color: string, width?: string) => string;
+    boxShadow: (shadow: string) => string;
+    transition: (property?: string, duration?: string) => string;
+    overflow: (type: string) => string;
+    position: (type: string) => string;
+    zIndex: (index: number) => string;
+    flexCenterGap2: string;
+    flexCenterGap4: string;
+};

package/dist/cjs/components/XAiThoughtChain/styles.js

@@ -0,0 +1,195 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/XAiThoughtChain/styles.tsx
+var styles_exports = {};
+__export(styles_exports, {
+  useStyles: () => useStyles
+});
+module.exports = __toCommonJS(styles_exports);
+var import_css = require("@emotion/css");
+var import_common = require("../../styles/common");
+var useStyles = (0, import_common.withBasicStyles)(() => ({
+  /* --- ThoughtChain --- */
+  thoughtChainBlock: import_css.css`
+    margin-bottom: 16px;
+    background: #f9f9f9;
+    border-radius: 8px;
+    border: 1px solid #eee;
+    overflow: hidden;
+  `,
+  thoughtHeader: import_css.css`
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 10px 14px;
+    cursor: pointer;
+    user-select: none;
+    background: #f5f5f5;
+    transition: background 0.2s;
+    &:hover {
+      background: #f0f0f0;
+      border-color: #ccc;
+    }
+  `,
+  headerLeft: import_css.css`
+    display: flex;
+    align-items: center;
+    gap: 8px;
+  `,
+  caret: import_css.css`
+    font-size: 12px;
+    color: #999;
+    transition: transform 0.2s;
+    &.open {
+      transform: rotate(90deg);
+    }
+  `,
+  statusIcon: import_css.css`
+    font-size: 14px;
+    display: flex;
+    align-items: center;
+  `,
+  headerTitle: import_css.css`
+    font-size: 13px;
+    color: #666;
+    font-weight: 500;
+  `,
+  headerRight: import_css.css``,
+  stepCount: import_css.css`
+    font-size: 12px;
+    color: #bbb;
+    background: #fff;
+    padding: 2px 6px;
+    border-radius: 4px;
+    border: 1px solid #e0e0e0;
+  `,
+  thinkingBody: import_css.css`
+    background: #fff;
+    border-top: 1px solid #eee;
+    padding: 12px 16px;
+    animation: fadeIn 0.2s ease-in-out;
+  `,
+  /* --- Timeline --- */
+  timeline: import_css.css`
+    width: 100%;
+  `,
+  timelineItem: import_css.css`
+    display: flex;
+    gap: 12px;
+    position: relative;
+  `,
+  timelineLeft: import_css.css`
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 20px;
+    flex-shrink: 0;
+  `,
+  timelineIcon: import_css.css`
+    color: #8c8c8c;
+    font-size: 16px;
+    margin-top: 6px;
+  `,
+  timelineIconTool: import_css.css`
+    color: #faad14;
+    font-size: 16px;
+    margin-top: 6px;
+  `,
+  timelineConnector: import_css.css`
+    flex: 1;
+    width: 1px;
+    background-color: #e5e5e5;
+    margin: 4px 0;
+    min-height: 12px;
+  `,
+  /* Hide connector on last item */
+  timelineItemLastConnector: import_css.css`
+    display: none;
+  `,
+  timelineRight: import_css.css`
+    flex: 1;
+    padding-bottom: 16px;
+    min-width: 0;
+  `,
+  collapsibleHeader: import_css.css`
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 5px 8px;
+    margin: 0 -8px 4px -8px;
+    border-radius: 6px;
+    cursor: pointer;
+    transition: all 0.2s;
+    user-select: none;
+
+    &:hover {
+      background: #f5f5f5;
+    }
+  `,
+  titleText: import_css.css`
+    font-size: 13px;
+    font-weight: 600;
+    color: #595959;
+  `,
+  toolTitleGroup: import_css.css`
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    overflow: hidden;
+  `,
+  toolName: import_css.css`
+    font-size: 13px;
+    font-weight: 600;
+    color: #333;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  `,
+  toolStatusTag: import_css.css`
+    font-size: 11px;
+    color: #52c41a;
+    background: #f6ffed;
+    border: 1px solid #b7eb8f;
+    padding: 0 6px;
+    border-radius: 4px;
+    flex-shrink: 0;
+  `,
+  arrowIcon: import_css.css`
+    font-size: 10px;
+    color: #bbb;
+    margin-left: 8px;
+  `,
+  stepContent: import_css.css`
+    font-size: 13px;
+    color: #595959;
+    line-height: 1.6;
+    padding-left: 4px;
+  `,
+  statusInfo: import_css.css`
+    font-size: 12px;
+    color: #bfbfbf;
+    margin-bottom: 4px;
+    font-style: italic;
+  `
+}));
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  useStyles
+});
+//# sourceMappingURL=styles.js.map

package/dist/cjs/components/XAiThoughtChain/styles.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/components/XAiThoughtChain/styles.tsx"],
+  "sourcesContent": ["/* eslint-disable import/prefer-default-export */\nimport { css } from \"@emotion/css\";\nimport { withBasicStyles, lightBlue, primaryBlue } from \"@/styles/common\";\n\nexport const useStyles = withBasicStyles(() => ({\n  /* --- ThoughtChain --- */\n\n  thoughtChainBlock: css`\n    margin-bottom: 16px;\n    background: #f9f9f9;\n    border-radius: 8px;\n    border: 1px solid #eee;\n    overflow: hidden;\n  `,\n\n  thoughtHeader: css`\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 10px 14px;\n    cursor: pointer;\n    user-select: none;\n    background: #f5f5f5;\n    transition: background 0.2s;\n    &:hover {\n      background: #f0f0f0;\n      border-color: #ccc;\n    }\n  `,\n\n  headerLeft: css`\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  `,\n\n  caret: css`\n    font-size: 12px;\n    color: #999;\n    transition: transform 0.2s;\n    &.open {\n      transform: rotate(90deg);\n    }\n  `,\n\n  statusIcon: css`\n    font-size: 14px;\n    display: flex;\n    align-items: center;\n  `,\n\n  headerTitle: css`\n    font-size: 13px;\n    color: #666;\n    font-weight: 500;\n  `,\n\n  headerRight: css``,\n\n  stepCount: css`\n    font-size: 12px;\n    color: #bbb;\n    background: #fff;\n    padding: 2px 6px;\n    border-radius: 4px;\n    border: 1px solid #e0e0e0;\n  `,\n\n  thinkingBody: css`\n    background: #fff;\n    border-top: 1px solid #eee;\n    padding: 12px 16px;\n    animation: fadeIn 0.2s ease-in-out;\n  `,\n\n  /* --- Timeline --- */\n\n  timeline: css`\n    width: 100%;\n  `,\n\n  timelineItem: css`\n    display: flex;\n    gap: 12px;\n    position: relative;\n  `,\n\n  timelineLeft: css`\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    width: 20px;\n    flex-shrink: 0;\n  `,\n\n  timelineIcon: css`\n    color: #8c8c8c;\n    font-size: 16px;\n    margin-top: 6px;\n  `,\n\n  timelineIconTool: css`\n    color: #faad14;\n    font-size: 16px;\n    margin-top: 6px;\n  `,\n\n  timelineConnector: css`\n    flex: 1;\n    width: 1px;\n    background-color: #e5e5e5;\n    margin: 4px 0;\n    min-height: 12px;\n  `,\n\n  /* Hide connector on last item */\n  timelineItemLastConnector: css`\n    display: none;\n  `,\n\n  timelineRight: css`\n    flex: 1;\n    padding-bottom: 16px;\n    min-width: 0;\n  `,\n\n  collapsibleHeader: css`\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 5px 8px;\n    margin: 0 -8px 4px -8px;\n    border-radius: 6px;\n    cursor: pointer;\n    transition: all 0.2s;\n    user-select: none;\n\n    &:hover {\n      background: #f5f5f5;\n    }\n  `,\n\n  titleText: css`\n    font-size: 13px;\n    font-weight: 600;\n    color: #595959;\n  `,\n\n  toolTitleGroup: css`\n    display: flex;\n    align-items: center;\n    gap: 8px;\n    overflow: hidden;\n  `,\n\n  toolName: css`\n    font-size: 13px;\n    font-weight: 600;\n    color: #333;\n    white-space: nowrap;\n    overflow: hidden;\n    text-overflow: ellipsis;\n  `,\n\n  toolStatusTag: css`\n    font-size: 11px;\n    color: #52c41a;\n    background: #f6ffed;\n    border: 1px solid #b7eb8f;\n    padding: 0 6px;\n    border-radius: 4px;\n    flex-shrink: 0;\n  `,\n\n  arrowIcon: css`\n    font-size: 10px;\n    color: #bbb;\n    margin-left: 8px;\n  `,\n\n  stepContent: css`\n    font-size: 13px;\n    color: #595959;\n    line-height: 1.6;\n    padding-left: 4px;\n  `,\n\n  statusInfo: css`\n    font-size: 12px;\n    color: #bfbfbf;\n    margin-bottom: 4px;\n    font-style: italic;\n  `,\n}));\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,iBAAoB;AACpB,oBAAwD;AAEjD,IAAM,gBAAY,+BAAgB,OAAO;AAAA;AAAA,EAG9C,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQnB,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAef,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,EAMZ,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASP,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,EAMZ,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,EAMb,aAAa;AAAA,EAEb,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASX,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASd,UAAU;AAAA;AAAA;AAAA,EAIV,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA,EAMd,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQd,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA,EAMd,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMlB,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASnB,2BAA2B;AAAA;AAAA;AAAA,EAI3B,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA,EAMf,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAgBnB,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,EAMX,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOhB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASV,eAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAUf,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA,EAMX,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOb,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAMd,EAAE;",
+  "names": []
+}