handsontable 0.0.0-next-48677e7-20230509 → 0.0.0-next-834f47e-20230509

package/plugins/formulas/formulas.js

@@ -14,9 +14,6 @@ require("core-js/modules/es.symbol.iterator.js");
 require("core-js/modules/es.function.name.js");
 require("core-js/modules/es.array.from.js");
 require("core-js/modules/es.regexp.exec.js");
-require("core-js/modules/es.object.keys.js");
-require("core-js/modules/es.array.filter.js");
-require("core-js/modules/es.object.get-own-property-descriptors.js");
 exports.__esModule = true;
 exports.SETTING_KEYS = exports.PLUGIN_PRIORITY = exports.PLUGIN_KEY = exports.Formulas = void 0;
 require("core-js/modules/es.array.concat.js");
@@ -45,13 +42,12 @@ var _settings = require("./engine/settings");
 var _data = require("../../helpers/data");
 var _string = require("../../helpers/string");
 var _pluginHooks = _interopRequireDefault(require("../../pluginHooks"));
+var _indexSyncer = _interopRequireDefault(require("./indexSyncer"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -87,7 +83,6 @@ var SETTING_KEYS = ['maxRows', 'maxColumns', 'language'];
 exports.SETTING_KEYS = SETTING_KEYS;
 var PLUGIN_PRIORITY = 260;
 exports.PLUGIN_PRIORITY = PLUGIN_PRIORITY;
-var ROW_MOVE_UNDO_REDO_NAME = 'row_move';
 _pluginHooks.default.getSingleton().register('afterNamedExpressionAdded');
 _pluginHooks.default.getSingleton().register('afterNamedExpressionRemoved');
 _pluginHooks.default.getSingleton().register('afterSheetAdded');
@@ -193,6 +188,24 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
      * @type {string|null}
      */
     _defineProperty(_assertThisInitialized(_this), "sheetName", null);
+    /**
+     * Index synchronizer responsible for manipulating with some general options related to indexes synchronization.
+     *
+     * @type {IndexSyncer|null}
+     */
+    _defineProperty(_assertThisInitialized(_this), "indexSyncer", null);
+    /**
+     * Index synchronizer responsible for syncing the order of HOT and HF's data for the axis of the rows.
+     *
+     * @type {AxisSyncer|null}
+     */
+    _defineProperty(_assertThisInitialized(_this), "rowAxisSyncer", null);
+    /**
+     * Index synchronizer responsible for syncing the order of HOT and HF's data for the axis of the columns.
+     *
+     * @type {AxisSyncer|null}
+     */
+    _defineProperty(_assertThisInitialized(_this), "columnAxisSyncer", null);
     return _this;
   }
   _createClass(Formulas, [{
@@ -300,6 +313,41 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       this.addHook('afterRemoveCol', function () {
         return _this8.onAfterRemoveCol.apply(_this8, arguments);
       });
+      this.indexSyncer = new _indexSyncer.default(this.hot.rowIndexMapper, this.hot.columnIndexMapper, function (postponedAction) {
+        _this8.hot.addHookOnce('init', function () {
+          // Engine is initialized after executing callback to `afterLoadData` hook. Thus, some actions on indexes should
+          // be postponed.
+          postponedAction();
+        });
+      });
+      this.rowAxisSyncer = this.indexSyncer.getForAxis('row');
+      this.columnAxisSyncer = this.indexSyncer.getForAxis('column');
+      this.hot.addHook('afterRowSequenceChange', this.rowAxisSyncer.getIndexesChangeSyncMethod());
+      this.hot.addHook('afterColumnSequenceChange', this.columnAxisSyncer.getIndexesChangeSyncMethod());
+      this.hot.addHook('beforeRowMove', function (movedRows, finalIndex, _, movePossible) {
+        _this8.rowAxisSyncer.storeMovesInformation(movedRows, finalIndex, movePossible);
+      });
+      this.hot.addHook('beforeColumnMove', function (movedColumns, finalIndex, _, movePossible) {
+        _this8.columnAxisSyncer.storeMovesInformation(movedColumns, finalIndex, movePossible);
+      });
+      this.hot.addHook('afterRowMove', function (movedRows, finalIndex, dropIndex, movePossible, orderChanged) {
+        _this8.rowAxisSyncer.calculateAndSyncMoves(movePossible, orderChanged);
+      });
+      this.hot.addHook('afterColumnMove', function (movedColumns, finalIndex, dropIndex, movePossible, orderChanged) {
+        _this8.columnAxisSyncer.calculateAndSyncMoves(movePossible, orderChanged);
+      });
+      this.hot.addHook('beforeColumnFreeze', function (column, freezePerformed) {
+        _this8.columnAxisSyncer.storeMovesInformation([column], _this8.hot.getSettings().fixedColumnsStart, freezePerformed);
+      });
+      this.hot.addHook('afterColumnFreeze', function (_, freezePerformed) {
+        _this8.columnAxisSyncer.calculateAndSyncMoves(freezePerformed, freezePerformed);
+      });
+      this.hot.addHook('beforeColumnUnfreeze', function (column, unfreezePerformed) {
+        _this8.columnAxisSyncer.storeMovesInformation([column], _this8.hot.getSettings().fixedColumnsStart - 1, unfreezePerformed);
+      });
+      this.hot.addHook('afterColumnUnfreeze', function (_, unfreezePerformed) {
+        _this8.columnAxisSyncer.calculateAndSyncMoves(unfreezePerformed, unfreezePerformed);
+      });
 
       // TODO: Actions related to overwriting dates from HOT format to HF default format are done as callback to this
       // hook, because some hooks, such as `afterLoadData` doesn't have information about composed cell properties.
@@ -309,22 +357,22 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       });
 
       // Handling undo actions on data just using HyperFormula's UndoRedo mechanism
-      this.addHook('beforeUndo', function (action) {
-        // TODO: Move action isn't handled by HyperFormula.
-        if ((action === null || action === void 0 ? void 0 : action.actionType) === ROW_MOVE_UNDO_REDO_NAME) {
-          return;
-        }
+      this.addHook('beforeUndo', function () {
+        _this8.indexSyncer.setPerformUndo(true);
         _this8.engine.undo();
       });
 
       // Handling redo actions on data just using HyperFormula's UndoRedo mechanism
-      this.addHook('beforeRedo', function (action) {
-        // TODO: Move action isn't handled by HyperFormula.
-        if ((action === null || action === void 0 ? void 0 : action.actionType) === ROW_MOVE_UNDO_REDO_NAME) {
-          return;
-        }
+      this.addHook('beforeRedo', function () {
+        _this8.indexSyncer.setPerformRedo(true);
         _this8.engine.redo();
       });
+      this.addHook('afterUndo', function () {
+        _this8.indexSyncer.setPerformUndo(false);
+      });
+      this.addHook('afterUndo', function () {
+        _this8.indexSyncer.setPerformRedo(false);
+      });
       this.addHook('afterDetachChild', function () {
         return _this8.onAfterDetachChild.apply(_this8, arguments);
       });
@@ -409,63 +457,6 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       _get(_getPrototypeOf(Formulas.prototype), "destroy", this).call(this);
     }
 
-    /**
-     * Helper function for `toPhysicalRowPosition` and `toPhysicalColumnPosition`.
-     *
-     * @private
-     * @param {number} visualIndex Visual entry index.
-     * @param {number} physicalIndex Physical entry index.
-     * @param {number} entriesCount Visual entries count.
-     * @param {number} sourceEntriesCount Source entries count.
-     * @param {boolean} contained `true` if it should return only indexes within boundaries of the table (basically
-     * `toPhysical` alias.
-     * @returns {*}
-     */
-  }, {
-    key: "getPhysicalIndexPosition",
-    value: function getPhysicalIndexPosition(visualIndex, physicalIndex, entriesCount, sourceEntriesCount, contained) {
-      if (!contained) {
-        if (visualIndex >= entriesCount) {
-          return sourceEntriesCount + (visualIndex - entriesCount);
-        }
-      }
-      return physicalIndex;
-    }
-
-    /**
-     * Returns the physical row index. The difference between this and Core's `toPhysical` is that it doesn't return
-     * `null` on rows with indexes higher than the number of rows.
-     *
-     * @private
-     * @param {number} row Visual row index.
-     * @param {boolean} [contained] `true` if it should return only indexes within boundaries of the table (basically
-     * `toPhysical` alias.
-     * @returns {number} The physical row index.
-     */
-  }, {
-    key: "toPhysicalRowPosition",
-    value: function toPhysicalRowPosition(row) {
-      var contained = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      return this.getPhysicalIndexPosition(row, this.hot.toPhysicalRow(row), this.hot.countRows(), this.hot.countSourceRows(), contained);
-    }
-
-    /**
-     * Returns the physical column index. The difference between this and Core's `toPhysical` is that it doesn't return
-     * `null` on columns with indexes higher than the number of columns.
-     *
-     * @private
-     * @param {number} column Visual column index.
-     * @param {boolean} [contained] `true` if it should return only indexes within boundaries of the table (basically
-     * `toPhysical` alias.
-     * @returns {number} The physical column index.
-     */
-  }, {
-    key: "toPhysicalColumnPosition",
-    value: function toPhysicalColumnPosition(column) {
-      var contained = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-      return this.getPhysicalIndexPosition(column, this.hot.toPhysicalColumn(column), this.hot.countCols(), this.hot.countSourceCols(), contained);
-    }
-
     /**
      * Add a sheet to the shared HyperFormula instance.
      *
@@ -536,8 +527,8 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       if (physicalRow !== null && physicalColumn !== null) {
         return this.engine.getCellType({
           sheet: sheet,
-          row: physicalRow,
-          col: physicalColumn
+          row: this.rowAxisSyncer.getHfIndexFromVisualIndex(row),
+          col: this.columnAxisSyncer.getHfIndexFromVisualIndex(column)
         });
       } else {
         // Should return `EMPTY` when out of bounds (according to the test cases).
@@ -557,15 +548,10 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
     key: "isFormulaCellType",
     value: function isFormulaCellType(row, column) {
       var sheet = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : this.sheetId;
-      var physicalRow = this.hot.toPhysicalRow(row);
-      var physicalColumn = this.hot.toPhysicalColumn(column);
-      if (physicalRow === null || physicalColumn === null) {
-        return false;
-      }
       return this.engine.doesCellHaveFormula({
         sheet: sheet,
-        row: physicalRow,
-        col: physicalColumn
+        row: this.rowAxisSyncer.getHfIndexFromVisualIndex(row),
+        col: this.columnAxisSyncer.getHfIndexFromVisualIndex(column)
       });
     }
 
@@ -630,11 +616,9 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
         var _ref8 = (_change$address3 = change.address) !== null && _change$address3 !== void 0 ? _change$address3 : {},
           row = _ref8.row,
           col = _ref8.col;
-        var visualRow = (0, _mixed.isDefined)(row) ? _this12.hot.toVisualRow(row) : null;
-        var visualColumn = (0, _mixed.isDefined)(col) ? _this12.hot.toVisualColumn(col) : null;
 
         // Don't try to validate cells outside of the visual part of the table.
-        if (visualRow === null || visualColumn === null) {
+        if ((0, _mixed.isDefined)(row) === false || (0, _mixed.isDefined)(col) === false || row >= _this12.hot.countRows() || col >= _this12.hot.countCols()) {
           return;
         }
 
@@ -653,7 +637,7 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
           }
 
           // It will just re-render certain cell when necessary.
-          boundHot.validateCell(boundHot.getDataAtCell(visualRow, visualColumn), boundHot.getCellMeta(visualRow, visualColumn), function () {});
+          boundHot.validateCell(boundHot.getDataAtCell(row, col), boundHot.getCellMeta(row, col), function () {});
         }
       });
     }
@@ -671,8 +655,8 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
     key: "syncChangeWithEngine",
     value: function syncChangeWithEngine(row, column, newValue) {
       var address = {
-        row: this.toPhysicalRowPosition(row),
-        col: this.toPhysicalColumnPosition(column),
+        row: this.rowAxisSyncer.getHfIndexFromVisualIndex(row),
+        col: this.columnAxisSyncer.getHfIndexFromVisualIndex(column),
         sheet: this.sheetId
       };
       if (!this.engine.isItPossibleToSetCellContents(address)) {
@@ -708,8 +692,8 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       var visualColumn = this.hot.propToCol(prop);
       if (this.isFormulaCellType(visualRow, visualColumn)) {
         var address = {
-          row: this.hot.toPhysicalRow(visualRow),
-          col: this.hot.toPhysicalColumn(visualColumn),
+          row: this.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow),
+          col: this.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn),
           sheet: this.sheetId
         };
         var cellMeta = this.hot.getCellMeta(visualRow, visualColumn);
@@ -738,19 +722,41 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onBeforeAutofill",
     value: function onBeforeAutofill(fillData, sourceRange, targetRange) {
-      var _this13 = this;
-      var withSheetId = function withSheetId(range) {
-        return _objectSpread(_objectSpread({}, range), {}, {
-          sheet: _this13.sheetId
-        });
-      };
+      var _sourceRange$getTopSt = sourceRange.getTopStartCorner(),
+        sourceTopStartRow = _sourceRange$getTopSt.row,
+        sourceTopStartColumn = _sourceRange$getTopSt.col;
+      var _sourceRange$getBotto = sourceRange.getBottomEndCorner(),
+        sourceBottomEndRow = _sourceRange$getBotto.row,
+        sourceBottomEndColumn = _sourceRange$getBotto.col;
+      var _targetRange$getTopSt = targetRange.getTopStartCorner(),
+        targetTopStartRow = _targetRange$getTopSt.row,
+        targetTopStartColumn = _targetRange$getTopSt.col;
+      var _targetRange$getBotto = targetRange.getBottomEndCorner(),
+        targetBottomEndRow = _targetRange$getBotto.row,
+        targetBottomEndColumn = _targetRange$getBotto.col;
       var engineSourceRange = {
-        start: withSheetId(sourceRange.getTopStartCorner()),
-        end: withSheetId(sourceRange.getBottomEndCorner())
+        start: {
+          row: this.rowAxisSyncer.getHfIndexFromVisualIndex(sourceTopStartRow),
+          col: this.columnAxisSyncer.getHfIndexFromVisualIndex(sourceTopStartColumn),
+          sheet: this.sheetId
+        },
+        end: {
+          row: this.rowAxisSyncer.getHfIndexFromVisualIndex(sourceBottomEndRow),
+          col: this.columnAxisSyncer.getHfIndexFromVisualIndex(sourceBottomEndColumn),
+          sheet: this.sheetId
+        }
       };
       var engineTargetRange = {
-        start: withSheetId(targetRange.getTopStartCorner()),
-        end: withSheetId(targetRange.getBottomEndCorner())
+        start: {
+          row: this.rowAxisSyncer.getHfIndexFromVisualIndex(targetTopStartRow),
+          col: this.columnAxisSyncer.getHfIndexFromVisualIndex(targetTopStartColumn),
+          sheet: this.sheetId
+        },
+        end: {
+          row: this.rowAxisSyncer.getHfIndexFromVisualIndex(targetBottomEndRow),
+          col: this.columnAxisSyncer.getHfIndexFromVisualIndex(targetBottomEndColumn),
+          sheet: this.sheetId
+        }
       };
 
       // Blocks the autofill operation if HyperFormula says that at least one of
@@ -816,19 +822,19 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onAfterCellMetaReset",
     value: function onAfterCellMetaReset() {
-      var _this14 = this;
+      var _this13 = this;
       var sourceDataArray = this.hot.getSourceDataArray();
       var valueChanged = false;
       sourceDataArray.forEach(function (rowData, rowIndex) {
         rowData.forEach(function (cellValue, columnIndex) {
-          var cellMeta = _this14.hot.getCellMeta(rowIndex, columnIndex);
+          var cellMeta = _this13.hot.getCellMeta(rowIndex, columnIndex);
           var dateFormat = cellMeta.dateFormat;
           if ((0, _utils.isDate)(cellValue, cellMeta.type)) {
             valueChanged = true;
             if ((0, _utils.isDateValid)(cellValue, dateFormat)) {
               // Rewriting date in HOT format to HF format.
               sourceDataArray[rowIndex][columnIndex] = (0, _utils.getDateInHfFormat)(cellValue, dateFormat);
-            } else if (_this14.isFormulaCellType(rowIndex, columnIndex) === false) {
+            } else if (_this13.isFormulaCellType(rowIndex, columnIndex) === false) {
               // Escaping value from date parsing using "'" sign (HF feature).
               sourceDataArray[rowIndex][columnIndex] = "'".concat(cellValue);
             }
@@ -863,6 +869,7 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
         if (this.engine.isItPossibleToReplaceSheetContent(this.sheetId, sourceDataArray)) {
           _classPrivateFieldSet(this, _internalOperationPending, true);
           var dependentCells = this.engine.setSheetContent(this.sheetId, sourceDataArray);
+          this.indexSyncer.setupSyncEndpoint(this.engine, this.sheetId);
           this.renderDependentSheets(dependentCells);
           _classPrivateFieldSet(this, _internalOperationPending, false);
         }
@@ -875,24 +882,27 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
      * `modifyData` hook callback.
      *
      * @private
-     * @param {number} row Physical row height.
-     * @param {number} column Physical column index.
+     * @param {number} physicalRow Physical row index.
+     * @param {number} visualColumn Visual column index.
      * @param {object} valueHolder Object which contains original value which can be modified by overwriting `.value`
      *   property.
      * @param {string} ioMode String which indicates for what operation hook is fired (`get` or `set`).
      */
   }, {
     key: "onModifyData",
-    value: function onModifyData(row, column, valueHolder, ioMode) {
+    value: function onModifyData(physicalRow, visualColumn, valueHolder, ioMode) {
       if (ioMode !== 'get' || _classPrivateFieldGet(this, _internalOperationPending) || this.sheetName === null || !this.engine.doesSheetExist(this.sheetName)) {
         return;
       }
-      var visualRow = this.hot.toVisualRow(row);
+      var visualRow = this.hot.toVisualRow(physicalRow);
+      if (visualRow === null || visualColumn === null) {
+        return;
+      }
 
       // `column` is here as visual index because of inconsistencies related to hook execution in `src/dataMap`.
-      var isFormulaCellType = this.isFormulaCellType(visualRow, column);
+      var isFormulaCellType = this.isFormulaCellType(visualRow, visualColumn);
       if (!isFormulaCellType) {
-        var cellType = this.getCellType(visualRow, column);
+        var cellType = this.getCellType(visualRow, visualColumn);
         if (cellType !== 'ARRAY') {
           if ((0, _utils.isEscapedFormulaExpression)(valueHolder.value)) {
             valueHolder.value = (0, _utils.unescapeFormulaExpression)(valueHolder.value);
@@ -900,15 +910,13 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
           return;
         }
       }
-
-      // `toPhysicalColumn` is here because of inconsistencies related to hook execution in `DataMap`.
       var address = {
-        row: row,
-        col: this.toPhysicalColumnPosition(column),
+        row: this.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow),
+        col: this.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn),
         sheet: this.sheetId
       };
       var cellValue = this.engine.getCellValue(address); // Date as an integer (Excel like date).
-      var cellMeta = this.hot.getCellMeta(row, column);
+      var cellMeta = this.hot.getCellMeta(visualRow, visualColumn);
       if (cellMeta.type === 'date' && (0, _number.isNumeric)(cellValue)) {
         cellValue = (0, _utils.getDateFromExcelDate)(cellValue, cellMeta.dateFormat);
       }
@@ -936,6 +944,9 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       }
       var visualRow = this.hot.toVisualRow(row);
       var visualColumn = this.hot.propToCol(columnOrProp);
+      if (visualRow === null || visualColumn === null) {
+        return;
+      }
 
       // `column` is here as visual index because of inconsistencies related to hook execution in `src/dataMap`.
       var isFormulaCellType = this.isFormulaCellType(visualRow, visualColumn);
@@ -955,9 +966,8 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
         return;
       }
       var address = {
-        row: row,
-        // Workaround for inconsistencies in `src/dataSource.js`
-        col: this.toPhysicalColumnPosition(visualColumn),
+        row: this.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow),
+        col: this.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn),
         sheet: this.sheetId
       };
       valueHolder.value = this.engine.getCellSerialized(address);
@@ -974,7 +984,7 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onAfterSetDataAtCell",
     value: function onAfterSetDataAtCell(changes, source) {
-      var _this15 = this;
+      var _this14 = this;
       if (isBlockedSource(source)) {
         return;
       }
@@ -983,21 +993,21 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       var dependentCells = this.engine.batch(function () {
         changes.forEach(function (_ref9) {
           var _ref10 = _slicedToArray(_ref9, 4),
-            row = _ref10[0],
+            visualRow = _ref10[0],
             prop = _ref10[1],
             newValue = _ref10[3];
-          var column = _this15.hot.propToCol(prop);
-          var physicalRow = _this15.hot.toPhysicalRow(row);
-          var physicalColumn = _this15.hot.toPhysicalColumn(column);
+          var visualColumn = _this14.hot.propToCol(prop);
+          var physicalRow = _this14.hot.toPhysicalRow(visualRow);
+          var physicalColumn = _this14.hot.toPhysicalColumn(visualColumn);
           var address = {
-            row: physicalRow,
-            col: physicalColumn,
-            sheet: _this15.sheetId
+            row: _this14.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow),
+            col: _this14.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn),
+            sheet: _this14.sheetId
           };
           if (physicalRow !== null && physicalColumn !== null) {
-            _this15.syncChangeWithEngine(row, column, newValue);
+            _this14.syncChangeWithEngine(visualRow, visualColumn, newValue);
           } else {
-            outOfBoundsChanges.push([row, column, newValue]);
+            outOfBoundsChanges.push([visualRow, visualColumn, newValue]);
           }
           changedCells.push({
             address: address
@@ -1008,16 +1018,16 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
         // Workaround for rows/columns being created two times (by HOT and the engine).
         // (unfortunately, this requires an extra re-render)
         this.hot.addHookOnce('afterChange', function () {
-          var outOfBoundsDependentCells = _this15.engine.batch(function () {
+          var outOfBoundsDependentCells = _this14.engine.batch(function () {
             outOfBoundsChanges.forEach(function (_ref11) {
               var _ref12 = _slicedToArray(_ref11, 3),
                 row = _ref12[0],
                 column = _ref12[1],
                 newValue = _ref12[2];
-              _this15.syncChangeWithEngine(row, column, newValue);
+              _this14.syncChangeWithEngine(row, column, newValue);
             });
           });
-          _this15.renderDependentSheets(outOfBoundsDependentCells, true);
+          _this14.renderDependentSheets(outOfBoundsDependentCells, true);
         });
       }
       this.renderDependentSheets(dependentCells);
@@ -1035,7 +1045,7 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onAfterSetSourceDataAtCell",
     value: function onAfterSetSourceDataAtCell(changes, source) {
-      var _this16 = this;
+      var _this15 = this;
       if (isBlockedSource(source)) {
         return;
       }
@@ -1043,26 +1053,26 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
       var changedCells = [];
       changes.forEach(function (_ref13) {
         var _ref14 = _slicedToArray(_ref13, 4),
-          row = _ref14[0],
+          visualRow = _ref14[0],
           prop = _ref14[1],
           newValue = _ref14[3];
-        var column = _this16.hot.propToCol(prop);
-        if (!(0, _number.isNumeric)(column)) {
+        var visualColumn = _this15.hot.propToCol(prop);
+        if (!(0, _number.isNumeric)(visualColumn)) {
           return;
         }
         var address = {
-          row: row,
-          col: _this16.toPhysicalColumnPosition(column),
-          sheet: _this16.sheetId
+          row: _this15.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow),
+          col: _this15.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn),
+          sheet: _this15.sheetId
         };
-        if (!_this16.engine.isItPossibleToSetCellContents(address)) {
+        if (!_this15.engine.isItPossibleToSetCellContents(address)) {
           (0, _console.warn)("Not possible to set source cell data at ".concat(JSON.stringify(address)));
           return;
         }
         changedCells.push({
           address: address
         });
-        dependentCells.push.apply(dependentCells, _toConsumableArray(_this16.engine.setCellContents(address, newValue)));
+        dependentCells.push.apply(dependentCells, _toConsumableArray(_this15.engine.setCellContents(address, newValue)));
       });
       this.renderDependentSheets(dependentCells);
       this.validateDependentCells(dependentCells, changedCells);
@@ -1072,14 +1082,19 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
      * `beforeCreateRow` hook callback.
      *
      * @private
-     * @param {number} row Represents the visual index of first newly created row in the data source array.
+     * @param {number} visualRow Represents the visual index of first newly created row in the data source array.
      * @param {number} amount Number of newly created rows in the data source array.
      * @returns {*|boolean} If false is returned the action is canceled.
      */
   }, {
     key: "onBeforeCreateRow",
-    value: function onBeforeCreateRow(row, amount) {
-      if (this.sheetId === null || !this.engine.doesSheetExist(this.sheetName) || !this.engine.isItPossibleToAddRows(this.sheetId, [this.toPhysicalRowPosition(row), amount])) {
+    value: function onBeforeCreateRow(visualRow, amount) {
+      var hfRowIndex = this.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow);
+      if (visualRow >= this.hot.countRows()) {
+        hfRowIndex = visualRow; // Row beyond the table boundaries.
+      }
+
+      if (this.sheetId === null || !this.engine.doesSheetExist(this.sheetName) || !this.engine.isItPossibleToAddRows(this.sheetId, [hfRowIndex, amount])) {
         return false;
       }
     }
@@ -1088,14 +1103,19 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
      * `beforeCreateCol` hook callback.
      *
      * @private
-     * @param {number} col Represents the visual index of first newly created column in the data source.
+     * @param {number} visualColumn Represents the visual index of first newly created column in the data source.
      * @param {number} amount Number of newly created columns in the data source.
      * @returns {*|boolean} If false is returned the action is canceled.
      */
   }, {
     key: "onBeforeCreateCol",
-    value: function onBeforeCreateCol(col, amount) {
-      if (this.sheetId === null || !this.engine.doesSheetExist(this.sheetName) || !this.engine.isItPossibleToAddColumns(this.sheetId, [this.toPhysicalColumnPosition(col), amount])) {
+    value: function onBeforeCreateCol(visualColumn, amount) {
+      var hfColumnIndex = this.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn);
+      if (visualColumn >= this.hot.countCols()) {
+        hfColumnIndex = visualColumn; // Column beyond the table boundaries.
+      }
+
+      if (this.sheetId === null || !this.engine.doesSheetExist(this.sheetName) || !this.engine.isItPossibleToAddColumns(this.sheetId, [hfColumnIndex, amount])) {
         return false;
       }
     }
@@ -1112,9 +1132,10 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onBeforeRemoveRow",
     value: function onBeforeRemoveRow(row, amount, physicalRows) {
-      var _this17 = this;
-      var possible = physicalRows.every(function (physicalRow) {
-        return _this17.engine.isItPossibleToRemoveRows(_this17.sheetId, [physicalRow, 1]);
+      var _this16 = this;
+      var hfRows = this.rowAxisSyncer.setRemovedHfIndexes(physicalRows);
+      var possible = hfRows.every(function (hfRow) {
+        return _this16.engine.isItPossibleToRemoveRows(_this16.sheetId, [hfRow, 1]);
       });
       return possible === false ? false : void 0;
     }
@@ -1131,9 +1152,10 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onBeforeRemoveCol",
     value: function onBeforeRemoveCol(col, amount, physicalColumns) {
-      var _this18 = this;
-      var possible = physicalColumns.every(function (physicalColumn) {
-        return _this18.engine.isItPossibleToRemoveColumns(_this18.sheetId, [physicalColumn, 1]);
+      var _this17 = this;
+      var hfColumns = this.columnAxisSyncer.setRemovedHfIndexes(physicalColumns);
+      var possible = hfColumns.every(function (hfColumn) {
+        return _this17.engine.isItPossibleToRemoveColumns(_this17.sheetId, [hfColumn, 1]);
       });
       return possible === false ? false : void 0;
     }
@@ -1142,18 +1164,18 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
      * `afterCreateRow` hook callback.
      *
      * @private
-     * @param {number} row Represents the visual index of first newly created row in the data source array.
+     * @param {number} visualRow Represents the visual index of first newly created row in the data source array.
      * @param {number} amount Number of newly created rows in the data source array.
      * @param {string} [source] String that identifies source of hook call
      *                          ([list of all available sources]{@link https://handsontable.com/docs/javascript-data-grid/events-and-hooks/#handsontable-hooks}).
      */
   }, {
     key: "onAfterCreateRow",
-    value: function onAfterCreateRow(row, amount, source) {
+    value: function onAfterCreateRow(visualRow, amount, source) {
       if (isBlockedSource(source)) {
         return;
       }
-      var changes = this.engine.addRows(this.sheetId, [this.toPhysicalRowPosition(row), amount]);
+      var changes = this.engine.addRows(this.sheetId, [this.rowAxisSyncer.getHfIndexFromVisualIndex(visualRow), amount]);
       this.renderDependentSheets(changes);
     }
 
@@ -1161,18 +1183,18 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
      * `afterCreateCol` hook callback.
      *
      * @private
-     * @param {number} col Represents the visual index of first newly created column in the data source.
+     * @param {number} visualColumn Represents the visual index of first newly created column in the data source.
      * @param {number} amount Number of newly created columns in the data source.
      * @param {string} [source] String that identifies source of hook call
      *                          ([list of all available sources]{@link https://handsontable.com/docs/javascript-data-grid/events-and-hooks/#handsontable-hooks}).
      */
   }, {
     key: "onAfterCreateCol",
-    value: function onAfterCreateCol(col, amount, source) {
+    value: function onAfterCreateCol(visualColumn, amount, source) {
       if (isBlockedSource(source)) {
         return;
       }
-      var changes = this.engine.addColumns(this.sheetId, [this.toPhysicalColumnPosition(col), amount]);
+      var changes = this.engine.addColumns(this.sheetId, [this.columnAxisSyncer.getHfIndexFromVisualIndex(visualColumn), amount]);
       this.renderDependentSheets(changes);
     }
 
@@ -1189,14 +1211,14 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onAfterRemoveRow",
     value: function onAfterRemoveRow(row, amount, physicalRows, source) {
-      var _this19 = this;
+      var _this18 = this;
       if (isBlockedSource(source)) {
         return;
       }
-      var descendingPhysicalRows = physicalRows.sort().reverse();
+      var descendingHfRows = this.rowAxisSyncer.getRemovedHfIndexes().sort().reverse();
       var changes = this.engine.batch(function () {
-        descendingPhysicalRows.forEach(function (physicalRow) {
-          _this19.engine.removeRows(_this19.sheetId, [physicalRow, 1]);
+        descendingHfRows.forEach(function (hfRow) {
+          _this18.engine.removeRows(_this18.sheetId, [hfRow, 1]);
         });
       });
       this.renderDependentSheets(changes);
@@ -1215,14 +1237,14 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "onAfterRemoveCol",
     value: function onAfterRemoveCol(col, amount, physicalColumns, source) {
-      var _this20 = this;
+      var _this19 = this;
       if (isBlockedSource(source)) {
         return;
       }
-      var descendingPhysicalColumns = physicalColumns.sort().reverse();
+      var descendingHfColumns = this.columnAxisSyncer.getRemovedHfIndexes().sort().reverse();
       var changes = this.engine.batch(function () {
-        descendingPhysicalColumns.forEach(function (physicalColumn) {
-          _this20.engine.removeColumns(_this20.sheetId, [physicalColumn, 1]);
+        descendingHfColumns.forEach(function (hfColumn) {
+          _this19.engine.removeColumns(_this19.sheetId, [hfColumn, 1]);
         });
       });
       this.renderDependentSheets(changes);
@@ -1241,16 +1263,16 @@ var Formulas = /*#__PURE__*/function (_BasePlugin) {
     key: "onAfterDetachChild",
     value: function onAfterDetachChild(parent, element, finalElementRowIndex) {
       var _element$__children,
-        _this21 = this;
+        _this20 = this;
       _classPrivateFieldSet(this, _internalOperationPending, true);
       var rowsData = this.hot.getSourceDataArray(finalElementRowIndex, 0, finalElementRowIndex + (((_element$__children = element.__children) === null || _element$__children === void 0 ? void 0 : _element$__children.length) || 0), this.hot.countSourceCols());
       _classPrivateFieldSet(this, _internalOperationPending, false);
       rowsData.forEach(function (row, relativeRowIndex) {
         row.forEach(function (value, colIndex) {
-          _this21.engine.setCellContents({
+          _this20.engine.setCellContents({
             col: colIndex,
             row: finalElementRowIndex + relativeRowIndex,
-            sheet: _this21.sheetId
+            sheet: _this20.sheetId
           }, [[value]]);
         });
       });