handsontable 0.0.0-next-03bda88-20230622 → 0.0.0-next-c3d199b-20230626

package/plugins/comments/contextMenuItem/addEditComment.js

@@ -0,0 +1,51 @@
+"use strict";
+
+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); }
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.symbol.description.js");
+require("core-js/modules/es.symbol.iterator.js");
+exports.__esModule = true;
+exports.default = addEditCommentItem;
+var C = _interopRequireWildcard(require("../../../i18n/constants"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { 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); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; 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]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/**
+ * @param {Comments} plugin The Comments plugin instance.
+ * @returns {object}
+ */
+function addEditCommentItem(plugin) {
+  return {
+    key: 'commentsAddEdit',
+    name: function name() {
+      var _this$getSelectedRang;
+      var highlight = (_this$getSelectedRang = this.getSelectedRangeLast()) === null || _this$getSelectedRang === void 0 ? void 0 : _this$getSelectedRang.highlight;
+      if (highlight && highlight.isCell() && plugin.getCommentAtCell(highlight.row, highlight.col)) {
+        return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_EDIT_COMMENT);
+      }
+      return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_ADD_COMMENT);
+    },
+    callback: function callback() {
+      var range = this.getSelectedRangeLast();
+      this.deselectCell();
+      plugin.setRange(range);
+      plugin.show();
+      plugin.focusEditor();
+    },
+    disabled: function disabled() {
+      var range = this.getSelectedRangeLast();
+      if (!range) {
+        return true;
+      }
+      if (range.highlight.isHeader()) {
+        return true;
+      }
+      return this.countRenderedRows() === 0 || this.countRenderedCols() === 0;
+    }
+  };
+}

package/plugins/comments/contextMenuItem/addEditComment.mjs

@@ -0,0 +1,35 @@
+import * as C from "../../../i18n/constants.mjs";
+/**
+ * @param {Comments} plugin The Comments plugin instance.
+ * @returns {object}
+ */
+export default function addEditCommentItem(plugin) {
+  return {
+    key: 'commentsAddEdit',
+    name: function name() {
+      var _this$getSelectedRang;
+      var highlight = (_this$getSelectedRang = this.getSelectedRangeLast()) === null || _this$getSelectedRang === void 0 ? void 0 : _this$getSelectedRang.highlight;
+      if (highlight && highlight.isCell() && plugin.getCommentAtCell(highlight.row, highlight.col)) {
+        return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_EDIT_COMMENT);
+      }
+      return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_ADD_COMMENT);
+    },
+    callback: function callback() {
+      var range = this.getSelectedRangeLast();
+      this.deselectCell();
+      plugin.setRange(range);
+      plugin.show();
+      plugin.focusEditor();
+    },
+    disabled: function disabled() {
+      var range = this.getSelectedRangeLast();
+      if (!range) {
+        return true;
+      }
+      if (range.highlight.isHeader()) {
+        return true;
+      }
+      return this.countRenderedRows() === 0 || this.countRenderedCols() === 0;
+    }
+  };
+}

package/plugins/comments/contextMenuItem/readOnlyComment.js

@@ -0,0 +1,63 @@
+"use strict";
+
+require("core-js/modules/es.symbol.iterator.js");
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+exports.__esModule = true;
+exports.default = readOnlyCommentItem;
+require("core-js/modules/es.symbol.to-primitive.js");
+require("core-js/modules/es.date.to-primitive.js");
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.symbol.description.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.number.constructor.js");
+var C = _interopRequireWildcard(require("../../../i18n/constants"));
+var _utils = require("../../contextMenu/utils");
+var _comments = require("../comments");
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { 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); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; 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]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+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 _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+/**
+ * @param {Comments} plugin The Comments plugin instance.
+ * @returns {object}
+ */
+function readOnlyCommentItem(plugin) {
+  return {
+    key: 'commentsReadOnly',
+    name: function name() {
+      var label = this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_READ_ONLY_COMMENT);
+      var areReadOnly = (0, _utils.checkSelectionConsistency)(this.getSelectedRange(), function (row, col) {
+        return plugin.getCommentMeta(row, col, _comments.META_READONLY);
+      });
+      return areReadOnly ? (0, _utils.markLabelAsSelected)(label) : label;
+    },
+    callback: function callback() {
+      var range = this.getSelectedRangeLast();
+      range.forAll(function (row, column) {
+        if (row >= 0 && column >= 0) {
+          var currentState = !!plugin.getCommentMeta(row, column, _comments.META_READONLY);
+          plugin.updateCommentMeta(row, column, _defineProperty({}, _comments.META_READONLY, !currentState));
+        }
+      });
+    },
+    disabled: function disabled() {
+      var range = this.getSelectedRangeLast();
+      if (!range) {
+        return true;
+      }
+      if (range.highlight.isHeader()) {
+        return true;
+      }
+      if (!plugin.getCommentAtCell(range.highlight.row, range.highlight.col)) {
+        return true;
+      }
+      return this.countRenderedRows() === 0 || this.countRenderedCols() === 0;
+    }
+  };
+}

package/plugins/comments/contextMenuItem/readOnlyComment.mjs

@@ -0,0 +1,55 @@
+import "core-js/modules/es.symbol.to-primitive.js";
+import "core-js/modules/es.date.to-primitive.js";
+import "core-js/modules/es.symbol.js";
+import "core-js/modules/es.symbol.description.js";
+import "core-js/modules/es.object.to-string.js";
+import "core-js/modules/es.number.constructor.js";
+import "core-js/modules/es.symbol.iterator.js";
+import "core-js/modules/es.array.iterator.js";
+import "core-js/modules/es.string.iterator.js";
+import "core-js/modules/web.dom-collections.iterator.js";
+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 _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+import * as C from "../../../i18n/constants.mjs";
+import { checkSelectionConsistency, markLabelAsSelected } from "../../contextMenu/utils.mjs";
+import { META_READONLY } from "../comments.mjs";
+/**
+ * @param {Comments} plugin The Comments plugin instance.
+ * @returns {object}
+ */
+export default function readOnlyCommentItem(plugin) {
+  return {
+    key: 'commentsReadOnly',
+    name: function name() {
+      var label = this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_READ_ONLY_COMMENT);
+      var areReadOnly = checkSelectionConsistency(this.getSelectedRange(), function (row, col) {
+        return plugin.getCommentMeta(row, col, META_READONLY);
+      });
+      return areReadOnly ? markLabelAsSelected(label) : label;
+    },
+    callback: function callback() {
+      var range = this.getSelectedRangeLast();
+      range.forAll(function (row, column) {
+        if (row >= 0 && column >= 0) {
+          var currentState = !!plugin.getCommentMeta(row, column, META_READONLY);
+          plugin.updateCommentMeta(row, column, _defineProperty({}, META_READONLY, !currentState));
+        }
+      });
+    },
+    disabled: function disabled() {
+      var range = this.getSelectedRangeLast();
+      if (!range) {
+        return true;
+      }
+      if (range.highlight.isHeader()) {
+        return true;
+      }
+      if (!plugin.getCommentAtCell(range.highlight.row, range.highlight.col)) {
+        return true;
+      }
+      return this.countRenderedRows() === 0 || this.countRenderedCols() === 0;
+    }
+  };
+}

package/plugins/comments/contextMenuItem/removeComment.js

@@ -0,0 +1,48 @@
+"use strict";
+
+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); }
+require("core-js/modules/es.array.iterator.js");
+require("core-js/modules/es.object.to-string.js");
+require("core-js/modules/es.string.iterator.js");
+require("core-js/modules/es.weak-map.js");
+require("core-js/modules/web.dom-collections.iterator.js");
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+require("core-js/modules/es.symbol.js");
+require("core-js/modules/es.symbol.description.js");
+require("core-js/modules/es.symbol.iterator.js");
+exports.__esModule = true;
+exports.default = removeCommentItem;
+var C = _interopRequireWildcard(require("../../../i18n/constants"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { 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); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; 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]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/**
+ * @param {Comments} plugin The Comments plugin instance.
+ * @returns {object}
+ */
+function removeCommentItem(plugin) {
+  return {
+    key: 'commentsRemove',
+    name: function name() {
+      return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_REMOVE_COMMENT);
+    },
+    callback: function callback() {
+      var range = this.getSelectedRangeLast();
+      range.forAll(function (row, column) {
+        if (row >= 0 && column >= 0) {
+          plugin.removeCommentAtCell(row, column, false);
+        }
+      });
+      this.render();
+    },
+    disabled: function disabled() {
+      var range = this.getSelectedRangeLast();
+      if (!range) {
+        return true;
+      }
+      if (range.highlight.isHeader()) {
+        return true;
+      }
+      return this.countRenderedRows() === 0 || this.countRenderedCols() === 0;
+    }
+  };
+}

package/plugins/comments/contextMenuItem/removeComment.mjs

@@ -0,0 +1,32 @@
+import * as C from "../../../i18n/constants.mjs";
+/**
+ * @param {Comments} plugin The Comments plugin instance.
+ * @returns {object}
+ */
+export default function removeCommentItem(plugin) {
+  return {
+    key: 'commentsRemove',
+    name: function name() {
+      return this.getTranslatedPhrase(C.CONTEXTMENU_ITEMS_REMOVE_COMMENT);
+    },
+    callback: function callback() {
+      var range = this.getSelectedRangeLast();
+      range.forAll(function (row, column) {
+        if (row >= 0 && column >= 0) {
+          plugin.removeCommentAtCell(row, column, false);
+        }
+      });
+      this.render();
+    },
+    disabled: function disabled() {
+      var range = this.getSelectedRangeLast();
+      if (!range) {
+        return true;
+      }
+      if (range.highlight.isHeader()) {
+        return true;
+      }
+      return this.countRenderedRows() === 0 || this.countRenderedCols() === 0;
+    }
+  };
+}

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
+      });
     }
 
     /**

package/plugins/contextMenu/contextMenu.mjs

@@ -32,14 +32,17 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 import { BasePlugin } from "../base/index.mjs";
 import Hooks from "../../pluginHooks.mjs";
 import { arrayEach } from "../../helpers/array.mjs";
+import { objectEach } from "../../helpers/object.mjs";
 import CommandExecutor from "./commandExecutor.mjs";
 import EventManager from "../../eventManager.mjs";
 import ItemsFactory from "./itemsFactory.mjs";
 import Menu from "./menu.mjs";
-import { getWindowScrollLeft, getWindowScrollTop, hasClass } from "../../helpers/dom/element.mjs";
+import { getDocumentOffsetByElement } from "./utils.mjs";
+import { hasClass } from "../../helpers/dom/element.mjs";
 import { ROW_ABOVE, ROW_BELOW, COLUMN_LEFT, COLUMN_RIGHT, REMOVE_ROW, REMOVE_COLUMN, UNDO, REDO, READ_ONLY, ALIGNMENT, SEPARATOR } from "./predefinedItems.mjs";
 export var PLUGIN_KEY = 'contextMenu';
 export var PLUGIN_PRIORITY = 70;
+var SHORTCUTS_GROUP = PLUGIN_KEY;
 Hooks.getSingleton().register('afterContextMenuDefaultOptions');
 Hooks.getSingleton().register('beforeContextMenuShow');
 Hooks.getSingleton().register('afterContextMenuShow');
@@ -161,6 +164,7 @@ export var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
       this.addHook('afterOnCellContextMenu', function (event) {
         return _this2.onAfterOnCellContextMenu(event);
       });
+      this.registerShortcuts();
       _get(_getPrototypeOf(ContextMenu.prototype), "enablePlugin", this).call(this);
     }
 
@@ -175,6 +179,7 @@ export var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
     value: function updatePlugin() {
       this.disablePlugin();
       this.enablePlugin();
+      this.unregisterShortcuts();
       _get(_getPrototypeOf(ContextMenu.prototype), "updatePlugin", this).call(this);
     }
 
@@ -192,39 +197,83 @@ export 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 = 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 - getWindowScrollTop(event.view);
-        offsetLeft = left - getWindowScrollLeft(event.view);
-      } else {
-        offsetTop = -1 * getWindowScrollTop(this.menu.hotMenu.rootWindow);
-        offsetLeft = -1 * getWindowScrollLeft(this.menu.hotMenu.rootWindow);
-      }
-      this.menu.setPosition({
-        top: parseInt(event.pageY, 10) + offsetTop,
-        left: parseInt(event.pageX, 10) + offsetLeft
+      objectEach(offset, function (value, key) {
+        _this4.menu.setOffset(key, value);
       });
+      this.menu.setPosition(position);
     }
 
     /**
@@ -233,10 +282,8 @@ export 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;
     }
 
@@ -293,7 +340,7 @@ export var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
   }, {
     key: "prepareMenuItems",
     value: function prepareMenuItems() {
-      var _this3 = this;
+      var _this5 = this;
       this.itemsFactory = new ItemsFactory(this.hot, ContextMenu.DEFAULT_ITEMS);
       var settings = this.hot.getSettings()[PLUGIN_KEY];
       var predefinedItems = {
@@ -307,7 +354,7 @@ export var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
 
       // Register all commands. Predefined and added by user or by plugins
       arrayEach(menuItems, function (command) {
-        return _this3.commandExecutor.registerCommand(command.key, command);
+        return _this5.commandExecutor.registerCommand(command.key, command);
       });
     }
 
@@ -344,7 +391,11 @@ export var ContextMenu = /*#__PURE__*/function (_BasePlugin) {
           return;
         }
       }
-      this.open(event);
+      var offset = getDocumentOffsetByElement(this.menu.container, this.hot.rootDocument);
+      this.open({
+        top: event.clientY + offset.top,
+        left: event.clientX + offset.left
+      });
     }
 
     /**