handsontable 0.0.0-next-95bb75e-20240131 → 0.0.0-next-ffffb2f-20240131

package/helpers/mixed.js

@@ -134,7 +134,7 @@ const domMessages = {
 function _injectProductInfo(key, element) {
   const hasValidType = !isEmpty(key);
   const isNonCommercial = typeof key === 'string' && key.toLowerCase() === 'non-commercial-and-evaluation';
-  const hotVersion = "0.0.0-next-95bb75e-20240131";
+  const hotVersion = "0.0.0-next-ffffb2f-20240131";
   let keyValidityDate;
   let consoleMessageState = 'invalid';
   let domMessageState = 'invalid';

package/helpers/mixed.mjs

@@ -124,7 +124,7 @@ const domMessages = {
 export function _injectProductInfo(key, element) {
   const hasValidType = !isEmpty(key);
   const isNonCommercial = typeof key === 'string' && key.toLowerCase() === 'non-commercial-and-evaluation';
-  const hotVersion = "0.0.0-next-95bb75e-20240131";
+  const hotVersion = "0.0.0-next-ffffb2f-20240131";
   let keyValidityDate;
   let consoleMessageState = 'invalid';
   let domMessageState = 'invalid';

package/package.json

@@ -10,7 +10,7 @@
     "url": "https://github.com/handsontable/handsontable/issues"
   },
   "author": "Handsoncode <hello@handsontable.com>",
-  "version": "0.0.0-next-95bb75e-20240131",
+  "version": "0.0.0-next-ffffb2f-20240131",
   "main": "index",
   "module": "index.mjs",
   "jsnext:main": "index.mjs",

package/plugins/formulas/indexSyncer/axisSyncer.js

@@ -4,7 +4,6 @@ exports.__esModule = true;
 require("core-js/modules/es.array.push.js");
 require("core-js/modules/es.error.cause.js");
 var _string = require("../../../helpers/string");
-var _moves = require("../../../helpers/moves");
 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); }
@@ -177,6 +176,79 @@ class AxisSyncer {
     _classPrivateFieldSet(this, _finalIndex, this.getHfIndexFromVisualIndex(visualFinalIndex));
   }
 
+  /**
+   * Gets first position where to move element (respecting the fact that some element will be sooner or later
+   * taken out of the dataset in order to move them).
+   *
+   * @param {Array<number>} movedHfIndexes Sequence of moved HF indexes for certain axis.
+   * @param {number} finalHfIndex Final HF place where to move rows.
+   * @returns {number} HF's index informing where to move the first element.
+   * @private
+   */
+  getMoveLine(movedHfIndexes, finalHfIndex) {
+    const numberOfElements = _classPrivateFieldGet(this, _indexMapper).getNumberOfIndexes();
+    const notMovedElements = Array.from(Array(numberOfElements).keys()).filter(index => movedHfIndexes.includes(index) === false);
+    if (finalHfIndex === 0) {
+      var _notMovedElements$fin;
+      return (_notMovedElements$fin = notMovedElements[finalHfIndex]) !== null && _notMovedElements$fin !== void 0 ? _notMovedElements$fin : 0; // Moving before the first dataset's element.
+    }
+    return notMovedElements[finalHfIndex - 1] + 1; // Moving before another element.
+  }
+
+  /**
+   * Gets initially calculated HF's move positions.
+   *
+   * @private
+   * @param {Array<number>} movedHfIndexes Sequence of moved HF indexes for certain axis.
+   * @param {number} finalHfIndex Final HF place where to move rows.
+   * @returns {Array<{from: number, to: number}>} Initially calculated HF's move positions.
+   */
+  getInitiallyCalculatedMoves(movedHfIndexes, finalHfIndex) {
+    let moveLine = this.getMoveLine(movedHfIndexes, finalHfIndex);
+    const moves = [];
+    movedHfIndexes.forEach(movedHfIndex => {
+      const move = {
+        from: movedHfIndex,
+        to: moveLine
+      };
+      moves.forEach(previouslyMovedIndex => {
+        const isMovingFromEndToStart = previouslyMovedIndex.from > previouslyMovedIndex.to;
+        const isMovingElementBefore = previouslyMovedIndex.to <= move.from;
+        const isMovingAfterElement = previouslyMovedIndex.from > move.from;
+        if (isMovingAfterElement && isMovingElementBefore && isMovingFromEndToStart) {
+          move.from += 1;
+        }
+      });
+
+      // Moved element from right to left (or bottom to top).
+      if (move.from >= moveLine) {
+        moveLine += 1;
+      }
+      moves.push(move);
+    });
+    return moves;
+  }
+
+  /**
+   * Gets finally calculated HF's move positions (after adjusting).
+   *
+   * @private
+   * @param {Array<{from: number, to: number}>} moves Initially calculated HF's move positions.
+   * @returns {Array<{from: number, to: number}>} Finally calculated HF's move positions (after adjusting).
+   */
+  adjustedCalculatedMoves(moves) {
+    moves.forEach((move, index) => {
+      const nextMoved = moves.slice(index + 1);
+      nextMoved.forEach(nextMovedIndex => {
+        const isMovingFromStartToEnd = nextMovedIndex.from < nextMovedIndex.to;
+        if (nextMovedIndex.from > move.from && isMovingFromStartToEnd) {
+          nextMovedIndex.from -= 1;
+        }
+      });
+    });
+    return moves;
+  }
+
   /**
    * Calculating where to move HF elements and performing already calculated moves.
    *
@@ -190,7 +262,7 @@ class AxisSyncer {
     if (movePossible === false || orderChanged === false) {
       return;
     }
-    const calculatedMoves = (0, _moves.getMoves)(_classPrivateFieldGet(this, _movedIndexes), _classPrivateFieldGet(this, _finalIndex), _classPrivateFieldGet(this, _indexMapper).getNumberOfIndexes());
+    const calculatedMoves = this.adjustedCalculatedMoves(this.getInitiallyCalculatedMoves(_classPrivateFieldGet(this, _movedIndexes), _classPrivateFieldGet(this, _finalIndex)));
     if (_classPrivateFieldGet(this, _indexSyncer).getSheetId() === null) {
       _classPrivateFieldGet(this, _indexSyncer).getPostponeAction(() => this.syncMoves(calculatedMoves));
     } else {

package/plugins/formulas/indexSyncer/axisSyncer.mjs

@@ -8,7 +8,6 @@ function _classPrivateFieldSet(receiver, privateMap, value) { var 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 _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 { toUpperCaseFirst } from "../../../helpers/string.mjs";
-import { getMoves } from "../../../helpers/moves.mjs";
 /**
  * @private
  * @class IndexSyncer
@@ -174,6 +173,79 @@ class AxisSyncer {
     _classPrivateFieldSet(this, _finalIndex, this.getHfIndexFromVisualIndex(visualFinalIndex));
   }
 
+  /**
+   * Gets first position where to move element (respecting the fact that some element will be sooner or later
+   * taken out of the dataset in order to move them).
+   *
+   * @param {Array<number>} movedHfIndexes Sequence of moved HF indexes for certain axis.
+   * @param {number} finalHfIndex Final HF place where to move rows.
+   * @returns {number} HF's index informing where to move the first element.
+   * @private
+   */
+  getMoveLine(movedHfIndexes, finalHfIndex) {
+    const numberOfElements = _classPrivateFieldGet(this, _indexMapper).getNumberOfIndexes();
+    const notMovedElements = Array.from(Array(numberOfElements).keys()).filter(index => movedHfIndexes.includes(index) === false);
+    if (finalHfIndex === 0) {
+      var _notMovedElements$fin;
+      return (_notMovedElements$fin = notMovedElements[finalHfIndex]) !== null && _notMovedElements$fin !== void 0 ? _notMovedElements$fin : 0; // Moving before the first dataset's element.
+    }
+    return notMovedElements[finalHfIndex - 1] + 1; // Moving before another element.
+  }
+
+  /**
+   * Gets initially calculated HF's move positions.
+   *
+   * @private
+   * @param {Array<number>} movedHfIndexes Sequence of moved HF indexes for certain axis.
+   * @param {number} finalHfIndex Final HF place where to move rows.
+   * @returns {Array<{from: number, to: number}>} Initially calculated HF's move positions.
+   */
+  getInitiallyCalculatedMoves(movedHfIndexes, finalHfIndex) {
+    let moveLine = this.getMoveLine(movedHfIndexes, finalHfIndex);
+    const moves = [];
+    movedHfIndexes.forEach(movedHfIndex => {
+      const move = {
+        from: movedHfIndex,
+        to: moveLine
+      };
+      moves.forEach(previouslyMovedIndex => {
+        const isMovingFromEndToStart = previouslyMovedIndex.from > previouslyMovedIndex.to;
+        const isMovingElementBefore = previouslyMovedIndex.to <= move.from;
+        const isMovingAfterElement = previouslyMovedIndex.from > move.from;
+        if (isMovingAfterElement && isMovingElementBefore && isMovingFromEndToStart) {
+          move.from += 1;
+        }
+      });
+
+      // Moved element from right to left (or bottom to top).
+      if (move.from >= moveLine) {
+        moveLine += 1;
+      }
+      moves.push(move);
+    });
+    return moves;
+  }
+
+  /**
+   * Gets finally calculated HF's move positions (after adjusting).
+   *
+   * @private
+   * @param {Array<{from: number, to: number}>} moves Initially calculated HF's move positions.
+   * @returns {Array<{from: number, to: number}>} Finally calculated HF's move positions (after adjusting).
+   */
+  adjustedCalculatedMoves(moves) {
+    moves.forEach((move, index) => {
+      const nextMoved = moves.slice(index + 1);
+      nextMoved.forEach(nextMovedIndex => {
+        const isMovingFromStartToEnd = nextMovedIndex.from < nextMovedIndex.to;
+        if (nextMovedIndex.from > move.from && isMovingFromStartToEnd) {
+          nextMovedIndex.from -= 1;
+        }
+      });
+    });
+    return moves;
+  }
+
   /**
    * Calculating where to move HF elements and performing already calculated moves.
    *
@@ -187,7 +259,7 @@ class AxisSyncer {
     if (movePossible === false || orderChanged === false) {
       return;
     }
-    const calculatedMoves = getMoves(_classPrivateFieldGet(this, _movedIndexes), _classPrivateFieldGet(this, _finalIndex), _classPrivateFieldGet(this, _indexMapper).getNumberOfIndexes());
+    const calculatedMoves = this.adjustedCalculatedMoves(this.getInitiallyCalculatedMoves(_classPrivateFieldGet(this, _movedIndexes), _classPrivateFieldGet(this, _finalIndex)));
     if (_classPrivateFieldGet(this, _indexSyncer).getSheetId() === null) {
       _classPrivateFieldGet(this, _indexSyncer).getPostponeAction(() => this.syncMoves(calculatedMoves));
     } else {

package/plugins/undoRedo/undoRedo.js

@@ -8,7 +8,6 @@ var _array = require("../../helpers/array");
 var _number = require("../../helpers/number");
 var _object = require("../../helpers/object");
 var _utils = require("../contextMenu/utils");
-var _moves = require("../../helpers/moves");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const SHORTCUTS_GROUP = 'undoRedo';
 const PLUGIN_KEY = exports.PLUGIN_KEY = 'undoRedo';
@@ -133,12 +132,6 @@ function UndoRedo(instance) {
     }
     plugin.done(() => new UndoRedo.RowMoveAction(rows, finalIndex));
   });
-  instance.addHook('beforeColumnMove', (columns, finalIndex) => {
-    if (columns === false) {
-      return;
-    }
-    plugin.done(() => new UndoRedo.ColumnMoveAction(columns, finalIndex));
-  });
   instance.addHook('beforeMergeCells', (cellRange, auto) => {
     if (auto) {
       return;
@@ -721,24 +714,24 @@ UndoRedo.UnmergeCellsAction = UnmergeCellsAction;
  */
 UndoRedo.RowMoveAction = function (rows, finalIndex) {
   this.rows = rows.slice();
-  this.finalRowIndex = finalIndex;
+  this.finalIndex = finalIndex;
   this.actionType = 'row_move';
 };
 (0, _object.inherit)(UndoRedo.RowMoveAction, UndoRedo.Action);
 UndoRedo.RowMoveAction.prototype.undo = function (instance, undoneCallback) {
   const manualRowMove = instance.getPlugin('manualRowMove');
+  const copyOfRows = [].concat(this.rows);
+  const rowsMovedUp = copyOfRows.filter(a => a > this.finalIndex);
+  const rowsMovedDown = copyOfRows.filter(a => a <= this.finalIndex);
+  const allMovedRows = rowsMovedUp.sort((a, b) => b - a).concat(rowsMovedDown.sort((a, b) => a - b));
   instance.addHookOnce('afterViewRender', undoneCallback);
-  const rowMoves = (0, _moves.getMoves)(this.rows, this.finalRowIndex, instance.rowIndexMapper.getNumberOfIndexes());
-  rowMoves.reverse().forEach(_ref4 => {
-    let {
-      from,
-      to
-    } = _ref4;
-    if (from < to) {
-      to -= 1;
-    }
-    manualRowMove.moveRow(to, from);
-  });
+
+  // Moving rows from those with higher indexes to those with lower indexes when action was performed from bottom to top
+  // Moving rows from those with lower indexes to those with higher indexes when action was performed from top to bottom
+  for (let i = 0; i < allMovedRows.length; i += 1) {
+    const newPhysicalRow = instance.toVisualRow(allMovedRows[i]);
+    manualRowMove.moveRow(newPhysicalRow, allMovedRows[i]);
+  }
   instance.render();
   instance.deselectCell();
   instance.selectRows(this.rows[0], this.rows[0] + this.rows.length - 1);
@@ -746,50 +739,10 @@ UndoRedo.RowMoveAction.prototype.undo = function (instance, undoneCallback) {
 UndoRedo.RowMoveAction.prototype.redo = function (instance, redoneCallback) {
   const manualRowMove = instance.getPlugin('manualRowMove');
   instance.addHookOnce('afterViewRender', redoneCallback);
-  manualRowMove.moveRows(this.rows.slice(), this.finalRowIndex);
-  instance.render();
-  instance.deselectCell();
-  instance.selectRows(this.finalRowIndex, this.finalRowIndex + this.rows.length - 1);
-};
-
-/**
- * ManualColumnMove action.
- *
- * @private
- * @param {number[]} columns An array with moved columns.
- * @param {number} finalIndex The destination index.
- */
-UndoRedo.ColumnMoveAction = function (columns, finalIndex) {
-  this.columns = columns.slice();
-  this.finalColumnIndex = finalIndex;
-  this.actionType = 'col_move';
-};
-(0, _object.inherit)(UndoRedo.ColumnMoveAction, UndoRedo.Action);
-UndoRedo.ColumnMoveAction.prototype.undo = function (instance, undoneCallback) {
-  const manualColumnMove = instance.getPlugin('manualColumnMove');
-  instance.addHookOnce('afterViewRender', undoneCallback);
-  const columnMoves = (0, _moves.getMoves)(this.columns, this.finalColumnIndex, instance.columnIndexMapper.getNumberOfIndexes());
-  columnMoves.reverse().forEach(_ref5 => {
-    let {
-      from,
-      to
-    } = _ref5;
-    if (from < to) {
-      to -= 1;
-    }
-    manualColumnMove.moveColumn(to, from);
-  });
-  instance.render();
-  instance.deselectCell();
-  instance.selectColumns(this.columns[0], this.columns[0] + this.columns.length - 1);
-};
-UndoRedo.ColumnMoveAction.prototype.redo = function (instance, redoneCallback) {
-  const manualColumnMove = instance.getPlugin('manualColumnMove');
-  instance.addHookOnce('afterViewRender', redoneCallback);
-  manualColumnMove.moveColumns(this.columns.slice(), this.finalColumnIndex);
+  manualRowMove.moveRows(this.rows.slice(), this.finalIndex);
   instance.render();
   instance.deselectCell();
-  instance.selectColumns(this.finalColumnIndex, this.finalColumnIndex + this.columns.length - 1);
+  instance.selectRows(this.finalIndex, this.finalIndex + this.rows.length - 1);
 };
 
 /**

package/plugins/undoRedo/undoRedo.mjs

@@ -5,7 +5,6 @@ import { arrayMap, arrayEach } from "../../helpers/array.mjs";
 import { rangeEach } from "../../helpers/number.mjs";
 import { inherit, deepClone } from "../../helpers/object.mjs";
 import { align } from "../contextMenu/utils.mjs";
-import { getMoves } from "../../helpers/moves.mjs";
 const SHORTCUTS_GROUP = 'undoRedo';
 export const PLUGIN_KEY = 'undoRedo';
 
@@ -129,12 +128,6 @@ function UndoRedo(instance) {
     }
     plugin.done(() => new UndoRedo.RowMoveAction(rows, finalIndex));
   });
-  instance.addHook('beforeColumnMove', (columns, finalIndex) => {
-    if (columns === false) {
-      return;
-    }
-    plugin.done(() => new UndoRedo.ColumnMoveAction(columns, finalIndex));
-  });
   instance.addHook('beforeMergeCells', (cellRange, auto) => {
     if (auto) {
       return;
@@ -717,24 +710,24 @@ UndoRedo.UnmergeCellsAction = UnmergeCellsAction;
  */
 UndoRedo.RowMoveAction = function (rows, finalIndex) {
   this.rows = rows.slice();
-  this.finalRowIndex = finalIndex;
+  this.finalIndex = finalIndex;
   this.actionType = 'row_move';
 };
 inherit(UndoRedo.RowMoveAction, UndoRedo.Action);
 UndoRedo.RowMoveAction.prototype.undo = function (instance, undoneCallback) {
   const manualRowMove = instance.getPlugin('manualRowMove');
+  const copyOfRows = [].concat(this.rows);
+  const rowsMovedUp = copyOfRows.filter(a => a > this.finalIndex);
+  const rowsMovedDown = copyOfRows.filter(a => a <= this.finalIndex);
+  const allMovedRows = rowsMovedUp.sort((a, b) => b - a).concat(rowsMovedDown.sort((a, b) => a - b));
   instance.addHookOnce('afterViewRender', undoneCallback);
-  const rowMoves = getMoves(this.rows, this.finalRowIndex, instance.rowIndexMapper.getNumberOfIndexes());
-  rowMoves.reverse().forEach(_ref4 => {
-    let {
-      from,
-      to
-    } = _ref4;
-    if (from < to) {
-      to -= 1;
-    }
-    manualRowMove.moveRow(to, from);
-  });
+
+  // Moving rows from those with higher indexes to those with lower indexes when action was performed from bottom to top
+  // Moving rows from those with lower indexes to those with higher indexes when action was performed from top to bottom
+  for (let i = 0; i < allMovedRows.length; i += 1) {
+    const newPhysicalRow = instance.toVisualRow(allMovedRows[i]);
+    manualRowMove.moveRow(newPhysicalRow, allMovedRows[i]);
+  }
   instance.render();
   instance.deselectCell();
   instance.selectRows(this.rows[0], this.rows[0] + this.rows.length - 1);
@@ -742,50 +735,10 @@ UndoRedo.RowMoveAction.prototype.undo = function (instance, undoneCallback) {
 UndoRedo.RowMoveAction.prototype.redo = function (instance, redoneCallback) {
   const manualRowMove = instance.getPlugin('manualRowMove');
   instance.addHookOnce('afterViewRender', redoneCallback);
-  manualRowMove.moveRows(this.rows.slice(), this.finalRowIndex);
-  instance.render();
-  instance.deselectCell();
-  instance.selectRows(this.finalRowIndex, this.finalRowIndex + this.rows.length - 1);
-};
-
-/**
- * ManualColumnMove action.
- *
- * @private
- * @param {number[]} columns An array with moved columns.
- * @param {number} finalIndex The destination index.
- */
-UndoRedo.ColumnMoveAction = function (columns, finalIndex) {
-  this.columns = columns.slice();
-  this.finalColumnIndex = finalIndex;
-  this.actionType = 'col_move';
-};
-inherit(UndoRedo.ColumnMoveAction, UndoRedo.Action);
-UndoRedo.ColumnMoveAction.prototype.undo = function (instance, undoneCallback) {
-  const manualColumnMove = instance.getPlugin('manualColumnMove');
-  instance.addHookOnce('afterViewRender', undoneCallback);
-  const columnMoves = getMoves(this.columns, this.finalColumnIndex, instance.columnIndexMapper.getNumberOfIndexes());
-  columnMoves.reverse().forEach(_ref5 => {
-    let {
-      from,
-      to
-    } = _ref5;
-    if (from < to) {
-      to -= 1;
-    }
-    manualColumnMove.moveColumn(to, from);
-  });
-  instance.render();
-  instance.deselectCell();
-  instance.selectColumns(this.columns[0], this.columns[0] + this.columns.length - 1);
-};
-UndoRedo.ColumnMoveAction.prototype.redo = function (instance, redoneCallback) {
-  const manualColumnMove = instance.getPlugin('manualColumnMove');
-  instance.addHookOnce('afterViewRender', redoneCallback);
-  manualColumnMove.moveColumns(this.columns.slice(), this.finalColumnIndex);
+  manualRowMove.moveRows(this.rows.slice(), this.finalIndex);
   instance.render();
   instance.deselectCell();
-  instance.selectColumns(this.finalColumnIndex, this.finalColumnIndex + this.columns.length - 1);
+  instance.selectRows(this.finalIndex, this.finalIndex + this.rows.length - 1);
 };
 
 /**

package/tableView.js

@@ -307,15 +307,13 @@ class TableView {
     const {
       rootElement,
       rootDocument,
-      selection
+      selection,
+      rootWindow
     } = this.hot;
     const documentElement = rootDocument.documentElement;
     this.eventManager.addEventListener(rootElement, 'mousedown', event => {
       _classPrivateFieldSet(this, _selectionMouseDown, true);
       if (!this.isTextSelectionAllowed(event.target)) {
-        const {
-          rootWindow
-        } = this.hot;
         (0, _element.clearTextSelection)(rootWindow);
         event.preventDefault();
         rootWindow.focus(); // make sure that window that contains HOT is active. Important when HOT is in iframe.
@@ -328,7 +326,7 @@ class TableView {
       if (_classPrivateFieldGet(this, _selectionMouseDown) && !this.isTextSelectionAllowed(event.target)) {
         // Clear selection only when fragmentSelection is enabled, otherwise clearing selection breaks the IME editor.
         if (this.settings.fragmentSelection) {
-          (0, _element.clearTextSelection)(this.hot.rootWindow);
+          (0, _element.clearTextSelection)(rootWindow);
         }
         event.preventDefault();
       }
@@ -408,6 +406,13 @@ class TableView {
         this.hot.destroyEditor(false, false);
       }
     });
+    let parentWindow = (0, _element.getParentWindow)(rootWindow);
+    while (parentWindow !== null) {
+      this.eventManager.addEventListener(parentWindow.document.documentElement, 'click', () => {
+        this.hot.unlisten();
+      });
+      parentWindow = (0, _element.getParentWindow)(parentWindow);
+    }
     this.eventManager.addEventListener(_classPrivateFieldGet(this, _table), 'selectstart', event => {
       if (this.settings.fragmentSelection || (0, _element.isInput)(event.target)) {
         return;

package/tableView.mjs

@@ -12,7 +12,7 @@ function _classApplyDescriptorGet(receiver, descriptor) { if (descriptor.get) {
 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 { addClass, clearTextSelection, empty, fastInnerHTML, fastInnerText, getScrollbarWidth, hasClass, isChildOf, isInput, isOutsideInput, isVisible, setAttribute } from "./helpers/dom/element.mjs";
+import { addClass, clearTextSelection, empty, fastInnerHTML, fastInnerText, getScrollbarWidth, hasClass, isChildOf, isInput, isOutsideInput, isVisible, setAttribute, getParentWindow } from "./helpers/dom/element.mjs";
 import EventManager from "./eventManager.mjs";
 import { isImmediatePropagationStopped, isRightClick, isLeftClick } from "./helpers/dom/event.mjs";
 import Walkontable from "./3rdparty/walkontable/src/index.mjs";
@@ -303,15 +303,13 @@ class TableView {
     const {
       rootElement,
       rootDocument,
-      selection
+      selection,
+      rootWindow
     } = this.hot;
     const documentElement = rootDocument.documentElement;
     this.eventManager.addEventListener(rootElement, 'mousedown', event => {
       _classPrivateFieldSet(this, _selectionMouseDown, true);
       if (!this.isTextSelectionAllowed(event.target)) {
-        const {
-          rootWindow
-        } = this.hot;
         clearTextSelection(rootWindow);
         event.preventDefault();
         rootWindow.focus(); // make sure that window that contains HOT is active. Important when HOT is in iframe.
@@ -324,7 +322,7 @@ class TableView {
       if (_classPrivateFieldGet(this, _selectionMouseDown) && !this.isTextSelectionAllowed(event.target)) {
         // Clear selection only when fragmentSelection is enabled, otherwise clearing selection breaks the IME editor.
         if (this.settings.fragmentSelection) {
-          clearTextSelection(this.hot.rootWindow);
+          clearTextSelection(rootWindow);
         }
         event.preventDefault();
       }
@@ -404,6 +402,13 @@ class TableView {
         this.hot.destroyEditor(false, false);
       }
     });
+    let parentWindow = getParentWindow(rootWindow);
+    while (parentWindow !== null) {
+      this.eventManager.addEventListener(parentWindow.document.documentElement, 'click', () => {
+        this.hot.unlisten();
+      });
+      parentWindow = getParentWindow(parentWindow);
+    }
     this.eventManager.addEventListener(_classPrivateFieldGet(this, _table), 'selectstart', event => {
       if (this.settings.fragmentSelection || isInput(event.target)) {
         return;

package/utils/parseTable.js

@@ -5,6 +5,7 @@ exports._dataToHTML = _dataToHTML;
 exports.htmlToGridSettings = htmlToGridSettings;
 exports.instanceToHTML = instanceToHTML;
 require("core-js/modules/es.array.push.js");
+require("core-js/modules/es.string.replace-all.js");
 var _mixed = require("./../helpers/mixed");
 const ESCAPED_HTML_CHARS = {
   ' ': '\x20',
@@ -140,7 +141,14 @@ function htmlToGridSettings(element) {
   if (typeof checkElement === 'string') {
     const escapedAdjacentHTML = checkElement.replace(/<td\b[^>]*?>([\s\S]*?)<\/\s*td>/g, cellFragment => {
       const openingTag = cellFragment.match(/<td\b[^>]*?>/g)[0];
-      const cellValue = cellFragment.substring(openingTag.length, cellFragment.lastIndexOf('<')).replace(/(<(?!br)([^>]+)>)/gi, '');
+      const paragraphRegexp = /<p.*?>/g;
+      const cellValue = cellFragment.substring(openingTag.length, cellFragment.lastIndexOf('<')).trim() // Removing whitespaces from the start and the end of HTML fragment
+      .replaceAll(/\n\s+/g, ' ') // HTML tags may be split using multiple new lines and whitespaces
+      .replaceAll(paragraphRegexp, '\n') // Only paragraphs should split text using new line characters
+      .replace('\n', '') // First paragraph shouldn't start with new line characters
+      .replaceAll(/<\/(.*)>\s+$/mg, '</$1>') // HTML tags may end with whitespace.
+      .replace(/(<(?!br)([^>]+)>)/gi, '') // Removing HTML tags
+      .replaceAll(/^&nbsp;$/mg, ''); // Removing single &nbsp; characters separating new lines
       const closingTag = '</td>';
       return `${openingTag}${cellValue}${closingTag}`;
     });

package/utils/parseTable.mjs

@@ -1,4 +1,5 @@
 import "core-js/modules/es.array.push.js";
+import "core-js/modules/es.string.replace-all.js";
 import { isEmpty } from "./../helpers/mixed.mjs";
 const ESCAPED_HTML_CHARS = {
   ' ': '\x20',
@@ -134,7 +135,14 @@ export function htmlToGridSettings(element) {
   if (typeof checkElement === 'string') {
     const escapedAdjacentHTML = checkElement.replace(/<td\b[^>]*?>([\s\S]*?)<\/\s*td>/g, cellFragment => {
       const openingTag = cellFragment.match(/<td\b[^>]*?>/g)[0];
-      const cellValue = cellFragment.substring(openingTag.length, cellFragment.lastIndexOf('<')).replace(/(<(?!br)([^>]+)>)/gi, '');
+      const paragraphRegexp = /<p.*?>/g;
+      const cellValue = cellFragment.substring(openingTag.length, cellFragment.lastIndexOf('<')).trim() // Removing whitespaces from the start and the end of HTML fragment
+      .replaceAll(/\n\s+/g, ' ') // HTML tags may be split using multiple new lines and whitespaces
+      .replaceAll(paragraphRegexp, '\n') // Only paragraphs should split text using new line characters
+      .replace('\n', '') // First paragraph shouldn't start with new line characters
+      .replaceAll(/<\/(.*)>\s+$/mg, '</$1>') // HTML tags may end with whitespace.
+      .replace(/(<(?!br)([^>]+)>)/gi, '') // Removing HTML tags
+      .replaceAll(/^&nbsp;$/mg, ''); // Removing single &nbsp; characters separating new lines
       const closingTag = '</td>';
       return `${openingTag}${cellValue}${closingTag}`;
     });