handsontable 16.0.1 → 16.1.0-next-91b8a0f-20250905

package/plugins/multipleSelectionHandles/multipleSelectionHandles.mjs

@@ -86,7 +86,7 @@ export class MultipleSelectionHandles extends BasePlugin {
     this.eventManager.addEventListener(rootElement, 'touchstart', event => {
       let selectedRange;
       if (hasClass(event.target, 'topSelectionHandle-HitArea')) {
-        selectedRange = _this.hot.getSelectedRangeLast();
+        selectedRange = _this.hot.getSelectedRangeActive();
         _this.dragged.push('top');
         _this.touchStartRange = {
           width: selectedRange.getWidth(),
@@ -96,7 +96,7 @@ export class MultipleSelectionHandles extends BasePlugin {
         event.preventDefault();
         return false;
       } else if (hasClass(event.target, 'bottomSelectionHandle-HitArea')) {
-        selectedRange = _this.hot.getSelectedRangeLast();
+        selectedRange = _this.hot.getSelectedRangeActive();
         _this.dragged.push('bottom');
         _this.touchStartRange = {
           width: selectedRange.getWidth(),
@@ -142,7 +142,7 @@ export class MultipleSelectionHandles extends BasePlugin {
         if (targetCoords.col === -1) {
           targetCoords.col = 0;
         }
-        selectedRange = _this.hot.getSelectedRangeLast();
+        selectedRange = _this.hot.getSelectedRangeActive();
         rangeWidth = selectedRange.getWidth();
         rangeHeight = selectedRange.getHeight();
         rangeDirection = selectedRange.getDirection();

package/plugins/nestedHeaders/nestedHeaders.js

@@ -103,13 +103,21 @@ var _hidingIndexMapObserver = /*#__PURE__*/new WeakMap();
 var _focusInitialCoords = /*#__PURE__*/new WeakMap();
 var _isColumnsSelectionInProgress = /*#__PURE__*/new WeakMap();
 var _recentlyHighlightCoords = /*#__PURE__*/new WeakMap();
+var _updateFocusHighlightPosition = /*#__PURE__*/new WeakMap();
 var _NestedHeaders_brand = /*#__PURE__*/new WeakSet();
 class NestedHeaders extends _base.BasePlugin {
   constructor() {
     super(...arguments);
     /**
-     * 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.
+     * Allows to control to which column index the viewport will be scrolled. To ensure that the viewport
+     * is scrolled to the correct column for the nested header the most left and the most right visual column
+     * indexes are used.
+     *
+     * @param {number} visualColumn A visual column index to which the viewport will be scrolled.
+     * @param {{ value: 'auto' | 'start' | 'end' }} snapping If `'start'`, viewport is scrolled to show
+     * the cell on the left of the table. If `'end'`, viewport is scrolled to show the cell on the right of
+     * the table. When `'auto'`, the viewport is scrolled only when the column is outside of the viewport.
+     * @returns {number}
      */
     _classPrivateMethodInitSpec(this, _NestedHeaders_brand);
     /**
@@ -160,6 +168,34 @@ class NestedHeaders extends _base.BasePlugin {
      * @type {boolean}
      */
     _defineProperty(this, "detectedOverlappedHeaders", false);
+    /**
+     * 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.
+     *
+     * The method uses arrow function to keep the reference to the class method. Necessary for
+     * the `removeLocalHook` method of the row and column index mapper.
+     */
+    _classPrivateFieldInitSpec(this, _updateFocusHighlightPosition, () => {
+      var _this$hot;
+      const selection = (_this$hot = this.hot) === null || _this$hot === void 0 ? void 0 : _this$hot.getSelectedRangeActive();
+      if (!selection) {
+        return;
+      }
+      const {
+        highlight
+      } = selection;
+      const isNestedHeadersRange = highlight.isHeader() && highlight.col >= 0;
+      if (isNestedHeadersRange) {
+        const columnIndex = _classPrivateFieldGet(_stateManager, this).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();
+      }
+    });
   }
   static get PLUGIN_KEY() {
     return PLUGIN_KEY;
@@ -234,8 +270,8 @@ class NestedHeaders extends _base.BasePlugin {
       }
       return _assertClassBrand(_NestedHeaders_brand, _this, _onModifyTransformStart).call(_this, ...args);
     });
-    this.addHook('afterSelection', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
-    this.addHook('afterSelectionFocusSet', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
+    this.addHook('afterSelection', () => _classPrivateFieldGet(_updateFocusHighlightPosition, this).call(this));
+    this.addHook('afterSelectionFocusSet', () => _classPrivateFieldGet(_updateFocusHighlightPosition, this).call(this));
     this.addHook('beforeViewportScrollHorizontally', function () {
       for (var _len8 = arguments.length, args = new Array(_len8), _key8 = 0; _key8 < _len8; _key8++) {
         args[_key8] = arguments[_key8];
@@ -285,8 +321,8 @@ class NestedHeaders extends _base.BasePlugin {
       }
       return _assertClassBrand(_NestedHeaders_brand, _this, _onModifyFocusedElement).call(_this, ...args);
     });
-    this.hot.columnIndexMapper.addLocalHook('cacheUpdated', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
-    this.hot.rowIndexMapper.addLocalHook('cacheUpdated', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
+    this.hot.columnIndexMapper.addLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
+    this.hot.rowIndexMapper.addLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
     super.enablePlugin();
     this.updatePlugin(); // @TODO: Workaround for broken plugin initialization abstraction.
   }
@@ -346,6 +382,8 @@ class NestedHeaders extends _base.BasePlugin {
    * Disables the plugin functionality for this Handsontable instance.
    */
   disablePlugin() {
+    this.hot.rowIndexMapper.removeLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
+    this.hot.columnIndexMapper.removeLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
     this.clearColspans();
     _classPrivateFieldGet(_stateManager, this).clear();
     _classPrivateFieldGet(_hidingIndexMapObserver, this).unsubscribe();
@@ -543,41 +581,9 @@ class NestedHeaders extends _base.BasePlugin {
   }
 }
 exports.NestedHeaders = NestedHeaders;
-function _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(_stateManager, this).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 to which column index the viewport will be scrolled. To ensure that the viewport
- * is scrolled to the correct column for the nested header the most left and the most right visual column
- * indexes are used.
- *
- * @param {number} visualColumn A visual column index to which the viewport will be scrolled.
- * @param {{ value: 'auto' | 'start' | 'end' }} snapping If `'start'`, viewport is scrolled to show
- * the cell on the left of the table. If `'end'`, viewport is scrolled to show the cell on the right of
- * the table. When `'auto'`, the viewport is scrolled only when the column is outside of the viewport.
- * @returns {number}
- */
 function _onBeforeViewportScrollHorizontally(visualColumn, snapping) {
   var _classPrivateFieldGet4;
-  const selection = this.hot.getSelectedRangeLast();
+  const selection = this.hot.getSelectedRangeActive();
   if (!selection) {
     return visualColumn;
   }
@@ -793,7 +799,7 @@ function _onBeforeOnCellMouseOver(event, coords, TD, controller) {
     columnIndex,
     origColspan
   } = headerNodeData;
-  const selectedRange = this.hot.getSelectedRangeLast();
+  const selectedRange = this.hot.getSelectedRangeActive();
   const topStartCoords = selectedRange.getTopStartCorner();
   const bottomEndCoords = selectedRange.getBottomEndCorner();
   const {
@@ -854,7 +860,7 @@ function _onBeforeSelectionHighlightSet() {
 function _onModifyTransformStart(delta) {
   const {
     highlight
-  } = this.hot.getSelectedRangeLast();
+  } = this.hot.getSelectedRangeActive();
   const nextCoords = this.hot._createCellCoords(highlight.row + delta.row, highlight.col + delta.col);
   const isNestedHeadersRange = nextCoords.isHeader() && nextCoords.col >= 0;
   if (!isNestedHeadersRange) {

package/plugins/nestedHeaders/nestedHeaders.mjs

@@ -99,13 +99,21 @@ var _hidingIndexMapObserver = /*#__PURE__*/new WeakMap();
 var _focusInitialCoords = /*#__PURE__*/new WeakMap();
 var _isColumnsSelectionInProgress = /*#__PURE__*/new WeakMap();
 var _recentlyHighlightCoords = /*#__PURE__*/new WeakMap();
+var _updateFocusHighlightPosition = /*#__PURE__*/new WeakMap();
 var _NestedHeaders_brand = /*#__PURE__*/new WeakSet();
 export class NestedHeaders extends BasePlugin {
   constructor() {
     super(...arguments);
     /**
-     * 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.
+     * Allows to control to which column index the viewport will be scrolled. To ensure that the viewport
+     * is scrolled to the correct column for the nested header the most left and the most right visual column
+     * indexes are used.
+     *
+     * @param {number} visualColumn A visual column index to which the viewport will be scrolled.
+     * @param {{ value: 'auto' | 'start' | 'end' }} snapping If `'start'`, viewport is scrolled to show
+     * the cell on the left of the table. If `'end'`, viewport is scrolled to show the cell on the right of
+     * the table. When `'auto'`, the viewport is scrolled only when the column is outside of the viewport.
+     * @returns {number}
      */
     _classPrivateMethodInitSpec(this, _NestedHeaders_brand);
     /**
@@ -156,6 +164,34 @@ export class NestedHeaders extends BasePlugin {
      * @type {boolean}
      */
     _defineProperty(this, "detectedOverlappedHeaders", false);
+    /**
+     * 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.
+     *
+     * The method uses arrow function to keep the reference to the class method. Necessary for
+     * the `removeLocalHook` method of the row and column index mapper.
+     */
+    _classPrivateFieldInitSpec(this, _updateFocusHighlightPosition, () => {
+      var _this$hot;
+      const selection = (_this$hot = this.hot) === null || _this$hot === void 0 ? void 0 : _this$hot.getSelectedRangeActive();
+      if (!selection) {
+        return;
+      }
+      const {
+        highlight
+      } = selection;
+      const isNestedHeadersRange = highlight.isHeader() && highlight.col >= 0;
+      if (isNestedHeadersRange) {
+        const columnIndex = _classPrivateFieldGet(_stateManager, this).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();
+      }
+    });
   }
   static get PLUGIN_KEY() {
     return PLUGIN_KEY;
@@ -230,8 +266,8 @@ export class NestedHeaders extends BasePlugin {
       }
       return _assertClassBrand(_NestedHeaders_brand, _this, _onModifyTransformStart).call(_this, ...args);
     });
-    this.addHook('afterSelection', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
-    this.addHook('afterSelectionFocusSet', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
+    this.addHook('afterSelection', () => _classPrivateFieldGet(_updateFocusHighlightPosition, this).call(this));
+    this.addHook('afterSelectionFocusSet', () => _classPrivateFieldGet(_updateFocusHighlightPosition, this).call(this));
     this.addHook('beforeViewportScrollHorizontally', function () {
       for (var _len8 = arguments.length, args = new Array(_len8), _key8 = 0; _key8 < _len8; _key8++) {
         args[_key8] = arguments[_key8];
@@ -281,8 +317,8 @@ export class NestedHeaders extends BasePlugin {
       }
       return _assertClassBrand(_NestedHeaders_brand, _this, _onModifyFocusedElement).call(_this, ...args);
     });
-    this.hot.columnIndexMapper.addLocalHook('cacheUpdated', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
-    this.hot.rowIndexMapper.addLocalHook('cacheUpdated', () => _assertClassBrand(_NestedHeaders_brand, this, _updateFocusHighlightPosition).call(this));
+    this.hot.columnIndexMapper.addLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
+    this.hot.rowIndexMapper.addLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
     super.enablePlugin();
     this.updatePlugin(); // @TODO: Workaround for broken plugin initialization abstraction.
   }
@@ -342,6 +378,8 @@ export class NestedHeaders extends BasePlugin {
    * Disables the plugin functionality for this Handsontable instance.
    */
   disablePlugin() {
+    this.hot.rowIndexMapper.removeLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
+    this.hot.columnIndexMapper.removeLocalHook('cacheUpdated', _classPrivateFieldGet(_updateFocusHighlightPosition, this));
     this.clearColspans();
     _classPrivateFieldGet(_stateManager, this).clear();
     _classPrivateFieldGet(_hidingIndexMapObserver, this).unsubscribe();
@@ -538,41 +576,9 @@ export class NestedHeaders extends BasePlugin {
     return _classPrivateFieldGet(_stateManager, this).getHeaderTreeNodeData(coords.row, coords.col);
   }
 }
-function _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(_stateManager, this).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 to which column index the viewport will be scrolled. To ensure that the viewport
- * is scrolled to the correct column for the nested header the most left and the most right visual column
- * indexes are used.
- *
- * @param {number} visualColumn A visual column index to which the viewport will be scrolled.
- * @param {{ value: 'auto' | 'start' | 'end' }} snapping If `'start'`, viewport is scrolled to show
- * the cell on the left of the table. If `'end'`, viewport is scrolled to show the cell on the right of
- * the table. When `'auto'`, the viewport is scrolled only when the column is outside of the viewport.
- * @returns {number}
- */
 function _onBeforeViewportScrollHorizontally(visualColumn, snapping) {
   var _classPrivateFieldGet4;
-  const selection = this.hot.getSelectedRangeLast();
+  const selection = this.hot.getSelectedRangeActive();
   if (!selection) {
     return visualColumn;
   }
@@ -788,7 +794,7 @@ function _onBeforeOnCellMouseOver(event, coords, TD, controller) {
     columnIndex,
     origColspan
   } = headerNodeData;
-  const selectedRange = this.hot.getSelectedRangeLast();
+  const selectedRange = this.hot.getSelectedRangeActive();
   const topStartCoords = selectedRange.getTopStartCorner();
   const bottomEndCoords = selectedRange.getBottomEndCorner();
   const {
@@ -849,7 +855,7 @@ function _onBeforeSelectionHighlightSet() {
 function _onModifyTransformStart(delta) {
   const {
     highlight
-  } = this.hot.getSelectedRangeLast();
+  } = this.hot.getSelectedRangeActive();
   const nextCoords = this.hot._createCellCoords(highlight.row + delta.row, highlight.col + delta.col);
   const isNestedHeadersRange = nextCoords.isHeader() && nextCoords.col >= 0;
   if (!isNestedHeadersRange) {

package/plugins/nestedRows/nestedRows.js

@@ -278,7 +278,7 @@ class NestedRows extends _base.BasePlugin {
       callback: () => {
         const {
           highlight
-        } = this.hot.getSelectedRangeLast();
+        } = this.hot.getSelectedRangeActive();
         const row = this.collapsingUI.translateTrimmedRow(highlight.row);
         if (this.collapsingUI.areChildrenCollapsed(row)) {
           this.collapsingUI.expandChildren(row);
@@ -291,8 +291,8 @@ class NestedRows extends _base.BasePlugin {
       },
       runOnlyIf: () => {
         var _this$hot$getSelected, _this$hot$getSelected2;
-        const highlight = (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight;
-        return highlight && ((_this$hot$getSelected2 = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected2 === void 0 ? void 0 : _this$hot$getSelected2.isSingle()) && this.hot.selection.isCellVisible(highlight) && highlight.col === -1 && highlight.row >= 0;
+        const highlight = (_this$hot$getSelected = this.hot.getSelectedRangeActive()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight;
+        return highlight && ((_this$hot$getSelected2 = this.hot.getSelectedRangeActive()) === null || _this$hot$getSelected2 === void 0 ? void 0 : _this$hot$getSelected2.isSingle()) && this.hot.selection.isCellVisible(highlight) && highlight.col === -1 && highlight.row >= 0;
       },
       group: SHORTCUTS_GROUP,
       relativeToGroup: _shortcutContexts.EDITOR_EDIT_GROUP,

package/plugins/nestedRows/nestedRows.mjs

@@ -274,7 +274,7 @@ export class NestedRows extends BasePlugin {
       callback: () => {
         const {
           highlight
-        } = this.hot.getSelectedRangeLast();
+        } = this.hot.getSelectedRangeActive();
         const row = this.collapsingUI.translateTrimmedRow(highlight.row);
         if (this.collapsingUI.areChildrenCollapsed(row)) {
           this.collapsingUI.expandChildren(row);
@@ -287,8 +287,8 @@ export class NestedRows extends BasePlugin {
       },
       runOnlyIf: () => {
         var _this$hot$getSelected, _this$hot$getSelected2;
-        const highlight = (_this$hot$getSelected = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight;
-        return highlight && ((_this$hot$getSelected2 = this.hot.getSelectedRangeLast()) === null || _this$hot$getSelected2 === void 0 ? void 0 : _this$hot$getSelected2.isSingle()) && this.hot.selection.isCellVisible(highlight) && highlight.col === -1 && highlight.row >= 0;
+        const highlight = (_this$hot$getSelected = this.hot.getSelectedRangeActive()) === null || _this$hot$getSelected === void 0 ? void 0 : _this$hot$getSelected.highlight;
+        return highlight && ((_this$hot$getSelected2 = this.hot.getSelectedRangeActive()) === null || _this$hot$getSelected2 === void 0 ? void 0 : _this$hot$getSelected2.isSingle()) && this.hot.selection.isCellVisible(highlight) && highlight.col === -1 && highlight.row >= 0;
       },
       group: SHORTCUTS_GROUP,
       relativeToGroup: SHORTCUTS_GROUP_EDITOR,

package/plugins/nestedRows/ui/collapsing.js

@@ -460,10 +460,9 @@ class CollapsingUI extends _base.default {
    * @private
    */
   renderAndAdjust() {
-    this.hot.render();
-
     // Dirty workaround to prevent scroll height not adjusting to the table height. Needs refactoring in the future.
     this.hot.view.adjustElementsSize();
+    this.hot.render();
   }
 }
 var _default = exports.default = CollapsingUI;

package/plugins/nestedRows/ui/collapsing.mjs

@@ -456,10 +456,9 @@ class CollapsingUI extends BaseUI {
    * @private
    */
   renderAndAdjust() {
-    this.hot.render();
-
     // Dirty workaround to prevent scroll height not adjusting to the table height. Needs refactoring in the future.
     this.hot.view.adjustElementsSize();
+    this.hot.render();
   }
 }
 export default CollapsingUI;

package/plugins/nestedRows/ui/contextMenu.js

@@ -58,12 +58,12 @@ class ContextMenuUI extends _base.default {
         return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_NESTED_ROWS_INSERT_CHILD);
       },
       callback: () => {
-        const translatedRowIndex = this.dataManager.translateTrimmedRow(this.hot.getSelectedLast()[0]);
+        const translatedRowIndex = this.dataManager.translateTrimmedRow(this.hot.getSelectedActive()[0]);
         const parent = this.dataManager.getDataObject(translatedRowIndex);
         this.dataManager.addChild(parent);
       },
       disabled: () => {
-        const selected = this.hot.getSelectedLast();
+        const selected = this.hot.getSelectedActive();
         return !selected || selected[0] < 0 || this.hot.selection.isSelectedByColumnHeader() || this.hot.countRows() >= this.hot.getSettings().maxRows;
       }
     }, {
@@ -72,10 +72,10 @@ class ContextMenuUI extends _base.default {
         return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_NESTED_ROWS_DETACH_CHILD);
       },
       callback: () => {
-        this.dataManager.detachFromParent(this.hot.getSelectedLast());
+        this.dataManager.detachFromParent(this.hot.getSelectedActive());
       },
       disabled: () => {
-        const selected = this.hot.getSelectedLast();
+        const selected = this.hot.getSelectedActive();
         const translatedRowIndex = this.dataManager.translateTrimmedRow(selected[0]);
         const parent = this.dataManager.getRowParent(translatedRowIndex);
         return !parent || !selected || selected[0] < 0 || this.hot.selection.isSelectedByColumnHeader() || this.hot.countRows() >= this.hot.getSettings().maxRows;

package/plugins/nestedRows/ui/contextMenu.mjs

@@ -53,12 +53,12 @@ class ContextMenuUI extends BaseUI {
         return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_NESTED_ROWS_INSERT_CHILD);
       },
       callback: () => {
-        const translatedRowIndex = this.dataManager.translateTrimmedRow(this.hot.getSelectedLast()[0]);
+        const translatedRowIndex = this.dataManager.translateTrimmedRow(this.hot.getSelectedActive()[0]);
         const parent = this.dataManager.getDataObject(translatedRowIndex);
         this.dataManager.addChild(parent);
       },
       disabled: () => {
-        const selected = this.hot.getSelectedLast();
+        const selected = this.hot.getSelectedActive();
         return !selected || selected[0] < 0 || this.hot.selection.isSelectedByColumnHeader() || this.hot.countRows() >= this.hot.getSettings().maxRows;
       }
     }, {
@@ -67,10 +67,10 @@ class ContextMenuUI extends BaseUI {
         return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_NESTED_ROWS_DETACH_CHILD);
       },
       callback: () => {
-        this.dataManager.detachFromParent(this.hot.getSelectedLast());
+        this.dataManager.detachFromParent(this.hot.getSelectedActive());
       },
       disabled: () => {
-        const selected = this.hot.getSelectedLast();
+        const selected = this.hot.getSelectedActive();
         const translatedRowIndex = this.dataManager.translateTrimmedRow(selected[0]);
         const parent = this.dataManager.getRowParent(translatedRowIndex);
         return !parent || !selected || selected[0] < 0 || this.hot.selection.isSelectedByColumnHeader() || this.hot.countRows() >= this.hot.getSettings().maxRows;

package/plugins/nestedRows/ui/headers.js

@@ -68,8 +68,11 @@ class HeadersUI extends _base.default {
    */
   appendLevelIndicators(row, TH) {
     const rowIndex = this.hot.toPhysicalRow(row);
-    const rowLevel = this.dataManager.getRowLevel(rowIndex);
     const rowObject = this.dataManager.getDataObject(rowIndex);
+    if (!rowObject) {
+      return;
+    }
+    const rowLevel = this.dataManager.getRowLevel(rowIndex);
     const innerDiv = TH.getElementsByTagName('DIV')[0];
     const innerSpan = innerDiv.querySelector('span.rowHeader');
     const previousIndicators = innerDiv.querySelectorAll('[class^="ht_nesting"]');

package/plugins/nestedRows/ui/headers.mjs

@@ -64,8 +64,11 @@ class HeadersUI extends BaseUI {
    */
   appendLevelIndicators(row, TH) {
     const rowIndex = this.hot.toPhysicalRow(row);
-    const rowLevel = this.dataManager.getRowLevel(rowIndex);
     const rowObject = this.dataManager.getDataObject(rowIndex);
+    if (!rowObject) {
+      return;
+    }
+    const rowLevel = this.dataManager.getRowLevel(rowIndex);
     const innerDiv = TH.getElementsByTagName('DIV')[0];
     const innerSpan = innerDiv.querySelector('span.rowHeader');
     const previousIndicators = innerDiv.querySelectorAll('[class^="ht_nesting"]');

package/plugins/pagination/focusController.js

@@ -0,0 +1,27 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createPaginationFocusController = createPaginationFocusController;
+var _paginator = require("../../utils/paginator");
+/**
+ * Creates a pagination focus controller instance.
+ *
+ * @private
+ * @param {object} options The options for the pagination focus controller.
+ * @param {HTMLElement[]} options.focusableElements The focusable elements.
+ * @returns {PaginationController} The pagination controller instance.
+ */
+function createPaginationFocusController(_ref) {
+  let {
+    focusableElements
+  } = _ref;
+  const navigator = (0, _paginator.createPaginator)({
+    initialPage: 0,
+    size: () => focusableElements().length,
+    onItemSelect: currentIndex => {
+      const elements = focusableElements();
+      elements[currentIndex].focus();
+    }
+  });
+  return navigator;
+}

package/plugins/pagination/focusController.mjs

@@ -0,0 +1,23 @@
+import { createPaginator } from "../../utils/paginator.mjs";
+/**
+ * Creates a pagination focus controller instance.
+ *
+ * @private
+ * @param {object} options The options for the pagination focus controller.
+ * @param {HTMLElement[]} options.focusableElements The focusable elements.
+ * @returns {PaginationController} The pagination controller instance.
+ */
+export function createPaginationFocusController(_ref) {
+  let {
+    focusableElements
+  } = _ref;
+  const navigator = createPaginator({
+    initialPage: 0,
+    size: () => focusableElements().length,
+    onItemSelect: currentIndex => {
+      const elements = focusableElements();
+      elements[currentIndex].focus();
+    }
+  });
+  return navigator;
+}

package/plugins/pagination/index.d.ts

@@ -0,0 +1 @@
+export * from './pagination';

package/plugins/pagination/index.js

@@ -0,0 +1,7 @@
+"use strict";
+
+exports.__esModule = true;
+var _pagination = require("./pagination");
+exports.PLUGIN_KEY = _pagination.PLUGIN_KEY;
+exports.PLUGIN_PRIORITY = _pagination.PLUGIN_PRIORITY;
+exports.Pagination = _pagination.Pagination;

package/plugins/pagination/index.mjs

@@ -0,0 +1 @@
+export { PLUGIN_KEY, PLUGIN_PRIORITY, Pagination } from "./pagination.mjs";

package/plugins/pagination/pagination.d.ts

@@ -0,0 +1,52 @@
+import Core from '../../core';
+import { BasePlugin } from '../base';
+
+type PageSizeOption = number | 'auto';
+
+export interface DetailedSettings {
+  pageSize?: PageSizeOption;
+  pageSizeList?: Array<PageSizeOption>;
+  initialPage?: number;
+  showPageSize?: boolean;
+  showCounter?: boolean;
+  showNavigation?: boolean;
+  uiContainer?: HTMLElement;
+}
+
+export type Settings = boolean | DetailedSettings;
+
+type PaginationData = {
+  currentPage: number;
+  totalPages: number;
+  pageSize: number;
+  pageSizeList: Array<PageSizeOption>;
+  autoPageSize: boolean;
+  numberOfRenderedRows: number;
+  firstVisibleRowIndex: number;
+  lastVisibleRowIndex: number;
+}
+
+export class Pagination extends BasePlugin {
+  constructor(hotInstance: Core);
+  isEnabled(): boolean;
+
+  getPaginationData(): PaginationData;
+  setPage(pageNumber: number): void;
+  resetPage(): void;
+  setPageSize(pageSize: PageSizeOption): void;
+  resetPageSize(): void;
+  resetPagination(): void;
+  nextPage(): void;
+  prevPage(): void;
+  firstPage(): void;
+  lastPage(): void;
+  hasPreviousPage(): boolean;
+  hasNextPage(): boolean;
+  getCurrentPageData(): any[];
+  showPageSizeSection(): void;
+  hidePageSizeSection(): void;
+  showPageCounterSection(): void;
+  hidePageCounterSection(): void;
+  showPageNavigationSection(): void;
+  hidePageNavigationSection(): void;
+}