handsontable 0.0.0-next-612100d-20240219 → 0.0.0-next-d96e9b5-20240220

package/plugins/mergeCells/contextMenuItem/toggleMerge.js

@@ -25,7 +25,17 @@ function toggleMergeItem(plugin) {
       return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_MERGE_CELLS);
     },
     callback() {
-      plugin.toggleMergeOnSelection();
+      const currentRange = this.getSelectedRangeLast();
+      if (!currentRange) {
+        return;
+      }
+      currentRange.setDirection(this.isRtl() ? 'NE-SW' : 'NW-SE');
+      const {
+        from,
+        to
+      } = currentRange;
+      plugin.toggleMerge(currentRange);
+      this.selectCell(from.row, from.col, to.row, to.col, false);
     },
     disabled() {
       const sel = this.getSelectedLast();

package/plugins/mergeCells/contextMenuItem/toggleMerge.mjs

@@ -18,7 +18,17 @@ export default function toggleMergeItem(plugin) {
       return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_MERGE_CELLS);
     },
     callback() {
-      plugin.toggleMergeOnSelection();
+      const currentRange = this.getSelectedRangeLast();
+      if (!currentRange) {
+        return;
+      }
+      currentRange.setDirection(this.isRtl() ? 'NE-SW' : 'NW-SE');
+      const {
+        from,
+        to
+      } = currentRange;
+      plugin.toggleMerge(currentRange);
+      this.selectCell(from.row, from.col, to.row, to.col, false);
     },
     disabled() {
       const sel = this.getSelectedLast();

package/plugins/mergeCells/mergeCells.js

@@ -75,16 +75,16 @@ const SHORTCUTS_GROUP = PLUGIN_KEY;
  * ```
  * :::
  */
-var _lastDesiredCoords = /*#__PURE__*/new WeakMap();
+var _lastSelectedCoords = /*#__PURE__*/new WeakMap();
 var _onAfterInit = /*#__PURE__*/new WeakSet();
 var _onAfterIsMultipleSelection = /*#__PURE__*/new WeakSet();
 var _onModifyTransformStart = /*#__PURE__*/new WeakSet();
 var _onModifyTransformEnd = /*#__PURE__*/new WeakSet();
+var _onBeforeSelectionHighlightSet = /*#__PURE__*/new WeakSet();
 var _onModifyGetCellCoords = /*#__PURE__*/new WeakSet();
 var _addMergeActionsToContextMenu = /*#__PURE__*/new WeakSet();
 var _onAfterRenderer = /*#__PURE__*/new WeakSet();
 var _onBeforeSetRangeStart = /*#__PURE__*/new WeakSet();
-var _onBeforeSetRangeEnd = /*#__PURE__*/new WeakSet();
 var _onAfterGetCellMeta = /*#__PURE__*/new WeakSet();
 var _onAfterViewportRowCalculatorOverride = /*#__PURE__*/new WeakSet();
 var _onAfterViewportColumnCalculatorOverride = /*#__PURE__*/new WeakSet();
@@ -95,7 +95,6 @@ var _onAfterCreateRow = /*#__PURE__*/new WeakSet();
 var _onAfterRemoveRow = /*#__PURE__*/new WeakSet();
 var _onAfterChange = /*#__PURE__*/new WeakSet();
 var _onBeforeDrawAreaBorders = /*#__PURE__*/new WeakSet();
-var _onAfterModifyTransformStart = /*#__PURE__*/new WeakSet();
 var _onAfterDrawSelection = /*#__PURE__*/new WeakSet();
 var _onBeforeRemoveCellClassNames = /*#__PURE__*/new WeakSet();
 var _onBeforeBeginEditing = /*#__PURE__*/new WeakSet();
@@ -131,17 +130,6 @@ class MergeCells extends _base.BasePlugin {
      *   processed cell.
      */
     _classPrivateMethodInitSpec(this, _onAfterDrawSelection);
-    /**
-     * `afterModifyTransformStart` hook callback. Fixes a problem with navigating through merged cells at the edges of
-     * the table with the <kbd>**Enter**</kbd>/<kbd>**Shift**</kbd>+<kbd>**Enter**</kbd>/<kbd>**Tab**</kbd>/<kbd>**Shift**</kbd>+<kbd>**Tab**</kbd> keys.
-     *
-     * @param {CellCoords} coords Coordinates of the to-be-selected cell.
-     * @param {number} rowTransformDir Row transformation direction (negative value = up, 0 = none, positive value =
-     *   down).
-     * @param {number} colTransformDir Column transformation direction (negative value = up, 0 = none, positive value =
-     *   down).
-     */
-    _classPrivateMethodInitSpec(this, _onAfterModifyTransformStart);
     /**
      * `beforeDrawAreaBorders` hook callback.
      *
@@ -214,20 +202,7 @@ class MergeCells extends _base.BasePlugin {
      */
     _classPrivateMethodInitSpec(this, _onAfterGetCellMeta);
     /**
-     * `beforeSetRangeEnd` hook callback.
-     * While selecting cells with keyboard or mouse, make sure that rectangular area is expanded to the extent of the
-     * merged cell.
-     *
-     * Note: Please keep in mind that callback may modify both start and end range coordinates by the reference.
-     *
-     * @param {object} coords Cell coords.
-     */
-    _classPrivateMethodInitSpec(this, _onBeforeSetRangeEnd);
-    /**
-     * `beforeSetRangeStart` and `beforeSetRangeStartOnly` hook callback.
-     * A selection within merge area should be rewritten to the start of merge area.
-     *
-     * @param {object} coords Cell coords.
+     * Clears the last selected coordinates before setting a new selection range.
      */
     _classPrivateMethodInitSpec(this, _onBeforeSetRangeStart);
     /**
@@ -252,6 +227,11 @@ class MergeCells extends _base.BasePlugin {
      * @returns {Array|undefined} Visual coordinates of the merge.
      */
     _classPrivateMethodInitSpec(this, _onModifyGetCellCoords);
+    /**
+     * The hook corrects the range (before drawing it) after the selection was made on the merged cells.
+     * It expands the range to cover the entire area of the selected merged cells.
+     */
+    _classPrivateMethodInitSpec(this, _onBeforeSelectionHighlightSet);
     /**
      * `modifyTransformEnd` hook callback. Needed to handle "jumping over" merged merged cells, while selecting.
      *
@@ -298,9 +278,12 @@ class MergeCells extends _base.BasePlugin {
      */
     _defineProperty(this, "selectionCalculations", null);
     /**
+     * The holder for the last selected coordinates. This allows keeping the correct coordinates in cases after the
+     * focus is moved out of the merged cell.
+     *
      * @type {CellCoords}
      */
-    _classPrivateFieldInitSpec(this, _lastDesiredCoords, {
+    _classPrivateFieldInitSpec(this, _lastSelectedCoords, {
       writable: true,
       value: null
     });
@@ -344,135 +327,129 @@ class MergeCells extends _base.BasePlugin {
       }
       return _classPrivateMethodGet(_this, _onModifyTransformStart, _onModifyTransformStart2).call(_this, ...args);
     });
-    this.addHook('afterModifyTransformStart', function () {
+    this.addHook('modifyTransformEnd', function () {
       for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
         args[_key3] = arguments[_key3];
       }
-      return _classPrivateMethodGet(_this, _onAfterModifyTransformStart, _onAfterModifyTransformStart2).call(_this, ...args);
+      return _classPrivateMethodGet(_this, _onModifyTransformEnd, _onModifyTransformEnd2).call(_this, ...args);
     });
-    this.addHook('modifyTransformEnd', function () {
+    this.addHook('beforeSelectionHighlightSet', function () {
       for (var _len4 = arguments.length, args = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
         args[_key4] = arguments[_key4];
       }
-      return _classPrivateMethodGet(_this, _onModifyTransformEnd, _onModifyTransformEnd2).call(_this, ...args);
+      return _classPrivateMethodGet(_this, _onBeforeSelectionHighlightSet, _onBeforeSelectionHighlightSet2).call(_this, ...args);
     });
-    this.addHook('modifyGetCellCoords', function () {
+    this.addHook('beforeSetRangeStart', function () {
       for (var _len5 = arguments.length, args = new Array(_len5), _key5 = 0; _key5 < _len5; _key5++) {
         args[_key5] = arguments[_key5];
       }
-      return _classPrivateMethodGet(_this, _onModifyGetCellCoords, _onModifyGetCellCoords2).call(_this, ...args);
+      return _classPrivateMethodGet(_this, _onBeforeSetRangeStart, _onBeforeSetRangeStart2).call(_this, ...args);
     });
-    this.addHook('beforeSetRangeStart', function () {
+    this.addHook('beforeSetRangeStartOnly', function () {
       for (var _len6 = arguments.length, args = new Array(_len6), _key6 = 0; _key6 < _len6; _key6++) {
         args[_key6] = arguments[_key6];
       }
       return _classPrivateMethodGet(_this, _onBeforeSetRangeStart, _onBeforeSetRangeStart2).call(_this, ...args);
     });
-    this.addHook('beforeSetRangeStartOnly', function () {
+    this.addHook('modifyGetCellCoords', function () {
       for (var _len7 = arguments.length, args = new Array(_len7), _key7 = 0; _key7 < _len7; _key7++) {
         args[_key7] = arguments[_key7];
       }
-      return _classPrivateMethodGet(_this, _onBeforeSetRangeStart, _onBeforeSetRangeStart2).call(_this, ...args);
+      return _classPrivateMethodGet(_this, _onModifyGetCellCoords, _onModifyGetCellCoords2).call(_this, ...args);
     });
-    this.addHook('beforeSetRangeEnd', function () {
+    this.addHook('afterIsMultipleSelection', function () {
       for (var _len8 = arguments.length, args = new Array(_len8), _key8 = 0; _key8 < _len8; _key8++) {
         args[_key8] = arguments[_key8];
       }
-      return _classPrivateMethodGet(_this, _onBeforeSetRangeEnd, _onBeforeSetRangeEnd2).call(_this, ...args);
-    });
-    this.addHook('afterIsMultipleSelection', function () {
-      for (var _len9 = arguments.length, args = new Array(_len9), _key9 = 0; _key9 < _len9; _key9++) {
-        args[_key9] = arguments[_key9];
-      }
       return _classPrivateMethodGet(_this, _onAfterIsMultipleSelection, _onAfterIsMultipleSelection2).call(_this, ...args);
     });
     this.addHook('afterRenderer', function () {
-      for (var _len10 = arguments.length, args = new Array(_len10), _key10 = 0; _key10 < _len10; _key10++) {
-        args[_key10] = arguments[_key10];
+      for (var _len9 = arguments.length, args = new Array(_len9), _key9 = 0; _key9 < _len9; _key9++) {
+        args[_key9] = arguments[_key9];
       }
       return _classPrivateMethodGet(_this, _onAfterRenderer, _onAfterRenderer2).call(_this, ...args);
     });
     this.addHook('afterContextMenuDefaultOptions', function () {
-      for (var _len11 = arguments.length, args = new Array(_len11), _key11 = 0; _key11 < _len11; _key11++) {
-        args[_key11] = arguments[_key11];
+      for (var _len10 = arguments.length, args = new Array(_len10), _key10 = 0; _key10 < _len10; _key10++) {
+        args[_key10] = arguments[_key10];
       }
       return _classPrivateMethodGet(_this, _addMergeActionsToContextMenu, _addMergeActionsToContextMenu2).call(_this, ...args);
     });
     this.addHook('afterGetCellMeta', function () {
-      for (var _len12 = arguments.length, args = new Array(_len12), _key12 = 0; _key12 < _len12; _key12++) {
-        args[_key12] = arguments[_key12];
+      for (var _len11 = arguments.length, args = new Array(_len11), _key11 = 0; _key11 < _len11; _key11++) {
+        args[_key11] = arguments[_key11];
       }
       return _classPrivateMethodGet(_this, _onAfterGetCellMeta, _onAfterGetCellMeta2).call(_this, ...args);
     });
     this.addHook('afterViewportRowCalculatorOverride', function () {
-      for (var _len13 = arguments.length, args = new Array(_len13), _key13 = 0; _key13 < _len13; _key13++) {
-        args[_key13] = arguments[_key13];
+      for (var _len12 = arguments.length, args = new Array(_len12), _key12 = 0; _key12 < _len12; _key12++) {
+        args[_key12] = arguments[_key12];
       }
       return _classPrivateMethodGet(_this, _onAfterViewportRowCalculatorOverride, _onAfterViewportRowCalculatorOverride2).call(_this, ...args);
     });
     this.addHook('afterViewportColumnCalculatorOverride', function () {
-      for (var _len14 = arguments.length, args = new Array(_len14), _key14 = 0; _key14 < _len14; _key14++) {
-        args[_key14] = arguments[_key14];
+      for (var _len13 = arguments.length, args = new Array(_len13), _key13 = 0; _key13 < _len13; _key13++) {
+        args[_key13] = arguments[_key13];
       }
       return _classPrivateMethodGet(_this, _onAfterViewportColumnCalculatorOverride, _onAfterViewportColumnCalculatorOverride2).call(_this, ...args);
     });
     this.addHook('modifyAutofillRange', function () {
-      for (var _len15 = arguments.length, args = new Array(_len15), _key15 = 0; _key15 < _len15; _key15++) {
-        args[_key15] = arguments[_key15];
+      for (var _len14 = arguments.length, args = new Array(_len14), _key14 = 0; _key14 < _len14; _key14++) {
+        args[_key14] = arguments[_key14];
       }
       return _classPrivateMethodGet(_this, _onModifyAutofillRange, _onModifyAutofillRange2).call(_this, ...args);
     });
     this.addHook('afterCreateCol', function () {
-      for (var _len16 = arguments.length, args = new Array(_len16), _key16 = 0; _key16 < _len16; _key16++) {
-        args[_key16] = arguments[_key16];
+      for (var _len15 = arguments.length, args = new Array(_len15), _key15 = 0; _key15 < _len15; _key15++) {
+        args[_key15] = arguments[_key15];
       }
       return _classPrivateMethodGet(_this, _onAfterCreateCol, _onAfterCreateCol2).call(_this, ...args);
     });
     this.addHook('afterRemoveCol', function () {
-      for (var _len17 = arguments.length, args = new Array(_len17), _key17 = 0; _key17 < _len17; _key17++) {
-        args[_key17] = arguments[_key17];
+      for (var _len16 = arguments.length, args = new Array(_len16), _key16 = 0; _key16 < _len16; _key16++) {
+        args[_key16] = arguments[_key16];
       }
       return _classPrivateMethodGet(_this, _onAfterRemoveCol, _onAfterRemoveCol2).call(_this, ...args);
     });
     this.addHook('afterCreateRow', function () {
-      for (var _len18 = arguments.length, args = new Array(_len18), _key18 = 0; _key18 < _len18; _key18++) {
-        args[_key18] = arguments[_key18];
+      for (var _len17 = arguments.length, args = new Array(_len17), _key17 = 0; _key17 < _len17; _key17++) {
+        args[_key17] = arguments[_key17];
       }
       return _classPrivateMethodGet(_this, _onAfterCreateRow, _onAfterCreateRow2).call(_this, ...args);
     });
     this.addHook('afterRemoveRow', function () {
-      for (var _len19 = arguments.length, args = new Array(_len19), _key19 = 0; _key19 < _len19; _key19++) {
-        args[_key19] = arguments[_key19];
+      for (var _len18 = arguments.length, args = new Array(_len18), _key18 = 0; _key18 < _len18; _key18++) {
+        args[_key18] = arguments[_key18];
       }
       return _classPrivateMethodGet(_this, _onAfterRemoveRow, _onAfterRemoveRow2).call(_this, ...args);
     });
     this.addHook('afterChange', function () {
-      for (var _len20 = arguments.length, args = new Array(_len20), _key20 = 0; _key20 < _len20; _key20++) {
-        args[_key20] = arguments[_key20];
+      for (var _len19 = arguments.length, args = new Array(_len19), _key19 = 0; _key19 < _len19; _key19++) {
+        args[_key19] = arguments[_key19];
       }
       return _classPrivateMethodGet(_this, _onAfterChange, _onAfterChange2).call(_this, ...args);
     });
     this.addHook('beforeDrawBorders', function () {
-      for (var _len21 = arguments.length, args = new Array(_len21), _key21 = 0; _key21 < _len21; _key21++) {
-        args[_key21] = arguments[_key21];
+      for (var _len20 = arguments.length, args = new Array(_len20), _key20 = 0; _key20 < _len20; _key20++) {
+        args[_key20] = arguments[_key20];
       }
       return _classPrivateMethodGet(_this, _onBeforeDrawAreaBorders, _onBeforeDrawAreaBorders2).call(_this, ...args);
     });
     this.addHook('afterDrawSelection', function () {
-      for (var _len22 = arguments.length, args = new Array(_len22), _key22 = 0; _key22 < _len22; _key22++) {
-        args[_key22] = arguments[_key22];
+      for (var _len21 = arguments.length, args = new Array(_len21), _key21 = 0; _key21 < _len21; _key21++) {
+        args[_key21] = arguments[_key21];
       }
       return _classPrivateMethodGet(_this, _onAfterDrawSelection, _onAfterDrawSelection2).call(_this, ...args);
     });
     this.addHook('beforeRemoveCellClassNames', function () {
-      for (var _len23 = arguments.length, args = new Array(_len23), _key23 = 0; _key23 < _len23; _key23++) {
-        args[_key23] = arguments[_key23];
+      for (var _len22 = arguments.length, args = new Array(_len22), _key22 = 0; _key22 < _len22; _key22++) {
+        args[_key22] = arguments[_key22];
       }
       return _classPrivateMethodGet(_this, _onBeforeRemoveCellClassNames, _onBeforeRemoveCellClassNames2).call(_this, ...args);
     });
     this.addHook('beforeBeginEditing', function () {
-      for (var _len24 = arguments.length, args = new Array(_len24), _key24 = 0; _key24 < _len24; _key24++) {
-        args[_key24] = arguments[_key24];
+      for (var _len23 = arguments.length, args = new Array(_len23), _key23 = 0; _key23 < _len23; _key23++) {
+        args[_key23] = arguments[_key23];
       }
       return _classPrivateMethodGet(_this, _onBeforeBeginEditing, _onBeforeBeginEditing2).call(_this, ...args);
     });
@@ -642,25 +619,6 @@ class MergeCells extends _base.BasePlugin {
     return auto ? true : this.validateSetting(newMergedCellInfo);
   }
 
-  /**
-   * Merge or unmerge, based on last selected range.
-   *
-   * @private
-   */
-  toggleMergeOnSelection() {
-    const currentRange = this.hot.getSelectedRangeLast();
-    if (!currentRange) {
-      return;
-    }
-    currentRange.setDirection(this.hot.isRtl() ? 'NE-SW' : 'NW-SE');
-    const {
-      from,
-      to
-    } = currentRange;
-    this.toggleMerge(currentRange);
-    this.hot.selectCell(from.row, from.col, to.row, to.col, false);
-  }
-
   /**
    * Merges the selection provided as a cell range.
    *
@@ -1031,8 +989,10 @@ function _onAfterIsMultipleSelection2(isMultiple) {
   if (isMultiple) {
     const mergedCells = this.mergedCellsCollection.mergedCells;
     const selectionRange = this.hot.getSelectedRangeLast();
+    const topStartCoords = selectionRange.getTopStartCorner();
+    const bottomEndCoords = selectionRange.getBottomEndCorner();
     for (let group = 0; group < mergedCells.length; group += 1) {
-      if (selectionRange.from.row === mergedCells[group].row && selectionRange.from.col === mergedCells[group].col && selectionRange.to.row === mergedCells[group].row + mergedCells[group].rowspan - 1 && selectionRange.to.col === mergedCells[group].col + mergedCells[group].colspan - 1) {
+      if (topStartCoords.row === mergedCells[group].row && topStartCoords.col === mergedCells[group].col && bottomEndCoords.row === mergedCells[group].row + mergedCells[group].rowspan - 1 && bottomEndCoords.col === mergedCells[group].col + mergedCells[group].colspan - 1) {
         return false;
       }
     }
@@ -1040,75 +1000,140 @@ function _onAfterIsMultipleSelection2(isMultiple) {
   return isMultiple;
 }
 function _onModifyTransformStart2(delta) {
-  const currentlySelectedRange = this.hot.getSelectedRangeLast();
-  let newDelta = {
-    row: delta.row,
-    col: delta.col
-  };
-  let nextPosition = null;
-  const currentPosition = this.hot._createCellCoords(currentlySelectedRange.highlight.row, currentlySelectedRange.highlight.col);
-  const mergedParent = this.mergedCellsCollection.get(currentPosition.row, currentPosition.col);
-  if (!_classPrivateFieldGet(this, _lastDesiredCoords)) {
-    _classPrivateFieldSet(this, _lastDesiredCoords, this.hot._createCellCoords(null, null));
+  const selectedRange = this.hot.getSelectedRangeLast();
+  const {
+    highlight
+  } = selectedRange;
+  if (_classPrivateFieldGet(this, _lastSelectedCoords)) {
+    highlight.assign(_classPrivateFieldGet(this, _lastSelectedCoords));
+    _classPrivateFieldSet(this, _lastSelectedCoords, null);
   }
-  if (mergedParent) {
-    // only merge selected
-    const mergeTopLeft = this.hot._createCellCoords(mergedParent.row, mergedParent.col);
-    const mergeBottomRight = this.hot._createCellCoords(mergedParent.row + mergedParent.rowspan - 1, mergedParent.col + mergedParent.colspan - 1);
-    const mergeRange = this.hot._createCellRange(mergeTopLeft, mergeTopLeft, mergeBottomRight);
-    if (!mergeRange.includes(_classPrivateFieldGet(this, _lastDesiredCoords))) {
-      _classPrivateFieldSet(this, _lastDesiredCoords, this.hot._createCellCoords(null, null)); // reset outdated version of lastDesiredCoords
+  const mergedParent = this.mergedCellsCollection.get(highlight.row, highlight.col);
+  if (!mergedParent) {
+    return;
+  }
+  const visualColumnIndexStart = mergedParent.col;
+  const visualColumnIndexEnd = mergedParent.col + mergedParent.colspan - 1;
+  if (delta.col < 0) {
+    const nextColumn = highlight.col >= visualColumnIndexStart && highlight.col <= visualColumnIndexEnd ? visualColumnIndexStart - 1 : visualColumnIndexEnd;
+    const notHiddenColumnIndex = this.hot.columnIndexMapper.getNearestNotHiddenIndex(nextColumn, -1);
+    if (notHiddenColumnIndex === null) {
+      // There are no visible columns anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the previous row (if autoWrapRow is enabled).
+      delta.col = -this.hot.view.countRenderableColumnsInRange(0, highlight.col);
+    } else {
+      delta.col = -Math.max(this.hot.view.countRenderableColumnsInRange(notHiddenColumnIndex, highlight.col) - 1, 1);
     }
-    newDelta.row = _classPrivateFieldGet(this, _lastDesiredCoords).row ? _classPrivateFieldGet(this, _lastDesiredCoords).row - currentPosition.row : newDelta.row;
-    newDelta.col = _classPrivateFieldGet(this, _lastDesiredCoords).col ? _classPrivateFieldGet(this, _lastDesiredCoords).col - currentPosition.col : newDelta.col;
-    if (delta.row > 0) {
-      // moving down
-      newDelta.row = mergedParent.row + mergedParent.rowspan - 1 - currentPosition.row + delta.row;
-    } else if (delta.row < 0) {
-      // moving up
-      newDelta.row = currentPosition.row - mergedParent.row + delta.row;
+  } else if (delta.col > 0) {
+    const nextColumn = highlight.col >= visualColumnIndexStart && highlight.col <= visualColumnIndexEnd ? visualColumnIndexEnd + 1 : visualColumnIndexStart;
+    const notHiddenColumnIndex = this.hot.columnIndexMapper.getNearestNotHiddenIndex(nextColumn, 1);
+    if (notHiddenColumnIndex === null) {
+      // There are no visible columns anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the next row (if autoWrapRow is enabled).
+      delta.col = this.hot.view.countRenderableColumnsInRange(highlight.col, this.hot.countCols());
+    } else {
+      delta.col = Math.max(this.hot.view.countRenderableColumnsInRange(highlight.col, notHiddenColumnIndex) - 1, 1);
     }
-    if (delta.col > 0) {
-      // moving right
-      newDelta.col = mergedParent.col + mergedParent.colspan - 1 - currentPosition.col + delta.col;
-    } else if (delta.col < 0) {
-      // moving left
-      newDelta.col = currentPosition.col - mergedParent.col + delta.col;
+  }
+  const visualRowIndexStart = mergedParent.row;
+  const visualRowIndexEnd = mergedParent.row + mergedParent.rowspan - 1;
+  if (delta.row < 0) {
+    const nextRow = highlight.row >= visualRowIndexStart && highlight.row <= visualRowIndexEnd ? visualRowIndexStart - 1 : visualRowIndexEnd;
+    const notHiddenRowIndex = this.hot.rowIndexMapper.getNearestNotHiddenIndex(nextRow, -1);
+    if (notHiddenRowIndex === null) {
+      // There are no visible rows anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the previous column (if autoWrapCol is enabled).
+      delta.row = -this.hot.view.countRenderableRowsInRange(0, highlight.row);
+    } else {
+      delta.row = -Math.max(this.hot.view.countRenderableRowsInRange(notHiddenRowIndex, highlight.row) - 1, 1);
+    }
+  } else if (delta.row > 0) {
+    const nextRow = highlight.row >= visualRowIndexStart && highlight.row <= visualRowIndexEnd ? visualRowIndexEnd + 1 : visualRowIndexStart;
+    const notHiddenRowIndex = this.hot.rowIndexMapper.getNearestNotHiddenIndex(nextRow, 1);
+    if (notHiddenRowIndex === null) {
+      // There are no visible rows anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the next column (if autoWrapCol is enabled).
+      delta.row = this.hot.view.countRenderableRowsInRange(highlight.row, this.hot.countRows());
+    } else {
+      delta.row = Math.max(this.hot.view.countRenderableRowsInRange(highlight.row, notHiddenRowIndex) - 1, 1);
     }
   }
-  nextPosition = this.hot._createCellCoords(currentlySelectedRange.highlight.row + newDelta.row, currentlySelectedRange.highlight.col + newDelta.col);
-  const nextPositionMergedCell = this.mergedCellsCollection.get(nextPosition.row, nextPosition.col);
-  if (nextPositionMergedCell) {
-    // skipping the invisible cells in the merge range
-    const firstRenderableCoords = this.mergedCellsCollection.getFirstRenderableCoords(nextPositionMergedCell.row, nextPositionMergedCell.col);
-    _classPrivateFieldSet(this, _lastDesiredCoords, nextPosition);
-    newDelta = {
-      row: firstRenderableCoords.row - currentPosition.row,
-      col: firstRenderableCoords.col - currentPosition.col
-    };
+}
+function _onModifyTransformEnd2(delta) {
+  const selectedRange = this.hot.getSelectedRangeLast();
+  const {
+    to
+  } = selectedRange;
+  const nextTo = this.hot._createCellCoords(to.row + delta.row, to.col + delta.col);
+  const mergedParentCurrent = this.mergedCellsCollection.get(to.row, to.col);
+  const mergedParentNext = this.mergedCellsCollection.get(nextTo.row, nextTo.col);
+  if (!(mergedParentCurrent && mergedParentNext && mergedParentCurrent === mergedParentNext)) {
+    return;
   }
-  if (newDelta.row !== 0) {
-    delta.row = newDelta.row;
+  const visualColumnIndexStart = mergedParentCurrent.col;
+  const visualColumnIndexEnd = mergedParentCurrent.col + mergedParentCurrent.colspan - 1;
+  if (delta.col < 0) {
+    const nextColumn = nextTo.col >= visualColumnIndexStart && nextTo.col <= visualColumnIndexEnd ? visualColumnIndexStart - 1 : visualColumnIndexEnd;
+    const notHiddenColumnIndex = this.hot.columnIndexMapper.getNearestNotHiddenIndex(nextColumn, -1);
+    if (notHiddenColumnIndex === null) {
+      // There are no visible columns anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the previous row (if autoWrapRow is enabled).
+      delta.col = -this.hot.view.countRenderableColumnsInRange(0, to.col);
+    } else {
+      delta.col = -Math.max(this.hot.view.countRenderableColumnsInRange(notHiddenColumnIndex, to.col) - 1, 1);
+    }
+  } else if (delta.col > 0) {
+    const nextColumn = nextTo.col >= visualColumnIndexStart && nextTo.col <= visualColumnIndexEnd ? visualColumnIndexEnd + 1 : visualColumnIndexStart;
+    const notHiddenColumnIndex = this.hot.columnIndexMapper.getNearestNotHiddenIndex(nextColumn, 1);
+    if (notHiddenColumnIndex === null) {
+      // There are no visible columns anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the next row (if autoWrapRow is enabled).
+      delta.col = this.hot.view.countRenderableColumnsInRange(to.col, this.hot.countCols());
+    } else {
+      delta.col = Math.max(this.hot.view.countRenderableColumnsInRange(to.col, notHiddenColumnIndex) - 1, 1);
+    }
   }
-  if (newDelta.col !== 0) {
-    delta.col = newDelta.col;
+  const visualRowIndexStart = mergedParentCurrent.row;
+  const visualRowIndexEnd = mergedParentCurrent.row + mergedParentCurrent.rowspan - 1;
+  if (delta.row < 0) {
+    const nextRow = nextTo.row >= visualRowIndexStart && nextTo.row <= visualRowIndexEnd ? visualRowIndexStart - 1 : visualRowIndexEnd;
+    const notHiddenRowIndex = this.hot.rowIndexMapper.getNearestNotHiddenIndex(nextRow, -1);
+    if (notHiddenRowIndex === null) {
+      // There are no visible rows anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the previous column (if autoWrapCol is enabled).
+      delta.row = -this.hot.view.countRenderableRowsInRange(0, to.row);
+    } else {
+      delta.row = -Math.max(this.hot.view.countRenderableRowsInRange(notHiddenRowIndex, to.row) - 1, 1);
+    }
+  } else if (delta.row > 0) {
+    const nextRow = nextTo.row >= visualRowIndexStart && nextTo.row <= visualRowIndexEnd ? visualRowIndexEnd + 1 : visualRowIndexStart;
+    const notHiddenRowIndex = this.hot.rowIndexMapper.getNearestNotHiddenIndex(nextRow, 1);
+    if (notHiddenRowIndex === null) {
+      // There are no visible rows anymore, so move the selection out of the table edge. This will
+      // be processed by the selection Transformer class as a move selection to the next column (if autoWrapCol is enabled).
+      delta.row = this.hot.view.countRenderableRowsInRange(to.row, this.hot.countRows());
+    } else {
+      delta.row = Math.max(this.hot.view.countRenderableRowsInRange(to.row, notHiddenRowIndex) - 1, 1);
+    }
   }
 }
-function _onModifyTransformEnd2(delta) {
-  const currentSelectionRange = this.hot.getSelectedRangeLast();
-  const newDelta = (0, _object.clone)(delta);
-  const newSelectionRange = this.selectionCalculations.getUpdatedSelectionRange(currentSelectionRange, delta);
-  let tempDelta = (0, _object.clone)(newDelta);
-  const mergedCellsWithinRange = this.mergedCellsCollection.getWithinRange(newSelectionRange, true);
-  do {
-    tempDelta = (0, _object.clone)(newDelta);
-    this.selectionCalculations.getUpdatedSelectionRange(currentSelectionRange, newDelta);
-    (0, _array.arrayEach)(mergedCellsWithinRange, mergedCell => {
-      this.selectionCalculations.snapDelta(newDelta, currentSelectionRange, mergedCell);
-    });
-  } while (newDelta.row !== tempDelta.row || newDelta.col !== tempDelta.col);
-  delta.row = newDelta.row;
-  delta.col = newDelta.col;
+function _onBeforeSelectionHighlightSet2() {
+  if (this.hot.selection.isSelectedByColumnHeader() || this.hot.selection.isSelectedByRowHeader()) {
+    return;
+  }
+  const selectedRange = this.hot.getSelectedRangeLast();
+  const {
+    highlight
+  } = selectedRange;
+  for (let i = 0; i < this.mergedCellsCollection.mergedCells.length; i += 1) {
+    const cellInfo = this.mergedCellsCollection.mergedCells[i];
+    selectedRange.expandByRange(cellInfo.getRange());
+  }
+  const mergedParent = this.mergedCellsCollection.get(highlight.row, highlight.col);
+  _classPrivateFieldSet(this, _lastSelectedCoords, highlight.clone());
+  if (mergedParent) {
+    highlight.assign(mergedParent);
+  }
 }
 function _onModifyGetCellCoords2(row, column) {
   if (row < 0 || column < 0) {
@@ -1167,37 +1192,8 @@ function _onAfterRenderer2(TD, row, col) {
   }
   (0, _utils.applySpanProperties)(TD, mergedCellCopy, row, col);
 }
-function _onBeforeSetRangeStart2(coords) {
-  // TODO: It is a workaround, but probably this hook may be needed. Every selection on the merge area
-  // could set start point of the selection to the start of the merge area. However, logic inside `expandByRange` need
-  // an initial start point. Click on the merge cell when there are some hidden indexes break the logic in some cases.
-  // Please take a look at #7010 for more information. I'm not sure if selection directions are calculated properly
-  // and what was idea for flipping direction inside `expandByRange` method.
-  if (this.mergedCellsCollection.isFirstRenderableMergedCell(coords.row, coords.col)) {
-    const mergeParent = this.mergedCellsCollection.get(coords.row, coords.col);
-    [coords.row, coords.col] = [mergeParent.row, mergeParent.col];
-  }
-}
-function _onBeforeSetRangeEnd2(coords) {
-  const selRange = this.hot.getSelectedRangeLast();
-  selRange.highlight = this.hot._createCellCoords(selRange.highlight.row, selRange.highlight.col); // clone in case we will modify its reference
-  selRange.to = coords;
-  let rangeExpanded = false;
-  if (this.hot.selection.isSelectedByColumnHeader() || this.hot.selection.isSelectedByRowHeader()) {
-    return;
-  }
-  do {
-    rangeExpanded = false;
-    for (let i = 0; i < this.mergedCellsCollection.mergedCells.length; i += 1) {
-      const cellInfo = this.mergedCellsCollection.mergedCells[i];
-      const mergedCellRange = cellInfo.getRange();
-      if (selRange.expandByRange(mergedCellRange)) {
-        coords.row = selRange.to.row;
-        coords.col = selRange.to.col;
-        rangeExpanded = true;
-      }
-    }
-  } while (rangeExpanded);
+function _onBeforeSetRangeStart2() {
+  _classPrivateFieldSet(this, _lastSelectedCoords, null);
 }
 function _onAfterGetCellMeta2(row, col, cellProperties) {
   const mergeParent = this.mergedCellsCollection.get(row, col);
@@ -1277,27 +1273,6 @@ function _onBeforeDrawAreaBorders2(corners, className) {
     });
   }
 }
-function _onAfterModifyTransformStart2(coords, rowTransformDir, colTransformDir) {
-  if (!this.enabled) {
-    return;
-  }
-  const mergedCellAtCoords = this.mergedCellsCollection.get(coords.row, coords.col);
-  if (!mergedCellAtCoords) {
-    return;
-  }
-  const goingDown = rowTransformDir > 0;
-  const goingUp = rowTransformDir < 0;
-  const goingLeft = colTransformDir < 0;
-  const goingRight = colTransformDir > 0;
-  const mergedCellOnBottomEdge = mergedCellAtCoords.row + mergedCellAtCoords.rowspan - 1 === this.hot.countRows() - 1;
-  const mergedCellOnTopEdge = mergedCellAtCoords.row === 0;
-  const mergedCellOnRightEdge = mergedCellAtCoords.col + mergedCellAtCoords.colspan - 1 === this.hot.countCols() - 1;
-  const mergedCellOnLeftEdge = mergedCellAtCoords.col === 0;
-  if (goingDown && mergedCellOnBottomEdge || goingUp && mergedCellOnTopEdge || goingRight && mergedCellOnRightEdge || goingLeft && mergedCellOnLeftEdge) {
-    coords.row = mergedCellAtCoords.row;
-    coords.col = mergedCellAtCoords.col;
-  }
-}
 function _onAfterDrawSelection2(currentRow, currentColumn, cornersOfSelection, layerLevel) {
   // Nothing's selected (hook might be triggered by the custom borders)
   if (!cornersOfSelection) {