@ant-design/pro-components 3.1.3-1 → 3.1.5-0

package/lib/table/Table.js

@@ -310,8 +310,6 @@ const ProTable = props => {
         ...(formSearchRef.current || {}),
         ...params
       };
-
-      // eslint-disable-next-line no-underscore-dangle
       delete actionParams._timestamp;
       const response = await request(actionParams, proSort, proFilter);
       return response;
@@ -355,7 +353,6 @@ const ProTable = props => {
     };
     document.addEventListener('visibilitychange', visibilitychange);
     return () => document.removeEventListener('visibilitychange', visibilitychange);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   /** SelectedRowKeys受控处理selectRows */
@@ -403,7 +400,6 @@ const ProTable = props => {
         current: 1
       });
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [params]);
 
   // 设置 name 到 store 中，里面用了 ref ，所以不用担心直接 set
@@ -514,10 +510,7 @@ const ProTable = props => {
       columns: propsColumns,
       context: columnContext
     }).sort((0, _columnSort.columnSort)(counter.columnsMap ?? {}));
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [propsColumns, counter?.sortKeyColumns, counter?.columnsMap, columnEmptyText, type,
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  editableUtils.editableKeys && editableUtils.editableKeys.join(','), proFilter, proSort]);
+  }, [propsColumns, counter?.sortKeyColumns, counter?.columnsMap, columnEmptyText, type, editableUtils.editableKeys && editableUtils.editableKeys.join(','), proFilter, proSort]);
 
   /** Table Column 变化的时候更新一下，这个参数将会用于渲染 */
   (0, _utils.useDeepCompareEffectDebounce)(() => {
@@ -728,21 +721,28 @@ const ProTable = props => {
     hideToolbar,
     toolbarDom
   });
-  const tableAreaDom = cardProps === false || notNeedCardDom || !!props.name ? tableContentDom : /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.default, {
+
+  /** ProTable：有搜索/工具栏/标题时使用卡片包裹；可编辑表格（name）不包裹 */
+  /** ProList：始终使用卡片包裹（除非 cardProps 为 false） */
+  const useCard = (0, _react.useMemo)(() => {
+    const useCardForTable = cardProps !== false && !props.name && !notNeedCardDom;
+    const useCardForList = cardProps !== false && type === 'list';
+    return useCardForTable || useCardForList;
+  }, [cardProps, props.name, type, notNeedCardDom]);
+  const resolvedCardProps = cardProps === false ? {} : cardProps ?? {};
+  const tableAreaDom = useCard ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_card.default, {
+    ...resolvedCardProps,
     ghost: ghost,
     variant: (0, _utils2.isBordered)('table', cardBordered) ? 'outlined' : 'borderless',
     styles: {
       body: {
         ...cardBodyStyle,
-        ...(cardProps && typeof cardProps === 'object' ? cardProps.styles?.body || cardProps.bodyStyle : {})
+        ...(resolvedCardProps.styles?.body ?? {})
       },
-      ...(cardProps && typeof cardProps === 'object' && (cardProps.styles?.header || cardProps.headStyle) ? {
-        header: cardProps.styles?.header || cardProps.headStyle
-      } : {})
+      header: resolvedCardProps.styles?.header
     },
-    ...cardProps,
     children: tableContentDom
-  });
+  }) : tableContentDom;
   const renderTable = () => {
     if (props.tableRender) {
       return props.tableRender(props, tableAreaDom, {
@@ -792,8 +792,8 @@ const ProviderTableContainer = props => {
       columnsState: props.columnsState,
       columns: props.columns,
       onSizeChange: props.onSizeChange,
-      size: props.size,
-      defaultSize: props.defaultSize
+      size: props.size || undefined,
+      defaultSize: props.defaultSize || undefined
     },
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_provider.ProConfigProvider, {
       valueTypeMap: {

package/lib/table/components/Alert/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _antd = require("antd");
+var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
 var _provider = require("../../../provider");
 var _style = require("./style");
@@ -60,16 +61,16 @@ function TableAlert({
     return null;
   }
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: `${className} ${hashId}`.trim(),
+    className: (0, _clsx.clsx)(className, hashId),
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: `${className}-container ${hashId}`.trim(),
+      className: (0, _clsx.clsx)(`${className}-container`, hashId),
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-        className: `${className}-info ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${className}-info`, hashId),
         children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: `${className}-info-content ${hashId}`.trim(),
+          className: (0, _clsx.clsx)(`${className}-info-content`, hashId),
           children: dom
         }), option ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: `${className}-info-option ${hashId}`.trim(),
+          className: (0, _clsx.clsx)(`${className}-info-option`, hashId),
           children: option
         }) : null]
       })

package/lib/table/components/ColumnSetting/index.js

@@ -63,7 +63,7 @@ const CheckboxListItem = ({
     hashId
   } = (0, _react.useContext)(_provider.ProProvider);
   const dom = /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-    className: `${className}-list-item-option ${hashId}`.trim(),
+    className: (0, _clsx.clsx)(`${className}-list-item-option`, hashId),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(ToolTipIcon, {
       columnKey: columnKey,
       fixed: "left",
@@ -85,9 +85,9 @@ const CheckboxListItem = ({
     })]
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
-    className: `${className}-list-item ${hashId}`.trim(),
+    className: (0, _clsx.clsx)(`${className}-list-item`, hashId),
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: `${className}-list-item-title ${hashId}`.trim(),
+      className: (0, _clsx.clsx)(`${className}-list-item-title`, hashId),
       children: title
     }), showListItemOption && !isLeaf ? dom : null]
   }, columnKey);
@@ -118,7 +118,7 @@ const CheckboxList = ({
     const treeMap = new Map();
     const loopData = (data, parentConfig) => data.map(({
       key,
-      dataIndex,
+      dataIndex: _dataIndex,
       children,
       ...rest
     }) => {
@@ -266,13 +266,13 @@ const CheckboxList = ({
     },
     height: listHeight,
     treeData: treeDataConfig.list?.map(({
-      disabled /* 不透传 disabled，使子节点禁用时也可以拖动调整顺序 */,
+      disabled: _disabled /* 不透传 disabled，使子节点禁用时也可以拖动调整顺序 */,
       ...config
     }) => config)
   });
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
     children: [showTitle && /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
-      className: `${className}-list-title ${hashId}`.trim(),
+      className: (0, _clsx.clsx)(`${className}-list-title`, hashId),
       children: listTitle
     }), listDom]
   });
@@ -361,7 +361,6 @@ function ColumnSetting(props) {
     if (counter.propsRef.current?.columnsState?.value) {
       columnRef.current = JSON.parse(JSON.stringify(counter.propsRef.current?.columnsState?.value || {}));
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
   /**
@@ -430,7 +429,7 @@ function ColumnSetting(props) {
   return wrapSSR( /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Popover, {
     arrow: false,
     title: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: `${className}-title ${hashId}`.trim(),
+      className: (0, _clsx.clsx)(`${className}-title`, hashId),
       children: [props.checkable === false ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {}) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Checkbox, {
         indeterminate: indeterminate,
         checked: unCheckedKeys.length === 0 && unCheckedKeys.length !== localColumns.length,
@@ -440,7 +439,7 @@ function ColumnSetting(props) {
         children: intl.getMessage('tableToolBar.columnDisplay', '列展示')
       }), checkedReset ? /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
         onClick: clearClick,
-        className: `${className}-action-rest-button ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${className}-action-rest-button`, hashId),
         children: intl.getMessage('tableToolBar.reset', '重置')
       }) : null, props?.extra ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Space, {
         size: 12,
@@ -449,7 +448,7 @@ function ColumnSetting(props) {
       }) : null]
     }),
     classNames: {
-      root: `${className}-overlay ${hashId}`.trim()
+      root: (0, _clsx.clsx)(`${className}-overlay`, hashId)
     },
     trigger: "click",
     placement: "bottomRight",

package/lib/table/components/DragSortTable/index.js

@@ -9,6 +9,7 @@ exports.default = void 0;
 var _icons = require("@ant-design/icons");
 var _util = require("@rc-component/util");
 var _antd = require("antd");
+var _clsx = require("clsx");
 var _react = _interopRequireWildcard(require("react"));
 var _Table = _interopRequireDefault(require("../../Table"));
 var _useDragSort = require("../../utils/useDragSort");
@@ -33,7 +34,10 @@ function DragSortTable(props) {
   const setDataSource = (0, _react.useCallback)(updater => {
     setDataSourceInner(prev => {
       const next = typeof updater === 'function' ? updater(prev) : updater;
-      onDataSourceChange?.(next);
+      // 使用 queueMicrotask 延迟回调，避免在渲染期间更新其他组件状态
+      queueMicrotask(() => {
+        onDataSourceChange?.(next);
+      });
       return next;
     });
   }, [onDataSourceChange]);
@@ -46,14 +50,14 @@ function DragSortTable(props) {
   const DragHandle = (0, _react.useMemo)(() => {
     return dragHandleProps => {
       const {
-        rowData,
-        index,
+        rowData: _rowData,
+        index: _index,
         className,
         ...rest
       } = dragHandleProps;
       const defaultDom = /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.HolderOutlined, {
         ...rest,
-        className: `${getPrefixCls('pro-table-drag-icon')} ${className || ''} ${hashId || ''}`.trim()
+        className: (0, _clsx.clsx)(getPrefixCls('pro-table-drag-icon'), className, hashId)
       });
       const handel = dragSortHandlerRender ? dragSortHandlerRender(dragHandleProps?.rowData, dragHandleProps?.index) : defaultDom;
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {

package/lib/table/components/EditableTable/index.d.ts

@@ -86,7 +86,7 @@ export type EditableProTableProps<T, U extends ParamsType, ValueType = 'text'> =
 declare function FieldEditableTable<DataType extends Record<string, any>, Params extends ParamsType = ParamsType, ValueType = 'text'>(props: EditableProTableProps<DataType, Params, ValueType>): import("react/jsx-runtime").JSX.Element;
 declare namespace FieldEditableTable {
     var RecordCreator: <T = Record<string, any>>(props: RecordCreatorProps<T> & {
-        children: JSX.Element;
+        children: React.JSX.Element;
     }) => React.FunctionComponentElement<any>;
 }
 export default FieldEditableTable;

package/lib/table/components/EditableTable/index.js

@@ -77,7 +77,7 @@ function handlePaginationInsert(baseData, defaultValue, pageConfig) {
   result.splice(insertIndex, 0, defaultValue);
   return result;
 }
-function useEditableDataSource({
+function _useEditableDataSource({
   actionDataSource,
   editableUtils,
   pagination,
@@ -216,7 +216,6 @@ function useCreatorButton({
       return false;
     }
     return createButtonDom(recordCreatorProps, value, intl);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [maxLength, recordCreatorProps, value?.length, intl]);
   const buttonRenderProps = (0, _react.useMemo)(() => {
     if (!creatorButtonDom) {
@@ -240,15 +239,15 @@ function EditableTable(props) {
   const {
     onTableChange,
     maxLength,
-    formItemProps,
+    formItemProps: _formItemProps,
     recordCreatorProps,
     rowKey,
-    controlled,
+    controlled: _controlled,
     defaultValue,
-    onChange,
+    onChange: _onChange,
     editableFormRef,
     // @ts-ignore
-    autoFocus,
+    autoFocus: _autoFocus,
     ...rest
   } = props;
   const preData = (0, _react.useRef)(undefined);
@@ -540,7 +539,6 @@ function EditableTable(props) {
   } = recordCreatorProps || {};
   const isTop = position === 'top';
   const {
-    creatorButtonDom,
     buttonRenderProps
   } = useCreatorButton({
     recordCreatorProps,
@@ -689,7 +687,7 @@ function FieldEditableTable(props) {
       const name = [props.name].flat(1);
       try {
         return JSON.stringify((0, _util.get)(prev, name)) !== JSON.stringify((0, _util.get)(next, name));
-      } catch (error) {
+      } catch (_error) {
         return true;
       }
     },

package/lib/table/components/ListToolBar/HeaderMenu.d.ts

@@ -11,6 +11,7 @@ export type ListToolBarHeaderMenuProps = {
     items?: ListToolBarMenuItem[];
     onChange?: (activeKey?: React.Key) => void;
     prefixCls?: string;
+    hashId?: string;
 };
 declare const HeaderMenu: React.FC<ListToolBarHeaderMenuProps>;
 export default HeaderMenu;

package/lib/table/components/ListToolBar/HeaderMenu.js

@@ -14,8 +14,9 @@ var _provider = require("../../../provider");
 var _jsxRuntime = require("react/jsx-runtime");
 const HeaderMenu = props => {
   const {
-    hashId
+    hashId: contextHashId
   } = (0, _react.useContext)(_provider.ProProvider);
+  const hashId = props.hashId ?? contextHashId;
   const {
     items = [],
     type = 'inline',
@@ -60,7 +61,7 @@ const HeaderMenu = props => {
     });
   }
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: (0, _clsx.clsx)(`${prefixCls}-menu`, `${prefixCls}-dropdownmenu`),
+    className: (0, _clsx.clsx)(`${prefixCls}-menu`, `${prefixCls}-dropdownmenu`, hashId),
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Dropdown, {
       trigger: ['click'],
       menu: {
@@ -75,7 +76,7 @@ const HeaderMenu = props => {
         }))
       },
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_antd.Space, {
-        className: `${prefixCls}-dropdownmenu-label`,
+        className: (0, _clsx.clsx)(`${prefixCls}-dropdownmenu-label`, hashId),
         children: [activeItem.label, /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.DownOutlined, {})]
       })
     })

package/lib/table/components/ListToolBar/index.d.ts

@@ -1,7 +1,7 @@
 import { TabPaneProps } from 'antd';
-import type { LabelTooltipType } from 'antd/lib/form/FormItemLabel';
 import type { SearchProps } from 'antd/lib/input';
 import React from 'react';
+import type { LabelTooltipType } from '../../../utils';
 import type { ListToolBarHeaderMenuProps } from './HeaderMenu';
 export type ListToolBarSetting = {
     icon: React.ReactNode;

package/lib/table/components/ListToolBar/index.js

@@ -60,13 +60,14 @@ function getSettingItem(setting) {
 }
 const ListToolBarTabBar = ({
   prefixCls,
+  hashId,
   tabs,
   multipleLine,
   filtersNode
 }) => {
   if (!multipleLine) return null;
   return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-    className: `${prefixCls}-extra-line`,
+    className: (0, _clsx.clsx)(`${prefixCls}-extra-line`, hashId),
     children: tabs?.items && tabs?.items.length ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_antd.Tabs, {
       style: {
         width: '100%'
@@ -144,7 +145,7 @@ const ListToolBar = ({
   /** 轻量筛选组件 */
   const filtersNode = (0, _react.useMemo)(() => {
     if (filter) return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-      className: `${prefixCls}-filter ${hashId}`.trim(),
+      className: (0, _clsx.clsx)(`${prefixCls}-filter`, hashId),
       children: filter
     });
     return null;
@@ -169,13 +170,11 @@ const ListToolBar = ({
       },
       children: actions.map((action, index) => {
         if (! /*#__PURE__*/_react.default.isValidElement(action)) {
-          // eslint-disable-next-line react/no-array-index-key
           return /*#__PURE__*/(0, _jsxRuntime.jsx)(_react.default.Fragment, {
             children: action
           }, index);
         }
         return /*#__PURE__*/_react.default.cloneElement(action, {
-          // eslint-disable-next-line react/no-array-index-key
           key: index,
           ...action?.props
         });
@@ -190,16 +189,16 @@ const ListToolBar = ({
     // 保留dom是为了占位，不然 right 就变到左边了
     if (!hasLeft && hasRight) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: `${prefixCls}-left ${hashId}`.trim()
+        className: (0, _clsx.clsx)(`${prefixCls}-left`, hashId)
       });
     }
 
     // 减少 space 的dom，渲染的时候能节省点性能
     if (!menu && (hasTitle || !searchNode)) {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: `${prefixCls}-left ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${prefixCls}-left`, hashId),
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-          className: `${prefixCls}-title ${hashId}`.trim(),
+          className: (0, _clsx.clsx)(`${prefixCls}-title`, hashId),
           children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.LabelIconTip, {
             tooltip: tooltip,
             label: title,
@@ -215,7 +214,7 @@ const ListToolBar = ({
         [`${prefixCls}-left-has-inline-menu`]: menu?.type === 'inline'
       }),
       children: [hasTitle && !menu && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: `${prefixCls}-title ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${prefixCls}-title`, hashId),
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_utils.LabelIconTip, {
           tooltip: tooltip,
           label: title,
@@ -226,9 +225,10 @@ const ListToolBar = ({
       // 这里面实现了 tabs 的逻辑
       (0, _jsxRuntime.jsx)(_HeaderMenu.default, {
         ...menu,
-        prefixCls: prefixCls
+        prefixCls: prefixCls,
+        hashId: hashId
       }), !hasTitle && searchNode ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: `${prefixCls}-search ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${prefixCls}-search`, hashId),
         children: searchNode
       }) : null]
     });
@@ -236,25 +236,21 @@ const ListToolBar = ({
   const rightTitleDom = (0, _react.useMemo)(() => {
     if (!hasRight) return null;
     return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
-      className: `${prefixCls}-right ${hashId}`.trim(),
+      className: (0, _clsx.clsx)(`${prefixCls}-right`, hashId),
       style: isMobile ? {} : {
         alignItems: 'center'
       },
       children: [!multipleLine ? filtersNode : null, hasTitle && searchNode ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: `${prefixCls}-search ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${prefixCls}-search`, hashId),
         children: searchNode
       }) : null, actionDom, settings?.length ? /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
-        className: `${prefixCls}-setting-items ${hashId}`.trim(),
+        className: (0, _clsx.clsx)(`${prefixCls}-setting-items`, hashId),
         children: settings.map((setting, index) => {
           const settingItem = getSettingItem(setting);
-          return (
-            /*#__PURE__*/
-            // eslint-disable-next-line react/no-array-index-key
-            (0, _jsxRuntime.jsx)("div", {
-              className: `${prefixCls}-setting-item ${hashId}`.trim(),
-              children: settingItem
-            }, index)
-          );
+          return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+            className: (0, _clsx.clsx)(`${prefixCls}-setting-item`, hashId),
+            children: settingItem
+          }, index);
         })
       }) : null]
     });
@@ -281,6 +277,7 @@ const ListToolBar = ({
       className: (0, _clsx.clsx)(prefixCls, hashId, className),
       children: [titleNode, /*#__PURE__*/(0, _jsxRuntime.jsx)(ListToolBarTabBar, {
         filtersNode: filtersNode,
+        hashId: hashId,
         prefixCls: prefixCls,
         tabs: tabs,
         multipleLine: multipleLine

package/lib/table/components/ListToolBar/style.js

@@ -14,7 +14,7 @@ const genProListStyle = token => {
         display: 'flex',
         justifyContent: 'space-between',
         paddingBlock: token.padding,
-        paddingInline: 0,
+        paddingInline: token.paddingXS,
         '&-mobile': {
           flexDirection: 'column'
         }
@@ -24,7 +24,7 @@ const genProListStyle = token => {
         alignItems: 'center',
         justifyContent: 'flex-start',
         color: token.colorTextHeading,
-        fontWeight: '500',
+        fontWeight: token.fontWeightStrong,
         fontSize: token.fontSizeLG
       },
       '&-search:not(:last-child)': {
@@ -107,7 +107,7 @@ const genProListStyle = token => {
         },
         [`${token.antCls}-tabs-nav-list`]: {
           marginBlockStart: 0,
-          '${token.antCls}-tabs-tab': {
+          [`${token.antCls}-tabs-tab`]: {
             paddingBlockStart: 0
           }
         }

package/lib/table/components/ToolBar/index.d.ts

@@ -1,6 +1,6 @@
 import type { TableColumnType } from 'antd';
-import type { LabelTooltipType } from 'antd/lib/form/FormItemLabel';
 import React from 'react';
+import type { LabelTooltipType } from '../../../utils';
 import type { ActionType, OptionSearchProps, ProTableProps } from '../../typing';
 import type { ListToolBarProps } from '../ListToolBar';
 export type SettingOptionType = {

package/lib/table/style/index.js

@@ -27,6 +27,10 @@ const turn = exports.turn = new _cssinjs.Keyframes('turn', {
 const genProListStyle = token => {
   return {
     [token.componentCls]: {
+      boxSizing: 'border-box',
+      '*, *::before, *::after': {
+        boxSizing: 'border-box'
+      },
       zIndex: 1,
       [`${token.antCls}-table-wrapper ${token.antCls}-table-pagination${token.antCls}-pagination`]: {
         marginBlockEnd: 0

package/lib/table/typing.d.ts

@@ -1,6 +1,5 @@
 import type { SpinProps, TableProps } from 'antd';
 import type { SizeType } from 'antd/lib/config-provider/SizeContext';
-import type { LabelTooltipType } from 'antd/lib/form/FormItemLabel';
 import type { NamePath } from 'antd/lib/form/interface';
 import type { SearchProps } from 'antd/lib/input';
 import type { ColumnFilterItem, ColumnType, CompareFn, SorterResult, SortOrder } from 'antd/lib/table/interface';
@@ -10,7 +9,7 @@ import type { CSSProperties, Key } from 'react';
 import type { ProCardProps } from '../card';
 import type { ProFieldEmptyText } from '../field';
 import type { LightWrapperProps, ProFormProps, QueryFilterProps } from '../form';
-import type { ProCoreActionType, ProSchema, ProSchemaComponentTypes, ProTableEditableFnType, RowEditableConfig, SearchTransformKeyFn } from '../utils';
+import type { LabelTooltipType, ProCoreActionType, ProEllipsis, ProSchema, ProSchemaComponentTypes, ProTableEditableFnType, RowEditableConfig, SearchTransformKeyFn } from '../utils';
 import type { AlertRenderType } from './components/Alert';
 import type { SearchConfig, TableFormItem } from './components/Form/FormRender';
 import type { ListToolBarProps } from './components/ListToolBar';
@@ -80,7 +79,7 @@ export type ProColumnType<T = unknown, ValueType = 'text'> = ProSchema<T, ExtraP
     /** 搜索表单的默认值 */
     initialValue?: any;
     /** @name 是否缩略 */
-    ellipsis?: ColumnType<T>['ellipsis'];
+    ellipsis?: ProEllipsis;
     /** @name 是否拷贝 */
     copyable?: boolean;
     /** 在查询表单中隐藏 */
@@ -106,8 +105,14 @@ export type ProColumnType<T = unknown, ValueType = 'text'> = ProSchema<T, ExtraP
     order?: number;
     /** @name 可编辑表格是否可编辑 */
     editable?: boolean | ProTableEditableFnType<T>;
-    /** @private */
-    listKey?: string;
+    /**
+     * 用于 ProList，指定该列映射到列表项的哪个插槽位置
+     *
+     * @name 列表项插槽
+     * @example listSlot: 'title'
+     * @example listSlot: 'avatar'
+     */
+    listSlot?: 'title' | 'subTitle' | 'avatar' | 'description' | 'content' | 'actions' | 'aside' | 'type' | (string & {});
     /** @name 只读 */
     readonly?: boolean;
     /** @name 列设置的 disabled */

package/lib/table/useFetchData.js

@@ -56,7 +56,10 @@ const useFetchData = (getData, defaultData, options) => {
   const setTableDataList = (0, _react.useCallback)(updater => {
     setTableDataListInner(prev => {
       const next = typeof updater === 'function' ? updater(prev) : updater;
-      options?.onDataSourceChange?.(next);
+      // 使用 queueMicrotask 延迟回调，避免在渲染期间更新其他组件状态
+      queueMicrotask(() => {
+        options?.onDataSourceChange?.(next);
+      });
       return next;
     });
   }, [options?.onDataSourceChange]);
@@ -269,7 +272,6 @@ const useFetchData = (getData, defaultData, options) => {
     return () => {
       clearTimeout(pollingSetTimeRef.current);
     };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [polling]);
   (0, _react.useEffect)(() => {
     umountRef.current = false;
@@ -302,7 +304,6 @@ const useFetchData = (getData, defaultData, options) => {
       abortFetch();
       fetchListDebounce.run(false);
     }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [pageInfo?.current]);
 
   // pageSize 修改后返回第一页
@@ -312,7 +313,6 @@ const useFetchData = (getData, defaultData, options) => {
     }
     abortFetch();
     fetchListDebounce.run(false);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [pageInfo?.pageSize]);
 
   /**

package/lib/table/utils/cellRenderToFromItem.js

@@ -67,9 +67,7 @@ const CellRenderFromItem = props => {
     name: formItemName,
     ...restProps,
     children: children
-  }, key),
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  [key, formItemName]);
+  }, key), [key, formItemName]);
   const generateFormItem = (0, _react.useCallback)(() => {
     const formItemProps = {
       ...(0, _utils.getFieldPropsOrFormItemProps)(columnProps?.formItemProps, ...needProps)
@@ -128,7 +126,7 @@ const CellRenderFromItem = props => {
         const shouldName = [rowName].flat(1);
         try {
           return JSON.stringify((0, _util.get)(pre, shouldName)) !== JSON.stringify((0, _util.get)(next, shouldName));
-        } catch (error) {
+        } catch (_error) {
           return true;
         }
       },

package/lib/table/utils/index.js

@@ -98,7 +98,6 @@ function useActionType(ref, action, props) {
     // 透出 scrollTo（如上层提供）
     scrollTo: props.scrollTo
   };
-  // eslint-disable-next-line no-param-reassign
   ref.current = userAction;
 }
 /**

package/lib/table/utils/useDragSort.js

@@ -83,7 +83,7 @@ const SortableRow = props => {
  */
 const SortableItemCell = /*#__PURE__*/_react.default.memo(props => {
   const {
-    dragSortKey,
+    dragSortKey: _dragSortKey,
     ...rest
   } = props;
   const {

package/lib/utils/components/DropdownFooter/index.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-type LightFilterFooterRender = ((onConfirm?: (e?: React.MouseEvent) => void, onClear?: (e?: React.MouseEvent) => void) => JSX.Element | false) | false;
+type LightFilterFooterRender = ((onConfirm?: (e?: React.MouseEvent) => void, onClear?: (e?: React.MouseEvent) => void) => React.JSX.Element | false) | false;
 type OnClick = (e?: React.MouseEvent) => void;
 export type DropdownFooterProps = {
     onClear?: OnClick;

package/lib/utils/components/FieldLabel/index.js

@@ -78,7 +78,7 @@ const FieldLabelFunction = (props, ref) => {
         onClick: () => {
           onLabelClick?.();
         },
-        className: `${prefixCls}-text`,
+        className: (0, _clsx.clsx)(`${prefixCls}-text`, hashId),
         children: [aLabel, ': ']
       }) : '';
       const str = formatterText(aValue);

package/lib/utils/components/FilterDropdown/index.d.ts

@@ -2,7 +2,7 @@ import type { PopoverProps } from 'antd';
 import type { TooltipPlacement } from 'antd/lib/tooltip';
 import React from 'react';
 import type { DropdownFooterProps } from '../DropdownFooter';
-export type FooterRender = ((onConfirm?: (e?: React.MouseEvent) => void, onClear?: (e?: React.MouseEvent) => void) => JSX.Element | false) | false;
+export type FooterRender = ((onConfirm?: (e?: React.MouseEvent) => void, onClear?: (e?: React.MouseEvent) => void) => React.JSX.Element | false) | false;
 export type DropdownProps = {
     label?: React.ReactNode;
     footer?: DropdownFooterProps;