@douyinfe/semi-ui 2.1.1 → 2.1.2

package/lib/cjs/table/Body/index.js

@@ -0,0 +1,873 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports.default = void 0;
+
+var _indexOf = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/index-of"));
+
+var _getOwnPropertySymbols = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols"));
+
+var _assign = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/assign"));
+
+var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
+
+var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
+
+var _map2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/map"));
+
+var _isArray = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/array/is-array"));
+
+var _forEach = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/for-each"));
+
+var _set = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set"));
+
+var _setTimeout2 = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/set-timeout"));
+
+var _isNull2 = _interopRequireDefault(require("lodash/isNull"));
+
+var _pick2 = _interopRequireDefault(require("lodash/pick"));
+
+var _isEqual2 = _interopRequireDefault(require("lodash/isEqual"));
+
+var _each2 = _interopRequireDefault(require("lodash/each"));
+
+var _isMap2 = _interopRequireDefault(require("lodash/isMap"));
+
+var _size2 = _interopRequireDefault(require("lodash/size"));
+
+var _get2 = _interopRequireDefault(require("lodash/get"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _reactWindow = require("react-window");
+
+var _utils = require("@douyinfe/semi-foundation/lib/cjs/table/utils");
+
+var _bodyFoundation = _interopRequireDefault(require("@douyinfe/semi-foundation/lib/cjs/table/bodyFoundation"));
+
+var _constants = require("@douyinfe/semi-foundation/lib/cjs/table/constants");
+
+var _baseComponent = _interopRequireDefault(require("../../_base/baseComponent"));
+
+var _utils2 = require("../utils");
+
+var _ColGroup = _interopRequireDefault(require("../ColGroup"));
+
+var _BaseRow = _interopRequireDefault(require("./BaseRow"));
+
+var _ExpandedRow = _interopRequireDefault(require("./ExpandedRow"));
+
+var _SectionRow = _interopRequireDefault(require("./SectionRow"));
+
+var _TableHeader = _interopRequireDefault(require("../TableHeader"));
+
+var _context2 = _interopRequireDefault(require("../../configProvider/context"));
+
+var _tableContext = _interopRequireDefault(require("../table-context"));
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && (0, _indexOf.default)(e).call(e, p) < 0) t[p] = s[p];
+
+  if (s != null && typeof _getOwnPropertySymbols.default === "function") for (var i = 0, p = (0, _getOwnPropertySymbols.default)(s); i < p.length; i++) {
+    if ((0, _indexOf.default)(e).call(e, p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+/* eslint-disable eqeqeq */
+
+/* eslint-disable @typescript-eslint/member-ordering */
+
+/* eslint-disable max-len */
+
+
+class Body extends _baseComponent.default {
+  constructor(props, context) {
+    var _this;
+
+    super(props);
+    _this = this;
+
+    this.forwardRef = node => {
+      const {
+        forwardedRef
+      } = this.props;
+      this.ref.current = node;
+      this.foundation.observeBodyResize(node);
+
+      if (typeof forwardedRef === 'function') {
+        forwardedRef(node);
+      } else if (forwardedRef && typeof forwardedRef === 'object') {
+        forwardedRef.current = node;
+      }
+    };
+
+    this.itemSize = index => {
+      const {
+        virtualized,
+        size: tableSize
+      } = this.props;
+      const {
+        virtualizedData
+      } = this.state;
+      const virtualizedItem = (0, _get2.default)(virtualizedData, index);
+      const defaultConfig = (0, _utils.getDefaultVirtualizedRowConfig)(tableSize, virtualizedItem.sectionRow);
+      const itemSize = (0, _get2.default)(virtualized, 'itemSize', defaultConfig.height);
+      let realSize = itemSize;
+
+      if (typeof itemSize === 'function') {
+        realSize = itemSize(index, {
+          expandedRow: (0, _get2.default)(virtualizedItem, 'expandedRow', false),
+          sectionRow: (0, _get2.default)(virtualizedItem, 'sectionRow', false)
+        });
+      }
+
+      if (realSize < defaultConfig.minHeight) {
+        _utils2.logger.warn("The computed real `itemSize` cannot be less than ".concat(defaultConfig.minHeight));
+      }
+
+      return realSize;
+    };
+
+    this.itemKey = (index, data) => (0, _get2.default)(data, [index, 'key'], index);
+
+    this.handleRowClick = (rowKey, e, expand) => {
+      const {
+        handleRowExpanded
+      } = this.context;
+      handleRowExpanded(!expand, rowKey, e);
+    };
+
+    this.handleVirtualizedScroll = function () {
+      let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      const onScroll = (0, _get2.default)(_this.props.virtualized, 'onScroll');
+
+      if (typeof onScroll === 'function') {
+        onScroll(props);
+      }
+    };
+    /**
+     * @param {MouseEvent<HTMLDivElement>} e
+     */
+
+
+    this.handleVirtualizedBodyScroll = e => {
+      const {
+        handleBodyScroll
+      } = this.props;
+      const newScrollLeft = (0, _get2.default)(e, 'nativeEvent.target.scrollLeft');
+      const newScrollTop = (0, _get2.default)(e, 'nativeEvent.target.scrollTop');
+
+      if (newScrollTop === this.state.cache.virtualizedScrollTop) {
+        this.handleVirtualizedScroll({
+          horizontalScrolling: true
+        });
+      }
+
+      this.state.cache.virtualizedScrollLeft = newScrollLeft;
+      this.state.cache.virtualizedScrollTop = newScrollTop;
+
+      if (typeof handleBodyScroll === 'function') {
+        handleBodyScroll(e);
+      }
+    };
+
+    this.getVirtualizedRowWidth = () => {
+      const {
+        getCellWidths
+      } = this.context;
+      const {
+        columns
+      } = this.props;
+      const cellWidths = getCellWidths(columns);
+      const rowWidth = (0, _utils.arrayAdd)(cellWidths, 0, (0, _size2.default)(columns));
+      return rowWidth;
+    };
+
+    this.renderVirtualizedRow = options => {
+      const {
+        index,
+        style
+      } = options;
+      const {
+        virtualizedData,
+        cachedExpandBtnShouldInRow
+      } = this.state;
+      const {
+        flattenedColumns
+      } = this.context;
+      const virtualizedItem = (0, _get2.default)(virtualizedData, [index], {}); // eslint-disable-next-line @typescript-eslint/no-unused-vars
+
+      const {
+        key,
+        parentKeys,
+        expandedRow,
+        sectionRow
+      } = virtualizedItem,
+            rest = __rest(virtualizedItem, ["key", "parentKeys", "expandedRow", "sectionRow"]);
+
+      const rowWidth = this.getVirtualizedRowWidth();
+      const expandBtnShouldInRow = cachedExpandBtnShouldInRow;
+      const props = (0, _assign.default)((0, _assign.default)((0, _assign.default)((0, _assign.default)({}, this.props), {
+        style: (0, _assign.default)((0, _assign.default)({}, style), {
+          width: rowWidth
+        })
+      }), rest), {
+        columns: flattenedColumns,
+        index,
+        expandBtnShouldInRow
+      }); // eslint-disable-next-line no-nested-ternary
+
+      return sectionRow ? this.renderSectionRow(props) : expandedRow ? this.renderExpandedRow(props) : this.renderBaseRow(props);
+    }; // virtualized List innerElementType
+
+
+    this.renderTbody = /*#__PURE__*/_react.default.forwardRef(function () {
+      let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+      let ref = arguments.length > 1 ? arguments[1] : undefined;
+      return /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, props, {
+        onScroll: function () {
+          if (props.onScroll) {
+            props.onScroll(...arguments);
+          }
+        },
+        // eslint-disable-next-line react/no-this-in-sfc,react/destructuring-assignment
+        className: (0, _classnames.default)(props.className, "".concat(_this.props.prefixCls, "-tbody")),
+        style: (0, _assign.default)({}, props.style),
+        ref: ref
+      }));
+    }); // virtualized List outerElementType
+
+    this.renderOuter = /*#__PURE__*/_react.default.forwardRef((props, ref) => {
+      const {
+        children
+      } = props,
+            rest = __rest(props, ["children"]); // eslint-disable-next-line react/no-this-in-sfc
+
+
+      const {
+        handleWheel,
+        prefixCls,
+        emptySlot,
+        dataSource
+      } = this.props; // eslint-disable-next-line react/no-this-in-sfc
+
+      const tableWidth = this.getVirtualizedRowWidth();
+      const tableCls = (0, _classnames.default)("".concat(prefixCls), "".concat(prefixCls, "-fixed"));
+      return /*#__PURE__*/_react.default.createElement("div", (0, _assign.default)({}, rest, {
+        ref: ref,
+        onWheel: function () {
+          if (handleWheel) {
+            handleWheel(...arguments);
+          }
+
+          if (rest.onWheel) {
+            rest.onWheel(...arguments);
+          }
+        },
+        onScroll: function () {
+          // eslint-disable-next-line react/no-this-in-sfc
+          _this.handleVirtualizedBodyScroll(...arguments);
+
+          if (rest.onScroll) {
+            rest.onScroll(...arguments);
+          }
+        }
+      }), /*#__PURE__*/_react.default.createElement("div", {
+        style: {
+          width: tableWidth
+        },
+        className: tableCls
+      }, (0, _size2.default)(dataSource) === 0 ? emptySlot : children));
+    });
+
+    this.onItemsRendered = props => {
+      if (this.state.cache.virtualizedScrollLeft && this.ref.current) {
+        this.ref.current.scrollLeft = this.state.cache.virtualizedScrollLeft;
+      }
+    };
+
+    this.renderVirtualizedBody = direction => {
+      const {
+        scroll,
+        prefixCls,
+        virtualized,
+        anyColumnFixed,
+        columns
+      } = this.props;
+      const {
+        virtualizedData
+      } = this.state;
+      const {
+        getCellWidths
+      } = this.context;
+      const cellWidths = getCellWidths(columns);
+
+      if (!(0, _size2.default)(cellWidths)) {
+        return null;
+      }
+
+      const rawY = (0, _get2.default)(scroll, 'y');
+      const yIsNumber = typeof rawY === 'number';
+      const y = yIsNumber ? rawY : 600;
+
+      if (!yIsNumber) {
+        _utils2.logger.warn('You have to specific "scroll.y" which must be a number for table virtualization!');
+      }
+
+      const listStyle = {
+        width: '100%',
+        height: y,
+        overflowX: 'auto',
+        overflowY: 'auto'
+      };
+      const wrapCls = (0, _classnames.default)("".concat(prefixCls, "-body"));
+      return /*#__PURE__*/_react.default.createElement(_reactWindow.VariableSizeList, (0, _assign.default)({}, virtualized, {
+        initialScrollOffset: this.state.cache.virtualizedScrollTop,
+        onScroll: this.handleVirtualizedScroll,
+        onItemsRendered: this.onItemsRendered,
+        ref: this.listRef,
+        className: wrapCls,
+        outerRef: this.forwardRef,
+        height: listStyle.height,
+        width: listStyle.width,
+        itemData: virtualizedData,
+        itemSize: this.itemSize,
+        itemCount: virtualizedData.length,
+        itemKey: this.itemKey,
+        innerElementType: this.renderTbody,
+        outerElementType: this.renderOuter,
+        style: (0, _assign.default)((0, _assign.default)({}, listStyle), {
+          direction
+        }),
+        direction: direction
+      }), this.renderVirtualizedRow);
+    };
+    /**
+     * render group title
+     * @param {*} props
+     */
+
+
+    this.renderSectionRow = function () {
+      var _context;
+
+      let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+        groupKey: undefined
+      };
+      const {
+        dataSource,
+        rowKey,
+        group,
+        groupKey,
+        index
+      } = props;
+      const sectionRowPickKeys = (0, _keys.default)(_SectionRow.default.propTypes);
+      const sectionRowProps = (0, _pick2.default)(props, sectionRowPickKeys);
+      const {
+        handleRowExpanded
+      } = _this.context;
+      return /*#__PURE__*/_react.default.createElement(_SectionRow.default, (0, _assign.default)({}, sectionRowProps, {
+        record: {
+          groupKey,
+          records: (0, _map.default)(_context = [...group]).call(_context, recordKey => (0, _utils.getRecord)(dataSource, recordKey, rowKey))
+        },
+        index: index,
+        onExpand: handleRowExpanded,
+        data: dataSource,
+        key: groupKey || index
+      }));
+    };
+
+    this.renderExpandedRow = function () {
+      let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+        renderExpandIcon: () => null
+      };
+      const {
+        style,
+        components,
+        renderExpandIcon,
+        expandedRowRender,
+        record,
+        columns,
+        expanded,
+        index,
+        rowKey,
+        virtualized
+      } = props;
+      let key = (0, _utils.getRecordKey)(record, rowKey);
+
+      if (key == null) {
+        key = index;
+      }
+
+      const {
+        flattenedColumns,
+        getCellWidths
+      } = _this.context;
+      const cellWidths = getCellWidths(flattenedColumns);
+      return /*#__PURE__*/_react.default.createElement(_ExpandedRow.default, {
+        style: style,
+        components: components,
+        renderExpandIcon: renderExpandIcon,
+        expandedRowRender: expandedRowRender,
+        record: record,
+        columns: columns,
+        expanded: expanded,
+        index: index,
+        virtualized: virtualized,
+        key: (0, _utils.genExpandedRowKey)(key),
+        cellWidths: cellWidths
+      });
+    };
+    /**
+     * render grouped rows
+     * @returns {ReactNode[]} renderedRows
+     */
+
+
+    this.renderGroupedRows = () => {
+      const {
+        groups,
+        dataSource: data,
+        rowKey,
+        expandedRowKeys
+      } = this.props;
+      const {
+        flattenedColumns
+      } = this.context;
+      const groupsInData = new _map2.default();
+      const renderedRows = [];
+
+      if (groups != null && (0, _isArray.default)(data) && data.length) {
+        (0, _forEach.default)(data).call(data, record => {
+          const recordKey = (0, _utils.getRecordKey)(record, rowKey);
+          (0, _forEach.default)(groups).call(groups, (group, key) => {
+            if (group.has(recordKey)) {
+              if (!groupsInData.has(key)) {
+                groupsInData.set(key, new _set.default([]));
+              }
+
+              groupsInData.get(key).add(recordKey);
+              return false;
+            }
+
+            return undefined;
+          });
+        });
+      }
+
+      let index = -1;
+      (0, _forEach.default)(groupsInData).call(groupsInData, (group, groupKey) => {
+        // Calculate the expanded state of the group
+        const expanded = (0, _utils.isExpanded)(expandedRowKeys, groupKey); // Render the title of the group
+
+        renderedRows.push(this.renderSectionRow((0, _assign.default)((0, _assign.default)({}, this.props), {
+          columns: flattenedColumns,
+          index: ++index,
+          group,
+          groupKey,
+          expanded
+        }))); // Render the grouped content when the group is expanded
+
+        if (expanded) {
+          const dataInGroup = [];
+          (0, _forEach.default)(group).call(group, recordKey => {
+            const record = (0, _utils.getRecord)(data, recordKey, rowKey);
+
+            if (record != null) {
+              dataInGroup.push(record);
+            }
+          });
+          /**
+           * Render the contents of the group row
+           */
+
+          renderedRows.push(this.renderBodyRows(dataInGroup));
+        }
+      });
+      return renderedRows;
+    };
+
+    this.renderBody = direction => {
+      const {
+        scroll,
+        prefixCls,
+        columns,
+        components,
+        fixed,
+        handleWheel,
+        headerRef,
+        handleBodyScroll,
+        anyColumnFixed,
+        showHeader,
+        emptySlot,
+        includeHeader,
+        dataSource,
+        onScroll,
+        groups
+      } = this.props;
+      const x = (0, _get2.default)(scroll, 'x');
+      const y = (0, _get2.default)(scroll, 'y');
+      const bodyStyle = {};
+      const tableStyle = {};
+      const Table = (0, _get2.default)(components, 'body.outer', 'table');
+      const BodyWrapper = (0, _get2.default)(components, 'body.wrapper') || 'tbody';
+
+      if (y) {
+        bodyStyle.maxHeight = y;
+      }
+
+      if (x) {
+        tableStyle.width = x;
+      }
+
+      if (anyColumnFixed && (0, _size2.default)(dataSource)) {
+        // Auto is better than scroll. For example, when there is only scrollY, the scroll axis is not displayed horizontally.
+        bodyStyle.overflow = 'auto'; // Fix weird webkit render bug
+
+        bodyStyle.WebkitTransform = 'translate3d (0, 0, 0)';
+      }
+
+      const colgroup = /*#__PURE__*/_react.default.createElement(_ColGroup.default, {
+        components: (0, _get2.default)(components, 'body'),
+        columns: columns,
+        prefixCls: prefixCls
+      }); // const tableBody = this.renderBody();
+
+
+      const wrapCls = "".concat(prefixCls, "-body");
+
+      const baseTable = /*#__PURE__*/_react.default.createElement("div", {
+        key: "bodyTable",
+        className: wrapCls,
+        style: bodyStyle,
+        ref: this.forwardRef,
+        onWheel: handleWheel,
+        onScroll: handleBodyScroll
+      }, /*#__PURE__*/_react.default.createElement(Table, {
+        style: tableStyle,
+        className: (0, _classnames.default)(prefixCls, {
+          ["".concat(prefixCls, "-fixed")]: anyColumnFixed
+        })
+      }, colgroup, includeHeader && showHeader ? /*#__PURE__*/_react.default.createElement(_TableHeader.default, (0, _assign.default)({}, this.props, {
+        ref: headerRef,
+        components: components,
+        columns: columns
+      })) : null, /*#__PURE__*/_react.default.createElement(BodyWrapper, {
+        className: "".concat(prefixCls, "-tbody"),
+        onScroll: onScroll
+      }, (0, _isMap2.default)(groups) ? this.renderGroupedRows() : this.renderBodyRows(dataSource))), emptySlot);
+
+      if (fixed && columns.length) {
+        return /*#__PURE__*/_react.default.createElement("div", {
+          key: "bodyTable",
+          className: "".concat(prefixCls, "-body-outer")
+        }, baseTable);
+      }
+
+      return baseTable;
+    };
+
+    this.ref = /*#__PURE__*/_react.default.createRef();
+    this.state = {
+      virtualizedData: [],
+      cache: {
+        virtualizedScrollTop: null,
+        virtualizedScrollLeft: null
+      },
+      cachedExpandBtnShouldInRow: null,
+      cachedExpandRelatedProps: []
+    };
+    this.listRef = /*#__PURE__*/_react.default.createRef();
+    const {
+      getVirtualizedListRef
+    } = context;
+
+    if (getVirtualizedListRef) {
+      if (props.virtualized) {
+        getVirtualizedListRef(this.listRef);
+      } else {
+        console.warn('getVirtualizedListRef only works with virtualized. ' + 'See https://semi.design/zh-CN/show/table for more information.');
+      }
+    }
+
+    this.foundation = new _bodyFoundation.default(this.adapter);
+    this.observer = null;
+  }
+
+  get adapter() {
+    return (0, _assign.default)((0, _assign.default)({}, super.adapter), {
+      setVirtualizedData: (virtualizedData, cb) => this.setState({
+        virtualizedData
+      }, cb),
+      setCachedExpandBtnShouldInRow: cachedExpandBtnShouldInRow => this.setState({
+        cachedExpandBtnShouldInRow
+      }),
+      setCachedExpandRelatedProps: cachedExpandRelatedProps => this.setState({
+        cachedExpandRelatedProps
+      }),
+      observeBodyResize: bodyWrapDOM => {
+        const {
+          setBodyHasScrollbar
+        } = this.context; // Callback when the size of the body dom content changes, notifying Table.jsx whether the bodyHasScrollBar exists
+
+        const resizeCallback = () => {
+          const update = () => {
+            const {
+              offsetWidth,
+              clientWidth
+            } = bodyWrapDOM;
+            const bodyHasScrollBar = clientWidth < offsetWidth;
+            setBodyHasScrollbar(bodyHasScrollBar);
+          };
+
+          const requestAnimationFrame = window.requestAnimationFrame || _setTimeout2.default;
+          requestAnimationFrame(update);
+        }; // Monitor body dom resize
+
+
+        if (bodyWrapDOM) {
+          if ((0, _get2.default)(window, 'ResizeObserver')) {
+            if (this.observer) {
+              this.observer.unobserve(bodyWrapDOM);
+              this.observer = null;
+            }
+
+            this.observer = new ResizeObserver(resizeCallback);
+            this.observer.observe(bodyWrapDOM);
+          } else {
+            _utils2.logger.warn('The current browser does not support ResizeObserver,' + 'and the table may be misaligned after plugging and unplugging the mouse and keyboard.' + 'You can try to refresh it.');
+          }
+        }
+      },
+      unobserveBodyResize: () => {
+        const bodyWrapDOM = this.ref.current;
+
+        if (this.observer) {
+          this.observer.unobserve(bodyWrapDOM);
+          this.observer = null;
+        }
+      }
+    });
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    const {
+      virtualized,
+      dataSource,
+      expandedRowKeys,
+      columns,
+      scroll
+    } = this.props;
+
+    if (virtualized) {
+      if (prevProps.dataSource !== dataSource || prevProps.expandedRowKeys !== expandedRowKeys || prevProps.columns !== columns) {
+        this.foundation.initVirtualizedData();
+      }
+    }
+
+    const expandRelatedProps = _constants.strings.EXPAND_RELATED_PROPS;
+    const newExpandRelatedProps = (0, _map.default)(expandRelatedProps).call(expandRelatedProps, key => (0, _get2.default)(this.props, key, undefined));
+
+    if (!(0, _isEqual2.default)(newExpandRelatedProps, prevState.cachedExpandRelatedProps)) {
+      this.foundation.initExpandBtnShouldInRow(newExpandRelatedProps);
+    }
+
+    const scrollY = (0, _get2.default)(scroll, 'y');
+    const bodyWrapDOM = this.ref.current;
+
+    if (scrollY && scrollY !== (0, _get2.default)(prevProps, 'scroll.y')) {
+      this.foundation.observeBodyResize(bodyWrapDOM);
+    }
+  }
+  /**
+   * render base row
+   * @param {*} props
+   * @returns
+   */
+
+
+  renderBaseRow() {
+    let props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    const {
+      rowKey,
+      columns,
+      expandedRowKeys,
+      rowExpandable,
+      record,
+      index,
+      level,
+      expandBtnShouldInRow,
+      // effect the display of the indent span
+      selectedRowKeysSet,
+      disabledRowKeysSet,
+      expandRowByClick
+    } = props;
+    const baseRowPickKeys = (0, _keys.default)(_BaseRow.default.propTypes);
+    const baseRowProps = (0, _pick2.default)(props, baseRowPickKeys);
+    let key = (0, _utils.getRecordKey)(record, rowKey);
+
+    if (key == null) {
+      key = index;
+    }
+
+    const expanded = (0, _utils.isExpanded)(expandedRowKeys, key);
+    const expandable = rowExpandable && rowExpandable(record);
+    const expandableProps = {
+      level: undefined,
+      expanded
+    };
+
+    if (expandable || expandBtnShouldInRow) {
+      expandableProps.level = level;
+      expandableProps.expandableRow = expandable;
+
+      if (expandRowByClick) {
+        expandableProps.onRowClick = this.handleRowClick;
+      }
+    }
+
+    const selectionProps = {
+      selected: (0, _utils.isSelected)(selectedRowKeysSet, key),
+      disabled: (0, _utils.isDisabled)(disabledRowKeysSet, key)
+    };
+    const {
+      getCellWidths
+    } = this.context;
+    const cellWidths = getCellWidths(columns, null, true);
+    return /*#__PURE__*/_react.default.createElement(_BaseRow.default, (0, _assign.default)({}, baseRowProps, expandableProps, selectionProps, {
+      key: key,
+      rowKey: key,
+      cellWidths: cellWidths
+    }));
+  }
+
+  renderBodyRows() {
+    let data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+    let level = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    let renderedRows = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : [];
+    const {
+      rowKey,
+      expandedRowRender,
+      expandedRowKeys,
+      childrenRecordName,
+      rowExpandable
+    } = this.props;
+    const hasExpandedRowRender = typeof expandedRowRender === 'function';
+    const expandBtnShouldInRow = this.state.cachedExpandBtnShouldInRow;
+    const {
+      flattenedColumns
+    } = this.context;
+    (0, _each2.default)(data, (record, index) => {
+      let key = (0, _utils.getRecordKey)(record, rowKey);
+
+      if (key == null) {
+        key = index;
+      }
+
+      const recordChildren = (0, _get2.default)(record, childrenRecordName);
+      const recordHasChildren = Boolean((0, _isArray.default)(recordChildren) && recordChildren.length);
+      renderedRows.push(this.renderBaseRow((0, _assign.default)((0, _assign.default)({}, this.props), {
+        columns: flattenedColumns,
+        expandBtnShouldInRow,
+        record,
+        key,
+        level,
+        index
+      }))); // render expand row
+
+      const expanded = (0, _utils.isExpanded)(expandedRowKeys, key);
+
+      if (hasExpandedRowRender && rowExpandable && rowExpandable(record) && expanded) {
+        const currentExpandRow = this.renderExpandedRow((0, _assign.default)((0, _assign.default)({}, this.props), {
+          columns: flattenedColumns,
+          level,
+          index,
+          record,
+          expanded
+        }));
+        /**
+          * If expandedRowRender returns falsy, this expanded row will not be rendered
+          * Render an empty div before v1.19.7
+          */
+
+        if (!(0, _isNull2.default)(currentExpandRow)) {
+          renderedRows.push(currentExpandRow);
+        }
+      } // render tree data
+
+
+      if (recordHasChildren && expanded) {
+        const nestedRows = this.renderBodyRows(recordChildren, level + 1);
+        renderedRows.push(...nestedRows);
+      }
+    });
+    return renderedRows;
+  }
+
+  render() {
+    const {
+      virtualized
+    } = this.props;
+    return /*#__PURE__*/_react.default.createElement(_context2.default.Consumer, null, _ref => {
+      let {
+        direction
+      } = _ref;
+      return virtualized ? this.renderVirtualizedBody(direction) : this.renderBody(direction);
+    });
+  }
+
+}
+
+Body.contextType = _tableContext.default;
+Body.propTypes = {
+  anyColumnFixed: _propTypes.default.bool,
+  childrenRecordName: _propTypes.default.string,
+  columns: _propTypes.default.array,
+  components: _propTypes.default.object,
+  dataSource: _propTypes.default.array,
+  disabledRowKeysSet: _propTypes.default.instanceOf(_set.default).isRequired,
+  emptySlot: _propTypes.default.node,
+  expandRowByClick: _propTypes.default.bool,
+  expandedRowKeys: _propTypes.default.array,
+  expandedRowRender: _propTypes.default.func,
+  fixed: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool]),
+  forwardedRef: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func]),
+  groups: _propTypes.default.instanceOf(_map2.default),
+  handleBodyScroll: _propTypes.default.func,
+  handleWheel: _propTypes.default.func,
+  headerRef: _propTypes.default.oneOfType([_propTypes.default.object, _propTypes.default.func]),
+  includeHeader: _propTypes.default.bool,
+  onScroll: _propTypes.default.func,
+  prefixCls: _propTypes.default.string,
+  renderExpandIcon: _propTypes.default.func,
+  rowExpandable: _propTypes.default.func,
+  rowKey: _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.bool, _propTypes.default.func]),
+  scroll: _propTypes.default.object,
+  selectedRowKeysSet: _propTypes.default.instanceOf(_set.default).isRequired,
+  showHeader: _propTypes.default.bool,
+  size: _propTypes.default.string,
+  store: _propTypes.default.object,
+  virtualized: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.object])
+};
+
+var _default = /*#__PURE__*/_react.default.forwardRef(function TableBody(props, ref) {
+  return /*#__PURE__*/_react.default.createElement(Body, (0, _assign.default)({}, props, {
+    forwardedRef: ref
+  }));
+});
+
+exports.default = _default;