@carbon/ibm-products 2.59.0 → 2.60.0

package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js

@@ -56,19 +56,19 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
     cellSize: cellSize
   }) || {};
   React.useEffect(function () {
-    if ((previousState === null || previousState === void 0 ? void 0 : previousState.cellSize) !== cellSize) {
+    if ((previousState === null || previousState === undefined ? undefined : previousState.cellSize) !== cellSize) {
       var _current;
-      var scrollContainer = ref === null || ref === void 0 || (_current = ref.current) === null || _current === void 0 ? void 0 : _current.querySelector(".".concat(blockClass, "__list--container"));
-      var hasScrollBar = (scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollHeight) && (scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.clientHeight) && (scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollHeight) > (scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.clientHeight);
+      var scrollContainer = ref === null || ref === undefined || (_current = ref.current) === null || _current === undefined ? undefined : _current.querySelector(".".concat(blockClass, "__list--container"));
+      var hasScrollBar = (scrollContainer === null || scrollContainer === undefined ? undefined : scrollContainer.scrollHeight) && (scrollContainer === null || scrollContainer === undefined ? undefined : scrollContainer.clientHeight) && (scrollContainer === null || scrollContainer === undefined ? undefined : scrollContainer.scrollHeight) > (scrollContainer === null || scrollContainer === undefined ? undefined : scrollContainer.clientHeight);
       var scrollBarValue = hasScrollBar ? 0 : scrollBarSize;
 
       // fix for a11y violation element_scrollable_tabbable
-      if (!(scrollContainer !== null && scrollContainer !== void 0 && scrollContainer.getAttribute('tabIndex'))) {
-        scrollContainer === null || scrollContainer === void 0 || scrollContainer.setAttribute('tabIndex', '0');
+      if (!(scrollContainer !== null && scrollContainer !== undefined && scrollContainer.getAttribute('tabIndex'))) {
+        scrollContainer === null || scrollContainer === undefined || scrollContainer.setAttribute('tabIndex', '0');
       }
       setScrollBarSizeValue(scrollBarValue);
     }
-  }, [cellSize, ref, scrollBarSize, previousState === null || previousState === void 0 ? void 0 : previousState.cellSize]);
+  }, [cellSize, ref, scrollBarSize, previousState === null || previousState === undefined ? undefined : previousState.cellSize]);
   var handleColumnHeaderClick = function handleColumnHeaderClick(index) {
     return function (event) {
       var isHoldingCommandKey = checkForHoldingKey.checkForHoldingKey(event, 'cmd');
@@ -109,10 +109,10 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         // Remove columns, need to call handleHeaderCellSelection
         return;
       }
-      var selectionAreaToClone = selectionAreas === null || selectionAreas === void 0 ? void 0 : selectionAreas.filter(function (item) {
-        return (item === null || item === void 0 ? void 0 : item.matcher) === currentMatcher;
+      var selectionAreaToClone = selectionAreas === null || selectionAreas === undefined ? undefined : selectionAreas.filter(function (item) {
+        return (item === null || item === undefined ? undefined : item.matcher) === currentMatcher;
       });
-      var selectionAreaElement = ref.current.querySelector("[data-matcher-id=\"".concat(selectionAreaToClone === null || selectionAreaToClone === void 0 || (_selectionAreaToClone = selectionAreaToClone[0]) === null || _selectionAreaToClone === void 0 ? void 0 : _selectionAreaToClone.matcher, "\"]"));
+      var selectionAreaElement = ref.current.querySelector("[data-matcher-id=\"".concat(selectionAreaToClone === null || selectionAreaToClone === undefined || (_selectionAreaToClone = selectionAreaToClone[0]) === null || _selectionAreaToClone === undefined ? undefined : _selectionAreaToClone.matcher, "\"]"));
       if (selectionAreaElement) {
         selectionAreaElement.classList.add("".concat(blockClass, "__selection-area--element"));
       }
@@ -123,12 +123,12 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       var headerButtonCoords = event.target.getBoundingClientRect();
       var headerIndex = event.target.getAttribute('data-column-index');
       var offsetXValue = clickXPosition - headerButtonCoords.left;
-      var lowestColumnIndexFromSelectionArea = Math.min((selectionAreaToClone === null || selectionAreaToClone === void 0 || (_selectionAreaToClone2 = selectionAreaToClone[0]) === null || _selectionAreaToClone2 === void 0 || (_selectionAreaToClone2 = _selectionAreaToClone2.point1) === null || _selectionAreaToClone2 === void 0 ? void 0 : _selectionAreaToClone2.column) || 0, (selectionAreaToClone === null || selectionAreaToClone === void 0 || (_selectionAreaToClone3 = selectionAreaToClone[0]) === null || _selectionAreaToClone3 === void 0 || (_selectionAreaToClone3 = _selectionAreaToClone3.point2) === null || _selectionAreaToClone3 === void 0 ? void 0 : _selectionAreaToClone3.column) || 0);
-      var selectionAreaCoords = (selectionAreaElement === null || selectionAreaElement === void 0 ? void 0 : selectionAreaElement.getBoundingClientRect()) || new DOMRect();
-      var updatedOffsetDifference = lowestColumnIndexFromSelectionArea < parseInt(headerIndex) ? offsetXValue + (headerButtonCoords.left - (selectionAreaCoords === null || selectionAreaCoords === void 0 ? void 0 : selectionAreaCoords.left)) : offsetXValue;
-      var bodyContainer = (_document = document) === null || _document === void 0 || (_document = _document.querySelector(".".concat(blockClass, "__list--container"))) === null || _document === void 0 ? void 0 : _document.firstElementChild;
-      var selectionAreaClonedElement = selectionAreaElement === null || selectionAreaElement === void 0 ? void 0 : selectionAreaElement.cloneNode();
-      var reorderIndicatorLine = selectionAreaElement === null || selectionAreaElement === void 0 ? void 0 : selectionAreaElement.cloneNode();
+      var lowestColumnIndexFromSelectionArea = Math.min((selectionAreaToClone === null || selectionAreaToClone === undefined || (_selectionAreaToClone2 = selectionAreaToClone[0]) === null || _selectionAreaToClone2 === undefined || (_selectionAreaToClone2 = _selectionAreaToClone2.point1) === null || _selectionAreaToClone2 === undefined ? undefined : _selectionAreaToClone2.column) || 0, (selectionAreaToClone === null || selectionAreaToClone === undefined || (_selectionAreaToClone3 = selectionAreaToClone[0]) === null || _selectionAreaToClone3 === undefined || (_selectionAreaToClone3 = _selectionAreaToClone3.point2) === null || _selectionAreaToClone3 === undefined ? undefined : _selectionAreaToClone3.column) || 0);
+      var selectionAreaCoords = (selectionAreaElement === null || selectionAreaElement === undefined ? undefined : selectionAreaElement.getBoundingClientRect()) || new DOMRect();
+      var updatedOffsetDifference = lowestColumnIndexFromSelectionArea < parseInt(headerIndex) ? offsetXValue + (headerButtonCoords.left - (selectionAreaCoords === null || selectionAreaCoords === undefined ? undefined : selectionAreaCoords.left)) : offsetXValue;
+      var bodyContainer = (_document = document) === null || _document === undefined || (_document = _document.querySelector(".".concat(blockClass, "__list--container"))) === null || _document === undefined ? undefined : _document.firstElementChild;
+      var selectionAreaClonedElement = selectionAreaElement === null || selectionAreaElement === undefined ? undefined : selectionAreaElement.cloneNode();
+      var reorderIndicatorLine = selectionAreaElement === null || selectionAreaElement === undefined ? undefined : selectionAreaElement.cloneNode();
       if (reorderIndicatorLine) {
         reorderIndicatorLine.className = "".concat(blockClass, "__reorder-indicator-line");
         reorderIndicatorLine.style.width = layout.px(2);
@@ -136,9 +136,9 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       selectionAreaClonedElement.classList.add("".concat(blockClass, "__selection-area--element-cloned"));
       selectionAreaClonedElement.setAttribute('data-clone-offset-x', "".concat(updatedOffsetDifference));
       selectionAreaClonedElement.setAttribute('data-column-index-original', index);
-      bodyContainer === null || bodyContainer === void 0 || bodyContainer.appendChild(selectionAreaClonedElement);
-      bodyContainer === null || bodyContainer === void 0 || bodyContainer.appendChild(reorderIndicatorLine);
-      setHeaderCellHoldActive === null || setHeaderCellHoldActive === void 0 || setHeaderCellHoldActive(true);
+      bodyContainer === null || bodyContainer === undefined || bodyContainer.appendChild(selectionAreaClonedElement);
+      bodyContainer === null || bodyContainer === undefined || bodyContainer.appendChild(reorderIndicatorLine);
+      setHeaderCellHoldActive === null || setHeaderCellHoldActive === undefined || setHeaderCellHoldActive(true);
     };
   };
   useSpreadsheetMouseMove.useSpreadsheetMouseMove({
@@ -149,7 +149,7 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   return /*#__PURE__*/React.createElement("div", {
     className: cx("".concat(blockClass, "__header--container")),
     role: "rowgroup"
-  }, headerGroups === null || headerGroups === void 0 ? void 0 : headerGroups.map(function (headerGroup, index) {
+  }, headerGroups === null || headerGroups === undefined ? undefined : headerGroups.map(function (headerGroup, index) {
     var headerProps = propsHelper.prepareProps(headerGroup.getHeaderGroupProps(), 'key');
     return /*#__PURE__*/React.createElement("div", _rollupPluginBabelHelpers.extends({
       key: "header_".concat(index)
@@ -171,8 +171,8 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       role: "columnheader",
       className: "".concat(blockClass, "__select-all-cell-container"),
       style: {
-        width: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeaderWidth,
-        height: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeight
+        width: defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.rowHeaderWidth,
+        height: defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.rowHeight
       }
     }, /*#__PURE__*/React.createElement("button", {
       id: "".concat(blockClass, "__cell--header--header"),
@@ -180,12 +180,12 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       "data-column-index": "header",
       type: "button",
       style: {
-        width: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeaderWidth
+        width: defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.rowHeaderWidth
       },
       tabIndex: -1,
       "aria-label": selectAllAriaLabel,
       onClick: handleSelectAllClick,
-      className: cx("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element"), "".concat(blockClass, "__th--select-all"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__th--active-header"), (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === 'header' && (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header'))
+      className: cx("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element"), "".concat(blockClass, "__th--select-all"), _rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__th--active-header"), (activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column) === 'header' && (activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row) === 'header'))
     }, "\xA0")), headerGroup.headers.map(function (column, index) {
       var colProps = propsHelper.prepareProps(column.getHeaderProps(), 'key');
       var selectedHeader = checkSelectedHeaderCell.checkSelectedHeaderCell(index, selectionAreas, 'column', rows);
@@ -204,10 +204,10 @@ var DataSpreadsheetHeader = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         } : undefined,
         onClick: !selectedHeader ? handleColumnHeaderClick(index) : undefined,
         style: {
-          height: defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeight,
-          width: (column === null || column === void 0 ? void 0 : column.width) || (defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.width)
+          height: defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.rowHeight,
+          width: (column === null || column === undefined ? undefined : column.width) || (defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.width)
         },
-        className: cx("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__th--active-header"), (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === index || checkActiveHeaderCell.checkActiveHeaderCell(index, selectionAreas, 'column')), "".concat(blockClass, "__th--active-header-disabledSwapping"), disableColumnSwapping || readOnlyTable), "".concat(blockClass, "__th--selected-header"), selectedHeader), "".concat(blockClass, "__th--selected-header-reorder-active"), selectedHeaderReorderActive)),
+        className: cx("".concat(blockClass, "__th"), "".concat(blockClass, "--interactive-cell-element"), _rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty(_rollupPluginBabelHelpers.defineProperty({}, "".concat(blockClass, "__th--active-header"), (activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column) === index || checkActiveHeaderCell.checkActiveHeaderCell(index, selectionAreas, 'column')), "".concat(blockClass, "__th--active-header-disabledSwapping"), disableColumnSwapping || readOnlyTable), "".concat(blockClass, "__th--selected-header"), selectedHeader), "".concat(blockClass, "__th--selected-header-reorder-active"), selectedHeaderReorderActive)),
         type: "button"
       }, column.render('Header')));
     }));

package/lib/components/DataSpreadsheet/hooks/useMoveActiveCell.js

@@ -24,9 +24,9 @@ var useMoveActiveCell = function useMoveActiveCell(_ref) {
     performCreateActiveCell();
   }, [activeCellContent, performCreateActiveCell, isActiveHeaderCellChanged]);
   performCreateActiveCell = React.useCallback(function () {
-    var activeCellPlacementElement = spreadsheetRef === null || spreadsheetRef === void 0 ? void 0 : spreadsheetRef.current.querySelector("[data-row-index=\"".concat(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row, "\"][data-column-index=\"").concat(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column, "\"]"));
-    var shouldPlaceActiveCellInHeader = (activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === 'header' && true;
-    var selectAllElement = spreadsheetRef === null || spreadsheetRef === void 0 ? void 0 : spreadsheetRef.current.querySelector("[data-row-index=\"header\"][data-column-index=\"header\"]");
+    var activeCellPlacementElement = spreadsheetRef === null || spreadsheetRef === undefined ? undefined : spreadsheetRef.current.querySelector("[data-row-index=\"".concat(activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row, "\"][data-column-index=\"").concat(activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column, "\"]"));
+    var shouldPlaceActiveCellInHeader = (activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row) === 'header' && true;
+    var selectAllElement = spreadsheetRef === null || spreadsheetRef === undefined ? undefined : spreadsheetRef.current.querySelector("[data-row-index=\"header\"][data-column-index=\"header\"]");
     if (containerHasFocus) {
       createActiveCell({
         placementElement: activeCellCoordinates ? activeCellPlacementElement : selectAllElement,

package/lib/components/DataSpreadsheet/hooks/useMultipleKeyTracking.js

@@ -100,7 +100,7 @@ var useMultipleKeyTracking = function useMultipleKeyTracking(_ref) {
         }
       };
     }
-    if (previousState !== null && previousState !== void 0 && previousState.windowFocused && !windowFocused) {
+    if (previousState !== null && previousState !== undefined && previousState.windowFocused && !windowFocused) {
       setKeysPressedList([]);
     }
     // Remove handlers if the spreadsheet container loses focus
@@ -108,11 +108,11 @@ var useMultipleKeyTracking = function useMultipleKeyTracking(_ref) {
     if (ref && !containerHasFocus || isEditing) {
       ref.current.onkeydown = undefined;
       ref.current.onkeyup = undefined;
-      if (!(previousState !== null && previousState !== void 0 && previousState.isEditing) && isEditing || previousState !== null && previousState !== void 0 && previousState.containerHasFocus && !containerHasFocus) {
+      if (!(previousState !== null && previousState !== undefined && previousState.isEditing) && isEditing || previousState !== null && previousState !== undefined && previousState.containerHasFocus && !containerHasFocus) {
         setKeysPressedList([]);
       }
     }
-  }, [keysPressedList, containerHasFocus, ref, isEditing, previousState === null || previousState === void 0 ? void 0 : previousState.isEditing, previousState === null || previousState === void 0 ? void 0 : previousState.containerHasFocus, windowFocused, previousState === null || previousState === void 0 ? void 0 : previousState.windowFocused, usingMac]);
+  }, [keysPressedList, containerHasFocus, ref, isEditing, previousState === null || previousState === undefined ? undefined : previousState.isEditing, previousState === null || previousState === undefined ? undefined : previousState.containerHasFocus, windowFocused, previousState === null || previousState === undefined ? undefined : previousState.windowFocused, usingMac]);
   return {
     keysPressedList: keysPressedList,
     windowFocused: windowFocused,

package/lib/components/DataSpreadsheet/hooks/useResetSpreadsheetFocus.js

@@ -12,7 +12,7 @@ var settings = require('../../../settings.js');
 
 var useResetSpreadsheetFocus = function useResetSpreadsheetFocus(_ref) {
   var _ref$blockClass = _ref.blockClass,
-    blockClass = _ref$blockClass === void 0 ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
+    blockClass = _ref$blockClass === undefined ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
     focusedElement = _ref.focusedElement,
     removeActiveCell = _ref.removeActiveCell,
     setContainerHasFocus = _ref.setContainerHasFocus;

package/lib/components/DataSpreadsheet/hooks/useSpreadsheetEdit.js

@@ -24,7 +24,7 @@ var useSpreadsheetEdit = function useSpreadsheetEdit(_ref) {
     defaultColumn = _ref.defaultColumn,
     cellEditorValue = _ref.cellEditorValue,
     _ref$blockClass = _ref.blockClass,
-    blockClass = _ref$blockClass === void 0 ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass;
+    blockClass = _ref$blockClass === undefined ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass;
   var _useState = React.useState(null),
     _useState2 = _rollupPluginBabelHelpers.slicedToArray(_useState, 2),
     nextIndex = _useState2[0],
@@ -33,28 +33,28 @@ var useSpreadsheetEdit = function useSpreadsheetEdit(_ref) {
     nextIndex: nextIndex
   });
   React.useEffect(function () {
-    if (!(previousState !== null && previousState !== void 0 && previousState.nextIndex)) {
-      setNextIndex(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column);
+    if (!(previousState !== null && previousState !== undefined && previousState.nextIndex)) {
+      setNextIndex(activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column);
     }
-  }, [previousState === null || previousState === void 0 ? void 0 : previousState.nextIndex, activeCellCoordinates]);
+  }, [previousState === null || previousState === undefined ? undefined : previousState.nextIndex, activeCellCoordinates]);
   React.useEffect(function () {
     var rulerWidth = cellEditorRulerRef.current.offsetWidth;
     var cellEditorCurrentWidth = parseInt(cellEditorRef.current.style.width);
     if (isEditing) {
       var _rows$activeCellCoord, _cellProps$column, _cellEditorRef$curren;
-      var cellProps = (_rows$activeCellCoord = rows[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row]) === null || _rows$activeCellCoord === void 0 ? void 0 : _rows$activeCellCoord.cells[activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column];
-      var activeCellLeftPosition = activeCellRef === null || activeCellRef === void 0 ? void 0 : activeCellRef.current.style.left;
-      var activeCellTopPosition = activeCellRef === null || activeCellRef === void 0 ? void 0 : activeCellRef.current.style.top;
+      var cellProps = (_rows$activeCellCoord = rows[activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row]) === null || _rows$activeCellCoord === undefined ? undefined : _rows$activeCellCoord.cells[activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column];
+      var activeCellLeftPosition = activeCellRef === null || activeCellRef === undefined ? undefined : activeCellRef.current.style.left;
+      var activeCellTopPosition = activeCellRef === null || activeCellRef === undefined ? undefined : activeCellRef.current.style.top;
       cellEditorRef.current.style.left = activeCellLeftPosition;
       cellEditorRef.current.style.top = activeCellTopPosition;
       cellEditorRef.current.style.display = 'block';
-      cellEditorRef.current.style.height = activeCellRef === null || activeCellRef === void 0 ? void 0 : activeCellRef.current.style.height;
-      cellEditorRef.current.style.paddingTop = "".concat((parseInt(activeCellRef === null || activeCellRef === void 0 ? void 0 : activeCellRef.current.style.height) - 16) / 2 - 1, "px"); // calculate paddingTop based on cellHeight which could be variable depending on the cellSize prop
-      cellEditorRef.current.style.textAlign = (cellProps === null || cellProps === void 0 || (_cellProps$column = cellProps.column) === null || _cellProps$column === void 0 ? void 0 : _cellProps$column.placement) === 'right' ? 'right' : 'left';
-      (_cellEditorRef$curren = cellEditorRef.current) === null || _cellEditorRef$curren === void 0 || _cellEditorRef$curren.focus();
+      cellEditorRef.current.style.height = activeCellRef === null || activeCellRef === undefined ? undefined : activeCellRef.current.style.height;
+      cellEditorRef.current.style.paddingTop = "".concat((parseInt(activeCellRef === null || activeCellRef === undefined ? undefined : activeCellRef.current.style.height) - 16) / 2 - 1, "px"); // calculate paddingTop based on cellHeight which could be variable depending on the cellSize prop
+      cellEditorRef.current.style.textAlign = (cellProps === null || cellProps === undefined || (_cellProps$column = cellProps.column) === null || _cellProps$column === undefined ? undefined : _cellProps$column.placement) === 'right' ? 'right' : 'left';
+      (_cellEditorRef$curren = cellEditorRef.current) === null || _cellEditorRef$curren === undefined || _cellEditorRef$curren.focus();
       if (rulerWidth < cellEditorCurrentWidth) {
         var _visibleColumns$nextI;
-        var currentColumnWidth = ((_visibleColumns$nextI = visibleColumns[nextIndex]) === null || _visibleColumns$nextI === void 0 ? void 0 : _visibleColumns$nextI.width) || (defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.width);
+        var currentColumnWidth = ((_visibleColumns$nextI = visibleColumns[nextIndex]) === null || _visibleColumns$nextI === undefined ? undefined : _visibleColumns$nextI.width) || (defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.width);
         // If the contents of the cell editor is deleted past the point of the next column
         if (rulerWidth < cellEditorCurrentWidth - currentColumnWidth) {
           cellEditorRef.current.style.width = layout.px(parseInt(cellEditorRef.current.style.width) - currentColumnWidth);
@@ -76,8 +76,8 @@ var useSpreadsheetEdit = function useSpreadsheetEdit(_ref) {
           return prev + 1;
         });
         var onLastColumnIndex = nextIndex + 1 === visibleColumns.length;
-        var nextColumnWidth = onLastColumnIndex ? 0 : ((_visibleColumns = visibleColumns[nextIndex + 1]) === null || _visibleColumns === void 0 ? void 0 : _visibleColumns.width) || (defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.width);
-        var startingRowPosition = activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row;
+        var nextColumnWidth = onLastColumnIndex ? 0 : ((_visibleColumns = visibleColumns[nextIndex + 1]) === null || _visibleColumns === undefined ? undefined : _visibleColumns.width) || (defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.width);
+        var startingRowPosition = activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row;
         var totalRows = rows.length;
         var totalCellEditorMaxHeight = (totalRows - startingRowPosition) * defaultColumn.rowHeight;
         cellEditorRef.current.style.maxHeight = layout.px(totalCellEditorMaxHeight);
@@ -98,9 +98,9 @@ var useSpreadsheetEdit = function useSpreadsheetEdit(_ref) {
       cellEditorRef.current.style.display = 'none';
       cellEditorRef.current.blur();
       activeCellRef.current.focus();
-      setNextIndex(activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column);
+      setNextIndex(activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column);
     }
-  }, [isEditing, activeCellCoordinates, rows, cellEditorValue, defaultColumn, activeCellRef, cellEditorRef, cellEditorRulerRef, visibleColumns, blockClass, previousState === null || previousState === void 0 ? void 0 : previousState.cellEditorValue, nextIndex]);
+  }, [isEditing, activeCellCoordinates, rows, cellEditorValue, defaultColumn, activeCellRef, cellEditorRef, cellEditorRulerRef, visibleColumns, blockClass, previousState === null || previousState === undefined ? undefined : previousState.cellEditorValue, nextIndex]);
 };
 
 exports.useSpreadsheetEdit = useSpreadsheetEdit;

package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseMove.js

@@ -17,14 +17,14 @@ var moveColumnIndicatorLine = require('../utils/moveColumnIndicatorLine.js');
 var useSpreadsheetMouseMove = function useSpreadsheetMouseMove(_ref) {
   var ref = _ref.ref,
     _ref$blockClass = _ref.blockClass,
-    blockClass = _ref$blockClass === void 0 ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
+    blockClass = _ref$blockClass === undefined ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
     headerCellHoldActive = _ref.headerCellHoldActive,
     defaultColumn = _ref.defaultColumn;
   React.useEffect(function () {
-    var handleMouseMove = function handleMouseMove(event) {
+    var _handleMouseMove = function handleMouseMove(event) {
       var clonedSelectionElement = ref.current.querySelector(".".concat(blockClass, "__selection-area--element-cloned"));
       if (clonedSelectionElement) {
-        ref.current.addEventListener('mousemove', handleMouseMove);
+        ref.current.addEventListener('mousemove', _handleMouseMove);
       }
       var spreadsheetCoords = ref.current.getBoundingClientRect();
       var listContainer = ref.current.querySelector(".".concat(blockClass, "__list--container"));
@@ -38,10 +38,10 @@ var useSpreadsheetMouseMove = function useSpreadsheetMouseMove(_ref) {
       var spreadsheetWrapperElement = ref.current;
       spreadsheetWrapperElement.getBoundingClientRect();
       var xPositionRelativeToSpreadsheet = event.clientX - spreadsheetCoords.left;
-      var offsetXValue = clonedSelectionElement === null || clonedSelectionElement === void 0 ? void 0 : clonedSelectionElement.getAttribute('data-clone-offset-x');
+      var offsetXValue = clonedSelectionElement === null || clonedSelectionElement === undefined ? undefined : clonedSelectionElement.getAttribute('data-clone-offset-x');
       var totalSpreadsheetScrollingWidth = listContainer.scrollWidth;
       var clonedSelectionWidth = clonedSelectionElement.offsetWidth;
-      var clonePlacement = Math.max(xPositionRelativeToSpreadsheet - offsetXValue, defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.rowHeaderWidth);
+      var clonePlacement = Math.max(xPositionRelativeToSpreadsheet - offsetXValue, defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.rowHeaderWidth);
       var leftPosition = totalSpreadsheetScrollingWidth - clonedSelectionWidth >= clonePlacement ? clonePlacement + scrollAmount : totalSpreadsheetScrollingWidth - clonedSelectionWidth;
       // Moves the position of the cloned selection area to follow mouse, and
       // add the amount horizontally scrolled
@@ -50,14 +50,14 @@ var useSpreadsheetMouseMove = function useSpreadsheetMouseMove(_ref) {
       }
     };
     if (headerCellHoldActive) {
-      ref.current.addEventListener('mousemove', handleMouseMove);
+      ref.current.addEventListener('mousemove', _handleMouseMove);
     }
     var spreadsheetRef = ref.current;
     if (!headerCellHoldActive) {
-      spreadsheetRef === null || spreadsheetRef === void 0 || spreadsheetRef.removeEventListener('mousemove', handleMouseMove);
+      spreadsheetRef === null || spreadsheetRef === undefined || spreadsheetRef.removeEventListener('mousemove', _handleMouseMove);
     }
     return function () {
-      spreadsheetRef === null || spreadsheetRef === void 0 || spreadsheetRef.removeEventListener('mousemove', handleMouseMove);
+      spreadsheetRef === null || spreadsheetRef === undefined || spreadsheetRef.removeEventListener('mousemove', _handleMouseMove);
     };
   });
 };

package/lib/components/DataSpreadsheet/hooks/useSpreadsheetMouseUp.js

@@ -22,7 +22,7 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
     setValidStartingPoint = _ref.setValidStartingPoint,
     validStartingPoint = _ref.validStartingPoint,
     _ref$blockClass = _ref.blockClass,
-    blockClass = _ref$blockClass === void 0 ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
+    blockClass = _ref$blockClass === undefined ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
     ref = _ref.ref,
     setHeaderCellHoldActive = _ref.setHeaderCellHoldActive,
     setColumnOrder = _ref.setColumnOrder,
@@ -36,7 +36,7 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
     var handleMouseUp = function handleMouseUp(event) {
       var _selectionAreas$;
       var isHoldingColumn = false;
-      if (selectionAreas !== null && selectionAreas !== void 0 && (_selectionAreas$ = selectionAreas[0]) !== null && _selectionAreas$ !== void 0 && _selectionAreas$.header && selectionAreas[0].header.type === 'column') {
+      if (selectionAreas !== null && selectionAreas !== undefined && (_selectionAreas$ = selectionAreas[0]) !== null && _selectionAreas$ !== undefined && _selectionAreas$.header && selectionAreas[0].header.type === 'column') {
         isHoldingColumn = true;
       }
       // Remove the cloned selection area on mouse up
@@ -51,10 +51,10 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
         if (selectionAreaCloneElement) {
           var _selectionAreaElement;
           var closestCell = event.target.closest(".".concat(blockClass, "--interactive-cell-element"));
-          var newColumnIndex = parseInt === null || parseInt === void 0 ? void 0 : parseInt(closestCell === null || closestCell === void 0 ? void 0 : closestCell.getAttribute('data-column-index'));
-          var originalColumnIndex = parseInt === null || parseInt === void 0 ? void 0 : parseInt(selectionAreaCloneElement === null || selectionAreaCloneElement === void 0 ? void 0 : selectionAreaCloneElement.getAttribute('data-column-index-original'));
+          var newColumnIndex = parseInt === null || parseInt === undefined ? undefined : parseInt(closestCell === null || closestCell === undefined ? undefined : closestCell.getAttribute('data-column-index'));
+          var originalColumnIndex = parseInt === null || parseInt === undefined ? undefined : parseInt(selectionAreaCloneElement === null || selectionAreaCloneElement === undefined ? undefined : selectionAreaCloneElement.getAttribute('data-column-index-original'));
           var selectionAreaToClone = selectionAreas.filter(function (item) {
-            return (item === null || item === void 0 ? void 0 : item.matcher) === currentMatcher;
+            return (item === null || item === undefined ? undefined : item.matcher) === currentMatcher;
           });
           var selectionAreaIndexArray = selectionAreaToClone[0].header.selectedIndexList;
           var columnToMoveToElement = ref.current.querySelector("[data-row-index=\"header\"][data-column-index=\"".concat(newColumnIndex, "\"]"));
@@ -135,9 +135,9 @@ var useSpreadsheetMouseUp = function useSpreadsheetMouseUp(_ref) {
           }
           // Remove the cloned column and indicator elements
           var indicatorLineElement = ref.current.querySelector(".".concat(blockClass, "__reorder-indicator-line"));
-          indicatorLineElement === null || indicatorLineElement === void 0 || indicatorLineElement.remove();
-          selectionAreaCloneElement === null || selectionAreaCloneElement === void 0 || selectionAreaCloneElement.remove();
-          selectionAreaElement === null || selectionAreaElement === void 0 || (_selectionAreaElement = selectionAreaElement.classList) === null || _selectionAreaElement === void 0 || _selectionAreaElement.remove("".concat(blockClass, "__selection-area--element"));
+          indicatorLineElement === null || indicatorLineElement === undefined || indicatorLineElement.remove();
+          selectionAreaCloneElement === null || selectionAreaCloneElement === undefined || selectionAreaCloneElement.remove();
+          selectionAreaElement === null || selectionAreaElement === undefined || (_selectionAreaElement = selectionAreaElement.classList) === null || _selectionAreaElement === undefined || _selectionAreaElement.remove("".concat(blockClass, "__selection-area--element"));
           setSelectedHeaderReorderActive(false);
         }
       }

package/lib/components/DataSpreadsheet/hooks/useSpreadsheetOutsideClick.js

@@ -16,7 +16,7 @@ var useSpreadsheetOutsideClick = function useSpreadsheetOutsideClick(_ref) {
   var isBlurSpreadsheet = _ref.isBlurSpreadsheet,
     spreadsheetRef = _ref.spreadsheetRef,
     _ref$blockClass = _ref.blockClass,
-    blockClass = _ref$blockClass === void 0 ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
+    blockClass = _ref$blockClass === undefined ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
     setActiveCellCoordinates = _ref.setActiveCellCoordinates,
     setSelectionAreas = _ref.setSelectionAreas,
     removeActiveCell = _ref.removeActiveCell,

package/lib/components/DataSpreadsheet/utils/checkActiveHeaderCell.js

@@ -18,14 +18,14 @@ var checkActiveHeaderCell = function checkActiveHeaderCell(headerIndex, selectio
   var activeRowIndexes = [];
   areasCloned.forEach(function (area) {
     var _area$point, _area$point2, _area$point3, _area$point4;
-    var greatestRowIndex = Math.max((_area$point = area.point1) === null || _area$point === void 0 ? void 0 : _area$point[headerType], (_area$point2 = area.point2) === null || _area$point2 === void 0 ? void 0 : _area$point2[headerType]);
-    var lowestRowIndex = Math.min((_area$point3 = area.point1) === null || _area$point3 === void 0 ? void 0 : _area$point3[headerType], (_area$point4 = area.point2) === null || _area$point4 === void 0 ? void 0 : _area$point4[headerType]);
+    var greatestRowIndex = Math.max((_area$point = area.point1) === null || _area$point === undefined ? undefined : _area$point[headerType], (_area$point2 = area.point2) === null || _area$point2 === undefined ? undefined : _area$point2[headerType]);
+    var lowestRowIndex = Math.min((_area$point3 = area.point1) === null || _area$point3 === undefined ? undefined : _area$point3[headerType], (_area$point4 = area.point2) === null || _area$point4 === undefined ? undefined : _area$point4[headerType]);
     for (var i = lowestRowIndex; i <= greatestRowIndex; i++) {
       activeRowIndexes.push(i);
     }
   });
   var activeRowIndexesNoDuplicates = _rollupPluginBabelHelpers.toConsumableArray(new Set(activeRowIndexes));
-  if (areasCloned !== null && areasCloned !== void 0 && areasCloned.length && activeRowIndexesNoDuplicates.includes(headerIndex)) {
+  if (areasCloned !== null && areasCloned !== undefined && areasCloned.length && activeRowIndexesNoDuplicates.includes(headerIndex)) {
     return true;
   }
   return false;

package/lib/components/DataSpreadsheet/utils/checkSelectedHeaderCell.js

@@ -14,11 +14,11 @@ var checkSelectedHeaderCell = function checkSelectedHeaderCell(headerIndex, sele
   var isSelectedHeader = areasCloned.some(function (area) {
     var _area$point, _area$point2, _area$point3, _area$point4, _area$point5, _area$point6, _area$point7, _area$point8;
     var oppositeType = headerType === 'column' ? 'row' : 'column';
-    var minOppositeSelection = Math.min(area === null || area === void 0 || (_area$point = area.point1) === null || _area$point === void 0 ? void 0 : _area$point[oppositeType], area === null || area === void 0 || (_area$point2 = area.point2) === null || _area$point2 === void 0 ? void 0 : _area$point2[oppositeType]);
-    var maxOppositeSelection = Math.max(area === null || area === void 0 || (_area$point3 = area.point1) === null || _area$point3 === void 0 ? void 0 : _area$point3[oppositeType], area === null || area === void 0 || (_area$point4 = area.point2) === null || _area$point4 === void 0 ? void 0 : _area$point4[oppositeType]);
-    var minSelection = Math.min(area === null || area === void 0 || (_area$point5 = area.point1) === null || _area$point5 === void 0 ? void 0 : _area$point5[headerType], area === null || area === void 0 || (_area$point6 = area.point2) === null || _area$point6 === void 0 ? void 0 : _area$point6[headerType]);
-    var maxSelection = Math.max(area === null || area === void 0 || (_area$point7 = area.point1) === null || _area$point7 === void 0 ? void 0 : _area$point7[headerType], area === null || area === void 0 || (_area$point8 = area.point2) === null || _area$point8 === void 0 ? void 0 : _area$point8[headerType]);
-    var isTrueSelectedState = (items === null || items === void 0 ? void 0 : items.length) - 1 === maxOppositeSelection && minOppositeSelection === 0;
+    var minOppositeSelection = Math.min(area === null || area === undefined || (_area$point = area.point1) === null || _area$point === undefined ? undefined : _area$point[oppositeType], area === null || area === undefined || (_area$point2 = area.point2) === null || _area$point2 === undefined ? undefined : _area$point2[oppositeType]);
+    var maxOppositeSelection = Math.max(area === null || area === undefined || (_area$point3 = area.point1) === null || _area$point3 === undefined ? undefined : _area$point3[oppositeType], area === null || area === undefined || (_area$point4 = area.point2) === null || _area$point4 === undefined ? undefined : _area$point4[oppositeType]);
+    var minSelection = Math.min(area === null || area === undefined || (_area$point5 = area.point1) === null || _area$point5 === undefined ? undefined : _area$point5[headerType], area === null || area === undefined || (_area$point6 = area.point2) === null || _area$point6 === undefined ? undefined : _area$point6[headerType]);
+    var maxSelection = Math.max(area === null || area === undefined || (_area$point7 = area.point1) === null || _area$point7 === undefined ? undefined : _area$point7[headerType], area === null || area === undefined || (_area$point8 = area.point2) === null || _area$point8 === undefined ? undefined : _area$point8[headerType]);
+    var isTrueSelectedState = (items === null || items === undefined ? undefined : items.length) - 1 === maxOppositeSelection && minOppositeSelection === 0;
     // console.log({minSelection, maxSelection});
     // Iterate over all columns included in the selection area
     for (var i = minSelection; i <= maxSelection; i++) {

package/lib/components/DataSpreadsheet/utils/commonEventHandlers.js

@@ -128,7 +128,7 @@ var handleBodyCellHover = function handleBodyCellHover(cell, columnIndex) {
         return prev;
       }
       // Do not update state if you're still hovering on the same cell
-      if (((_selectionAreaClone$i = selectionAreaClone[indexOfItemToUpdate].point2) === null || _selectionAreaClone$i === void 0 ? void 0 : _selectionAreaClone$i.row) === cellCoordinates.row && ((_selectionAreaClone$i2 = selectionAreaClone[indexOfItemToUpdate].point2) === null || _selectionAreaClone$i2 === void 0 ? void 0 : _selectionAreaClone$i2.column) === cellCoordinates.column) {
+      if (((_selectionAreaClone$i = selectionAreaClone[indexOfItemToUpdate].point2) === null || _selectionAreaClone$i === undefined ? undefined : _selectionAreaClone$i.row) === cellCoordinates.row && ((_selectionAreaClone$i2 = selectionAreaClone[indexOfItemToUpdate].point2) === null || _selectionAreaClone$i2 === undefined ? undefined : _selectionAreaClone$i2.column) === cellCoordinates.column) {
         return prev;
       }
       selectionAreaClone[indexOfItemToUpdate].point2 = cellCoordinates;
@@ -200,7 +200,7 @@ var handleKeyPress = function handleKeyPress(event) {
 
   // Clear out all cell selection areas if user uses any arrow key, except if the shift key is being held
   if (['ArrowLeft', 'ArrowUp', 'ArrowRight', 'ArrowDown'].indexOf(key) > -1) {
-    if (selectionAreas !== null && selectionAreas !== void 0 && selectionAreas.length && keysPressedList.length < 2 && !handleMultipleKeys.includesShift(keysPressedList)) {
+    if (selectionAreas !== null && selectionAreas !== undefined && selectionAreas.length && keysPressedList.length < 2 && !handleMultipleKeys.includesShift(keysPressedList)) {
       setSelectionAreas([]);
       setSelectionAreaData([]);
       removeCellSelections.removeCellSelections({
@@ -208,7 +208,7 @@ var handleKeyPress = function handleKeyPress(event) {
       });
     }
   }
-  if ((keysPressedList === null || keysPressedList === void 0 ? void 0 : keysPressedList.length) > 1) {
+  if ((keysPressedList === null || keysPressedList === undefined ? undefined : keysPressedList.length) > 1) {
     handleMultipleKeys.handleMultipleKeys({
       activeCellCoordinates: activeCellCoordinates,
       event: event,

package/lib/components/DataSpreadsheet/utils/createActiveCellFn.js

@@ -14,10 +14,10 @@ var createActiveCellFn = function createActiveCellFn(_ref) {
   var placementElement = _ref.placementElement,
     coords = _ref.coords,
     _ref$addToHeader = _ref.addToHeader,
-    addToHeader = _ref$addToHeader === void 0 ? false : _ref$addToHeader,
+    addToHeader = _ref$addToHeader === undefined ? false : _ref$addToHeader,
     contextRef = _ref.contextRef,
     _ref$blockClass = _ref.blockClass,
-    blockClass = _ref$blockClass === void 0 ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
+    blockClass = _ref$blockClass === undefined ? "".concat(settings.pkg.prefix, "--data-spreadsheet") : _ref$blockClass,
     onActiveCellChange = _ref.onActiveCellChange,
     activeCellValue = _ref.activeCellValue,
     activeCellRef = _ref.activeCellRef,
@@ -31,27 +31,27 @@ var createActiveCellFn = function createActiveCellFn(_ref) {
   var point1Element = document.querySelector("[data-row-index=\"".concat(coords.row, "\"][data-column-index=\"").concat(coords.column, "\"]")) || document.querySelector(".".concat(blockClass, "__body--td")); // if we can't find the point1 element (this can happen in the case where a virtualized row is not present anymore in the DOM), we get the default height/width of the first body cell we find
   var selectionAreaCellWidth = point1Element.offsetWidth;
   var selectionAreaCellHeight = point1Element.offsetHeight;
-  var activeElementContainer = addToHeader ? contextRef === null || contextRef === void 0 ? void 0 : contextRef.current.querySelector(".".concat(blockClass, "__header--container")) : contextRef === null || contextRef === void 0 ? void 0 : contextRef.current.querySelector(".".concat(blockClass, "__list--container")).firstElementChild;
+  var activeElementContainer = addToHeader ? contextRef === null || contextRef === undefined ? undefined : contextRef.current.querySelector(".".concat(blockClass, "__header--container")) : contextRef === null || contextRef === undefined ? undefined : contextRef.current.querySelector(".".concat(blockClass, "__list--container")).firstElementChild;
   var relativePosition = {
     top: placementElement ? placementElement.getBoundingClientRect().top - activeElementContainer.getBoundingClientRect().top : coords.row === 0 ? 0 : selectionAreaCellHeight * coords.row,
     // calculate top value here if virtualized row is not in DOM
     left: placementElement ? placementElement.getBoundingClientRect().left - activeElementContainer.getBoundingClientRect().left : coords.column === 0 ? 0 + (defaultColumn.rowHeaderWidth - 4) : selectionAreaCellWidth * coords.column + (defaultColumn.rowHeaderWidth - 4) // calculate left value here if virtualized row is not in DOM, accounting for row header cell width (including borders)
   };
-  var activeCellButton = activeCellRef === null || activeCellRef === void 0 ? void 0 : activeCellRef.current;
-  activeCellButton.style.width = layout.px(placementElement ? placementElement === null || placementElement === void 0 ? void 0 : placementElement.offsetWidth : selectionAreaCellWidth);
-  activeCellButton.style.height = layout.px(placementElement ? placementElement === null || placementElement === void 0 ? void 0 : placementElement.offsetHeight : selectionAreaCellHeight);
+  var activeCellButton = activeCellRef === null || activeCellRef === undefined ? undefined : activeCellRef.current;
+  activeCellButton.style.width = layout.px(placementElement ? placementElement === null || placementElement === undefined ? undefined : placementElement.offsetWidth : selectionAreaCellWidth);
+  activeCellButton.style.height = layout.px(placementElement ? placementElement === null || placementElement === undefined ? undefined : placementElement.offsetHeight : selectionAreaCellHeight);
   activeCellButton.style.left = layout.px(relativePosition.left);
   activeCellButton.style.top = layout.px(relativePosition.top);
   activeCellButton.style.display = 'block';
-  activeCellButton.setAttribute('data-active-row-index', typeof (coords === null || coords === void 0 ? void 0 : coords.row) === 'number' ? coords.row : 'header');
-  activeCellButton.setAttribute('data-active-column-index', typeof (coords === null || coords === void 0 ? void 0 : coords.column) === 'number' ? coords.column : 'header');
+  activeCellButton.setAttribute('data-active-row-index', typeof (coords === null || coords === undefined ? undefined : coords.row) === 'number' ? coords.row : 'header');
+  activeCellButton.setAttribute('data-active-column-index', typeof (coords === null || coords === undefined ? undefined : coords.column) === 'number' ? coords.column : 'header');
   activeElementContainer.appendChild(activeCellButton);
   activeCellButton.focus();
   if (!addToHeader) {
     activeElementContainer.appendChild(cellEditorRef.current);
   }
-  if (typeof (coords === null || coords === void 0 ? void 0 : coords.column) === 'number' && typeof (coords === null || coords === void 0 ? void 0 : coords.row) === 'number') {
-    onActiveCellChange === null || onActiveCellChange === void 0 || onActiveCellChange(activeCellValue);
+  if (typeof (coords === null || coords === undefined ? undefined : coords.column) === 'number' && typeof (coords === null || coords === undefined ? undefined : coords.row) === 'number') {
+    onActiveCellChange === null || onActiveCellChange === undefined || onActiveCellChange(activeCellValue);
   }
 };
 

package/lib/components/DataSpreadsheet/utils/createCellSelectionArea.js

@@ -33,7 +33,7 @@ var createCellSelectionArea = function createCellSelectionArea(_ref) {
   var selectionAreaVariableWidth = 0;
   visibleColumns.forEach(function (item, index) {
     if (index >= lowestColumnIndex && index <= greatestColumnIndex) {
-      selectionAreaVariableWidth += (item === null || item === void 0 ? void 0 : item.width) || (defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.width);
+      selectionAreaVariableWidth += (item === null || item === undefined ? undefined : item.width) || (defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.width);
     }
   });
   var point1Element = document.querySelector("[data-row-index=\"".concat(area.point1.row, "\"][data-column-index=\"").concat(area.point1.column, "\"]")) || document.querySelector(".".concat(blockClass, "__body--td")); // if we can't find the point1 element (this can happen in the case where a virtualized row is not present anymore in the DOM), we get the default height of the first body cell we find

package/lib/components/DataSpreadsheet/utils/getSpreadsheetWidth.js

@@ -28,7 +28,7 @@ var getSpreadsheetWidth = function getSpreadsheetWidth(_ref) {
   }
   if (totalVisibleColumns) {
     var totalVisibleColumnWidth = visibleColumns.map(function (item, index) {
-      return index <= totalVisibleColumns - 1 && ((item === null || item === void 0 ? void 0 : item.width) || (defaultColumn === null || defaultColumn === void 0 ? void 0 : defaultColumn.width));
+      return index <= totalVisibleColumns - 1 && ((item === null || item === undefined ? undefined : item.width) || (defaultColumn === null || defaultColumn === undefined ? undefined : defaultColumn.width));
     }).reduce(function (prev, curr) {
       return prev + curr;
     }, 0);

package/lib/components/DataSpreadsheet/utils/handleActiveCellInSelectionEnter.js

@@ -31,11 +31,11 @@ var handleActiveCellInSelectionEnter = function handleActiveCellInSelectionEnter
     greatestRowIndex = _getSelectionAreaPoin.greatestRowIndex;
   // Move active cell down one row if possible
   var coordinatesClone = _rollupPluginBabelHelpers.objectSpread2({}, activeCellCoordinates);
-  if ((activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) < greatestRowIndex) {
+  if ((activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row) < greatestRowIndex) {
     updateActiveCellCoordinates({
       coords: coordinatesClone,
       updatedValue: {
-        row: (coordinatesClone === null || coordinatesClone === void 0 ? void 0 : coordinatesClone.row) + 1
+        row: (coordinatesClone === null || coordinatesClone === undefined ? undefined : coordinatesClone.row) + 1
       },
       optOutOfSelectionAreaUpdate: true
     });
@@ -43,12 +43,12 @@ var handleActiveCellInSelectionEnter = function handleActiveCellInSelectionEnter
   // Move active cell to next column of selection area if it exists
   // If not, find the next selection area and update active cell to
   // be the first cell in that selection
-  if ((activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.row) === greatestRowIndex) {
-    if ((activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) < greatestColumnIndex) {
+  if ((activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.row) === greatestRowIndex) {
+    if ((activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column) < greatestColumnIndex) {
       updateActiveCellCoordinates({
         coords: coordinatesClone,
         updatedValue: {
-          column: (coordinatesClone === null || coordinatesClone === void 0 ? void 0 : coordinatesClone.column) + 1,
+          column: (coordinatesClone === null || coordinatesClone === undefined ? undefined : coordinatesClone.column) + 1,
           row: lowestRowIndex
         },
         optOutOfSelectionAreaUpdate: true
@@ -56,7 +56,7 @@ var handleActiveCellInSelectionEnter = function handleActiveCellInSelectionEnter
     }
     // Move to next selection area if there is one, or back to
     // the beginning of the current selection
-    if ((activeCellCoordinates === null || activeCellCoordinates === void 0 ? void 0 : activeCellCoordinates.column) === greatestColumnIndex) {
+    if ((activeCellCoordinates === null || activeCellCoordinates === undefined ? undefined : activeCellCoordinates.column) === greatestColumnIndex) {
       if (selectionAreas.length > 1) {
         if (selectionAreas[activeCellIndexInSelectionAreas + 1]) {
           // Update activeCellRef data-selection-id attribute to the matcher of the next selection area