handsontable 0.0.0-next-08765b9-20230809 → 0.0.0-next-912c214-20230818

package/plugins/manualColumnResize/manualColumnResize.mjs

@@ -1,6 +1,6 @@
 import "core-js/modules/es.array.push.js";
 import { BasePlugin } from "../base/index.mjs";
-import { addClass, closest, hasClass, removeClass, outerHeight, isDetached } from "../../helpers/dom/element.mjs";
+import { addClass, closest, hasClass, removeClass, outerHeight, isDetached, overlayContainsElement } from "../../helpers/dom/element.mjs";
 import EventManager from "../../eventManager.mjs";
 import { arrayEach } from "../../helpers/array.mjs";
 import { rangeEach } from "../../helpers/number.mjs";
@@ -213,6 +213,12 @@ export class ManualColumnResize extends BasePlugin {
       return;
     }
     this.currentTH = TH;
+    const hotRootElement = this.hot.rootElement;
+
+    // Handling elements placed only inside columns header of the main instance.
+    if (overlayContainsElement('top_inline_start_corner', this.currentTH, hotRootElement) === false && overlayContainsElement('top', this.currentTH, hotRootElement) === false) {
+      return;
+    }
     const {
       _wt: wt
     } = this.hot.view;

package/plugins/mergeCells/mergeCells.js

@@ -188,6 +188,9 @@ class MergeCells extends _base.BasePlugin {
     this.addHook('afterDrawSelection', function () {
       return _this.onAfterDrawSelection(...arguments);
     });
+    this.addHook('beforeRemoveCellClassNames', function () {
+      return _this.onBeforeRemoveCellClassNames(...arguments);
+    });
     this.addHook('beforeUndoStackChange', (action, source) => {
       if (source === 'MergeCells') {
         return false;
@@ -494,6 +497,7 @@ class MergeCells extends _base.BasePlugin {
       (0, _number.rangeEach)(0, currentCollection.rowspan - 1, i => {
         (0, _number.rangeEach)(0, currentCollection.colspan - 1, j => {
           this.hot.removeCellMeta(currentCollection.row + i, currentCollection.col + j, 'hidden');
+          this.hot.removeCellMeta(currentCollection.row + i, currentCollection.col + j, 'copyable');
         });
       });
       this.hot.removeCellMeta(currentCollection.row, currentCollection.col, 'spanned');
@@ -571,11 +575,8 @@ class MergeCells extends _base.BasePlugin {
     gridContext.addShortcut({
       keys: [['Control', 'm']],
       callback: () => {
-        const range = this.hot.getSelectedRangeLast();
-        if (range && !range.isSingleHeader()) {
-          this.toggleMerge(range);
-          this.hot.render();
-        }
+        this.toggleMerge(this.hot.getSelectedRangeLast());
+        this.hot.render();
       },
       runOnlyIf: event => !event.altKey,
       // right ALT in some systems triggers ALT+CTRL
@@ -1198,5 +1199,16 @@ class MergeCells extends _base.BasePlugin {
     }
     return this.selectionCalculations.getSelectedMergedCellClassName(currentRow, currentColumn, cornersOfSelection, layerLevel);
   }
+
+  /**
+   * `beforeRemoveCellClassNames` hook callback. Used to remove additional class name from all cells in the table.
+   *
+   * @private
+   * @returns {string[]} An `Array` of `String`s. Each of these strings will act like class names to be removed from
+   *   all the cells in the table.
+   */
+  onBeforeRemoveCellClassNames() {
+    return this.selectionCalculations.getSelectedMergedCellClassNameToRemove();
+  }
 }
 exports.MergeCells = MergeCells;

package/plugins/mergeCells/mergeCells.mjs

@@ -182,6 +182,9 @@ export class MergeCells extends BasePlugin {
     this.addHook('afterDrawSelection', function () {
       return _this.onAfterDrawSelection(...arguments);
     });
+    this.addHook('beforeRemoveCellClassNames', function () {
+      return _this.onBeforeRemoveCellClassNames(...arguments);
+    });
     this.addHook('beforeUndoStackChange', (action, source) => {
       if (source === 'MergeCells') {
         return false;
@@ -488,6 +491,7 @@ export class MergeCells extends BasePlugin {
       rangeEach(0, currentCollection.rowspan - 1, i => {
         rangeEach(0, currentCollection.colspan - 1, j => {
           this.hot.removeCellMeta(currentCollection.row + i, currentCollection.col + j, 'hidden');
+          this.hot.removeCellMeta(currentCollection.row + i, currentCollection.col + j, 'copyable');
         });
       });
       this.hot.removeCellMeta(currentCollection.row, currentCollection.col, 'spanned');
@@ -565,11 +569,8 @@ export class MergeCells extends BasePlugin {
     gridContext.addShortcut({
       keys: [['Control', 'm']],
       callback: () => {
-        const range = this.hot.getSelectedRangeLast();
-        if (range && !range.isSingleHeader()) {
-          this.toggleMerge(range);
-          this.hot.render();
-        }
+        this.toggleMerge(this.hot.getSelectedRangeLast());
+        this.hot.render();
       },
       runOnlyIf: event => !event.altKey,
       // right ALT in some systems triggers ALT+CTRL
@@ -1192,4 +1193,15 @@ export class MergeCells extends BasePlugin {
     }
     return this.selectionCalculations.getSelectedMergedCellClassName(currentRow, currentColumn, cornersOfSelection, layerLevel);
   }
+
+  /**
+   * `beforeRemoveCellClassNames` hook callback. Used to remove additional class name from all cells in the table.
+   *
+   * @private
+   * @returns {string[]} An `Array` of `String`s. Each of these strings will act like class names to be removed from
+   *   all the cells in the table.
+   */
+  onBeforeRemoveCellClassNames() {
+    return this.selectionCalculations.getSelectedMergedCellClassNameToRemove();
+  }
 }

package/plugins/multiColumnSorting/multiColumnSorting.js

@@ -12,8 +12,8 @@ const PLUGIN_KEY = 'multiColumnSorting';
 exports.PLUGIN_KEY = PLUGIN_KEY;
 const PLUGIN_PRIORITY = 170;
 exports.PLUGIN_PRIORITY = PLUGIN_PRIORITY;
+const APPEND_COLUMN_CONFIG_STRATEGY = 'append';
 const CONFLICTED_PLUGIN_KEY = 'columnSorting';
-const SHORTCUTS_GROUP = PLUGIN_KEY;
 (0, _sortService.registerRootComparator)(PLUGIN_KEY, _rootComparator.rootComparator);
 
 /**
@@ -113,41 +113,6 @@ class MultiColumnSorting extends _columnSorting.ColumnSorting {
     super.disablePlugin();
   }
 
-  /**
-   * Register shortcuts responsible for toggling column sorting functionality.
-   *
-   * @private
-   */
-  registerShortcuts() {
-    super.registerShortcuts();
-    this.hot.getShortcutManager().getContext('grid').addShortcut({
-      keys: [['Control/Meta', 'Enter']],
-      callback: () => {
-        const {
-          highlight
-        } = this.hot.getSelectedRangeLast();
-        if (highlight.row === -1 && highlight.col >= 0) {
-          this.sort(this.getNextSortConfig(highlight.col, _columnSorting.APPEND_COLUMN_CONFIG_STRATEGY));
-        }
-      },
-      runOnlyIf: () => {
-        var _this$hot$getSelected;
-        return (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight.isHeader();
-      },
-      group: SHORTCUTS_GROUP
-    });
-  }
-
-  /**
-   * Unregister shortcuts responsible for toggling column sorting functionality.
-   *
-   * @private
-   */
-  unregisterShortcuts() {
-    super.unregisterShortcuts();
-    this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
-  }
-
   /**
    * Sorts the table by chosen columns and orders.
    *
@@ -297,7 +262,7 @@ class MultiColumnSorting extends _columnSorting.ColumnSorting {
       if (this.hot.getShortcutManager().isCtrlPressed()) {
         this.hot.deselectCell();
         this.hot.selectColumns(coords.col);
-        this.sort(this.getNextSortConfig(coords.col, _columnSorting.APPEND_COLUMN_CONFIG_STRATEGY));
+        this.sort(this.getNextSortConfig(coords.col, APPEND_COLUMN_CONFIG_STRATEGY));
       } else {
         this.sort(this.getColumnNextConfig(coords.col));
       }

package/plugins/multiColumnSorting/multiColumnSorting.mjs

@@ -1,4 +1,4 @@
-import { APPEND_COLUMN_CONFIG_STRATEGY, ColumnSorting } from "../columnSorting/index.mjs";
+import { ColumnSorting } from "../columnSorting/index.mjs";
 import { registerRootComparator } from "../columnSorting/sortService/index.mjs";
 import { wasHeaderClickedProperly } from "../columnSorting/utils.mjs";
 import { addClass, removeClass } from "../../helpers/dom/element.mjs";
@@ -7,8 +7,8 @@ import { warnAboutPluginsConflict } from "./utils.mjs";
 import { getClassesToAdd, getClassesToRemove } from "./domHelpers.mjs";
 export const PLUGIN_KEY = 'multiColumnSorting';
 export const PLUGIN_PRIORITY = 170;
+const APPEND_COLUMN_CONFIG_STRATEGY = 'append';
 const CONFLICTED_PLUGIN_KEY = 'columnSorting';
-const SHORTCUTS_GROUP = PLUGIN_KEY;
 registerRootComparator(PLUGIN_KEY, rootComparator);
 
 /**
@@ -108,41 +108,6 @@ export class MultiColumnSorting extends ColumnSorting {
     super.disablePlugin();
   }
 
-  /**
-   * Register shortcuts responsible for toggling column sorting functionality.
-   *
-   * @private
-   */
-  registerShortcuts() {
-    super.registerShortcuts();
-    this.hot.getShortcutManager().getContext('grid').addShortcut({
-      keys: [['Control/Meta', 'Enter']],
-      callback: () => {
-        const {
-          highlight
-        } = this.hot.getSelectedRangeLast();
-        if (highlight.row === -1 && highlight.col >= 0) {
-          this.sort(this.getNextSortConfig(highlight.col, APPEND_COLUMN_CONFIG_STRATEGY));
-        }
-      },
-      runOnlyIf: () => {
-        var _this$hot$getSelected;
-        return (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight.isHeader();
-      },
-      group: SHORTCUTS_GROUP
-    });
-  }
-
-  /**
-   * Unregister shortcuts responsible for toggling column sorting functionality.
-   *
-   * @private
-   */
-  unregisterShortcuts() {
-    super.unregisterShortcuts();
-    this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
-  }
-
   /**
    * Sorts the table by chosen columns and orders.
    *

package/plugins/nestedHeaders/nestedHeaders.js

@@ -5,8 +5,8 @@ exports.__esModule = true;
 require("core-js/modules/es.array.push.js");
 var _element = require("../../helpers/dom/element");
 var _number = require("../../helpers/number");
-var _templateLiteralTag = require("../../helpers/templateLiteralTag");
 var _event = require("../../helpers/dom/event");
+var _templateLiteralTag = require("../../helpers/templateLiteralTag");
 var _console = require("../../helpers/console");
 var _selection = require("../../selection");
 var _base = require("../base");
@@ -158,10 +158,6 @@ class NestedHeaders extends _base.BasePlugin {
     this.addHook('beforeOnCellMouseOver', function () {
       return _this.onBeforeOnCellMouseOver(...arguments);
     });
-    this.addHook('modifyTransformStart', function () {
-      return _this.onModifyTransformStart(...arguments);
-    });
-    this.addHook('afterSelection', () => this.updateFocusHighlightPosition());
     this.addHook('afterGetColumnHeaderRenderers', array => this.onAfterGetColumnHeaderRenderers(array));
     this.addHook('modifyColWidth', function () {
       return _this.onModifyColWidth(...arguments);
@@ -175,14 +171,9 @@ class NestedHeaders extends _base.BasePlugin {
     this.addHook('beforeCopy', function () {
       return _this.onBeforeCopy(...arguments);
     });
-    this.addHook('beforeSelectColumns', function () {
-      return _this.onBeforeSelectColumns(...arguments);
-    });
     this.addHook('afterViewportColumnCalculatorOverride', function () {
       return _this.onAfterViewportColumnCalculatorOverride(...arguments);
     });
-    this.hot.columnIndexMapper.addLocalHook('cacheUpdated', () => this.updateFocusHighlightPosition());
-    this.hot.rowIndexMapper.addLocalHook('cacheUpdated', () => this.updateFocusHighlightPosition());
     super.enablePlugin();
     this.updatePlugin(); // @TODO: Workaround for broken plugin initialization abstraction.
   }
@@ -398,34 +389,6 @@ class NestedHeaders extends _base.BasePlugin {
     return this.hot.getColHeader(visualColumnIndex, headerLevel);
   }
 
-  /**
-   * Updates the selection focus highlight position to point to the nested header root element (TH)
-   * even when the logical coordinates point in-between the header.
-   *
-   * @private
-   */
-  updateFocusHighlightPosition() {
-    var _this$hot;
-    const selection = (_this$hot = this.hot) === null || _this$hot === void 0 ? void 0 : _this$hot.getSelectedRangeLast();
-    if (!selection) {
-      return;
-    }
-    const {
-      highlight
-    } = selection;
-    const isNestedHeadersRange = highlight.isHeader() && highlight.col >= 0;
-    if (isNestedHeadersRange) {
-      const columnIndex = _classPrivateFieldGet(this, _stateManager).findLeftMostColumnIndex(highlight.row, highlight.col);
-      const focusHighlight = this.hot.selection.highlight.getFocus();
-
-      // Correct the highlight/focus selection to highlight the correct TH element
-      focusHighlight.visualCellRange.highlight.col = columnIndex;
-      focusHighlight.visualCellRange.from.col = columnIndex;
-      focusHighlight.visualCellRange.to.col = columnIndex;
-      focusHighlight.commit();
-    }
-  }
-
   /**
    * Allows to control which header DOM element will be used to highlight.
    *
@@ -441,6 +404,7 @@ class NestedHeaders extends _base.BasePlugin {
       return visualColumn;
     }
     const {
+      classNames,
       columnCursor,
       selectionType,
       selectionWidth
@@ -455,8 +419,8 @@ class NestedHeaders extends _base.BasePlugin {
       }
     } else if (selectionType === _selection.ACTIVE_HEADER_TYPE) {
       if (colspan > selectionWidth - columnCursor || !isRoot) {
-        // Prevents adding any CSS class names to the TH element
-        return null;
+        // Reset the class names array so the generated TH element won't be modified.
+        classNames.length = 0;
       }
     }
     return visualColumn;
@@ -610,90 +574,13 @@ class NestedHeaders extends _base.BasePlugin {
     controller.cell = true;
     const columnsToSelect = [];
     if (coords.col < from.col) {
-      columnsToSelect.push(bottomEndCoords.col, columnIndex, coords.row);
+      columnsToSelect.push(bottomEndCoords.col, columnIndex);
     } else if (coords.col > from.col) {
-      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1, coords.row);
+      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1);
     } else {
-      columnsToSelect.push(columnIndex, columnIndex + origColspan - 1, coords.row);
-    }
-    this.hot.selection.selectColumns(...columnsToSelect);
-  }
-
-  /**
-   * `modifyTransformStart` hook is called every time the keyboard navigation is used.
-   *
-   * @private
-   * @param {object} delta The transformation delta.
-   */
-  onModifyTransformStart(delta) {
-    const {
-      highlight
-    } = this.hot.getSelectedRangeLast();
-    const nextCoords = this.hot._createCellCoords(highlight.row + delta.row, highlight.col + delta.col);
-    const isNestedHeadersRange = nextCoords.isHeader() && nextCoords.col >= 0;
-    if (!isNestedHeadersRange) {
-      return;
-    }
-    const visualColumnIndexStart = _classPrivateFieldGet(this, _stateManager).findLeftMostColumnIndex(nextCoords.row, nextCoords.col);
-    const visualColumnIndexEnd = _classPrivateFieldGet(this, _stateManager).findRightMostColumnIndex(nextCoords.row, nextCoords.col);
-    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);
-      }
-    } 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);
-      }
-    }
-  }
-
-  /**
-   * The hook observes the column selection from the Selection API and modifies the column range to
-   * ensure that the whole nested column will be covered.
-   *
-   * @private
-   * @param {*} from The coords object where the selection starts.
-   * @param {*} to The coords object where the selection ends.
-   */
-  onBeforeSelectColumns(from, to) {
-    const headerLevel = from.row;
-    const startNodeData = this._getHeaderTreeNodeDataByCoords({
-      row: headerLevel,
-      col: from.col
-    });
-    const endNodeData = this._getHeaderTreeNodeDataByCoords({
-      row: headerLevel,
-      col: to.col
-    });
-    if (to.col < from.col) {
-      // Column selection from right to left
-      if (startNodeData) {
-        from.col = startNodeData.columnIndex + startNodeData.origColspan - 1;
-      }
-      if (endNodeData) {
-        to.col = endNodeData.columnIndex;
-      }
-    } else if (to.col >= from.col) {
-      // Column selection from left to right or a single column selection
-      if (startNodeData) {
-        from.col = startNodeData.columnIndex;
-      }
-      if (endNodeData) {
-        to.col = endNodeData.columnIndex + endNodeData.origColspan - 1;
-      }
+      columnsToSelect.push(columnIndex, columnIndex + origColspan - 1);
     }
+    this.hot.selectColumns(...columnsToSelect);
   }
 
   /**

package/plugins/nestedHeaders/nestedHeaders.mjs

@@ -12,8 +12,8 @@ function _classExtractFieldDescriptor(receiver, privateMap, action) { if (!priva
 function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
 import { addClass, removeClass } from "../../helpers/dom/element.mjs";
 import { isNumeric } from "../../helpers/number.mjs";
-import { toSingleLine } from "../../helpers/templateLiteralTag.mjs";
 import { isLeftClick, isRightClick } from "../../helpers/dom/event.mjs";
+import { toSingleLine } from "../../helpers/templateLiteralTag.mjs";
 import { warn } from "../../helpers/console.mjs";
 import { ACTIVE_HEADER_TYPE, HEADER_TYPE } from "../../selection/index.mjs";
 import { BasePlugin } from "../base/index.mjs";
@@ -152,10 +152,6 @@ export class NestedHeaders extends BasePlugin {
     this.addHook('beforeOnCellMouseOver', function () {
       return _this.onBeforeOnCellMouseOver(...arguments);
     });
-    this.addHook('modifyTransformStart', function () {
-      return _this.onModifyTransformStart(...arguments);
-    });
-    this.addHook('afterSelection', () => this.updateFocusHighlightPosition());
     this.addHook('afterGetColumnHeaderRenderers', array => this.onAfterGetColumnHeaderRenderers(array));
     this.addHook('modifyColWidth', function () {
       return _this.onModifyColWidth(...arguments);
@@ -169,14 +165,9 @@ export class NestedHeaders extends BasePlugin {
     this.addHook('beforeCopy', function () {
       return _this.onBeforeCopy(...arguments);
     });
-    this.addHook('beforeSelectColumns', function () {
-      return _this.onBeforeSelectColumns(...arguments);
-    });
     this.addHook('afterViewportColumnCalculatorOverride', function () {
       return _this.onAfterViewportColumnCalculatorOverride(...arguments);
     });
-    this.hot.columnIndexMapper.addLocalHook('cacheUpdated', () => this.updateFocusHighlightPosition());
-    this.hot.rowIndexMapper.addLocalHook('cacheUpdated', () => this.updateFocusHighlightPosition());
     super.enablePlugin();
     this.updatePlugin(); // @TODO: Workaround for broken plugin initialization abstraction.
   }
@@ -392,34 +383,6 @@ export class NestedHeaders extends BasePlugin {
     return this.hot.getColHeader(visualColumnIndex, headerLevel);
   }
 
-  /**
-   * Updates the selection focus highlight position to point to the nested header root element (TH)
-   * even when the logical coordinates point in-between the header.
-   *
-   * @private
-   */
-  updateFocusHighlightPosition() {
-    var _this$hot;
-    const selection = (_this$hot = this.hot) === null || _this$hot === void 0 ? void 0 : _this$hot.getSelectedRangeLast();
-    if (!selection) {
-      return;
-    }
-    const {
-      highlight
-    } = selection;
-    const isNestedHeadersRange = highlight.isHeader() && highlight.col >= 0;
-    if (isNestedHeadersRange) {
-      const columnIndex = _classPrivateFieldGet(this, _stateManager).findLeftMostColumnIndex(highlight.row, highlight.col);
-      const focusHighlight = this.hot.selection.highlight.getFocus();
-
-      // Correct the highlight/focus selection to highlight the correct TH element
-      focusHighlight.visualCellRange.highlight.col = columnIndex;
-      focusHighlight.visualCellRange.from.col = columnIndex;
-      focusHighlight.visualCellRange.to.col = columnIndex;
-      focusHighlight.commit();
-    }
-  }
-
   /**
    * Allows to control which header DOM element will be used to highlight.
    *
@@ -435,6 +398,7 @@ export class NestedHeaders extends BasePlugin {
       return visualColumn;
     }
     const {
+      classNames,
       columnCursor,
       selectionType,
       selectionWidth
@@ -449,8 +413,8 @@ export class NestedHeaders extends BasePlugin {
       }
     } else if (selectionType === ACTIVE_HEADER_TYPE) {
       if (colspan > selectionWidth - columnCursor || !isRoot) {
-        // Prevents adding any CSS class names to the TH element
-        return null;
+        // Reset the class names array so the generated TH element won't be modified.
+        classNames.length = 0;
       }
     }
     return visualColumn;
@@ -604,90 +568,13 @@ export class NestedHeaders extends BasePlugin {
     controller.cell = true;
     const columnsToSelect = [];
     if (coords.col < from.col) {
-      columnsToSelect.push(bottomEndCoords.col, columnIndex, coords.row);
+      columnsToSelect.push(bottomEndCoords.col, columnIndex);
     } else if (coords.col > from.col) {
-      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1, coords.row);
+      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1);
     } else {
-      columnsToSelect.push(columnIndex, columnIndex + origColspan - 1, coords.row);
-    }
-    this.hot.selection.selectColumns(...columnsToSelect);
-  }
-
-  /**
-   * `modifyTransformStart` hook is called every time the keyboard navigation is used.
-   *
-   * @private
-   * @param {object} delta The transformation delta.
-   */
-  onModifyTransformStart(delta) {
-    const {
-      highlight
-    } = this.hot.getSelectedRangeLast();
-    const nextCoords = this.hot._createCellCoords(highlight.row + delta.row, highlight.col + delta.col);
-    const isNestedHeadersRange = nextCoords.isHeader() && nextCoords.col >= 0;
-    if (!isNestedHeadersRange) {
-      return;
-    }
-    const visualColumnIndexStart = _classPrivateFieldGet(this, _stateManager).findLeftMostColumnIndex(nextCoords.row, nextCoords.col);
-    const visualColumnIndexEnd = _classPrivateFieldGet(this, _stateManager).findRightMostColumnIndex(nextCoords.row, nextCoords.col);
-    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);
-      }
-    } 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);
-      }
-    }
-  }
-
-  /**
-   * The hook observes the column selection from the Selection API and modifies the column range to
-   * ensure that the whole nested column will be covered.
-   *
-   * @private
-   * @param {*} from The coords object where the selection starts.
-   * @param {*} to The coords object where the selection ends.
-   */
-  onBeforeSelectColumns(from, to) {
-    const headerLevel = from.row;
-    const startNodeData = this._getHeaderTreeNodeDataByCoords({
-      row: headerLevel,
-      col: from.col
-    });
-    const endNodeData = this._getHeaderTreeNodeDataByCoords({
-      row: headerLevel,
-      col: to.col
-    });
-    if (to.col < from.col) {
-      // Column selection from right to left
-      if (startNodeData) {
-        from.col = startNodeData.columnIndex + startNodeData.origColspan - 1;
-      }
-      if (endNodeData) {
-        to.col = endNodeData.columnIndex;
-      }
-    } else if (to.col >= from.col) {
-      // Column selection from left to right or a single column selection
-      if (startNodeData) {
-        from.col = startNodeData.columnIndex;
-      }
-      if (endNodeData) {
-        to.col = endNodeData.columnIndex + endNodeData.origColspan - 1;
-      }
+      columnsToSelect.push(columnIndex, columnIndex + origColspan - 1);
     }
+    this.hot.selectColumns(...columnsToSelect);
   }
 
   /**

package/plugins/nestedHeaders/stateManager/index.js

@@ -367,43 +367,6 @@ class StateManager {
     return stepBackColumn;
   }
 
-  /**
-   * The method is helpful in cases where the column index targets in-between currently
-   * collapsed column. In that case, the method returns the right-most column index
-   * where the nested header ends.
-   *
-   * @param {number} headerLevel Header level (there is support for negative and positive values).
-   * @param {number} columnIndex A visual column index.
-   * @returns {number}
-   */
-  findRightMostColumnIndex(headerLevel, columnIndex) {
-    var _this$getHeaderSettin3;
-    const {
-      isRoot,
-      origColspan
-    } = (_this$getHeaderSettin3 = this.getHeaderSettings(headerLevel, columnIndex)) !== null && _this$getHeaderSettin3 !== void 0 ? _this$getHeaderSettin3 : {
-      isRoot: true,
-      origColspan: 1
-    };
-    if (isRoot) {
-      return columnIndex + origColspan - 1;
-    }
-    let stepForthColumn = columnIndex + 1;
-    while (stepForthColumn < this.getColumnsCount()) {
-      var _this$getHeaderSettin4;
-      const {
-        isRoot: isRootNode
-      } = (_this$getHeaderSettin4 = this.getHeaderSettings(headerLevel, stepForthColumn)) !== null && _this$getHeaderSettin4 !== void 0 ? _this$getHeaderSettin4 : {
-        isRoot: true
-      };
-      if (isRootNode) {
-        break;
-      }
-      stepForthColumn += 1;
-    }
-    return stepForthColumn - 1;
-  }
-
   /**
    * Gets a total number of headers levels.
    *