@atlaskit/editor-plugin-block-controls 2.26.4 → 2.27.1

package/CHANGELOG.md

@@ -1,5 +1,26 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 2.27.1
+
+### Patch Changes
+
+- [#112996](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/112996)
+  [`e76ab95452657`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/e76ab95452657) -
+  ED-26395: Added tests for canMoveSliceToIndex, and fix drop target showing when first node is p,
+  second node table, drop into panel
+
+## 2.27.0
+
+### Minor Changes
+
+- [#114097](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/114097)
+  [`c767c26ecbc7c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c767c26ecbc7c) -
+  [ux] [ED-26269] Support moving multiple nodes with shortcuts
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.26.4
 
 ### Patch Changes

package/dist/cjs/blockControlsPlugin.js

@@ -67,16 +67,22 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
           return tr;
         };
       },
-      setMultiSelectPositions: function setMultiSelectPositions() {
+      setMultiSelectPositions: function setMultiSelectPositions(anchor, head) {
         return function (_ref5) {
           var _api$selection;
           var tr = _ref5.tr;
           var _tr$selection = tr.selection,
             userAnchor = _tr$selection.anchor,
             userHead = _tr$selection.head;
-          var _expandSelectionBound = (0, _selection.expandSelectionBounds)(tr.selection.$anchor, tr.selection.$head),
-            expandedAnchor = _expandSelectionBound.$anchor,
-            expandedHead = _expandSelectionBound.$head;
+          var expandedAnchor, expandedHead;
+          if (anchor !== undefined && head !== undefined) {
+            expandedAnchor = tr.doc.resolve(anchor);
+            expandedHead = tr.doc.resolve(head);
+          } else {
+            var expandedSelection = (0, _selection.expandSelectionBounds)(tr.selection.$anchor, tr.selection.$head);
+            expandedAnchor = expandedSelection.$anchor;
+            expandedHead = expandedSelection.$head;
+          }
           api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 || _api$selection.commands.setManualSelection(expandedAnchor.pos, expandedHead.pos)({
             tr: tr
           });

package/dist/cjs/editor-commands/move-node.js

@@ -95,7 +95,18 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
     if (shouldEnableNestedDndA11y) {
       isParentNodeOfTypeLayout = !!(0, _utils2.findParentNodeOfType)([state.schema.nodes.layoutSection])(state.selection);
     }
-    var currentNodePos = getCurrentNodePos(state);
+    var isMultiSelectEnabled = (0, _experiments.editorExperiment)('platform_editor_element_drag_and_drop_multiselect', true);
+    var expandedAnchor, expandedHead;
+    var pluginState = api === null || api === void 0 ? void 0 : api.blockControls.sharedState.currentState();
+    if (pluginState !== null && pluginState !== void 0 && pluginState.multiSelectDnD) {
+      expandedAnchor = pluginState.multiSelectDnD.anchor;
+      expandedHead = pluginState.multiSelectDnD.head;
+    } else {
+      var expandedSelection = (0, _selection.expandSelectionBounds)(selection.$anchor, selection.$head);
+      expandedAnchor = expandedSelection.$anchor.pos;
+      expandedHead = expandedSelection.$head.pos;
+    }
+    var currentNodePos = isMultiSelectEnabled ? Math.min(expandedAnchor, expandedHead) : getCurrentNodePos(state);
     if (currentNodePos > -1) {
       var _state$doc$nodeAt;
       var $pos = state.doc.resolve(currentNodePos);
@@ -206,7 +217,7 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
         }
       } else {
         var _endOfDoc = $pos.end();
-        var nodeAfterPos = $pos.posAtIndex($pos.index() + 1);
+        var nodeAfterPos = isMultiSelectEnabled ? Math.max(expandedAnchor, expandedHead) : $pos.posAtIndex($pos.index() + 1);
         if (nodeAfterPos > _endOfDoc) {
           return false;
         }
@@ -228,6 +239,9 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
         var _api$core7;
         api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 || _api$core7.actions.execute(function (_ref4) {
           var tr = _ref4.tr;
+          api === null || api === void 0 || api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+            tr: tr
+          });
           moveNode(api)(currentNodePos, moveToPos, _analytics.INPUT_METHOD.SHORTCUT, formatMessage)({
             tr: tr
           });
@@ -235,7 +249,7 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
           return tr;
         });
         return true;
-      } else if (nodeType) {
+      } else if (nodeType && !isMultiSelectEnabled) {
         var _api$core8;
         // If the node is first/last one, only select the node
         api === null || api === void 0 || (_api$core8 = api.core) === null || _api$core8 === void 0 || _api$core8.actions.execute(function (_ref5) {
@@ -245,6 +259,17 @@ var moveNodeViaShortcut = exports.moveNodeViaShortcut = function moveNodeViaShor
           return tr;
         });
         return true;
+      } else if (isMultiSelectEnabled) {
+        var _api$core9;
+        api === null || api === void 0 || (_api$core9 = api.core) === null || _api$core9 === void 0 || _api$core9.actions.execute(function (_ref6) {
+          var tr = _ref6.tr;
+          api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+            tr: tr
+          });
+          tr.scrollIntoView();
+          return tr;
+        });
+        return true;
       }
     }
     return false;
@@ -254,8 +279,9 @@ var moveNode = exports.moveNode = function moveNode(api) {
   return function (start, to) {
     var inputMethod = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : _analytics.INPUT_METHOD.DRAG_AND_DROP;
     var formatMessage = arguments.length > 3 ? arguments[3] : undefined;
-    return function (_ref6) {
-      var tr = _ref6.tr;
+    return function (_ref7) {
+      var _api$blockControls$co;
+      var tr = _ref7.tr;
       if (!api) {
         return tr;
       }
@@ -327,10 +353,14 @@ var moveNode = exports.moveNode = function moveNode(api) {
         mappedTo = tr.mapping.map(to);
         tr.insert(mappedTo, _nodeCopy); // insert the content at the new position
       }
-      tr = inputMethod === _analytics.INPUT_METHOD.DRAG_AND_DROP ? (0, _getSelection.setCursorPositionAtMovedNode)(tr, mappedTo) : (0, _getSelection.selectNode)(tr, mappedTo, handleNode.type.name);
-      tr.setMeta(_main.key, {
+      var sliceSize = sliceTo - sliceFrom;
+      tr = inputMethod === _analytics.INPUT_METHOD.DRAG_AND_DROP ? (0, _getSelection.setCursorPositionAtMovedNode)(tr, mappedTo) : isMultiSelect ? (_api$blockControls$co = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
+        tr: tr
+      })) !== null && _api$blockControls$co !== void 0 ? _api$blockControls$co : tr : (0, _getSelection.selectNode)(tr, mappedTo, handleNode.type.name);
+      var currMeta = tr.getMeta(_main.key);
+      tr.setMeta(_main.key, _objectSpread(_objectSpread({}, currMeta), {}, {
         nodeMoved: true
-      });
+      }));
       api === null || api === void 0 || api.core.actions.focus();
       var $mappedTo = tr.doc.resolve(mappedTo);
       var expandAncestor = (0, _utils2.findParentNodeOfTypeClosestToPos)($to, [expand, nestedExpand]);

package/dist/cjs/pm-plugins/decorations-drop-target.js

@@ -8,6 +8,7 @@ exports.findDropTargetDecs = exports.dropTargetDecorations = exports.createLayou
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = require("react");
 var _uuid = _interopRequireDefault(require("uuid"));
+var _selection = require("@atlaskit/editor-common/selection");
 var _utils = require("@atlaskit/editor-common/utils");
 var _view = require("@atlaskit/editor-prosemirror/view");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
@@ -166,6 +167,15 @@ var dropTargetDecorations = exports.dropTargetDecorations = function dropTargetD
     prevNodeStack.push(node);
   };
   var isAdvancedLayoutsPreRelease2 = (0, _experiments.editorExperiment)('advanced_layouts', true);
+
+  // For deciding to show drop targets or not when multiple nodes are selected
+  var selection = newState.selection;
+  var _expandSelectionBound = (0, _selection.expandSelectionBounds)(selection.$anchor, selection.$head),
+    expandedAnchor = _expandSelectionBound.$anchor,
+    expandedHead = _expandSelectionBound.$head;
+  var selectionFrom = Math.min(expandedAnchor.pos, expandedHead.pos);
+  var selectionTo = Math.max(expandedAnchor.pos, expandedHead.pos);
+  var handleInsideSelection = activeNodePos !== undefined && activeNodePos >= selectionFrom && activeNodePos <= selectionTo;
   newState.doc.nodesBetween(docFrom, docTo, function (node, pos, parent, index) {
     var depth = 0;
     // drop target deco at the end position
@@ -200,10 +210,6 @@ var dropTargetDecorations = exports.dropTargetDecorations = function dropTargetD
 
       // When multi select is on, validate all the nodes in the selection instead of just the handle node
       if (isMultiSelect) {
-        var selection = newState.selection;
-        var selectionFrom = selection.$from.pos;
-        var selectionTo = selection.$to.pos;
-        var handleInsideSelection = activeNodePos !== undefined && activeNodePos >= selectionFrom - 1 && activeNodePos <= selectionTo;
         var selectionSlice = newState.doc.slice(selectionFrom, selectionTo, false);
         var selectionSliceChildCount = selectionSlice.content.childCount;
         var canDropSingleNode = true;
@@ -211,7 +217,7 @@ var dropTargetDecorations = exports.dropTargetDecorations = function dropTargetD
 
         // when there is only one node in the slice, use the same logic as when multi select is not on
         if (selectionSliceChildCount > 1 && handleInsideSelection) {
-          canDropMultipleNodes = (0, _validation.canMoveSliceToIndex)(selectionSlice, selectionFrom, newState.doc, parent, index, $pos);
+          canDropMultipleNodes = (0, _validation.canMoveSliceToIndex)(selectionSlice, selectionFrom, parent, index, $pos);
         } else {
           canDropSingleNode = !!(activePMNode && (0, _validation.canMoveNodeToIndex)(parent, index, activePMNode, $pos, node));
         }

package/dist/cjs/pm-plugins/main.js

@@ -189,7 +189,9 @@ var newApply = exports.newApply = function newApply(api, formatMessage, tr, curr
   var resizerMeta = tr.getMeta('is-resizer-resizing');
   isResizerResizing = resizerMeta !== null && resizerMeta !== void 0 ? resizerMeta : isResizerResizing;
   if (multiSelectDnD && flags.isMultiSelectEnabled) {
-    multiSelectDnD = (meta === null || meta === void 0 ? void 0 : meta.isDragging) === false ? undefined : multiSelectDnD;
+    multiSelectDnD = (meta === null || meta === void 0 ? void 0 : meta.isDragging) === false ||
+    // For move node with shortcut, only reset when the selection changes
+    tr.selection.anchor !== multiSelectDnD.textAnchor || tr.selection.head !== multiSelectDnD.textHead ? undefined : multiSelectDnD;
   }
   var _getTrMetadata = (0, _transactions.getTrMetadata)(tr),
     from = _getTrMetadata.from,

package/dist/cjs/pm-plugins/utils/getSelection.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.setCursorPositionAtMovedNode = exports.selectNode = exports.rootTaskListDepth = exports.rootListDepth = exports.isHandleInSelection = exports.getSelection = exports.getInlineNodePos = void 0;
+exports.setCursorPositionAtMovedNode = exports.selectNode = exports.rootTaskListDepth = exports.rootListDepth = exports.isHandleCorrelatedToSelection = exports.getSelection = exports.getInlineNodePos = void 0;
 var _selection = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
@@ -100,7 +100,7 @@ var setCursorPositionAtMovedNode = exports.setCursorPositionAtMovedNode = functi
  * @param handlePos
  * @returns
  */
-var isHandleInSelection = exports.isHandleInSelection = function isHandleInSelection(state, selection, handlePos) {
+var isHandleCorrelatedToSelection = exports.isHandleCorrelatedToSelection = function isHandleCorrelatedToSelection(state, selection, handlePos) {
   if (selection.empty) {
     return false;
   }

package/dist/cjs/pm-plugins/utils/selection.js

@@ -4,10 +4,13 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getSelectedSlicePosition = exports.getMultiSelectionIfPosInside = void 0;
-var getMultiSelectionIfPosInside = exports.getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(api, pos) {
-  var _api$blockControls;
-  var _ref = ((_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState()) || {},
-    multiSelectDnD = _ref.multiSelectDnD;
+var _main = require("../main");
+var getMultiSelectionIfPosInside = exports.getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(api, pos, tr) {
+  var _api$blockControls, _pluginState$multiSel, _tr$getMeta;
+  var pluginState = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState();
+  // With move nodes shortcut, we expand selection and move node within one transaction,
+  // Hence we also look for `multiSelectDnD` in transaction meta
+  var multiSelectDnD = (_pluginState$multiSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.multiSelectDnD) !== null && _pluginState$multiSel !== void 0 ? _pluginState$multiSel : tr === null || tr === void 0 || (_tr$getMeta = tr.getMeta(_main.key)) === null || _tr$getMeta === void 0 ? void 0 : _tr$getMeta.multiSelectDnD;
   if (multiSelectDnD && multiSelectDnD.anchor >= 0 && multiSelectDnD.head >= 0) {
     var multiFrom = Math.min(multiSelectDnD.anchor, multiSelectDnD.head);
     var multiTo = Math.max(multiSelectDnD.anchor, multiSelectDnD.head);
@@ -27,7 +30,7 @@ var getMultiSelectionIfPosInside = exports.getMultiSelectionIfPosInside = functi
  */
 var getSelectedSlicePosition = exports.getSelectedSlicePosition = function getSelectedSlicePosition(handlePos, tr, api) {
   var _activeNode$nodeSize;
-  var _getMultiSelectionIfP = getMultiSelectionIfPosInside(api, handlePos),
+  var _getMultiSelectionIfP = getMultiSelectionIfPosInside(api, handlePos, tr),
     anchor = _getMultiSelectionIfP.anchor,
     head = _getMultiSelectionIfP.head;
   var inSelection = anchor !== undefined && head !== undefined;

package/dist/cjs/pm-plugins/utils/validation.js

@@ -121,8 +121,9 @@ function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos,
   }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }
-function canMoveSliceToIndex(slice, sliceFromPos, doc, destParent, indexIntoParent, $destNodePos, destNode) {
+function canMoveSliceToIndex(slice, sliceFromPos, destParent, indexIntoParent, $destNodePos, destNode) {
   var canMoveNodes = true;
+  var doc = $destNodePos.doc;
   var nodesPos = [];
   for (var i = 0; i < slice.content.childCount; i++) {
     var node = slice.content.maybeChild(i);

package/dist/cjs/ui/drag-handle.js

@@ -401,7 +401,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
     if (!isMultiSelect || typeof start !== 'number' || !selection) {
       return;
     }
-    setDragHandleSelected((0, _getSelection.isHandleInSelection)(view.state, selection, start));
+    setDragHandleSelected((0, _getSelection.isHandleCorrelatedToSelection)(view.state, selection, start));
   }, [start, selection, view.state]);
   var helpDescriptors = isTopLevelNode && (0, _platformFeatureFlags.fg)('platform_editor_advanced_layouts_accessibility') ? [{
     description: formatMessage(_messages.blockControlsMessages.dragToMove)

package/dist/es2019/blockControlsPlugin.js

@@ -56,7 +56,7 @@ export const blockControlsPlugin = ({
       });
       return tr;
     },
-    setMultiSelectPositions: () => ({
+    setMultiSelectPositions: (anchor, head) => ({
       tr
     }) => {
       var _api$selection;
@@ -64,10 +64,15 @@ export const blockControlsPlugin = ({
         anchor: userAnchor,
         head: userHead
       } = tr.selection;
-      const {
-        $anchor: expandedAnchor,
-        $head: expandedHead
-      } = expandSelectionBounds(tr.selection.$anchor, tr.selection.$head);
+      let expandedAnchor, expandedHead;
+      if (anchor !== undefined && head !== undefined) {
+        expandedAnchor = tr.doc.resolve(anchor);
+        expandedHead = tr.doc.resolve(head);
+      } else {
+        const expandedSelection = expandSelectionBounds(tr.selection.$anchor, tr.selection.$head);
+        expandedAnchor = expandedSelection.$anchor;
+        expandedHead = expandedSelection.$head;
+      }
       api === null || api === void 0 ? void 0 : (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.commands.setManualSelection(expandedAnchor.pos, expandedHead.pos)({
         tr
       });

package/dist/es2019/editor-commands/move-node.js

@@ -1,7 +1,7 @@
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { expandedState } from '@atlaskit/editor-common/expand';
 import { blockControlsMessages } from '@atlaskit/editor-common/messages';
-import { GapCursorSelection } from '@atlaskit/editor-common/selection';
+import { GapCursorSelection, expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { transformSliceNestedExpandToExpand } from '@atlaskit/editor-common/transforms';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
@@ -92,7 +92,18 @@ export const moveNodeViaShortcut = (api, direction, formatMessage) => {
     if (shouldEnableNestedDndA11y) {
       isParentNodeOfTypeLayout = !!findParentNodeOfType([state.schema.nodes.layoutSection])(state.selection);
     }
-    const currentNodePos = getCurrentNodePos(state);
+    const isMultiSelectEnabled = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true);
+    let expandedAnchor, expandedHead;
+    const pluginState = api === null || api === void 0 ? void 0 : api.blockControls.sharedState.currentState();
+    if (pluginState !== null && pluginState !== void 0 && pluginState.multiSelectDnD) {
+      expandedAnchor = pluginState.multiSelectDnD.anchor;
+      expandedHead = pluginState.multiSelectDnD.head;
+    } else {
+      const expandedSelection = expandSelectionBounds(selection.$anchor, selection.$head);
+      expandedAnchor = expandedSelection.$anchor.pos;
+      expandedHead = expandedSelection.$head.pos;
+    }
+    const currentNodePos = isMultiSelectEnabled ? Math.min(expandedAnchor, expandedHead) : getCurrentNodePos(state);
     if (currentNodePos > -1) {
       var _state$doc$nodeAt;
       const $pos = state.doc.resolve(currentNodePos);
@@ -205,7 +216,7 @@ export const moveNodeViaShortcut = (api, direction, formatMessage) => {
         }
       } else {
         const endOfDoc = $pos.end();
-        const nodeAfterPos = $pos.posAtIndex($pos.index() + 1);
+        const nodeAfterPos = isMultiSelectEnabled ? Math.max(expandedAnchor, expandedHead) : $pos.posAtIndex($pos.index() + 1);
         if (nodeAfterPos > endOfDoc) {
           return false;
         }
@@ -228,6 +239,9 @@ export const moveNodeViaShortcut = (api, direction, formatMessage) => {
         api === null || api === void 0 ? void 0 : (_api$core7 = api.core) === null || _api$core7 === void 0 ? void 0 : _api$core7.actions.execute(({
           tr
         }) => {
+          api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+            tr
+          });
           moveNode(api)(currentNodePos, moveToPos, INPUT_METHOD.SHORTCUT, formatMessage)({
             tr
           });
@@ -235,7 +249,7 @@ export const moveNodeViaShortcut = (api, direction, formatMessage) => {
           return tr;
         });
         return true;
-      } else if (nodeType) {
+      } else if (nodeType && !isMultiSelectEnabled) {
         var _api$core8;
         // If the node is first/last one, only select the node
         api === null || api === void 0 ? void 0 : (_api$core8 = api.core) === null || _api$core8 === void 0 ? void 0 : _api$core8.actions.execute(({
@@ -246,6 +260,18 @@ export const moveNodeViaShortcut = (api, direction, formatMessage) => {
           return tr;
         });
         return true;
+      } else if (isMultiSelectEnabled) {
+        var _api$core9;
+        api === null || api === void 0 ? void 0 : (_api$core9 = api.core) === null || _api$core9 === void 0 ? void 0 : _api$core9.actions.execute(({
+          tr
+        }) => {
+          api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+            tr
+          });
+          tr.scrollIntoView();
+          return tr;
+        });
+        return true;
       }
     }
     return false;
@@ -254,6 +280,7 @@ export const moveNodeViaShortcut = (api, direction, formatMessage) => {
 export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_DROP, formatMessage) => ({
   tr
 }) => {
+  var _api$blockControls$co2;
   if (!api) {
     return tr;
   }
@@ -326,8 +353,13 @@ export const moveNode = api => (start, to, inputMethod = INPUT_METHOD.DRAG_AND_D
     mappedTo = tr.mapping.map(to);
     tr.insert(mappedTo, nodeCopy); // insert the content at the new position
   }
-  tr = inputMethod === INPUT_METHOD.DRAG_AND_DROP ? setCursorPositionAtMovedNode(tr, mappedTo) : selectNode(tr, mappedTo, handleNode.type.name);
+  const sliceSize = sliceTo - sliceFrom;
+  tr = inputMethod === INPUT_METHOD.DRAG_AND_DROP ? setCursorPositionAtMovedNode(tr, mappedTo) : isMultiSelect ? (_api$blockControls$co2 = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
+    tr
+  })) !== null && _api$blockControls$co2 !== void 0 ? _api$blockControls$co2 : tr : selectNode(tr, mappedTo, handleNode.type.name);
+  const currMeta = tr.getMeta(key);
   tr.setMeta(key, {
+    ...currMeta,
     nodeMoved: true
   });
   api === null || api === void 0 ? void 0 : api.core.actions.focus();

package/dist/es2019/pm-plugins/decorations-drop-target.js

@@ -1,5 +1,6 @@
 import { createElement } from 'react';
 import uuid from 'uuid';
+import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -153,6 +154,16 @@ export const dropTargetDecorations = (newState, api, formatMessage, nodeViewPort
     prevNodeStack.push(node);
   };
   const isAdvancedLayoutsPreRelease2 = editorExperiment('advanced_layouts', true);
+
+  // For deciding to show drop targets or not when multiple nodes are selected
+  const selection = newState.selection;
+  const {
+    $anchor: expandedAnchor,
+    $head: expandedHead
+  } = expandSelectionBounds(selection.$anchor, selection.$head);
+  const selectionFrom = Math.min(expandedAnchor.pos, expandedHead.pos);
+  const selectionTo = Math.max(expandedAnchor.pos, expandedHead.pos);
+  const handleInsideSelection = activeNodePos !== undefined && activeNodePos >= selectionFrom && activeNodePos <= selectionTo;
   newState.doc.nodesBetween(docFrom, docTo, (node, pos, parent, index) => {
     let depth = 0;
     // drop target deco at the end position
@@ -187,10 +198,6 @@ export const dropTargetDecorations = (newState, api, formatMessage, nodeViewPort
 
       // When multi select is on, validate all the nodes in the selection instead of just the handle node
       if (isMultiSelect) {
-        const selection = newState.selection;
-        const selectionFrom = selection.$from.pos;
-        const selectionTo = selection.$to.pos;
-        const handleInsideSelection = activeNodePos !== undefined && activeNodePos >= selectionFrom - 1 && activeNodePos <= selectionTo;
         const selectionSlice = newState.doc.slice(selectionFrom, selectionTo, false);
         const selectionSliceChildCount = selectionSlice.content.childCount;
         let canDropSingleNode = true;
@@ -198,7 +205,7 @@ export const dropTargetDecorations = (newState, api, formatMessage, nodeViewPort
 
         // when there is only one node in the slice, use the same logic as when multi select is not on
         if (selectionSliceChildCount > 1 && handleInsideSelection) {
-          canDropMultipleNodes = canMoveSliceToIndex(selectionSlice, selectionFrom, newState.doc, parent, index, $pos);
+          canDropMultipleNodes = canMoveSliceToIndex(selectionSlice, selectionFrom, parent, index, $pos);
         } else {
           canDropSingleNode = !!(activePMNode && canMoveNodeToIndex(parent, index, activePMNode, $pos, node));
         }

package/dist/es2019/pm-plugins/main.js

@@ -189,7 +189,9 @@ export const newApply = (api, formatMessage, tr, currentState, newState, flags,
   const resizerMeta = tr.getMeta('is-resizer-resizing');
   isResizerResizing = resizerMeta !== null && resizerMeta !== void 0 ? resizerMeta : isResizerResizing;
   if (multiSelectDnD && flags.isMultiSelectEnabled) {
-    multiSelectDnD = (meta === null || meta === void 0 ? void 0 : meta.isDragging) === false ? undefined : multiSelectDnD;
+    multiSelectDnD = (meta === null || meta === void 0 ? void 0 : meta.isDragging) === false ||
+    // For move node with shortcut, only reset when the selection changes
+    tr.selection.anchor !== multiSelectDnD.textAnchor || tr.selection.head !== multiSelectDnD.textHead ? undefined : multiSelectDnD;
   }
   const {
     from,

package/dist/es2019/pm-plugins/utils/getSelection.js

@@ -96,7 +96,7 @@ export const setCursorPositionAtMovedNode = (tr, start) => {
  * @param handlePos
  * @returns
  */
-export const isHandleInSelection = (state, selection, handlePos) => {
+export const isHandleCorrelatedToSelection = (state, selection, handlePos) => {
   if (selection.empty) {
     return false;
   }

package/dist/es2019/pm-plugins/utils/selection.js

@@ -1,8 +1,10 @@
-export const getMultiSelectionIfPosInside = (api, pos) => {
-  var _api$blockControls;
-  const {
-    multiSelectDnD
-  } = ((_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState()) || {};
+import { key } from '../main';
+export const getMultiSelectionIfPosInside = (api, pos, tr) => {
+  var _api$blockControls, _pluginState$multiSel, _tr$getMeta;
+  const pluginState = api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState();
+  // With move nodes shortcut, we expand selection and move node within one transaction,
+  // Hence we also look for `multiSelectDnD` in transaction meta
+  const multiSelectDnD = (_pluginState$multiSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.multiSelectDnD) !== null && _pluginState$multiSel !== void 0 ? _pluginState$multiSel : tr === null || tr === void 0 ? void 0 : (_tr$getMeta = tr.getMeta(key)) === null || _tr$getMeta === void 0 ? void 0 : _tr$getMeta.multiSelectDnD;
   if (multiSelectDnD && multiSelectDnD.anchor >= 0 && multiSelectDnD.head >= 0) {
     const multiFrom = Math.min(multiSelectDnD.anchor, multiSelectDnD.head);
     const multiTo = Math.max(multiSelectDnD.anchor, multiSelectDnD.head);
@@ -25,7 +27,7 @@ export const getSelectedSlicePosition = (handlePos, tr, api) => {
   const {
     anchor,
     head
-  } = getMultiSelectionIfPosInside(api, handlePos);
+  } = getMultiSelectionIfPosInside(api, handlePos, tr);
   const inSelection = anchor !== undefined && head !== undefined;
   const from = inSelection ? Math.min(anchor, head) : handlePos;
   const activeNode = tr.doc.nodeAt(handlePos);

package/dist/es2019/pm-plugins/utils/validation.js

@@ -114,8 +114,9 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
   }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }
-export function canMoveSliceToIndex(slice, sliceFromPos, doc, destParent, indexIntoParent, $destNodePos, destNode) {
+export function canMoveSliceToIndex(slice, sliceFromPos, destParent, indexIntoParent, $destNodePos, destNode) {
   let canMoveNodes = true;
+  const doc = $destNodePos.doc;
   const nodesPos = [];
   for (let i = 0; i < slice.content.childCount; i++) {
     const node = slice.content.maybeChild(i);

package/dist/es2019/ui/drag-handle.js

@@ -24,7 +24,7 @@ import { key } from '../pm-plugins/main';
 import { getMultiSelectAnalyticsAttributes } from '../pm-plugins/utils/analytics';
 import { getLeftPosition, getTopPosition } from '../pm-plugins/utils/drag-handle-positions';
 import { getNestedNodePosition } from '../pm-plugins/utils/getNestedNodePosition';
-import { isHandleInSelection, selectNode } from '../pm-plugins/utils/getSelection';
+import { isHandleCorrelatedToSelection, selectNode } from '../pm-plugins/utils/getSelection';
 import { DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_WIDTH, DRAG_HANDLE_ZINDEX, dragHandleGap, topPositionAdjustment } from './consts';
 import { dragPreview } from './drag-preview';
 const iconWrapperStyles = xcss({
@@ -383,7 +383,7 @@ export const DragHandle = ({
     if (!isMultiSelect || typeof start !== 'number' || !selection) {
       return;
     }
-    setDragHandleSelected(isHandleInSelection(view.state, selection, start));
+    setDragHandleSelected(isHandleCorrelatedToSelection(view.state, selection, start));
   }, [start, selection, view.state]);
   let helpDescriptors = isTopLevelNode && fg('platform_editor_advanced_layouts_accessibility') ? [{
     description: formatMessage(blockControlsMessages.dragToMove)

package/dist/esm/blockControlsPlugin.js

@@ -60,16 +60,22 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
           return tr;
         };
       },
-      setMultiSelectPositions: function setMultiSelectPositions() {
+      setMultiSelectPositions: function setMultiSelectPositions(anchor, head) {
         return function (_ref5) {
           var _api$selection;
           var tr = _ref5.tr;
           var _tr$selection = tr.selection,
             userAnchor = _tr$selection.anchor,
             userHead = _tr$selection.head;
-          var _expandSelectionBound = expandSelectionBounds(tr.selection.$anchor, tr.selection.$head),
-            expandedAnchor = _expandSelectionBound.$anchor,
-            expandedHead = _expandSelectionBound.$head;
+          var expandedAnchor, expandedHead;
+          if (anchor !== undefined && head !== undefined) {
+            expandedAnchor = tr.doc.resolve(anchor);
+            expandedHead = tr.doc.resolve(head);
+          } else {
+            var expandedSelection = expandSelectionBounds(tr.selection.$anchor, tr.selection.$head);
+            expandedAnchor = expandedSelection.$anchor;
+            expandedHead = expandedSelection.$head;
+          }
           api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 || _api$selection.commands.setManualSelection(expandedAnchor.pos, expandedHead.pos)({
             tr: tr
           });

package/dist/esm/editor-commands/move-node.js

@@ -4,7 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { expandedState } from '@atlaskit/editor-common/expand';
 import { blockControlsMessages } from '@atlaskit/editor-common/messages';
-import { GapCursorSelection } from '@atlaskit/editor-common/selection';
+import { GapCursorSelection, expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { transformSliceNestedExpandToExpand } from '@atlaskit/editor-common/transforms';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
@@ -89,7 +89,18 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
     if (shouldEnableNestedDndA11y) {
       isParentNodeOfTypeLayout = !!findParentNodeOfType([state.schema.nodes.layoutSection])(state.selection);
     }
-    var currentNodePos = getCurrentNodePos(state);
+    var isMultiSelectEnabled = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true);
+    var expandedAnchor, expandedHead;
+    var pluginState = api === null || api === void 0 ? void 0 : api.blockControls.sharedState.currentState();
+    if (pluginState !== null && pluginState !== void 0 && pluginState.multiSelectDnD) {
+      expandedAnchor = pluginState.multiSelectDnD.anchor;
+      expandedHead = pluginState.multiSelectDnD.head;
+    } else {
+      var expandedSelection = expandSelectionBounds(selection.$anchor, selection.$head);
+      expandedAnchor = expandedSelection.$anchor.pos;
+      expandedHead = expandedSelection.$head.pos;
+    }
+    var currentNodePos = isMultiSelectEnabled ? Math.min(expandedAnchor, expandedHead) : getCurrentNodePos(state);
     if (currentNodePos > -1) {
       var _state$doc$nodeAt;
       var $pos = state.doc.resolve(currentNodePos);
@@ -200,7 +211,7 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
         }
       } else {
         var _endOfDoc = $pos.end();
-        var nodeAfterPos = $pos.posAtIndex($pos.index() + 1);
+        var nodeAfterPos = isMultiSelectEnabled ? Math.max(expandedAnchor, expandedHead) : $pos.posAtIndex($pos.index() + 1);
         if (nodeAfterPos > _endOfDoc) {
           return false;
         }
@@ -222,6 +233,9 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
         var _api$core7;
         api === null || api === void 0 || (_api$core7 = api.core) === null || _api$core7 === void 0 || _api$core7.actions.execute(function (_ref4) {
           var tr = _ref4.tr;
+          api === null || api === void 0 || api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+            tr: tr
+          });
           moveNode(api)(currentNodePos, moveToPos, INPUT_METHOD.SHORTCUT, formatMessage)({
             tr: tr
           });
@@ -229,7 +243,7 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
           return tr;
         });
         return true;
-      } else if (nodeType) {
+      } else if (nodeType && !isMultiSelectEnabled) {
         var _api$core8;
         // If the node is first/last one, only select the node
         api === null || api === void 0 || (_api$core8 = api.core) === null || _api$core8 === void 0 || _api$core8.actions.execute(function (_ref5) {
@@ -239,6 +253,17 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
           return tr;
         });
         return true;
+      } else if (isMultiSelectEnabled) {
+        var _api$core9;
+        api === null || api === void 0 || (_api$core9 = api.core) === null || _api$core9 === void 0 || _api$core9.actions.execute(function (_ref6) {
+          var tr = _ref6.tr;
+          api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+            tr: tr
+          });
+          tr.scrollIntoView();
+          return tr;
+        });
+        return true;
       }
     }
     return false;
@@ -248,8 +273,9 @@ export var moveNode = function moveNode(api) {
   return function (start, to) {
     var inputMethod = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : INPUT_METHOD.DRAG_AND_DROP;
     var formatMessage = arguments.length > 3 ? arguments[3] : undefined;
-    return function (_ref6) {
-      var tr = _ref6.tr;
+    return function (_ref7) {
+      var _api$blockControls$co;
+      var tr = _ref7.tr;
       if (!api) {
         return tr;
       }
@@ -321,10 +347,14 @@ export var moveNode = function moveNode(api) {
         mappedTo = tr.mapping.map(to);
         tr.insert(mappedTo, _nodeCopy); // insert the content at the new position
       }
-      tr = inputMethod === INPUT_METHOD.DRAG_AND_DROP ? setCursorPositionAtMovedNode(tr, mappedTo) : selectNode(tr, mappedTo, handleNode.type.name);
-      tr.setMeta(key, {
+      var sliceSize = sliceTo - sliceFrom;
+      tr = inputMethod === INPUT_METHOD.DRAG_AND_DROP ? setCursorPositionAtMovedNode(tr, mappedTo) : isMultiSelect ? (_api$blockControls$co = api === null || api === void 0 ? void 0 : api.blockControls.commands.setMultiSelectPositions(mappedTo, mappedTo + sliceSize)({
+        tr: tr
+      })) !== null && _api$blockControls$co !== void 0 ? _api$blockControls$co : tr : selectNode(tr, mappedTo, handleNode.type.name);
+      var currMeta = tr.getMeta(key);
+      tr.setMeta(key, _objectSpread(_objectSpread({}, currMeta), {}, {
         nodeMoved: true
-      });
+      }));
       api === null || api === void 0 || api.core.actions.focus();
       var $mappedTo = tr.doc.resolve(mappedTo);
       var expandAncestor = findParentNodeOfTypeClosestToPos($to, [expand, nestedExpand]);

package/dist/esm/pm-plugins/decorations-drop-target.js

@@ -3,6 +3,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 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 { createElement } from 'react';
 import uuid from 'uuid';
+import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { isEmptyParagraph } from '@atlaskit/editor-common/utils';
 import { Decoration } from '@atlaskit/editor-prosemirror/view';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
@@ -159,6 +160,15 @@ export var dropTargetDecorations = function dropTargetDecorations(newState, api,
     prevNodeStack.push(node);
   };
   var isAdvancedLayoutsPreRelease2 = editorExperiment('advanced_layouts', true);
+
+  // For deciding to show drop targets or not when multiple nodes are selected
+  var selection = newState.selection;
+  var _expandSelectionBound = expandSelectionBounds(selection.$anchor, selection.$head),
+    expandedAnchor = _expandSelectionBound.$anchor,
+    expandedHead = _expandSelectionBound.$head;
+  var selectionFrom = Math.min(expandedAnchor.pos, expandedHead.pos);
+  var selectionTo = Math.max(expandedAnchor.pos, expandedHead.pos);
+  var handleInsideSelection = activeNodePos !== undefined && activeNodePos >= selectionFrom && activeNodePos <= selectionTo;
   newState.doc.nodesBetween(docFrom, docTo, function (node, pos, parent, index) {
     var depth = 0;
     // drop target deco at the end position
@@ -193,10 +203,6 @@ export var dropTargetDecorations = function dropTargetDecorations(newState, api,
 
       // When multi select is on, validate all the nodes in the selection instead of just the handle node
       if (isMultiSelect) {
-        var selection = newState.selection;
-        var selectionFrom = selection.$from.pos;
-        var selectionTo = selection.$to.pos;
-        var handleInsideSelection = activeNodePos !== undefined && activeNodePos >= selectionFrom - 1 && activeNodePos <= selectionTo;
         var selectionSlice = newState.doc.slice(selectionFrom, selectionTo, false);
         var selectionSliceChildCount = selectionSlice.content.childCount;
         var canDropSingleNode = true;
@@ -204,7 +210,7 @@ export var dropTargetDecorations = function dropTargetDecorations(newState, api,
 
         // when there is only one node in the slice, use the same logic as when multi select is not on
         if (selectionSliceChildCount > 1 && handleInsideSelection) {
-          canDropMultipleNodes = canMoveSliceToIndex(selectionSlice, selectionFrom, newState.doc, parent, index, $pos);
+          canDropMultipleNodes = canMoveSliceToIndex(selectionSlice, selectionFrom, parent, index, $pos);
         } else {
           canDropSingleNode = !!(activePMNode && canMoveNodeToIndex(parent, index, activePMNode, $pos, node));
         }

package/dist/esm/pm-plugins/main.js

@@ -182,7 +182,9 @@ export var newApply = function newApply(api, formatMessage, tr, currentState, ne
   var resizerMeta = tr.getMeta('is-resizer-resizing');
   isResizerResizing = resizerMeta !== null && resizerMeta !== void 0 ? resizerMeta : isResizerResizing;
   if (multiSelectDnD && flags.isMultiSelectEnabled) {
-    multiSelectDnD = (meta === null || meta === void 0 ? void 0 : meta.isDragging) === false ? undefined : multiSelectDnD;
+    multiSelectDnD = (meta === null || meta === void 0 ? void 0 : meta.isDragging) === false ||
+    // For move node with shortcut, only reset when the selection changes
+    tr.selection.anchor !== multiSelectDnD.textAnchor || tr.selection.head !== multiSelectDnD.textHead ? undefined : multiSelectDnD;
   }
   var _getTrMetadata = getTrMetadata(tr),
     from = _getTrMetadata.from,

package/dist/esm/pm-plugins/utils/getSelection.js

@@ -94,7 +94,7 @@ export var setCursorPositionAtMovedNode = function setCursorPositionAtMovedNode(
  * @param handlePos
  * @returns
  */
-export var isHandleInSelection = function isHandleInSelection(state, selection, handlePos) {
+export var isHandleCorrelatedToSelection = function isHandleCorrelatedToSelection(state, selection, handlePos) {
   if (selection.empty) {
     return false;
   }

package/dist/esm/pm-plugins/utils/selection.js

@@ -1,7 +1,10 @@
-export var getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(api, pos) {
-  var _api$blockControls;
-  var _ref = ((_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState()) || {},
-    multiSelectDnD = _ref.multiSelectDnD;
+import { key } from '../main';
+export var getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(api, pos, tr) {
+  var _api$blockControls, _pluginState$multiSel, _tr$getMeta;
+  var pluginState = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.sharedState.currentState();
+  // With move nodes shortcut, we expand selection and move node within one transaction,
+  // Hence we also look for `multiSelectDnD` in transaction meta
+  var multiSelectDnD = (_pluginState$multiSel = pluginState === null || pluginState === void 0 ? void 0 : pluginState.multiSelectDnD) !== null && _pluginState$multiSel !== void 0 ? _pluginState$multiSel : tr === null || tr === void 0 || (_tr$getMeta = tr.getMeta(key)) === null || _tr$getMeta === void 0 ? void 0 : _tr$getMeta.multiSelectDnD;
   if (multiSelectDnD && multiSelectDnD.anchor >= 0 && multiSelectDnD.head >= 0) {
     var multiFrom = Math.min(multiSelectDnD.anchor, multiSelectDnD.head);
     var multiTo = Math.max(multiSelectDnD.anchor, multiSelectDnD.head);
@@ -21,7 +24,7 @@ export var getMultiSelectionIfPosInside = function getMultiSelectionIfPosInside(
  */
 export var getSelectedSlicePosition = function getSelectedSlicePosition(handlePos, tr, api) {
   var _activeNode$nodeSize;
-  var _getMultiSelectionIfP = getMultiSelectionIfPosInside(api, handlePos),
+  var _getMultiSelectionIfP = getMultiSelectionIfPosInside(api, handlePos, tr),
     anchor = _getMultiSelectionIfP.anchor,
     head = _getMultiSelectionIfP.head;
   var inSelection = anchor !== undefined && head !== undefined;

package/dist/esm/pm-plugins/utils/validation.js

@@ -112,8 +112,9 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
   }
   return destParent.canReplaceWith(indexIntoParent, indexIntoParent, srcNodeType);
 }
-export function canMoveSliceToIndex(slice, sliceFromPos, doc, destParent, indexIntoParent, $destNodePos, destNode) {
+export function canMoveSliceToIndex(slice, sliceFromPos, destParent, indexIntoParent, $destNodePos, destNode) {
   var canMoveNodes = true;
+  var doc = $destNodePos.doc;
   var nodesPos = [];
   for (var i = 0; i < slice.content.childCount; i++) {
     var node = slice.content.maybeChild(i);

package/dist/esm/ui/drag-handle.js

@@ -29,7 +29,7 @@ import { key } from '../pm-plugins/main';
 import { getMultiSelectAnalyticsAttributes } from '../pm-plugins/utils/analytics';
 import { getLeftPosition, getTopPosition } from '../pm-plugins/utils/drag-handle-positions';
 import { getNestedNodePosition } from '../pm-plugins/utils/getNestedNodePosition';
-import { isHandleInSelection, selectNode } from '../pm-plugins/utils/getSelection';
+import { isHandleCorrelatedToSelection, selectNode } from '../pm-plugins/utils/getSelection';
 import { DRAG_HANDLE_BORDER_RADIUS, DRAG_HANDLE_HEIGHT, DRAG_HANDLE_WIDTH, DRAG_HANDLE_ZINDEX, dragHandleGap, topPositionAdjustment } from './consts';
 import { dragPreview } from './drag-preview';
 var iconWrapperStyles = xcss({
@@ -396,7 +396,7 @@ export var DragHandle = function DragHandle(_ref) {
     if (!isMultiSelect || typeof start !== 'number' || !selection) {
       return;
     }
-    setDragHandleSelected(isHandleInSelection(view.state, selection, start));
+    setDragHandleSelected(isHandleCorrelatedToSelection(view.state, selection, start));
   }, [start, selection, view.state]);
   var helpDescriptors = isTopLevelNode && fg('platform_editor_advanced_layouts_accessibility') ? [{
     description: formatMessage(blockControlsMessages.dragToMove)

package/dist/types/blockControlsPluginType.d.ts

@@ -87,7 +87,7 @@ export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
         moveNode: MoveNode;
         showDragHandleAt: (pos: number, anchorName: string, nodeType: string, handleOptions?: HandleOptions) => EditorCommand;
         setNodeDragged: (getPos: () => number | undefined, anchorName: string, nodeType: string) => EditorCommand;
-        setMultiSelectPositions: () => EditorCommand;
+        setMultiSelectPositions: (anchor?: number, head?: number) => EditorCommand;
     };
 }>;
 export type BlockControlsMeta = {

package/dist/types/pm-plugins/utils/getSelection.d.ts

@@ -14,6 +14,6 @@ export declare const setCursorPositionAtMovedNode: (tr: Transaction, start: numb
  * @param handlePos
  * @returns
  */
-export declare const isHandleInSelection: (state: EditorState, selection: Selection, handlePos: number) => boolean;
+export declare const isHandleCorrelatedToSelection: (state: EditorState, selection: Selection, handlePos: number) => boolean;
 export declare const rootListDepth: (itemPos: ResolvedPos) => number | undefined;
 export declare const rootTaskListDepth: (taskListPos: ResolvedPos) => number | undefined;

package/dist/types/pm-plugins/utils/selection.d.ts

@@ -1,7 +1,7 @@
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { Transaction } from '@atlaskit/editor-prosemirror/state';
+import { type Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { BlockControlsPlugin } from '../../blockControlsPluginType';
-export declare const getMultiSelectionIfPosInside: (api: ExtractInjectionAPI<BlockControlsPlugin>, pos: number) => {
+export declare const getMultiSelectionIfPosInside: (api: ExtractInjectionAPI<BlockControlsPlugin>, pos: number, tr?: Transaction) => {
     anchor?: number;
     head?: number;
 };

package/dist/types/pm-plugins/utils/validation.d.ts

@@ -17,4 +17,4 @@ export declare const transformExpandToNestedExpand: (expandNode: PMNode) => PMNo
 export declare const transformSliceExpandToNestedExpand: (slice: Slice) => Slice | null;
 export declare const memoizedTransformExpandToNestedExpand: import("memoize-one").MemoizedFn<(node: PMNode) => PMNode | null>;
 export declare function canMoveNodeToIndex(destParent: PMNode, indexIntoParent: number, srcNode: PMNode, $destNodePos: ResolvedPos, destNode?: PMNode): boolean;
-export declare function canMoveSliceToIndex(slice: Slice, sliceFromPos: number, doc: PMNode, destParent: PMNode, indexIntoParent: number, $destNodePos: ResolvedPos, destNode?: PMNode): boolean;
+export declare function canMoveSliceToIndex(slice: Slice, sliceFromPos: number, destParent: PMNode, indexIntoParent: number, $destNodePos: ResolvedPos, destNode?: PMNode): boolean;

package/dist/types-ts4.5/blockControlsPluginType.d.ts

@@ -87,7 +87,7 @@ export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
         moveNode: MoveNode;
         showDragHandleAt: (pos: number, anchorName: string, nodeType: string, handleOptions?: HandleOptions) => EditorCommand;
         setNodeDragged: (getPos: () => number | undefined, anchorName: string, nodeType: string) => EditorCommand;
-        setMultiSelectPositions: () => EditorCommand;
+        setMultiSelectPositions: (anchor?: number, head?: number) => EditorCommand;
     };
 }>;
 export type BlockControlsMeta = {

package/dist/types-ts4.5/pm-plugins/utils/getSelection.d.ts

@@ -14,6 +14,6 @@ export declare const setCursorPositionAtMovedNode: (tr: Transaction, start: numb
  * @param handlePos
  * @returns
  */
-export declare const isHandleInSelection: (state: EditorState, selection: Selection, handlePos: number) => boolean;
+export declare const isHandleCorrelatedToSelection: (state: EditorState, selection: Selection, handlePos: number) => boolean;
 export declare const rootListDepth: (itemPos: ResolvedPos) => number | undefined;
 export declare const rootTaskListDepth: (taskListPos: ResolvedPos) => number | undefined;

package/dist/types-ts4.5/pm-plugins/utils/selection.d.ts

@@ -1,7 +1,7 @@
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { Transaction } from '@atlaskit/editor-prosemirror/state';
+import { type Transaction } from '@atlaskit/editor-prosemirror/state';
 import type { BlockControlsPlugin } from '../../blockControlsPluginType';
-export declare const getMultiSelectionIfPosInside: (api: ExtractInjectionAPI<BlockControlsPlugin>, pos: number) => {
+export declare const getMultiSelectionIfPosInside: (api: ExtractInjectionAPI<BlockControlsPlugin>, pos: number, tr?: Transaction) => {
     anchor?: number;
     head?: number;
 };

package/dist/types-ts4.5/pm-plugins/utils/validation.d.ts

@@ -17,4 +17,4 @@ export declare const transformExpandToNestedExpand: (expandNode: PMNode) => PMNo
 export declare const transformSliceExpandToNestedExpand: (slice: Slice) => Slice | null;
 export declare const memoizedTransformExpandToNestedExpand: import("memoize-one").MemoizedFn<(node: PMNode) => PMNode | null>;
 export declare function canMoveNodeToIndex(destParent: PMNode, indexIntoParent: number, srcNode: PMNode, $destNodePos: ResolvedPos, destNode?: PMNode): boolean;
-export declare function canMoveSliceToIndex(slice: Slice, sliceFromPos: number, doc: PMNode, destParent: PMNode, indexIntoParent: number, $destNodePos: ResolvedPos, destNode?: PMNode): boolean;
+export declare function canMoveSliceToIndex(slice: Slice, sliceFromPos: number, destParent: PMNode, indexIntoParent: number, $destNodePos: ResolvedPos, destNode?: PMNode): boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "2.26.4",
+	"version": "2.27.1",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -31,7 +31,7 @@
 	},
 	"dependencies": {
 		"@atlaskit/adf-schema": "^47.2.1",
-		"@atlaskit/editor-common": "^99.15.0",
+		"@atlaskit/editor-common": "^99.16.0",
 		"@atlaskit/editor-plugin-accessibility-utils": "^1.4.0",
 		"@atlaskit/editor-plugin-analytics": "^1.12.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^1.5.0",