@semcore/data-table 16.0.0-prerelease.15 → 16.0.0-prerelease.16

package/lib/types/components/Head/Column.types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { DataTableProps, DTUse } from '../DataTable/DataTable.types';
+import { DataTableData, DataTableProps, DTUse } from '../DataTable/DataTable.types';
 import { Property } from 'csstype';
 export type CommonColumnType = {
     /**
@@ -65,11 +65,11 @@ export type DataTableColumnProps = CommonColumnType & {
     changeSortSize?: boolean;
     children?: React.ReactElement[];
 };
-export type ColumnPropsInner = {
+export type ColumnPropsInner<D extends DataTableData> = {
     use: DTUse;
     borders?: 'both' | 'left' | 'right';
-    sort?: DataTableProps['sort'];
-    onSortChange?: DataTableProps['onSortChange'];
+    sort?: DataTableProps<D>['sort'];
+    onSortChange?: DataTableProps<D>['onSortChange'];
     uid: string;
     parent?: DTColumn;
     sortableColumnDescribeId: string;

package/lib/types/components/Head/Head.types.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { DataTableProps, DTUse } from '../DataTable/DataTable.types';
+import { DataTableData, DataTableProps, DTUse } from '../DataTable/DataTable.types';
 import { DTColumn } from './Column.types';
 export type DataTableHeadProps = {
     /**
@@ -7,16 +7,20 @@ export type DataTableHeadProps = {
      * @default false
      */
     sticky?: boolean;
+    /**
+     * offset for sticky header
+     */
+    top?: number;
     /** Enable scroll bar element in header */
     withScrollBar?: boolean;
 };
-export type HeadPropsInner = {
+export type HeadPropsInner<D extends DataTableData> = {
     use: DTUse;
     tableRef: React.RefObject<HTMLElement>;
     columns: DTColumn[];
     compact: boolean;
-    sort?: DataTableProps['sort'];
-    onSortChange?: DataTableProps['onSortChange'];
+    sort?: DataTableProps<D>['sort'];
+    onSortChange?: DataTableProps<D>['onSortChange'];
     getI18nText: (key: string) => string;
     uid: string;
     ref: React.RefObject<HTMLDivElement>;

package/lib/types/index.d.ts

@@ -1,4 +1,10 @@
-import { DataTable, ACCORDION } from './components/DataTable/DataTable';
-export { default } from './DataTable';
-export * from './DataTable';
-export { DataTable, ACCORDION };
+import { DataTable, ACCORDION, ROW_GROUP } from './components/DataTable/DataTable';
+import type { DataTableSort, DataTableType, DTKey } from './components/DataTable/DataTable.types';
+import { Intergalactic } from '@semcore/core';
+import React from 'react';
+declare const wrapDataTable: <PropsExtending extends {}>(wrapper: (props: Intergalactic.InternalTypings.EfficientOmit<Intergalactic.InternalTypings.ComponentPropsNesting<DataTableType>, "tag" | "ref"> & {
+    ref: React.Ref<any>;
+    tag: Intergalactic.InternalTypings.ComponentTag;
+} & PropsExtending) => React.ReactNode) => DataTableType;
+export { DataTable, ACCORDION, ROW_GROUP, wrapDataTable };
+export type { DataTableSort, DTKey };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/data-table",
   "description": "Semrush DataTable Component",
-  "version": "16.0.0-prerelease.15",
+  "version": "16.0.0-prerelease.16",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -14,10 +14,11 @@
     "types": "./lib/types/index.d.ts"
   },
   "dependencies": {
-    "@semcore/icon": "16.0.0-prerelease.15",
-    "@semcore/button": "16.0.0-prerelease.15",
-    "@semcore/flex-box": "16.0.0-prerelease.15",
-    "@semcore/scroll-area": "16.0.0-prerelease.15"
+    "@semcore/icon": "16.0.0-prerelease.16",
+    "@semcore/button": "16.0.0-prerelease.16",
+    "@semcore/flex-box": "16.0.0-prerelease.16",
+    "@semcore/scroll-area": "16.0.0-prerelease.16",
+    "@semcore/spin": "16.0.0-prerelease.16"
   },
   "devDependencies": {
     "@types/react": "18.0.21",
@@ -37,7 +38,7 @@
     "csstype": "3.0.8"
   },
   "peerDependencies": {
-    "@semcore/base-components": "^16.0.0-prerelease.15"
+    "@semcore/base-components": "^16.0.0-prerelease.16"
   },
   "repository": {
     "type": "git",

package/lib/esm/Body.mjs

@@ -1,428 +0,0 @@
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
-import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _typeof from "@babel/runtime/helpers/esm/typeof";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled, assignProps as assignProps$1, Component } from "@semcore/core";
-import React__default from "react";
-import { Flex, Box } from "@semcore/flex-box";
-import ScrollArea, { hideScrollBarsFromScreenReadersContext } from "@semcore/scroll-area";
-import { getFixedStyle, getScrollOffsetValue } from "./utils.mjs";
-import assignProps, { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
-import trottle from "@semcore/core/lib/utils/rafTrottle";
-import { forkRef } from "@semcore/core/lib/utils/ref";
-import canUseDOM from "@semcore/core/lib/utils/canUseDOM";
-import { SORT_ICON_WIDTH } from "./Head.mjs";
-import { getFocusableIn } from "@semcore/core/lib/utils/focus-lock/getFocusableIn";
-var _excluded = ["childrenPropsGetter"], _excluded2 = ["childrenPropsGetter"];
-var scrollStyles = (
-  /*__reshadow_css_start__*/
-  (sstyled.insert(
-    /*__inner_css_start__*/
-    ".___SScrollArea_1765z_gg_{width:-moz-fit-content;width:fit-content}.___SShadowHorizontal_1765z_gg_:after,.___SShadowHorizontal_1765z_gg_:before,.___SShadowVertical_1765z_gg_:after,.___SShadowVertical_1765z_gg_:before{z-index:1}",
-    "1765z_gg_"
-  ), {
-    "__SScrollArea": "___SScrollArea_1765z_gg_",
-    "__SShadowHorizontal": "___SShadowHorizontal_1765z_gg_",
-    "__SShadowVertical": "___SShadowVertical_1765z_gg_"
-  })
-);
-var testEnv = process.env.NODE_ENV === "test";
-var getCellsByColumn = function getCellsByColumn2(cells) {
-  var flattenCells = cells.flat(20);
-  return Object.fromEntries(flattenCells.map(function(cell) {
-    return [cell.name, cell.data];
-  }));
-};
-var displayContents = {
-  display: "contents"
-};
-var Body = /* @__PURE__ */ function(_Component) {
-  _inherits(Body2, _Component);
-  var _super = _createSuper(Body2);
-  function Body2() {
-    var _this;
-    _classCallCheck(this, Body2);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "state", {
-      rowHeight: void 0,
-      scrollAreaHeight: void 0,
-      scrollOffset: 0
-    });
-    _defineProperty(_assertThisInitialized(_this), "scrollContainerRef", /* @__PURE__ */ React__default.createRef());
-    _defineProperty(_assertThisInitialized(_this), "firstRowRef", /* @__PURE__ */ React__default.createRef());
-    _defineProperty(_assertThisInitialized(_this), "firstRowResizeObserver", null);
-    _defineProperty(_assertThisInitialized(_this), "lockedCell", [null, false]);
-    _defineProperty(_assertThisInitialized(_this), "getRowHeight", function() {
-      var virtualScroll = _this.asProps.virtualScroll;
-      var rowHeightFromProps = _typeof(virtualScroll) === "object" && (virtualScroll === null || virtualScroll === void 0 ? void 0 : virtualScroll.rowHeight);
-      return rowHeightFromProps || _this.state.rowHeight;
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function(e) {
-      if (e.currentTarget === _this.lockedCell[0]) {
-        var focusableChildren = Array.from(_this.lockedCell[0].children).flatMap(function(node) {
-          return getFocusableIn(node);
-        });
-        if (_this.lockedCell[1]) {
-          if (e.key === "Escape") {
-            var _this$lockedCell$;
-            (_this$lockedCell$ = _this.lockedCell[0]) === null || _this$lockedCell$ === void 0 ? void 0 : _this$lockedCell$.focus();
-            _this.lockedCell[1] = false;
-          }
-          if (e.key.startsWith("Arrow")) {
-            e.stopPropagation();
-            e.preventDefault();
-          }
-          if (e.key === "Tab") {
-            if (e.target === focusableChildren[0] && e.shiftKey) {
-              var _focusableChildren;
-              (_focusableChildren = focusableChildren[focusableChildren.length - 1]) === null || _focusableChildren === void 0 ? void 0 : _focusableChildren.focus();
-              e.preventDefault();
-            } else if (e.target === focusableChildren[focusableChildren.length - 1] && !e.shiftKey) {
-              var _focusableChildren$;
-              (_focusableChildren$ = focusableChildren[0]) === null || _focusableChildren$ === void 0 ? void 0 : _focusableChildren$.focus();
-              e.preventDefault();
-            }
-            e.stopPropagation();
-          }
-        } else if (e.key === "Enter") {
-          var _focusableChildren$2;
-          e.preventDefault();
-          e.stopPropagation();
-          _this.lockedCell[1] = true;
-          (_focusableChildren$2 = focusableChildren[0]) === null || _focusableChildren$2 === void 0 ? void 0 : _focusableChildren$2.focus();
-        }
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "onFocusCell", function(e) {
-      if (e.target === e.currentTarget && e.target.matches(":focus-visible")) {
-        var focusableChildren = Array.from(e.currentTarget.children).flatMap(function(node) {
-          return getFocusableIn(node);
-        });
-        if (focusableChildren.length === 1) {
-          focusableChildren[0].focus();
-        } else if (focusableChildren.length > 1) {
-          _this.lockedCell = [e.currentTarget, false];
-        }
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleFirstRowResize", trottle(function(entries) {
-      var contentRect = entries[0].contentRect;
-      var height = contentRect.height;
-      _this.setState(function(oldState) {
-        if (oldState.rowHeight === height) return oldState;
-        return {
-          rowHeight: height
-        };
-      });
-    }));
-    _defineProperty(_assertThisInitialized(_this), "handleScrollAreaResize", trottle(function(entries) {
-      var virtualScroll = _this.asProps.virtualScroll;
-      if (!virtualScroll) return;
-      var contentRect = entries[0].contentRect;
-      var height = contentRect.height;
-      _this.setState(function(oldState) {
-        if (oldState.scrollAreaHeight === height) return oldState;
-        return {
-          scrollAreaHeight: height
-        };
-      });
-    }));
-    _defineProperty(_assertThisInitialized(_this), "handleScrollAreaScroll", function(event) {
-      var _ref6 = event.target, scrollTop = _ref6.scrollTop;
-      var virtualScroll = _this.asProps.virtualScroll;
-      if (virtualScroll) {
-        _this.setState(function(oldState) {
-          if (oldState.scrollOffset === scrollTop) return oldState;
-          return {
-            scrollOffset: scrollTop
-          };
-        });
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "setupRowSizeObserver", function() {
-      if (!_this.firstRowRef.current) return;
-      if (!_this.asProps.virtualScroll) return;
-      if (canUseDOM()) {
-        _this.firstRowResizeObserver = new ResizeObserver(_this.handleFirstRowResize);
-        _this.firstRowResizeObserver.observe(_this.firstRowRef.current);
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "handleBodyTransitionEnd", trottle(function() {
-      _this.forceUpdate();
-    }));
-    return _this;
-  }
-  _createClass(Body2, [{
-    key: "renderCells",
-    value: function renderCells(cells, rowData, dataIndex) {
-      var _this2 = this;
-      var SCell = Flex;
-      var _this$asProps = this.asProps, styles = _this$asProps.styles, columns = _this$asProps.columns, use = _this$asProps.use, uid = _this$asProps.uid;
-      return cells.map(function(cell, cellIndex) {
-        if (Array.isArray(cell)) {
-          var _ref2;
-          var SGroupCell = "div";
-          return _ref2 = sstyled(styles), /* @__PURE__ */ React__default.createElement(SGroupCell, _ref2.cn("SGroupCell", {
-            "key": "".concat(cellIndex),
-            "data-ui-name": "group-cell"
-          }), _this2.renderRows(cell, true));
-        } else {
-          var _ref3, _column$parentColumns, _column$props, _column$props$ref$cur, _column$props2, _column$props2$ref$cu, _column$props3, _column$props4;
-          var nameParts = cell.name.split("/");
-          var firstName = nameParts[0];
-          var lastName = nameParts[nameParts.length - 1];
-          var firstColumn = columns.find(function(c) {
-            return c.name === firstName;
-          });
-          var lastColumn = columns.find(function(c) {
-            return c.name === lastName;
-          });
-          var column = columns.find(function(c) {
-            return c.name === cell.name;
-          });
-          var _getFixedStyle = getFixedStyle(cell, columns), _getFixedStyle2 = _slicedToArray(_getFixedStyle, 2), name = _getFixedStyle2[0], value = _getFixedStyle2[1];
-          var parentColumnNames = (_column$parentColumns = column === null || column === void 0 ? void 0 : column.parentColumns.map(function(column2) {
-            return column2.name;
-          })) !== null && _column$parentColumns !== void 0 ? _column$parentColumns : [];
-          var vars = (Array.isArray(cell.cssVar) ? cell.cssVar : [cell.cssVar]).map(function(name2) {
-            return "var(".concat(name2, ")");
-          });
-          var columnWMin = column === null || column === void 0 ? void 0 : (_column$props = column.props) === null || _column$props === void 0 ? void 0 : (_column$props$ref$cur = _column$props.ref.current) === null || _column$props$ref$cur === void 0 ? void 0 : _column$props$ref$cur.style.getPropertyValue("min-width");
-          var columnWMax = column === null || column === void 0 ? void 0 : (_column$props2 = column.props) === null || _column$props2 === void 0 ? void 0 : (_column$props2$ref$cu = _column$props2.ref.current) === null || _column$props2$ref$cu === void 0 ? void 0 : _column$props2$ref$cu.style.getPropertyValue("max-width");
-          var _props = {
-            name: cell.name,
-            children: /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, cell.data),
-            justifyContent: column === null || column === void 0 ? void 0 : (_column$props3 = column.props) === null || _column$props3 === void 0 ? void 0 : _column$props3.justifyContent,
-            alignItems: column === null || column === void 0 ? void 0 : (_column$props4 = column.props) === null || _column$props4 === void 0 ? void 0 : _column$props4.alignItems,
-            borderLeft: firstColumn === null || firstColumn === void 0 ? void 0 : firstColumn.borderLeft,
-            borderRight: lastColumn === null || lastColumn === void 0 ? void 0 : lastColumn.borderRight,
-            style: {
-              width: vars.length === 1 ? vars[0] : "calc(".concat(vars.join(" + "), ")"),
-              minWidth: columnWMin,
-              maxWidth: columnWMax && column !== null && column !== void 0 && column.sortable ? "calc(".concat(SORT_ICON_WIDTH, "px + ").concat(columnWMax, ")") : columnWMax
-            }
-          };
-          if (name !== void 0 && value !== void 0) {
-            _props.style[name] = value;
-          }
-          var _iterator = _createForOfIteratorHelper(cell.cellPropsLayers || []), _step;
-          try {
-            for (_iterator.s(); !(_step = _iterator.n()).done; ) {
-              var cellPropLayer = _step.value;
-              var _cellPropLayer$childr = cellPropLayer.childrenPropsGetter, childrenPropsGetter = _cellPropLayer$childr === void 0 ? function(p) {
-                return p;
-              } : _cellPropLayer$childr, other = _objectWithoutProperties(cellPropLayer, _excluded);
-              var propsCell = assignProps(other, _props);
-              _props = assignProps(childrenPropsGetter(propsCell, rowData, dataIndex), propsCell);
-            }
-          } catch (err) {
-            _iterator.e(err);
-          } finally {
-            _iterator.f();
-          }
-          var headerIds = [cell.name].concat(_toConsumableArray(parentColumnNames)).filter(Boolean).map(function(name2) {
-            return "igc-table-".concat(uid, "-").concat(name2);
-          });
-          var ariaColspan = nameParts.length;
-          return _ref3 = sstyled(styles), /* @__PURE__ */ React__default.createElement(SCell, _ref3.cn("SCell", _objectSpread(_objectSpread({
-            "key": cell.name,
-            "role": "gridcell",
-            "headers": headerIds.join(" "),
-            "__excludeProps": ["data"]
-          }, _props), {}, {
-            "fixed": cell.fixed,
-            "theme": _props.theme,
-            "use": use,
-            "borderLeft": _props.borderLeft,
-            "borderRight": _props.borderRight,
-            "tabIndex": -1,
-            "onKeyDown": _this2.handleKeyDown,
-            "onFocus": _this2.onFocusCell,
-            "aria-colindex": cellIndex + 1,
-            "aria-colspan": ariaColspan === 1 ? void 0 : ariaColspan,
-            "innerOutline": true
-          })));
-        }
-      }, []);
-    }
-  }, {
-    key: "renderRow",
-    value: function renderRow(cells, _ref7) {
-      var _ref4;
-      var dataIndex = _ref7.dataIndex, topOffset = _ref7.topOffset, _ref7$nested = _ref7.nested, nested = _ref7$nested === void 0 ? false : _ref7$nested;
-      var SRow = Box;
-      var _this$asProps2 = this.asProps, styles = _this$asProps2.styles, rowPropsLayers = _this$asProps2.rowPropsLayers, uniqueKey = _this$asProps2.uniqueKey, virtualScroll = _this$asProps2.virtualScroll;
-      var rowHeightFromProps = _typeof(virtualScroll) === "object" && (virtualScroll === null || virtualScroll === void 0 ? void 0 : virtualScroll.rowHeight);
-      var rowData = cells.flatRowData || getCellsByColumn(cells);
-      var key = rowData[uniqueKey] ? String(rowData[uniqueKey]) : "row_".concat(dataIndex);
-      var needToMeasureHeight = dataIndex === 0 && !rowHeightFromProps;
-      var props = {
-        children: this.renderCells(cells, rowData, dataIndex),
-        theme: void 0,
-        active: void 0,
-        positioned: topOffset !== void 0,
-        top: topOffset,
-        ref: needToMeasureHeight ? this.firstRowRef : void 0,
-        key,
-        "aria-rowindex": !nested ? dataIndex + 2 : void 0
-      };
-      var _iterator2 = _createForOfIteratorHelper(rowPropsLayers), _step2;
-      try {
-        for (_iterator2.s(); !(_step2 = _iterator2.n()).done; ) {
-          var rowPropsLayer = _step2.value;
-          var _rowPropsLayer$childr = rowPropsLayer.childrenPropsGetter, childrenPropsGetter = _rowPropsLayer$childr === void 0 ? function(p) {
-            return p;
-          } : _rowPropsLayer$childr, other = _objectWithoutProperties(rowPropsLayer, _excluded2);
-          var propsRow = assignProps(other, props);
-          props = assignProps(childrenPropsGetter(propsRow, rowData, dataIndex), propsRow);
-        }
-      } catch (err) {
-        _iterator2.e(err);
-      } finally {
-        _iterator2.f();
-      }
-      return _ref4 = sstyled(styles), /* @__PURE__ */ React__default.createElement(SRow, _ref4.cn("SRow", _objectSpread({
-        "data-nested": nested.toString(),
-        "role": !nested ? "row" : void 0,
-        "__excludeProps": ["data"]
-      }, props)));
-    }
-  }, {
-    key: "renderRows",
-    value: function renderRows(rows) {
-      var _this3 = this;
-      var nested = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
-      return rows.map(function(cells, dataIndex) {
-        return _this3.renderRow(cells, {
-          dataIndex,
-          nested
-        });
-      });
-    }
-  }, {
-    key: "renderVirtualizedRows",
-    value: function renderVirtualizedRows(rows) {
-      var _ref8, _this4 = this;
-      if (rows.length === 0) return [];
-      var virtualScroll = this.asProps.virtualScroll;
-      var _this$state = this.state, scrollOffset = _this$state.scrollOffset, scrollAreaHeight = _this$state.scrollAreaHeight;
-      var rowHeight = this.getRowHeight();
-      var tollerance = (_ref8 = _typeof(virtualScroll) === "object" ? virtualScroll === null || virtualScroll === void 0 ? void 0 : virtualScroll.tollerance : 2) !== null && _ref8 !== void 0 ? _ref8 : 2;
-      var startIndex = Math.max(Math.floor(scrollOffset / rowHeight) - tollerance, 0);
-      var lastIndex = Math.min(Math.ceil((scrollOffset + scrollAreaHeight) / rowHeight) + tollerance, rows.length);
-      var rowHeightFromProps = _typeof(virtualScroll) === "object" && (virtualScroll === null || virtualScroll === void 0 ? void 0 : virtualScroll.rowHeight);
-      var needToMeasureFirstRowHeight = !rowHeightFromProps;
-      var firstRow = {
-        cells: rows[0],
-        dataIndex: 0,
-        topOffset: 0
-      };
-      var visibleRows = rowHeight !== void 0 ? rows.slice(startIndex, lastIndex) : [];
-      var processedVisibleRows = visibleRows.map(function(cells, index) {
-        return {
-          cells,
-          dataIndex: startIndex + index,
-          topOffset: rowHeight * (startIndex + index)
-        };
-      });
-      if (needToMeasureFirstRowHeight && startIndex !== 0) {
-        processedVisibleRows.unshift(firstRow);
-      }
-      return processedVisibleRows.map(function(_ref9) {
-        var cells = _ref9.cells, dataIndex = _ref9.dataIndex, topOffset = _ref9.topOffset;
-        return _this4.renderRow(cells, {
-          dataIndex,
-          topOffset,
-          nested: false
-        });
-      });
-    }
-  }, {
-    key: "componentWillUnmount",
-    value: function componentWillUnmount() {
-      var _this$firstRowResizeO;
-      (_this$firstRowResizeO = this.firstRowResizeObserver) === null || _this$firstRowResizeO === void 0 ? void 0 : _this$firstRowResizeO.disconnect();
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps, _ref5;
-      var SBody = Box;
-      var SBodyWrapper = Box;
-      var SHeightHold = Box;
-      var _this$asProps3 = this.asProps, Children = _this$asProps3.Children, styles = _this$asProps3.styles, rows = _this$asProps3.rows, columns = _this$asProps3.columns, $scrollRef = _this$asProps3.$scrollRef, virtualScroll = _this$asProps3.virtualScroll, onResize = _this$asProps3.onResize, onScroll = _this$asProps3.onScroll, disabledScroll = _this$asProps3.disabledScroll, renderRows = _this$asProps3.renderRows, animationsDisabled = _this$asProps3.animationsDisabled, scrollContainerRef = _this$asProps3.scrollContainerRef;
-      var columnsInitialized = columns.reduce(function(sum, _ref10) {
-        var width = _ref10.width;
-        return sum + width;
-      }, 0) > 0 || testEnv;
-      var _getScrollOffsetValue = getScrollOffsetValue(columns), _getScrollOffsetValue2 = _slicedToArray(_getScrollOffsetValue, 2), offsetLeftSum = _getScrollOffsetValue2[0], offsetRightSum = _getScrollOffsetValue2[1];
-      var rowHeight = this.getRowHeight();
-      var holdHeight = rowHeight !== void 0 && virtualScroll ? rowHeight * rows.length : void 0;
-      if (virtualScroll && columnsInitialized && !rowHeight) {
-        requestAnimationFrame(this.setupRowSizeObserver);
-      }
-      var body = (_ref5 = sstyled(styles), /* @__PURE__ */ React__default.createElement(SBody, _ref5.cn("SBody", _objectSpread({}, assignProps$1({
-        "animationsDisabled": animationsDisabled,
-        "onTransitionEnd": this.handleBodyTransitionEnd
-      }, _ref))), renderRows ? renderRows({
-        rows,
-        columns,
-        renderRow: this.renderRow.bind(this)
-      }) || null : /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, holdHeight ? /* @__PURE__ */ React__default.createElement(SHeightHold, _ref5.cn("SHeightHold", {
-        "hMin": holdHeight,
-        "aria-hidden": true
-      })) : null, virtualScroll ? this.renderVirtualizedRows(rows) : this.renderRows(rows))));
-      if (disabledScroll) {
-        return /* @__PURE__ */ React__default.createElement(SBodyWrapper, null, body);
-      }
-      var scrollContainerRefs = [$scrollRef, this.scrollContainerRef];
-      if (scrollContainerRef) {
-        scrollContainerRefs.push(scrollContainerRef);
-      }
-      return /* @__PURE__ */ React__default.createElement(hideScrollBarsFromScreenReadersContext.Provider, {
-        value: true
-      }, /* @__PURE__ */ React__default.createElement(SBodyWrapper, _ref5.cn("SBodyWrapper", {}), /* @__PURE__ */ React__default.createElement(ScrollArea, _ref5.cn("ScrollArea", {
-        "shadow": true,
-        "leftOffset": offsetLeftSum,
-        "rightOffset": offsetRightSum,
-        "onResize": callAllEventHandlers(onResize, this.handleScrollAreaResize),
-        "onScroll": callAllEventHandlers(onScroll, this.handleScrollAreaScroll),
-        "styles": scrollStyles
-      }), /* @__PURE__ */ React__default.createElement(ScrollArea.Container, {
-        ref: forkRef.apply(void 0, scrollContainerRefs),
-        role: "rowgroup",
-        focusRingTopOffset: "3px",
-        tabIndex: -1
-      }, body), /* @__PURE__ */ React__default.createElement("div", _ref5.cn("div", {
-        "style": displayContents
-      }), /* @__PURE__ */ React__default.createElement("div", _ref5.cn("div", {
-        "style": displayContents
-      }), /* @__PURE__ */ React__default.createElement("div", _ref5.cn("div", {
-        "style": displayContents
-      }), /* @__PURE__ */ React__default.createElement(ScrollArea.Bar, {
-        orientation: "horizontal",
-        bottom: 0,
-        container: this.scrollContainerRef
-      }), /* @__PURE__ */ React__default.createElement(ScrollArea.Bar, {
-        orientation: "vertical",
-        w: "12px",
-        zIndex: 2
-      }))))), Children.origin));
-    }
-  }]);
-  return Body2;
-}(Component);
-export {
-  Body as default
-};