@semcore/data-table 4.51.0-prerelease.0 → 4.51.0-prerelease.1

package/lib/cjs/translations/pl.json

@@ -1,8 +1,3 @@
 {
-  "sortableColumn": "Umożliwia sortowanie",
-  "DataTable.Cell.AccordionToggle.expand:aria-label": "Pokaż szczegóły",
-  "DataTable.Cell.AccordionToggle.collapse:aria-label": "Ukryj szczegóły",
-  "DataTable.Header.selectAllCheckbox:aria-label": "Wszystkie przedmioty",
-  "DataTable.allItemsSelected:aria-live": "Wszystkie przedmioty wybrane",
-  "DataTable.allItemsDeselected:aria-live": "Wszystkie przedmioty odznaczone"
+  "sortableColumn": "Umożliwia sortowanie"
 }

package/lib/cjs/translations/pt.json

@@ -1,8 +1,3 @@
 {
-  "sortableColumn": "Classificável",
-  "DataTable.Cell.AccordionToggle.expand:aria-label": "Exibir detalhes",
-  "DataTable.Cell.AccordionToggle.collapse:aria-label": "Ocultar detalhes",
-  "DataTable.Header.selectAllCheckbox:aria-label": "Todos os itens",
-  "DataTable.allItemsSelected:aria-live": "Todos os itens selecionados",
-  "DataTable.allItemsDeselected:aria-live": "Todos os itens desmarcados"
+  "sortableColumn": "Classificável"
 }

package/lib/cjs/translations/sv.json

@@ -1,8 +1,3 @@
 {
-  "sortableColumn": "Sorterbar",
-  "DataTable.Cell.AccordionToggle.expand:aria-label": "Visa detaljer",
-  "DataTable.Cell.AccordionToggle.collapse:aria-label": "Dölj detaljer",
-  "DataTable.Header.selectAllCheckbox:aria-label": "Alla objekt",
-  "DataTable.allItemsSelected:aria-live": "Alla objekt valda",
-  "DataTable.allItemsDeselected:aria-live": "Alla objekt avmarkerade"
+  "sortableColumn": "Sorterbar"
 }

package/lib/cjs/translations/tr.json

@@ -1,8 +1,3 @@
 {
-  "sortableColumn": "Sıralanabilir",
-  "DataTable.Cell.AccordionToggle.expand:aria-label": "Detayları göster",
-  "DataTable.Cell.AccordionToggle.collapse:aria-label": "Detayları gizle",
-  "DataTable.Header.selectAllCheckbox:aria-label": "Tüm öğeler",
-  "DataTable.allItemsSelected:aria-live": "Tüm öğeler seçildi",
-  "DataTable.allItemsDeselected:aria-live": "Tüm öğeler seçilmedi"
+  "sortableColumn": "Sıralanabilir"
 }

package/lib/cjs/translations/vi.json

@@ -1,8 +1,3 @@
 {
-  "sortableColumn": "Có thể sắp xếp",
-  "DataTable.Cell.AccordionToggle.expand:aria-label": "Hiển thị chi tiết",
-  "DataTable.Cell.AccordionToggle.collapse:aria-label": "Ẩn bớt",
-  "DataTable.Header.selectAllCheckbox:aria-label": "Tất cả các mục",
-  "DataTable.allItemsSelected:aria-live": "Tất cả các mục đã được chọn",
-  "DataTable.allItemsDeselected:aria-live": "Tất cả các mục đã được bỏ chọn"
+  "sortableColumn": "Có thể sắp xếp"
 }

package/lib/cjs/translations/zh.json

@@ -1,8 +1,3 @@
 {
-  "sortableColumn": "可排序",
-  "DataTable.Cell.AccordionToggle.expand:aria-label": "显示详细信息",
-  "DataTable.Cell.AccordionToggle.collapse:aria-label": "隐藏详细信息",
-  "DataTable.Header.selectAllCheckbox:aria-label": "所有项目",
-  "DataTable.allItemsSelected:aria-live": "所有项目已选择",
-  "DataTable.allItemsDeselected:aria-live": "所有项目已取消选择"
+  "sortableColumn": "可排序"
 }

package/lib/cjs/types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+var _DataTable = require("./DataTable");
+//# sourceMappingURL=types.js.map

package/lib/cjs/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":["_DataTable","require"],"sources":["../../src/types.ts"],"sourcesContent":["import React from 'react';\nimport { ROW_GROUP } from './DataTable';\nimport { Property } from 'csstype';\nimport { FlexProps } from '@semcore/flex-box';\n\nexport type PseudoChildPropsGetter = (\n  props: { [propName: string]: unknown },\n  rowData: { [columnName: string]: unknown },\n  index: number,\n) => { [propName: string]: unknown };\nexport type PropsLayer = {\n  childrenPropsGetter?: PseudoChildPropsGetter;\n  [propName: string]: unknown;\n};\n\nexport type SortDirection = 'asc' | 'desc';\nexport type Column<\n  Props extends { [propName: string]: unknown } = { [propName: string]: unknown },\n> = {\n  name: string;\n  active: boolean;\n  width: number;\n  fixed?: 'left' | 'right';\n  resizable?: boolean;\n  sortable?: boolean | SortDirection;\n  sortDirection: SortDirection;\n  varWidth: string;\n  setVar: boolean;\n  data?: unknown;\n  vBorders?: boolean;\n  borderLeft?: boolean;\n  borderRight?: boolean;\n  props: {\n    name: string;\n    ref: React.RefObject<HTMLElement>;\n  } & FlexProps &\n    Partial<{\n      flex: Property.Flex;\n      onClick: (event: React.MouseEvent) => void;\n      onKeyDown: (event: React.KeyboardEvent) => void;\n      forwardRef: React.Ref<HTMLElement>;\n      style: React.CSSProperties;\n      fixed: 'left' | 'right';\n      resizable: boolean;\n      sortable: boolean | SortDirection;\n      sortDirection: SortDirection;\n      vBorders: boolean;\n      borderLeft: Property.BorderLeft;\n      borderRight: Property.BorderLeft;\n      changeSortSize?: boolean;\n      sortSizeRecalculation?: boolean;\n    }> &\n    Props;\n  columns: Column[];\n  parentColumns: Column[];\n};\nexport type Cell = Pick<Column, 'name' | 'fixed' | 'data'> & {\n  cssVar: string | string[];\n  cellPropsLayers: PropsLayer[];\n};\nexport type RowData<\n  Data extends { [columnName: string]: unknown } = { [columnName: string]: unknown },\n> = Data &\n  Partial<{\n    name: string;\n    [ROW_GROUP]: RowData[];\n  }>;\nexport type NestedCells = (Cell | NestedCells)[] & { flatRowData?: RowData };\n\nexport type RowIndex = number;\nexport type ColIndex = number;\n"],"mappings":";;AACA,IAAAA,UAAA,GAAAC,OAAA"}

package/lib/cjs/utils.js

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getScrollOffsetValue = exports.getFixedStyle = exports.flattenColumns = void 0;
+var getScrollOffsetValue = function getScrollOffsetValue(columns) {
+  return columns.reduce(function (acc, column) {
+    if (column.fixed === 'left') {
+      acc[0] += column.width;
+    }
+    if (column.fixed === 'right') {
+      acc[1] += column.width;
+    }
+    return acc;
+  }, [0, 0]);
+};
+exports.getScrollOffsetValue = getScrollOffsetValue;
+var flattenColumns = function flattenColumns(columns) {
+  return columns.reduce(function (acc, column) {
+    var hasNestedColumns = 'columns' in column && column.columns.length > 0;
+    var columns = hasNestedColumns ? flattenColumns(column.columns) : [column];
+    acc = acc.concat(columns);
+    return acc;
+  }, []);
+};
+exports.flattenColumns = flattenColumns;
+var getFixedStyle = function getFixedStyle(cell, columns) {
+  var side = cell.fixed;
+  if (!side) return [undefined, undefined];
+  var names = cell.name.split('/');
+  var nameSideMap = {
+    left: names[0],
+    right: names[names.length - 1]
+  };
+  var name = nameSideMap[side];
+  var index = columns.findIndex(function (column) {
+    return column.name === name;
+  });
+  if (index === -1) return [undefined, undefined];
+  var startIndexSideMap = {
+    left: 0,
+    right: index + 1
+  };
+  var endIndexSideMap = {
+    left: index,
+    right: columns.length
+  };
+  var columnsFixed = columns.slice(startIndexSideMap[side], endIndexSideMap[side]);
+  if (columnsFixed.length < 1) return [side, 0];
+  var vars = columnsFixed.map(function (column) {
+    return "var(--".concat(column.name, "_width)");
+  });
+  return [side, vars.length === 1 ? vars[0] : "calc(".concat(vars.join(' + '), ")")];
+};
+exports.getFixedStyle = getFixedStyle;
+//# sourceMappingURL=utils.js.map

package/lib/cjs/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":["getScrollOffsetValue","columns","reduce","acc","column","fixed","width","exports","flattenColumns","hasNestedColumns","length","concat","getFixedStyle","cell","side","undefined","names","name","split","nameSideMap","left","right","index","findIndex","startIndexSideMap","endIndexSideMap","columnsFixed","slice","vars","map","join"],"sources":["../../src/utils.ts"],"sourcesContent":["import type { Column } from './types';\n\nexport const getScrollOffsetValue = (columns: Column[]) =>\n  columns.reduce(\n    (acc, column) => {\n      if (column.fixed === 'left') {\n        acc[0] += column.width;\n      }\n      if (column.fixed === 'right') {\n        acc[1] += column.width;\n      }\n      return acc;\n    },\n    [0, 0] as [leftOffset: number, rightOffset: number],\n  );\n\nexport const flattenColumns = (columns: Column[]) =>\n  columns.reduce((acc, column) => {\n    const hasNestedColumns = 'columns' in column && column.columns.length > 0;\n    const columns: Column[] = hasNestedColumns ? flattenColumns(column.columns) : [column];\n    acc = acc.concat(columns);\n    return acc;\n  }, [] as Column[]);\n\nexport const getFixedStyle = (\n  cell: Pick<Column, 'name' | 'fixed'>,\n  columns: Column[],\n): [side: 'left' | 'right', style: string | number] | [side: undefined, style: undefined] => {\n  const side = cell.fixed;\n  if (!side) return [undefined, undefined];\n  const names = cell.name.split('/');\n  const nameSideMap = {\n    left: names[0],\n    right: names[names.length - 1],\n  };\n  const name = nameSideMap[side];\n  const index = columns.findIndex((column) => column.name === name);\n\n  if (index === -1) return [undefined, undefined];\n\n  const startIndexSideMap = {\n    left: 0,\n    right: index + 1,\n  };\n  const endIndexSideMap = {\n    left: index,\n    right: columns.length,\n  };\n  const columnsFixed = columns.slice(startIndexSideMap[side], endIndexSideMap[side]);\n\n  if (columnsFixed.length < 1) return [side, 0];\n\n  const vars = columnsFixed.map((column) => `var(--${column.name}_width)`);\n  return [side, vars.length === 1 ? vars[0] : `calc(${vars.join(' + ')})`];\n};\n"],"mappings":"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"}

package/lib/es6/Body.js

@@ -0,0 +1,469 @@
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
+import _objectSpread from "@babel/runtime/helpers/objectSpread2";
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _createForOfIteratorHelper from "@babel/runtime/helpers/createForOfIteratorHelper";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _typeof from "@babel/runtime/helpers/typeof";
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _createClass from "@babel/runtime/helpers/createClass";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _inherits from "@babel/runtime/helpers/inherits";
+import _createSuper from "@babel/runtime/helpers/createSuper";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import { sstyled as _sstyled } from "@semcore/utils/lib/core/index";
+import { assignProps as _assignProps } from "@semcore/core";
+var _excluded = ["childrenPropsGetter"],
+  _excluded2 = ["childrenPropsGetter"];
+import React from 'react';
+import { Component, sstyled, Root } from '@semcore/core';
+import { Box, Flex } from '@semcore/flex-box';
+import ScrollArea, { hideScrollBarsFromScreenReadersContext } from '@semcore/scroll-area';
+import { getFixedStyle, getScrollOffsetValue } from './utils';
+import assignProps, { callAllEventHandlers } from '@semcore/utils/lib/assignProps';
+import trottle from '@semcore/utils/lib/rafTrottle';
+import { forkRef } from '@semcore/utils/lib/ref';
+import canUseDOM from '@semcore/utils/lib/canUseDOM';
+import { SORT_ICON_WIDTH } from './Head';
+/*!__reshadow-styles__:"./style/scroll-shadows.shadow.css"*/
+var scrollStyles = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SShadowHorizontal_xlwvi_gg_:after,.___SShadowHorizontal_xlwvi_gg_:before,.___SShadowVertical_xlwvi_gg_:after,.___SShadowVertical_xlwvi_gg_:before{z-index:1}", /*__inner_css_end__*/"xlwvi_gg_"),
+/*__reshadow_css_end__*/
+{
+  "__SShadowHorizontal": "___SShadowHorizontal_xlwvi_gg_",
+  "__SShadowVertical": "___SShadowVertical_xlwvi_gg_"
+});
+import { getFocusableIn } from '@semcore/utils/lib/focus-lock/getFocusableIn';
+var testEnv = process.env.NODE_ENV === 'test';
+var getCellsByColumn = function getCellsByColumn(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(Body, _Component);
+  var _super = _createSuper(Body);
+  function Body() {
+    var _this;
+    _classCallCheck(this, Body);
+    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: undefined,
+      scrollAreaHeight: undefined,
+      scrollOffset: 0
+    });
+    _defineProperty(_assertThisInitialized(_this), "scrollContainerRef", /*#__PURE__*/React.createRef());
+    _defineProperty(_assertThisInitialized(_this), "firstRowRef", /*#__PURE__*/React.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 () {
+      /**
+       * We need this to recalculate ScrollArea sizes after end of transition
+       */
+      _this.forceUpdate();
+    }));
+    return _this;
+  }
+  _createClass(Body, [{
+    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.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 (column) {
+            return column.name;
+          })) !== null && _column$parentColumns !== void 0 ? _column$parentColumns : [];
+          var vars = (Array.isArray(cell.cssVar) ? cell.cssVar : [cell.cssVar]).map(function (name) {
+            return "var(".concat(name, ")");
+          });
+          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.createElement(React.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 !== undefined && value !== undefined) {
+            _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 (name) {
+            return "igc-table-".concat(uid, "-").concat(name);
+          });
+          var ariaColspan = nameParts.length;
+          return _ref3 = sstyled(styles), /*#__PURE__*/React.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 ? undefined : ariaColspan
+          })));
+        }
+      }, []);
+    }
+  }, {
+    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: undefined,
+        active: undefined,
+        positioned: topOffset !== undefined,
+        top: topOffset,
+        ref: needToMeasureHeight ? this.firstRowRef : undefined,
+        key: key,
+        'aria-rowindex': !nested ? dataIndex + 2 : undefined
+      };
+      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.createElement(SRow, _ref4.cn("SRow", _objectSpread({
+        "data-nested": nested.toString(),
+        "role": !nested ? 'row' : undefined,
+        "__excludeProps": ['data']
+      }, props)));
+    }
+  }, {
+    key: "renderRows",
+    value: function renderRows(rows) {
+      var _this3 = this;
+      var nested = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+      return rows.map(function (cells, dataIndex) {
+        return _this3.renderRow(cells, {
+          dataIndex: dataIndex,
+          nested: 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 !== undefined ? rows.slice(startIndex, lastIndex) : [];
+      var processedVisibleRows = visibleRows.map(function (cells, index) {
+        return {
+          cells: 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: dataIndex,
+          topOffset: 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 !== undefined && virtualScroll ? rowHeight * rows.length : undefined;
+      if (virtualScroll && columnsInitialized && !rowHeight) {
+        requestAnimationFrame(this.setupRowSizeObserver);
+      }
+      var body = (_ref5 = sstyled(styles), /*#__PURE__*/React.createElement(SBody, _ref5.cn("SBody", _objectSpread({}, _assignProps({
+        "animationsDisabled": animationsDisabled,
+        "onTransitionEnd": this.handleBodyTransitionEnd
+      }, _ref))), renderRows ? renderRows({
+        rows: rows,
+        columns: columns,
+        renderRow: this.renderRow.bind(this)
+      }) || null : /*#__PURE__*/React.createElement(React.Fragment, null, holdHeight ? /*#__PURE__*/React.createElement(SHeightHold, _ref5.cn("SHeightHold", {
+        "hMin": holdHeight,
+        "aria-hidden": true
+      })) : null, virtualScroll ? this.renderVirtualizedRows(rows) : this.renderRows(rows))));
+      if (disabledScroll) {
+        return /*#__PURE__*/React.createElement(SBodyWrapper, null, body);
+      }
+      var scrollContainerRefs = [$scrollRef, this.scrollContainerRef];
+      if (scrollContainerRef) {
+        scrollContainerRefs.push(scrollContainerRef);
+      }
+      return /*#__PURE__*/React.createElement(hideScrollBarsFromScreenReadersContext.Provider, {
+        value: true
+      }, /*#__PURE__*/React.createElement(SBodyWrapper, _ref5.cn("SBodyWrapper", {}), /*#__PURE__*/React.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.createElement(ScrollArea.Container, {
+        ref: forkRef.apply(void 0, scrollContainerRefs),
+        role: "rowgroup",
+        focusRingTopOffset: '3px',
+        tabIndex: -1
+      }, body), /*#__PURE__*/React.createElement("div", _ref5.cn("div", {
+        "style": displayContents
+      }), /*#__PURE__*/React.createElement("div", _ref5.cn("div", {
+        "style": displayContents
+      }), /*#__PURE__*/React.createElement("div", _ref5.cn("div", {
+        "style": displayContents
+      }), /*#__PURE__*/React.createElement(ScrollArea.Bar, {
+        orientation: "horizontal",
+        bottom: 0,
+        container: this.scrollContainerRef
+      }), /*#__PURE__*/React.createElement(ScrollArea.Bar, {
+        orientation: "vertical",
+        w: '12px',
+        zIndex: 2
+      }))))), Children.origin));
+    }
+  }]);
+  return Body;
+}(Component);
+export default Body;
+//# sourceMappingURL=Body.js.map