@semcore/data-table 16.0.2 → 16.0.3-prerelease.0

package/lib/cjs/components/DataTable/DataTable.js

@@ -1,7 +1,7 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -11,99 +11,93 @@ var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/obje
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
+var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
+var _isNativeReflectConstruct2 = _interopRequireDefault(require("@babel/runtime/helpers/isNativeReflectConstruct"));
+var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _core = require("@semcore/core");
-var React = _interopRequireWildcard(require("react"));
 var _baseComponents = require("@semcore/base-components");
-var _Head = require("../Head/Head");
-var _Body = require("../Body/Body");
-var _useFocusLock = require("@semcore/core/lib/utils/use/useFocusLock");
-var _findComponent = _interopRequireDefault(require("@semcore/core/lib/utils/findComponent"));
-var _intergalacticDynamicLocales = require("../../translations/__intergalactic-dynamic-locales");
 var _i18nEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/i18nEnhance"));
-var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
-var _ref10 = require("@semcore/core/lib/utils/ref");
+var _findComponent = _interopRequireDefault(require("@semcore/core/lib/utils/findComponent"));
 var _hasParent = require("@semcore/core/lib/utils/hasParent");
 var _rafTrottle = _interopRequireDefault(require("@semcore/core/lib/utils/rafTrottle"));
-var _MergedCells = require("../Body/MergedCells");
+var _ref0 = require("@semcore/core/lib/utils/ref");
+var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID"));
+var _useFocusLock = require("@semcore/core/lib/utils/use/useFocusLock");
 var _widgetEmpty = require("@semcore/widget-empty");
+var React = _interopRequireWildcard(require("react"));
+var _intergalacticDynamicLocales = require("../../translations/__intergalactic-dynamic-locales");
+var _Body = require("../Body/Body");
+var _MergedCells = require("../Body/MergedCells");
+var _Head = require("../Head/Head");
+function _callSuper(t, o, e) { return o = (0, _getPrototypeOf2["default"])(o), (0, _possibleConstructorReturn2["default"])(t, (0, _isNativeReflectConstruct2["default"])() ? Reflect.construct(o, e || [], (0, _getPrototypeOf2["default"])(t).constructor) : o.apply(t, e)); }
 /*!__reshadow-styles__:"./dataTable.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SDataTable_x73f6_gg_{display:grid;align-items:start;min-width:-moz-fit-content;min-width:fit-content}.___SDataTable_x73f6_gg_.__gridTemplateColumns_x73f6_gg_{grid-template-columns:var(--gridTemplateColumns_x73f6)}.___SDataTable_x73f6_gg_.__gridTemplateAreas_x73f6_gg_{grid-template-areas:var(--gridTemplateAreas_x73f6)}.___SDataTable_x73f6_gg_.__gridTemplateRows_x73f6_gg_{grid-template-rows:var(--gridTemplateRows_x73f6)}", /*__inner_css_end__*/"x73f6_gg_"),
+var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SDataTable_1k5kz_gg_{display:grid;align-items:start;min-width:-moz-fit-content;min-width:fit-content}.___SDataTable_1k5kz_gg_.__gridTemplateColumns_1k5kz_gg_{grid-template-columns:var(--gridTemplateColumns_1k5kz)}.___SDataTable_1k5kz_gg_.__gridTemplateAreas_1k5kz_gg_{grid-template-areas:var(--gridTemplateAreas_1k5kz)}.___SDataTable_1k5kz_gg_.__gridTemplateRows_1k5kz_gg_{grid-template-rows:var(--gridTemplateRows_1k5kz)}", /*__inner_css_end__*/"1k5kz_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SDataTable": "___SDataTable_x73f6_gg_",
-  "_gridTemplateColumns": "__gridTemplateColumns_x73f6_gg_",
-  "--gridTemplateColumns": "--gridTemplateColumns_x73f6",
-  "_gridTemplateAreas": "__gridTemplateAreas_x73f6_gg_",
-  "--gridTemplateAreas": "--gridTemplateAreas_x73f6",
-  "_gridTemplateRows": "__gridTemplateRows_x73f6_gg_",
-  "--gridTemplateRows": "--gridTemplateRows_x73f6"
+  "__SDataTable": "___SDataTable_1k5kz_gg_",
+  "_gridTemplateColumns": "__gridTemplateColumns_1k5kz_gg_",
+  "--gridTemplateColumns": "--gridTemplateColumns_1k5kz",
+  "_gridTemplateAreas": "__gridTemplateAreas_1k5kz_gg_",
+  "--gridTemplateAreas": "--gridTemplateAreas_1k5kz",
+  "_gridTemplateRows": "__gridTemplateRows_1k5kz_gg_",
+  "--gridTemplateRows": "--gridTemplateRows_1k5kz"
 });
 /*!__reshadow-styles__:"../../style/scroll-shadows.shadow.css"*/
-var scrollStyles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SScrollArea_fq5cd_gg_{width:-moz-fit-content;width:fit-content}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_{overflow:visible;overflow:initial}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_._scrollDirection_both_fq5cd_gg_{overflow:auto}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_._scrollDirection_horizontal_fq5cd_gg_{overflow-x:auto;overflow-y:initial}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_._scrollDirection_vertical_fq5cd_gg_{overflow-x:initial;overflow-y:auto}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_.__loading_fq5cd_gg_{overflow:hidden}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_.__headerHeight_fq5cd_gg_{scroll-padding-top:var(--headerHeight_fq5cd)}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_.__leftScrollPadding_fq5cd_gg_{scroll-padding-left:var(--leftScrollPadding_fq5cd)}.___SScrollArea_fq5cd_gg_ .___SContainer_fq5cd_gg_.__rightScrollPadding_fq5cd_gg_{scroll-padding-right:var(--rightScrollPadding_fq5cd)}.___SScrollArea_fq5cd_gg_ .___SShadowVertical_fq5cd_gg_:before{display:none}.___SScrollArea_fq5cd_gg_ .___SShadowHorizontal_fq5cd_gg_:after,.___SScrollArea_fq5cd_gg_ .___SShadowHorizontal_fq5cd_gg_:before,.___SScrollArea_fq5cd_gg_ .___SShadowVertical_fq5cd_gg_:after{z-index:2}", /*__inner_css_end__*/"fq5cd_gg_"),
+var scrollStyles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SScrollArea_qh4me_gg_{width:-moz-fit-content;width:fit-content}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_{overflow:visible;overflow:initial}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_._scrollDirection_both_qh4me_gg_{overflow:auto}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_._scrollDirection_horizontal_qh4me_gg_{overflow-x:auto;overflow-y:initial}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_._scrollDirection_vertical_qh4me_gg_{overflow-x:initial;overflow-y:auto}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_.__loading_qh4me_gg_{overflow:hidden}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_.__headerHeight_qh4me_gg_{scroll-padding-top:var(--headerHeight_qh4me)}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_.__leftScrollPadding_qh4me_gg_{scroll-padding-left:var(--leftScrollPadding_qh4me)}.___SScrollArea_qh4me_gg_ .___SContainer_qh4me_gg_.__rightScrollPadding_qh4me_gg_{scroll-padding-right:var(--rightScrollPadding_qh4me)}.___SScrollArea_qh4me_gg_ .___SShadowVertical_qh4me_gg_:before{display:none}.___SScrollArea_qh4me_gg_ .___SShadowHorizontal_qh4me_gg_:after,.___SScrollArea_qh4me_gg_ .___SShadowHorizontal_qh4me_gg_:before,.___SScrollArea_qh4me_gg_ .___SShadowVertical_qh4me_gg_:after{z-index:2}", /*__inner_css_end__*/"qh4me_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SScrollArea": "___SScrollArea_fq5cd_gg_",
-  "__SContainer": "___SContainer_fq5cd_gg_",
-  "_scrollDirection_both": "_scrollDirection_both_fq5cd_gg_",
-  "_scrollDirection_horizontal": "_scrollDirection_horizontal_fq5cd_gg_",
-  "_scrollDirection_vertical": "_scrollDirection_vertical_fq5cd_gg_",
-  "_loading": "__loading_fq5cd_gg_",
-  "_headerHeight": "__headerHeight_fq5cd_gg_",
-  "--headerHeight": "--headerHeight_fq5cd",
-  "_leftScrollPadding": "__leftScrollPadding_fq5cd_gg_",
-  "--leftScrollPadding": "--leftScrollPadding_fq5cd",
-  "_rightScrollPadding": "__rightScrollPadding_fq5cd_gg_",
-  "--rightScrollPadding": "--rightScrollPadding_fq5cd",
-  "__SShadowVertical": "___SShadowVertical_fq5cd_gg_",
-  "__SShadowHorizontal": "___SShadowHorizontal_fq5cd_gg_"
+  "__SScrollArea": "___SScrollArea_qh4me_gg_",
+  "__SContainer": "___SContainer_qh4me_gg_",
+  "_scrollDirection_both": "_scrollDirection_both_qh4me_gg_",
+  "_scrollDirection_horizontal": "_scrollDirection_horizontal_qh4me_gg_",
+  "_scrollDirection_vertical": "_scrollDirection_vertical_qh4me_gg_",
+  "_loading": "__loading_qh4me_gg_",
+  "_headerHeight": "__headerHeight_qh4me_gg_",
+  "--headerHeight": "--headerHeight_qh4me",
+  "_leftScrollPadding": "__leftScrollPadding_qh4me_gg_",
+  "--leftScrollPadding": "--leftScrollPadding_qh4me",
+  "_rightScrollPadding": "__rightScrollPadding_qh4me_gg_",
+  "--rightScrollPadding": "--rightScrollPadding_qh4me",
+  "__SShadowVertical": "___SShadowVertical_qh4me_gg_",
+  "__SShadowHorizontal": "___SShadowHorizontal_qh4me_gg_"
 });
-var ACCORDION = Symbol('accordion');
-exports.ACCORDION = ACCORDION;
-var ROW_GROUP = Symbol('ROW_GROUP');
-exports.ROW_GROUP = ROW_GROUP;
-var UNIQ_ROW_KEY = Symbol('UNIQ_ROW_KEY');
-exports.UNIQ_ROW_KEY = UNIQ_ROW_KEY;
-var SELECT_ALL = Symbol('SELECT_ALL');
-exports.SELECT_ALL = SELECT_ALL;
-var ROW_INDEX = Symbol('ROW_INDEX');
-exports.ROW_INDEX = ROW_INDEX;
+var ACCORDION = exports.ACCORDION = Symbol('accordion');
+var ROW_GROUP = exports.ROW_GROUP = Symbol('ROW_GROUP');
+var UNIQ_ROW_KEY = exports.UNIQ_ROW_KEY = Symbol('UNIQ_ROW_KEY');
+var SELECT_ALL = exports.SELECT_ALL = Symbol('SELECT_ALL');
+var ROW_INDEX = exports.ROW_INDEX = Symbol('ROW_INDEX');
 var SCROLL_BAR_HEIGHT = 12;
 var DataTableRoot = /*#__PURE__*/function (_Component) {
-  (0, _inherits2["default"])(DataTableRoot, _Component);
-  var _super = (0, _createSuper2["default"])(DataTableRoot);
   function DataTableRoot(props) {
     var _this;
     (0, _classCallCheck2["default"])(this, DataTableRoot);
-    _this = _super.call(this, props);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "columns", []);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "treeColumns", []);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "hasGroups", false);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "focusedCell", [-1, -1]);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "scrollAreaRef", /*#__PURE__*/React.createRef());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "tableContainerRef", /*#__PURE__*/React.createRef());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "tableRef", /*#__PURE__*/React.createRef());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "headerRef", /*#__PURE__*/React.createRef());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "spinnerRef", /*#__PURE__*/React.createRef());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "gridAreaGroupMap", new Map());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "columnsSplitter", '/');
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "rows", []);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "flatRows", []);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "selectAllMessageTimer", 0);
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "headerNodesMap", new Map());
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
+    _this = _callSuper(this, DataTableRoot, [props]);
+    (0, _defineProperty2["default"])(_this, "columns", []);
+    (0, _defineProperty2["default"])(_this, "treeColumns", []);
+    (0, _defineProperty2["default"])(_this, "hasGroups", false);
+    (0, _defineProperty2["default"])(_this, "focusedCell", [-1, -1]);
+    (0, _defineProperty2["default"])(_this, "scrollAreaRef", /*#__PURE__*/React.createRef());
+    (0, _defineProperty2["default"])(_this, "tableContainerRef", /*#__PURE__*/React.createRef());
+    (0, _defineProperty2["default"])(_this, "tableRef", /*#__PURE__*/React.createRef());
+    (0, _defineProperty2["default"])(_this, "headerRef", /*#__PURE__*/React.createRef());
+    (0, _defineProperty2["default"])(_this, "spinnerRef", /*#__PURE__*/React.createRef());
+    (0, _defineProperty2["default"])(_this, "gridAreaGroupMap", new Map());
+    (0, _defineProperty2["default"])(_this, "columnsSplitter", '/');
+    (0, _defineProperty2["default"])(_this, "rows", []);
+    (0, _defineProperty2["default"])(_this, "flatRows", []);
+    (0, _defineProperty2["default"])(_this, "selectAllMessageTimer", 0);
+    (0, _defineProperty2["default"])(_this, "headerNodesMap", new Map());
+    (0, _defineProperty2["default"])(_this, "state", {
       scrollTop: 0,
       scrollDirection: 'down',
       selectAllMessage: ''
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSelectRow", function (isSelected, selectedRowIndex, row, event) {
+    (0, _defineProperty2["default"])(_this, "handleSelectRow", function (isSelected, selectedRowIndex, row, event) {
       var _this$asProps = _this.asProps,
         selectedRows = _this$asProps.selectedRows,
-        onSelectedRowsChange = _this$asProps.onSelectedRowsChange,
-        data = _this$asProps.data;
+        onSelectedRowsChange = _this$asProps.onSelectedRowsChange;
       if (selectedRows && onSelectedRowsChange) {
         var newSelectedRows = new Set(selectedRows);
         if (isSelected && !newSelectedRows.has(selectedRowIndex)) {
@@ -118,7 +112,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         });
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "setSelectAllMessage", function (selectedAll) {
+    (0, _defineProperty2["default"])(_this, "setSelectAllMessage", function (selectedAll) {
       if (_this.selectAllMessageTimer) {
         clearTimeout(_this.selectAllMessageTimer);
       }
@@ -133,14 +127,14 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         });
       }, 5000);
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getRow", function (index) {
+    (0, _defineProperty2["default"])(_this, "getRow", function (index) {
       var _this$tableRef$curren;
       return (_this$tableRef$curren = _this.tableRef.current) === null || _this$tableRef$curren === void 0 ? void 0 : _this$tableRef$curren.querySelector("[aria-rowindex=\"".concat(index + 1, "\"]:not([aria-hidden=\"true\"])"));
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "hasFocusableInHeader", function () {
+    (0, _defineProperty2["default"])(_this, "hasFocusableInHeader", function () {
       return _this.headerRef.current && (0, _useFocusLock.hasFocusableIn)(_this.headerRef.current);
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onExpandRow", function (expandedRow) {
+    (0, _defineProperty2["default"])(_this, "onExpandRow", function (expandedRow) {
       var expandedRows = _this.asProps.expandedRows;
       if (expandedRows.has(expandedRow[UNIQ_ROW_KEY])) {
         expandedRows["delete"](expandedRow[UNIQ_ROW_KEY]);
@@ -152,7 +146,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         _this.handlers.expandedRows(new Set((0, _toConsumableArray2["default"])(expandedRows)));
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeFocusCell", function (rowIndex, colIndex, direction) {
+    (0, _defineProperty2["default"])(_this, "changeFocusCell", function (rowIndex, colIndex, direction) {
       var _this$tableRef$curren2, _this$tableRef$curren3;
       var hasFocusable = _this.hasFocusableInHeader();
       var maxCol = _this.columns.length - 1;
@@ -175,9 +169,9 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       var cell = row === null || row === void 0 ? void 0 : row.querySelector(":scope > div > [role=gridcell][aria-colindex=\"".concat(newCol + 1, "\"], :scope > [role=columnheader][aria-colindex=\"").concat(newCol + 1, "\"], :scope > div > [role=columnheader][aria-colindex=\"").concat(newCol + 1, "\"]"));
       if (cell instanceof HTMLElement && currentCell !== cell) {
         _this.focusedCell = [newRow, newCol];
-        currentCell === null || currentCell === void 0 ? void 0 : currentCell.setAttribute('inert', '');
+        currentCell === null || currentCell === void 0 || currentCell.setAttribute('inert', '');
         if (currentCell !== currentHeaderCell) {
-          currentCell === null || currentCell === void 0 ? void 0 : currentCell.removeAttribute('aria-describedby');
+          currentCell === null || currentCell === void 0 || currentCell.removeAttribute('aria-describedby');
         }
         var headerCell = headerCells === null || headerCells === void 0 ? void 0 : headerCells.item(newCol);
         var describedBy = headerCell === null || headerCell === void 0 ? void 0 : headerCell.getAttribute('aria-describedby');
@@ -185,24 +179,24 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         if (headerCell !== cell && describedBy) {
           cell.setAttribute('aria-describedby', describedBy);
         }
-        cell === null || cell === void 0 ? void 0 : cell.focus();
+        cell === null || cell === void 0 || cell.focus();
         if (newRow !== 0) {
-          currentHeaderCell === null || currentHeaderCell === void 0 ? void 0 : currentHeaderCell.setAttribute('inert', '');
+          currentHeaderCell === null || currentHeaderCell === void 0 || currentHeaderCell.setAttribute('inert', '');
           var _headerCell = headerCells === null || headerCells === void 0 ? void 0 : headerCells.item(newCol);
-          _headerCell === null || _headerCell === void 0 ? void 0 : _headerCell.removeAttribute('inert');
+          _headerCell === null || _headerCell === void 0 || _headerCell.removeAttribute('inert');
         }
       } else if (cell === null && currentCell instanceof HTMLElement) {
         var rowI = rowIndex;
         var colI = colIndex;
         if (direction === 'left' || direction === 'right') {
-          var _currentCell$parentEl, _currentCell$parentEl2, _currentCell$parentEl3, _currentCell$parentEl4, _row$children;
+          var _currentCell$parentEl, _currentCell$parentEl2, _row$children;
           // we need to skip Collapse Element with one big component from keyboard left/right pressing
-          if (((_currentCell$parentEl = currentCell.parentElement) === null || _currentCell$parentEl === void 0 ? void 0 : (_currentCell$parentEl2 = _currentCell$parentEl.parentElement) === null || _currentCell$parentEl2 === void 0 ? void 0 : _currentCell$parentEl2.dataset.uiName) === 'Collapse') {
+          if (((_currentCell$parentEl = currentCell.parentElement) === null || _currentCell$parentEl === void 0 || (_currentCell$parentEl = _currentCell$parentEl.parentElement) === null || _currentCell$parentEl === void 0 ? void 0 : _currentCell$parentEl.dataset.uiName) === 'Collapse') {
             return;
           }
 
           // left/right
-          if (currentCell.dataset.groupedBy === 'colgroup' || Number((_currentCell$parentEl3 = currentCell.parentElement) === null || _currentCell$parentEl3 === void 0 ? void 0 : (_currentCell$parentEl4 = _currentCell$parentEl3.parentElement) === null || _currentCell$parentEl4 === void 0 ? void 0 : _currentCell$parentEl4.getAttribute('aria-rowindex')) === 2 || currentCell.parentElement && Array.from((_row$children = row === null || row === void 0 ? void 0 : row.children) !== null && _row$children !== void 0 ? _row$children : []).indexOf(currentCell.parentElement) > 0) {
+          if (currentCell.dataset.groupedBy === 'colgroup' || Number((_currentCell$parentEl2 = currentCell.parentElement) === null || _currentCell$parentEl2 === void 0 || (_currentCell$parentEl2 = _currentCell$parentEl2.parentElement) === null || _currentCell$parentEl2 === void 0 ? void 0 : _currentCell$parentEl2.getAttribute('aria-rowindex')) === 2 || currentCell.parentElement && Array.from((_row$children = row === null || row === void 0 ? void 0 : row.children) !== null && _row$children !== void 0 ? _row$children : []).indexOf(currentCell.parentElement) > 0) {
             colI = direction === 'left' ? colI - 1 : colI + 1;
           } else {
             rowI = rowI - 1;
@@ -223,7 +217,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         _this.changeFocusCell(rowIndex + 1, colIndex, direction);
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleKeyDown", function (e) {
+    (0, _defineProperty2["default"])(_this, "handleKeyDown", function (e) {
       switch (e.key) {
         case 'Tab':
           {
@@ -256,7 +250,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
           }
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "initFocusableCell", function () {
+    (0, _defineProperty2["default"])(_this, "initFocusableCell", function () {
       var hasFocusable = _this.hasFocusableInHeader();
       if (hasFocusable) {
         _this.focusedCell = [0, 0];
@@ -264,7 +258,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         _this.focusedCell = [1, 0];
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleScroll", (0, _rafTrottle["default"])(function (e) {
+    (0, _defineProperty2["default"])(_this, "handleScroll", (0, _rafTrottle["default"])(function (e) {
       var scrollTop = e.target.scrollTop;
       var scrollDirection = scrollTop > _this.state.scrollTop ? 'down' : 'up';
       _this.setState({
@@ -272,10 +266,10 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         scrollDirection: scrollDirection
       });
     }));
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleFocus", function (e) {
+    (0, _defineProperty2["default"])(_this, "handleFocus", function (e) {
       if (_this.asProps.loading) {
         var _this$spinnerRef$curr;
-        (_this$spinnerRef$curr = _this.spinnerRef.current) === null || _this$spinnerRef$curr === void 0 ? void 0 : _this$spinnerRef$curr.focus();
+        (_this$spinnerRef$curr = _this.spinnerRef.current) === null || _this$spinnerRef$curr === void 0 || _this$spinnerRef$curr.focus();
         e.currentTarget.setAttribute('tabIndex', '-1');
       } else if ((!e.relatedTarget || !(0, _useFocusLock.isFocusInside)(e.currentTarget, e.relatedTarget)) && _core.lastInteraction.isKeyboard()) {
         var _row;
@@ -291,18 +285,18 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         if (!row && _this.asProps.virtualScroll) {
           var _this$tableRef$curren4, _firstAvailableCell$p;
           var firstAvailableCell = (_this$tableRef$curren4 = _this.tableRef.current) === null || _this$tableRef$curren4 === void 0 ? void 0 : _this$tableRef$curren4.querySelector("[role=\"gridcell\"]");
-          var firstAvailableRow = firstAvailableCell === null || firstAvailableCell === void 0 ? void 0 : (_firstAvailableCell$p = firstAvailableCell.parentElement) === null || _firstAvailableCell$p === void 0 ? void 0 : _firstAvailableCell$p.parentElement;
+          var firstAvailableRow = firstAvailableCell === null || firstAvailableCell === void 0 || (_firstAvailableCell$p = firstAvailableCell.parentElement) === null || _firstAvailableCell$p === void 0 ? void 0 : _firstAvailableCell$p.parentElement;
           if (firstAvailableCell && firstAvailableRow) {
-            var _Number, _Number2;
-            var colIndex = ((_Number = Number(firstAvailableCell.getAttribute('aria-colindex'))) !== null && _Number !== void 0 ? _Number : 1) - 1;
-            var rowIndex = ((_Number2 = Number(firstAvailableRow.getAttribute('aria-rowindex'))) !== null && _Number2 !== void 0 ? _Number2 : 1) - 1;
+            var _firstAvailableCell$g, _firstAvailableRow$ge;
+            var colIndex = Number((_firstAvailableCell$g = firstAvailableCell.getAttribute('aria-colindex')) !== null && _firstAvailableCell$g !== void 0 ? _firstAvailableCell$g : 1) - 1;
+            var rowIndex = Number((_firstAvailableRow$ge = firstAvailableRow.getAttribute('aria-rowindex')) !== null && _firstAvailableRow$ge !== void 0 ? _firstAvailableRow$ge : 1) - 1;
             _this.focusedCell[0] = rowIndex;
             _this.focusedCell[1] = colIndex;
             row = firstAvailableRow;
           }
         }
         var cell = (_row = row) === null || _row === void 0 ? void 0 : _row.querySelectorAll('[role=gridcell], [role=columnheader]').item(_this.focusedCell[1]);
-        cell === null || cell === void 0 ? void 0 : cell.removeAttribute('inert');
+        cell === null || cell === void 0 || cell.removeAttribute('inert');
         if (cell instanceof HTMLElement) {
           if ((0, _hasParent.hasParent)(e.target, cell)) {
             e.target.focus();
@@ -313,7 +307,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         e.currentTarget.setAttribute('tabIndex', '-1');
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBlur", function (e) {
+    (0, _defineProperty2["default"])(_this, "handleBlur", function (e) {
       var relatedTarget = e.relatedTarget;
       var tableElement = _this.tableRef.current;
       if (tableElement && (!relatedTarget || !(0, _useFocusLock.isFocusInside)(tableElement, relatedTarget) || !_core.lastInteraction.isKeyboard())) {
@@ -321,13 +315,13 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         tableElement.setAttribute('tabIndex', '0');
       }
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleMouseMove", function () {
+    (0, _defineProperty2["default"])(_this, "handleMouseMove", function () {
       _this.setInert(false);
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleBackFromAccordion", function (cellIndex) {
+    (0, _defineProperty2["default"])(_this, "handleBackFromAccordion", function (cellIndex) {
       _this.changeFocusCell(-1, cellIndex === -1 ? 0 : cellIndex, 'up');
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getScrollOffsetValue", function () {
+    (0, _defineProperty2["default"])(_this, "getScrollOffsetValue", function () {
       if (!_this.headerRef.current) {
         return [0, 0];
       }
@@ -364,7 +358,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         return acc;
       }, [0, 0]);
     });
-    (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "getFixedStyle", function (cell) {
+    (0, _defineProperty2["default"])(_this, "getFixedStyle", function (cell) {
       var side = cell.fixed;
       if (!side) return [undefined, undefined];
       var names = cell.name.split('/');
@@ -404,7 +398,8 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
     _this.flatRows = _this.rows.flat();
     return _this;
   }
-  (0, _createClass2["default"])(DataTableRoot, [{
+  (0, _inherits2["default"])(DataTableRoot, _Component);
+  return (0, _createClass2["default"])(DataTableRoot, [{
     key: "uncontrolledProps",
     value: function uncontrolledProps() {
       return {
@@ -538,7 +533,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
           var selectedRowsIndexes = value ? new Array(_this3.totalRows).fill(undefined).map(function (_, i) {
             return i;
           }) : [];
-          onSelectedRowsChange === null || onSelectedRowsChange === void 0 ? void 0 : onSelectedRowsChange(selectedRowsIndexes, e);
+          onSelectedRowsChange === null || onSelectedRowsChange === void 0 || onSelectedRowsChange(selectedRowsIndexes, e);
         },
         getFixedStyle: this.getFixedStyle
       }, headerProps);
@@ -603,7 +598,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
     value: function setInert(value) {
       var _this$tableRef$curren5;
       var cells = (_this$tableRef$curren5 = this.tableRef.current) === null || _this$tableRef$curren5 === void 0 ? void 0 : _this$tableRef$curren5.querySelectorAll('[role=gridcell], [role=columnheader]');
-      cells === null || cells === void 0 ? void 0 : cells.forEach(function (cell) {
+      cells === null || cells === void 0 || cells.forEach(function (cell) {
         if (value === true) {
           cell.setAttribute('inert', '');
         } else {
@@ -687,7 +682,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         leftScrollPadding: "".concat(offsetLeftSum, "px"),
         rightScrollPadding: "".concat(offsetRightSum, "px")
       }, /*#__PURE__*/React.createElement(SDataTable, _ref2.cn("SDataTable", (0, _objectSpread2["default"])({}, (0, _core.assignProps)({
-        "ref": (0, _ref10.forkRef)(this.tableRef, this.tableContainerRef),
+        "ref": (0, _ref0.forkRef)(this.tableRef, this.tableContainerRef),
         "role": 'grid',
         "onKeyDown": this.handleKeyDown,
         "onMouseMove": this.handleMouseMove,
@@ -732,7 +727,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         selectedRows = _this$props.selectedRows;
       var HeadComponent = (0, _findComponent["default"])(children, ['Head']);
       this.hasGroups = (0, _findComponent["default"])(HeadComponent.props.children, ['Head.Group']) !== undefined;
-      var columnIndex = 0;
       var groupIndex = 0;
       var gridColumnIndex = selectedRows ? 2 : 1;
       var calculateGridTemplateColumn = this.calculateGridTemplateColumn.bind(this);
@@ -775,7 +769,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         if (childIsColumn(child)) {
           var col = makeColumn(child);
           col.gridArea = "1 / ".concat(gridColumnIndex, " / ").concat(_this4.hasGroups ? '3' : '2', " / ").concat(gridColumnIndex + 1);
-          columnIndex++;
           gridColumnIndex++;
           columns.push(col);
         } else if (childIsGroup(child)) {
@@ -796,7 +789,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
                 _col.gridArea = "2 / ".concat(gridColumnIndex, " / 3 / ").concat(gridColumnIndex + 1);
               }
               _col.gridArea = "2 / ".concat(gridColumnIndex, " / 3 / ").concat(gridColumnIndex + 1);
-              columnIndex++;
               gridColumnIndex++;
               columns.push(_col);
             }
@@ -818,7 +810,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       this.hasGroups = columns.some(function (column) {
         return 'columns' in column;
       });
-      var columnIndex = 0;
       var groupIndex = 0;
       var gridColumnIndex = selectedRows ? 2 : 1;
       var calculateGridTemplateColumn = this.calculateGridTemplateColumn.bind(this);
@@ -856,7 +847,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         if (childIsColumn(child)) {
           var col = makeColumn(child);
           col.gridArea = "1 / ".concat(gridColumnIndex, " / ").concat(_this5.hasGroups ? '3' : '2', " / ").concat(gridColumnIndex + 1);
-          columnIndex++;
           gridColumnIndex++;
           calculatedColumns.push(col);
           treeColumns.push(col);
@@ -880,10 +870,9 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
               col.gridArea = "2 / ".concat(gridColumnIndex, " / 3 / ").concat(gridColumnIndex + 1);
             }
             col.gridArea = "2 / ".concat(gridColumnIndex, " / 3 / ").concat(gridColumnIndex + 1);
-            columnIndex++;
             gridColumnIndex++;
             calculatedColumns.push(col);
-            (_Group$columns = Group.columns) === null || _Group$columns === void 0 ? void 0 : _Group$columns.push(col);
+            (_Group$columns = Group.columns) === null || _Group$columns === void 0 || _Group$columns.push(col);
           });
           treeColumns.push(Group);
           _this5.gridAreaGroupMap.set(groupIndex, "1 / ".concat(initGridColumn, " / 2 / ").concat(gridColumnIndex));
@@ -909,7 +898,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       var id = 100000000; // need this for gen keys by toString(36)
 
       var makeDtRow = function makeDtRow(row, excludeColumns) {
-        var _Object$entries$reduc;
         var columns = new Set(columnNames);
         var dtRow = Object.entries(row).reduce(function (acc, _ref5) {
           var _ref6 = (0, _slicedToArray2["default"])(_ref5, 2),
@@ -932,8 +920,8 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
             acc[ACCORDION] = row[ACCORDION];
           }
           return acc;
-        }, (_Object$entries$reduc = {}, (0, _defineProperty2["default"])(_Object$entries$reduc, UNIQ_ROW_KEY, row[UNIQ_ROW_KEY] || "".concat(uid, "_").concat((rowIndex + id).toString(36))), (0, _defineProperty2["default"])(_Object$entries$reduc, ROW_INDEX, rowIndex), _Object$entries$reduc));
-        excludeColumns === null || excludeColumns === void 0 ? void 0 : excludeColumns.forEach(function (value) {
+        }, (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, UNIQ_ROW_KEY, row[UNIQ_ROW_KEY] || "".concat(uid, "_").concat((rowIndex + id).toString(36))), ROW_INDEX, rowIndex));
+        excludeColumns === null || excludeColumns === void 0 || excludeColumns.forEach(function (value) {
           columns["delete"](value);
         });
         if (columns.size > 0) {
@@ -946,7 +934,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       data.forEach(function (row) {
         var groupedRows = row[ROW_GROUP];
         if (groupedRows) {
-          var _Object$entries$reduc2;
           var innerRows = [];
           var groupedKeys = [];
           var groupedRowData = Object.entries(row).reduce(function (acc, _ref7) {
@@ -956,7 +943,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
             acc[key] = new _MergedCells.MergedRowsCell(value, groupedRows.length, row[ACCORDION]);
             groupedKeys.push(key);
             return acc;
-          }, (_Object$entries$reduc2 = {}, (0, _defineProperty2["default"])(_Object$entries$reduc2, UNIQ_ROW_KEY, ''), (0, _defineProperty2["default"])(_Object$entries$reduc2, ROW_INDEX, -1), _Object$entries$reduc2));
+          }, (0, _defineProperty2["default"])((0, _defineProperty2["default"])({}, UNIQ_ROW_KEY, ''), ROW_INDEX, -1));
           groupedRows.forEach(function (childRow, index) {
             var dtRow;
             if (index === 0) {
@@ -964,12 +951,12 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
               dtRow = makeDtRow(rowData);
               dtRow[ROW_GROUP] = new Set();
             } else {
-              var _innerRows$, _innerRows$$ROW_GROUP;
+              var _innerRows$;
               if (index === groupedRows.length - 1 && row[ACCORDION]) {
                 childRow[ACCORDION] = row[ACCORDION];
               }
               dtRow = makeDtRow(childRow, groupedKeys);
-              (_innerRows$ = innerRows[0]) === null || _innerRows$ === void 0 ? void 0 : (_innerRows$$ROW_GROUP = _innerRows$[ROW_GROUP]) === null || _innerRows$$ROW_GROUP === void 0 ? void 0 : _innerRows$$ROW_GROUP.add(dtRow[UNIQ_ROW_KEY]);
+              (_innerRows$ = innerRows[0]) === null || _innerRows$ === void 0 || (_innerRows$ = _innerRows$[ROW_GROUP]) === null || _innerRows$ === void 0 || _innerRows$.add(dtRow[UNIQ_ROW_KEY]);
             }
             innerRows.push(dtRow);
             rowIndex++;
@@ -997,7 +984,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       var height = 0;
       for (var i = 0; i < ((_header$length = header === null || header === void 0 ? void 0 : header.length) !== null && _header$length !== void 0 ? _header$length : 0); i++) {
         var _header$length, _header$item;
-        var columnHeight = header === null || header === void 0 ? void 0 : (_header$item = header.item(i)) === null || _header$item === void 0 ? void 0 : _header$item.getBoundingClientRect().height;
+        var columnHeight = header === null || header === void 0 || (_header$item = header.item(i)) === null || _header$item === void 0 ? void 0 : _header$item.getBoundingClientRect().height;
         if (columnHeight) {
           height = columnHeight;
           break;
@@ -1006,7 +993,6 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       return height;
     }
   }]);
-  return DataTableRoot;
 }(_core.Component);
 (0, _defineProperty2["default"])(DataTableRoot, "displayName", 'DataTable');
 (0, _defineProperty2["default"])(DataTableRoot, "style", style);
@@ -1020,17 +1006,15 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   renderEmptyData: function renderEmptyData() {
     return /*#__PURE__*/React.createElement(_widgetEmpty.NoData, {
       py: 10,
-      type: 'nothing-found',
-      description: '',
-      w: '100%'
+      type: "nothing-found",
+      description: "",
+      w: "100%"
     });
   }
 });
-var DataTable = (0, _core.createComponent)(DataTableRoot, {
+var DataTable = exports.DataTable = (0, _core.createComponent)(DataTableRoot, {
   Head: _Head.Head,
   Body: _Body.Body
 });
-exports.DataTable = DataTable;
-var DataTableInternal = DataTable;
-exports.DataTableInternal = DataTableInternal;
+var DataTableInternal = exports.DataTableInternal = DataTable;
 //# sourceMappingURL=DataTable.js.map