@aloudata/aloudata-design 2.6.0 → 2.6.1

package/dist/Icon/components/ArrowDownLightLine.d.ts

@@ -0,0 +1,11 @@
+import type { SVGProps } from 'react';
+import * as React from 'react';
+interface SVGRProps {
+    size?: number | string;
+    title?: string;
+    titleId?: string;
+    desc?: string;
+    descId?: string;
+}
+declare const Memo: React.MemoExoticComponent<React.ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement> & SVGRProps, "ref"> & React.RefAttributes<SVGSVGElement>>>;
+export default Memo;

package/dist/Icon/components/ArrowDownLightLine.js

@@ -0,0 +1,35 @@
+var _excluded = ["title", "titleId", "desc", "descId"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import * as React from 'react';
+import { forwardRef, memo } from 'react';
+var ArrowDownLightLine = function ArrowDownLightLine(_ref, ref) {
+  var title = _ref.title,
+    titleId = _ref.titleId,
+    desc = _ref.desc,
+    descId = _ref.descId,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: props.width || props.size || 16,
+    height: props.height || props.size || 16,
+    fill: "none",
+    viewBox: "0 0 24 24",
+    ref: ref,
+    "aria-labelledby": titleId,
+    "aria-describedby": descId
+  }, props), desc ? /*#__PURE__*/React.createElement("desc", {
+    id: descId
+  }, desc) : null, title ? /*#__PURE__*/React.createElement("title", {
+    id: titleId
+  }, title) : null, /*#__PURE__*/React.createElement("path", {
+    fill: props.color || 'currentColor',
+    fillRule: "evenodd",
+    d: "M6.47 9.47a.75.75 0 0 1 1.06 0L12 13.94l4.47-4.47a.75.75 0 1 1 1.06 1.06l-5 5a.75.75 0 0 1-1.06 0l-5-5a.75.75 0 0 1 0-1.06Z",
+    clipRule: "evenodd"
+  }));
+};
+var ForwardRef = /*#__PURE__*/forwardRef(ArrowDownLightLine);
+var Memo = /*#__PURE__*/memo(ForwardRef);
+export default Memo;

package/dist/Icon/index.d.ts

@@ -1,6 +1,7 @@
 export { default as AlertTriangleDuotone } from './components/AlertTriangleDuotone';
 export { default as AlertTriangleLine } from './components/AlertTriangleLine';
 export { default as ArrowDownFill } from './components/ArrowDownFill';
+export { default as ArrowDownLightLine } from './components/ArrowDownLightLine';
 export { default as ArrowRightLightLine } from './components/ArrowRightLightLine';
 export { default as AttentionCircleFill } from './components/AttentionCircleFill';
 export { default as AttentionTriangleFill } from './components/AttentionTriangleFill';

package/dist/Icon/index.js

@@ -1,6 +1,7 @@
 export { default as AlertTriangleDuotone } from "./components/AlertTriangleDuotone";
 export { default as AlertTriangleLine } from "./components/AlertTriangleLine";
 export { default as ArrowDownFill } from "./components/ArrowDownFill";
+export { default as ArrowDownLightLine } from "./components/ArrowDownLightLine";
 export { default as ArrowRightLightLine } from "./components/ArrowRightLightLine";
 export { default as AttentionCircleFill } from "./components/AttentionCircleFill";
 export { default as AttentionTriangleFill } from "./components/AttentionTriangleFill";

package/dist/Icon/svg/arrow-down-light-line.svg

@@ -0,0 +1,5 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id=" Icon / Light / Arrow / Arrow-Down-light-line">
+<path id="Icon" fill-rule="evenodd" clip-rule="evenodd" d="M6.46967 9.46967C6.76256 9.17678 7.23744 9.17678 7.53033 9.46967L12 13.9393L16.4697 9.46967C16.7626 9.17678 17.2374 9.17678 17.5303 9.46967C17.8232 9.76256 17.8232 10.2374 17.5303 10.5303L12.5303 15.5303C12.2374 15.8232 11.7626 15.8232 11.4697 15.5303L6.46967 10.5303C6.17678 10.2374 6.17678 9.76256 6.46967 9.46967Z" fill="black"/>
+</g>
+</svg>

package/dist/Radio/style/index.less

@@ -300,7 +300,11 @@
   // filled样式的button
   .ald-radio-button-wrapper-filled,
   .ald-radio-button-wrapper-filter {
-    padding: 0 @radio-button-padding;
+    padding: 0 @radio-button-padding - 1;
+
+    &:not(.ald-radio-wrapper-checked) {
+      padding: 0 @radio-button-padding;
+    }
   }
 
   .ald-radio-button-wrapper-filled,
@@ -314,7 +318,6 @@
     height: calc(100% - 4px);
     background-color: var(--alias-colors-bg-skeleton-strong, #f3f4f6);
     cursor: pointer;
-    border: 1px solid transparent;
 
     // 选中样式
     &.ald-radio-wrapper-checked {
@@ -602,7 +605,7 @@
   width: min-content;
 
   .ald-radio-label:not(.ald-radio-wrapper-disabled) {
-    &:hover {
+    &:not(.ald-radio-wrapper-checked):hover {
       background: var(--alias-colors-bg-interaction-hover, rgba(0, 0, 0, 0.05));
     }
 

package/dist/Table/components/ExpandCell.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { IExpandableInfo } from '../hooks/useExpandable';
+import { TRowKey } from '../types';
+export default function ExpandCell<TDataItem extends object>(props: IProps<TDataItem>): React.JSX.Element;
+interface IProps<TDataItem extends object> {
+    expandableInfo: IExpandableInfo<TDataItem>;
+    data: TDataItem;
+    children: React.ReactNode;
+    rowKey?: TRowKey<TDataItem>;
+}
+export {};

package/dist/Table/components/ExpandCell.js

@@ -0,0 +1,46 @@
+import _ from 'lodash';
+import React from 'react';
+import { ArrowDownLightLine, ArrowRightLightLine } from "../../Icon";
+import { getRowKey, prefixCls } from "../helper";
+export default function ExpandCell(props) {
+  var children = props.children,
+    expandableInfo = props.expandableInfo,
+    data = props.data,
+    rowKey = props.rowKey;
+  if (!expandableInfo.isExpandable || !rowKey) {
+    // 配置了折叠展开时，会在前面的流程中强制检查 rowKey 字段是否存在
+    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+  }
+  var expandItemMap = expandableInfo.expandItemMap,
+    onExpand = expandableInfo.onExpand;
+  var key = getRowKey(data, rowKey);
+  var expandItem = expandItemMap[key];
+  if (!expandItem) {
+    console.error('expandItem in not found', key, expandItemMap);
+    return /*#__PURE__*/React.createElement(React.Fragment, null, children);
+  }
+  var level = expandItem.level,
+    isExpanded = expandItem.isExpanded,
+    isLeaf = expandItem.isLeaf;
+  var expandBtn = isLeaf ? null : isExpanded ? /*#__PURE__*/React.createElement(ArrowDownLightLine, null) : /*#__PURE__*/React.createElement(ArrowRightLightLine, null);
+  return /*#__PURE__*/React.createElement("div", {
+    className: prefixCls('expandable-td')
+  }, /*#__PURE__*/React.createElement("div", {
+    className: prefixCls('indent-list')
+  }, _.map(_.range(level), function (i) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: prefixCls('indent-item'),
+      key: i
+    });
+  })), /*#__PURE__*/React.createElement("div", {
+    className: prefixCls('expand-btn'),
+    onClick: function onClick() {
+      if (isLeaf) {
+        return;
+      }
+      onExpand(data, !!isExpanded);
+    }
+  }, expandBtn), /*#__PURE__*/React.createElement("div", {
+    className: prefixCls('expand-content')
+  }, children));
+}

package/dist/Table/components/Pagination/index.d.ts

@@ -1,8 +1,9 @@
 import React from 'react';
+import { IPaginationProps } from '../../../Pagination/types';
 import { ITableProps } from '../../types';
-export default function TablePagination<TDataItem extends object>(props: IProps<TDataItem>): React.JSX.Element | undefined;
+export default function TablePagination<TDataItem extends object>(props: IProps<TDataItem>): React.JSX.Element;
 interface IProps<TDataItem extends object> {
-    pagination?: ITableProps<TDataItem>['pagination'];
+    pagination: IPaginationProps;
     scroll?: ITableProps<TDataItem>['scroll'];
     scrollToFirstRow: () => void;
 }

package/dist/Table/components/Pagination/index.js

@@ -18,7 +18,7 @@ export default function TablePagination(props) {
     }
     onChange(page);
   }, [scrollToFirstRow, scroll, pagination]);
-  return pagination && /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: prefixCls('pagination')
   }, /*#__PURE__*/React.createElement(Pagination, _extends({
     hideOnSinglePage: true

package/dist/Table/helper.d.ts

@@ -19,7 +19,7 @@ export declare function getTableColumns<TDataItem extends object>({ columns, tot
         render?: ((text: any, record: TDataItem, rowIndex: number) => import("react").ReactNode) | undefined;
         ellipsis?: boolean | undefined;
         noPadding?: boolean | undefined;
-        align?: "left" | "center" | "right" | undefined;
+        align?: "center" | "left" | "right" | undefined;
         fixed?: "left" | "right" | undefined;
     };
 }[];
@@ -39,3 +39,4 @@ export declare function getNumberFromPercentageStr(str: string): number;
  */
 export declare function isPercentage(str: string): boolean;
 export declare function prefixCls(className: string): string;
+export declare function getRowKey<TDataItem extends object>(row: TDataItem, rowKey: ITableProps<TDataItem>['rowKey'], defaultKey?: string | number): string;

package/dist/Table/helper.js

@@ -5,6 +5,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 import _ from 'lodash';
+import { getUUID } from "../_utils/hooks/useId";
 import Cell from "./components/Cell";
 import Header from "./components/Header";
 export function getTableColumns(_ref) {
@@ -142,4 +143,13 @@ export function isPercentage(str) {
 var ALD_PREFIX = 'ald-table';
 export function prefixCls(className) {
   return "".concat(ALD_PREFIX, "-").concat(className);
+}
+export function getRowKey(row, rowKey, defaultKey) {
+  var rowKeyStr = defaultKey || getUUID();
+  if (typeof rowKey === 'function') {
+    rowKeyStr = rowKey(row);
+  } else if (rowKey !== undefined) {
+    rowKeyStr = _.get(row, rowKey);
+  }
+  return _.toString(rowKeyStr);
 }

package/dist/Table/hooks/useExpandable.d.ts

@@ -0,0 +1,23 @@
+import { ITableProps } from '../types';
+export default function useExpandable<TDataItem extends object>(props: IProps<TDataItem>): IExpandableInfo<TDataItem>;
+export interface IExpandableInfo<TDataItem extends object> {
+    expandItemMap: IExpandItemMap;
+    onExpand: (record: TDataItem, isExpanded: boolean) => void;
+    isExpandable: boolean;
+    data: TDataItem[];
+}
+export interface IExpandItem {
+    isLeaf: boolean;
+    isExpanded?: boolean;
+    level: number;
+    rowKey: string;
+}
+interface IExpandItemMap {
+    [key: string]: IExpandItem;
+}
+interface IProps<TDataItem extends object> {
+    expandable: ITableProps<TDataItem>['expandable'];
+    data: ITableProps<TDataItem>['data'];
+    rowKey: ITableProps<TDataItem>['rowKey'];
+}
+export {};

package/dist/Table/hooks/useExpandable.js

@@ -0,0 +1,152 @@
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+function _nonIterableSpread() { 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { 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 _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import _ from 'lodash';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { getRowKey } from "../helper";
+export default function useExpandable(props) {
+  var propsExpandable = props.expandable,
+    data = props.data,
+    rowKey = props.rowKey;
+  var expandable = getExpandableConfig(propsExpandable);
+  if (!!propsExpandable && !rowKey) {
+    throw new Error('rowKey is necessary when expandable is enabled, but is missing');
+  }
+  var expandedRowKeys = expandable.expandedRowKeys,
+    propsOnExpand = expandable.onExpand,
+    _expandable$defaultEx = expandable.defaultExpandAllRows,
+    defaultExpandAllRows = _expandable$defaultEx === void 0 ? true : _expandable$defaultEx,
+    defaultExpandedRowKeys = expandable.defaultExpandedRowKeys,
+    childrenColumnName = expandable.childrenColumnName;
+  var columnName = getChildrenColumnName(childrenColumnName);
+  var flattenList = useMemo(function () {
+    return flattenChildren(data, columnName);
+  }, [columnName, data]);
+  var allCategoryRowKeys = useMemo(function () {
+    return getAllExpandRowKeys(flattenList, columnName, defaultExpandAllRows, rowKey);
+  }, [columnName, flattenList, defaultExpandAllRows, rowKey]);
+
+  // 考虑 defaultExpandAllRows 的情况
+  var _useState = useState(expandedRowKeys || defaultExpandedRowKeys || allCategoryRowKeys || []),
+    _useState2 = _slicedToArray(_useState, 2),
+    expandedKeys = _useState2[0],
+    setExpandedKeys = _useState2[1];
+  var expandItemMap = useMemo(function () {
+    var listData = data.map(function (dataItem) {
+      return getListItemsByTree(dataItem, expandedKeys, rowKey, childrenColumnName);
+    }).flat();
+    return _.keyBy(listData, function (dataItem) {
+      return dataItem.rowKey;
+    });
+  }, [childrenColumnName, data, expandedKeys, rowKey]);
+  useEffect(function () {
+    if (expandedRowKeys) {
+      // 展开收起完全受控的情况
+      setExpandedKeys(expandedRowKeys);
+    }
+  }, [expandedRowKeys]);
+  var onExpand = useCallback(function (dataItem, isExpanded) {
+    var key = getRowKey(dataItem, rowKey);
+    if (!expandedRowKeys) {
+      setExpandedKeys(function (prev) {
+        if (isExpanded) {
+          // 折叠
+          return prev.filter(function (expandedKey) {
+            return expandedKey !== key;
+          });
+        } else {
+          // 展开
+          return [].concat(_toConsumableArray(prev), [key]);
+        }
+      });
+    }
+    propsOnExpand === null || propsOnExpand === void 0 ? void 0 : propsOnExpand(dataItem, isExpanded);
+  }, [propsOnExpand, rowKey, expandedRowKeys]);
+  var visibleList = useMemo(function () {
+    return flattenList.filter(function (dataItem) {
+      var key = getRowKey(dataItem, rowKey);
+      // 不在 Map 中的行，即表示被折叠了
+      return !!expandItemMap[key];
+    });
+  }, [expandItemMap, flattenList, rowKey]);
+  if (!propsExpandable) {
+    return {
+      expandItemMap: {},
+      onExpand: function onExpand() {},
+      isExpandable: false,
+      data: data
+    };
+  }
+  return {
+    expandItemMap: expandItemMap,
+    onExpand: onExpand,
+    isExpandable: true,
+    data: visibleList
+  };
+}
+function getListItemsByTree(currNode, expandedKeys, getKey, childrenColumnName) {
+  var level = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
+  var subNodes = _.get(currNode, getChildrenColumnName(childrenColumnName));
+  var isLeaf = !subNodes;
+  var rowKey = getRowKey(currNode, getKey);
+  if (isLeaf) {
+    return [{
+      isLeaf: true,
+      level: level,
+      rowKey: rowKey
+    }];
+  }
+  // 是目录的情况
+  var isExpanded = expandedKeys.includes(rowKey);
+  var curr = {
+    isLeaf: false,
+    level: level,
+    rowKey: rowKey
+  };
+  if (!isExpanded) {
+    curr.isExpanded = false;
+    return [curr];
+  }
+  curr.isExpanded = true;
+  // 子目录是展开的情况
+  var subItems = (subNodes === null || subNodes === void 0 ? void 0 : subNodes.map(function (child) {
+    return getListItemsByTree(child, expandedKeys, getKey, childrenColumnName, level + 1);
+  })) || [];
+  return [curr].concat(_toConsumableArray(_.flatten(subItems)));
+}
+function getExpandableConfig(expandable) {
+  if (typeof expandable === 'boolean') {
+    return {};
+  }
+  return expandable || {};
+}
+function getAllExpandRowKeys(list, childrenColumnName, defaultExpandAllRows, rowKey) {
+  if (!defaultExpandAllRows) {
+    return undefined;
+  }
+  var itemsWithChildrenProp = list.filter(function (item) {
+    return !!_.get(item, childrenColumnName);
+  });
+  return itemsWithChildrenProp.map(function (item) {
+    return getRowKey(item, rowKey);
+  });
+}
+function flattenChildren(nodes, childKey) {
+  return _.flatMapDeep(nodes, function (node) {
+    var children = node[childKey];
+    if (children && children.length > 0) {
+      return [node].concat(_toConsumableArray(flattenChildren(children, childKey)));
+    }
+    return [node];
+  });
+}
+function getChildrenColumnName(childrenColumnName) {
+  return childrenColumnName || 'children';
+}

package/dist/Table/index.d.ts

@@ -2,6 +2,6 @@ import React, { ForwardedRef } from 'react';
 import { ITableProps, ITableRef } from './types';
 declare function Table<TDataItem extends object>(props: ITableProps<TDataItem>, ref: ForwardedRef<ITableRef>): React.JSX.Element;
 declare const _default: <TDataItem extends object>(props: ITableProps<TDataItem> & {
-    ref?: React.ForwardedRef<HTMLUListElement> | undefined;
+    ref?: React.ForwardedRef<ITableRef> | undefined;
 }) => ReturnType<typeof Table>;
 export default _default;

package/dist/Table/index.js

@@ -16,13 +16,15 @@ import _ from 'lodash';
 import ResizeObserver from 'rc-resize-observer';
 import React, { forwardRef, useCallback, useImperativeHandle, useMemo, useState } from 'react';
 import { Empty, Spin } from '..';
+import ExpandCell from "./components/ExpandCell";
 import Pagination from "./components/Pagination";
-import { getTableColumns, prefixCls } from "./helper";
+import { getRowKey, getTableColumns, prefixCls } from "./helper";
+import useExpandable from "./hooks/useExpandable";
 import useFixed from "./hooks/useFixed";
 import useScroll from "./hooks/useScroll";
 var HEADER_HEIGHT = 41;
 function Table(props, ref) {
-  var _classnames, _classnames5;
+  var _classnames, _classnames6;
   var columns = props.columns,
     data = props.data,
     rowKey = props.rowKey,
@@ -38,7 +40,8 @@ function Table(props, ref) {
       return '';
     } : _props$rowClassName,
     onRowClick = props.onRowClick,
-    onError = props.onError;
+    onError = props.onError,
+    expandable = props.expandable;
   var _useState = useState(null),
     _useState2 = _slicedToArray(_useState, 2),
     totalSize = _useState2[0],
@@ -66,6 +69,11 @@ function Table(props, ref) {
       scrollToFirstRow: scrollToFirstRow
     };
   });
+  var expandableInfo = useExpandable({
+    expandable: expandable,
+    data: data,
+    rowKey: rowKey
+  });
   var tableColumns = useMemo(function () {
     if (!totalSize || !realWidth) {
       return [];
@@ -83,16 +91,11 @@ function Table(props, ref) {
   });
   var tableInstance = useReactTable({
     columns: tableColumns,
-    data: data,
+    // 排除掉被折叠的行
+    data: expandableInfo.data,
     getCoreRowModel: getCoreRowModel(),
     getRowId: function getRowId(row, index) {
-      var rowKeyStr = index;
-      if (typeof rowKey === 'function') {
-        rowKeyStr = rowKey(row);
-      } else if (rowKey !== undefined) {
-        rowKeyStr = _.get(row, rowKey, index);
-      }
-      return _.toString(rowKeyStr);
+      return getRowKey(row, rowKey, index);
     },
     columnResizeMode: 'onChange'
   });
@@ -153,6 +156,11 @@ function Table(props, ref) {
       onRowClick(rowData, rowIndex);
     };
   }, [onRowClick]);
+  var isShowPagination = pagination && pagination.total > pagination.pageSize;
+
+  // 空态切换 size 的阈值
+  var EMPTY_SMALL_SIZE_HEIGHT = 288;
+  var isSmallEmpty = totalSize && totalSize.height < EMPTY_SMALL_SIZE_HEIGHT;
 
   // 渲染 body
   var bodyContent = /*#__PURE__*/React.createElement("div", {
@@ -161,25 +169,32 @@ function Table(props, ref) {
       width: realWidth
     }
   }, rows.length === 0 && !loading ? emptyComponent || /*#__PURE__*/React.createElement("div", {
-    className: prefixCls('empty')
+    className: classnames(prefixCls('empty'), _defineProperty({}, prefixCls('empty-small'), isSmallEmpty))
   }, /*#__PURE__*/React.createElement(Empty, {
-    image: Empty.PRESENTED_IMAGE_SEARCH
+    image: isSmallEmpty ? null : Empty.PRESENTED_IMAGE_SEARCH,
+    size: isSmallEmpty ? 'small' : undefined
   })) : _.map(rows, function (row, rowIndex) {
+    var _classnames4;
     return /*#__PURE__*/React.createElement("div", {
       key: row.id,
-      className: classnames(prefixCls('tr'), _defineProperty({}, prefixCls('row-hover'), typeof onRowClick === 'function'), rowClassName(row.original, rowIndex)),
+      className: classnames(prefixCls('tr'), (_classnames4 = {}, _defineProperty(_classnames4, prefixCls('row-hover'), typeof onRowClick === 'function'), _defineProperty(_classnames4, prefixCls('no-border-tr'), isShowPagination && rowIndex === rows.length - 1), _classnames4), rowClassName(row.original, rowIndex)),
       onClick: onClickRow(row.original, rowIndex)
     }, _.map(row.getVisibleCells(), function (cell, colIndex) {
       var _getColumnFixedInfo2 = getColumnFixedInfo(colIndex),
         fixedClassName = _getColumnFixedInfo2.className,
         fixedStyle = _getColumnFixedInfo2.style;
+      var tdContent = flexRender(cell.column.columnDef.cell, cell.getContext());
       return /*#__PURE__*/React.createElement("div", {
         className: classnames(prefixCls('td'), fixedClassName),
         key: cell.id,
         style: _objectSpread({
           width: cell.column.getSize()
         }, fixedStyle)
-      }, flexRender(cell.column.columnDef.cell, cell.getContext()));
+      }, colIndex === 0 ? /*#__PURE__*/React.createElement(ExpandCell, {
+        expandableInfo: expandableInfo,
+        data: row.original,
+        rowKey: rowKey
+      }, tdContent) : tdContent);
     }));
   }));
   var tableContent = /*#__PURE__*/React.createElement(Spin, {
@@ -211,8 +226,8 @@ function Table(props, ref) {
       });
     }
   }, /*#__PURE__*/React.createElement("div", {
-    className: classnames(prefixCls('main'), (_classnames5 = {}, _defineProperty(_classnames5, prefixCls('overflow-hidden'), !!y), _defineProperty(_classnames5, prefixCls('ping-left'), isPingLeft), _defineProperty(_classnames5, prefixCls('ping-right'), isPingRight), _classnames5))
-  }, tableContent)), /*#__PURE__*/React.createElement(Pagination, {
+    className: classnames(prefixCls('main'), (_classnames6 = {}, _defineProperty(_classnames6, prefixCls('overflow-hidden'), !!y), _defineProperty(_classnames6, prefixCls('ping-left'), isPingLeft), _defineProperty(_classnames6, prefixCls('ping-right'), isPingRight), _classnames6))
+  }, tableContent)), isShowPagination && /*#__PURE__*/React.createElement(Pagination, {
     pagination: pagination,
     scroll: scroll,
     scrollToFirstRow: scrollToFirstRow