@ant-design/agentic-ui 2.30.14 → 2.30.17

package/dist/Workspace/File/FileComponent.js

@@ -241,13 +241,16 @@ import { Empty } from "antd";
 import classNames from "clsx";
 import { AnimatePresence, motion } from "framer-motion";
 import React, { useContext, useEffect, useMemo, useRef, useState } from "react";
+import { useRefFunction } from "../../Hooks/useRefFunction";
 import { ActionIconBox } from "../../Components/ActionIconBox";
-import { I18nContext } from "../../I18n";
+import { I18nContext, compileTemplate } from "../../I18n";
 import { formatFileSize, formatLastModified } from "../utils";
 import { fileTypeProcessor, isImageFile } from "./FileTypeProcessor";
 import { PreviewComponent } from "./PreviewComponent";
 import { useFileStyle } from "./style";
 import { generateUniqueId, getFileTypeIcon, getGroupIcon } from "./utils";
+/** Initial number of files shown per group before "show more" */ var GROUP_INITIAL_PAGE_SIZE = 50;
+/** Number of additional files revealed per "show more" click */ var GROUP_PAGE_SIZE_INCREMENT = 100;
 // 通用的键盘事件处理函数
 var handleKeyboardEvent = function handleKeyboardEvent(e, callback) {
     if (e.key === 'Enter' || e.key === ' ') {
@@ -373,11 +376,8 @@ var SearchInput = /*#__PURE__*/ React.memo(function(param) {
 });
 SearchInput.displayName = 'SearchInput';
 // 文件项组件
-var FileItemComponent = function FileItemComponent(param) {
-    var file = param.file, onClick = param.onClick, onDownload = param.onDownload, onPreview = param.onPreview, onShare = param.onShare, onLocate = param.onLocate, prefixCls = param.prefixCls, hashId = param.hashId, _param_bindDomId = param.bindDomId, bindDomId = _param_bindDomId === void 0 ? false : _param_bindDomId;
-    var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
-    var locale = useContext(I18nContext).locale;
-    var finalPrefixCls = prefixCls || getPrefixCls('workspace-file');
+var FileItemComponent = /*#__PURE__*/ React.memo(function(param) {
+    var file = param.file, onClick = param.onClick, onDownload = param.onDownload, onPreview = param.onPreview, onShare = param.onShare, onLocate = param.onLocate, prefixCls = param.prefixCls, hashId = param.hashId, locale = param.locale, _param_bindDomId = param.bindDomId, bindDomId = _param_bindDomId === void 0 ? false : _param_bindDomId;
     // 确保文件有唯一ID
     var fileWithId = ensureNodeWithId(file);
     var fileTypeInfo = fileTypeProcessor.inferFileType(fileWithId);
@@ -447,7 +447,7 @@ var FileItemComponent = function FileItemComponent(param) {
         onLocate === null || onLocate === void 0 ? void 0 : onLocate(fileWithId);
     };
     // 内置操作按钮
-    var actionBtnClass = classNames("".concat(finalPrefixCls, "-item-action-btn"), hashId);
+    var actionBtnClass = classNames("".concat(prefixCls, "-item-action-btn"), hashId);
     var builtinActions = {
         preview: showPreviewButton ? /*#__PURE__*/ React.createElement(ActionIconBox, {
             key: "preview",
@@ -489,55 +489,52 @@ var FileItemComponent = function FileItemComponent(param) {
     // 自定义渲染上下文
     var renderContext = {
         file: fileWithId,
-        prefixCls: finalPrefixCls,
-        hashId: hashId || '',
+        prefixCls: prefixCls,
+        hashId: hashId,
         disabled: isDisabled,
         actions: builtinActions
     };
     return /*#__PURE__*/ React.createElement(AccessibleButton, {
         icon: /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-item-icon"), hashId)
+            className: classNames("".concat(prefixCls, "-item-icon"), hashId)
         }, getFileTypeIcon(fileTypeInfo.fileType, fileWithId.icon, fileWithId.name)), /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-item-info"), hashId)
+            className: classNames("".concat(prefixCls, "-item-info"), hashId)
         }, /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-item-name"), hashId)
+            className: classNames("".concat(prefixCls, "-item-name"), hashId)
         }, fileWithId.renderName ? fileWithId.renderName(renderContext) : /*#__PURE__*/ React.createElement(Typography.Text, {
             ellipsis: {
                 tooltip: fileWithId.name
             }
         }, fileWithId.name)), (fileWithId.renderDetails || fileTypeInfo.displayType || fileWithId.size || fileWithId.lastModified) && /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-item-details"), hashId)
+            className: classNames("".concat(prefixCls, "-item-details"), hashId)
         }, fileWithId.renderDetails ? fileWithId.renderDetails(renderContext) : /*#__PURE__*/ React.createElement(Typography.Text, {
             type: "secondary",
             ellipsis: true
         }, fileTypeInfo.displayType && /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-item-type"), hashId)
+            className: classNames("".concat(prefixCls, "-item-type"), hashId)
         }, fileTypeInfo.displayType), fileWithId.size && /*#__PURE__*/ React.createElement(React.Fragment, null, fileTypeInfo.displayType && /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-item-separator"), hashId)
+            className: classNames("".concat(prefixCls, "-item-separator"), hashId)
         }, "|"), /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-item-size"), hashId)
+            className: classNames("".concat(prefixCls, "-item-size"), hashId)
         }, formatFileSize(fileWithId.size))), fileWithId.lastModified && /*#__PURE__*/ React.createElement(React.Fragment, null, (fileTypeInfo.displayType || fileWithId.size) && /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-item-separator"), hashId)
+            className: classNames("".concat(prefixCls, "-item-separator"), hashId)
         }, "|"), /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-item-time"), hashId)
+            className: classNames("".concat(prefixCls, "-item-time"), hashId)
         }, formatLastModified(fileWithId.lastModified)))))), /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-item-actions"), hashId),
+            className: classNames("".concat(prefixCls, "-item-actions"), hashId),
             onClick: function onClick(e) {
                 return e.stopPropagation();
             }
         }, fileWithId.renderActions ? fileWithId.renderActions(renderContext) : !isDisabled ? /*#__PURE__*/ React.createElement(React.Fragment, null, builtinActions.preview, builtinActions.locate, builtinActions.share, builtinActions.download) : null)),
         onClick: handleClick,
-        className: classNames("".concat(finalPrefixCls, "-item"), _define_property({}, "".concat(finalPrefixCls, "-item-disabled"), isDisabled), hashId),
+        className: classNames("".concat(prefixCls, "-item"), _define_property({}, "".concat(prefixCls, "-item-disabled"), isDisabled), hashId),
         ariaLabel: "".concat((locale === null || locale === void 0 ? void 0 : locale['workspace.file']) || '文件', "：").concat(fileWithId.name),
         id: bindDomId ? fileWithId.id : undefined
     });
-};
+});
 // 分组标题栏组件
-var GroupHeader = function GroupHeader(param) {
-    var group = param.group, onToggle = param.onToggle, onGroupDownload = param.onGroupDownload, prefixCls = param.prefixCls, hashId = param.hashId;
-    var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
-    var locale = useContext(I18nContext).locale;
-    var finalPrefixCls = prefixCls || getPrefixCls('workspace-file');
+var GroupHeader = /*#__PURE__*/ React.memo(function(param) {
+    var group = param.group, onToggle = param.onToggle, onGroupDownload = param.onGroupDownload, prefixCls = param.prefixCls, hashId = param.hashId, locale = param.locale;
     var groupTypeInfo = fileTypeProcessor.inferFileType(group);
     var groupType = group.type || groupTypeInfo.fileType;
     var handleToggle = function handleToggle() {
@@ -565,35 +562,60 @@ var GroupHeader = function GroupHeader(param) {
     }();
     return /*#__PURE__*/ React.createElement(AccessibleButton, {
         icon: /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-group-header-left"), hashId)
+            className: classNames("".concat(prefixCls, "-group-header-left"), hashId)
         }, /*#__PURE__*/ React.createElement(CollapseIcon, {
-            className: classNames("".concat(finalPrefixCls, "-group-toggle-icon"), hashId)
+            className: classNames("".concat(prefixCls, "-group-toggle-icon"), hashId)
         }), /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-group-type-icon"), hashId)
+            className: classNames("".concat(prefixCls, "-group-type-icon"), hashId)
         }, groupIcon), /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-group-type-name"), hashId)
+            className: classNames("".concat(prefixCls, "-group-type-name"), hashId)
         }, group.name)), /*#__PURE__*/ React.createElement("div", {
-            className: classNames("".concat(finalPrefixCls, "-group-header-right"), hashId)
+            className: classNames("".concat(prefixCls, "-group-header-right"), hashId)
         }, /*#__PURE__*/ React.createElement("span", {
-            className: classNames("".concat(finalPrefixCls, "-group-count"), hashId)
+            className: classNames("".concat(prefixCls, "-group-count"), hashId)
         }, group.children.length), showDownloadButton && /*#__PURE__*/ React.createElement(ActionIconBox, {
             title: (locale === null || locale === void 0 ? void 0 : locale['workspace.file.download']) || '下载',
             onClick: handleDownload,
             tooltipProps: {
                 mouseEnterDelay: 0.3
             },
-            className: classNames("".concat(finalPrefixCls, "-group-action-btn"), hashId)
+            className: classNames("".concat(prefixCls, "-group-action-btn"), hashId)
         }, /*#__PURE__*/ React.createElement(DownloadIcon, null)))),
         onClick: handleToggle,
-        className: classNames("".concat(finalPrefixCls, "-group-header"), hashId),
+        className: classNames("".concat(prefixCls, "-group-header"), hashId),
         ariaLabel: "".concat(group.collapsed ? (locale === null || locale === void 0 ? void 0 : locale['workspace.expand']) || '展开' : (locale === null || locale === void 0 ? void 0 : locale['workspace.collapse']) || '收起').concat(group.name).concat((locale === null || locale === void 0 ? void 0 : locale['workspace.group']) || '分组')
     });
-};
+});
 // 文件分组组件
-var FileGroupComponent = function FileGroupComponent(param) {
-    var group = param.group, onToggle = param.onToggle, onGroupDownload = param.onGroupDownload, onDownload = param.onDownload, onFileClick = param.onFileClick, onPreview = param.onPreview, onShare = param.onShare, onLocate = param.onLocate, prefixCls = param.prefixCls, hashId = param.hashId, bindDomId = param.bindDomId;
-    var getPrefixCls = useContext(ConfigProvider.ConfigContext).getPrefixCls;
-    var finalPrefixCls = prefixCls || getPrefixCls('workspace-file');
+var FileGroupComponent = /*#__PURE__*/ React.memo(function(param) {
+    var group = param.group, onToggle = param.onToggle, onGroupDownload = param.onGroupDownload, onDownload = param.onDownload, onFileClick = param.onFileClick, onPreview = param.onPreview, onShare = param.onShare, onLocate = param.onLocate, prefixCls = param.prefixCls, hashId = param.hashId, locale = param.locale, bindDomId = param.bindDomId;
+    var _useState = _sliced_to_array(useState(GROUP_INITIAL_PAGE_SIZE), 2), visibleCount = _useState[0], setVisibleCount = _useState[1];
+    // 分组数据变化时重置分页，避免切换数据源后一次性展示过多节点
+    useEffect(function() {
+        setVisibleCount(GROUP_INITIAL_PAGE_SIZE);
+    }, [
+        group.id,
+        group.children.length
+    ]);
+    var totalCount = group.children.length;
+    var visibleFiles = group.children.slice(0, visibleCount);
+    var remainingCount = totalCount - visibleCount;
+    var hasMore = remainingCount > 0;
+    var handleShowMore = useRefFunction(function(e) {
+        e.stopPropagation();
+        setVisibleCount(function(prev) {
+            return prev + GROUP_PAGE_SIZE_INCREMENT;
+        });
+    });
+    var handleShowMoreKeyDown = useRefFunction(function(e) {
+        if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            e.stopPropagation();
+            setVisibleCount(function(prev) {
+                return prev + GROUP_PAGE_SIZE_INCREMENT;
+            });
+        }
+    });
     var contentVariants = useMemo(function() {
         return {
             expanded: {
@@ -623,14 +645,18 @@ var FileGroupComponent = function FileGroupComponent(param) {
             }
         };
     }, []);
+    var showMoreLabel = hasMore ? compileTemplate((locale === null || locale === void 0 ? void 0 : locale['workspace.file.showMore']) || '查看更多（还有 ${count} 个）', {
+        count: String(remainingCount)
+    }) : (locale === null || locale === void 0 ? void 0 : locale['workspace.file.showMoreFiles']) || '查看更多文件';
     return /*#__PURE__*/ React.createElement("div", {
-        className: classNames("".concat(finalPrefixCls, "-container--group"), hashId)
+        className: classNames("".concat(prefixCls, "-container--group"), hashId)
     }, /*#__PURE__*/ React.createElement(GroupHeader, {
         group: group,
         onToggle: onToggle,
         onGroupDownload: onGroupDownload,
-        prefixCls: finalPrefixCls,
-        hashId: hashId
+        prefixCls: prefixCls,
+        hashId: hashId,
+        locale: locale
     }), /*#__PURE__*/ React.createElement(AnimatePresence, {
         initial: false
     }, !group.collapsed && /*#__PURE__*/ React.createElement(motion.div, {
@@ -640,8 +666,8 @@ var FileGroupComponent = function FileGroupComponent(param) {
         animate: "expanded",
         exit: "collapsed",
         transition: contentTransition,
-        className: classNames("".concat(finalPrefixCls, "-group-content"), hashId)
-    }, group.children.map(function(file) {
+        className: classNames("".concat(prefixCls, "-group-content"), hashId)
+    }, visibleFiles.map(function(file) {
         return /*#__PURE__*/ React.createElement(FileItemComponent, {
             key: file.id,
             file: file,
@@ -650,12 +676,20 @@ var FileGroupComponent = function FileGroupComponent(param) {
             onPreview: onPreview,
             onShare: onShare,
             onLocate: onLocate,
-            prefixCls: finalPrefixCls,
+            prefixCls: prefixCls,
             hashId: hashId,
+            locale: locale,
             bindDomId: !!bindDomId
         });
-    }))));
-};
+    }), hasMore && /*#__PURE__*/ React.createElement("div", {
+        role: "button",
+        tabIndex: 0,
+        className: classNames("".concat(prefixCls, "-show-more"), hashId),
+        onClick: handleShowMore,
+        onKeyDown: handleShowMoreKeyDown,
+        "aria-label": showMoreLabel
+    }, showMoreLabel))));
+});
 export var FileComponent = function FileComponent(param) {
     var nodes = param.nodes, onGroupDownload = param.onGroupDownload, onDownload = param.onDownload, onShare = param.onShare, onFileClick = param.onFileClick, onLocate = param.onLocate, onToggleGroup = param.onToggleGroup, onGroupToggle = param.onGroupToggle, onPreview = param.onPreview, onBack = param.onBack, resetKey = param.resetKey, markdownEditorProps = param.markdownEditorProps, customActions = param.customActions, actionRef = param.actionRef, loading = param.loading, loadingRender = param.loadingRender, emptyRender = param.emptyRender, keyword = param.keyword, onChange = param.onChange, _param_showSearch = param.showSearch, showSearch = _param_showSearch === void 0 ? false : _param_showSearch, searchPlaceholder = param.searchPlaceholder, _param_bindDomId = param.bindDomId, bindDomId = _param_bindDomId === void 0 ? false : _param_bindDomId;
     var _useState = _sliced_to_array(useState(null), 2), previewFile = _useState[0], setPreviewFile = _useState[1];
@@ -669,6 +703,15 @@ export var FileComponent = function FileComponent(param) {
     }), 2), imagePreview = _useState4[0], setImagePreview = _useState4[1];
     // 添加内部状态来管理分组的折叠状态
     var _useState5 = _sliced_to_array(useState({}), 2), collapsedGroups = _useState5[0], setCollapsedGroups = _useState5[1];
+    // 扁平文件列表（非分组模式）分页状态
+    var _useState6 = _sliced_to_array(useState(GROUP_INITIAL_PAGE_SIZE), 2), flatVisibleCount = _useState6[0], setFlatVisibleCount = _useState6[1];
+    // nodes 或 keyword 变化时重置扁平列表分页，避免切换数据源后一次性渲染过多节点
+    useEffect(function() {
+        setFlatVisibleCount(GROUP_INITIAL_PAGE_SIZE);
+    }, [
+        nodes,
+        keyword
+    ]);
     // 追踪预览请求的序号，避免异步竞态
     var previewRequestIdRef = useRef(0);
     // 缓存节点 ID，避免每次渲染重新生成（使用 WeakMap 自动清理不再使用的节点）
@@ -680,7 +723,7 @@ export var FileComponent = function FileComponent(param) {
     var prefixCls = getPrefixCls('workspace-file');
     var _useFileStyle = useFileStyle(prefixCls), wrapSSR = _useFileStyle.wrapSSR, hashId = _useFileStyle.hashId;
     // 确保节点有稳定的唯一 ID（使用缓存）
-    var ensureNodeWithStableId = function ensureNodeWithStableId(node) {
+    var ensureNodeWithStableId = useRefFunction(function(node) {
         if (node.id) return _object_spread({}, node);
         // 尝试从缓存获取 ID
         var cachedId = nodeIdCacheRef.current.get(node);
@@ -692,16 +735,16 @@ export var FileComponent = function FileComponent(param) {
         return _object_spread_props(_object_spread({}, node), {
             id: cachedId
         });
-    };
+    });
     // 返回列表（供预览页调用）
-    var handleBackToList = function handleBackToList() {
+    var handleBackToList = useRefFunction(function() {
         // 使进行中的预览请求失效
         previewRequestIdRef.current++;
         setPreviewFile(null);
         setCustomPreviewContent(null);
         setCustomPreviewHeader(null);
         setHeaderFileOverride(null);
-    };
+    });
     // 监听 resetKey 变化，重置预览状态
     useEffect(function() {
         if (resetKey !== undefined && previewFile) {
@@ -756,7 +799,7 @@ export var FileComponent = function FileComponent(param) {
         nodes
     ]);
     // 处理分组折叠/展开
-    var handleToggleGroup = function handleToggleGroup(groupId, type, collapsed) {
+    var handleToggleGroup = useRefFunction(function(groupId, type, collapsed) {
         // 更新内部状态，使用 groupId 作为 key
         setCollapsedGroups(function(prev) {
             return _object_spread_props(_object_spread({}, prev), _define_property({}, groupId, collapsed));
@@ -767,9 +810,9 @@ export var FileComponent = function FileComponent(param) {
         } else if (onToggleGroup) {
             onToggleGroup(type, collapsed);
         }
-    };
+    });
     // 包装后的返回逻辑，允许外部拦截
-    var handleBack = function handleBack() {
+    var handleBack = useRefFunction(function() {
         return _async_to_generator(function() {
             var result, _;
             return _ts_generator(this, function(_state) {
@@ -814,18 +857,18 @@ export var FileComponent = function FileComponent(param) {
                 }
             });
         })();
-    };
+    });
     // 预览页面的下载（供预览页调用）
-    var handleDownloadInPreview = function handleDownloadInPreview(file) {
+    var handleDownloadInPreview = useRefFunction(function(file) {
         // 优先使用用户传入的下载方法
         if (onDownload) {
             onDownload(file);
             return;
         }
         handleFileDownload(file);
-    };
+    });
     // 预览文件处理
-    var handlePreview = function handlePreview(file) {
+    var handlePreview = useRefFunction(function(file) {
         return _async_to_generator(function() {
             var currentCallId, previewData, content, err, previewSrc;
             return _ts_generator(this, function(_state) {
@@ -935,7 +978,7 @@ export var FileComponent = function FileComponent(param) {
                 }
             });
         })();
-    };
+    });
     // 通过 actionRef 暴露可编程接口
     React.useEffect(function() {
         if (!actionRef) return;
@@ -963,7 +1006,7 @@ export var FileComponent = function FileComponent(param) {
     ]);
     var hasKeyword = Boolean((keyword !== null && keyword !== void 0 ? keyword : '').trim());
     // 渲染搜索框组件 - 确保在所有情况下都保持一致
-    var renderSearchInput = function renderSearchInput() {
+    var renderSearchInput = useRefFunction(function() {
         if (!showSearch) return null;
         return /*#__PURE__*/ React.createElement(SearchInput, {
             keyword: keyword,
@@ -973,9 +1016,9 @@ export var FileComponent = function FileComponent(param) {
             hashId: hashId,
             locale: locale
         });
-    };
+    });
     // 渲染空状态内容
-    var renderEmptyContent = function renderEmptyContent() {
+    var renderEmptyContent = useRefFunction(function() {
         if (hasKeyword) {
             return /*#__PURE__*/ React.createElement(Typography.Text, {
                 type: "secondary"
@@ -987,48 +1030,20 @@ export var FileComponent = function FileComponent(param) {
         return emptyRender !== null && emptyRender !== void 0 ? emptyRender : /*#__PURE__*/ React.createElement(Empty, {
             description: (locale === null || locale === void 0 ? void 0 : locale['workspace.empty']) || 'No data'
         });
-    };
-    // 图片预览组件
-    var ImagePreviewComponent = /*#__PURE__*/ React.createElement(Image, {
-        className: classNames("".concat(prefixCls, "-hidden-image"), hashId),
-        src: imagePreview.src,
-        preview: {
-            visible: imagePreview.visible,
-            onVisibleChange: function onVisibleChange(visible) {
-                setImagePreview(function(prev) {
-                    return _object_spread_props(_object_spread({}, prev), {
-                        visible: visible
-                    });
-                });
-            }
+    });
+    var handleFlatShowMore = useRefFunction(function() {
+        setFlatVisibleCount(function(prev) {
+            return prev + GROUP_PAGE_SIZE_INCREMENT;
+        });
+    });
+    var handleFlatShowMoreKeyDown = useRefFunction(function(e) {
+        if (e.key === 'Enter' || e.key === ' ') {
+            e.preventDefault();
+            handleFlatShowMore();
         }
     });
-    // 如果正在预览文件，显示预览组件
-    if (previewFile) {
-        return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(PreviewComponent, {
-            file: previewFile,
-            onBack: handleBack,
-            onDownload: handleDownloadInPreview,
-            onShare: function onShare1(file, options) {
-                if (onShare) {
-                    onShare(file, {
-                        anchorEl: options === null || options === void 0 ? void 0 : options.anchorEl,
-                        origin: 'preview'
-                    });
-                } else {
-                    handleDefaultShare(file);
-                }
-            },
-            onLocate: onLocate,
-            customContent: customPreviewContent || undefined,
-            customHeader: customPreviewHeader || undefined,
-            customActions: typeof customActions === 'function' ? customActions(previewFile) : customActions,
-            headerFileOverride: headerFileOverride || undefined,
-            markdownEditorProps: markdownEditorProps
-        }), ImagePreviewComponent);
-    }
     // 渲染文件内容
-    var renderFileContent = function renderFileContent() {
+    var renderFileContent = useRefFunction(function() {
         if ((!nodes || nodes.length === 0) && !loading) {
             return /*#__PURE__*/ React.createElement("div", {
                 className: classNames("".concat(prefixCls, "-empty"), hashId)
@@ -1039,7 +1054,14 @@ export var FileComponent = function FileComponent(param) {
                 className: classNames("".concat(prefixCls, "-empty"), hashId)
             }, renderEmptyContent());
         }
-        return safeNodes.map(function(node) {
+        // Determine whether this is a purely flat list (no groups) so we can paginate
+        var isFlat = safeNodes.every(function(n) {
+            return !('children' in n);
+        });
+        var nodesToRender = isFlat ? safeNodes.slice(0, flatVisibleCount) : safeNodes;
+        var flatRemaining = isFlat ? safeNodes.length - flatVisibleCount : 0;
+        var flatHasMore = flatRemaining > 0;
+        var items = nodesToRender.map(function(node) {
             var nodeWithId = ensureNodeWithStableId(node);
             if ('children' in nodeWithId) {
                 var _collapsedGroups_nodeWithId_id;
@@ -1061,6 +1083,7 @@ export var FileComponent = function FileComponent(param) {
                     onLocate: onLocate,
                     prefixCls: prefixCls,
                     hashId: hashId,
+                    locale: locale,
                     bindDomId: bindDomId
                 });
             }
@@ -1075,10 +1098,62 @@ export var FileComponent = function FileComponent(param) {
                 onLocate: onLocate,
                 prefixCls: prefixCls,
                 hashId: hashId,
+                locale: locale,
                 bindDomId: bindDomId
             });
         });
-    };
+        if (!flatHasMore) return items;
+        var flatShowMoreLabel = compileTemplate((locale === null || locale === void 0 ? void 0 : locale['workspace.file.showMore']) || '查看更多（还有 ${count} 个）', {
+            count: String(flatRemaining)
+        });
+        return /*#__PURE__*/ React.createElement(React.Fragment, null, items, /*#__PURE__*/ React.createElement("div", {
+            role: "button",
+            tabIndex: 0,
+            className: classNames("".concat(prefixCls, "-show-more"), hashId),
+            onClick: handleFlatShowMore,
+            onKeyDown: handleFlatShowMoreKeyDown,
+            "aria-label": flatShowMoreLabel
+        }, flatShowMoreLabel));
+    });
+    // 图片预览组件
+    var ImagePreviewComponent = /*#__PURE__*/ React.createElement(Image, {
+        className: classNames("".concat(prefixCls, "-hidden-image"), hashId),
+        src: imagePreview.src,
+        preview: {
+            visible: imagePreview.visible,
+            onVisibleChange: function onVisibleChange(visible) {
+                setImagePreview(function(prev) {
+                    return _object_spread_props(_object_spread({}, prev), {
+                        visible: visible
+                    });
+                });
+            }
+        }
+    });
+    // 如果正在预览文件，显示预览组件
+    if (previewFile) {
+        return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(PreviewComponent, {
+            file: previewFile,
+            onBack: handleBack,
+            onDownload: handleDownloadInPreview,
+            onShare: function onShare1(file, options) {
+                if (onShare) {
+                    onShare(file, {
+                        anchorEl: options === null || options === void 0 ? void 0 : options.anchorEl,
+                        origin: 'preview'
+                    });
+                } else {
+                    handleDefaultShare(file);
+                }
+            },
+            onLocate: onLocate,
+            customContent: customPreviewContent || undefined,
+            customHeader: customPreviewHeader || undefined,
+            customActions: typeof customActions === 'function' ? customActions(previewFile) : customActions,
+            headerFileOverride: headerFileOverride || undefined,
+            markdownEditorProps: markdownEditorProps
+        }), ImagePreviewComponent);
+    }
     // 统一的渲染逻辑 - 确保搜索框位置稳定
     return wrapSSR(/*#__PURE__*/ React.createElement(React.Fragment, null, loading && loadingRender ? // 使用自定义loading渲染函数
     /*#__PURE__*/ React.createElement("div", {

package/dist/Workspace/File/style.js

@@ -446,6 +446,26 @@ var genStyle = function genStyle(token) {
     }), // 隐藏的图片预览组件
     _define_property(_obj7, "".concat(token.componentCls, "-hidden-image"), {
         display: 'none'
+    }), // 查看更多按钮
+    _define_property(_obj7, "".concat(token.componentCls, "-show-more"), {
+        display: 'flex',
+        alignItems: 'center',
+        justifyContent: 'center',
+        padding: '6px 0',
+        cursor: 'pointer',
+        color: 'var(--color-gray-text-secondary)',
+        font: 'var(--font-text-body-sm)',
+        letterSpacing: 'var(--letter-spacing-body-sm, normal)',
+        transition: 'color 0.2s ease',
+        userSelect: 'none',
+        '&:hover': {
+            color: 'var(--color-primary-control-fill-primary-active)'
+        },
+        svg: {
+            marginLeft: '4px',
+            width: '12px',
+            height: '12px'
+        }
     }), _obj7;
 };
 export function useFileStyle(prefixCls) {

package/package.json

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