@atlaskit/editor-plugin-table 6.0.0 → 6.1.0

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/editor-plugin-table
 
+## 6.1.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
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 6.0.0
 
 ### Major Changes

package/dist/cjs/pm-plugins/drag-and-drop/commands-with-analytics.js

@@ -1,9 +1,11 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.moveSourceWithAnalyticsViaShortcut = exports.moveSourceWithAnalytics = exports.clearDropTargetWithAnalytics = void 0;
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _utils = require("@atlaskit/editor-tables/utils");
@@ -11,8 +13,9 @@ var _utils2 = require("../../utils");
 var _analytics2 = require("../../utils/analytics");
 var _commands = require("./commands");
 var clearDropTargetWithAnalytics = exports.clearDropTargetWithAnalytics = function clearDropTargetWithAnalytics(editorAnalyticsAPI) {
-  return function (inputMethod, sourceType, status, tr) {
+  return function (inputMethod, sourceType, sourceIndexes, status, tr) {
     return (0, _analytics2.withEditorAnalyticsAPI)(function (_ref) {
+      var _sourceIndexes$length;
       var selection = _ref.selection;
       var _getSelectedTableInfo = (0, _utils2.getSelectedTableInfo)(selection),
         totalRowCount = _getSelectedTableInfo.totalRowCount,
@@ -23,8 +26,7 @@ var clearDropTargetWithAnalytics = exports.clearDropTargetWithAnalytics = functi
         actionSubjectId: null,
         attributes: {
           inputMethod: inputMethod,
-          // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-          count: 1,
+          count: (_sourceIndexes$length = sourceIndexes === null || sourceIndexes === void 0 ? void 0 : sourceIndexes.length) !== null && _sourceIndexes$length !== void 0 ? _sourceIndexes$length : 0,
           distance: 0,
           status: status,
           totalRowCount: totalRowCount,
@@ -41,7 +43,7 @@ var clearDropTargetWithAnalytics = exports.clearDropTargetWithAnalytics = functi
   };
 };
 var moveSourceWithAnalytics = exports.moveSourceWithAnalytics = function moveSourceWithAnalytics(editorAnalyticsAPI) {
-  return function (inputMethod, sourceType, sourceIndex, targetIndex, tr) {
+  return function (inputMethod, sourceType, sourceIndexes, targetIndex, tr) {
     return (0, _analytics2.withEditorAnalyticsAPI)(function (_ref2) {
       var selection = _ref2.selection;
       var _getSelectedTableInfo2 = (0, _utils2.getSelectedTableInfo)(selection),
@@ -53,12 +55,14 @@ var moveSourceWithAnalytics = exports.moveSourceWithAnalytics = function moveSou
         actionSubjectId: null,
         attributes: {
           inputMethod: inputMethod,
-          // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-          count: 1,
-          // This identifies the total amount of row/cols the move operation covered
-          distance: targetIndex - sourceIndex,
+          count: sourceIndexes.length,
+          // This identifies the total amount of row/cols the move operation covered. The distance covered should be a representaion
+          // of the minimum distance. This will account for large selection being moved causing a large distance travelled value.
+          distance: Math.min.apply(Math, (0, _toConsumableArray2.default)(sourceIndexes.map(function (v) {
+            return targetIndex - v;
+          }))),
           // If a drop doesn't actually change anything then we're going to mark the event as cancelled.
-          status: sourceIndex === targetIndex ? _analytics.TABLE_STATUS.CANCELLED : _analytics.TABLE_STATUS.SUCCESS,
+          status: sourceIndexes.includes(targetIndex) ? _analytics.TABLE_STATUS.CANCELLED : _analytics.TABLE_STATUS.SUCCESS,
           totalRowCount: totalRowCount,
           totalColumnCount: totalColumnCount
         },
@@ -66,7 +70,7 @@ var moveSourceWithAnalytics = exports.moveSourceWithAnalytics = function moveSou
       };
     })(editorAnalyticsAPI)(function (state, dispatch) {
       if (dispatch) {
-        (0, _commands.moveSource)(sourceType, sourceIndex, targetIndex, tr)(state, dispatch);
+        (0, _commands.moveSource)(sourceType, sourceIndexes, targetIndex, tr)(state, dispatch);
       }
       return true;
     });
@@ -84,7 +88,7 @@ var moveSourceWithAnalyticsViaShortcut = exports.moveSourceWithAnalyticsViaShort
       var isRow = sourceType === 'table-row';
       var selectedIndexes = isRow ? (0, _utils2.getSelectedRowIndexes)(selectionRect) : (0, _utils2.getSelectedColumnIndexes)(selectionRect);
 
-      // We can move if only one row/column selected
+      // FIXME: We can move if only one row/column selected
       if (selectedIndexes.length === 0 || selectedIndexes.length > 1) {
         return false;
       }
@@ -111,7 +115,7 @@ var moveSourceWithAnalyticsViaShortcut = exports.moveSourceWithAnalyticsViaShort
       if (hasMergedCellsInTarget) {
         return false;
       }
-      return moveSourceWithAnalytics(editorAnalyticsAPI)(_analytics.INPUT_METHOD.SHORTCUT, sourceType, sourceIndex, targetIndex)(state, dispatch);
+      return moveSourceWithAnalytics(editorAnalyticsAPI)(_analytics.INPUT_METHOD.SHORTCUT, sourceType, [sourceIndex], targetIndex)(state, dispatch);
     };
   };
 };

package/dist/cjs/pm-plugins/drag-and-drop/commands.js

@@ -66,7 +66,7 @@ var clearDropTarget = exports.clearDropTarget = function clearDropTarget(tr) {
     return (tr || originalTr).setMeta('addToHistory', false);
   });
 };
-var moveSource = exports.moveSource = function moveSource(sourceType, sourceIndex, targetIndex, tr) {
+var moveSource = exports.moveSource = function moveSource(sourceType, sourceIndexes, targetIndex, tr) {
   return (0, _pluginFactory.createCommand)(function (state) {
     return {
       type: _actions.DragAndDropActionType.CLEAR_DROP_TARGET,
@@ -74,9 +74,9 @@ var moveSource = exports.moveSource = function moveSource(sourceType, sourceInde
         decorationSet: _view.DecorationSet.empty
       }
     };
-  }, function (originalTr) {
+  }, function (originalTr, state) {
     var nextTr = tr || originalTr;
-    if (sourceIndex === targetIndex) {
+    if (sourceIndexes.includes(targetIndex)) {
       return nextTr.setMeta('addToHistory', false);
     }
     var anchor = nextTr.selection.anchor;
@@ -85,9 +85,9 @@ var moveSource = exports.moveSource = function moveSource(sourceType, sourceInde
     };
     var isTableRow = sourceType === 'table-row';
     if (isTableRow) {
-      return (0, _transforms.combineTransforms)([(0, _utils.moveRow)(sourceIndex, targetIndex), selectStartOfTable, (0, _utils.selectRow)(targetIndex)], nextTr);
+      return (0, _transforms.combineTransforms)([(0, _utils.moveRow)(state, sourceIndexes, targetIndex), selectStartOfTable, (0, _utils.selectRow)(targetIndex)], nextTr);
     }
-    return (0, _transforms.combineTransforms)([(0, _utils.moveColumn)(sourceIndex, targetIndex), selectStartOfTable, (0, _utils.selectColumn)(targetIndex)], nextTr);
+    return (0, _transforms.combineTransforms)([(0, _utils.moveColumn)(sourceIndexes, targetIndex), selectStartOfTable, (0, _utils.selectColumn)(targetIndex)], nextTr);
   });
 };
 var toggleDragMenu = exports.toggleDragMenu = function toggleDragMenu(isDragMenuOpen, direction, index) {

package/dist/cjs/pm-plugins/drag-and-drop/plugin.js

@@ -6,7 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createPlugin = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _view = require("@atlaskit/editor-prosemirror/view");
@@ -126,7 +125,8 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI) {
         // If we're able to determine the source type of the dropped element then we should report to analytics that
         // the drop event was cancelled. Otherwise we will cancel silently.
         if ((event === null || event === void 0 || (_event$source = event.source) === null || _event$source === void 0 || (_event$source = _event$source.data) === null || _event$source === void 0 ? void 0 : _event$source.type) === 'table-row' || (event === null || event === void 0 || (_event$source2 = event.source) === null || _event$source2 === void 0 || (_event$source2 = _event$source2.data) === null || _event$source2 === void 0 ? void 0 : _event$source2.type) === 'table-column') {
-          return (0, _commandsWithAnalytics.clearDropTargetWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, _analytics.TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
+          var _event$source$data;
+          return (0, _commandsWithAnalytics.clearDropTargetWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, (_event$source$data = event.source.data) === null || _event$source$data === void 0 ? void 0 : _event$source$data.indexes, _analytics.TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
         }
         return (0, _commands.clearDropTarget)(tr)(editorView.state, editorView.dispatch);
       }
@@ -145,15 +145,13 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI) {
 
       // If the drop target index contains merged cells then we should not allow the drop to occur.
       if ((0, _utils2.hasMergedCellsInBetween)([targetAdjustedIndex - 1, targetAdjustedIndex], sourceType === 'table-row' ? _consts.DropTargetType.ROW : _consts.DropTargetType.COLUMN)(editorView.state.selection)) {
-        (0, _commandsWithAnalytics.clearDropTargetWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.DRAG_AND_DROP, sourceType,
+        (0, _commandsWithAnalytics.clearDropTargetWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes,
         // This event is mrked as invalid because the user is attempting to drop an element in an area which has merged cells.
         _analytics.TABLE_STATUS.INVALID, tr)(editorView.state, editorView.dispatch);
         return;
       }
-      var _sourceIndexes = (0, _slicedToArray2.default)(sourceIndexes, 1),
-        sourceIndex = _sourceIndexes[0];
       requestAnimationFrame(function () {
-        (0, _commandsWithAnalytics.moveSourceWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndex, targetAdjustedIndex + (direction === -1 ? 0 : -1), tr)(editorView.state, editorView.dispatch);
+        (0, _commandsWithAnalytics.moveSourceWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes, targetAdjustedIndex + (direction === -1 ? 0 : -1), tr)(editorView.state, editorView.dispatch);
 
         // force a colgroup update here, otherwise dropped columns don't have
         // the correct width immediately after the drop

package/dist/cjs/utils/drag-menu.js

@@ -183,7 +183,7 @@ var getDragMenuConfig = exports.getDragMenuConfig = function getDragMenuConfig(d
       onClick: function onClick(state, dispatch) {
         if (canMove(index)) {
           requestAnimationFrame(function () {
-            (0, _commandsWithAnalytics.moveSourceWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, "table-".concat(direction), index, index + offset)(editorView.state, editorView.dispatch);
+            (0, _commandsWithAnalytics.moveSourceWithAnalytics)(editorAnalyticsAPI)(_analytics.INPUT_METHOD.TABLE_CONTEXT_MENU, "table-".concat(direction), [index], index + offset)(editorView.state, editorView.dispatch);
           });
           return true;
         }

package/dist/es2019/pm-plugins/drag-and-drop/commands-with-analytics.js

@@ -4,10 +4,11 @@ import { findCellRectClosestToPos, getSelectionRect } from '@atlaskit/editor-tab
 import { getSelectedColumnIndexes, getSelectedRowIndexes, getSelectedTableInfo, hasMergedCellsInColumn, hasMergedCellsInRow } from '../../utils';
 import { withEditorAnalyticsAPI } from '../../utils/analytics';
 import { clearDropTarget, moveSource } from './commands';
-export const clearDropTargetWithAnalytics = editorAnalyticsAPI => (inputMethod, sourceType, status, tr) => {
+export const clearDropTargetWithAnalytics = editorAnalyticsAPI => (inputMethod, sourceType, sourceIndexes, status, tr) => {
   return withEditorAnalyticsAPI(({
     selection
   }) => {
+    var _sourceIndexes$length;
     const {
       totalRowCount,
       totalColumnCount
@@ -18,8 +19,7 @@ export const clearDropTargetWithAnalytics = editorAnalyticsAPI => (inputMethod,
       actionSubjectId: null,
       attributes: {
         inputMethod,
-        // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-        count: 1,
+        count: (_sourceIndexes$length = sourceIndexes === null || sourceIndexes === void 0 ? void 0 : sourceIndexes.length) !== null && _sourceIndexes$length !== void 0 ? _sourceIndexes$length : 0,
         distance: 0,
         status,
         totalRowCount,
@@ -34,7 +34,7 @@ export const clearDropTargetWithAnalytics = editorAnalyticsAPI => (inputMethod,
     return true;
   });
 };
-export const moveSourceWithAnalytics = editorAnalyticsAPI => (inputMethod, sourceType, sourceIndex, targetIndex, tr) => {
+export const moveSourceWithAnalytics = editorAnalyticsAPI => (inputMethod, sourceType, sourceIndexes, targetIndex, tr) => {
   return withEditorAnalyticsAPI(({
     selection
   }) => {
@@ -48,12 +48,12 @@ export const moveSourceWithAnalytics = editorAnalyticsAPI => (inputMethod, sourc
       actionSubjectId: null,
       attributes: {
         inputMethod,
-        // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-        count: 1,
-        // This identifies the total amount of row/cols the move operation covered
-        distance: targetIndex - sourceIndex,
+        count: sourceIndexes.length,
+        // This identifies the total amount of row/cols the move operation covered. The distance covered should be a representaion
+        // of the minimum distance. This will account for large selection being moved causing a large distance travelled value.
+        distance: Math.min(...sourceIndexes.map(v => targetIndex - v)),
         // If a drop doesn't actually change anything then we're going to mark the event as cancelled.
-        status: sourceIndex === targetIndex ? TABLE_STATUS.CANCELLED : TABLE_STATUS.SUCCESS,
+        status: sourceIndexes.includes(targetIndex) ? TABLE_STATUS.CANCELLED : TABLE_STATUS.SUCCESS,
         totalRowCount,
         totalColumnCount
       },
@@ -61,7 +61,7 @@ export const moveSourceWithAnalytics = editorAnalyticsAPI => (inputMethod, sourc
     };
   })(editorAnalyticsAPI)((state, dispatch) => {
     if (dispatch) {
-      moveSource(sourceType, sourceIndex, targetIndex, tr)(state, dispatch);
+      moveSource(sourceType, sourceIndexes, targetIndex, tr)(state, dispatch);
     }
     return true;
   });
@@ -78,7 +78,7 @@ export const moveSourceWithAnalyticsViaShortcut = editorAnalyticsAPI => (sourceT
   const isRow = sourceType === 'table-row';
   const selectedIndexes = isRow ? getSelectedRowIndexes(selectionRect) : getSelectedColumnIndexes(selectionRect);
 
-  // We can move if only one row/column selected
+  // FIXME: We can move if only one row/column selected
   if (selectedIndexes.length === 0 || selectedIndexes.length > 1) {
     return false;
   }
@@ -106,5 +106,5 @@ export const moveSourceWithAnalyticsViaShortcut = editorAnalyticsAPI => (sourceT
   if (hasMergedCellsInTarget) {
     return false;
   }
-  return moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.SHORTCUT, sourceType, sourceIndex, targetIndex)(state, dispatch);
+  return moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.SHORTCUT, sourceType, [sourceIndex], targetIndex)(state, dispatch);
 };

package/dist/es2019/pm-plugins/drag-and-drop/commands.js

@@ -53,25 +53,25 @@ export const clearDropTarget = tr => createCommand(state => {
     }
   };
 }, originalTr => (tr || originalTr).setMeta('addToHistory', false));
-export const moveSource = (sourceType, sourceIndex, targetIndex, tr) => createCommand(state => {
+export const moveSource = (sourceType, sourceIndexes, targetIndex, tr) => createCommand(state => {
   return {
     type: DragAndDropActionType.CLEAR_DROP_TARGET,
     data: {
       decorationSet: DecorationSet.empty
     }
   };
-}, originalTr => {
+}, (originalTr, state) => {
   const nextTr = tr || originalTr;
-  if (sourceIndex === targetIndex) {
+  if (sourceIndexes.includes(targetIndex)) {
     return nextTr.setMeta('addToHistory', false);
   }
   const anchor = nextTr.selection.anchor;
   const selectStartOfTable = newTr => newTr.setSelection(TextSelection.create(newTr.doc, anchor));
   const isTableRow = sourceType === 'table-row';
   if (isTableRow) {
-    return combineTransforms([moveRow(sourceIndex, targetIndex), selectStartOfTable, selectRow(targetIndex)], nextTr);
+    return combineTransforms([moveRow(state, sourceIndexes, targetIndex), selectStartOfTable, selectRow(targetIndex)], nextTr);
   }
-  return combineTransforms([moveColumn(sourceIndex, targetIndex), selectStartOfTable, selectColumn(targetIndex)], nextTr);
+  return combineTransforms([moveColumn(sourceIndexes, targetIndex), selectStartOfTable, selectColumn(targetIndex)], nextTr);
 });
 export const toggleDragMenu = (isDragMenuOpen, direction, index) => createCommand(state => {
   let {

package/dist/es2019/pm-plugins/drag-and-drop/plugin.js

@@ -126,7 +126,8 @@ const destroyFn = (editorView, editorAnalyticsAPI) => {
         // If we're able to determine the source type of the dropped element then we should report to analytics that
         // the drop event was cancelled. Otherwise we will cancel silently.
         if ((event === null || event === void 0 ? void 0 : (_event$source = event.source) === null || _event$source === void 0 ? void 0 : (_event$source$data = _event$source.data) === null || _event$source$data === void 0 ? void 0 : _event$source$data.type) === 'table-row' || (event === null || event === void 0 ? void 0 : (_event$source2 = event.source) === null || _event$source2 === void 0 ? void 0 : (_event$source2$data = _event$source2.data) === null || _event$source2$data === void 0 ? void 0 : _event$source2$data.type) === 'table-column') {
-          return clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
+          var _event$source$data2;
+          return clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, (_event$source$data2 = event.source.data) === null || _event$source$data2 === void 0 ? void 0 : _event$source$data2.indexes, TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
         }
         return clearDropTarget(tr)(editorView.state, editorView.dispatch);
       }
@@ -147,14 +148,13 @@ const destroyFn = (editorView, editorAnalyticsAPI) => {
 
       // If the drop target index contains merged cells then we should not allow the drop to occur.
       if (hasMergedCellsInBetween([targetAdjustedIndex - 1, targetAdjustedIndex], sourceType === 'table-row' ? DropTargetType.ROW : DropTargetType.COLUMN)(editorView.state.selection)) {
-        clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType,
+        clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes,
         // This event is mrked as invalid because the user is attempting to drop an element in an area which has merged cells.
         TABLE_STATUS.INVALID, tr)(editorView.state, editorView.dispatch);
         return;
       }
-      const [sourceIndex] = sourceIndexes;
       requestAnimationFrame(() => {
-        moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndex, targetAdjustedIndex + (direction === -1 ? 0 : -1), tr)(editorView.state, editorView.dispatch);
+        moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes, targetAdjustedIndex + (direction === -1 ? 0 : -1), tr)(editorView.state, editorView.dispatch);
 
         // force a colgroup update here, otherwise dropped columns don't have
         // the correct width immediately after the drop

package/dist/es2019/utils/drag-menu.js

@@ -166,7 +166,7 @@ export const getDragMenuConfig = (direction, getEditorContainerWidth, canDrag, h
     onClick: (state, dispatch) => {
       if (canMove(index)) {
         requestAnimationFrame(() => {
-          moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, `table-${direction}`, index, index + offset)(editorView.state, editorView.dispatch);
+          moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, `table-${direction}`, [index], index + offset)(editorView.state, editorView.dispatch);
         });
         return true;
       }

package/dist/esm/pm-plugins/drag-and-drop/commands-with-analytics.js

@@ -1,3 +1,4 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { ACTION_SUBJECT, EVENT_TYPE, INPUT_METHOD, TABLE_ACTION, TABLE_STATUS } from '@atlaskit/editor-common/analytics';
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { findCellRectClosestToPos, getSelectionRect } from '@atlaskit/editor-tables/utils';
@@ -5,8 +6,9 @@ import { getSelectedColumnIndexes, getSelectedRowIndexes, getSelectedTableInfo,
 import { withEditorAnalyticsAPI } from '../../utils/analytics';
 import { clearDropTarget, moveSource } from './commands';
 export var clearDropTargetWithAnalytics = function clearDropTargetWithAnalytics(editorAnalyticsAPI) {
-  return function (inputMethod, sourceType, status, tr) {
+  return function (inputMethod, sourceType, sourceIndexes, status, tr) {
     return withEditorAnalyticsAPI(function (_ref) {
+      var _sourceIndexes$length;
       var selection = _ref.selection;
       var _getSelectedTableInfo = getSelectedTableInfo(selection),
         totalRowCount = _getSelectedTableInfo.totalRowCount,
@@ -17,8 +19,7 @@ export var clearDropTargetWithAnalytics = function clearDropTargetWithAnalytics(
         actionSubjectId: null,
         attributes: {
           inputMethod: inputMethod,
-          // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-          count: 1,
+          count: (_sourceIndexes$length = sourceIndexes === null || sourceIndexes === void 0 ? void 0 : sourceIndexes.length) !== null && _sourceIndexes$length !== void 0 ? _sourceIndexes$length : 0,
           distance: 0,
           status: status,
           totalRowCount: totalRowCount,
@@ -35,7 +36,7 @@ export var clearDropTargetWithAnalytics = function clearDropTargetWithAnalytics(
   };
 };
 export var moveSourceWithAnalytics = function moveSourceWithAnalytics(editorAnalyticsAPI) {
-  return function (inputMethod, sourceType, sourceIndex, targetIndex, tr) {
+  return function (inputMethod, sourceType, sourceIndexes, targetIndex, tr) {
     return withEditorAnalyticsAPI(function (_ref2) {
       var selection = _ref2.selection;
       var _getSelectedTableInfo2 = getSelectedTableInfo(selection),
@@ -47,12 +48,14 @@ export var moveSourceWithAnalytics = function moveSourceWithAnalytics(editorAnal
         actionSubjectId: null,
         attributes: {
           inputMethod: inputMethod,
-          // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-          count: 1,
-          // This identifies the total amount of row/cols the move operation covered
-          distance: targetIndex - sourceIndex,
+          count: sourceIndexes.length,
+          // This identifies the total amount of row/cols the move operation covered. The distance covered should be a representaion
+          // of the minimum distance. This will account for large selection being moved causing a large distance travelled value.
+          distance: Math.min.apply(Math, _toConsumableArray(sourceIndexes.map(function (v) {
+            return targetIndex - v;
+          }))),
           // If a drop doesn't actually change anything then we're going to mark the event as cancelled.
-          status: sourceIndex === targetIndex ? TABLE_STATUS.CANCELLED : TABLE_STATUS.SUCCESS,
+          status: sourceIndexes.includes(targetIndex) ? TABLE_STATUS.CANCELLED : TABLE_STATUS.SUCCESS,
           totalRowCount: totalRowCount,
           totalColumnCount: totalColumnCount
         },
@@ -60,7 +63,7 @@ export var moveSourceWithAnalytics = function moveSourceWithAnalytics(editorAnal
       };
     })(editorAnalyticsAPI)(function (state, dispatch) {
       if (dispatch) {
-        moveSource(sourceType, sourceIndex, targetIndex, tr)(state, dispatch);
+        moveSource(sourceType, sourceIndexes, targetIndex, tr)(state, dispatch);
       }
       return true;
     });
@@ -78,7 +81,7 @@ export var moveSourceWithAnalyticsViaShortcut = function moveSourceWithAnalytics
       var isRow = sourceType === 'table-row';
       var selectedIndexes = isRow ? getSelectedRowIndexes(selectionRect) : getSelectedColumnIndexes(selectionRect);
 
-      // We can move if only one row/column selected
+      // FIXME: We can move if only one row/column selected
       if (selectedIndexes.length === 0 || selectedIndexes.length > 1) {
         return false;
       }
@@ -105,7 +108,7 @@ export var moveSourceWithAnalyticsViaShortcut = function moveSourceWithAnalytics
       if (hasMergedCellsInTarget) {
         return false;
       }
-      return moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.SHORTCUT, sourceType, sourceIndex, targetIndex)(state, dispatch);
+      return moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.SHORTCUT, sourceType, [sourceIndex], targetIndex)(state, dispatch);
     };
   };
 };

package/dist/esm/pm-plugins/drag-and-drop/commands.js

@@ -61,7 +61,7 @@ export var clearDropTarget = function clearDropTarget(tr) {
     return (tr || originalTr).setMeta('addToHistory', false);
   });
 };
-export var moveSource = function moveSource(sourceType, sourceIndex, targetIndex, tr) {
+export var moveSource = function moveSource(sourceType, sourceIndexes, targetIndex, tr) {
   return createCommand(function (state) {
     return {
       type: DragAndDropActionType.CLEAR_DROP_TARGET,
@@ -69,9 +69,9 @@ export var moveSource = function moveSource(sourceType, sourceIndex, targetIndex
         decorationSet: DecorationSet.empty
       }
     };
-  }, function (originalTr) {
+  }, function (originalTr, state) {
     var nextTr = tr || originalTr;
-    if (sourceIndex === targetIndex) {
+    if (sourceIndexes.includes(targetIndex)) {
       return nextTr.setMeta('addToHistory', false);
     }
     var anchor = nextTr.selection.anchor;
@@ -80,9 +80,9 @@ export var moveSource = function moveSource(sourceType, sourceIndex, targetIndex
     };
     var isTableRow = sourceType === 'table-row';
     if (isTableRow) {
-      return combineTransforms([moveRow(sourceIndex, targetIndex), selectStartOfTable, selectRow(targetIndex)], nextTr);
+      return combineTransforms([moveRow(state, sourceIndexes, targetIndex), selectStartOfTable, selectRow(targetIndex)], nextTr);
     }
-    return combineTransforms([moveColumn(sourceIndex, targetIndex), selectStartOfTable, selectColumn(targetIndex)], nextTr);
+    return combineTransforms([moveColumn(sourceIndexes, targetIndex), selectStartOfTable, selectColumn(targetIndex)], nextTr);
   });
 };
 export var toggleDragMenu = function toggleDragMenu(isDragMenuOpen, direction, index) {

package/dist/esm/pm-plugins/drag-and-drop/plugin.js

@@ -1,5 +1,4 @@
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { INPUT_METHOD, TABLE_STATUS } from '@atlaskit/editor-common/analytics';
@@ -119,7 +118,8 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI) {
         // If we're able to determine the source type of the dropped element then we should report to analytics that
         // the drop event was cancelled. Otherwise we will cancel silently.
         if ((event === null || event === void 0 || (_event$source = event.source) === null || _event$source === void 0 || (_event$source = _event$source.data) === null || _event$source === void 0 ? void 0 : _event$source.type) === 'table-row' || (event === null || event === void 0 || (_event$source2 = event.source) === null || _event$source2 === void 0 || (_event$source2 = _event$source2.data) === null || _event$source2 === void 0 ? void 0 : _event$source2.type) === 'table-column') {
-          return clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
+          var _event$source$data;
+          return clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, event.source.data.type, (_event$source$data = event.source.data) === null || _event$source$data === void 0 ? void 0 : _event$source$data.indexes, TABLE_STATUS.CANCELLED, tr)(editorView.state, editorView.dispatch);
         }
         return clearDropTarget(tr)(editorView.state, editorView.dispatch);
       }
@@ -138,15 +138,13 @@ var destroyFn = function destroyFn(editorView, editorAnalyticsAPI) {
 
       // If the drop target index contains merged cells then we should not allow the drop to occur.
       if (hasMergedCellsInBetween([targetAdjustedIndex - 1, targetAdjustedIndex], sourceType === 'table-row' ? DropTargetType.ROW : DropTargetType.COLUMN)(editorView.state.selection)) {
-        clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType,
+        clearDropTargetWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes,
         // This event is mrked as invalid because the user is attempting to drop an element in an area which has merged cells.
         TABLE_STATUS.INVALID, tr)(editorView.state, editorView.dispatch);
         return;
       }
-      var _sourceIndexes = _slicedToArray(sourceIndexes, 1),
-        sourceIndex = _sourceIndexes[0];
       requestAnimationFrame(function () {
-        moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndex, targetAdjustedIndex + (direction === -1 ? 0 : -1), tr)(editorView.state, editorView.dispatch);
+        moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.DRAG_AND_DROP, sourceType, sourceIndexes, targetAdjustedIndex + (direction === -1 ? 0 : -1), tr)(editorView.state, editorView.dispatch);
 
         // force a colgroup update here, otherwise dropped columns don't have
         // the correct width immediately after the drop

package/dist/esm/utils/drag-menu.js

@@ -176,7 +176,7 @@ export var getDragMenuConfig = function getDragMenuConfig(direction, getEditorCo
       onClick: function onClick(state, dispatch) {
         if (canMove(index)) {
           requestAnimationFrame(function () {
-            moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, "table-".concat(direction), index, index + offset)(editorView.state, editorView.dispatch);
+            moveSourceWithAnalytics(editorAnalyticsAPI)(INPUT_METHOD.TABLE_CONTEXT_MENU, "table-".concat(direction), [index], index + offset)(editorView.state, editorView.dispatch);
           });
           return true;
         }

package/dist/types/pm-plugins/drag-and-drop/commands-with-analytics.d.ts

@@ -3,6 +3,6 @@ import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command } from '@atlaskit/editor-common/types';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { DraggableData, DraggableType } from '../../types';
-export declare const clearDropTargetWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP, sourceType: DraggableType, status: TABLE_STATUS.CANCELLED | TABLE_STATUS.INVALID, tr?: Transaction) => Command;
-export declare const moveSourceWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP | INPUT_METHOD.SHORTCUT, sourceType: DraggableType, sourceIndex: number, targetIndex: number, tr?: Transaction) => Command;
+export declare const clearDropTargetWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP, sourceType: DraggableType, sourceIndexes: number[] | undefined, status: TABLE_STATUS.CANCELLED | TABLE_STATUS.INVALID, tr?: Transaction) => Command;
+export declare const moveSourceWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP | INPUT_METHOD.SHORTCUT, sourceType: DraggableType, sourceIndexes: number[], targetIndex: number, tr?: Transaction) => Command;
 export declare const moveSourceWithAnalyticsViaShortcut: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (sourceType: DraggableType, direction: DraggableData['direction']) => Command;

package/dist/types/pm-plugins/drag-and-drop/commands.d.ts

@@ -8,5 +8,5 @@ export declare const getDecorations: (state: EditorState) => DecorationSet;
 export declare const updatePluginStateDecorations: (state: EditorState, decorations: Decoration[], key: TableDecorations) => DecorationSet;
 export declare const setDropTarget: (type: DropTargetType, index: number, hasMergedCells: boolean, tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
 export declare const clearDropTarget: (tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
-export declare const moveSource: (sourceType: DraggableType, sourceIndex: number, targetIndex: number, tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
+export declare const moveSource: (sourceType: DraggableType, sourceIndexes: number[], targetIndex: number, tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
 export declare const toggleDragMenu: (isDragMenuOpen: boolean | undefined, direction?: TableDirection, index?: number) => import("@atlaskit/editor-common/types").Command;

package/dist/types-ts4.5/pm-plugins/drag-and-drop/commands-with-analytics.d.ts

@@ -3,6 +3,6 @@ import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command } from '@atlaskit/editor-common/types';
 import type { Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { DraggableData, DraggableType } from '../../types';
-export declare const clearDropTargetWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP, sourceType: DraggableType, status: TABLE_STATUS.CANCELLED | TABLE_STATUS.INVALID, tr?: Transaction) => Command;
-export declare const moveSourceWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP | INPUT_METHOD.SHORTCUT, sourceType: DraggableType, sourceIndex: number, targetIndex: number, tr?: Transaction) => Command;
+export declare const clearDropTargetWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP, sourceType: DraggableType, sourceIndexes: number[] | undefined, status: TABLE_STATUS.CANCELLED | TABLE_STATUS.INVALID, tr?: Transaction) => Command;
+export declare const moveSourceWithAnalytics: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP | INPUT_METHOD.SHORTCUT, sourceType: DraggableType, sourceIndexes: number[], targetIndex: number, tr?: Transaction) => Command;
 export declare const moveSourceWithAnalyticsViaShortcut: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined | null) => (sourceType: DraggableType, direction: DraggableData['direction']) => Command;

package/dist/types-ts4.5/pm-plugins/drag-and-drop/commands.d.ts

@@ -8,5 +8,5 @@ export declare const getDecorations: (state: EditorState) => DecorationSet;
 export declare const updatePluginStateDecorations: (state: EditorState, decorations: Decoration[], key: TableDecorations) => DecorationSet;
 export declare const setDropTarget: (type: DropTargetType, index: number, hasMergedCells: boolean, tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
 export declare const clearDropTarget: (tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
-export declare const moveSource: (sourceType: DraggableType, sourceIndex: number, targetIndex: number, tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
+export declare const moveSource: (sourceType: DraggableType, sourceIndexes: number[], targetIndex: number, tr?: Transaction) => import("@atlaskit/editor-common/types").Command;
 export declare const toggleDragMenu: (isDragMenuOpen: boolean | undefined, direction?: TableDirection, index?: number) => import("@atlaskit/editor-common/types").Command;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-table",
-  "version": "6.0.0",
+  "version": "6.1.0",
   "description": "Table plugin for the @atlaskit/editor",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -30,7 +30,7 @@
   "dependencies": {
     "@atlaskit/adf-schema": "^35.3.0",
     "@atlaskit/custom-steps": "^0.0.11",
-    "@atlaskit/editor-common": "^76.40.0",
+    "@atlaskit/editor-common": "^76.41.0",
     "@atlaskit/editor-palette": "1.5.2",
     "@atlaskit/editor-plugin-analytics": "^0.4.0",
     "@atlaskit/editor-plugin-content-insertion": "^0.1.0",
@@ -39,16 +39,16 @@
     "@atlaskit/editor-plugin-width": "^0.2.0",
     "@atlaskit/editor-prosemirror": "1.1.0",
     "@atlaskit/editor-shared-styles": "^2.9.0",
-    "@atlaskit/editor-tables": "^2.3.0",
+    "@atlaskit/editor-tables": "^2.4.0",
     "@atlaskit/icon": "^22.0.0",
     "@atlaskit/platform-feature-flags": "^0.2.1",
     "@atlaskit/pragmatic-drag-and-drop": "^0.25.0",
     "@atlaskit/pragmatic-drag-and-drop-auto-scroll": "^0.8.0",
     "@atlaskit/pragmatic-drag-and-drop-hitbox": "^0.12.0",
-    "@atlaskit/primitives": "^1.17.0",
+    "@atlaskit/primitives": "^1.18.0",
     "@atlaskit/theme": "^12.6.0",
     "@atlaskit/toggle": "^13.0.0",
-    "@atlaskit/tokens": "^1.33.0",
+    "@atlaskit/tokens": "^1.34.0",
     "@atlaskit/tooltip": "^18.1.0",
     "@babel/runtime": "^7.0.0",
     "@emotion/react": "^11.7.1",

package/src/__tests__/unit/analytics.ts

@@ -751,24 +751,59 @@ describe('Table analytic events', () => {
 
   describe('track moved', () => {
     it.each([
-      ['Column', INPUT_METHOD.TABLE_CONTEXT_MENU, 0, 1, TABLE_STATUS.SUCCESS],
-      ['Column', INPUT_METHOD.TABLE_CONTEXT_MENU, 2, 0, TABLE_STATUS.SUCCESS],
-      ['Column', INPUT_METHOD.TABLE_CONTEXT_MENU, 2, 2, TABLE_STATUS.CANCELLED],
-
-      ['Row', INPUT_METHOD.TABLE_CONTEXT_MENU, 0, 1, TABLE_STATUS.SUCCESS],
-      ['Row', INPUT_METHOD.TABLE_CONTEXT_MENU, 2, 0, TABLE_STATUS.SUCCESS],
-      ['Row', INPUT_METHOD.TABLE_CONTEXT_MENU, 2, 2, TABLE_STATUS.CANCELLED],
-
-      ['Column', INPUT_METHOD.DRAG_AND_DROP, 0, 1, TABLE_STATUS.SUCCESS],
-      ['Column', INPUT_METHOD.DRAG_AND_DROP, 2, 0, TABLE_STATUS.SUCCESS],
-      ['Column', INPUT_METHOD.DRAG_AND_DROP, 2, 2, TABLE_STATUS.CANCELLED],
-
-      ['Row', INPUT_METHOD.DRAG_AND_DROP, 0, 1, TABLE_STATUS.SUCCESS],
-      ['Row', INPUT_METHOD.DRAG_AND_DROP, 2, 0, TABLE_STATUS.SUCCESS],
-      ['Row', INPUT_METHOD.DRAG_AND_DROP, 2, 2, TABLE_STATUS.CANCELLED],
+      [
+        'Column',
+        INPUT_METHOD.TABLE_CONTEXT_MENU,
+        [0],
+        1,
+        TABLE_STATUS.SUCCESS,
+        1,
+      ],
+      [
+        'Column',
+        INPUT_METHOD.TABLE_CONTEXT_MENU,
+        [2],
+        0,
+        TABLE_STATUS.SUCCESS,
+        -2,
+      ],
+      [
+        'Column',
+        INPUT_METHOD.TABLE_CONTEXT_MENU,
+        [2],
+        2,
+        TABLE_STATUS.CANCELLED,
+        0,
+      ],
+
+      ['Row', INPUT_METHOD.TABLE_CONTEXT_MENU, [0], 1, TABLE_STATUS.SUCCESS, 1],
+      [
+        'Row',
+        INPUT_METHOD.TABLE_CONTEXT_MENU,
+        [2],
+        0,
+        TABLE_STATUS.SUCCESS,
+        -2,
+      ],
+      [
+        'Row',
+        INPUT_METHOD.TABLE_CONTEXT_MENU,
+        [2],
+        2,
+        TABLE_STATUS.CANCELLED,
+        0,
+      ],
+
+      ['Column', INPUT_METHOD.DRAG_AND_DROP, [0], 1, TABLE_STATUS.SUCCESS, 1],
+      ['Column', INPUT_METHOD.DRAG_AND_DROP, [2], 0, TABLE_STATUS.SUCCESS, -2],
+      ['Column', INPUT_METHOD.DRAG_AND_DROP, [2], 2, TABLE_STATUS.CANCELLED, 0],
+
+      ['Row', INPUT_METHOD.DRAG_AND_DROP, [0], 1, TABLE_STATUS.SUCCESS, 1],
+      ['Row', INPUT_METHOD.DRAG_AND_DROP, [2], 0, TABLE_STATUS.SUCCESS, -2],
+      ['Row', INPUT_METHOD.DRAG_AND_DROP, [2], 2, TABLE_STATUS.CANCELLED, 0],
     ])(
       'should fire v3 analytics for %s using input %s moving index from %i to %i with status %s',
-      (type, inputMethod, sourceIndex, targetIndex, status) => {
+      (type, inputMethod, sourceIndex, targetIndex, status, distance) => {
         const { editorView } = editor(defaultTableDoc);
         moveSourceWithAnalytics(editorAnalyticsAPIFake)(
           inputMethod as
@@ -786,7 +821,7 @@ describe('Table analytic events', () => {
           attributes: expect.objectContaining({
             inputMethod,
             count: 1,
-            distance: targetIndex - sourceIndex,
+            distance,
             status,
             totalRowCount: 3,
             totalColumnCount: 3,
@@ -828,6 +863,7 @@ describe('Table analytic events', () => {
               | INPUT_METHOD.TABLE_CONTEXT_MENU
               | INPUT_METHOD.DRAG_AND_DROP,
             type === 'Row' ? 'table-row' : 'table-column',
+            [0],
             status as TABLE_STATUS.CANCELLED | TABLE_STATUS.INVALID,
           )(editorView.state, editorView.dispatch);
 

package/src/__tests__/visual-regression/index.ts

@@ -42,7 +42,9 @@ describe('Snapshot Test: Table', () => {
   });
 
   describe('numbered list', () => {
-    it('should not overflow table cell, when there are more than 100 ordered list items', async () => {
+    // FIXME: Skipping this test as it is flaky
+    // Build link: https://bitbucket.org/atlassian/atlassian-frontend/pipelines/results/2289567
+    it.skip('should not overflow table cell, when there are more than 100 ordered list items', async () => {
       await initEditor(page, tableWith100ListItemsADF);
 
       // initial elements

package/src/pm-plugins/drag-and-drop/commands-with-analytics.ts

@@ -34,6 +34,7 @@ export const clearDropTargetWithAnalytics =
   (
     inputMethod: INPUT_METHOD.TABLE_CONTEXT_MENU | INPUT_METHOD.DRAG_AND_DROP,
     sourceType: DraggableType,
+    sourceIndexes: number[] | undefined,
     status: TABLE_STATUS.CANCELLED | TABLE_STATUS.INVALID,
     tr?: Transaction,
   ) => {
@@ -49,8 +50,7 @@ export const clearDropTargetWithAnalytics =
         actionSubjectId: null,
         attributes: {
           inputMethod,
-          // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-          count: 1,
+          count: sourceIndexes?.length ?? 0,
           distance: 0,
           status,
           totalRowCount,
@@ -74,7 +74,7 @@ export const moveSourceWithAnalytics =
       | INPUT_METHOD.DRAG_AND_DROP
       | INPUT_METHOD.SHORTCUT,
     sourceType: DraggableType,
-    sourceIndex: number,
+    sourceIndexes: number[],
     targetIndex: number,
     tr?: Transaction,
   ) => {
@@ -90,15 +90,14 @@ export const moveSourceWithAnalytics =
         actionSubjectId: null,
         attributes: {
           inputMethod,
-          // TODO: When multiple sources can be moved we need to update this count to be the amount of sources which are being moved.
-          count: 1,
-          // This identifies the total amount of row/cols the move operation covered
-          distance: targetIndex - sourceIndex,
+          count: sourceIndexes.length,
+          // This identifies the total amount of row/cols the move operation covered. The distance covered should be a representaion
+          // of the minimum distance. This will account for large selection being moved causing a large distance travelled value.
+          distance: Math.min(...sourceIndexes.map((v) => targetIndex - v)),
           // If a drop doesn't actually change anything then we're going to mark the event as cancelled.
-          status:
-            sourceIndex === targetIndex
-              ? TABLE_STATUS.CANCELLED
-              : TABLE_STATUS.SUCCESS,
+          status: sourceIndexes.includes(targetIndex)
+            ? TABLE_STATUS.CANCELLED
+            : TABLE_STATUS.SUCCESS,
           totalRowCount,
           totalColumnCount,
         },
@@ -106,7 +105,7 @@ export const moveSourceWithAnalytics =
       };
     })(editorAnalyticsAPI)((state, dispatch) => {
       if (dispatch) {
-        moveSource(sourceType, sourceIndex, targetIndex, tr)(state, dispatch);
+        moveSource(sourceType, sourceIndexes, targetIndex, tr)(state, dispatch);
       }
       return true;
     });
@@ -131,7 +130,7 @@ export const moveSourceWithAnalyticsViaShortcut =
       ? getSelectedRowIndexes(selectionRect)
       : getSelectedColumnIndexes(selectionRect);
 
-    // We can move if only one row/column selected
+    // FIXME: We can move if only one row/column selected
     if (selectedIndexes.length === 0 || selectedIndexes.length > 1) {
       return false;
     }
@@ -172,7 +171,7 @@ export const moveSourceWithAnalyticsViaShortcut =
     return moveSourceWithAnalytics(editorAnalyticsAPI)(
       INPUT_METHOD.SHORTCUT,
       sourceType,
-      sourceIndex,
+      [sourceIndex],
       targetIndex,
     )(state, dispatch);
   };

package/src/pm-plugins/drag-and-drop/commands.ts

@@ -100,7 +100,7 @@ export const clearDropTarget = (tr?: Transaction) =>
 
 export const moveSource = (
   sourceType: DraggableType,
-  sourceIndex: number,
+  sourceIndexes: number[],
   targetIndex: number,
   tr?: Transaction,
 ) =>
@@ -113,9 +113,9 @@ export const moveSource = (
         },
       };
     },
-    (originalTr: Transaction) => {
+    (originalTr: Transaction, state) => {
       const nextTr = tr || originalTr;
-      if (sourceIndex === targetIndex) {
+      if (sourceIndexes.includes(targetIndex)) {
         return nextTr.setMeta('addToHistory', false);
       }
 
@@ -124,11 +124,10 @@ export const moveSource = (
         newTr.setSelection(TextSelection.create(newTr.doc, anchor));
 
       const isTableRow = sourceType === 'table-row';
-
       if (isTableRow) {
         return combineTransforms(
           [
-            moveRow(sourceIndex, targetIndex),
+            moveRow(state, sourceIndexes, targetIndex),
             selectStartOfTable,
             selectRow(targetIndex),
           ],
@@ -138,7 +137,7 @@ export const moveSource = (
 
       return combineTransforms(
         [
-          moveColumn(sourceIndex, targetIndex),
+          moveColumn(sourceIndexes, targetIndex),
           selectStartOfTable,
           selectColumn(targetIndex),
         ],

package/src/pm-plugins/drag-and-drop/plugin.ts

@@ -163,6 +163,7 @@ const destroyFn = (editorView: EditorView, editorAnalyticsAPI: any) => {
             return clearDropTargetWithAnalytics(editorAnalyticsAPI)(
               INPUT_METHOD.DRAG_AND_DROP,
               event.source.data.type,
+              event.source.data?.indexes as number[] | undefined,
               TABLE_STATUS.CANCELLED,
               tr,
             )(editorView.state, editorView.dispatch);
@@ -197,6 +198,7 @@ const destroyFn = (editorView: EditorView, editorAnalyticsAPI: any) => {
           clearDropTargetWithAnalytics(editorAnalyticsAPI)(
             INPUT_METHOD.DRAG_AND_DROP,
             sourceType,
+            sourceIndexes,
             // This event is mrked as invalid because the user is attempting to drop an element in an area which has merged cells.
             TABLE_STATUS.INVALID,
             tr,
@@ -204,13 +206,11 @@ const destroyFn = (editorView: EditorView, editorAnalyticsAPI: any) => {
           return;
         }
 
-        const [sourceIndex] = sourceIndexes;
-
         requestAnimationFrame(() => {
           moveSourceWithAnalytics(editorAnalyticsAPI)(
             INPUT_METHOD.DRAG_AND_DROP,
             sourceType,
-            sourceIndex,
+            sourceIndexes,
             targetAdjustedIndex + (direction === -1 ? 0 : -1),
             tr,
           )(editorView.state, editorView.dispatch);

package/src/utils/drag-menu.ts

@@ -268,7 +268,7 @@ export const getDragMenuConfig = (
             moveSourceWithAnalytics(editorAnalyticsAPI)(
               INPUT_METHOD.TABLE_CONTEXT_MENU,
               `table-${direction}`,
-              index!,
+              [index!],
               index! + offset,
             )(editorView.state, editorView.dispatch);
           });