@semcore/data-table 16.4.3 → 16.4.4-prerelease.1

package/lib/es6/components/DataTable/DataTable.js

@@ -21,38 +21,38 @@ import { isFocusInside, hasFocusableIn } from '@semcore/core/lib/utils/use/useFo
 import { NoData } from '@semcore/widget-empty';
 import * as React from 'react';
 /*!__reshadow-styles__:"./dataTable.shadow.css"*/
-var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SDataTable_um7ot_gg_{display:grid;align-items:start;min-width:-moz-fit-content;min-width:fit-content;grid-auto-rows:min-content}.___SDataTable_um7ot_gg_.__isDataEmpty_um7ot_gg_{display:block;align-items:initial;min-width:initial}.___SDataTable_um7ot_gg_.__gridTemplateColumns_um7ot_gg_{grid-template-columns:var(--gridTemplateColumns_um7ot)}.___SDataTable_um7ot_gg_.__gridTemplateAreas_um7ot_gg_{grid-template-areas:var(--gridTemplateAreas_um7ot)}.___SDataTable_um7ot_gg_.__gridTemplateRows_um7ot_gg_{grid-template-rows:var(--gridTemplateRows_um7ot)}", /*__inner_css_end__*/"um7ot_gg_"),
+var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SDataTable_z1jx4_gg_{display:grid;align-items:start;min-width:-moz-fit-content;min-width:fit-content;grid-auto-rows:min-content}.___SDataTable_z1jx4_gg_.__isDataEmpty_z1jx4_gg_{display:block;align-items:initial;min-width:initial}.___SDataTable_z1jx4_gg_.__gridTemplateColumns_z1jx4_gg_{grid-template-columns:var(--gridTemplateColumns_z1jx4)}.___SDataTable_z1jx4_gg_.__gridTemplateAreas_z1jx4_gg_{grid-template-areas:var(--gridTemplateAreas_z1jx4)}.___SDataTable_z1jx4_gg_.__gridTemplateRows_z1jx4_gg_{grid-template-rows:var(--gridTemplateRows_z1jx4)}", /*__inner_css_end__*/"z1jx4_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SDataTable": "___SDataTable_um7ot_gg_",
-  "_isDataEmpty": "__isDataEmpty_um7ot_gg_",
-  "_gridTemplateColumns": "__gridTemplateColumns_um7ot_gg_",
-  "--gridTemplateColumns": "--gridTemplateColumns_um7ot",
-  "_gridTemplateAreas": "__gridTemplateAreas_um7ot_gg_",
-  "--gridTemplateAreas": "--gridTemplateAreas_um7ot",
-  "_gridTemplateRows": "__gridTemplateRows_um7ot_gg_",
-  "--gridTemplateRows": "--gridTemplateRows_um7ot"
+  "__SDataTable": "___SDataTable_z1jx4_gg_",
+  "_isDataEmpty": "__isDataEmpty_z1jx4_gg_",
+  "_gridTemplateColumns": "__gridTemplateColumns_z1jx4_gg_",
+  "--gridTemplateColumns": "--gridTemplateColumns_z1jx4",
+  "_gridTemplateAreas": "__gridTemplateAreas_z1jx4_gg_",
+  "--gridTemplateAreas": "--gridTemplateAreas_z1jx4",
+  "_gridTemplateRows": "__gridTemplateRows_z1jx4_gg_",
+  "--gridTemplateRows": "--gridTemplateRows_z1jx4"
 });
 /*!__reshadow-styles__:"../../style/scroll-shadows.shadow.css"*/
-var scrollStyles = (/*__reshadow_css_start__*/_sstyled2.insert(/*__inner_css_start__*/".___SScrollArea_1nmt4_gg_{width:-moz-fit-content;width:fit-content}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_{overflow:visible;overflow:initial}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_._scrollDirection_both_1nmt4_gg_{overflow:auto}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_._scrollDirection_both_1nmt4_gg_.__loading_1nmt4_gg_,.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_._scrollDirection_horizontal_1nmt4_gg_.__loading_1nmt4_gg_,.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_._scrollDirection_vertical_1nmt4_gg_.__loading_1nmt4_gg_{overflow:hidden}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_._scrollDirection_horizontal_1nmt4_gg_{overflow-x:auto;overflow-y:initial}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_._scrollDirection_vertical_1nmt4_gg_{overflow-x:initial;overflow-y:auto}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_.__headerHeight_1nmt4_gg_{scroll-padding-top:var(--headerHeight_1nmt4)}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_.__leftScrollPadding_1nmt4_gg_{scroll-padding-left:var(--leftScrollPadding_1nmt4)}.___SScrollArea_1nmt4_gg_ .___SContainer_1nmt4_gg_.__rightScrollPadding_1nmt4_gg_{scroll-padding-right:var(--rightScrollPadding_1nmt4)}.___SScrollArea_1nmt4_gg_ .___SShadowHorizontal_1nmt4_gg_::before,.___SScrollArea_1nmt4_gg_ .___SShadowHorizontal_1nmt4_gg_:after,.___SScrollArea_1nmt4_gg_ .___SShadowVertical_1nmt4_gg_::after{z-index:20}.___SScrollArea_1nmt4_gg_ .___SShadowHorizontal_1nmt4_gg_.__leftOffset_1nmt4_gg_::before,.___SScrollArea_1nmt4_gg_ .___SShadowHorizontal_1nmt4_gg_.__rightOffset_1nmt4_gg_::after,.___SScrollArea_1nmt4_gg_ .___SShadowVertical_1nmt4_gg_::before{display:none}", /*__inner_css_end__*/"1nmt4_gg_"),
+var scrollStyles = (/*__reshadow_css_start__*/_sstyled2.insert(/*__inner_css_start__*/".___SScrollArea_ntjfu_gg_{width:-moz-fit-content;width:fit-content}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_{overflow:visible;overflow:initial}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_._scrollDirection_both_ntjfu_gg_{overflow:auto}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_._scrollDirection_both_ntjfu_gg_.__loading_ntjfu_gg_,.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_._scrollDirection_horizontal_ntjfu_gg_.__loading_ntjfu_gg_,.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_._scrollDirection_vertical_ntjfu_gg_.__loading_ntjfu_gg_{overflow:hidden}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_._scrollDirection_horizontal_ntjfu_gg_{overflow-x:auto;overflow-y:initial}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_._scrollDirection_vertical_ntjfu_gg_{overflow-x:initial;overflow-y:auto}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_.__headerHeight_ntjfu_gg_{scroll-padding-top:var(--headerHeight_ntjfu)}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_.__leftScrollPadding_ntjfu_gg_{scroll-padding-left:var(--leftScrollPadding_ntjfu)}.___SScrollArea_ntjfu_gg_ .___SContainer_ntjfu_gg_.__rightScrollPadding_ntjfu_gg_{scroll-padding-right:var(--rightScrollPadding_ntjfu)}.___SScrollArea_ntjfu_gg_ .___SShadowHorizontal_ntjfu_gg_::before,.___SScrollArea_ntjfu_gg_ .___SShadowHorizontal_ntjfu_gg_:after,.___SScrollArea_ntjfu_gg_ .___SShadowVertical_ntjfu_gg_::after{z-index:20}.___SScrollArea_ntjfu_gg_ .___SShadowHorizontal_ntjfu_gg_.__leftOffset_ntjfu_gg_::before,.___SScrollArea_ntjfu_gg_ .___SShadowHorizontal_ntjfu_gg_.__rightOffset_ntjfu_gg_::after,.___SScrollArea_ntjfu_gg_ .___SShadowVertical_ntjfu_gg_::before{display:none}", /*__inner_css_end__*/"ntjfu_gg_"),
 /*__reshadow_css_end__*/
 {
-  "__SScrollArea": "___SScrollArea_1nmt4_gg_",
-  "__SContainer": "___SContainer_1nmt4_gg_",
-  "_scrollDirection_both": "_scrollDirection_both_1nmt4_gg_",
-  "_loading": "__loading_1nmt4_gg_",
-  "_scrollDirection_horizontal": "_scrollDirection_horizontal_1nmt4_gg_",
-  "_scrollDirection_vertical": "_scrollDirection_vertical_1nmt4_gg_",
-  "_headerHeight": "__headerHeight_1nmt4_gg_",
-  "--headerHeight": "--headerHeight_1nmt4",
-  "_leftScrollPadding": "__leftScrollPadding_1nmt4_gg_",
-  "--leftScrollPadding": "--leftScrollPadding_1nmt4",
-  "_rightScrollPadding": "__rightScrollPadding_1nmt4_gg_",
-  "--rightScrollPadding": "--rightScrollPadding_1nmt4",
-  "__SShadowVertical": "___SShadowVertical_1nmt4_gg_",
-  "__SShadowHorizontal": "___SShadowHorizontal_1nmt4_gg_",
-  "_leftOffset": "__leftOffset_1nmt4_gg_",
-  "_rightOffset": "__rightOffset_1nmt4_gg_"
+  "__SScrollArea": "___SScrollArea_ntjfu_gg_",
+  "__SContainer": "___SContainer_ntjfu_gg_",
+  "_scrollDirection_both": "_scrollDirection_both_ntjfu_gg_",
+  "_loading": "__loading_ntjfu_gg_",
+  "_scrollDirection_horizontal": "_scrollDirection_horizontal_ntjfu_gg_",
+  "_scrollDirection_vertical": "_scrollDirection_vertical_ntjfu_gg_",
+  "_headerHeight": "__headerHeight_ntjfu_gg_",
+  "--headerHeight": "--headerHeight_ntjfu",
+  "_leftScrollPadding": "__leftScrollPadding_ntjfu_gg_",
+  "--leftScrollPadding": "--leftScrollPadding_ntjfu",
+  "_rightScrollPadding": "__rightScrollPadding_ntjfu_gg_",
+  "--rightScrollPadding": "--rightScrollPadding_ntjfu",
+  "__SShadowVertical": "___SShadowVertical_ntjfu_gg_",
+  "__SShadowHorizontal": "___SShadowHorizontal_ntjfu_gg_",
+  "_leftOffset": "__leftOffset_ntjfu_gg_",
+  "_rightOffset": "__rightOffset_ntjfu_gg_"
 });
 import { localizedMessages } from '../../translations/__intergalactic-dynamic-locales';
 import { Body } from '../Body/Body';
@@ -433,11 +433,13 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       });
       _this.changeFocusCell(-1, cellIndex === -1 ? 0 : cellIndex, 'up');
     });
-    _defineProperty(_this, "handleContainerResizeEnd", function () {
+    _defineProperty(_this, "handleContainerResizeEnd", function (entries, observer) {
+      var _this$asProps$onResiz, _this$asProps3;
       if (_this.containerResizeEndTimeoutId) {
         clearTimeout(_this.containerResizeEndTimeoutId);
       }
       _this.containerResizeEndTimeoutId = setTimeout(_this.calculateVerticalShadow, 0);
+      (_this$asProps$onResiz = (_this$asProps3 = _this.asProps).onResize) === null || _this$asProps$onResiz === void 0 || _this$asProps$onResiz.call(_this$asProps3, entries, observer);
     });
     _defineProperty(_this, "getScrollOffsetValue", function () {
       if (!_this.headerRef.current) {
@@ -518,9 +520,9 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function componentDidMount() {
       var _this2 = this;
-      var _this$asProps3 = this.asProps,
-        headerProps = _this$asProps3.headerProps,
-        loading = _this$asProps3.loading;
+      var _this$asProps4 = this.asProps,
+        headerProps = _this$asProps4.headerProps,
+        loading = _this$asProps4.loading;
       if (headerProps !== null && headerProps !== void 0 && headerProps.sticky && !headerProps.h || loading || this.hasFixedColumn) {
         requestAnimationFrame(function () {
           _this2.forceUpdate();
@@ -534,10 +536,12 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "componentDidUpdate",
     value: function componentDidUpdate(prevProps) {
-      var _this$asProps4 = this.asProps,
-        data = _this$asProps4.data,
-        selectedRows = _this$asProps4.selectedRows,
-        columns = _this$asProps4.columns;
+      var _this3 = this;
+      var _this$asProps5 = this.asProps,
+        data = _this$asProps5.data,
+        selectedRows = _this$asProps5.selectedRows,
+        columns = _this$asProps5.columns,
+        loading = _this$asProps5.loading;
       if (prevProps.columns !== columns) {
         var cols = this.calculateColumnsFromConfig();
         this.columns = cols[0];
@@ -550,12 +554,30 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         }
       }
       if (prevProps.selectedRows !== selectedRows && selectedRows !== undefined) {
-        if (prevProps.selectedRows.length < data.length && selectedRows.length === data.length) {
+        var selectedRowsSet = new Set(selectedRows);
+        var allChecked = [];
+        var allUnchecked = [];
+        this.flatRows.forEach(function (row) {
+          if (selectedRowsSet.has(row[UNIQ_ROW_KEY])) {
+            allChecked.push(row[UNIQ_ROW_KEY]);
+          } else {
+            allUnchecked.push(row[UNIQ_ROW_KEY]);
+          }
+        });
+        if (allChecked.length === data.length) {
           this.setSelectAllMessage(true);
-        } else if (prevProps.selectedRows.length > 0 && selectedRows.length === 0) {
+        } else if (allUnchecked.length === data.length) {
           this.setSelectAllMessage(false);
         }
       }
+      if (prevProps.loading !== loading) {
+        setTimeout(function () {
+          if (document.activeElement === document.body || _this3.tableContainerRef.current && hasParent(document.activeElement, _this3.tableContainerRef.current)) {
+            var _this3$tableRef$curre;
+            (_this3$tableRef$curre = _this3.tableRef.current) === null || _this3$tableRef$curre === void 0 || _this3$tableRef$curre.focus();
+          }
+        }, 0);
+      }
     }
   }, {
     key: "componentWillUnmount",
@@ -569,9 +591,9 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "totalRows",
     get: function get() {
-      var _this$asProps5 = this.asProps,
-        totalRows = _this$asProps5.totalRows,
-        expandedRows = _this$asProps5.expandedRows;
+      var _this$asProps6 = this.asProps,
+        totalRows = _this$asProps6.totalRows,
+        expandedRows = _this$asProps6.expandedRows;
       var flatRows = this.getFlatRows();
       var expandedRowsCount = Array.from(expandedRows !== null && expandedRows !== void 0 ? expandedRows : []).reduce(function (acc, rowKey) {
         var dtRow = flatRows.find(function (el) {
@@ -603,11 +625,11 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "scrollDirection",
     get: function get() {
-      var _this$asProps6 = this.asProps,
-        w = _this$asProps6.w,
-        wMax = _this$asProps6.wMax,
-        h = _this$asProps6.h,
-        hMax = _this$asProps6.hMax;
+      var _this$asProps7 = this.asProps,
+        w = _this$asProps7.w,
+        wMax = _this$asProps7.wMax,
+        h = _this$asProps7.h,
+        hMax = _this$asProps7.hMax;
       var scrollDirection = undefined;
       var hasWidthSettings = Boolean(w) || Boolean(wMax);
       var hasHeightSettings = Boolean(h) && h !== 'fit-content' || Boolean(hMax);
@@ -628,19 +650,19 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "getHeadProps",
     value: function getHeadProps() {
-      var _this3 = this;
-      var _this$asProps7 = this.asProps,
-        use = _this$asProps7.use,
-        compact = _this$asProps7.compact,
-        sort = _this$asProps7.sort,
-        onSortChange = _this$asProps7.onSortChange,
-        getI18nText = _this$asProps7.getI18nText,
-        uid = _this$asProps7.uid,
-        headerProps = _this$asProps7.headerProps,
-        onSelectedRowsChange = _this$asProps7.onSelectedRowsChange,
-        selectedRows = _this$asProps7.selectedRows,
-        sideIndents = _this$asProps7.sideIndents,
-        variant = _this$asProps7.variant;
+      var _this4 = this;
+      var _this$asProps8 = this.asProps,
+        use = _this$asProps8.use,
+        compact = _this$asProps8.compact,
+        sort = _this$asProps8.sort,
+        onSortChange = _this$asProps8.onSortChange,
+        getI18nText = _this$asProps8.getI18nText,
+        uid = _this$asProps8.uid,
+        headerProps = _this$asProps8.headerProps,
+        onSelectedRowsChange = _this$asProps8.onSelectedRowsChange,
+        selectedRows = _this$asProps8.selectedRows,
+        sideIndents = _this$asProps8.sideIndents,
+        variant = _this$asProps8.variant;
       var _this$gridSettings = this.gridSettings,
         gridTemplateColumns = _this$gridSettings.gridTemplateColumns,
         gridTemplateAreas = _this$gridSettings.gridTemplateAreas;
@@ -665,7 +687,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
         selectedRows: selectedRows,
         flatRows: this.getFlatRows(),
         onChangeSelectAll: function onChangeSelectAll(value, e) {
-          var mappedFlatRows = _this3.getFlatRows().map(function (r) {
+          var mappedFlatRows = _this4.getFlatRows().map(function (r) {
             return r[UNIQ_ROW_KEY];
           });
           var selectedRowsSet = new Set(selectedRows);
@@ -686,28 +708,28 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "getBodyProps",
     value: function getBodyProps() {
-      var _this$asProps8 = this.asProps,
-        use = _this$asProps8.use,
-        compact = _this$asProps8.compact,
-        loading = _this$asProps8.loading,
-        getI18nText = _this$asProps8.getI18nText,
-        expandedRows = _this$asProps8.expandedRows,
-        virtualScroll = _this$asProps8.virtualScroll,
-        uid = _this$asProps8.uid,
-        rowProps = _this$asProps8.rowProps,
-        renderCell = _this$asProps8.renderCell,
-        headerProps = _this$asProps8.headerProps,
-        renderEmptyData = _this$asProps8.renderEmptyData,
-        sideIndents = _this$asProps8.sideIndents,
-        selectedRows = _this$asProps8.selectedRows,
-        accordionDuration = _this$asProps8.accordionDuration,
-        accordionMode = _this$asProps8.accordionMode,
-        rawData = _this$asProps8.data,
-        renderCellOverlay = _this$asProps8.renderCellOverlay,
-        limit = _this$asProps8.limit,
-        variant = _this$asProps8.variant,
-        totalRows = _this$asProps8.totalRows,
-        accordionAnimationRows = _this$asProps8.accordionAnimationRows;
+      var _this$asProps9 = this.asProps,
+        use = _this$asProps9.use,
+        compact = _this$asProps9.compact,
+        loading = _this$asProps9.loading,
+        getI18nText = _this$asProps9.getI18nText,
+        expandedRows = _this$asProps9.expandedRows,
+        virtualScroll = _this$asProps9.virtualScroll,
+        uid = _this$asProps9.uid,
+        rowProps = _this$asProps9.rowProps,
+        renderCell = _this$asProps9.renderCell,
+        headerProps = _this$asProps9.headerProps,
+        renderEmptyData = _this$asProps9.renderEmptyData,
+        sideIndents = _this$asProps9.sideIndents,
+        selectedRows = _this$asProps9.selectedRows,
+        accordionDuration = _this$asProps9.accordionDuration,
+        accordionMode = _this$asProps9.accordionMode,
+        rawData = _this$asProps9.data,
+        renderCellOverlay = _this$asProps9.renderCellOverlay,
+        limit = _this$asProps9.limit,
+        variant = _this$asProps9.variant,
+        totalRows = _this$asProps9.totalRows,
+        accordionAnimationRows = _this$asProps9.accordionAnimationRows;
       var _this$gridSettings2 = this.gridSettings,
         gridTemplateColumns = _this$gridSettings2.gridTemplateColumns,
         gridTemplateAreas = _this$gridSettings2.gridTemplateAreas;
@@ -787,20 +809,20 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       var _ref = this.asProps,
         _ref2;
       var SDataTable = Box;
-      var _this$asProps9 = this.asProps,
-        Children = _this$asProps9.Children,
-        styles = _this$asProps9.styles,
-        w = _this$asProps9.w,
-        wMax = _this$asProps9.wMax,
-        wMin = _this$asProps9.wMin,
-        h = _this$asProps9.h,
-        hMax = _this$asProps9.hMax,
-        hMin = _this$asProps9.hMin,
-        virtualScroll = _this$asProps9.virtualScroll,
-        children = _this$asProps9.children,
-        headerProps = _this$asProps9.headerProps,
-        loading = _this$asProps9.loading,
-        selectedRows = _this$asProps9.selectedRows;
+      var _this$asProps0 = this.asProps,
+        Children = _this$asProps0.Children,
+        styles = _this$asProps0.styles,
+        w = _this$asProps0.w,
+        wMax = _this$asProps0.wMax,
+        wMin = _this$asProps0.wMin,
+        h = _this$asProps0.h,
+        hMax = _this$asProps0.hMax,
+        hMin = _this$asProps0.hMin,
+        virtualScroll = _this$asProps0.virtualScroll,
+        children = _this$asProps0.children,
+        headerProps = _this$asProps0.headerProps,
+        loading = _this$asProps0.loading,
+        selectedRows = _this$asProps0.selectedRows;
       var _this$getScrollOffset = this.getScrollOffsetValue(),
         _this$getScrollOffset2 = _slicedToArray(_this$getScrollOffset, 2),
         offsetLeftSum = _this$getScrollOffset2[0],
@@ -887,7 +909,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "calculateColumnsFromConfig",
     value: function calculateColumnsFromConfig() {
-      var _this4 = this;
+      var _this5 = this;
       var _this$props = this.props,
         columns = _this$props.columns,
         data = _this$props.data,
@@ -923,7 +945,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
           parent: parent
         });
         if (column.fixed) {
-          _this4.hasFixedColumn = true;
+          _this5.hasFixedColumn = true;
         }
         return column;
       };
@@ -947,7 +969,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
       columns.forEach(function (child, i) {
         if (childIsColumn(child)) {
           var col = makeColumn(child);
-          col.gridArea = "1 / ".concat(gridColumnIndex, " / ").concat(_this4.hasGroups ? '3' : '2', " / ").concat(gridColumnIndex + 1);
+          col.gridArea = "1 / ".concat(gridColumnIndex, " / ").concat(_this5.hasGroups ? '3' : '2', " / ").concat(gridColumnIndex + 1);
           gridColumnIndex++;
           calculatedColumns.push(col);
           treeColumns.push(col);
@@ -958,14 +980,14 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
           var Group = makeColumn(child);
           var childCount = child.columns.length;
           var initGridColumn = gridColumnIndex;
-          var groupedRow = _this4.hasGroups ? 2 : 1;
+          var groupedRow = _this5.hasGroups ? 2 : 1;
           Group.columns = [];
           Group.children = child.children;
           child.columns.forEach(function (child, j) {
             var _Group$columns;
             var isFirst = j === 0;
             var isLast = j === childCount - 1;
-            var col = makeColumn(child, Group, isFirst, isLast, _this4.hasGroups);
+            var col = makeColumn(child, Group, isFirst, isLast, _this5.hasGroups);
             if (i === 0 && j === 0 && data.some(function (d) {
               return d[ACCORDION];
             })) {
@@ -983,7 +1005,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
             (_Group$columns = Group.columns) === null || _Group$columns === void 0 || _Group$columns.push(col);
           });
           treeColumns.push(Group);
-          _this4.gridAreaGroupMap.set(groupIndex, "1 / ".concat(initGridColumn, " / 2 / ").concat(gridColumnIndex));
+          _this5.gridAreaGroupMap.set(groupIndex, "1 / ".concat(initGridColumn, " / 2 / ").concat(gridColumnIndex));
           groupIndex++;
         }
       });
@@ -1012,7 +1034,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
   }, {
     key: "getRows",
     value: function getRows() {
-      var _this5 = this;
+      var _this6 = this;
       var columns = this.columns;
       // @ts-ignore
       var _this$props2 = this.props,
@@ -1038,7 +1060,7 @@ var DataTableRoot = /*#__PURE__*/function (_Component) {
           var _ref5 = _slicedToArray(_ref4, 2),
             key = _ref5[0],
             value = _ref5[1];
-          var columnsToRow = key.split(_this5.columnsSplitter);
+          var columnsToRow = key.split(_this6.columnsSplitter);
           if (columnsToRow.length === 1) {
             acc[key] = value !== null && value !== void 0 ? value : '';
             columns["delete"](key);