handsontable 0.0.0-next-7026906-20231107 → 0.0.0-next-7b93b7d-20231107

package/plugins/manualColumnMove/manualColumnMove.mjs

@@ -1,18 +1,29 @@
 import "core-js/modules/es.array.push.js";
+import "core-js/modules/es.error.cause.js";
+function _classPrivateMethodInitSpec(obj, privateSet) { _checkPrivateRedeclaration(obj, privateSet); privateSet.add(obj); }
+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 _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); }
+function _classPrivateFieldSet(receiver, privateMap, value) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "set"); _classApplyDescriptorSet(receiver, descriptor, value); return value; }
+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; } }
+function _classPrivateFieldGet(receiver, privateMap) { var descriptor = _classExtractFieldDescriptor(receiver, privateMap, "get"); return _classApplyDescriptorGet(receiver, descriptor); }
+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 _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) { return descriptor.get.call(receiver); } return descriptor.value; }
+function _classPrivateMethodGet(receiver, privateSet, fn) { if (!privateSet.has(receiver)) { throw new TypeError("attempted to get private field on non-instance"); } return fn; }
 import { BasePlugin } from "../base/index.mjs";
 import Hooks from "../../pluginHooks.mjs";
 import { arrayReduce } from "../../helpers/array.mjs";
 import { addClass, removeClass, offset, hasClass, outerWidth } from "../../helpers/dom/element.mjs";
 import { offsetRelativeTo } from "../../helpers/dom/event.mjs";
 import { rangeEach } from "../../helpers/number.mjs";
-import EventManager from "../../eventManager.mjs";
 import BacklightUI from "./ui/backlight.mjs";
 import GuidelineUI from "./ui/guideline.mjs";
 Hooks.getSingleton().register('beforeColumnMove');
 Hooks.getSingleton().register('afterColumnMove');
 export const PLUGIN_KEY = 'manualColumnMove';
 export const PLUGIN_PRIORITY = 120;
-const privatePool = new WeakMap();
 const CSS_PLUGIN = 'ht__manualColumnMove';
 const CSS_SHOW_UI = 'show-ui';
 const CSS_ON_MOVING = 'on-moving--columns';
@@ -45,56 +56,148 @@ const CSS_AFTER_SELECTION = 'after-selection--columns';
  * @class ManualColumnMove
  * @plugin ManualColumnMove
  */
+var _columnsToMove = /*#__PURE__*/new WeakMap();
+var _countCols = /*#__PURE__*/new WeakMap();
+var _pressed = /*#__PURE__*/new WeakMap();
+var _target = /*#__PURE__*/new WeakMap();
+var _cachedDropIndex = /*#__PURE__*/new WeakMap();
+var _hoveredColumn = /*#__PURE__*/new WeakMap();
+var _rootElementOffset = /*#__PURE__*/new WeakMap();
+var _hasRowHeaders = /*#__PURE__*/new WeakMap();
+var _fixedColumnsStart = /*#__PURE__*/new WeakMap();
+var _onBeforeOnCellMouseDown = /*#__PURE__*/new WeakSet();
+var _onMouseMove = /*#__PURE__*/new WeakSet();
+var _onBeforeOnCellMouseOver = /*#__PURE__*/new WeakSet();
+var _onMouseUp = /*#__PURE__*/new WeakSet();
+var _onAfterScrollVertically = /*#__PURE__*/new WeakSet();
+var _onAfterLoadData = /*#__PURE__*/new WeakSet();
 export class ManualColumnMove extends BasePlugin {
-  static get PLUGIN_KEY() {
-    return PLUGIN_KEY;
-  }
-  static get PLUGIN_PRIORITY() {
-    return PLUGIN_PRIORITY;
-  }
-  constructor(hotInstance) {
-    super(hotInstance);
-
+  constructor() {
+    super(...arguments);
     /**
-     * Set up WeakMap of plugin to sharing private parameters;.
+     * Callback for the `afterLoadData` hook.
+     *
+     * @private
      */
-    privatePool.set(this, {
-      columnsToMove: [],
-      countCols: 0,
-      fixedColumns: 0,
-      pressed: void 0,
-      target: {
-        eventPageX: void 0,
-        coords: void 0,
-        TD: void 0,
-        col: void 0
-      },
-      cachedDropIndex: void 0
-    });
-
+    _classPrivateMethodInitSpec(this, _onAfterLoadData);
+    /**
+     * `afterScrollHorizontally` hook callback. Fired the table was scrolled horizontally.
+     */
+    _classPrivateMethodInitSpec(this, _onAfterScrollVertically);
     /**
-     * Event Manager object.
+     * `onMouseUp` hook callback.
+     */
+    _classPrivateMethodInitSpec(this, _onMouseUp);
+    /**
+     * 'beforeOnCellMouseOver' hook callback. Fired when pointer was over cell.
      *
-     * @private
-     * @type {object}
+     * @param {MouseEvent} event `mouseover` event properties.
+     * @param {CellCoords} coords Visual cell coordinates where was fired event.
+     * @param {HTMLElement} TD Cell represented as HTMLElement.
+     * @param {object} controller An object with properties `row`, `column` and `cell`. Each property contains
+     *                            a boolean value that allows or disallows changing the selection for that particular area.
      */
-    this.eventManager = new EventManager(this);
+    _classPrivateMethodInitSpec(this, _onBeforeOnCellMouseOver);
+    /**
+     * 'mouseMove' event callback. Fired when pointer move on document.documentElement.
+     *
+     * @param {MouseEvent} event `mousemove` event properties.
+     */
+    _classPrivateMethodInitSpec(this, _onMouseMove);
+    /**
+     * Change the behavior of selection / dragging.
+     *
+     * @param {MouseEvent} event `mousedown` event properties.
+     * @param {CellCoords} coords Visual cell coordinates where was fired event.
+     * @param {HTMLElement} TD Cell represented as HTMLElement.
+     * @param {object} controller An object with properties `row`, `column` and `cell`. Each property contains
+     *                            a boolean value that allows or disallows changing the selection for that particular area.
+     */
+    _classPrivateMethodInitSpec(this, _onBeforeOnCellMouseDown);
     /**
      * Backlight UI object.
      *
      * @private
      * @type {object}
      */
-    this.backlight = new BacklightUI(hotInstance);
+    _defineProperty(this, "backlight", new BacklightUI(this.hot));
     /**
      * Guideline UI object.
      *
      * @private
      * @type {object}
      */
-    this.guideline = new GuidelineUI(hotInstance);
+    _defineProperty(this, "guideline", new GuidelineUI(this.hot));
+    /**
+     * @type {number[]}
+     */
+    _classPrivateFieldInitSpec(this, _columnsToMove, {
+      writable: true,
+      value: []
+    });
+    /**
+     * @type {number}
+     */
+    _classPrivateFieldInitSpec(this, _countCols, {
+      writable: true,
+      value: 0
+    });
+    /**
+     * @type {boolean}
+     */
+    _classPrivateFieldInitSpec(this, _pressed, {
+      writable: true,
+      value: false
+    });
+    /**
+     * @type {object}
+     */
+    _classPrivateFieldInitSpec(this, _target, {
+      writable: true,
+      value: {}
+    });
+    /**
+     * @type {number}
+     */
+    _classPrivateFieldInitSpec(this, _cachedDropIndex, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * @type {number}
+     */
+    _classPrivateFieldInitSpec(this, _hoveredColumn, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * @type {number}
+     */
+    _classPrivateFieldInitSpec(this, _rootElementOffset, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * @type {boolean}
+     */
+    _classPrivateFieldInitSpec(this, _hasRowHeaders, {
+      writable: true,
+      value: void 0
+    });
+    /**
+     * @type {number}
+     */
+    _classPrivateFieldInitSpec(this, _fixedColumnsStart, {
+      writable: true,
+      value: void 0
+    });
+  }
+  static get PLUGIN_KEY() {
+    return PLUGIN_KEY;
+  }
+  static get PLUGIN_PRIORITY() {
+    return PLUGIN_PRIORITY;
   }
-
   /**
    * Checks if the plugin is enabled in the handsontable settings. This method is executed in {@link Hooks#beforeInit}
    * hook and if it returns `true` then the {@link ManualColumnMove#enablePlugin} method is called.
@@ -114,14 +217,23 @@ export class ManualColumnMove extends BasePlugin {
       return;
     }
     this.addHook('beforeOnCellMouseDown', function () {
-      return _this.onBeforeOnCellMouseDown(...arguments);
+      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+        args[_key] = arguments[_key];
+      }
+      return _classPrivateMethodGet(_this, _onBeforeOnCellMouseDown, _onBeforeOnCellMouseDown2).call(_this, ...args);
     });
     this.addHook('beforeOnCellMouseOver', function () {
-      return _this.onBeforeOnCellMouseOver(...arguments);
+      for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+        args[_key2] = arguments[_key2];
+      }
+      return _classPrivateMethodGet(_this, _onBeforeOnCellMouseOver, _onBeforeOnCellMouseOver2).call(_this, ...args);
     });
-    this.addHook('afterScrollVertically', () => this.onAfterScrollVertically());
+    this.addHook('afterScrollVertically', () => _classPrivateMethodGet(this, _onAfterScrollVertically, _onAfterScrollVertically2).call(this));
     this.addHook('afterLoadData', function () {
-      return _this.onAfterLoadData(...arguments);
+      for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+        args[_key3] = arguments[_key3];
+      }
+      return _classPrivateMethodGet(_this, _onAfterLoadData, _onAfterLoadData2).call(_this, ...args);
     });
     this.buildPluginUI();
     this.registerEvents();
@@ -180,11 +292,10 @@ export class ManualColumnMove extends BasePlugin {
    * @returns {boolean}
    */
   moveColumns(columns, finalIndex) {
-    const priv = privatePool.get(this);
-    const dropIndex = priv.cachedDropIndex;
+    const dropIndex = _classPrivateFieldGet(this, _cachedDropIndex);
     const movePossible = this.isMovePossible(columns, finalIndex);
     const beforeMoveHook = this.hot.runHooks('beforeColumnMove', columns, finalIndex, dropIndex, movePossible);
-    priv.cachedDropIndex = void 0;
+    _classPrivateFieldSet(this, _cachedDropIndex, undefined);
     if (beforeMoveHook === false) {
       return;
     }
@@ -222,8 +333,7 @@ export class ManualColumnMove extends BasePlugin {
    */
   dragColumns(columns, dropIndex) {
     const finalIndex = this.countFinalIndex(columns, dropIndex);
-    const priv = privatePool.get(this);
-    priv.cachedDropIndex = dropIndex;
+    _classPrivateFieldSet(this, _cachedDropIndex, dropIndex);
     return this.moveColumns(columns, finalIndex);
   }
 
@@ -314,7 +424,7 @@ export class ManualColumnMove extends BasePlugin {
     const pluginSettings = this.hot.getSettings()[PLUGIN_KEY];
     if (Array.isArray(pluginSettings)) {
       this.moveColumns(pluginSettings, 0);
-    } else if (pluginSettings !== void 0) {
+    } else if (pluginSettings !== undefined) {
       const persistentState = this.persistentStateLoad();
       if (persistentState.length) {
         this.moveColumns(persistentState, 0);
@@ -378,9 +488,8 @@ export class ManualColumnMove extends BasePlugin {
    * @private
    */
   refreshPositions() {
-    const priv = privatePool.get(this);
     const firstVisible = this.hot.view.getFirstFullyVisibleColumn();
-    if (this.isFixedColumnsStart(priv.hoveredColumn) && firstVisible > 0) {
+    if (this.isFixedColumnsStart(_classPrivateFieldGet(this, _hoveredColumn)) && firstVisible > 0) {
       this.hot.scrollViewportTo({
         col: this.hot.columnIndexMapper.getNearestNotHiddenIndex(firstVisible - 1, -1)
       });
@@ -388,7 +497,7 @@ export class ManualColumnMove extends BasePlugin {
     const wtTable = this.hot.view._wt.wtTable;
     const scrollableElement = this.hot.view._wt.wtOverlays.scrollableElement;
     const scrollStart = typeof scrollableElement.scrollX === 'number' ? scrollableElement.scrollX : scrollableElement.scrollLeft;
-    let tdOffsetStart = this.hot.view.THEAD.offsetLeft + this.getColumnsWidth(0, priv.hoveredColumn - 1);
+    let tdOffsetStart = this.hot.view.THEAD.offsetLeft + this.getColumnsWidth(0, _classPrivateFieldGet(this, _hoveredColumn) - 1);
     const hiderWidth = wtTable.hider.offsetWidth;
     const tbodyOffsetLeft = wtTable.TBODY.offsetLeft;
     const backlightElemMarginStart = this.backlight.getOffset().start;
@@ -398,35 +507,35 @@ export class ManualColumnMove extends BasePlugin {
     if (this.hot.isRtl()) {
       const rootWindow = this.hot.rootWindow;
       const containerWidth = outerWidth(this.hot.rootElement);
-      const gridMostRightPos = rootWindow.innerWidth - priv.rootElementOffset - containerWidth;
-      mouseOffsetStart = rootWindow.innerWidth - priv.target.eventPageX - gridMostRightPos - (scrollableElement.scrollX === void 0 ? scrollStart : 0);
+      const gridMostRightPos = rootWindow.innerWidth - _classPrivateFieldGet(this, _rootElementOffset) - containerWidth;
+      mouseOffsetStart = rootWindow.innerWidth - _classPrivateFieldGet(this, _target).eventPageX - gridMostRightPos - (scrollableElement.scrollX === undefined ? scrollStart : 0);
     } else {
-      mouseOffsetStart = priv.target.eventPageX - (priv.rootElementOffset - (scrollableElement.scrollX === void 0 ? scrollStart : 0));
+      mouseOffsetStart = _classPrivateFieldGet(this, _target).eventPageX - (_classPrivateFieldGet(this, _rootElementOffset) - (scrollableElement.scrollX === undefined ? scrollStart : 0));
     }
-    if (priv.hasRowHeaders) {
+    if (_classPrivateFieldGet(this, _hasRowHeaders)) {
       rowHeaderWidth = this.hot.view._wt.wtOverlays.inlineStartOverlay.clone.wtTable.getColumnHeader(-1).offsetWidth;
     }
-    if (this.isFixedColumnsStart(priv.hoveredColumn)) {
+    if (this.isFixedColumnsStart(_classPrivateFieldGet(this, _hoveredColumn))) {
       tdOffsetStart += scrollStart;
     }
     tdOffsetStart += rowHeaderWidth;
-    if (priv.hoveredColumn < 0) {
+    if (_classPrivateFieldGet(this, _hoveredColumn) < 0) {
       // if hover on rowHeader
-      if (priv.fixedColumnsStart > 0) {
-        priv.target.col = 0;
+      if (_classPrivateFieldGet(this, _fixedColumnsStart) > 0) {
+        _classPrivateFieldGet(this, _target).col = 0;
       } else {
-        priv.target.col = firstVisible > 0 ? firstVisible - 1 : firstVisible;
+        _classPrivateFieldGet(this, _target).col = firstVisible > 0 ? firstVisible - 1 : firstVisible;
       }
-    } else if (priv.target.TD.offsetWidth / 2 + tdOffsetStart <= mouseOffsetStart) {
-      const newCoordsCol = priv.hoveredColumn >= priv.countCols ? priv.countCols - 1 : priv.hoveredColumn;
+    } else if (_classPrivateFieldGet(this, _target).TD.offsetWidth / 2 + tdOffsetStart <= mouseOffsetStart) {
+      const newCoordsCol = _classPrivateFieldGet(this, _hoveredColumn) >= _classPrivateFieldGet(this, _countCols) ? _classPrivateFieldGet(this, _countCols) - 1 : _classPrivateFieldGet(this, _hoveredColumn);
 
       // if hover on right part of TD
-      priv.target.col = newCoordsCol + 1;
+      _classPrivateFieldGet(this, _target).col = newCoordsCol + 1;
       // unfortunately first column is bigger than rest
-      tdOffsetStart += priv.target.TD.offsetWidth;
+      tdOffsetStart += _classPrivateFieldGet(this, _target).TD.offsetWidth;
     } else {
       // elsewhere on table
-      priv.target.col = priv.hoveredColumn;
+      _classPrivateFieldGet(this, _target).col = _classPrivateFieldGet(this, _hoveredColumn);
     }
     let backlightStart = mouseOffsetStart;
     let guidelineStart = tdOffsetStart;
@@ -443,8 +552,8 @@ export class ManualColumnMove extends BasePlugin {
     } else if (guidelineStart === 0) {
       // guideline has got `margin-left: -1px` as default
       guidelineStart = 1;
-    } else if (scrollableElement.scrollX !== void 0 && priv.hoveredColumn < priv.fixedColumnsStart) {
-      guidelineStart -= priv.rootElementOffset <= scrollableElement.scrollX ? priv.rootElementOffset : 0;
+    } else if (scrollableElement.scrollX !== undefined && _classPrivateFieldGet(this, _hoveredColumn) < _classPrivateFieldGet(this, _fixedColumnsStart)) {
+      guidelineStart -= _classPrivateFieldGet(this, _rootElementOffset) <= scrollableElement.scrollX ? _classPrivateFieldGet(this, _rootElementOffset) : 0;
     }
     this.backlight.setPosition(null, backlightStart);
     this.guideline.setPosition(null, guidelineStart);
@@ -459,8 +568,8 @@ export class ManualColumnMove extends BasePlugin {
     const {
       documentElement
     } = this.hot.rootDocument;
-    this.eventManager.addEventListener(documentElement, 'mousemove', event => this.onMouseMove(event));
-    this.eventManager.addEventListener(documentElement, 'mouseup', () => this.onMouseUp());
+    this.eventManager.addEventListener(documentElement, 'mousemove', event => _classPrivateMethodGet(this, _onMouseMove, _onMouseMove2).call(this, event));
+    this.eventManager.addEventListener(documentElement, 'mouseup', () => _classPrivateMethodGet(this, _onMouseUp, _onMouseUp2).call(this));
   }
 
   /**
@@ -471,163 +580,6 @@ export class ManualColumnMove extends BasePlugin {
   unregisterEvents() {
     this.eventManager.clear();
   }
-
-  /**
-   * Change the behavior of selection / dragging.
-   *
-   * @private
-   * @param {MouseEvent} event `mousedown` event properties.
-   * @param {CellCoords} coords Visual cell coordinates where was fired event.
-   * @param {HTMLElement} TD Cell represented as HTMLElement.
-   * @param {object} controller An object with properties `row`, `column` and `cell`. Each property contains
-   *                            a boolean value that allows or disallows changing the selection for that particular area.
-   */
-  onBeforeOnCellMouseDown(event, coords, TD, controller) {
-    const wtTable = this.hot.view._wt.wtTable;
-    const isHeaderSelection = this.hot.selection.isSelectedByColumnHeader();
-    const selection = this.hot.getSelectedRangeLast();
-    const priv = privatePool.get(this);
-    // This block action shouldn't be handled below.
-    const isSortingElement = hasClass(event.target, 'sortAction');
-    if (!selection || !isHeaderSelection || priv.pressed || event.button !== 0 || isSortingElement) {
-      priv.pressed = false;
-      priv.columnsToMove.length = 0;
-      removeClass(this.hot.rootElement, [CSS_ON_MOVING, CSS_SHOW_UI]);
-      return;
-    }
-    const guidelineIsNotReady = this.guideline.isBuilt() && !this.guideline.isAppended();
-    const backlightIsNotReady = this.backlight.isBuilt() && !this.backlight.isAppended();
-    if (guidelineIsNotReady && backlightIsNotReady) {
-      this.guideline.appendTo(wtTable.hider);
-      this.backlight.appendTo(wtTable.hider);
-    }
-    const {
-      from,
-      to
-    } = selection;
-    const start = Math.min(from.col, to.col);
-    const end = Math.max(from.col, to.col);
-    if (coords.row < 0 && coords.col >= start && coords.col <= end) {
-      controller.column = true;
-      priv.pressed = true;
-      const eventOffsetX = TD.firstChild ? offsetRelativeTo(event, TD.firstChild).x : event.offsetX;
-      priv.target.eventPageX = event.pageX;
-      priv.hoveredColumn = coords.col;
-      priv.target.TD = TD;
-      priv.target.col = coords.col;
-      priv.columnsToMove = this.prepareColumnsToMoving(start, end);
-      priv.hasRowHeaders = !!this.hot.getSettings().rowHeaders;
-      priv.countCols = this.hot.countCols();
-      priv.fixedColumnsStart = this.hot.getSettings().fixedColumnsStart;
-      priv.rootElementOffset = offset(this.hot.rootElement).left;
-      const countColumnsFrom = priv.hasRowHeaders ? -1 : 0;
-      const topPos = wtTable.holder.scrollTop + wtTable.getColumnHeaderHeight(0) + 1;
-      const fixedColumnsStart = coords.col < priv.fixedColumnsStart;
-      const horizontalScrollPosition = this.hot.view._wt.wtOverlays.inlineStartOverlay.getOverlayOffset();
-      const offsetX = Math.abs(eventOffsetX - (this.hot.isRtl() ? TD.offsetWidth : 0));
-      const inlineOffset = this.getColumnsWidth(start, coords.col - 1) + offsetX;
-      const inlinePos = this.getColumnsWidth(countColumnsFrom, start - 1) + (fixedColumnsStart ? horizontalScrollPosition : 0) + inlineOffset;
-      this.backlight.setPosition(topPos, inlinePos);
-      this.backlight.setSize(this.getColumnsWidth(start, end), wtTable.hider.offsetHeight - topPos);
-      this.backlight.setOffset(null, -inlineOffset);
-      addClass(this.hot.rootElement, CSS_ON_MOVING);
-    } else {
-      removeClass(this.hot.rootElement, CSS_AFTER_SELECTION);
-      priv.pressed = false;
-      priv.columnsToMove.length = 0;
-    }
-  }
-
-  /**
-   * 'mouseMove' event callback. Fired when pointer move on document.documentElement.
-   *
-   * @private
-   * @param {MouseEvent} event `mousemove` event properties.
-   */
-  onMouseMove(event) {
-    const priv = privatePool.get(this);
-    if (!priv.pressed) {
-      return;
-    }
-    priv.target.eventPageX = event.pageX;
-    this.refreshPositions();
-  }
-
-  /**
-   * 'beforeOnCellMouseOver' hook callback. Fired when pointer was over cell.
-   *
-   * @private
-   * @param {MouseEvent} event `mouseover` event properties.
-   * @param {CellCoords} coords Visual cell coordinates where was fired event.
-   * @param {HTMLElement} TD Cell represented as HTMLElement.
-   * @param {object} controller An object with properties `row`, `column` and `cell`. Each property contains
-   *                            a boolean value that allows or disallows changing the selection for that particular area.
-   */
-  onBeforeOnCellMouseOver(event, coords, TD, controller) {
-    const selectedRange = this.hot.getSelectedRangeLast();
-    const priv = privatePool.get(this);
-    if (!selectedRange || !priv.pressed) {
-      return;
-    }
-    if (priv.columnsToMove.indexOf(coords.col) > -1) {
-      removeClass(this.hot.rootElement, CSS_SHOW_UI);
-    } else {
-      addClass(this.hot.rootElement, CSS_SHOW_UI);
-    }
-    controller.row = true;
-    controller.column = true;
-    controller.cell = true;
-    priv.hoveredColumn = coords.col;
-    priv.target.TD = TD;
-  }
-
-  /**
-   * `onMouseUp` hook callback.
-   *
-   * @private
-   */
-  onMouseUp() {
-    const priv = privatePool.get(this);
-    const target = priv.target.col;
-    const columnsLen = priv.columnsToMove.length;
-    priv.hoveredColumn = void 0;
-    priv.pressed = false;
-    priv.backlightWidth = 0;
-    removeClass(this.hot.rootElement, [CSS_ON_MOVING, CSS_SHOW_UI, CSS_AFTER_SELECTION]);
-    if (this.hot.selection.isSelectedByColumnHeader()) {
-      addClass(this.hot.rootElement, CSS_AFTER_SELECTION);
-    }
-    if (columnsLen < 1 || target === void 0) {
-      return;
-    }
-    const firstMovedVisualColumn = priv.columnsToMove[0];
-    const firstMovedPhysicalColumn = this.hot.toPhysicalColumn(firstMovedVisualColumn);
-    const movePerformed = this.dragColumns(priv.columnsToMove, target);
-    priv.columnsToMove.length = 0;
-    if (movePerformed === true) {
-      this.persistentStateSave();
-      this.hot.render();
-      this.hot.view.adjustElementsSize(true);
-      const selectionStart = this.hot.toVisualColumn(firstMovedPhysicalColumn);
-      const selectionEnd = selectionStart + columnsLen - 1;
-      this.hot.selectColumns(selectionStart, selectionEnd);
-    }
-  }
-
-  /**
-   * `afterScrollHorizontally` hook callback. Fired the table was scrolled horizontally.
-   *
-   * @private
-   */
-  onAfterScrollVertically() {
-    const wtTable = this.hot.view._wt.wtTable;
-    const headerHeight = wtTable.getColumnHeaderHeight(0) + 1;
-    const scrollTop = wtTable.holder.scrollTop;
-    const posTop = headerHeight + scrollTop;
-    this.backlight.setPosition(posTop);
-    this.backlight.setSize(null, wtTable.hider.offsetHeight - posTop);
-  }
-
   /**
    * Builds the plugin's UI.
    *
@@ -637,16 +589,6 @@ export class ManualColumnMove extends BasePlugin {
     this.backlight.build();
     this.guideline.build();
   }
-
-  /**
-   * Callback for the `afterLoadData` hook.
-   *
-   * @private
-   */
-  onAfterLoadData() {
-    this.moveBySettingsOrLoad();
-  }
-
   /**
    * Destroys the plugin instance.
    */
@@ -655,4 +597,117 @@ export class ManualColumnMove extends BasePlugin {
     this.guideline.destroy();
     super.destroy();
   }
+}
+function _onBeforeOnCellMouseDown2(event, coords, TD, controller) {
+  const wtTable = this.hot.view._wt.wtTable;
+  const isHeaderSelection = this.hot.selection.isSelectedByColumnHeader();
+  const selection = this.hot.getSelectedRangeLast();
+  // This block action shouldn't be handled below.
+  const isSortingElement = hasClass(event.target, 'sortAction');
+  if (!selection || !isHeaderSelection || _classPrivateFieldGet(this, _pressed) || event.button !== 0 || isSortingElement) {
+    _classPrivateFieldSet(this, _pressed, false);
+    _classPrivateFieldGet(this, _columnsToMove).length = 0;
+    removeClass(this.hot.rootElement, [CSS_ON_MOVING, CSS_SHOW_UI]);
+    return;
+  }
+  const guidelineIsNotReady = this.guideline.isBuilt() && !this.guideline.isAppended();
+  const backlightIsNotReady = this.backlight.isBuilt() && !this.backlight.isAppended();
+  if (guidelineIsNotReady && backlightIsNotReady) {
+    this.guideline.appendTo(wtTable.hider);
+    this.backlight.appendTo(wtTable.hider);
+  }
+  const {
+    from,
+    to
+  } = selection;
+  const start = Math.min(from.col, to.col);
+  const end = Math.max(from.col, to.col);
+  if (coords.row < 0 && coords.col >= start && coords.col <= end) {
+    controller.column = true;
+    _classPrivateFieldSet(this, _pressed, true);
+    const eventOffsetX = TD.firstChild ? offsetRelativeTo(event, TD.firstChild).x : event.offsetX;
+    _classPrivateFieldGet(this, _target).eventPageX = event.pageX;
+    _classPrivateFieldSet(this, _hoveredColumn, coords.col);
+    _classPrivateFieldGet(this, _target).TD = TD;
+    _classPrivateFieldGet(this, _target).col = coords.col;
+    _classPrivateFieldSet(this, _columnsToMove, this.prepareColumnsToMoving(start, end));
+    _classPrivateFieldSet(this, _hasRowHeaders, !!this.hot.getSettings().rowHeaders);
+    _classPrivateFieldSet(this, _countCols, this.hot.countCols());
+    _classPrivateFieldSet(this, _fixedColumnsStart, this.hot.getSettings().fixedColumnsStart);
+    _classPrivateFieldSet(this, _rootElementOffset, offset(this.hot.rootElement).left);
+    const countColumnsFrom = _classPrivateFieldGet(this, _hasRowHeaders) ? -1 : 0;
+    const topPos = wtTable.holder.scrollTop + wtTable.getColumnHeaderHeight(0) + 1;
+    const fixedColumnsStart = coords.col < _classPrivateFieldGet(this, _fixedColumnsStart);
+    const horizontalScrollPosition = this.hot.view._wt.wtOverlays.inlineStartOverlay.getOverlayOffset();
+    const offsetX = Math.abs(eventOffsetX - (this.hot.isRtl() ? TD.offsetWidth : 0));
+    const inlineOffset = this.getColumnsWidth(start, coords.col - 1) + offsetX;
+    const inlinePos = this.getColumnsWidth(countColumnsFrom, start - 1) + (fixedColumnsStart ? horizontalScrollPosition : 0) + inlineOffset;
+    this.backlight.setPosition(topPos, inlinePos);
+    this.backlight.setSize(this.getColumnsWidth(start, end), wtTable.hider.offsetHeight - topPos);
+    this.backlight.setOffset(null, -inlineOffset);
+    addClass(this.hot.rootElement, CSS_ON_MOVING);
+  } else {
+    removeClass(this.hot.rootElement, CSS_AFTER_SELECTION);
+    _classPrivateFieldSet(this, _pressed, false);
+    _classPrivateFieldGet(this, _columnsToMove).length = 0;
+  }
+}
+function _onMouseMove2(event) {
+  if (!_classPrivateFieldGet(this, _pressed)) {
+    return;
+  }
+  _classPrivateFieldGet(this, _target).eventPageX = event.pageX;
+  this.refreshPositions();
+}
+function _onBeforeOnCellMouseOver2(event, coords, TD, controller) {
+  const selectedRange = this.hot.getSelectedRangeLast();
+  if (!selectedRange || !_classPrivateFieldGet(this, _pressed)) {
+    return;
+  }
+  if (_classPrivateFieldGet(this, _columnsToMove).indexOf(coords.col) > -1) {
+    removeClass(this.hot.rootElement, CSS_SHOW_UI);
+  } else {
+    addClass(this.hot.rootElement, CSS_SHOW_UI);
+  }
+  controller.row = true;
+  controller.column = true;
+  controller.cell = true;
+  _classPrivateFieldSet(this, _hoveredColumn, coords.col);
+  _classPrivateFieldGet(this, _target).TD = TD;
+}
+function _onMouseUp2() {
+  const target = _classPrivateFieldGet(this, _target).col;
+  const columnsLen = _classPrivateFieldGet(this, _columnsToMove).length;
+  _classPrivateFieldSet(this, _hoveredColumn, undefined);
+  _classPrivateFieldSet(this, _pressed, false);
+  removeClass(this.hot.rootElement, [CSS_ON_MOVING, CSS_SHOW_UI, CSS_AFTER_SELECTION]);
+  if (this.hot.selection.isSelectedByColumnHeader()) {
+    addClass(this.hot.rootElement, CSS_AFTER_SELECTION);
+  }
+  if (columnsLen < 1 || target === undefined) {
+    return;
+  }
+  const firstMovedVisualColumn = _classPrivateFieldGet(this, _columnsToMove)[0];
+  const firstMovedPhysicalColumn = this.hot.toPhysicalColumn(firstMovedVisualColumn);
+  const movePerformed = this.dragColumns(_classPrivateFieldGet(this, _columnsToMove), target);
+  _classPrivateFieldGet(this, _columnsToMove).length = 0;
+  if (movePerformed === true) {
+    this.persistentStateSave();
+    this.hot.render();
+    this.hot.view.adjustElementsSize(true);
+    const selectionStart = this.hot.toVisualColumn(firstMovedPhysicalColumn);
+    const selectionEnd = selectionStart + columnsLen - 1;
+    this.hot.selectColumns(selectionStart, selectionEnd);
+  }
+}
+function _onAfterScrollVertically2() {
+  const wtTable = this.hot.view._wt.wtTable;
+  const headerHeight = wtTable.getColumnHeaderHeight(0) + 1;
+  const scrollTop = wtTable.holder.scrollTop;
+  const posTop = headerHeight + scrollTop;
+  this.backlight.setPosition(posTop);
+  this.backlight.setSize(null, wtTable.hider.offsetHeight - posTop);
+}
+function _onAfterLoadData2() {
+  this.moveBySettingsOrLoad();
 }