handsontable 18.0.0 → 18.1.0-rc1

package/plugins/contextMenu/menu/menu.mjs

@@ -4,15 +4,12 @@ function _check_private_redeclaration(obj, privateCollection) {
     }
 }
 function _class_apply_descriptor_get(receiver, descriptor) {
-    if (descriptor.get) {
-        return descriptor.get.call(receiver);
-    }
+    if (descriptor.get) return descriptor.get.call(receiver);
     return descriptor.value;
 }
 function _class_apply_descriptor_set(receiver, descriptor, value) {
-    if (descriptor.set) {
-        descriptor.set.call(receiver, value);
-    } else {
+    if (descriptor.set) descriptor.set.call(receiver, value);
+    else {
         if (!descriptor.writable) {
             throw new TypeError("attempted to set read only private field");
         }
@@ -20,9 +17,7 @@ function _class_apply_descriptor_set(receiver, descriptor, value) {
     }
 }
 function _class_extract_field_descriptor(receiver, privateMap, action) {
-    if (!privateMap.has(receiver)) {
-        throw new TypeError("attempted to " + action + " private field on non-instance");
-    }
+    if (!privateMap.has(receiver)) throw new TypeError("attempted to " + action + " private field on non-instance");
     return privateMap.get(receiver);
 }
 function _class_private_field_get(receiver, privateMap) {
@@ -39,9 +34,7 @@ function _class_private_field_set(receiver, privateMap, value) {
     return value;
 }
 function _class_private_method_get(receiver, privateSet, fn) {
-    if (!privateSet.has(receiver)) {
-        throw new TypeError("attempted to get private field on non-instance");
-    }
+    if (!privateSet.has(receiver)) throw new TypeError("attempted to get private field on non-instance");
     return fn;
 }
 function _class_private_method_init(obj, privateSet) {
@@ -56,7 +49,7 @@ import { filterSeparators, hasSubMenu, isItemHidden, normalizeSelection, isItemS
 import EventManager from '../../../eventManager.mjs';
 import { arrayEach, arrayFilter, arrayReduce } from '../../../helpers/array.mjs';
 import { isWindowsOS, isMobileBrowser, isIpadOS } from '../../../helpers/browser.mjs';
-import { addClass, eventTargetEl, isChildOf, getParentWindow, hasClass, setAttribute, outerHeight, removeClass } from '../../../helpers/dom/element.mjs';
+import { addClass, eventTargetEl, isChildOf, isHTMLElement, getParentWindow, hasClass, setAttribute, outerHeight, removeClass } from '../../../helpers/dom/element.mjs';
 import { isRightClick } from '../../../helpers/dom/event.mjs';
 import { debounce } from '../../../helpers/function.mjs';
 import { isDefined } from '../../../helpers/mixed.mjs';
@@ -86,11 +79,77 @@ var /**
    *
    * @type {number}
    */ _tableBorderWidth = /*#__PURE__*/ new WeakMap(), /**
+   * Provides the current anchor rectangle for scroll-follow repositioning, or `null`
+   * when the anchor is no longer rendered. Set through `setPosition()`.
+   *
+   * @type {Function|null}
+   */ _anchorRectProvider = /*#__PURE__*/ new WeakMap(), /**
+   * Position baseline captured when the menu is positioned: the offset between the
+   * menu's document coordinates and its anchor (or the grid root when no anchor
+   * provider is available). Used to keep the menu attached while outside elements scroll.
+   *
+   * @type {object|null}
+   */ _scrollFollowBaseline = /*#__PURE__*/ new WeakMap(), /**
+   * When `true`, `afterOnCellMouseOver` ignores the hover instead of opening/closing a
+   * sub-menu. Armed for a couple of animation frames right after `#followAnchor` moves
+   * the menu: repositioning a menu item out from under a stationary mouse cursor makes
+   * the browser recompute `:hover` and fire `mouseout`/`mouseover` on the next frame(s)
+   * with NO real pointer movement involved — left unguarded, that spurious hover would
+   * toggle sub-menus as if the user had moved the mouse (#12719).
+   *
+   * @type {boolean}
+   */ _suppressHoverSubMenuToggle = /*#__PURE__*/ new WeakMap(), /**
+   * The identifier of the latest pending animation frame request that lifts
+   * `#suppressHoverSubMenuToggle`, so a new repositioning can cancel and re-arm the
+   * window instead of having it cut short by an earlier one (continuous scrolling
+   * repositions the menu on every scroll event).
+   *
+   * @type {number|null}
+   */ _suppressHoverSubMenuToggleFrameId = /*#__PURE__*/ new WeakMap(), /**
+   * Detach functions for the document `scroll` listeners active while the menu is open.
+   * Scroll listeners are registered in `open()` (not in the constructor) so that they
+   * fire in menu OPEN order: a menu whose anchor lives inside another menu's container
+   * (a sub-menu, or the filters condition select menu inside the dropdown menu) always
+   * opens after that menu, so its `#followAnchor` runs after the anchor has been moved.
+   * Construction order gives no such guarantee — e.g. `updateSettings` recreates the
+   * dropdown menu while the condition select menu is long-lived (#13168).
+   *
+   * @type {Function[]}
+   */ _detachScrollListeners = /*#__PURE__*/ new WeakMap(), /**
+   * Registers the document `scroll` listeners (capture phase, all parent frames) that
+   * keep the menu attached to its anchor. Called from `open()` — see
+   * `#detachScrollListeners` for why the registration is open-scoped.
+   */ _registerScrollListeners = /*#__PURE__*/ new WeakSet(), /**
+   * Removes the document `scroll` listeners registered by `#registerScrollListeners()`.
+   */ _clearScrollListeners = /*#__PURE__*/ new WeakSet(), /**
    * Returns the source data at the provided row index typed as `T`.
    *
    * @param {number} row Row index.
    * @returns {T | null} The source data entry or `null` when the row is not available.
-   */ _getSourceDataAtRow = /*#__PURE__*/ new WeakSet();
+   */ _getSourceDataAtRow = /*#__PURE__*/ new WeakSet(), /**
+   * Captures the offset between the menu's measured document position and its anchor's
+   * (or the grid root element's, when no anchor provider is set). Both sides are
+   * MEASURED rects — never `style.left/top`, which are not document coordinates when
+   * the menu lives in a custom `uiContainer` with its own containing block. The offset
+   * stays constant while outside elements scroll; repositioning restores it.
+   */ _captureScrollFollowBaseline = /*#__PURE__*/ new WeakSet(), /**
+   * Repositions the menu to restore its captured offset to the anchor. The correction
+   * is computed from MEASURED rects (desired document position minus actual document
+   * position) and applied as an increment to the current inline `left`/`top` styles,
+   * which keeps the math correct in any containing block (default body portal or a
+   * custom `uiContainer`) and makes scrolls the menu already follows natively a no-op.
+   * Closes the menu when the anchor provider reports the anchor as no longer rendered,
+   * or — when no provider is available — when the scroll happened inside the grid root
+   * element (an anchor-less menu cannot track content movement within the grid).
+   *
+   * @param {HTMLElement} scrolledElement The element whose scroll triggered the update.
+   */ _followAnchor = /*#__PURE__*/ new WeakSet(), /**
+   * Arms `#suppressHoverSubMenuToggle` for two animation frames. The browser recomputes
+   * `:hover` (and dispatches the resulting `mouseout`/`mouseover`) on a frame AFTER the
+   * layout-affecting style change that just moved menu content out from under the
+   * pointer, not synchronously with it — one frame is not reliably enough to outlast it.
+   * Re-arming cancels a still-pending lift so continuous scrolling keeps the window open.
+   */ _armHoverSuppression = /*#__PURE__*/ new WeakSet();
 /**
  * @typedef MenuOptions
  * @property {Menu} [parent=null] Instance of {@link Menu}.
@@ -210,6 +269,10 @@ var /**
         } else if (filteredItems.length === 0) {
             return;
         }
+        // Registered per-open (and after the empty-items early return, which would leak
+        // them) so that scroll listeners fire in menu open order — a menu anchored inside
+        // another menu then always repositions AFTER its anchor was moved.
+        _class_private_method_get(this, _registerScrollListeners, registerScrollListeners).call(this);
         filteredItems = filterSeparators(filteredItems);
         let shouldAutoCloseMenu = false;
         const settings = {
@@ -248,9 +311,23 @@ var /**
             },
             beforeRefreshDimensions: ()=>false,
             beforeOnCellMouseOver: (event, coords)=>{
+                // See the matching guard in `afterOnCellMouseOver` below — keeps the keyboard
+                // (PageUp/PageDown) page-cursor base row from silently drifting to whatever row
+                // the spurious hover lands on.
+                if (_class_private_field_get(this, _suppressHoverSubMenuToggle)) {
+                    return;
+                }
                 _class_private_field_get(this, _navigator).setPageCursorAt(coords.row);
             },
             afterOnCellMouseOver: (event, coords)=>{
+                // Dropped, not deferred: a genuine hover that lands on a new row while this
+                // window is armed gets no submenu toggle at all — the user has to cross another
+                // row boundary (a fresh `mouseover`) for the hover to register. Rare in practice
+                // (the window is 2 frames) and preferable to replaying a possibly-stale coords.row
+                // once the window closes.
+                if (_class_private_field_get(this, _suppressHoverSubMenuToggle)) {
+                    return;
+                }
                 if (this.isAllSubMenusClosed()) {
                     delayedOpenSubMenu(coords.row);
                 } else {
@@ -333,6 +410,14 @@ var /**
             this.container.style.display = 'none';
             this.hotMenu.destroy();
             this.hotMenu = null;
+            _class_private_field_set(this, _anchorRectProvider, null);
+            _class_private_field_set(this, _scrollFollowBaseline, null);
+            _class_private_method_get(this, _clearScrollListeners, clearScrollListeners).call(this);
+            if (_class_private_field_get(this, _suppressHoverSubMenuToggleFrameId) !== null) {
+                this.hot.rootWindow.cancelAnimationFrame(_class_private_field_get(this, _suppressHoverSubMenuToggleFrameId));
+                _class_private_field_set(this, _suppressHoverSubMenuToggleFrameId, null);
+            }
+            _class_private_field_set(this, _suppressHoverSubMenuToggle, false);
             this.hot.getSettings().outsideClickDeselects = this.origOutsideClickDeselects;
             this.runLocalHooks('afterClose');
             if (this.isSubMenu()) {
@@ -375,7 +460,7 @@ var /**
         });
         subMenu.setMenuItems(dataItem.submenu.items);
         subMenu.open();
-        subMenu.setPosition(cell.getBoundingClientRect());
+        subMenu.setPosition(cell.getBoundingClientRect(), ()=>cell.isConnected ? cell.getBoundingClientRect() : null);
         this.hotSubMenus[dataItem.key] = subMenu;
         // Update the accessibility tags on the cell being the base for the submenu.
         if (this.hot.getSettings().ariaTags) {
@@ -493,11 +578,15 @@ var /**
    * Set menu position based on dom event or based on literal object.
    *
    * @param {Event|object} coords Event or literal Object with coordinates.
-   */ setPosition(coords) {
+   * @param {Function} [anchorRectProvider] Returns the current anchor rectangle for
+   * scroll-follow repositioning, or `null` when the anchor is no longer rendered.
+   */ setPosition(coords, anchorRectProvider) {
         if (this.isSubMenu()) {
             this.positioner.setParentElement(this.parentMenu.container);
         }
         this.positioner.setElement(this.container).updatePosition(coords);
+        _class_private_field_set(this, _anchorRectProvider, anchorRectProvider ?? null);
+        _class_private_method_get(this, _captureScrollFollowBaseline, captureScrollFollowBaseline).call(this);
     }
     /**
    * Updates the dimensions of the menu based on its content.
@@ -577,6 +666,27 @@ var /**
         }
     }
     /**
+   * Document's scroll listener (capture phase). When an element outside of the menu
+   * is scrolled, repositions the menu so it stays visually attached to its anchor
+   * (column header, cell, or parent menu item) — the menu is rendered in a portal
+   * positioned in document coordinates, so it would otherwise stay stranded (#12719).
+   * Closes the menu when the anchor is scrolled out of the rendered viewport.
+   * Ignored: page/document scroll (document coordinates already track it), scrolls
+   * within the menu, and scrolls of elements that contain the menu (custom
+   * `uiContainer` — the menu moves natively with its container).
+   *
+   * @private
+   * @param {Event} event The scroll event object.
+   */ onDocumentScroll(event) {
+        if (!this.isOpened() || _class_private_field_get(this, _scrollFollowBaseline) === null) {
+            return;
+        }
+        if (!isHTMLElement(event.target) || isChildOf(event.target, '.htMenu')) {
+            return;
+        }
+        _class_private_method_get(this, _followAnchor, followAnchor).call(this, event.target);
+    }
+    /**
    * Document's contextmenu listener.
    *
    * @private
@@ -593,7 +703,12 @@ var /**
    * @param {Core} hotInstance Handsontable instance.
    * @param {MenuOptions} [options] Menu options.
    */ constructor(hotInstance, options){
+        _class_private_method_init(this, _registerScrollListeners);
+        _class_private_method_init(this, _clearScrollListeners);
         _class_private_method_init(this, _getSourceDataAtRow);
+        _class_private_method_init(this, _captureScrollFollowBaseline);
+        _class_private_method_init(this, _followAnchor);
+        _class_private_method_init(this, _armHoverSuppression);
         _class_private_field_init(this, _navigator, {
             writable: true,
             value: void 0
@@ -606,6 +721,26 @@ var /**
             writable: true,
             value: void 0
         });
+        _class_private_field_init(this, _anchorRectProvider, {
+            writable: true,
+            value: void 0
+        });
+        _class_private_field_init(this, _scrollFollowBaseline, {
+            writable: true,
+            value: void 0
+        });
+        _class_private_field_init(this, _suppressHoverSubMenuToggle, {
+            writable: true,
+            value: void 0
+        });
+        _class_private_field_init(this, _suppressHoverSubMenuToggleFrameId, {
+            writable: true,
+            value: void 0
+        });
+        _class_private_field_init(this, _detachScrollListeners, {
+            writable: true,
+            value: void 0
+        });
         /**
    * The instance of the Handsontable that is used as a menu.
    *
@@ -626,6 +761,11 @@ var /**
    */ this.origOutsideClickDeselects = undefined;
         _class_private_field_set(this, _navigator, null);
         _class_private_field_set(this, _shortcutsCtrl, null);
+        _class_private_field_set(this, _anchorRectProvider, null);
+        _class_private_field_set(this, _scrollFollowBaseline, null);
+        _class_private_field_set(this, _suppressHoverSubMenuToggle, false);
+        _class_private_field_set(this, _suppressHoverSubMenuToggleFrameId, null);
+        _class_private_field_set(this, _detachScrollListeners, []);
         this.hot = hotInstance;
         this.options = {
             parent: null,
@@ -657,8 +797,69 @@ var /**
         });
     }
 }
+function registerScrollListeners() {
+    _class_private_method_get(this, _clearScrollListeners, clearScrollListeners).call(this);
+    let frame = this.hot.rootWindow;
+    while(frame){
+        _class_private_field_get(this, _detachScrollListeners).push(this.eventManager.addEventListener(frame.document, 'scroll', (event)=>this.onDocumentScroll(event), {
+            capture: true,
+            passive: true
+        }));
+        frame = getParentWindow(frame);
+    }
+}
+function clearScrollListeners() {
+    _class_private_field_get(this, _detachScrollListeners).forEach((detach)=>detach());
+    _class_private_field_get(this, _detachScrollListeners).length = 0;
+}
 function getSourceDataAtRow(row) {
     const data = this.hotMenu?.getSourceDataAtRow(row);
     return data ? data : null;
 }
+function captureScrollFollowBaseline() {
+    var _this, _this1, _ref;
+    const menuRect = this.container.getBoundingClientRect();
+    const anchorRect = ((_this = _class_private_field_get(_ref = _this1 = this, _anchorRectProvider)) === null || _this === void 0 ? void 0 : _this.call(_this1)) ?? this.hot.rootElement.getBoundingClientRect();
+    _class_private_field_set(this, _scrollFollowBaseline, {
+        offsetLeft: menuRect.left - anchorRect.left,
+        offsetTop: menuRect.top - anchorRect.top
+    });
+}
+function followAnchor(scrolledElement) {
+    let anchorRect;
+    if (_class_private_field_get(this, _anchorRectProvider)) {
+        anchorRect = _class_private_field_get(this, _anchorRectProvider).call(this);
+    } else if (scrolledElement === this.hot.rootElement || isChildOf(scrolledElement, this.hot.rootElement)) {
+        this.close(true);
+        return;
+    } else {
+        anchorRect = this.hot.rootElement.getBoundingClientRect();
+    }
+    if (anchorRect === null) {
+        this.close(true);
+        return;
+    }
+    const { offsetLeft, offsetTop } = _class_private_field_get(this, _scrollFollowBaseline);
+    const menuRect = this.container.getBoundingClientRect();
+    const correctionLeft = anchorRect.left + offsetLeft - menuRect.left;
+    const correctionTop = anchorRect.top + offsetTop - menuRect.top;
+    if (correctionLeft === 0 && correctionTop === 0) {
+        return;
+    }
+    this.container.style.left = `${(Number.parseFloat(this.container.style.left) || 0) + correctionLeft}px`;
+    this.container.style.top = `${(Number.parseFloat(this.container.style.top) || 0) + correctionTop}px`;
+    _class_private_method_get(this, _armHoverSuppression, armHoverSuppression).call(this);
+}
+function armHoverSuppression() {
+    _class_private_field_set(this, _suppressHoverSubMenuToggle, true);
+    if (_class_private_field_get(this, _suppressHoverSubMenuToggleFrameId) !== null) {
+        this.hot.rootWindow.cancelAnimationFrame(_class_private_field_get(this, _suppressHoverSubMenuToggleFrameId));
+    }
+    _class_private_field_set(this, _suppressHoverSubMenuToggleFrameId, this.hot.rootWindow.requestAnimationFrame(()=>{
+        _class_private_field_set(this, _suppressHoverSubMenuToggleFrameId, this.hot.rootWindow.requestAnimationFrame(()=>{
+            _class_private_field_set(this, _suppressHoverSubMenuToggle, false);
+            _class_private_field_set(this, _suppressHoverSubMenuToggleFrameId, null);
+        }));
+    }));
+}
 mixin(Menu, localHooks);

package/plugins/contextMenu/menu/positioner.js

@@ -15,15 +15,12 @@ function _check_private_redeclaration(obj, privateCollection) {
     }
 }
 function _class_apply_descriptor_get(receiver, descriptor) {
-    if (descriptor.get) {
-        return descriptor.get.call(receiver);
-    }
+    if (descriptor.get) return descriptor.get.call(receiver);
     return descriptor.value;
 }
 function _class_apply_descriptor_set(receiver, descriptor, value) {
-    if (descriptor.set) {
-        descriptor.set.call(receiver, value);
-    } else {
+    if (descriptor.set) descriptor.set.call(receiver, value);
+    else {
         if (!descriptor.writable) {
             throw new TypeError("attempted to set read only private field");
         }
@@ -31,9 +28,7 @@ function _class_apply_descriptor_set(receiver, descriptor, value) {
     }
 }
 function _class_extract_field_descriptor(receiver, privateMap, action) {
-    if (!privateMap.has(receiver)) {
-        throw new TypeError("attempted to " + action + " private field on non-instance");
-    }
+    if (!privateMap.has(receiver)) throw new TypeError("attempted to " + action + " private field on non-instance");
     return privateMap.get(receiver);
 }
 function _class_private_field_get(receiver, privateMap) {

package/plugins/contextMenu/menu/positioner.mjs

@@ -4,15 +4,12 @@ function _check_private_redeclaration(obj, privateCollection) {
     }
 }
 function _class_apply_descriptor_get(receiver, descriptor) {
-    if (descriptor.get) {
-        return descriptor.get.call(receiver);
-    }
+    if (descriptor.get) return descriptor.get.call(receiver);
     return descriptor.value;
 }
 function _class_apply_descriptor_set(receiver, descriptor, value) {
-    if (descriptor.set) {
-        descriptor.set.call(receiver, value);
-    } else {
+    if (descriptor.set) descriptor.set.call(receiver, value);
+    else {
         if (!descriptor.writable) {
             throw new TypeError("attempted to set read only private field");
         }
@@ -20,9 +17,7 @@ function _class_apply_descriptor_set(receiver, descriptor, value) {
     }
 }
 function _class_extract_field_descriptor(receiver, privateMap, action) {
-    if (!privateMap.has(receiver)) {
-        throw new TypeError("attempted to " + action + " private field on non-instance");
-    }
+    if (!privateMap.has(receiver)) throw new TypeError("attempted to " + action + " private field on non-instance");
     return privateMap.get(receiver);
 }
 function _class_private_field_get(receiver, privateMap) {

package/plugins/contextMenu/predefinedItems/alignment.js

@@ -30,18 +30,12 @@ function _getRequireWildcardCache(nodeInterop) {
     })(nodeInterop);
 }
 function _interop_require_wildcard(obj, nodeInterop) {
-    if (!nodeInterop && obj && obj.__esModule) {
-        return obj;
-    }
-    if (obj === null || typeof obj !== "object" && typeof obj !== "function") {
-        return {
-            default: obj
-        };
-    }
+    if (!nodeInterop && obj && obj.__esModule) return obj;
+    if (obj === null || typeof obj !== "object" && typeof obj !== "function") return {
+        default: obj
+    };
     var cache = _getRequireWildcardCache(nodeInterop);
-    if (cache && cache.has(obj)) {
-        return cache.get(obj);
-    }
+    if (cache && cache.has(obj)) return cache.get(obj);
     var newObj = {
         __proto__: null
     };
@@ -49,17 +43,12 @@ function _interop_require_wildcard(obj, nodeInterop) {
     for(var key in obj){
         if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
             var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
-            if (desc && (desc.get || desc.set)) {
-                Object.defineProperty(newObj, key, desc);
-            } else {
-                newObj[key] = obj[key];
-            }
+            if (desc && (desc.get || desc.set)) Object.defineProperty(newObj, key, desc);
+            else newObj[key] = obj[key];
         }
     }
     newObj.default = obj;
-    if (cache) {
-        cache.set(obj, newObj);
-    }
+    if (cache) cache.set(obj, newObj);
     return newObj;
 }
 const KEY = 'alignment';
@@ -91,11 +80,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htLeft';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -107,11 +96,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htCenter';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -123,11 +112,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htRight';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -139,11 +128,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htJustify';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -158,11 +147,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'vertical';
                         const alignment = 'htTop';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -174,11 +163,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'vertical';
                         const alignment = 'htMiddle';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -190,11 +179,11 @@ function alignmentItem() {
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = (0, _utils.getAlignmentClasses)(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'vertical';
                         const alignment = 'htBottom';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        (0, _utils.align)(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false

package/plugins/contextMenu/predefinedItems/alignment.mjs

@@ -32,11 +32,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htLeft';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -48,11 +48,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htCenter';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -64,11 +64,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htRight';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -80,11 +80,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'horizontal';
                         const alignment = 'htJustify';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -99,11 +99,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'vertical';
                         const alignment = 'htTop';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -115,11 +115,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'vertical';
                         const alignment = 'htMiddle';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false
@@ -131,11 +131,11 @@ export const KEY = 'alignment';
                     },
                     callback () {
                         const selectedRange = this.getSelectedRange() ?? [];
-                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMeta(row, col).className);
+                        const stateBefore = getAlignmentClasses(selectedRange, (row, col)=>this.getCellMetaTransient(row, col).className);
                         const type = 'vertical';
                         const alignment = 'htBottom';
                         this.runHooks('beforeCellAlignment', stateBefore, selectedRange, type, alignment);
-                        align(selectedRange, type, alignment, (row, col)=>this.getCellMeta(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
+                        align(selectedRange, type, alignment, (row, col)=>this.getCellMetaTransient(row, col), (row, col, key, value)=>this.setCellMeta(row, col, key, value));
                         this.render();
                     },
                     disabled: false