handsontable 0.0.0-next-06a64be-20230621 → 0.0.0-next-d1c8e0e-20230621

package/plugins/columnSorting/columnSorting.js

@@ -19,7 +19,7 @@ require("core-js/modules/es.regexp.to-string.js");
 require("core-js/modules/es.function.name.js");
 require("core-js/modules/es.regexp.exec.js");
 exports.__esModule = true;
-exports.PLUGIN_PRIORITY = exports.PLUGIN_KEY = exports.ColumnSorting = void 0;
+exports.REPLACE_COLUMN_CONFIG_STRATEGY = exports.PLUGIN_PRIORITY = exports.PLUGIN_KEY = exports.ColumnSorting = exports.APPEND_COLUMN_CONFIG_STRATEGY = void 0;
 require("core-js/modules/es.array.sort.js");
 require("core-js/modules/es.array.slice.js");
 require("core-js/modules/es.object.to-string.js");
@@ -79,7 +79,10 @@ exports.PLUGIN_KEY = PLUGIN_KEY;
 var PLUGIN_PRIORITY = 50;
 exports.PLUGIN_PRIORITY = PLUGIN_PRIORITY;
 var APPEND_COLUMN_CONFIG_STRATEGY = 'append';
+exports.APPEND_COLUMN_CONFIG_STRATEGY = APPEND_COLUMN_CONFIG_STRATEGY;
 var REPLACE_COLUMN_CONFIG_STRATEGY = 'replace';
+exports.REPLACE_COLUMN_CONFIG_STRATEGY = REPLACE_COLUMN_CONFIG_STRATEGY;
+var SHORTCUTS_GROUP = PLUGIN_KEY;
 (0, _sortService.registerRootComparator)(PLUGIN_KEY, _rootComparator.rootComparator);
 _pluginHooks.default.getSingleton().register('beforeColumnSort');
 _pluginHooks.default.getSingleton().register('afterColumnSort');
@@ -223,6 +226,7 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       if (this.hot.view) {
         this.loadOrSortBySettings();
       }
+      this.registerShortcuts();
       _get(_getPrototypeOf(ColumnSorting.prototype), "enablePlugin", this).call(this);
     }
 
@@ -256,9 +260,47 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       this.columnStatesManager.destroy();
       this.columnMetaCache = null;
       this.columnStatesManager = null;
+      this.unregisterShortcuts();
       _get(_getPrototypeOf(ColumnSorting.prototype), "disablePlugin", this).call(this);
     }
 
+    /**
+     * Register shortcuts responsible for toggling column sorting functionality.
+     *
+     * @private
+     */
+  }, {
+    key: "registerShortcuts",
+    value: function registerShortcuts() {
+      var _this4 = this;
+      this.hot.getShortcutManager().getContext('grid').addShortcut({
+        keys: [['Enter']],
+        callback: function callback() {
+          var _this4$hot$getSelecte = _this4.hot.getSelectedRangeLast(),
+            highlight = _this4$hot$getSelecte.highlight;
+          if (highlight.row === -1 && highlight.col >= 0) {
+            _this4.sort(_this4.getColumnNextConfig(highlight.col));
+          }
+        },
+        runOnlyIf: function runOnlyIf() {
+          var _this4$hot$getSelecte2;
+          return (_this4$hot$getSelecte2 = _this4.hot.getSelectedRangeLast()) === null || _this4$hot$getSelecte2 === void 0 ? void 0 : _this4$hot$getSelecte2.highlight.isHeader();
+        },
+        group: SHORTCUTS_GROUP
+      });
+    }
+
+    /**
+     * Unregister shortcuts responsible for toggling column sorting functionality.
+     *
+     * @private
+     */
+  }, {
+    key: "unregisterShortcuts",
+    value: function unregisterShortcuts() {
+      this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
+    }
+
     // DIFF - MultiColumnSorting & ColumnSorting: changed function documentation.
     /**
      * Sorts the table by chosen columns and orders.
@@ -428,13 +470,13 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "saveAllSortSettings",
     value: function saveAllSortSettings(sortConfigs) {
-      var _this4 = this;
+      var _this5 = this;
       var allSortSettings = this.columnStatesManager.getAllColumnsProperties();
       var translateColumnToPhysical = function translateColumnToPhysical(_ref2) {
         var visualColumn = _ref2.column,
           restOfProperties = _objectWithoutProperties(_ref2, _excluded);
         return _objectSpread({
-          column: _this4.hot.toPhysicalColumn(visualColumn)
+          column: _this5.hot.toPhysicalColumn(visualColumn)
         }, restOfProperties);
       };
       allSortSettings.initialConfig = (0, _array.arrayMap)(sortConfigs, translateColumnToPhysical);
@@ -452,7 +494,7 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "getAllSavedSortSettings",
     value: function getAllSavedSortSettings() {
-      var _this5 = this;
+      var _this6 = this;
       var storedAllSortSettings = {};
       this.hot.runHooks('persistentStateLoad', 'columnSorting', storedAllSortSettings);
       var allSortSettings = storedAllSortSettings.value;
@@ -460,7 +502,7 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
         var physicalColumn = _ref3.column,
           restOfProperties = _objectWithoutProperties(_ref3, _excluded2);
         return _objectSpread({
-          column: _this5.hot.toVisualColumn(physicalColumn)
+          column: _this6.hot.toVisualColumn(physicalColumn)
         }, restOfProperties);
       };
       if ((0, _mixed.isDefined)(allSortSettings) && Array.isArray(allSortSettings.initialConfig)) {
@@ -625,7 +667,7 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "sortByPresetSortStates",
     value: function sortByPresetSortStates(sortConfigs) {
-      var _this6 = this;
+      var _this7 = this;
       if (sortConfigs.length === 0) {
         this.hot.rowIndexMapper.setIndexesSequence(this.indexesSequenceCache.getValues());
         return;
@@ -634,7 +676,7 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       var numberOfRows = this.hot.countRows();
       var getDataForSortedColumns = function getDataForSortedColumns(visualRowIndex) {
         return (0, _array.arrayMap)(sortConfigs, function (sortConfig) {
-          return _this6.hot.getDataAtCell(visualRowIndex, sortConfig.column);
+          return _this7.hot.getDataAtCell(visualRowIndex, sortConfig.column);
         });
       };
       for (var visualRowIndex = 0; visualRowIndex < this.getNumberOfRowsToSort(numberOfRows); visualRowIndex += 1) {
@@ -646,7 +688,7 @@ var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       (0, _sortService.sort)(indexesWithData, this.pluginKey, (0, _array.arrayMap)(sortConfigs, function (sortConfig) {
         return sortConfig.sortOrder;
       }), (0, _array.arrayMap)(sortConfigs, function (sortConfig) {
-        return _this6.getFirstCellSettings(sortConfig.column);
+        return _this7.getFirstCellSettings(sortConfig.column);
       }));
 
       // Append spareRows

package/plugins/columnSorting/columnSorting.mjs

@@ -71,8 +71,9 @@ import { rootComparator } from "./rootComparator.mjs";
 import { registerRootComparator, sort } from "./sortService/index.mjs";
 export var PLUGIN_KEY = 'columnSorting';
 export var PLUGIN_PRIORITY = 50;
-var APPEND_COLUMN_CONFIG_STRATEGY = 'append';
-var REPLACE_COLUMN_CONFIG_STRATEGY = 'replace';
+export var APPEND_COLUMN_CONFIG_STRATEGY = 'append';
+export var REPLACE_COLUMN_CONFIG_STRATEGY = 'replace';
+var SHORTCUTS_GROUP = PLUGIN_KEY;
 registerRootComparator(PLUGIN_KEY, rootComparator);
 Hooks.getSingleton().register('beforeColumnSort');
 Hooks.getSingleton().register('afterColumnSort');
@@ -216,6 +217,7 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       if (this.hot.view) {
         this.loadOrSortBySettings();
       }
+      this.registerShortcuts();
       _get(_getPrototypeOf(ColumnSorting.prototype), "enablePlugin", this).call(this);
     }
 
@@ -249,9 +251,47 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       this.columnStatesManager.destroy();
       this.columnMetaCache = null;
       this.columnStatesManager = null;
+      this.unregisterShortcuts();
       _get(_getPrototypeOf(ColumnSorting.prototype), "disablePlugin", this).call(this);
     }
 
+    /**
+     * Register shortcuts responsible for toggling column sorting functionality.
+     *
+     * @private
+     */
+  }, {
+    key: "registerShortcuts",
+    value: function registerShortcuts() {
+      var _this4 = this;
+      this.hot.getShortcutManager().getContext('grid').addShortcut({
+        keys: [['Enter']],
+        callback: function callback() {
+          var _this4$hot$getSelecte = _this4.hot.getSelectedRangeLast(),
+            highlight = _this4$hot$getSelecte.highlight;
+          if (highlight.row === -1 && highlight.col >= 0) {
+            _this4.sort(_this4.getColumnNextConfig(highlight.col));
+          }
+        },
+        runOnlyIf: function runOnlyIf() {
+          var _this4$hot$getSelecte2;
+          return (_this4$hot$getSelecte2 = _this4.hot.getSelectedRangeLast()) === null || _this4$hot$getSelecte2 === void 0 ? void 0 : _this4$hot$getSelecte2.highlight.isHeader();
+        },
+        group: SHORTCUTS_GROUP
+      });
+    }
+
+    /**
+     * Unregister shortcuts responsible for toggling column sorting functionality.
+     *
+     * @private
+     */
+  }, {
+    key: "unregisterShortcuts",
+    value: function unregisterShortcuts() {
+      this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
+    }
+
     // DIFF - MultiColumnSorting & ColumnSorting: changed function documentation.
     /**
      * Sorts the table by chosen columns and orders.
@@ -421,13 +461,13 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "saveAllSortSettings",
     value: function saveAllSortSettings(sortConfigs) {
-      var _this4 = this;
+      var _this5 = this;
       var allSortSettings = this.columnStatesManager.getAllColumnsProperties();
       var translateColumnToPhysical = function translateColumnToPhysical(_ref2) {
         var visualColumn = _ref2.column,
           restOfProperties = _objectWithoutProperties(_ref2, _excluded);
         return _objectSpread({
-          column: _this4.hot.toPhysicalColumn(visualColumn)
+          column: _this5.hot.toPhysicalColumn(visualColumn)
         }, restOfProperties);
       };
       allSortSettings.initialConfig = arrayMap(sortConfigs, translateColumnToPhysical);
@@ -445,7 +485,7 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "getAllSavedSortSettings",
     value: function getAllSavedSortSettings() {
-      var _this5 = this;
+      var _this6 = this;
       var storedAllSortSettings = {};
       this.hot.runHooks('persistentStateLoad', 'columnSorting', storedAllSortSettings);
       var allSortSettings = storedAllSortSettings.value;
@@ -453,7 +493,7 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
         var physicalColumn = _ref3.column,
           restOfProperties = _objectWithoutProperties(_ref3, _excluded2);
         return _objectSpread({
-          column: _this5.hot.toVisualColumn(physicalColumn)
+          column: _this6.hot.toVisualColumn(physicalColumn)
         }, restOfProperties);
       };
       if (isDefined(allSortSettings) && Array.isArray(allSortSettings.initialConfig)) {
@@ -618,7 +658,7 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "sortByPresetSortStates",
     value: function sortByPresetSortStates(sortConfigs) {
-      var _this6 = this;
+      var _this7 = this;
       if (sortConfigs.length === 0) {
         this.hot.rowIndexMapper.setIndexesSequence(this.indexesSequenceCache.getValues());
         return;
@@ -627,7 +667,7 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       var numberOfRows = this.hot.countRows();
       var getDataForSortedColumns = function getDataForSortedColumns(visualRowIndex) {
         return arrayMap(sortConfigs, function (sortConfig) {
-          return _this6.hot.getDataAtCell(visualRowIndex, sortConfig.column);
+          return _this7.hot.getDataAtCell(visualRowIndex, sortConfig.column);
         });
       };
       for (var visualRowIndex = 0; visualRowIndex < this.getNumberOfRowsToSort(numberOfRows); visualRowIndex += 1) {
@@ -639,7 +679,7 @@ export var ColumnSorting = /*#__PURE__*/function (_BasePlugin) {
       sort(indexesWithData, this.pluginKey, arrayMap(sortConfigs, function (sortConfig) {
         return sortConfig.sortOrder;
       }), arrayMap(sortConfigs, function (sortConfig) {
-        return _this6.getFirstCellSettings(sortConfig.column);
+        return _this7.getFirstCellSettings(sortConfig.column);
       }));
 
       // Append spareRows

package/plugins/columnSorting/index.js

@@ -1,8 +1,10 @@
 "use strict";
 
 exports.__esModule = true;
-exports.PLUGIN_PRIORITY = exports.PLUGIN_KEY = exports.ColumnSorting = void 0;
+exports.REPLACE_COLUMN_CONFIG_STRATEGY = exports.PLUGIN_PRIORITY = exports.PLUGIN_KEY = exports.ColumnSorting = exports.APPEND_COLUMN_CONFIG_STRATEGY = void 0;
 var _columnSorting = require("./columnSorting");
 exports.PLUGIN_KEY = _columnSorting.PLUGIN_KEY;
 exports.PLUGIN_PRIORITY = _columnSorting.PLUGIN_PRIORITY;
-exports.ColumnSorting = _columnSorting.ColumnSorting;
+exports.ColumnSorting = _columnSorting.ColumnSorting;
+exports.APPEND_COLUMN_CONFIG_STRATEGY = _columnSorting.APPEND_COLUMN_CONFIG_STRATEGY;
+exports.REPLACE_COLUMN_CONFIG_STRATEGY = _columnSorting.REPLACE_COLUMN_CONFIG_STRATEGY;

package/plugins/columnSorting/index.mjs

@@ -1 +1 @@
-export { PLUGIN_KEY, PLUGIN_PRIORITY, ColumnSorting } from "./columnSorting.mjs";
+export { PLUGIN_KEY, PLUGIN_PRIORITY, ColumnSorting, APPEND_COLUMN_CONFIG_STRATEGY, REPLACE_COLUMN_CONFIG_STRATEGY } from "./columnSorting.mjs";

package/plugins/comments/comments.js

@@ -835,7 +835,14 @@ var Comments = /*#__PURE__*/function (_BasePlugin) {
     key: "addToContextMenu",
     value: function addToContextMenu(defaultOptions) {
       var _this6 = this;
-      var isThereAnyCellRendered = function isThereAnyCellRendered() {
+      var isThereAnySelectedCellToProcess = function isThereAnySelectedCellToProcess() {
+        var range = _this6.hot.getSelectedRangeLast();
+        if (!range) {
+          return false;
+        }
+        if (range.isSingleHeader() || range.highlight.isHeader()) {
+          return false;
+        }
         return _this6.hot.rowIndexMapper.getRenderableIndexesLength() > 0 && _this6.hot.columnIndexMapper.getRenderableIndexesLength() > 0;
       };
       defaultOptions.items.push({
@@ -852,7 +859,7 @@ var Comments = /*#__PURE__*/function (_BasePlugin) {
           return _this6.onContextMenuAddComment();
         },
         disabled: function disabled() {
-          if (!isThereAnyCellRendered()) {
+          if (!isThereAnySelectedCellToProcess()) {
             return true;
           }
           return !(_this6.hot.getSelectedLast() && !_this6.hot.selection.isSelectedByCorner());
@@ -866,7 +873,7 @@ var Comments = /*#__PURE__*/function (_BasePlugin) {
           return _this6.onContextMenuRemoveComment();
         },
         disabled: function disabled() {
-          if (!isThereAnyCellRendered()) {
+          if (!isThereAnySelectedCellToProcess()) {
             return true;
           }
           return !(_this6.hot.getSelectedLast() && !_this6.hot.selection.isSelectedByCorner());
@@ -894,7 +901,7 @@ var Comments = /*#__PURE__*/function (_BasePlugin) {
           return _this6.onContextMenuMakeReadOnly();
         },
         disabled: function disabled() {
-          if (!isThereAnyCellRendered()) {
+          if (!isThereAnySelectedCellToProcess()) {
             return true;
           }
           return !(_this6.hot.getSelectedLast() && !_this6.hot.selection.isSelectedByCorner()) || !_this6.checkSelectionCommentsConsistency();

package/plugins/comments/comments.mjs

@@ -826,7 +826,14 @@ export var Comments = /*#__PURE__*/function (_BasePlugin) {
     key: "addToContextMenu",
     value: function addToContextMenu(defaultOptions) {
       var _this6 = this;
-      var isThereAnyCellRendered = function isThereAnyCellRendered() {
+      var isThereAnySelectedCellToProcess = function isThereAnySelectedCellToProcess() {
+        var range = _this6.hot.getSelectedRangeLast();
+        if (!range) {
+          return false;
+        }
+        if (range.isSingleHeader() || range.highlight.isHeader()) {
+          return false;
+        }
         return _this6.hot.rowIndexMapper.getRenderableIndexesLength() > 0 && _this6.hot.columnIndexMapper.getRenderableIndexesLength() > 0;
       };
       defaultOptions.items.push({
@@ -843,7 +850,7 @@ export var Comments = /*#__PURE__*/function (_BasePlugin) {
           return _this6.onContextMenuAddComment();
         },
         disabled: function disabled() {
-          if (!isThereAnyCellRendered()) {
+          if (!isThereAnySelectedCellToProcess()) {
             return true;
           }
           return !(_this6.hot.getSelectedLast() && !_this6.hot.selection.isSelectedByCorner());
@@ -857,7 +864,7 @@ export var Comments = /*#__PURE__*/function (_BasePlugin) {
           return _this6.onContextMenuRemoveComment();
         },
         disabled: function disabled() {
-          if (!isThereAnyCellRendered()) {
+          if (!isThereAnySelectedCellToProcess()) {
             return true;
           }
           return !(_this6.hot.getSelectedLast() && !_this6.hot.selection.isSelectedByCorner());
@@ -885,7 +892,7 @@ export var Comments = /*#__PURE__*/function (_BasePlugin) {
           return _this6.onContextMenuMakeReadOnly();
         },
         disabled: function disabled() {
-          if (!isThereAnyCellRendered()) {
+          if (!isThereAnySelectedCellToProcess()) {
             return true;
           }
           return !(_this6.hot.getSelectedLast() && !_this6.hot.selection.isSelectedByCorner()) || !_this6.checkSelectionCommentsConsistency();

package/plugins/contextMenu/contextMenu.d.ts

@@ -60,7 +60,7 @@ export class ContextMenu extends BasePlugin {
 
   constructor(hotInstance: Core);
   isEnabled(): boolean;
-  open(event: Event): void;
+  open(position: { left: number, top: number } | Event, offset?: { above?: number, below?: number, left?: number, right?: number }): void;
   close(): void;
   executeCommand(commandName: string, ...params: any): void;
 }

package/plugins/contextMenu/contextMenu.js

@@ -22,10 +22,12 @@ require("core-js/modules/es.object.get-prototype-of.js");
 var _base = require("../base");
 var _pluginHooks = _interopRequireDefault(require("../../pluginHooks"));
 var _array = require("../../helpers/array");
+var _object = require("../../helpers/object");
 var _commandExecutor = _interopRequireDefault(require("./commandExecutor"));
 var _eventManager = _interopRequireDefault(require("../../eventManager"));
 var _itemsFactory = _interopRequireDefault(require("./itemsFactory"));
 var _menu = _interopRequireDefault(require("./menu"));
+var _utils = require("./utils");
 var _element = require("../../helpers/dom/element");
 var _predefinedItems = require("./predefinedItems");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -47,6 +49,7 @@ var PLUGIN_KEY = 'contextMenu';
 exports.PLUGIN_KEY = PLUGIN_KEY;
 var PLUGIN_PRIORITY = 70;
 exports.PLUGIN_PRIORITY = PLUGIN_PRIORITY;
+var SHORTCUTS_GROUP = PLUGIN_KEY;
 _pluginHooks.default.getSingleton().register('afterContextMenuDefaultOptions');
 _pluginHooks.default.getSingleton().register('beforeContextMenuShow');
 _pluginHooks.default.getSingleton().register('afterContextMenuShow');
@@ -168,6 +171,7 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
       this.addHook('afterOnCellContextMenu', function (event) {
         return _this2.onAfterOnCellContextMenu(event);
       });
+      this.registerShortcuts();
       _get(_getPrototypeOf(ContextMenu.prototype), "enablePlugin", this).call(this);
     }
 
@@ -182,6 +186,7 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
     value: function updatePlugin() {
       this.disablePlugin();
       this.enablePlugin();
+      this.unregisterShortcuts();
       _get(_getPrototypeOf(ContextMenu.prototype), "updatePlugin", this).call(this);
     }
 
@@ -199,39 +204,83 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
       _get(_getPrototypeOf(ContextMenu.prototype), "disablePlugin", this).call(this);
     }
 
+    /**
+     * Register shortcuts responsible for toggling context menu.
+     *
+     * @private
+     */
+  }, {
+    key: "registerShortcuts",
+    value: function registerShortcuts() {
+      var _this3 = this;
+      this.hot.getShortcutManager().getContext('grid').addShortcut({
+        keys: [['Control/Meta', 'Shift', '\\'], ['Shift', 'F10']],
+        callback: function callback() {
+          var _this3$hot$getSelecte = _this3.hot.getSelectedRangeLast(),
+            highlight = _this3$hot$getSelecte.highlight;
+          var rect = _this3.hot.getCell(highlight.row, highlight.col, true).getBoundingClientRect();
+          var offset = (0, _utils.getDocumentOffsetByElement)(_this3.menu.container, _this3.hot.rootDocument);
+          _this3.open({
+            left: rect.left + offset.left,
+            top: rect.top + offset.top - 1 + rect.height
+          }, {
+            left: rect.width,
+            above: -rect.height
+          });
+          _this3.hot._registerTimeout(function () {
+            _this3.menu.selectFirstCell();
+          });
+        },
+        runOnlyIf: function runOnlyIf() {
+          return _this3.hot.getSelectedRangeLast() && !_this3.menu.isOpened();
+        },
+        group: SHORTCUTS_GROUP
+      });
+    }
+
+    /**
+     * Unregister shortcuts responsible for toggling context menu.
+     *
+     * @private
+     */
+  }, {
+    key: "unregisterShortcuts",
+    value: function unregisterShortcuts() {
+      this.hot.getShortcutManager().getContext('grid').removeShortcutsByGroup(SHORTCUTS_GROUP);
+    }
+
     /**
      * Opens menu and re-position it based on the passed coordinates.
      *
-     * @param {Event} event The mouse event object.
+     * @param {{ top: number, left: number }|Event} position An object with `top` and `left` properties
+     * which contains coordinates relative to the browsers viewport (without included scroll offsets).
+     * Or if the native event is passed the menu will be positioned based on the `pageX` and `pageY`
+     * coordinates.
+     * @param {{ above: number, below: number, left: number, right: number }} offset An object allows applying
+     * the offset to the menu position.
+     * @fires Hooks#beforeContextMenuShow
+     * @fires Hooks#afterContextMenuShow
      */
   }, {
     key: "open",
-    value: function open(event) {
-      if (!this.menu) {
+    value: function open(position) {
+      var _this$menu,
+        _this4 = this;
+      var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+        above: 0,
+        below: 0,
+        left: 0,
+        right: 0
+      };
+      if ((_this$menu = this.menu) !== null && _this$menu !== void 0 && _this$menu.isOpened()) {
         return;
       }
       this.prepareMenuItems();
       this.menu.open();
-      if (!this.menu.isOpened()) {
-        return;
-      }
-      var offsetTop = 0;
-      var offsetLeft = 0;
-      if (this.hot.rootDocument !== this.menu.container.ownerDocument) {
-        var frameElement = this.hot.rootWindow.frameElement;
-        var _frameElement$getBoun = frameElement.getBoundingClientRect(),
-          top = _frameElement$getBoun.top,
-          left = _frameElement$getBoun.left;
-        offsetTop = top - (0, _element.getWindowScrollTop)(event.view);
-        offsetLeft = left - (0, _element.getWindowScrollLeft)(event.view);
-      } else {
-        offsetTop = -1 * (0, _element.getWindowScrollTop)(this.menu.hotMenu.rootWindow);
-        offsetLeft = -1 * (0, _element.getWindowScrollLeft)(this.menu.hotMenu.rootWindow);
-      }
-      this.menu.setPosition({
-        top: parseInt(event.pageY, 10) + offsetTop,
-        left: parseInt(event.pageX, 10) + offsetLeft
+      (0, _object.objectEach)(offset, function (value, key) {
+        _this4.menu.setOffset(key, value);
       });
+      this.menu.setPosition(position);
     }
 
     /**
@@ -240,10 +289,8 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "close",
     value: function close() {
-      if (!this.menu) {
-        return;
-      }
-      this.menu.close();
+      var _this$menu2;
+      (_this$menu2 = this.menu) === null || _this$menu2 === void 0 ? void 0 : _this$menu2.close();
       this.itemsFactory = null;
     }
 
@@ -300,7 +347,7 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "prepareMenuItems",
     value: function prepareMenuItems() {
-      var _this3 = this;
+      var _this5 = this;
       this.itemsFactory = new _itemsFactory.default(this.hot, ContextMenu.DEFAULT_ITEMS);
       var settings = this.hot.getSettings()[PLUGIN_KEY];
       var predefinedItems = {
@@ -314,7 +361,7 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
 
       // Register all commands. Predefined and added by user or by plugins
       (0, _array.arrayEach)(menuItems, function (command) {
-        return _this3.commandExecutor.registerCommand(command.key, command);
+        return _this5.commandExecutor.registerCommand(command.key, command);
       });
     }
 
@@ -351,7 +398,11 @@ var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
           return;
         }
       }
-      this.open(event);
+      var offset = (0, _utils.getDocumentOffsetByElement)(this.menu.container, this.hot.rootDocument);
+      this.open({
+        top: event.clientY + offset.top,
+        left: event.clientX + offset.left
+      });
     }
 
     /**