@ant-design/agentic-ui 2.30.4 → 2.30.6

package/dist/Bubble/AIBubble.js

@@ -212,9 +212,10 @@ function _ts_generator(thisArg, body) {
         };
     }
 }
-import { memo, useContext } from "react";
+import { memo, useContext, useRef } from "react";
 import { ConfigProvider, Flex } from "antd";
 import clsx from "clsx";
+import { nanoid } from "nanoid";
 import React from "react";
 import { BubbleAvatar } from "./Avatar";
 import { BubbleBeforeNode } from "./BubbleBeforeNode";
@@ -222,6 +223,7 @@ import { BubbleConfigContext } from "./BubbleConfigProvide";
 import { BubbleFileView } from "./FileView";
 import { BubbleMessageDisplay } from "./MessagesContent";
 import { MessagesContext } from "./MessagesContent/BubbleContext";
+import { LOADING_FLAT } from "./MessagesContent";
 import { BubbleExtra } from "./MessagesContent/BubbleExtra";
 import { useStyle } from "./style";
 import { BubbleTitle } from "./Title";
@@ -269,13 +271,14 @@ var getTaskList = function getTaskList(originData) {
  * </AIBubble>
  * ```
  */ export var AIBubble = /*#__PURE__*/ memo(function(props) {
-    var _props_readonly;
+    var _ref, _messageDisplayKeyRef_current, _props_readonly;
     var _props_originData, _props_originData1, _props_originData2, _props_originData3, _props_originData4, _props_originData5, _props_bubbleRenderConfig, _props_originData_fileMap, _props_originData6, _props_bubbleRenderConfig1, _props_styles, _props_bubbleRenderConfig2, _bubbleRenderConfig_render;
     var onAvatarClick = props.onAvatarClick, className = props.className, style = props.style, bubbleRenderConfig = props.bubbleRenderConfig, classNames = props.classNames, styles = props.styles, originData = props.originData, preMessage = props.preMessage;
     var _React_useState = _sliced_to_array(React.useState(false), 2), hidePadding = _React_useState[0], setHidePadding = _React_useState[1];
+    var messageDisplayKeyRef = useRef(null);
     var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
     var context = useContext(BubbleConfigContext);
-    var _ref = context || {}, compact = _ref.compact, standalone = _ref.standalone, extraShowOnHover = _ref.extraShowOnHover;
+    var _ref1 = context || {}, compact = _ref1.compact, standalone = _ref1.standalone, extraShowOnHover = _ref1.extraShowOnHover;
     var prefixClass = getPrefixCls('agentic');
     var _useStyle = useStyle(prefixClass), wrapSSR = _useStyle.wrapSSR, hashId = _useStyle.hashId;
     var preMessageSameRole = isSameRoleAsPrevious(preMessage, originData);
@@ -300,14 +303,21 @@ var getTaskList = function getTaskList(originData) {
         prefixCls: "".concat(prefixClass, "-bubble-avatar"),
         style: styles === null || styles === void 0 ? void 0 : styles.bubbleListItemAvatarStyle
     }));
+    var id = props === null || props === void 0 ? void 0 : (_props_originData = props.originData) === null || _props_originData === void 0 ? void 0 : _props_originData.id;
+    if (id === undefined || id === LOADING_FLAT) {
+        if (!messageDisplayKeyRef.current) {
+            messageDisplayKeyRef.current = nanoid();
+        }
+    }
+    var messageDisplayKey = (_ref = (_messageDisplayKeyRef_current = messageDisplayKeyRef.current) !== null && _messageDisplayKeyRef_current !== void 0 ? _messageDisplayKeyRef_current : id) !== null && _ref !== void 0 ? _ref : nanoid();
     var messageContent = /*#__PURE__*/ React.createElement(BubbleMessageDisplay, {
         markdownRenderConfig: props.markdownRenderConfig,
         docListProps: props.docListProps,
         bubbleListRef: props.bubbleListRef,
         bubbleListItemExtraStyle: styles === null || styles === void 0 ? void 0 : styles.bubbleListItemExtraStyle,
         bubbleRef: props.bubbleRef,
-        content: props === null || props === void 0 ? void 0 : (_props_originData = props.originData) === null || _props_originData === void 0 ? void 0 : _props_originData.content,
-        key: props === null || props === void 0 ? void 0 : (_props_originData1 = props.originData) === null || _props_originData1 === void 0 ? void 0 : _props_originData1.id,
+        content: props === null || props === void 0 ? void 0 : (_props_originData1 = props.originData) === null || _props_originData1 === void 0 ? void 0 : _props_originData1.content,
+        key: messageDisplayKey,
         "data-id": props === null || props === void 0 ? void 0 : (_props_originData2 = props.originData) === null || _props_originData2 === void 0 ? void 0 : _props_originData2.id,
         avatar: props === null || props === void 0 ? void 0 : (_props_originData3 = props.originData) === null || _props_originData3 === void 0 ? void 0 : _props_originData3.meta,
         readonly: (_props_readonly = props.readonly) !== null && _props_readonly !== void 0 ? _props_readonly : false,

package/dist/Bubble/List/PureBubbleList.js

@@ -74,8 +74,9 @@ export var PureBubbleList = /*#__PURE__*/ React.memo(function(props) {
     }, [
         props.style
     ]);
-    // 为 loading 项生成唯一的 key，使用 ref 缓存以确保稳定性
     var loadingKeysRef = useRef(new Map());
+    var loadingKeyByIndexRef = useRef(new Map());
+    var realIdToStableKeyRef = useRef(new Map());
     var listDom = useMemo(function() {
         var _props_lazy;
         var isLazyEnabled = (_props_lazy = props.lazy) === null || _props_lazy === void 0 ? void 0 : _props_lazy.enable;
@@ -88,15 +89,26 @@ export var PureBubbleList = /*#__PURE__*/ React.memo(function(props) {
                 isLatest: isLast,
                 isLast: isLast
             });
-            // 如果 id 是 LOADING_FLAT，使用 uuid 作为 key
-            // 使用 index 和 createAt 的组合作为缓存 key，确保同一项在重新渲染时保持相同的 key
-            var itemKey = item.id;
+            var itemKey;
             if (item.id === LOADING_FLAT) {
                 var cacheKey = "".concat(index, "-").concat(item.createAt || Date.now());
                 if (!loadingKeysRef.current.has(cacheKey)) {
                     loadingKeysRef.current.set(cacheKey, nanoid());
                 }
                 itemKey = loadingKeysRef.current.get(cacheKey);
+                loadingKeyByIndexRef.current.set(index, itemKey);
+            } else {
+                var realId = item.id;
+                var prevLoadingKey = loadingKeyByIndexRef.current.get(index);
+                if (prevLoadingKey) {
+                    itemKey = prevLoadingKey;
+                    realIdToStableKeyRef.current.set(realId, prevLoadingKey);
+                    loadingKeyByIndexRef.current.delete(index);
+                } else if (realIdToStableKeyRef.current.has(realId)) {
+                    itemKey = realIdToStableKeyRef.current.get(realId);
+                } else {
+                    itemKey = realId;
+                }
             }
             var bubbleElement = /*#__PURE__*/ React.createElement(BubbleComponent, {
                 key: itemKey,

package/dist/Bubble/List/index.js

@@ -161,8 +161,11 @@ import { useStyle } from "./style";
         JSON.stringify(props.style)
     ]);
     // 为 loading 项生成唯一的 key，使用 ref 缓存以确保稳定性
-    // 使用 item 的唯一标识（index + createAt）作为缓存 key
     var loadingKeysRef = useRef(new Map());
+    // 记录每个 index 在上一轮是否是 loading，用于 loading→real 过渡时保持 key 稳定，避免闪动
+    var loadingKeyByIndexRef = useRef(new Map());
+    // 真实 id 映射到稳定 key（过渡后沿用），避免同一条消息因 id 变化导致 remount
+    var realIdToStableKeyRef = useRef(new Map());
     var bubbleListDom = useMemo(function() {
         var _props_lazy;
         var isLazyEnabled = (_props_lazy = props.lazy) === null || _props_lazy === void 0 ? void 0 : _props_lazy.enable;
@@ -174,15 +177,26 @@ import { useStyle } from "./style";
             // 保持向后兼容性，设置isLatest
             item.isLatest = isLast;
             item.isLast = isLast;
-            // 如果 id 是 LOADING_FLAT，使用 uuid 作为 key
-            // 使用 index 和 createAt 的组合作为缓存 key，确保同一项在重新渲染时保持相同的 key
-            var itemKey = item.id;
+            var itemKey;
             if (item.id === LOADING_FLAT) {
                 var cacheKey = "".concat(index, "-").concat(item.createAt || Date.now());
                 if (!loadingKeysRef.current.has(cacheKey)) {
                     loadingKeysRef.current.set(cacheKey, nanoid());
                 }
                 itemKey = loadingKeysRef.current.get(cacheKey);
+                loadingKeyByIndexRef.current.set(index, itemKey);
+            } else {
+                var realId = item.id;
+                var prevLoadingKey = loadingKeyByIndexRef.current.get(index);
+                if (prevLoadingKey) {
+                    itemKey = prevLoadingKey;
+                    realIdToStableKeyRef.current.set(realId, prevLoadingKey);
+                    loadingKeyByIndexRef.current.delete(index);
+                } else if (realIdToStableKeyRef.current.has(realId)) {
+                    itemKey = realIdToStableKeyRef.current.get(realId);
+                } else {
+                    itemKey = realId;
+                }
             }
             var bubbleElement = /*#__PURE__*/ React.createElement(Bubble, {
                 key: itemKey,

package/dist/Bubble/MessagesContent/MarkdownPreview.js

@@ -125,20 +125,22 @@ import { MessagesContext } from "./BubbleContext";
         var _content_includes, _htmlRef_current, _htmlRef_current1, _props_markdownRenderConfig, _props_originData, _props_originData1, _props_originData2, _props_markdownRenderConfig1, _props_markdownRenderConfig2, _props_markdownRenderConfig3;
         // MarkdownRenderer 渲染路径——轻量，不创建 Slate 实例
         if (renderMode === 'markdown') {
-            var _props_originData3, _props_markdownRenderConfig4, _props_markdownRenderConfig5, _props_markdownRenderConfig6, _props_markdownRenderConfig7;
+            var _props_originData3, _props_markdownRenderConfig4, _props_markdownRenderConfig5, _props_markdownRenderConfig6, _props_markdownRenderConfig7, _props_markdownRenderConfig8, _props_markdownRenderConfig9;
             return /*#__PURE__*/ React.createElement(MarkdownRenderer, {
                 content: content,
                 streaming: typing,
                 isFinished: (_props_originData3 = props.originData) === null || _props_originData3 === void 0 ? void 0 : _props_originData3.isFinished,
                 plugins: (_props_markdownRenderConfig4 = props.markdownRenderConfig) === null || _props_markdownRenderConfig4 === void 0 ? void 0 : _props_markdownRenderConfig4.plugins,
+                queueOptions: (_props_markdownRenderConfig5 = props.markdownRenderConfig) === null || _props_markdownRenderConfig5 === void 0 ? void 0 : _props_markdownRenderConfig5.queueOptions,
+                streamingParagraphAnimation: (_props_markdownRenderConfig6 = props.markdownRenderConfig) === null || _props_markdownRenderConfig6 === void 0 ? void 0 : _props_markdownRenderConfig6.streamingParagraphAnimation,
                 fncProps: fncProps,
                 style: _object_spread({
                     maxWidth: standalone ? '100%' : undefined,
                     padding: isPaddingHidden ? 0 : undefined,
                     margin: isPaddingHidden ? 0 : undefined
-                }, ((_props_markdownRenderConfig5 = props.markdownRenderConfig) === null || _props_markdownRenderConfig5 === void 0 ? void 0 : _props_markdownRenderConfig5.style) || {}),
-                codeProps: (_props_markdownRenderConfig6 = props.markdownRenderConfig) === null || _props_markdownRenderConfig6 === void 0 ? void 0 : _props_markdownRenderConfig6.codeProps,
-                apaasify: (_props_markdownRenderConfig7 = props.markdownRenderConfig) === null || _props_markdownRenderConfig7 === void 0 ? void 0 : _props_markdownRenderConfig7.apaasify
+                }, ((_props_markdownRenderConfig7 = props.markdownRenderConfig) === null || _props_markdownRenderConfig7 === void 0 ? void 0 : _props_markdownRenderConfig7.style) || {}),
+                codeProps: (_props_markdownRenderConfig8 = props.markdownRenderConfig) === null || _props_markdownRenderConfig8 === void 0 ? void 0 : _props_markdownRenderConfig8.codeProps,
+                apaasify: (_props_markdownRenderConfig9 = props.markdownRenderConfig) === null || _props_markdownRenderConfig9 === void 0 ? void 0 : _props_markdownRenderConfig9.apaasify
             });
         }
         // Slate 渲染路径——保持向后兼容

package/dist/MarkdownEditor/types.d.ts

@@ -4,7 +4,7 @@ import React from 'react';
 import { BaseEditor, Editor, Selection } from 'slate';
 import { HistoryEditor } from 'slate-history';
 import { ReactEditor, RenderElementProps } from 'slate-react';
-import type { RenderMode } from '../MarkdownRenderer/types';
+import type { CharacterQueueOptions, RenderMode } from '../MarkdownRenderer/types';
 import { TagPopupProps } from './editor/elements/TagPopup';
 import { EditorStore } from './editor/store';
 import { InsertAutocompleteProps } from './editor/tools/InsertAutocomplete';
@@ -473,6 +473,16 @@ export type MarkdownEditorProps = {
         /** 自定义链接渲染函数 */
         onClick?: (url?: string) => boolean | void;
     };
+    /**
+     * MarkdownRenderer 字符队列（仅 `renderMode: 'markdown'` 只读预览时生效）
+     * @description 默认关闭逐字 RAF；需要打字机时再设 `{ animate: true, animateTailChars: 50 }` 等
+     */
+    queueOptions?: CharacterQueueOptions;
+    /**
+     * 流式 Markdown 末段淡入（仅 `renderMode: 'markdown'` 时传给 MarkdownRenderer）
+     * @description 默认 false；设为 true 时末段使用 AnimationText 入场，可能在高频更新时产生闪动
+     */
+    streamingParagraphAnimation?: boolean;
     /**
      * 依赖数组
      * @description 用于控制 MElement 组件是否刷新的依赖数组。当 deps 数组内容发生变化时，MElement 会重新渲染

package/dist/MarkdownRenderer/AnimationText.d.ts

@@ -4,6 +4,11 @@ export interface AnimationConfig {
     fadeDuration?: number;
     /** 缓动函数，默认 ease-out */
     easing?: string;
+    /**
+     * 已废弃：单段入场动画模式下不再按 chunk 瘦身 DOM，保留仅为类型兼容
+     * @deprecated
+     */
+    collapseThreshold?: number;
 }
 export interface AnimationTextProps {
     children: React.ReactNode;
@@ -12,8 +17,7 @@ export interface AnimationTextProps {
 /**
  * 流式文字淡入动画组件。
  *
- * 采用 opacity + translateY（GPU 硬件加速），清爽流派。
- * 动画结束后通过 animationend 标记 done，仍用 span 包裹以保持布局稳定。
+ * 同一段流式前缀追加（或尾部截断修正）只触发一次入场动画；非前缀替换时重播。
  */
 declare const AnimationText: React.NamedExoticComponent<AnimationTextProps>;
 export default AnimationText;

package/dist/MarkdownRenderer/AnimationText.js

@@ -6,25 +6,6 @@ function _array_like_to_array(arr, len) {
 function _array_with_holes(arr) {
     if (Array.isArray(arr)) return arr;
 }
-function _array_without_holes(arr) {
-    if (Array.isArray(arr)) return _array_like_to_array(arr);
-}
-function _define_property(obj, key, value) {
-    if (key in obj) {
-        Object.defineProperty(obj, key, {
-            value: value,
-            enumerable: true,
-            configurable: true,
-            writable: true
-        });
-    } else {
-        obj[key] = value;
-    }
-    return obj;
-}
-function _iterable_to_array(iter) {
-    if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
-}
 function _iterable_to_array_limit(arr, i) {
     var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"];
     if (_i == null) return;
@@ -52,54 +33,9 @@ function _iterable_to_array_limit(arr, i) {
 function _non_iterable_rest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
 }
-function _non_iterable_spread() {
-    throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
-}
-function _object_spread(target) {
-    for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {};
-        var ownKeys = Object.keys(source);
-        if (typeof Object.getOwnPropertySymbols === "function") {
-            ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-            }));
-        }
-        ownKeys.forEach(function(key) {
-            _define_property(target, key, source[key]);
-        });
-    }
-    return target;
-}
-function ownKeys(object, enumerableOnly) {
-    var keys = Object.keys(object);
-    if (Object.getOwnPropertySymbols) {
-        var symbols = Object.getOwnPropertySymbols(object);
-        if (enumerableOnly) {
-            symbols = symbols.filter(function(sym) {
-                return Object.getOwnPropertyDescriptor(object, sym).enumerable;
-            });
-        }
-        keys.push.apply(keys, symbols);
-    }
-    return keys;
-}
-function _object_spread_props(target, source) {
-    source = source != null ? source : {};
-    if (Object.getOwnPropertyDescriptors) {
-        Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
-    } else {
-        ownKeys(Object(source)).forEach(function(key) {
-            Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
-        });
-    }
-    return target;
-}
 function _sliced_to_array(arr, i) {
     return _array_with_holes(arr) || _iterable_to_array_limit(arr, i) || _unsupported_iterable_to_array(arr, i) || _non_iterable_rest();
 }
-function _to_consumable_array(arr) {
-    return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
-}
 function _unsupported_iterable_to_array(o, minLen) {
     if (!o) return;
     if (typeof o === "string") return _array_like_to_array(o, minLen);
@@ -121,71 +57,43 @@ import React, { useEffect, useMemo, useRef, useState } from "react";
     }
     return '';
 };
-/**
- * 识别 children 中是否包含 React 元素节点。
- * 富文本结构（链接、脚注、图片等）在纯文本差分下会丢失结构信息，直接透传更安全。
- */ var hasElementNode = function hasElementNode1(children) {
-    if (children === null || children === undefined || typeof children === 'boolean') return false;
-    if (typeof children === 'string' || typeof children === 'number') return false;
-    if (Array.isArray(children)) return children.some(hasElementNode);
-    return /*#__PURE__*/ React.isValidElement(children);
+/** 流式同一段内：前后文案仅「前缀关系」变化（增长或尾部截断修正） */ var isStreamingCompatible = function isStreamingCompatible(prev, next) {
+    return prev.startsWith(next) || next.startsWith(prev);
 };
 /**
  * 流式文字淡入动画组件。
  *
- * 采用 opacity + translateY（GPU 硬件加速），清爽流派。
- * 动画结束后通过 animationend 标记 done，仍用 span 包裹以保持布局稳定。
+ * 同一段流式前缀追加（或尾部截断修正）只触发一次入场动画；非前缀替换时重播。
  */ var AnimationText = /*#__PURE__*/ React.memo(function(param) {
     var children = param.children, animationConfig = param.animationConfig;
-    var _ref = animationConfig || {}, _ref_fadeDuration = _ref.fadeDuration, fadeDuration = _ref_fadeDuration === void 0 ? 200 : _ref_fadeDuration, _ref_easing = _ref.easing, easing = _ref_easing === void 0 ? 'ease-out' : _ref_easing;
-    var _useState = _sliced_to_array(useState([]), 2), chunks = _useState[0], setChunks = _useState[1];
+    var _ref = animationConfig || {}, _ref_fadeDuration = _ref.fadeDuration, fadeDuration = _ref_fadeDuration === void 0 ? 250 : _ref_fadeDuration, _ref_easing = _ref.easing, easing = _ref_easing === void 0 ? 'ease-out' : _ref_easing;
+    var _useState = _sliced_to_array(useState(false), 2), animComplete = _useState[0], setAnimComplete = _useState[1];
+    var _useState1 = _sliced_to_array(useState(0), 2), animSession = _useState1[0], setAnimSession = _useState1[1];
     var prevTextRef = useRef('');
     var text = extractText(children);
-    var hasElementContent = hasElementNode(children);
     useEffect(function() {
-        if (hasElementContent) {
+        if (text === prevTextRef.current) return;
+        var prev = prevTextRef.current;
+        if (!prev) {
+            if (!text) return;
             prevTextRef.current = text;
+            setAnimComplete(false);
             return;
         }
-        if (text === prevTextRef.current) return;
-        if (!prevTextRef.current || !text.startsWith(prevTextRef.current)) {
-            setChunks([
-                {
-                    key: '0',
-                    text: text,
-                    content: children,
-                    done: false
-                }
-            ]);
+        if (isStreamingCompatible(prev, text)) {
             prevTextRef.current = text;
             return;
         }
-        var prevLen = prevTextRef.current.length;
-        var newText = text.slice(prevLen);
-        var newKey = "anim-".concat(Date.now(), "-").concat(prevLen);
-        setChunks(function(prev) {
-            return _to_consumable_array(prev).concat([
-                {
-                    key: newKey,
-                    text: newText,
-                    done: false
-                }
-            ]);
+        setAnimComplete(false);
+        setAnimSession(function(s) {
+            return s + 1;
         });
         prevTextRef.current = text;
     }, [
-        text,
-        children,
-        hasElementContent
+        text
     ]);
-    var handleAnimationEnd = function handleAnimationEnd(key) {
-        setChunks(function(prev) {
-            return prev.map(function(c) {
-                return c.key === key ? _object_spread_props(_object_spread({}, c), {
-                    done: true
-                }) : c;
-            });
-        });
+    var handleAnimationEnd = function handleAnimationEnd() {
+        return setAnimComplete(true);
     };
     var animationStyle = useMemo(function() {
         return {
@@ -198,29 +106,19 @@ import React, { useEffect, useMemo, useRef, useState } from "react";
         fadeDuration,
         easing
     ]);
-    /** 动画结束后仍用 inline-block 包裹，避免从 span 变为裸内容时的宽度重排 */ var doneChunkStyle = useMemo(function() {
+    var doneChunkStyle = useMemo(function() {
         return {
             display: 'inline-block',
             color: 'inherit'
         };
     }, []);
-    if (hasElementContent) {
-        return /*#__PURE__*/ React.createElement(React.Fragment, null, children);
-    }
-    return /*#__PURE__*/ React.createElement(React.Fragment, null, chunks.map(function(chunk) {
-        var _chunk_content;
-        var rendered = (_chunk_content = chunk.content) !== null && _chunk_content !== void 0 ? _chunk_content : chunk.text;
-        return chunk.done ? /*#__PURE__*/ React.createElement("span", {
-            key: chunk.key,
-            style: doneChunkStyle
-        }, rendered) : /*#__PURE__*/ React.createElement("span", {
-            key: chunk.key,
-            style: animationStyle,
-            onAnimationEnd: function onAnimationEnd() {
-                return handleAnimationEnd(chunk.key);
-            }
-        }, rendered);
-    }));
+    return animComplete ? /*#__PURE__*/ React.createElement("span", {
+        style: doneChunkStyle
+    }, children) : /*#__PURE__*/ React.createElement("span", {
+        key: animSession,
+        style: animationStyle,
+        onAnimationEnd: handleAnimationEnd
+    }, children);
 });
 AnimationText.displayName = 'AnimationText';
 export default AnimationText;

package/dist/MarkdownRenderer/MarkdownRenderer.js

@@ -236,7 +236,7 @@ var SCHEMA_LANGUAGES = new Set([
  * - Markdown → hast → React 元素树（hast-util-to-jsx-runtime）
  * - 特殊块（code / mermaid / chart / katex）通过组件映射拦截渲染
  */ var InternalMarkdownRenderer = /*#__PURE__*/ forwardRef(function(props, ref) {
-    var content = props.content, _props_streaming = props.streaming, streaming = _props_streaming === void 0 ? false : _props_streaming, isFinished = props.isFinished, queueOptions = props.queueOptions, plugins = props.plugins, remarkPlugins = props.remarkPlugins, htmlConfig = props.htmlConfig, className = props.className, style = props.style, customPrefixCls = props.prefixCls, linkConfig = props.linkConfig, apaasify = props.apaasify;
+    var content = props.content, _props_streaming = props.streaming, streaming = _props_streaming === void 0 ? false : _props_streaming, isFinished = props.isFinished, queueOptions = props.queueOptions, plugins = props.plugins, remarkPlugins = props.remarkPlugins, htmlConfig = props.htmlConfig, className = props.className, style = props.style, customPrefixCls = props.prefixCls, linkConfig = props.linkConfig, streamingParagraphAnimation = props.streamingParagraphAnimation, apaasify = props.apaasify;
     var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
     // 复用 MarkdownEditor 的 CSS 前缀和样式，保持渲染一致性
     var prefixCls = getPrefixCls('agentic-md-editor', customPrefixCls);
@@ -249,6 +249,7 @@ var SCHEMA_LANGUAGES = new Set([
     var containerRef = useRef(null);
     var _useState = _sliced_to_array(useState(content || ''), 2), displayedContent = _useState[0], setDisplayedContent = _useState[1];
     var queueRef = useRef(null);
+    /** 与 CharacterQueue 构造参数同步，避免 queueOptions 变更后仍用旧队列行为 */ var queueOptsSigRef = useRef('');
     useImperativeHandle(ref, function() {
         return {
             nativeElement: containerRef.current,
@@ -263,10 +264,12 @@ var SCHEMA_LANGUAGES = new Set([
     }, [
         plugins
     ]);
-    // 字符队列管理：流式时仅对最后 50 字做动画，避免每段逐字输出
+    // 字符队列：默认关闭逐字动画，避免 RAF 每帧全量重解析 Markdown 导致整页闪动。
+    // 需要打字机效果时显式传入 queueOptions={{ animate: true, animateTailChars?: number }}。
     var resolvedQueueOptions = useMemo(function() {
         return streaming ? _object_spread({
-            animateTailChars: 50
+            animate: false,
+            animateTailChars: undefined
         }, queueOptions) : queueOptions;
     }, [
         streaming,
@@ -274,17 +277,23 @@ var SCHEMA_LANGUAGES = new Set([
     ]);
     useEffect(function() {
         if (!streaming) {
-            // 非流式：直接展示全部内容
+            var _queueRef_current;
             setDisplayedContent(content || '');
+            (_queueRef_current = queueRef.current) === null || _queueRef_current === void 0 ? void 0 : _queueRef_current.dispose();
+            queueRef.current = null;
+            queueOptsSigRef.current = '';
             return;
         }
-        if (!queueRef.current) {
+        var sig = JSON.stringify(resolvedQueueOptions !== null && resolvedQueueOptions !== void 0 ? resolvedQueueOptions : {});
+        if (!queueRef.current || sig !== queueOptsSigRef.current) {
+            var _queueRef_current1;
+            (_queueRef_current1 = queueRef.current) === null || _queueRef_current1 === void 0 ? void 0 : _queueRef_current1.dispose();
             queueRef.current = new CharacterQueue(function(displayed) {
                 return setDisplayedContent(displayed);
             }, resolvedQueueOptions);
+            queueOptsSigRef.current = sig;
         }
         queueRef.current.push(content || '');
-        return undefined;
     }, [
         content,
         streaming,
@@ -347,7 +356,8 @@ var SCHEMA_LANGUAGES = new Set([
         components: components,
         prefixCls: prefixCls,
         linkConfig: linkConfig,
-        streaming: streaming
+        streaming: streaming,
+        streamingParagraphAnimation: streamingParagraphAnimation
     });
     return wrapVarSSR(wrapSSR(wrapContentSSR(/*#__PURE__*/ React.createElement("div", {
         ref: containerRef,
@@ -359,7 +369,7 @@ var SCHEMA_LANGUAGES = new Set([
             display: 'block'
         }
     }, /*#__PURE__*/ React.createElement("div", {
-        className: clsx(contentCls, hashId),
+        className: clsx(contentCls, "".concat(contentCls, "-markdown-readonly"), hashId),
         style: {
             whiteSpace: 'normal',
             wordWrap: 'normal'

package/dist/MarkdownRenderer/StreamingAnimationContext.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+/** 仅末块为 true：流式 Markdown 只对「当前生长块」播放入场，避免全页段落/表格单元格一起闪动 */
+export interface StreamingAnimationContextValue {
+    animateBlock: boolean;
+}
+export declare const StreamingAnimationContext: React.Context<StreamingAnimationContextValue | null>;

package/dist/MarkdownRenderer/StreamingAnimationContext.js

@@ -0,0 +1,2 @@
+import React from "react";
+export var StreamingAnimationContext = /*#__PURE__*/ React.createContext(null);

package/dist/MarkdownRenderer/types.d.ts

@@ -4,7 +4,10 @@ import type { MarkdownEditorPlugin } from '../MarkdownEditor/plugin';
 export interface CharacterQueueOptions {
     /** 每帧输出的最大字符数，默认 3 */
     charsPerFrame?: number;
-    /** 是否启用打字动画，默认 true（流式时） */
+    /**
+     * 是否启用 CharacterQueue 逐字输出（RAF 驱动）。
+     * MarkdownRenderer 流式默认合并为 `false`，避免每帧全量重解析导致整页闪动；需打字机时再设为 `true`。
+     */
     animate?: boolean;
     /**
      * 仅对末尾 N 个字符做动画，前面内容立即展示。
@@ -65,6 +68,11 @@ export interface MarkdownRendererProps {
         /** 自定义链接点击处理，返回 false 可阻止默认跳转 */
         onClick?: (url?: string) => boolean | void;
     };
+    /**
+     * 流式时是否为生长中的末段启用淡入（AnimationText）。
+     * 默认 false，避免重解析时整页闪动；需要段落入场效果时再设为 true。
+     */
+    streamingParagraphAnimation?: boolean;
     /** Apaasify / Schema 自定义渲染 */
     apaasify?: {
         enable?: boolean;

package/dist/MarkdownRenderer/useMarkdownToReact.d.ts

@@ -14,6 +14,11 @@ interface UseMarkdownToReactOptions {
     };
     /** 是否处于流式状态，用于最后一个块的打字动画 */
     streaming?: boolean;
+    /**
+     * 流式时是否对「生长中的末段」启用段落淡入（AnimationText）。
+     * 默认 false：重解析时频繁触发动画易导致整页闪动；需要时再显式传入 true。
+     */
+    streamingParagraphAnimation?: boolean;
 }
 export declare const useMarkdownToReact: (content: string, options?: UseMarkdownToReactOptions) => React.ReactNode;
 /**

package/dist/MarkdownRenderer/useMarkdownToReact.js

@@ -122,7 +122,7 @@ function _unsupported_iterable_to_array(o, minLen) {
 }
 import { Checkbox, Image } from "antd";
 import { toJsxRuntime } from "hast-util-to-jsx-runtime";
-import React, { useMemo, useRef } from "react";
+import React, { useContext, useMemo, useRef } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import rehypeKatex from "rehype-katex";
 import rehypeRaw from "rehype-raw";
@@ -141,6 +141,7 @@ import { REMARK_REHYPE_DIRECTIVE_HANDLERS } from "../MarkdownEditor/editor/utils
 import { parseChineseCurrencyToNumber } from "../Plugins/chart/utils";
 import { ToolUseBarThink } from "../ToolUseBarThink";
 import AnimationText from "./AnimationText";
+import { StreamingAnimationContext } from "./StreamingAnimationContext";
 var INLINE_MATH_WITH_SINGLE_DOLLAR = {
     singleDollarTextMath: true
 };
@@ -432,14 +433,26 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
  *
  * MarkdownEditor 的 Slate 元素使用 data-be 属性和 prefixCls 类名，
  * 这里为原生 HTML 标签添加相同的属性，使共用的 CSS 能正确命中。
- */ var buildEditorAlignedComponents = function buildEditorAlignedComponents(prefixCls, userComponents, streaming, linkConfig) {
+ */ var buildEditorAlignedComponents = function buildEditorAlignedComponents(prefixCls, userComponents, streaming, linkConfig, streamingParagraphAnimation) {
     var listCls = "".concat(prefixCls, "-list");
     var tableCls = "".concat(prefixCls, "-content-table");
     var contentCls = prefixCls; // e.g. ant-agentic-md-editor-content
+    /** 仅当 streaming、末块动画上下文允许且显式开启段落动画时包 AnimationText */ var StreamAnimWrap = function StreamAnimWrap(param) {
+        var children = param.children;
+        var _ref;
+        var ctx = useContext(StreamingAnimationContext);
+        var animateBlock = (_ref = ctx === null || ctx === void 0 ? void 0 : ctx.animateBlock) !== null && _ref !== void 0 ? _ref : true;
+        var allow = !!streaming && animateBlock && !!streamingParagraphAnimation;
+        if (!allow) return children;
+        return jsx(AnimationText, {
+            children: children
+        });
+    };
+    StreamAnimWrap.displayName = 'StreamAnimWrap';
     var wrapAnimation = function wrapAnimation(children) {
-        return streaming ? jsx(AnimationText, {
+        return jsx(StreamAnimWrap, {
             children: children
-        }) : children;
+        });
     };
     return _object_spread({
         // ================================================================
@@ -464,7 +477,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             return jsx('h1', _object_spread_props(_object_spread({}, rest), {
                 'data-be': 'head',
                 'data-testid': 'markdown-heading-1',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         h2: function h2(props) {
@@ -475,7 +488,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             return jsx('h2', _object_spread_props(_object_spread({}, rest), {
                 'data-be': 'head',
                 'data-testid': 'markdown-heading-2',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         h3: function h3(props) {
@@ -486,7 +499,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             return jsx('h3', _object_spread_props(_object_spread({}, rest), {
                 'data-be': 'head',
                 'data-testid': 'markdown-heading-3',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         h4: function h4(props) {
@@ -497,7 +510,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             return jsx('h4', _object_spread_props(_object_spread({}, rest), {
                 'data-be': 'head',
                 'data-testid': 'markdown-heading-4',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         h5: function h5(props) {
@@ -508,7 +521,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             return jsx('h5', _object_spread_props(_object_spread({}, rest), {
                 'data-be': 'head',
                 'data-testid': 'markdown-heading-5',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         h6: function h6(props) {
@@ -519,7 +532,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             return jsx('h6', _object_spread_props(_object_spread({}, rest), {
                 'data-be': 'head',
                 'data-testid': 'markdown-heading-6',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         blockquote: function blockquote(props) {
@@ -607,7 +620,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
                 className: "".concat(listCls, "-item"),
                 'data-be': 'list-item',
                 'data-testid': 'markdown-list-item',
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         table: function table(props) {
@@ -686,7 +699,7 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
                     whiteSpace: 'normal',
                     maxWidth: '20%'
                 },
-                children: wrapAnimation(children)
+                children: children
             }));
         },
         // input[type=checkbox]：task list 的 checkbox（兜底，主逻辑在 li 中）
@@ -1061,13 +1074,31 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
         }
     }, userComponents);
 };
+/**
+ * 在 hast 上标记「最后一个 p」，用于流式时仅该段落播放入场（单块长文时避免全页 p 一起闪）
+ */ var markLastParagraphStreamingTail = function markLastParagraphStreamingTail(hast) {
+    var paragraphs = [];
+    visit(hast, 'element', function(node) {
+        if (node.tagName === 'p') {
+            paragraphs.push(node);
+        }
+    });
+    var last = paragraphs[paragraphs.length - 1];
+    if (last) {
+        last.properties = last.properties || {};
+        last.properties.dataStreamingTail = true;
+    }
+};
 /**
  * 将单个 markdown 片段转为 React 元素（内部函数）
- */ var renderMarkdownBlock = function renderMarkdownBlock(blockContent, processor, components) {
+ */ var renderMarkdownBlock = function renderMarkdownBlock(blockContent, processor, components, blockOpts) {
     if (!blockContent.trim()) return null;
     try {
         var mdast = processor.parse(blockContent);
         var hast = processor.runSync(mdast);
+        if (blockOpts === null || blockOpts === void 0 ? void 0 : blockOpts.markStreamingTailParagraph) {
+            markLastParagraphStreamingTail(hast);
+        }
         return toJsxRuntime(hast, {
             Fragment: Fragment,
             jsx: jsx,
@@ -1098,7 +1129,9 @@ var extractLanguageFromClassName = function extractLanguageFromClassName(classNa
             if (!inFence && line === '' && current.length > 0) {
                 var prev = current[current.length - 1];
                 if (prev === '') {
-                    blocks.push(current.join('\n'));
+                    // 触发分割的是「第二个连续空行」，不应并入上一块末尾，否则与单块解析结果字符串不一致、缓存失效
+                    var withoutTrailingBlank = current.slice(0, -1);
+                    blocks.push(withoutTrailingBlank.join('\n'));
                     current = [];
                     continue;
                 }
@@ -1152,6 +1185,7 @@ export var useMarkdownToReact = function useMarkdownToReact(content, options) {
     var processorRef = useRef(null);
     var blockCacheRef = useRef(new Map());
     var lastBlockRef = useRef(null);
+    var prevContentRef = useRef('');
     var processor = useMemo(function() {
         var p = createHastProcessor(options === null || options === void 0 ? void 0 : options.remarkPlugins, options === null || options === void 0 ? void 0 : options.htmlConfig);
         processorRef.current = p;
@@ -1163,15 +1197,25 @@ export var useMarkdownToReact = function useMarkdownToReact(content, options) {
     var prefixCls = (options === null || options === void 0 ? void 0 : options.prefixCls) || 'ant-agentic-md-editor';
     var components = useMemo(function() {
         var userComponents = (options === null || options === void 0 ? void 0 : options.components) || {};
-        return buildEditorAlignedComponents(prefixCls, userComponents, options === null || options === void 0 ? void 0 : options.streaming, options === null || options === void 0 ? void 0 : options.linkConfig);
+        return buildEditorAlignedComponents(prefixCls, userComponents, options === null || options === void 0 ? void 0 : options.streaming, options === null || options === void 0 ? void 0 : options.linkConfig, options === null || options === void 0 ? void 0 : options.streamingParagraphAnimation);
     }, [
         prefixCls,
         options === null || options === void 0 ? void 0 : options.components,
         options === null || options === void 0 ? void 0 : options.streaming,
-        options === null || options === void 0 ? void 0 : options.linkConfig
+        options === null || options === void 0 ? void 0 : options.linkConfig,
+        options === null || options === void 0 ? void 0 : options.streamingParagraphAnimation
     ]);
     return useMemo(function() {
-        if (!content) return null;
+        if (!content) {
+            prevContentRef.current = '';
+            return null;
+        }
+        var prevContent = prevContentRef.current;
+        if (prevContent && content !== prevContent && !content.startsWith(prevContent)) {
+            blockCacheRef.current = new Map();
+            lastBlockRef.current = null;
+        }
+        prevContentRef.current = content;
         try {
             var preprocessed = content.replace(new RegExp(JINJA_DOLLAR_PLACEHOLDER, 'g'), '$');
             var blocks = splitMarkdownBlocks(preprocessed);
@@ -1179,21 +1223,30 @@ export var useMarkdownToReact = function useMarkdownToReact(content, options) {
             var cache = blockCacheRef.current;
             var newCache = new Map();
             var elements = [];
+            var wrapBlockScope = function wrapBlockScope(node, key, animateBlock) {
+                return jsx(StreamingAnimationContext.Provider, {
+                    key: key,
+                    value: {
+                        animateBlock: animateBlock
+                    },
+                    children: node
+                });
+            };
+            var KEY_PREFIX_LEN = 64;
             for(var i = 0; i < blocks.length; i++){
                 var block = blocks[i];
                 var isLast = i === blocks.length - 1;
                 // 用 index + 内容前 64 字符作 key，保持稳定性：
-                // 相同位置 + 相同内容开头 → 相同 key → React 不 unmount
-                // 流式场景下，最后一个块内容频繁变化，若 key 随内容变会导致反复 unmount/remount，
-                // ChartBlockRenderer 等会重复展示 Loading，故对末块使用稳定 key
-                var stableKey = isLast && (options === null || options === void 0 ? void 0 : options.streaming) ? "b".concat(i, "-last") : "b".concat(i, "-").concat(block.slice(0, 64));
+                // - 末块在流式中节流时，用 lastBlockRef.source 的切片作 key，避免每次追加字符导致 key 变化
+                // - 末块变为非末块时，必须与先前 key 一致，否则 ChartBlockRenderer 等会 unmount/remount 闪烁
+                // - 因此统一用「实际展示内容」的 slice 作 key，节流时用 lastBlockRef.source
+                var contentForKey = isLast && (options === null || options === void 0 ? void 0 : options.streaming) && lastBlockRef.current && !shouldReparseLastBlock(lastBlockRef.current.source, block, options === null || options === void 0 ? void 0 : options.streaming) ? lastBlockRef.current.source.slice(0, KEY_PREFIX_LEN) : block.slice(0, KEY_PREFIX_LEN);
+                var stableKey = "b".concat(i, "-").concat(contentForKey);
                 if (!isLast) {
                     var cached = cache.get(block);
                     if (cached && cached.source === block) {
                         newCache.set(block, cached);
-                        elements.push(jsx(Fragment, {
-                            children: cached.element
-                        }, stableKey));
+                        elements.push(wrapBlockScope(cached.element, stableKey, false));
                         continue;
                     }
                 }
@@ -1204,22 +1257,20 @@ export var useMarkdownToReact = function useMarkdownToReact(content, options) {
                             source: lastBlockRef.current.source,
                             element: lastBlockRef.current.element
                         });
-                        elements.push(jsx(Fragment, {
-                            children: lastBlockRef.current.element
-                        }, stableKey));
+                        elements.push(wrapBlockScope(lastBlockRef.current.element, stableKey, !!(options === null || options === void 0 ? void 0 : options.streaming)));
                         continue;
                     }
                 }
-                var element = renderMarkdownBlock(block, processor, components);
+                var element = renderMarkdownBlock(block, processor, components, {
+                    markStreamingTailParagraph: isLast && !!(options === null || options === void 0 ? void 0 : options.streaming)
+                });
                 var entry = {
                     source: block,
                     element: element
                 };
                 newCache.set(block, entry);
                 if (isLast) lastBlockRef.current = entry;
-                elements.push(jsx(Fragment, {
-                    children: element
-                }, stableKey));
+                elements.push(wrapBlockScope(element, stableKey, isLast && !!(options === null || options === void 0 ? void 0 : options.streaming)));
             }
             blockCacheRef.current = newCache;
             return jsxs(Fragment, {
@@ -1246,7 +1297,7 @@ export var useMarkdownToReact = function useMarkdownToReact(content, options) {
         var mdast = processor.parse(preprocessed);
         var hast = processor.runSync(mdast);
         var userComps = components || {};
-        var allComponents = buildEditorAlignedComponents('ant-agentic-md-editor', userComps, false);
+        var allComponents = buildEditorAlignedComponents('ant-agentic-md-editor', userComps, false, undefined, false);
         return toJsxRuntime(hast, {
             Fragment: Fragment,
             jsx: jsx,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ant-design/agentic-ui",
-  "version": "2.30.4",
+  "version": "2.30.6",
   "description": "面向智能体的 UI 组件库，提供多步推理可视化、工具调用展示、任务执行协同等 Agentic UI 能力",
   "repository": "git@github.com:ant-design/agentic-ui.git",
   "license": "MIT",