@ant-design/agentic-ui 2.0.28 → 2.1.0

package/dist/MarkdownEditor/editor/store.d.ts

@@ -207,6 +207,10 @@ export declare class EditorStore {
      * @private
      */
     private _splitMarkdown;
+    private _collectSeparatorMatches;
+    private _isLineStart;
+    private _matchFence;
+    private _findLineEnd;
     /**
      * 移除节点
      * @param options

package/dist/MarkdownEditor/editor/store.js

@@ -488,7 +488,116 @@ var EditorStore = class {
    * @private
    */
   _splitMarkdown(md, separator) {
-    return md.split(separator).filter(Boolean);
+    if (!md) {
+      return [];
+    }
+    const separatorMatches = this._collectSeparatorMatches(md, separator);
+    if (separatorMatches.length === 0) {
+      return [md];
+    }
+    const chunks = [];
+    let start = 0;
+    let currentMatchIndex = 0;
+    let insideFence = false;
+    let activeFence = null;
+    let index = 0;
+    while (index < md.length) {
+      if (this._isLineStart(md, index)) {
+        const fence = this._matchFence(md, index);
+        if (fence) {
+          if (!insideFence) {
+            insideFence = true;
+            activeFence = fence.marker;
+          } else if (activeFence === fence.marker) {
+            insideFence = false;
+            activeFence = null;
+          }
+          index = fence.end;
+          continue;
+        }
+      }
+      const match = separatorMatches[currentMatchIndex];
+      if (!insideFence && match && index === match.index) {
+        const chunk = md.slice(start, index);
+        if (chunk.length > 0) {
+          chunks.push(chunk);
+        }
+        start = index + match.length;
+        currentMatchIndex += 1;
+        index = start;
+        continue;
+      }
+      index += 1;
+    }
+    const tail = md.slice(start);
+    if (tail.length > 0) {
+      chunks.push(tail);
+    }
+    return chunks.length > 0 ? chunks : [md];
+  }
+  _collectSeparatorMatches(md, separator) {
+    if (typeof separator === "string") {
+      const matches2 = [];
+      let searchIndex = md.indexOf(separator);
+      while (searchIndex !== -1) {
+        matches2.push({ index: searchIndex, length: separator.length });
+        searchIndex = md.indexOf(separator, searchIndex + separator.length);
+      }
+      return matches2;
+    }
+    const flags = separator.flags.includes("g") ? separator.flags : `${separator.flags}g`;
+    const globalRegex = new RegExp(separator.source, flags);
+    const matches = [];
+    let match;
+    while ((match = globalRegex.exec(md)) !== null) {
+      const matchedText = match[0];
+      matches.push({ index: match.index, length: matchedText.length });
+      if (matchedText.length === 0) {
+        globalRegex.lastIndex += 1;
+      }
+    }
+    return matches;
+  }
+  _isLineStart(content, position) {
+    if (position === 0) {
+      return true;
+    }
+    return content[position - 1] === "\n";
+  }
+  _matchFence(content, position) {
+    let cursor = position;
+    let spaces = 0;
+    while (cursor < content.length && content[cursor] === " " && spaces < 3) {
+      cursor += 1;
+      spaces += 1;
+    }
+    if (cursor >= content.length) {
+      return null;
+    }
+    const char = content[cursor];
+    if (char !== "`" && char !== "~") {
+      return null;
+    }
+    let fenceLength = 0;
+    while (cursor < content.length && content[cursor] === char) {
+      cursor += 1;
+      fenceLength += 1;
+    }
+    if (fenceLength < 3) {
+      return null;
+    }
+    const lineEnd = this._findLineEnd(content, cursor);
+    return { marker: char, end: lineEnd };
+  }
+  _findLineEnd(content, position) {
+    let cursor = position;
+    while (cursor < content.length && content[cursor] !== "\n") {
+      cursor += 1;
+    }
+    if (cursor < content.length && content[cursor] === "\n") {
+      return cursor + 1;
+    }
+    return cursor;
   }
   /**
    * 获取当前编辑器内容作为节点列表

package/dist/ToolUseBar/ToolUseBarItem.js

@@ -83,52 +83,65 @@ var ToolUseBarItemComponent = ({
       }
     );
   }
-  return /* @__PURE__ */ React.createElement("div", { key: tool.id, "data-testid": "ToolUserItem", className: toolClassName }, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ React.createElement(
     "div",
     {
-      className: toolBarClassName,
-      "data-testid": "tool-user-item-tool-bar",
-      onClick: handleClick
+      key: tool.id,
+      "data-testid": "ToolUserItem",
+      className: classnames(toolClassName, {
+        [`${prefixCls}-tool-collapsed`]: !showContent
+      })
     },
     /* @__PURE__ */ React.createElement(
       "div",
       {
-        className: toolHeaderClassName,
-        "data-testid": "tool-user-item-tool-header"
+        className: classnames(toolBarClassName, {
+          [`${prefixCls}-tool-bar-collapsed`]: !showContent
+        }),
+        "data-testid": "tool-user-item-tool-bar",
+        onClick: handleClick
       },
-      /* @__PURE__ */ React.createElement(ToolImage, { tool, prefixCls, hashId })
+      /* @__PURE__ */ React.createElement(
+        "div",
+        {
+          className: toolHeaderClassName,
+          "data-testid": "tool-user-item-tool-header"
+        },
+        /* @__PURE__ */ React.createElement(ToolImage, { tool, prefixCls, hashId })
+      ),
+      /* @__PURE__ */ React.createElement(
+        ToolHeaderRight,
+        {
+          tool,
+          prefixCls,
+          hashId,
+          light
+        }
+      ),
+      /* @__PURE__ */ React.createElement(ToolTime, { tool, prefixCls, hashId }),
+      /* @__PURE__ */ React.createElement(
+        ToolExpand,
+        {
+          showContent,
+          expanded,
+          prefixCls,
+          hashId,
+          onExpandClick: handleExpandClick
+        }
+      )
     ),
     /* @__PURE__ */ React.createElement(
-      ToolHeaderRight,
+      ToolContent,
       {
         tool,
         prefixCls,
         hashId,
-        light
-      }
-    ),
-    /* @__PURE__ */ React.createElement(ToolTime, { tool, prefixCls, hashId }),
-    /* @__PURE__ */ React.createElement(
-      ToolExpand,
-      {
+        light,
         showContent,
-        expanded,
-        prefixCls,
-        hashId,
-        onExpandClick: handleExpandClick
+        expanded
       }
     )
-  ), /* @__PURE__ */ React.createElement(
-    ToolContent,
-    {
-      tool,
-      prefixCls,
-      hashId,
-      light,
-      showContent,
-      expanded
-    }
-  ));
+  );
 };
 var ToolUseBarItem = memo(ToolUseBarItemComponent);
 export {

package/dist/ToolUseBar/ToolUseBarItemComponents.js

@@ -18,7 +18,7 @@ var __spreadValues = (a, b) => {
 // src/ToolUseBar/ToolUseBarItemComponents.tsx
 import { Api, ChevronUp, X } from "@sofa-design/icons";
 import classnames from "classnames";
-import { motion } from "framer-motion";
+import { AnimatePresence, motion } from "framer-motion";
 import React, { memo, useCallback, useMemo } from "react";
 var ToolImageComponent = ({
   tool,
@@ -217,20 +217,65 @@ var ToolContentComponent = ({
   const contentDom = useMemo(() => {
     return tool.content ? /* @__PURE__ */ React.createElement("div", { className: contentClassName }, tool.content) : null;
   }, [tool.content, contentClassName]);
-  const containerElement = useMemo(() => {
-    if (!showContent || !expanded)
-      return null;
+  const contentVariants = useMemo(
+    () => ({
+      expanded: {
+        height: "auto",
+        opacity: 1
+      },
+      collapsed: {
+        height: 0,
+        opacity: 0
+      }
+    }),
+    []
+  );
+  const contentTransition = useMemo(
+    () => ({
+      height: {
+        duration: 0.26,
+        ease: [0.4, 0, 0.2, 1]
+      },
+      opacity: {
+        duration: 0.26,
+        ease: [0.4, 0, 0.2, 1]
+      }
+    }),
+    []
+  );
+  if (!showContent || !expanded) {
     return /* @__PURE__ */ React.createElement(
       "div",
       {
-        className: toolContainerClassName,
-        "data-testid": "tool-user-item-tool-container "
+        style: {
+          overflow: "hidden",
+          height: 1,
+          opacity: 0,
+          visibility: "hidden"
+        },
+        role: "presentation",
+        "aria-hidden": "true"
       },
       contentDom,
       errorDom
     );
-  }, [showContent, expanded, toolContainerClassName, contentDom, errorDom]);
-  return containerElement;
+  }
+  return /* @__PURE__ */ React.createElement(AnimatePresence, { initial: false, mode: "sync" }, expanded ? /* @__PURE__ */ React.createElement(
+    motion.div,
+    {
+      key: "tool-content",
+      className: toolContainerClassName,
+      "data-testid": "tool-user-item-tool-container",
+      variants: contentVariants,
+      initial: "collapsed",
+      animate: "expanded",
+      exit: "collapsed",
+      transition: contentTransition,
+      style: { overflow: "hidden" }
+    },
+    contentDom,
+    errorDom
+  ) : null);
 };
 var ToolContent = memo(ToolContentComponent);
 export {

package/dist/ToolUseBar/style.js

@@ -40,12 +40,13 @@ var genStyle = (token) => {
         border: "var(--color-gray-border-light)",
         boxShadow: "var(--shadow-border-base)",
         minHeight: "20px",
+        backdropFilter: "blur(8px)",
         width: "max-content",
         transition: "padding 0.2s ease",
         display: "flex",
         alignItems: "center",
         flexDirection: "column",
-        gap: "8px",
+        gap: 0,
         zIndex: 1,
         maxWidth: "min(800px,100%)",
         padding: "2px",
@@ -64,6 +65,7 @@ var genStyle = (token) => {
         "&-expanded": {
           borderRadius: "14px",
           padding: 4,
+          gap: 8,
           outline: "none",
           "&:hover": {
             background: "var(--color-gray-bg-card-light)",

package/dist/ToolUseBar/thinkStyle.js

@@ -22,6 +22,8 @@ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 import {
   useEditorStyleRegister
 } from "../Hooks/useStyle";
+var LIGHT_MODE_BACKGROUND = "rgba(255, 255, 255, 0.65)";
+var LIGHT_MODE_BACKDROP_FILTER = "blur(12px)";
 var genStyle = (token) => {
   return {
     [token.componentCls]: {
@@ -69,6 +71,9 @@ var genStyle = (token) => {
         border: "none",
         borderRadius: "14px",
         padding: 4,
+        background: LIGHT_MODE_BACKGROUND,
+        backdropFilter: LIGHT_MODE_BACKDROP_FILTER,
+        WebkitBackdropFilter: LIGHT_MODE_BACKDROP_FILTER,
         "&:hover": {
           background: "none",
           boxShadow: "none",
@@ -226,7 +231,10 @@ var genStyle = (token) => {
           borderLeft: "1px solid var(--color-gray-border-light)",
           paddingLeft: 12,
           marginLeft: 16,
-          marginTop: -10
+          marginTop: -10,
+          background: LIGHT_MODE_BACKGROUND,
+          backdropFilter: LIGHT_MODE_BACKDROP_FILTER,
+          WebkitBackdropFilter: LIGHT_MODE_BACKDROP_FILTER
         }
       },
       "&-container-loading": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ant-design/agentic-ui",
-  "version": "2.0.28",
+  "version": "2.1.0",
   "description": "面向智能体的 UI 组件库，提供多步推理可视化、工具调用展示、任务执行协同等 Agentic UI 能力",
   "repository": "git@github.com:ant-design/agentic-ui.git",
   "license": "MIT",
@@ -27,7 +27,8 @@
     "start": "npm run dev",
     "test": "vitest --run",
     "test:coverage": "vitest --run --coverage",
-    "tsc": "tsc --noEmit"
+    "tsc": "tsc --noEmit",
+    "version": "node scripts/bumpVersion.js"
   },
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": [