handsontable 0.0.0-next-baf2fcf-20230809 → 0.0.0-next-08765b9-20230809

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 _event = require("../../helpers/dom/event");
 var _templateLiteralTag = require("../../helpers/templateLiteralTag");
+var _event = require("../../helpers/dom/event");
 var _console = require("../../helpers/console");
 var _selection = require("../../selection");
 var _base = require("../base");
@@ -158,6 +158,10 @@ 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);
@@ -171,9 +175,14 @@ 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.
   }
@@ -389,6 +398,34 @@ 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.
    *
@@ -404,7 +441,6 @@ class NestedHeaders extends _base.BasePlugin {
       return visualColumn;
     }
     const {
-      classNames,
       columnCursor,
       selectionType,
       selectionWidth
@@ -419,8 +455,8 @@ class NestedHeaders extends _base.BasePlugin {
       }
     } else if (selectionType === _selection.ACTIVE_HEADER_TYPE) {
       if (colspan > selectionWidth - columnCursor || !isRoot) {
-        // Reset the class names array so the generated TH element won't be modified.
-        classNames.length = 0;
+        // Prevents adding any CSS class names to the TH element
+        return null;
       }
     }
     return visualColumn;
@@ -574,13 +610,90 @@ class NestedHeaders extends _base.BasePlugin {
     controller.cell = true;
     const columnsToSelect = [];
     if (coords.col < from.col) {
-      columnsToSelect.push(bottomEndCoords.col, columnIndex);
+      columnsToSelect.push(bottomEndCoords.col, columnIndex, coords.row);
     } else if (coords.col > from.col) {
-      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1);
+      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1, coords.row);
     } else {
-      columnsToSelect.push(columnIndex, columnIndex + origColspan - 1);
+      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;
+      }
     }
-    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 { isLeftClick, isRightClick } from "../../helpers/dom/event.mjs";
 import { toSingleLine } from "../../helpers/templateLiteralTag.mjs";
+import { isLeftClick, isRightClick } from "../../helpers/dom/event.mjs";
 import { warn } from "../../helpers/console.mjs";
 import { ACTIVE_HEADER_TYPE, HEADER_TYPE } from "../../selection/index.mjs";
 import { BasePlugin } from "../base/index.mjs";
@@ -152,6 +152,10 @@ 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);
@@ -165,9 +169,14 @@ 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.
   }
@@ -383,6 +392,34 @@ 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.
    *
@@ -398,7 +435,6 @@ export class NestedHeaders extends BasePlugin {
       return visualColumn;
     }
     const {
-      classNames,
       columnCursor,
       selectionType,
       selectionWidth
@@ -413,8 +449,8 @@ export class NestedHeaders extends BasePlugin {
       }
     } else if (selectionType === ACTIVE_HEADER_TYPE) {
       if (colspan > selectionWidth - columnCursor || !isRoot) {
-        // Reset the class names array so the generated TH element won't be modified.
-        classNames.length = 0;
+        // Prevents adding any CSS class names to the TH element
+        return null;
       }
     }
     return visualColumn;
@@ -568,13 +604,90 @@ export class NestedHeaders extends BasePlugin {
     controller.cell = true;
     const columnsToSelect = [];
     if (coords.col < from.col) {
-      columnsToSelect.push(bottomEndCoords.col, columnIndex);
+      columnsToSelect.push(bottomEndCoords.col, columnIndex, coords.row);
     } else if (coords.col > from.col) {
-      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1);
+      columnsToSelect.push(topStartCoords.col, columnIndex + origColspan - 1, coords.row);
     } else {
-      columnsToSelect.push(columnIndex, columnIndex + origColspan - 1);
+      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;
+      }
     }
-    this.hot.selectColumns(...columnsToSelect);
   }
 
   /**

package/plugins/nestedHeaders/stateManager/index.js

@@ -367,6 +367,43 @@ 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.
    *

package/plugins/nestedHeaders/stateManager/index.mjs

@@ -363,6 +363,43 @@ export default 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.
    *

package/plugins/nestedRows/nestedRows.js

@@ -16,6 +16,7 @@ const PLUGIN_KEY = 'nestedRows';
 exports.PLUGIN_KEY = PLUGIN_KEY;
 const PLUGIN_PRIORITY = 300;
 exports.PLUGIN_PRIORITY = PLUGIN_PRIORITY;
+const SHORTCUTS_GROUP = PLUGIN_KEY;
 const privatePool = new WeakMap();
 
 /* eslint-disable jsdoc/require-description-complete-sentence */
@@ -150,6 +151,7 @@ class NestedRows extends _base.BasePlugin {
     });
     this.addHook('beforeLoadData', data => this.onBeforeLoadData(data));
     this.addHook('beforeUpdateData', data => this.onBeforeLoadData(data));
+    this.registerShortcuts();
     super.enablePlugin();
   }
 
@@ -158,6 +160,7 @@ class NestedRows extends _base.BasePlugin {
    */
   disablePlugin() {
     this.hot.rowIndexMapper.unregisterMap('nestedRows');
+    this.unregisterShortcuts();
     super.disablePlugin();
   }
 
@@ -179,6 +182,44 @@ class NestedRows extends _base.BasePlugin {
     super.updatePlugin();
   }
 
+  /**
+   * Register shortcuts responsible for toggling collapsible columns.
+   *
+   * @private
+   */
+  registerShortcuts() {
+    this.hot.getShortcutManager().getContext('grid').addShortcut({
+      keys: [['Enter']],
+      callback: () => {
+        const {
+          highlight
+        } = this.hot.getSelectedRangeLast();
+        if (highlight.col === -1 && highlight.row >= 0) {
+          const row = this.collapsingUI.translateTrimmedRow(highlight.row);
+          if (this.collapsingUI.areChildrenCollapsed(row)) {
+            this.collapsingUI.expandChildren(row);
+          } else {
+            this.collapsingUI.collapseChildren(row);
+          }
+        }
+      },
+      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 collapsible columns.
+   *
+   * @private
+   */
+  unregisterShortcuts() {
+    this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
+  }
+
   /**
    * `beforeRowMove` hook callback.
    *

package/plugins/nestedRows/nestedRows.mjs

@@ -10,6 +10,7 @@ import { TrimmingMap } from "../../translations/index.mjs";
 import RowMoveController from "./utils/rowMoveController.mjs";
 export const PLUGIN_KEY = 'nestedRows';
 export const PLUGIN_PRIORITY = 300;
+const SHORTCUTS_GROUP = PLUGIN_KEY;
 const privatePool = new WeakMap();
 
 /* eslint-disable jsdoc/require-description-complete-sentence */
@@ -144,6 +145,7 @@ export class NestedRows extends BasePlugin {
     });
     this.addHook('beforeLoadData', data => this.onBeforeLoadData(data));
     this.addHook('beforeUpdateData', data => this.onBeforeLoadData(data));
+    this.registerShortcuts();
     super.enablePlugin();
   }
 
@@ -152,6 +154,7 @@ export class NestedRows extends BasePlugin {
    */
   disablePlugin() {
     this.hot.rowIndexMapper.unregisterMap('nestedRows');
+    this.unregisterShortcuts();
     super.disablePlugin();
   }
 
@@ -173,6 +176,44 @@ export class NestedRows extends BasePlugin {
     super.updatePlugin();
   }
 
+  /**
+   * Register shortcuts responsible for toggling collapsible columns.
+   *
+   * @private
+   */
+  registerShortcuts() {
+    this.hot.getShortcutManager().getContext('grid').addShortcut({
+      keys: [['Enter']],
+      callback: () => {
+        const {
+          highlight
+        } = this.hot.getSelectedRangeLast();
+        if (highlight.col === -1 && highlight.row >= 0) {
+          const row = this.collapsingUI.translateTrimmedRow(highlight.row);
+          if (this.collapsingUI.areChildrenCollapsed(row)) {
+            this.collapsingUI.expandChildren(row);
+          } else {
+            this.collapsingUI.collapseChildren(row);
+          }
+        }
+      },
+      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 collapsible columns.
+   *
+   * @private
+   */
+  unregisterShortcuts() {
+    this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
+  }
+
   /**
    * `beforeRowMove` hook callback.
    *

package/renderers/checkboxRenderer/checkboxRenderer.js

@@ -7,7 +7,7 @@ var _baseRenderer = require("../baseRenderer");
 var _eventManager = _interopRequireDefault(require("../../eventManager"));
 var _element = require("../../helpers/dom/element");
 var _mixed = require("../../helpers/mixed");
-var _editorManager = require("../../editorManager");
+var _shortcutContexts = require("../../shortcutContexts");
 var _pluginHooks = _interopRequireDefault(require("../../pluginHooks"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const isListeningKeyDownEvent = new WeakMap();
@@ -158,7 +158,7 @@ function checkboxRenderer(instance, TD, row, col, prop, value, cellProperties) {
         return !areSelectedCheckboxCells(); // False blocks next action associated with the keyboard shortcut.
       },
 
-      relativeToGroup: _editorManager.SHORTCUTS_GROUP_EDITOR,
+      relativeToGroup: _shortcutContexts.EDITOR_EDIT_GROUP,
       position: 'before'
     }], config);
   }

package/renderers/checkboxRenderer/checkboxRenderer.mjs

@@ -3,7 +3,7 @@ import { baseRenderer } from "../baseRenderer/index.mjs";
 import EventManager from "../../eventManager.mjs";
 import { empty, addClass } from "../../helpers/dom/element.mjs";
 import { isEmpty, stringify } from "../../helpers/mixed.mjs";
-import { SHORTCUTS_GROUP_EDITOR } from "../../editorManager.mjs";
+import { EDITOR_EDIT_GROUP as SHORTCUTS_GROUP_EDITOR } from "../../shortcutContexts/index.mjs";
 import Hooks from "../../pluginHooks.mjs";
 const isListeningKeyDownEvent = new WeakMap();
 const isCheckboxListenerAdded = new WeakMap();