@atlaskit/editor-tables 2.3.18 → 2.4.0

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/editor-tables
 
+## 2.4.0
+
+### Minor Changes
+
+- [#67400](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67400) [`191436e36f93`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/191436e36f93) - Optimised the table move row logic to perform insert/delete steps rather than an entire table replacement
+
 ## 2.3.18
 
 ### Patch Changes

package/dist/cjs/utils/get-selection-range-in-row.js

@@ -7,10 +7,11 @@ exports.getSelectionRangeInRow = void 0;
 var _getCellsInColumn = require("./get-cells-in-column");
 var _getCellsInRow = require("./get-cells-in-row");
 // Returns a range of rectangular selection spanning all merged cells around a row at index `rowIndex`.
-var getSelectionRangeInRow = exports.getSelectionRangeInRow = function getSelectionRangeInRow(rowIndex) {
+var getSelectionRangeInRow = exports.getSelectionRangeInRow = function getSelectionRangeInRow(startRowIndex) {
+  var endRowIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : startRowIndex;
   return function (tr) {
-    var startIndex = rowIndex;
-    var endIndex = rowIndex;
+    var startIndex = startRowIndex;
+    var endIndex = endRowIndex;
 
     // looking for selection start row (startIndex)
     var _loop = function _loop(i) {
@@ -27,7 +28,7 @@ var getSelectionRangeInRow = exports.getSelectionRangeInRow = function getSelect
         });
       }
     };
-    for (var i = rowIndex; i >= 0; i--) {
+    for (var i = startRowIndex; i >= 0; i--) {
       _loop(i);
     }
     // looking for selection end row (endIndex)
@@ -42,7 +43,7 @@ var getSelectionRangeInRow = exports.getSelectionRangeInRow = function getSelect
         });
       }
     };
-    for (var _i = rowIndex; _i <= endIndex; _i++) {
+    for (var _i = startRowIndex; _i <= endIndex; _i++) {
       _loop2(_i);
     }
 

package/dist/cjs/utils/move-column.js

@@ -147,7 +147,10 @@ var moveColumn = exports.moveColumn = function moveColumn(originColumnIndex, tar
     if (!table) {
       return tr;
     }
-    var originalColumnRanges = (0, _getSelectionRangeInColumn.getSelectionRangeInColumn)(originColumnIndex)(tr);
+    if (!Array.isArray(originColumnIndex)) {
+      originColumnIndex = [originColumnIndex];
+    }
+    var originalColumnRanges = (0, _getSelectionRangeInColumn.getSelectionRangeInColumn)(originColumnIndex[0])(tr);
     var targetColumnRanges = (0, _getSelectionRangeInColumn.getSelectionRangeInColumn)(targetColumnIndex)(tr);
     var indexesOriginColumn = (_originalColumnRanges = originalColumnRanges === null || originalColumnRanges === void 0 ? void 0 : originalColumnRanges.indexes) !== null && _originalColumnRanges !== void 0 ? _originalColumnRanges : [];
     var indexesTargetColumn = (_targetColumnRanges$i = targetColumnRanges === null || targetColumnRanges === void 0 ? void 0 : targetColumnRanges.indexes) !== null && _targetColumnRanges$i !== void 0 ? _targetColumnRanges$i : [];
@@ -155,7 +158,7 @@ var moveColumn = exports.moveColumn = function moveColumn(originColumnIndex, tar
       return tr;
     }
     if (!options.tryToFit && indexesTargetColumn.length > 1) {
-      (0, _reorderUtils.isValidReorder)(originColumnIndex, targetColumnIndex, indexesTargetColumn, 'column');
+      (0, _reorderUtils.isValidReorder)(originColumnIndex[0], targetColumnIndex, indexesTargetColumn, 'column');
     }
     var newTable = (0, _reorderUtils.moveTableColumn)(table, indexesOriginColumn, indexesTargetColumn, options.direction);
     var newTr = (0, _cloneTr.cloneTr)(tr).replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);

package/dist/cjs/utils/move-row.js

@@ -1,13 +1,17 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.moveRow = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _tableMap = require("../table-map");
 var _cloneTr = require("./clone-tr");
 var _find = require("./find");
 var _getSelectionRangeInRow = require("./get-selection-range-in-row");
-var _reorderUtils = require("./reorder-utils");
+var _tableNodeTypes = require("./table-node-types");
 // :: (originRowIndex: number, targetRowIndex: targetColumnIndex, options?: MovementOptions) → (tr: Transaction) → Transaction
 // Returns a new transaction that moves the origin row to the target index;
 //
@@ -151,8 +155,8 @@ var _reorderUtils = require("./reorder-utils");
 //   moveRow(x, y, options)(state.tr)
 // );
 // ```
-var moveRow = exports.moveRow = function moveRow(originRowIndex, targetRowIndex) {
-  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
+var moveRow = exports.moveRow = function moveRow(state, originRowIndex, targetRowIndex) {
+  var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {
     tryToFit: false,
     direction: 0
   };
@@ -161,18 +165,137 @@ var moveRow = exports.moveRow = function moveRow(originRowIndex, targetRowIndex)
     if (!table) {
       return tr;
     }
-    var originalRowRanges = (0, _getSelectionRangeInRow.getSelectionRangeInRow)(originRowIndex)(tr);
+
+    // normalize the origin index to an array since move row support moving both a single & multiple rows in a single action.
+    if (!Array.isArray(originRowIndex)) {
+      originRowIndex = [originRowIndex];
+    }
+    if (originRowIndex.includes(targetRowIndex)) {
+      return tr;
+    }
+    var tableMap = _tableMap.TableMap.get(table.node);
+    var _originRowIndex$reduc = originRowIndex.reduce(function (_ref, cur) {
+        var _ref2 = (0, _slicedToArray2.default)(_ref, 2),
+          min = _ref2[0],
+          max = _ref2[1];
+        return [Math.min(min, cur), Math.max(max, cur)];
+      }, [Number.MAX_SAFE_INTEGER, Number.MIN_SAFE_INTEGER]),
+      _originRowIndex$reduc2 = (0, _slicedToArray2.default)(_originRowIndex$reduc, 2),
+      originMin = _originRowIndex$reduc2[0],
+      originMax = _originRowIndex$reduc2[1];
+    var originalRowRanges = (0, _getSelectionRangeInRow.getSelectionRangeInRow)(originMin, originMax)(tr);
     var targetRowRanges = (0, _getSelectionRangeInRow.getSelectionRangeInRow)(targetRowIndex)(tr);
     var indexesOriginRow = (originalRowRanges === null || originalRowRanges === void 0 ? void 0 : originalRowRanges.indexes) || [];
     var indexesTargetRow = (targetRowRanges === null || targetRowRanges === void 0 ? void 0 : targetRowRanges.indexes) || [];
-    if (indexesOriginRow.includes(targetRowIndex)) {
+    if (originMin < 0 || originMin === Number.MAX_SAFE_INTEGER || originMax >= tableMap.height || originMax === Number.MIN_SAFE_INTEGER ||
+    // The target index cannot be within the origin bounds
+    targetRowIndex >= originMin && targetRowIndex <= originMax) {
       return tr;
     }
-    if (!options.tryToFit && indexesTargetRow.length > 1) {
-      (0, _reorderUtils.isValidReorder)(originRowIndex, targetRowIndex, indexesTargetRow, 'row');
+    var types = (0, _tableNodeTypes.tableNodeTypes)(state.schema);
+    var direction = normalizeDirection(originMin, targetRowIndex, options);
+    var actualTargetIndex = Math[direction === 'start' ? 'min' : 'max'].apply(Math, (0, _toConsumableArray2.default)(indexesTargetRow));
+    var originPositions = indexesOriginRow.map(function (index) {
+      return tableMap.positionAt(index, 0, table.node) + table.pos;
+    });
+    var originNodes = originPositions.reduce(function (acc, pos) {
+      var node = tr.doc.nodeAt(tr.mapping.map(pos));
+      if (node) {
+        return [].concat((0, _toConsumableArray2.default)(acc), [{
+          pos: pos,
+          node: node
+        }]);
+      }
+      return acc;
+    }, []);
+    var targetPos = tableMap.positionAt(actualTargetIndex, 0, table.node) + table.pos;
+    var targetNode = tr.doc.nodeAt(tr.mapping.map(targetPos));
+    if (originNodes !== null && originNodes !== void 0 && originNodes.length && targetNode) {
+      var newTr = (0, _cloneTr.cloneTr)(tr);
+      var _determineTableHeader = determineTableHeaderState(table.node, tableMap, types),
+        rowHeaderEnabled = _determineTableHeader.rowHeaderEnabled,
+        columnHeaderEnabled = _determineTableHeader.columnHeaderEnabled;
+      if (rowHeaderEnabled && (originMin === 0 || actualTargetIndex === 0)) {
+        // This block is handling the situation where a row is moved in/out of the header position. If the header row option
+        // is enabled then;
+        // When a row is moved out, the row will be converted to a normal row and the row below it will become the header.
+        // When a row is moved in, the old row header needs to be made normal, and the incoming row needs to be made a header.
+        // This section only manages what happens to the other row, no the one being moved.
+        var nearHeaderPos = tableMap.positionAt(originMin === 0 ? originMax + 1 : actualTargetIndex, 0, table.node) + table.pos;
+        var nearHeaderNode = newTr.doc.nodeAt(newTr.mapping.map(nearHeaderPos));
+        if (nearHeaderNode) {
+          nearHeaderNode.forEach(function (node, offset, index) {
+            var start = newTr.mapping.map(nearHeaderPos + 1 + offset);
+            newTr.setNodeMarkup(start, actualTargetIndex !== 0 || columnHeaderEnabled && index === 0 ? types.header_cell : types.cell, node.attrs);
+          });
+        }
+      }
+      var insertPos = direction === 'end' ? newTr.mapping.map(targetPos + targetNode.nodeSize, 1) : newTr.mapping.map(targetPos, -1);
+      newTr.insert(insertPos, originNodes.map(function (_ref3, index) {
+        var node = _ref3.node;
+        return normalizeRowNode(node, rowHeaderEnabled && actualTargetIndex === 0 && index === 0, columnHeaderEnabled, types);
+      }));
+      originNodes.forEach(function (_ref4) {
+        var pos = _ref4.pos,
+          node = _ref4.node;
+        newTr.delete(newTr.mapping.map(pos, 1), newTr.mapping.map(pos + node.nodeSize, -1));
+      });
+      return newTr;
     }
-    var newTable = (0, _reorderUtils.moveTableRow)(table, indexesOriginRow, indexesTargetRow, options.direction);
-    var newTr = (0, _cloneTr.cloneTr)(tr).replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);
-    return newTr;
+    return tr;
   };
-};
+};
+function normalizeDirection(origin, target) {
+  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
+    tryToFit: false,
+    direction: 0
+  };
+  var dir = origin < target ? 'end' : 'start';
+  var override = options.direction < 0 ? 'start' : 'end';
+  return options.tryToFit && !!options.direction ? override : dir;
+}
+function determineTableHeaderState(table, tableMap, types) {
+  // We only really need to check the 2nd cell in the row/col if it's a header, since we only support a single full row/col header on the top & left
+  // of a table. We can assume that if the 2nd cell is a header then the entire row/col is a header.
+  // Be carefull though! when checking the 1st cell as it shares its header state with both row/cols.
+  // This means we wont be able to reliably identify header state on tables smaller the 2x2, however we can do best guess.
+
+  // This is a 3 bit mask;
+  // bit: 0 = Identifies if the cell at (0, 0) (row, col - 0-based) is a header cell or not
+  // bit: 1 = Identifies if the cell at (0, 1) is a header cell or not
+  // bit: 2 = Identifies if the cell at (1, 0) is a header cell or not
+  var mask = 0;
+
+  // At minimum we should have 1 cell in the table.
+  var topLeftCell = table.nodeAt(tableMap.map[0]);
+  // If this cell is a header that could indicate
+  mask |= topLeftCell && topLeftCell.type === types.header_cell ? 1 : 0;
+  if (tableMap.width > 1) {
+    var cell = table.nodeAt(tableMap.map[1]);
+    // If the cell at (0, 1) is a header then we set the bit flag to indicate row headers are enabled, otherwise if it's
+    // not then we will set the col headers enabled flag (and vice versa in the branch below) only if the cell at (0,0)
+    // was a header cell.
+    mask |= cell && cell.type === types.header_cell ? 2 : 4 * (mask & 1);
+  }
+  if (tableMap.height > 1) {
+    var _cell = table.nodeAt(tableMap.map[tableMap.width]);
+    mask |= _cell && _cell.type === types.header_cell ? 4 : 2 * (mask & 1);
+  }
+  return {
+    rowHeaderEnabled: mask === 7 || mask === 3,
+    columnHeaderEnabled: mask === 7 || mask === 5
+  };
+}
+
+/**
+ * This ensures the row node cell type correctly reflect what they should be.
+ * @returns A copy of the rowNode
+ */
+function normalizeRowNode(rowNode, rowHeaderEnabled, columnHeaderEnabled, types) {
+  var content = [];
+  rowNode.forEach(function (node, offset, index) {
+    var newTargetType = rowHeaderEnabled || columnHeaderEnabled && index === 0 ? types.header_cell : types.cell;
+    content.push(node.type !== newTargetType ? newTargetType.create(node.attrs, node.content, node.marks) : node);
+  });
+  return rowNode.type.create(rowNode.attrs, content, rowNode.marks);
+}

package/dist/es2019/utils/get-selection-range-in-row.js

@@ -2,12 +2,12 @@ import { getCellsInColumn } from './get-cells-in-column';
 import { getCellsInRow } from './get-cells-in-row';
 
 // Returns a range of rectangular selection spanning all merged cells around a row at index `rowIndex`.
-export const getSelectionRangeInRow = rowIndex => tr => {
-  let startIndex = rowIndex;
-  let endIndex = rowIndex;
+export const getSelectionRangeInRow = (startRowIndex, endRowIndex = startRowIndex) => tr => {
+  let startIndex = startRowIndex;
+  let endIndex = endRowIndex;
 
   // looking for selection start row (startIndex)
-  for (let i = rowIndex; i >= 0; i--) {
+  for (let i = startRowIndex; i >= 0; i--) {
     const cells = getCellsInRow(i)(tr.selection);
     if (cells) {
       cells.forEach(cell => {
@@ -22,7 +22,7 @@ export const getSelectionRangeInRow = rowIndex => tr => {
     }
   }
   // looking for selection end row (endIndex)
-  for (let i = rowIndex; i <= endIndex; i++) {
+  for (let i = startRowIndex; i <= endIndex; i++) {
     const cells = getCellsInRow(i)(tr.selection);
     if (cells) {
       cells.forEach(cell => {

package/dist/es2019/utils/move-column.js

@@ -140,7 +140,10 @@ export const moveColumn = (originColumnIndex, targetColumnIndex, options = {
   if (!table) {
     return tr;
   }
-  const originalColumnRanges = getSelectionRangeInColumn(originColumnIndex)(tr);
+  if (!Array.isArray(originColumnIndex)) {
+    originColumnIndex = [originColumnIndex];
+  }
+  const originalColumnRanges = getSelectionRangeInColumn(originColumnIndex[0])(tr);
   const targetColumnRanges = getSelectionRangeInColumn(targetColumnIndex)(tr);
   const indexesOriginColumn = (_originalColumnRanges = originalColumnRanges === null || originalColumnRanges === void 0 ? void 0 : originalColumnRanges.indexes) !== null && _originalColumnRanges !== void 0 ? _originalColumnRanges : [];
   const indexesTargetColumn = (_targetColumnRanges$i = targetColumnRanges === null || targetColumnRanges === void 0 ? void 0 : targetColumnRanges.indexes) !== null && _targetColumnRanges$i !== void 0 ? _targetColumnRanges$i : [];
@@ -148,7 +151,7 @@ export const moveColumn = (originColumnIndex, targetColumnIndex, options = {
     return tr;
   }
   if (!options.tryToFit && indexesTargetColumn.length > 1) {
-    isValidReorder(originColumnIndex, targetColumnIndex, indexesTargetColumn, 'column');
+    isValidReorder(originColumnIndex[0], targetColumnIndex, indexesTargetColumn, 'column');
   }
   const newTable = moveTableColumn(table, indexesOriginColumn, indexesTargetColumn, options.direction);
   const newTr = cloneTr(tr).replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);

package/dist/es2019/utils/move-row.js

@@ -1,7 +1,8 @@
+import { TableMap } from '../table-map';
 import { cloneTr } from './clone-tr';
 import { findTable } from './find';
 import { getSelectionRangeInRow } from './get-selection-range-in-row';
-import { isValidReorder, moveTableRow } from './reorder-utils';
+import { tableNodeTypes } from './table-node-types';
 
 // :: (originRowIndex: number, targetRowIndex: targetColumnIndex, options?: MovementOptions) → (tr: Transaction) → Transaction
 // Returns a new transaction that moves the origin row to the target index;
@@ -146,7 +147,7 @@ import { isValidReorder, moveTableRow } from './reorder-utils';
 //   moveRow(x, y, options)(state.tr)
 // );
 // ```
-export const moveRow = (originRowIndex, targetRowIndex, options = {
+export const moveRow = (state, originRowIndex, targetRowIndex, options = {
   tryToFit: false,
   direction: 0
 }) => tr => {
@@ -154,17 +155,126 @@ export const moveRow = (originRowIndex, targetRowIndex, options = {
   if (!table) {
     return tr;
   }
-  const originalRowRanges = getSelectionRangeInRow(originRowIndex)(tr);
+
+  // normalize the origin index to an array since move row support moving both a single & multiple rows in a single action.
+  if (!Array.isArray(originRowIndex)) {
+    originRowIndex = [originRowIndex];
+  }
+  if (originRowIndex.includes(targetRowIndex)) {
+    return tr;
+  }
+  const tableMap = TableMap.get(table.node);
+  const [originMin, originMax] = originRowIndex.reduce(([min, max], cur) => [Math.min(min, cur), Math.max(max, cur)], [Number.MAX_SAFE_INTEGER, Number.MIN_SAFE_INTEGER]);
+  const originalRowRanges = getSelectionRangeInRow(originMin, originMax)(tr);
   const targetRowRanges = getSelectionRangeInRow(targetRowIndex)(tr);
   const indexesOriginRow = (originalRowRanges === null || originalRowRanges === void 0 ? void 0 : originalRowRanges.indexes) || [];
   const indexesTargetRow = (targetRowRanges === null || targetRowRanges === void 0 ? void 0 : targetRowRanges.indexes) || [];
-  if (indexesOriginRow.includes(targetRowIndex)) {
+  if (originMin < 0 || originMin === Number.MAX_SAFE_INTEGER || originMax >= tableMap.height || originMax === Number.MIN_SAFE_INTEGER ||
+  // The target index cannot be within the origin bounds
+  targetRowIndex >= originMin && targetRowIndex <= originMax) {
     return tr;
   }
-  if (!options.tryToFit && indexesTargetRow.length > 1) {
-    isValidReorder(originRowIndex, targetRowIndex, indexesTargetRow, 'row');
+  const types = tableNodeTypes(state.schema);
+  const direction = normalizeDirection(originMin, targetRowIndex, options);
+  const actualTargetIndex = Math[direction === 'start' ? 'min' : 'max'](...indexesTargetRow);
+  const originPositions = indexesOriginRow.map(index => tableMap.positionAt(index, 0, table.node) + table.pos);
+  const originNodes = originPositions.reduce((acc, pos) => {
+    const node = tr.doc.nodeAt(tr.mapping.map(pos));
+    if (node) {
+      return [...acc, {
+        pos,
+        node
+      }];
+    }
+    return acc;
+  }, []);
+  const targetPos = tableMap.positionAt(actualTargetIndex, 0, table.node) + table.pos;
+  const targetNode = tr.doc.nodeAt(tr.mapping.map(targetPos));
+  if (originNodes !== null && originNodes !== void 0 && originNodes.length && targetNode) {
+    const newTr = cloneTr(tr);
+    const {
+      rowHeaderEnabled,
+      columnHeaderEnabled
+    } = determineTableHeaderState(table.node, tableMap, types);
+    if (rowHeaderEnabled && (originMin === 0 || actualTargetIndex === 0)) {
+      // This block is handling the situation where a row is moved in/out of the header position. If the header row option
+      // is enabled then;
+      // When a row is moved out, the row will be converted to a normal row and the row below it will become the header.
+      // When a row is moved in, the old row header needs to be made normal, and the incoming row needs to be made a header.
+      // This section only manages what happens to the other row, no the one being moved.
+      const nearHeaderPos = tableMap.positionAt(originMin === 0 ? originMax + 1 : actualTargetIndex, 0, table.node) + table.pos;
+      const nearHeaderNode = newTr.doc.nodeAt(newTr.mapping.map(nearHeaderPos));
+      if (nearHeaderNode) {
+        nearHeaderNode.forEach((node, offset, index) => {
+          const start = newTr.mapping.map(nearHeaderPos + 1 + offset);
+          newTr.setNodeMarkup(start, actualTargetIndex !== 0 || columnHeaderEnabled && index === 0 ? types.header_cell : types.cell, node.attrs);
+        });
+      }
+    }
+    const insertPos = direction === 'end' ? newTr.mapping.map(targetPos + targetNode.nodeSize, 1) : newTr.mapping.map(targetPos, -1);
+    newTr.insert(insertPos, originNodes.map(({
+      node
+    }, index) => normalizeRowNode(node, rowHeaderEnabled && actualTargetIndex === 0 && index === 0, columnHeaderEnabled, types)));
+    originNodes.forEach(({
+      pos,
+      node
+    }) => {
+      newTr.delete(newTr.mapping.map(pos, 1), newTr.mapping.map(pos + node.nodeSize, -1));
+    });
+    return newTr;
   }
-  const newTable = moveTableRow(table, indexesOriginRow, indexesTargetRow, options.direction);
-  const newTr = cloneTr(tr).replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);
-  return newTr;
-};
+  return tr;
+};
+function normalizeDirection(origin, target, options = {
+  tryToFit: false,
+  direction: 0
+}) {
+  const dir = origin < target ? 'end' : 'start';
+  const override = options.direction < 0 ? 'start' : 'end';
+  return options.tryToFit && !!options.direction ? override : dir;
+}
+function determineTableHeaderState(table, tableMap, types) {
+  // We only really need to check the 2nd cell in the row/col if it's a header, since we only support a single full row/col header on the top & left
+  // of a table. We can assume that if the 2nd cell is a header then the entire row/col is a header.
+  // Be carefull though! when checking the 1st cell as it shares its header state with both row/cols.
+  // This means we wont be able to reliably identify header state on tables smaller the 2x2, however we can do best guess.
+
+  // This is a 3 bit mask;
+  // bit: 0 = Identifies if the cell at (0, 0) (row, col - 0-based) is a header cell or not
+  // bit: 1 = Identifies if the cell at (0, 1) is a header cell or not
+  // bit: 2 = Identifies if the cell at (1, 0) is a header cell or not
+  let mask = 0;
+
+  // At minimum we should have 1 cell in the table.
+  const topLeftCell = table.nodeAt(tableMap.map[0]);
+  // If this cell is a header that could indicate
+  mask |= topLeftCell && topLeftCell.type === types.header_cell ? 1 : 0;
+  if (tableMap.width > 1) {
+    const cell = table.nodeAt(tableMap.map[1]);
+    // If the cell at (0, 1) is a header then we set the bit flag to indicate row headers are enabled, otherwise if it's
+    // not then we will set the col headers enabled flag (and vice versa in the branch below) only if the cell at (0,0)
+    // was a header cell.
+    mask |= cell && cell.type === types.header_cell ? 2 : 4 * (mask & 1);
+  }
+  if (tableMap.height > 1) {
+    const cell = table.nodeAt(tableMap.map[tableMap.width]);
+    mask |= cell && cell.type === types.header_cell ? 4 : 2 * (mask & 1);
+  }
+  return {
+    rowHeaderEnabled: mask === 7 || mask === 3,
+    columnHeaderEnabled: mask === 7 || mask === 5
+  };
+}
+
+/**
+ * This ensures the row node cell type correctly reflect what they should be.
+ * @returns A copy of the rowNode
+ */
+function normalizeRowNode(rowNode, rowHeaderEnabled, columnHeaderEnabled, types) {
+  let content = [];
+  rowNode.forEach((node, offset, index) => {
+    const newTargetType = rowHeaderEnabled || columnHeaderEnabled && index === 0 ? types.header_cell : types.cell;
+    content.push(node.type !== newTargetType ? newTargetType.create(node.attrs, node.content, node.marks) : node);
+  });
+  return rowNode.type.create(rowNode.attrs, content, rowNode.marks);
+}

package/dist/esm/utils/get-selection-range-in-row.js

@@ -2,10 +2,11 @@ import { getCellsInColumn } from './get-cells-in-column';
 import { getCellsInRow } from './get-cells-in-row';
 
 // Returns a range of rectangular selection spanning all merged cells around a row at index `rowIndex`.
-export var getSelectionRangeInRow = function getSelectionRangeInRow(rowIndex) {
+export var getSelectionRangeInRow = function getSelectionRangeInRow(startRowIndex) {
+  var endRowIndex = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : startRowIndex;
   return function (tr) {
-    var startIndex = rowIndex;
-    var endIndex = rowIndex;
+    var startIndex = startRowIndex;
+    var endIndex = endRowIndex;
 
     // looking for selection start row (startIndex)
     var _loop = function _loop(i) {
@@ -22,7 +23,7 @@ export var getSelectionRangeInRow = function getSelectionRangeInRow(rowIndex) {
         });
       }
     };
-    for (var i = rowIndex; i >= 0; i--) {
+    for (var i = startRowIndex; i >= 0; i--) {
       _loop(i);
     }
     // looking for selection end row (endIndex)
@@ -37,7 +38,7 @@ export var getSelectionRangeInRow = function getSelectionRangeInRow(rowIndex) {
         });
       }
     };
-    for (var _i = rowIndex; _i <= endIndex; _i++) {
+    for (var _i = startRowIndex; _i <= endIndex; _i++) {
       _loop2(_i);
     }
 

package/dist/esm/utils/move-column.js

@@ -142,7 +142,10 @@ export var moveColumn = function moveColumn(originColumnIndex, targetColumnIndex
     if (!table) {
       return tr;
     }
-    var originalColumnRanges = getSelectionRangeInColumn(originColumnIndex)(tr);
+    if (!Array.isArray(originColumnIndex)) {
+      originColumnIndex = [originColumnIndex];
+    }
+    var originalColumnRanges = getSelectionRangeInColumn(originColumnIndex[0])(tr);
     var targetColumnRanges = getSelectionRangeInColumn(targetColumnIndex)(tr);
     var indexesOriginColumn = (_originalColumnRanges = originalColumnRanges === null || originalColumnRanges === void 0 ? void 0 : originalColumnRanges.indexes) !== null && _originalColumnRanges !== void 0 ? _originalColumnRanges : [];
     var indexesTargetColumn = (_targetColumnRanges$i = targetColumnRanges === null || targetColumnRanges === void 0 ? void 0 : targetColumnRanges.indexes) !== null && _targetColumnRanges$i !== void 0 ? _targetColumnRanges$i : [];
@@ -150,7 +153,7 @@ export var moveColumn = function moveColumn(originColumnIndex, targetColumnIndex
       return tr;
     }
     if (!options.tryToFit && indexesTargetColumn.length > 1) {
-      isValidReorder(originColumnIndex, targetColumnIndex, indexesTargetColumn, 'column');
+      isValidReorder(originColumnIndex[0], targetColumnIndex, indexesTargetColumn, 'column');
     }
     var newTable = moveTableColumn(table, indexesOriginColumn, indexesTargetColumn, options.direction);
     var newTr = cloneTr(tr).replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);

package/dist/esm/utils/move-row.js

@@ -1,7 +1,10 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import { TableMap } from '../table-map';
 import { cloneTr } from './clone-tr';
 import { findTable } from './find';
 import { getSelectionRangeInRow } from './get-selection-range-in-row';
-import { isValidReorder, moveTableRow } from './reorder-utils';
+import { tableNodeTypes } from './table-node-types';
 
 // :: (originRowIndex: number, targetRowIndex: targetColumnIndex, options?: MovementOptions) → (tr: Transaction) → Transaction
 // Returns a new transaction that moves the origin row to the target index;
@@ -146,8 +149,8 @@ import { isValidReorder, moveTableRow } from './reorder-utils';
 //   moveRow(x, y, options)(state.tr)
 // );
 // ```
-export var moveRow = function moveRow(originRowIndex, targetRowIndex) {
-  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
+export var moveRow = function moveRow(state, originRowIndex, targetRowIndex) {
+  var options = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : {
     tryToFit: false,
     direction: 0
   };
@@ -156,18 +159,137 @@ export var moveRow = function moveRow(originRowIndex, targetRowIndex) {
     if (!table) {
       return tr;
     }
-    var originalRowRanges = getSelectionRangeInRow(originRowIndex)(tr);
+
+    // normalize the origin index to an array since move row support moving both a single & multiple rows in a single action.
+    if (!Array.isArray(originRowIndex)) {
+      originRowIndex = [originRowIndex];
+    }
+    if (originRowIndex.includes(targetRowIndex)) {
+      return tr;
+    }
+    var tableMap = TableMap.get(table.node);
+    var _originRowIndex$reduc = originRowIndex.reduce(function (_ref, cur) {
+        var _ref2 = _slicedToArray(_ref, 2),
+          min = _ref2[0],
+          max = _ref2[1];
+        return [Math.min(min, cur), Math.max(max, cur)];
+      }, [Number.MAX_SAFE_INTEGER, Number.MIN_SAFE_INTEGER]),
+      _originRowIndex$reduc2 = _slicedToArray(_originRowIndex$reduc, 2),
+      originMin = _originRowIndex$reduc2[0],
+      originMax = _originRowIndex$reduc2[1];
+    var originalRowRanges = getSelectionRangeInRow(originMin, originMax)(tr);
     var targetRowRanges = getSelectionRangeInRow(targetRowIndex)(tr);
     var indexesOriginRow = (originalRowRanges === null || originalRowRanges === void 0 ? void 0 : originalRowRanges.indexes) || [];
     var indexesTargetRow = (targetRowRanges === null || targetRowRanges === void 0 ? void 0 : targetRowRanges.indexes) || [];
-    if (indexesOriginRow.includes(targetRowIndex)) {
+    if (originMin < 0 || originMin === Number.MAX_SAFE_INTEGER || originMax >= tableMap.height || originMax === Number.MIN_SAFE_INTEGER ||
+    // The target index cannot be within the origin bounds
+    targetRowIndex >= originMin && targetRowIndex <= originMax) {
       return tr;
     }
-    if (!options.tryToFit && indexesTargetRow.length > 1) {
-      isValidReorder(originRowIndex, targetRowIndex, indexesTargetRow, 'row');
+    var types = tableNodeTypes(state.schema);
+    var direction = normalizeDirection(originMin, targetRowIndex, options);
+    var actualTargetIndex = Math[direction === 'start' ? 'min' : 'max'].apply(Math, _toConsumableArray(indexesTargetRow));
+    var originPositions = indexesOriginRow.map(function (index) {
+      return tableMap.positionAt(index, 0, table.node) + table.pos;
+    });
+    var originNodes = originPositions.reduce(function (acc, pos) {
+      var node = tr.doc.nodeAt(tr.mapping.map(pos));
+      if (node) {
+        return [].concat(_toConsumableArray(acc), [{
+          pos: pos,
+          node: node
+        }]);
+      }
+      return acc;
+    }, []);
+    var targetPos = tableMap.positionAt(actualTargetIndex, 0, table.node) + table.pos;
+    var targetNode = tr.doc.nodeAt(tr.mapping.map(targetPos));
+    if (originNodes !== null && originNodes !== void 0 && originNodes.length && targetNode) {
+      var newTr = cloneTr(tr);
+      var _determineTableHeader = determineTableHeaderState(table.node, tableMap, types),
+        rowHeaderEnabled = _determineTableHeader.rowHeaderEnabled,
+        columnHeaderEnabled = _determineTableHeader.columnHeaderEnabled;
+      if (rowHeaderEnabled && (originMin === 0 || actualTargetIndex === 0)) {
+        // This block is handling the situation where a row is moved in/out of the header position. If the header row option
+        // is enabled then;
+        // When a row is moved out, the row will be converted to a normal row and the row below it will become the header.
+        // When a row is moved in, the old row header needs to be made normal, and the incoming row needs to be made a header.
+        // This section only manages what happens to the other row, no the one being moved.
+        var nearHeaderPos = tableMap.positionAt(originMin === 0 ? originMax + 1 : actualTargetIndex, 0, table.node) + table.pos;
+        var nearHeaderNode = newTr.doc.nodeAt(newTr.mapping.map(nearHeaderPos));
+        if (nearHeaderNode) {
+          nearHeaderNode.forEach(function (node, offset, index) {
+            var start = newTr.mapping.map(nearHeaderPos + 1 + offset);
+            newTr.setNodeMarkup(start, actualTargetIndex !== 0 || columnHeaderEnabled && index === 0 ? types.header_cell : types.cell, node.attrs);
+          });
+        }
+      }
+      var insertPos = direction === 'end' ? newTr.mapping.map(targetPos + targetNode.nodeSize, 1) : newTr.mapping.map(targetPos, -1);
+      newTr.insert(insertPos, originNodes.map(function (_ref3, index) {
+        var node = _ref3.node;
+        return normalizeRowNode(node, rowHeaderEnabled && actualTargetIndex === 0 && index === 0, columnHeaderEnabled, types);
+      }));
+      originNodes.forEach(function (_ref4) {
+        var pos = _ref4.pos,
+          node = _ref4.node;
+        newTr.delete(newTr.mapping.map(pos, 1), newTr.mapping.map(pos + node.nodeSize, -1));
+      });
+      return newTr;
     }
-    var newTable = moveTableRow(table, indexesOriginRow, indexesTargetRow, options.direction);
-    var newTr = cloneTr(tr).replaceWith(table.pos, table.pos + table.node.nodeSize, newTable);
-    return newTr;
+    return tr;
   };
-};
+};
+function normalizeDirection(origin, target) {
+  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
+    tryToFit: false,
+    direction: 0
+  };
+  var dir = origin < target ? 'end' : 'start';
+  var override = options.direction < 0 ? 'start' : 'end';
+  return options.tryToFit && !!options.direction ? override : dir;
+}
+function determineTableHeaderState(table, tableMap, types) {
+  // We only really need to check the 2nd cell in the row/col if it's a header, since we only support a single full row/col header on the top & left
+  // of a table. We can assume that if the 2nd cell is a header then the entire row/col is a header.
+  // Be carefull though! when checking the 1st cell as it shares its header state with both row/cols.
+  // This means we wont be able to reliably identify header state on tables smaller the 2x2, however we can do best guess.
+
+  // This is a 3 bit mask;
+  // bit: 0 = Identifies if the cell at (0, 0) (row, col - 0-based) is a header cell or not
+  // bit: 1 = Identifies if the cell at (0, 1) is a header cell or not
+  // bit: 2 = Identifies if the cell at (1, 0) is a header cell or not
+  var mask = 0;
+
+  // At minimum we should have 1 cell in the table.
+  var topLeftCell = table.nodeAt(tableMap.map[0]);
+  // If this cell is a header that could indicate
+  mask |= topLeftCell && topLeftCell.type === types.header_cell ? 1 : 0;
+  if (tableMap.width > 1) {
+    var cell = table.nodeAt(tableMap.map[1]);
+    // If the cell at (0, 1) is a header then we set the bit flag to indicate row headers are enabled, otherwise if it's
+    // not then we will set the col headers enabled flag (and vice versa in the branch below) only if the cell at (0,0)
+    // was a header cell.
+    mask |= cell && cell.type === types.header_cell ? 2 : 4 * (mask & 1);
+  }
+  if (tableMap.height > 1) {
+    var _cell = table.nodeAt(tableMap.map[tableMap.width]);
+    mask |= _cell && _cell.type === types.header_cell ? 4 : 2 * (mask & 1);
+  }
+  return {
+    rowHeaderEnabled: mask === 7 || mask === 3,
+    columnHeaderEnabled: mask === 7 || mask === 5
+  };
+}
+
+/**
+ * This ensures the row node cell type correctly reflect what they should be.
+ * @returns A copy of the rowNode
+ */
+function normalizeRowNode(rowNode, rowHeaderEnabled, columnHeaderEnabled, types) {
+  var content = [];
+  rowNode.forEach(function (node, offset, index) {
+    var newTargetType = rowHeaderEnabled || columnHeaderEnabled && index === 0 ? types.header_cell : types.cell;
+    content.push(node.type !== newTargetType ? newTargetType.create(node.attrs, node.content, node.marks) : node);
+  });
+  return rowNode.type.create(rowNode.attrs, content, rowNode.marks);
+}

package/dist/types/utils/get-selection-range-in-row.d.ts

@@ -1,3 +1,3 @@
-import { Transaction } from '@atlaskit/editor-prosemirror/state';
-import { SelectionRange } from '../types';
-export declare const getSelectionRangeInRow: (rowIndex: number) => (tr: Transaction) => SelectionRange | undefined;
+import type { Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { SelectionRange } from '../types';
+export declare const getSelectionRangeInRow: (startRowIndex: number, endRowIndex?: number) => (tr: Transaction) => SelectionRange | undefined;

package/dist/types/utils/move-column.d.ts

@@ -1,5 +1,5 @@
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
-export declare const moveColumn: (originColumnIndex: number, targetColumnIndex: number, options?: {
+export declare const moveColumn: (originColumnIndex: number | number[], targetColumnIndex: number, options?: {
     tryToFit: boolean;
     direction: number;
 }) => (tr: Transaction) => Transaction;

package/dist/types/utils/move-row.d.ts

@@ -1,5 +1,5 @@
-import type { Transaction } from '@atlaskit/editor-prosemirror/state';
-export declare const moveRow: (originRowIndex: number, targetRowIndex: number, options?: {
+import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
+export declare const moveRow: (state: EditorState, originRowIndex: number | number[], targetRowIndex: number, options?: {
     tryToFit: boolean;
     direction: number;
 }) => (tr: Transaction) => Transaction;

package/dist/types-ts4.5/utils/get-selection-range-in-row.d.ts

@@ -1,3 +1,3 @@
-import { Transaction } from '@atlaskit/editor-prosemirror/state';
-import { SelectionRange } from '../types';
-export declare const getSelectionRangeInRow: (rowIndex: number) => (tr: Transaction) => SelectionRange | undefined;
+import type { Transaction } from '@atlaskit/editor-prosemirror/state';
+import type { SelectionRange } from '../types';
+export declare const getSelectionRangeInRow: (startRowIndex: number, endRowIndex?: number) => (tr: Transaction) => SelectionRange | undefined;

package/dist/types-ts4.5/utils/move-column.d.ts

@@ -1,5 +1,5 @@
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
-export declare const moveColumn: (originColumnIndex: number, targetColumnIndex: number, options?: {
+export declare const moveColumn: (originColumnIndex: number | number[], targetColumnIndex: number, options?: {
     tryToFit: boolean;
     direction: number;
 }) => (tr: Transaction) => Transaction;

package/dist/types-ts4.5/utils/move-row.d.ts

@@ -1,5 +1,5 @@
-import type { Transaction } from '@atlaskit/editor-prosemirror/state';
-export declare const moveRow: (originRowIndex: number, targetRowIndex: number, options?: {
+import type { EditorState, Transaction } from '@atlaskit/editor-prosemirror/state';
+export declare const moveRow: (state: EditorState, originRowIndex: number | number[], targetRowIndex: number, options?: {
     tryToFit: boolean;
     direction: number;
 }) => (tr: Transaction) => Transaction;

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@atlaskit/editor-tables",
-  "version": "2.3.18",
+  "version": "2.4.0",
   "description": "A package that contains common classes and utility functions for editor tables",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
   "main": "dist/cjs/index.js",