handsontable 0.0.0-next-9059914-20231025 → 0.0.0-next-21d91d0-20231025

package/plugins/contextMenu/menu/menuItemRenderer.js

@@ -0,0 +1,58 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createMenuItemRenderer = createMenuItemRenderer;
+var _utils = require("./utils");
+var _element = require("../../../helpers/dom/element");
+var _a11y = require("../../../helpers/a11y");
+/**
+ * Creates the menu renderer function.
+ *
+ * @private
+ * @param {Core} mainTableHot The main table Handsontable instance.
+ * @returns {Function}
+ */
+function createMenuItemRenderer(mainTableHot) {
+  /**
+   * Menu item renderer.
+   *
+   * @private
+   * @param {Core} menuHot The Handsontable instance.
+   * @param {HTMLCellElement} TD The rendered cell element.
+   * @param {number} row The visual index.
+   * @param {number} col The visual index.
+   * @param {string} prop The column property if used.
+   * @param {string} value The cell value.
+   */
+  return (menuHot, TD, row, col, prop, value) => {
+    if (TD.hasAttribute('ghost-table')) {
+      return;
+    }
+    const item = menuHot.getSourceDataAtRow(row);
+    const wrapper = mainTableHot.rootDocument.createElement('div');
+    const itemValue = typeof value === 'function' ? value.call(mainTableHot) : value;
+    (0, _element.empty)(TD);
+    (0, _element.addClass)(wrapper, 'htItemWrapper');
+    if (mainTableHot.getSettings().ariaTags) {
+      const isFocusable = !(0, _utils.isItemDisabled)(item, mainTableHot) && !(0, _utils.isItemSelectionDisabled)(item) && !(0, _utils.isItemSeparator)(item);
+      (0, _element.setAttribute)(TD, [(0, _a11y.A11Y_MENU_ITEM)(), (0, _a11y.A11Y_LABEL)(itemValue), ...(isFocusable ? [(0, _a11y.A11Y_TABINDEX)(-1)] : []), ...((0, _utils.isItemDisabled)(item, mainTableHot) ? [(0, _a11y.A11Y_DISABLED)()] : []), ...((0, _utils.isItemSubMenu)(item) ? [(0, _a11y.A11Y_EXPANDED)(false)] : [])]);
+    }
+    TD.className = '';
+    TD.appendChild(wrapper);
+    if ((0, _utils.isItemSeparator)(item)) {
+      (0, _element.addClass)(TD, 'htSeparator');
+    } else if (typeof item.renderer === 'function') {
+      (0, _element.addClass)(TD, 'htCustomMenuRenderer');
+      TD.appendChild(item.renderer(menuHot, wrapper, row, col, prop, itemValue));
+    } else {
+      (0, _element.fastInnerHTML)(wrapper, itemValue);
+    }
+    if ((0, _utils.isItemDisabled)(item, mainTableHot)) {
+      (0, _element.addClass)(TD, 'htDisabled');
+    } else if ((0, _utils.isItemSelectionDisabled)(item)) {
+      (0, _element.addClass)(TD, 'htSelectionDisabled');
+    } else if ((0, _utils.isItemSubMenu)(item)) {
+      (0, _element.addClass)(TD, 'htSubmenu');
+    }
+  };
+}

package/plugins/contextMenu/menu/menuItemRenderer.mjs

@@ -0,0 +1,54 @@
+import { isItemSubMenu, isItemDisabled, isItemSelectionDisabled, isItemSeparator } from "./utils.mjs";
+import { addClass, empty, fastInnerHTML, setAttribute } from "../../../helpers/dom/element.mjs";
+import { A11Y_DISABLED, A11Y_EXPANDED, A11Y_LABEL, A11Y_MENU_ITEM, A11Y_TABINDEX } from "../../../helpers/a11y.mjs";
+/**
+ * Creates the menu renderer function.
+ *
+ * @private
+ * @param {Core} mainTableHot The main table Handsontable instance.
+ * @returns {Function}
+ */
+export function createMenuItemRenderer(mainTableHot) {
+  /**
+   * Menu item renderer.
+   *
+   * @private
+   * @param {Core} menuHot The Handsontable instance.
+   * @param {HTMLCellElement} TD The rendered cell element.
+   * @param {number} row The visual index.
+   * @param {number} col The visual index.
+   * @param {string} prop The column property if used.
+   * @param {string} value The cell value.
+   */
+  return (menuHot, TD, row, col, prop, value) => {
+    if (TD.hasAttribute('ghost-table')) {
+      return;
+    }
+    const item = menuHot.getSourceDataAtRow(row);
+    const wrapper = mainTableHot.rootDocument.createElement('div');
+    const itemValue = typeof value === 'function' ? value.call(mainTableHot) : value;
+    empty(TD);
+    addClass(wrapper, 'htItemWrapper');
+    if (mainTableHot.getSettings().ariaTags) {
+      const isFocusable = !isItemDisabled(item, mainTableHot) && !isItemSelectionDisabled(item) && !isItemSeparator(item);
+      setAttribute(TD, [A11Y_MENU_ITEM(), A11Y_LABEL(itemValue), ...(isFocusable ? [A11Y_TABINDEX(-1)] : []), ...(isItemDisabled(item, mainTableHot) ? [A11Y_DISABLED()] : []), ...(isItemSubMenu(item) ? [A11Y_EXPANDED(false)] : [])]);
+    }
+    TD.className = '';
+    TD.appendChild(wrapper);
+    if (isItemSeparator(item)) {
+      addClass(TD, 'htSeparator');
+    } else if (typeof item.renderer === 'function') {
+      addClass(TD, 'htCustomMenuRenderer');
+      TD.appendChild(item.renderer(menuHot, wrapper, row, col, prop, itemValue));
+    } else {
+      fastInnerHTML(wrapper, itemValue);
+    }
+    if (isItemDisabled(item, mainTableHot)) {
+      addClass(TD, 'htDisabled');
+    } else if (isItemSelectionDisabled(item)) {
+      addClass(TD, 'htSelectionDisabled');
+    } else if (isItemSubMenu(item)) {
+      addClass(TD, 'htSubmenu');
+    }
+  };
+}

package/plugins/contextMenu/menu/navigator.js

@@ -0,0 +1,27 @@
+"use strict";
+
+exports.__esModule = true;
+exports.createMenuNavigator = createMenuNavigator;
+var _paginator = require("../../../utils/paginator");
+var _utils = require("./utils");
+/**
+ * Creates navigator for menus and submenus.
+ *
+ * @param {Handsontable} hotMenu The Handsontable instance of the menu.
+ * @returns {Paginator}
+ */
+function createMenuNavigator(hotMenu) {
+  return (0, _paginator.createPaginator)({
+    size: () => hotMenu.countRows(),
+    onItemSelect(currentItem, directItemChange) {
+      const cell = hotMenu.getCell(currentItem, 0);
+      if (!cell || (0, _utils.isSeparator)(cell) || (0, _utils.isDisabled)(cell) || (0, _utils.isSelectionDisabled)(cell)) {
+        return false;
+      }
+      hotMenu.selectCell(currentItem, 0, ...(directItemChange ? [currentItem, 0, false, false] : []));
+    },
+    onClear() {
+      hotMenu.deselectCell();
+    }
+  });
+}

package/plugins/contextMenu/menu/navigator.mjs

@@ -0,0 +1,23 @@
+import { createPaginator } from "../../../utils/paginator.mjs";
+import { isSeparator, isDisabled, isSelectionDisabled } from "./utils.mjs";
+/**
+ * Creates navigator for menus and submenus.
+ *
+ * @param {Handsontable} hotMenu The Handsontable instance of the menu.
+ * @returns {Paginator}
+ */
+export function createMenuNavigator(hotMenu) {
+  return createPaginator({
+    size: () => hotMenu.countRows(),
+    onItemSelect(currentItem, directItemChange) {
+      const cell = hotMenu.getCell(currentItem, 0);
+      if (!cell || isSeparator(cell) || isDisabled(cell) || isSelectionDisabled(cell)) {
+        return false;
+      }
+      hotMenu.selectCell(currentItem, 0, ...(directItemChange ? [currentItem, 0, false, false] : []));
+    },
+    onClear() {
+      hotMenu.deselectCell();
+    }
+  });
+}

package/plugins/contextMenu/menu/positioner.js

@@ -0,0 +1,213 @@
+"use strict";
+
+exports.__esModule = true;
+require("core-js/modules/es.error.cause.js");
+var _cursor2 = require("./cursor");
+function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
+function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
+function _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
+function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
+function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
+function _classExtractFieldDescriptor(receiver, privateMap, action) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to " + action + " private field on non-instance"); } return privateMap.get(receiver); }
+function _classApplyDescriptorSet(receiver, descriptor, value) { if (descriptor.set) { descriptor.set.call(receiver, value); } else { if (!descriptor.writable) { throw new TypeError("attempted to set read only private field"); } descriptor.value = value; } }
+/**
+ * Helper class for positioning the menu and submenus in the correct place relative to the
+ * cursor position (DOM element or mouse coordinates).
+ *
+ * @private
+ * @class Positioner
+ */
+var _container = /*#__PURE__*/new WeakMap();
+var _parentContainer = /*#__PURE__*/new WeakMap();
+var _cursor = /*#__PURE__*/new WeakMap();
+var _keepInViewport = /*#__PURE__*/new WeakMap();
+var _offset = /*#__PURE__*/new WeakMap();
+class Positioner {
+  constructor(keepInViewport) {
+    /**
+     * The menu container element the positioning will be applied to.
+     *
+     * @type {HTMLElement}
+     */
+    _classPrivateFieldInitSpec(this, _container, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * For positioning the submenu, the parent element is used to calculate offsets to ensure that submenu
+     * is positioned right next to the parent menu.
+     *
+     * @type {HTMLElement}
+     */
+    _classPrivateFieldInitSpec(this, _parentContainer, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * The instance of the Cursor class.
+     *
+     * @type {Cursor}
+     */
+    _classPrivateFieldInitSpec(this, _cursor, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * Enabling the option allows changing the position calculation so that the menus (or submenus)
+     * are always placed within the visible viewport of the browser.
+     *
+     * @type {boolean}
+     */
+    _classPrivateFieldInitSpec(this, _keepInViewport, {
+      writable: true,
+      value: false
+    });
+    /**
+     * Allows apply the position offset for directions.
+     *
+     * @type {{above: number, below: number, left: number, right: number}}
+     */
+    _classPrivateFieldInitSpec(this, _offset, {
+      writable: true,
+      value: {
+        above: 0,
+        below: 0,
+        left: 0,
+        right: 0
+      }
+    });
+    _classPrivateFieldSet(this, _keepInViewport, keepInViewport);
+  }
+
+  /**
+   * Sets offset position for specified directions (`above`, `below`, `left` or `right`).
+   *
+   * @param {'above' | 'below' | 'left' | 'right'} direction A direction name.
+   * @param {number} [offset=0] Offset value.
+   * @returns {Positioner}
+   */
+  setOffset(direction) {
+    let offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    _classPrivateFieldGet(this, _offset)[direction] = offset;
+    return this;
+  }
+
+  /**
+   * Sets the menu element to work with. The element can be owned by the main menu or the submenu.
+   *
+   * @param {HTMLElement} container The menu container element.
+   * @returns {Positioner}
+   */
+  setElement(container) {
+    _classPrivateFieldSet(this, _container, container);
+    return this;
+  }
+
+  /**
+   * Sets the parent menu element to work with.
+   *
+   * @param {HTMLElement} container The parent menu container element.
+   * @returns {Positioner}
+   */
+  setParentElement(container) {
+    _classPrivateFieldSet(this, _parentContainer, container);
+    return this;
+  }
+
+  /**
+   * Updates the menu position.
+   *
+   * @param {object|MouseEvent} coords The literal object with `top`, `left`, `width` and `height` props or a
+   * mouse event object.
+   */
+  updatePosition(coords) {
+    _classPrivateFieldSet(this, _cursor, new _cursor2.Cursor(coords, _classPrivateFieldGet(this, _container).ownerDocument.defaultView));
+    if (_classPrivateFieldGet(this, _keepInViewport)) {
+      if (_classPrivateFieldGet(this, _cursor).fitsBelow(_classPrivateFieldGet(this, _container))) {
+        this.setPositionBelowCursor();
+      } else if (_classPrivateFieldGet(this, _cursor).fitsAbove(_classPrivateFieldGet(this, _container))) {
+        this.setPositionAboveCursor();
+      } else {
+        this.setPositionBelowCursor();
+      }
+      this.updateHorizontalPosition();
+    } else {
+      this.setPositionBelowCursor();
+      this.setPositionOnRightOfCursor();
+    }
+  }
+
+  /**
+   * Updates the menu horizontal position.
+   */
+  updateHorizontalPosition() {
+    if (_classPrivateFieldGet(this, _container).dir === 'rtl') {
+      if (_classPrivateFieldGet(this, _cursor).fitsOnLeft(_classPrivateFieldGet(this, _container))) {
+        this.setPositionOnLeftOfCursor();
+      } else {
+        this.setPositionOnRightOfCursor();
+      }
+    } else if (_classPrivateFieldGet(this, _cursor).fitsOnRight(_classPrivateFieldGet(this, _container))) {
+      this.setPositionOnRightOfCursor();
+    } else {
+      this.setPositionOnLeftOfCursor();
+    }
+  }
+
+  /**
+   * Sets the menu position above the cursor object.
+   */
+  setPositionAboveCursor() {
+    let top = _classPrivateFieldGet(this, _offset).above + _classPrivateFieldGet(this, _cursor).top - _classPrivateFieldGet(this, _container).offsetHeight;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      top = _classPrivateFieldGet(this, _cursor).top + _classPrivateFieldGet(this, _cursor).cellHeight - _classPrivateFieldGet(this, _container).offsetHeight + 3;
+    }
+    _classPrivateFieldGet(this, _container).style.top = `${top}px`;
+  }
+
+  /**
+   * Sets the menu position below the cursor object.
+   */
+  setPositionBelowCursor() {
+    let top = _classPrivateFieldGet(this, _offset).below + _classPrivateFieldGet(this, _cursor).top + 1;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      top = _classPrivateFieldGet(this, _cursor).top - 1;
+    }
+    _classPrivateFieldGet(this, _container).style.top = `${top}px`;
+  }
+
+  /**
+   * Sets the menu position on the right of the cursor object.
+   */
+  setPositionOnRightOfCursor() {
+    let left = _classPrivateFieldGet(this, _cursor).left;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      const {
+        right: parentMenuRight
+      } = _classPrivateFieldGet(this, _parentContainer).getBoundingClientRect();
+
+      // move the sub menu by the width of the parent's border (usually by 1-2 pixels)
+      left += _classPrivateFieldGet(this, _cursor).cellWidth + parentMenuRight - (_classPrivateFieldGet(this, _cursor).left + _classPrivateFieldGet(this, _cursor).cellWidth);
+    } else {
+      left += _classPrivateFieldGet(this, _offset).right;
+    }
+    _classPrivateFieldGet(this, _container).style.left = `${left}px`;
+  }
+
+  /**
+   * Sets the menu position on the left of the cursor object.
+   */
+  setPositionOnLeftOfCursor() {
+    let left = _classPrivateFieldGet(this, _offset).left + _classPrivateFieldGet(this, _cursor).left - _classPrivateFieldGet(this, _container).offsetWidth;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      const {
+        left: parentMenuLeft
+      } = _classPrivateFieldGet(this, _parentContainer).getBoundingClientRect();
+
+      // move the sub menu by the width of the parent's border (usually by 1-2 pixels)
+      left -= _classPrivateFieldGet(this, _cursor).left - parentMenuLeft;
+    }
+    _classPrivateFieldGet(this, _container).style.left = `${left}px`;
+  }
+}
+exports.Positioner = Positioner;

package/plugins/contextMenu/menu/positioner.mjs

@@ -0,0 +1,209 @@
+import "core-js/modules/es.error.cause.js";
+function _classPrivateFieldInitSpec(obj, privateMap, value) { _checkPrivateRedeclaration(obj, privateMap); privateMap.set(obj, value); }
+function _checkPrivateRedeclaration(obj, privateCollection) { if (privateCollection.has(obj)) { throw new TypeError("Cannot initialize the same private elements twice on an object"); } }
+function _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
+function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
+function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
+function _classExtractFieldDescriptor(receiver, privateMap, action) { if (!privateMap.has(receiver)) { throw new TypeError("attempted to " + action + " private field on non-instance"); } return privateMap.get(receiver); }
+function _classApplyDescriptorSet(receiver, descriptor, value) { if (descriptor.set) { descriptor.set.call(receiver, value); } else { if (!descriptor.writable) { throw new TypeError("attempted to set read only private field"); } descriptor.value = value; } }
+import { Cursor } from "./cursor.mjs";
+/**
+ * Helper class for positioning the menu and submenus in the correct place relative to the
+ * cursor position (DOM element or mouse coordinates).
+ *
+ * @private
+ * @class Positioner
+ */
+var _container = /*#__PURE__*/new WeakMap();
+var _parentContainer = /*#__PURE__*/new WeakMap();
+var _cursor = /*#__PURE__*/new WeakMap();
+var _keepInViewport = /*#__PURE__*/new WeakMap();
+var _offset = /*#__PURE__*/new WeakMap();
+export class Positioner {
+  constructor(keepInViewport) {
+    /**
+     * The menu container element the positioning will be applied to.
+     *
+     * @type {HTMLElement}
+     */
+    _classPrivateFieldInitSpec(this, _container, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * For positioning the submenu, the parent element is used to calculate offsets to ensure that submenu
+     * is positioned right next to the parent menu.
+     *
+     * @type {HTMLElement}
+     */
+    _classPrivateFieldInitSpec(this, _parentContainer, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * The instance of the Cursor class.
+     *
+     * @type {Cursor}
+     */
+    _classPrivateFieldInitSpec(this, _cursor, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * Enabling the option allows changing the position calculation so that the menus (or submenus)
+     * are always placed within the visible viewport of the browser.
+     *
+     * @type {boolean}
+     */
+    _classPrivateFieldInitSpec(this, _keepInViewport, {
+      writable: true,
+      value: false
+    });
+    /**
+     * Allows apply the position offset for directions.
+     *
+     * @type {{above: number, below: number, left: number, right: number}}
+     */
+    _classPrivateFieldInitSpec(this, _offset, {
+      writable: true,
+      value: {
+        above: 0,
+        below: 0,
+        left: 0,
+        right: 0
+      }
+    });
+    _classPrivateFieldSet(this, _keepInViewport, keepInViewport);
+  }
+
+  /**
+   * Sets offset position for specified directions (`above`, `below`, `left` or `right`).
+   *
+   * @param {'above' | 'below' | 'left' | 'right'} direction A direction name.
+   * @param {number} [offset=0] Offset value.
+   * @returns {Positioner}
+   */
+  setOffset(direction) {
+    let offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
+    _classPrivateFieldGet(this, _offset)[direction] = offset;
+    return this;
+  }
+
+  /**
+   * Sets the menu element to work with. The element can be owned by the main menu or the submenu.
+   *
+   * @param {HTMLElement} container The menu container element.
+   * @returns {Positioner}
+   */
+  setElement(container) {
+    _classPrivateFieldSet(this, _container, container);
+    return this;
+  }
+
+  /**
+   * Sets the parent menu element to work with.
+   *
+   * @param {HTMLElement} container The parent menu container element.
+   * @returns {Positioner}
+   */
+  setParentElement(container) {
+    _classPrivateFieldSet(this, _parentContainer, container);
+    return this;
+  }
+
+  /**
+   * Updates the menu position.
+   *
+   * @param {object|MouseEvent} coords The literal object with `top`, `left`, `width` and `height` props or a
+   * mouse event object.
+   */
+  updatePosition(coords) {
+    _classPrivateFieldSet(this, _cursor, new Cursor(coords, _classPrivateFieldGet(this, _container).ownerDocument.defaultView));
+    if (_classPrivateFieldGet(this, _keepInViewport)) {
+      if (_classPrivateFieldGet(this, _cursor).fitsBelow(_classPrivateFieldGet(this, _container))) {
+        this.setPositionBelowCursor();
+      } else if (_classPrivateFieldGet(this, _cursor).fitsAbove(_classPrivateFieldGet(this, _container))) {
+        this.setPositionAboveCursor();
+      } else {
+        this.setPositionBelowCursor();
+      }
+      this.updateHorizontalPosition();
+    } else {
+      this.setPositionBelowCursor();
+      this.setPositionOnRightOfCursor();
+    }
+  }
+
+  /**
+   * Updates the menu horizontal position.
+   */
+  updateHorizontalPosition() {
+    if (_classPrivateFieldGet(this, _container).dir === 'rtl') {
+      if (_classPrivateFieldGet(this, _cursor).fitsOnLeft(_classPrivateFieldGet(this, _container))) {
+        this.setPositionOnLeftOfCursor();
+      } else {
+        this.setPositionOnRightOfCursor();
+      }
+    } else if (_classPrivateFieldGet(this, _cursor).fitsOnRight(_classPrivateFieldGet(this, _container))) {
+      this.setPositionOnRightOfCursor();
+    } else {
+      this.setPositionOnLeftOfCursor();
+    }
+  }
+
+  /**
+   * Sets the menu position above the cursor object.
+   */
+  setPositionAboveCursor() {
+    let top = _classPrivateFieldGet(this, _offset).above + _classPrivateFieldGet(this, _cursor).top - _classPrivateFieldGet(this, _container).offsetHeight;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      top = _classPrivateFieldGet(this, _cursor).top + _classPrivateFieldGet(this, _cursor).cellHeight - _classPrivateFieldGet(this, _container).offsetHeight + 3;
+    }
+    _classPrivateFieldGet(this, _container).style.top = `${top}px`;
+  }
+
+  /**
+   * Sets the menu position below the cursor object.
+   */
+  setPositionBelowCursor() {
+    let top = _classPrivateFieldGet(this, _offset).below + _classPrivateFieldGet(this, _cursor).top + 1;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      top = _classPrivateFieldGet(this, _cursor).top - 1;
+    }
+    _classPrivateFieldGet(this, _container).style.top = `${top}px`;
+  }
+
+  /**
+   * Sets the menu position on the right of the cursor object.
+   */
+  setPositionOnRightOfCursor() {
+    let left = _classPrivateFieldGet(this, _cursor).left;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      const {
+        right: parentMenuRight
+      } = _classPrivateFieldGet(this, _parentContainer).getBoundingClientRect();
+
+      // move the sub menu by the width of the parent's border (usually by 1-2 pixels)
+      left += _classPrivateFieldGet(this, _cursor).cellWidth + parentMenuRight - (_classPrivateFieldGet(this, _cursor).left + _classPrivateFieldGet(this, _cursor).cellWidth);
+    } else {
+      left += _classPrivateFieldGet(this, _offset).right;
+    }
+    _classPrivateFieldGet(this, _container).style.left = `${left}px`;
+  }
+
+  /**
+   * Sets the menu position on the left of the cursor object.
+   */
+  setPositionOnLeftOfCursor() {
+    let left = _classPrivateFieldGet(this, _offset).left + _classPrivateFieldGet(this, _cursor).left - _classPrivateFieldGet(this, _container).offsetWidth;
+    if (_classPrivateFieldGet(this, _parentContainer)) {
+      const {
+        left: parentMenuLeft
+      } = _classPrivateFieldGet(this, _parentContainer).getBoundingClientRect();
+
+      // move the sub menu by the width of the parent's border (usually by 1-2 pixels)
+      left -= _classPrivateFieldGet(this, _cursor).left - parentMenuLeft;
+    }
+    _classPrivateFieldGet(this, _container).style.left = `${left}px`;
+  }
+}