@atlaskit/editor-plugin-block-controls 3.2.0 → 3.3.0

package/dist/es2019/editor-commands/move-to-layout.js

@@ -313,6 +313,12 @@ export const moveToLayout = api => (from, to, options) => ({
   if (!fromContentWithoutBreakout) {
     return tr;
   }
+  if (fg('platform_editor_ease_of_use_metrics')) {
+    var _api$metrics;
+    api === null || api === void 0 ? void 0 : (_api$metrics = api.metrics) === null || _api$metrics === void 0 ? void 0 : _api$metrics.commands.setContentMoved()({
+      tr
+    });
+  }
   const isMultiSelect = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true);
   if (toNode.type === layoutSection) {
     const toPos = options !== null && options !== void 0 && options.moveToEnd ? to + toNode.nodeSize - 1 : to + 1;

package/dist/es2019/pm-plugins/decorations-drag-handle.js

@@ -66,7 +66,7 @@ export const dragHandleDecoration = (api, formatMessage, pos, anchorName, nodeTy
     // temporarily re-instating ReactDOM.render to fix drag handle focus issue, fix to
     // follow via ED-26546
 
-    // if (fg('platform_editor_react18_plugin_portalprovider')) {
+    // previous under platform_editor_react18_plugin_portalprovider
     // 	nodeViewPortalProviderAPI.render(
     // 		() =>
     // 			createElement(DragHandle, {
@@ -82,7 +82,7 @@ export const dragHandleDecoration = (api, formatMessage, pos, anchorName, nodeTy
     // 		element,
     // 		key,
     // 	);
-    // } else {
+
     ReactDOM.render( /*#__PURE__*/createElement(DragHandle, {
       view,
       api,

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

@@ -133,6 +133,12 @@ const destroyFn = (api, editorView) => {
             }
           })(tr);
         }
+        if (fg('platform_editor_ease_of_use_metrics')) {
+          var _api$metrics;
+          api === null || api === void 0 ? void 0 : (_api$metrics = api.metrics) === null || _api$metrics === void 0 ? void 0 : _api$metrics.commands.startActiveSessionTimer()({
+            tr
+          });
+        }
         return tr.setMeta(key, {
           ...tr.getMeta(key),
           isDragging: false,
@@ -570,7 +576,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
       },
       handleDOMEvents: {
         drop(view, event) {
-          var _pluginState, _pluginState2, _pluginState3, _event$target;
+          var _pluginState, _pluginState2, _pluginState3, _event$target, _event$target$closest;
           // Prevent native DnD from triggering if we are in drag
           const {
             dispatch,
@@ -581,6 +587,12 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
           let pluginState = key.getState(state);
           const dndDragCancelled = (_pluginState = pluginState) === null || _pluginState === void 0 ? void 0 : _pluginState.lastDragCancelled;
           if ((_pluginState2 = pluginState) !== null && _pluginState2 !== void 0 && _pluginState2.isPMDragging || dndDragCancelled && isMultiSelectEnabled) {
+            if (fg('platform_editor_ease_of_use_metrics')) {
+              var _api$metrics2;
+              api === null || api === void 0 ? void 0 : (_api$metrics2 = api.metrics) === null || _api$metrics2 === void 0 ? void 0 : _api$metrics2.commands.startActiveSessionTimer()({
+                tr
+              });
+            }
             dispatch(tr.setMeta(key, {
               ...tr.getMeta(key),
               isPMDragging: false,
@@ -599,7 +611,7 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
             event.preventDefault();
             return false;
           }
-          const nodeElement = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.closest('[data-drag-handler-anchor-name]');
+          const nodeElement = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : (_event$target$closest = _event$target.closest) === null || _event$target$closest === void 0 ? void 0 : _event$target$closest.call(_event$target, '[data-drag-handler-anchor-name]');
           if (!nodeElement) {
             return false;
           }
@@ -648,10 +660,18 @@ export const createPlugin = (api, getIntl, nodeViewPortalProviderAPI) => {
             dispatch
           } = view;
           if ((_key$getState3 = key.getState(state)) !== null && _key$getState3 !== void 0 && _key$getState3.isPMDragging) {
-            dispatch(state.tr.setMeta(key, {
+            const tr = state.tr;
+            tr.setMeta(key, {
               ...state.tr.getMeta(key),
               isPMDragging: false
-            }));
+            });
+            if (fg('platform_editor_ease_of_use_metrics')) {
+              var _api$metrics3;
+              api === null || api === void 0 ? void 0 : (_api$metrics3 = api.metrics) === null || _api$metrics3 === void 0 ? void 0 : _api$metrics3.commands.startActiveSessionTimer()({
+                tr
+              });
+            }
+            dispatch(tr);
           }
         },
         mouseover: (view, event) => {

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

@@ -2,6 +2,7 @@ import { GapCursorSelection, Side } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { selectTableClosestToPos } from '@atlaskit/editor-tables/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
 export const getInlineNodePos = (tr, start, nodeSize) => {
   const $startPos = tr.doc.resolve(start);
   // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
@@ -53,6 +54,8 @@ export const getSelection = (tr, start) => {
   // we need a quick way to make all child media nodes appear as selected without the need for a custom selection
   nodeName === 'mediaGroup') {
     return new NodeSelection($startPos);
+  } else if (nodeName === 'taskList' && fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+    return TextSelection.create(tr.doc, start, start + nodeSize);
   } else {
     const {
       inlineNodePos,
@@ -100,21 +103,42 @@ export const isHandleCorrelatedToSelection = (state, selection, handlePos) => {
   if (selection.empty) {
     return false;
   }
+  let nodeStart;
   const $selectionFrom = selection.$from;
-  const selectionFrom = $selectionFrom.pos;
-  let nodeStart = $selectionFrom.depth ? $selectionFrom.before() : selectionFrom;
-  const $resolvedNodePos = state.doc.resolve(nodeStart);
-  if (['tableRow', 'tableCell', 'tableHeader'].includes($resolvedNodePos.node().type.name)) {
-    const parentNodeFindRes = findParentNodeOfType(state.schema.nodes['table'])(selection);
-    const tablePos = parentNodeFindRes === null || parentNodeFindRes === void 0 ? void 0 : parentNodeFindRes.pos;
-    nodeStart = typeof tablePos === 'undefined' ? nodeStart : tablePos;
-  } else if (['listItem'].includes($resolvedNodePos.node().type.name)) {
-    nodeStart = $resolvedNodePos.before(rootListDepth($resolvedNodePos));
-  } else if (['taskList'].includes($resolvedNodePos.node().type.name)) {
-    const listdepth = rootTaskListDepth($resolvedNodePos);
-    nodeStart = $resolvedNodePos.before(listdepth);
-  } else if (['blockquote'].includes($resolvedNodePos.node().type.name)) {
-    nodeStart = $resolvedNodePos.before();
+  if (fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+    nodeStart = $selectionFrom.before($selectionFrom.sharedDepth(selection.to) + 1);
+    if (nodeStart === $selectionFrom.pos) {
+      nodeStart = $selectionFrom.depth ? $selectionFrom.before() : $selectionFrom.pos;
+    }
+    const $resolvedNodePos = state.doc.resolve(nodeStart);
+    if (['tableRow', 'tableCell', 'tableHeader'].includes($resolvedNodePos.node().type.name)) {
+      const parentNodeFindRes = findParentNodeOfType(state.schema.nodes['table'])(selection);
+      const tablePos = parentNodeFindRes === null || parentNodeFindRes === void 0 ? void 0 : parentNodeFindRes.pos;
+      nodeStart = typeof tablePos === 'undefined' ? nodeStart : tablePos;
+    } else if (['listItem'].includes($resolvedNodePos.node().type.name)) {
+      nodeStart = $resolvedNodePos.before(rootListDepth($resolvedNodePos));
+    } else if (['taskList'].includes($resolvedNodePos.node().type.name)) {
+      const listdepth = rootTaskListDepth($resolvedNodePos);
+      nodeStart = $resolvedNodePos.before(listdepth);
+    } else if (['blockquote'].includes($resolvedNodePos.node().type.name)) {
+      nodeStart = $resolvedNodePos.before();
+    }
+  } else {
+    const selectionFrom = $selectionFrom.pos;
+    nodeStart = $selectionFrom.depth ? $selectionFrom.before() : selectionFrom;
+    const $resolvedNodePos = state.doc.resolve(nodeStart);
+    if (['tableRow', 'tableCell', 'tableHeader'].includes($resolvedNodePos.node().type.name)) {
+      const parentNodeFindRes = findParentNodeOfType(state.schema.nodes['table'])(selection);
+      const tablePos = parentNodeFindRes === null || parentNodeFindRes === void 0 ? void 0 : parentNodeFindRes.pos;
+      nodeStart = typeof tablePos === 'undefined' ? nodeStart : tablePos;
+    } else if (['listItem'].includes($resolvedNodePos.node().type.name)) {
+      nodeStart = $resolvedNodePos.before(rootListDepth($resolvedNodePos));
+    } else if (['taskList'].includes($resolvedNodePos.node().type.name)) {
+      const listdepth = rootTaskListDepth($resolvedNodePos);
+      nodeStart = $resolvedNodePos.before(listdepth);
+    } else if (['blockquote'].includes($resolvedNodePos.node().type.name)) {
+      nodeStart = $resolvedNodePos.before();
+    }
   }
   return Boolean(handlePos < selection.$to.pos && handlePos >= nodeStart);
 };

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

@@ -288,7 +288,7 @@ export const DragHandle = ({
               return tr;
             }
             const oldHandlePosCheck = handlePos >= tr.selection.$from.start() - 1 && handlePos <= tr.selection.to;
-            const newHandlePosCheck = handlePos >= (tr.selection.$from.depth ? tr.selection.$from.before() : tr.selection.from) && handlePos < tr.selection.to;
+            const newHandlePosCheck = isHandleCorrelatedToSelection(view.state, tr.selection, handlePos);
             if (!tr.selection.empty && (fg('platform_editor_elements_dnd_multi_select_patch_1') ? newHandlePosCheck : oldHandlePosCheck)) {
               var _api$blockControls4;
               api === null || api === void 0 ? void 0 : (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.setMultiSelectPositions()({

package/dist/esm/blockControlsPlugin.js

@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import React from 'react';
 import { expandSelectionBounds } from '@atlaskit/editor-common/selection';
 import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { moveNode } from './editor-commands/move-node';
 import { moveToLayout } from './editor-commands/move-to-layout';
@@ -82,6 +83,15 @@ export var blockControlsPlugin = function blockControlsPlugin(_ref) {
               nodeType: nodeType
             }
           }));
+          if (fg('platform_editor_ease_of_use_metrics')) {
+            var _api$metrics;
+            api === null || api === void 0 || (_api$metrics = api.metrics) === null || _api$metrics === void 0 || _api$metrics.commands.handleIntentToStartEdit({
+              shouldStartTimer: false,
+              shouldPersistActiveSession: true
+            })({
+              tr: tr
+            });
+          }
           return tr;
         };
       },

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

@@ -87,6 +87,7 @@ var getFocusedHandle = function getFocusedHandle(state) {
 };
 export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, formatMessage) {
   return function (state) {
+    var _hoistedPos;
     var isParentNodeOfTypeLayout;
     var shouldEnableNestedDndA11y = editorExperiment('nested-dnd', true);
     var selection = state.selection;
@@ -97,19 +98,26 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
     var expandedSelection = expandSelectionBounds(selection.$anchor, selection.$head);
     var expandedAnchor = expandedSelection.$anchor.pos;
     var expandedHead = expandedSelection.$head.pos;
-    var currentNodePos = isMultiSelectEnabled && !getFocusedHandle(state) ? Math.min(expandedAnchor, expandedHead) : getCurrentNodePos(state);
+    var hoistedPos;
+    var from = Math.min(expandedAnchor, expandedHead);
+    // Nodes like lists nest within themselves, we need to find the top most position
+    if (isParentNodeOfTypeLayout && fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+      var LAYOUT_COL_DEPTH = 3;
+      hoistedPos = state.doc.resolve(from).before(LAYOUT_COL_DEPTH);
+    }
+    var currentNodePos = isMultiSelectEnabled && !getFocusedHandle(state) && !selection.empty ? (_hoistedPos = hoistedPos) !== null && _hoistedPos !== void 0 ? _hoistedPos : from : getCurrentNodePos(state);
     if (currentNodePos > -1) {
       var _state$doc$nodeAt;
-      var $pos = state.doc.resolve(currentNodePos);
-      var nodeAfterPos = isMultiSelectEnabled && !getFocusedHandle(state) ? Math.max(expandedAnchor, expandedHead) : $pos.posAtIndex($pos.index() + 1);
-      var isTopLevelNode = $pos.depth === 0;
+      var $currentNodePos = state.doc.resolve(currentNodePos);
+      var nodeAfterPos = isMultiSelectEnabled && !getFocusedHandle(state) ? Math.max(expandedAnchor, expandedHead) : $currentNodePos.posAtIndex($currentNodePos.index() + 1);
+      var isTopLevelNode = $currentNodePos.depth === 0;
       var moveToPos = -1;
-      var nodeIndex = $pos.index();
+      var nodeIndex = $currentNodePos.index();
       var isLayoutColumnSelected = selection instanceof NodeSelection && selection.node.type.name === 'layoutColumn';
       if (direction === DIRECTION.LEFT && shouldEnableNestedDndA11y) {
         if (isTopLevelNode && editorExperiment('advanced_layouts', true) && fg('platform_editor_advanced_layouts_accessibility')) {
           var _api$core, _api$core2;
-          var nodeBefore = $pos.nodeBefore;
+          var nodeBefore = $currentNodePos.nodeBefore;
           if (nodeBefore) {
             moveToPos = currentNodePos - nodeBefore.nodeSize;
           }
@@ -133,28 +141,28 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
           api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.focus();
           return true;
         } else if (isLayoutColumnSelected && fg('platform_editor_advanced_layouts_accessibility')) {
-          var _$pos$nodeBefore, _api$core3, _api$blockControls2;
-          moveToPos = selection.from - (((_$pos$nodeBefore = $pos.nodeBefore) === null || _$pos$nodeBefore === void 0 ? void 0 : _$pos$nodeBefore.nodeSize) || 1);
+          var _$currentNodePos$node, _api$core3, _api$blockControls2;
+          moveToPos = selection.from - (((_$currentNodePos$node = $currentNodePos.nodeBefore) === null || _$currentNodePos$node === void 0 ? void 0 : _$currentNodePos$node.nodeSize) || 1);
           api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || (_api$blockControls2 = _api$blockControls2.commands) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.moveToLayout(currentNodePos, moveToPos, {
             selectMovedNode: true
           }));
           return true;
         } else {
-          if ($pos.depth < 2 || !isParentNodeOfTypeLayout) {
+          if ($currentNodePos.depth < 2 || !isParentNodeOfTypeLayout) {
             return false;
           }
 
           // get the previous layoutSection node
-          var index = $pos.index($pos.depth - 1);
-          var grandParent = $pos.node($pos.depth - 1);
+          var index = $currentNodePos.index($currentNodePos.depth - 1);
+          var grandParent = $currentNodePos.node($currentNodePos.depth - 1);
           var previousNode = grandParent ? grandParent.maybeChild(index - 1) : null;
-          moveToPos = $pos.start() - ((previousNode === null || previousNode === void 0 ? void 0 : previousNode.nodeSize) || 1);
+          moveToPos = $currentNodePos.start() - ((previousNode === null || previousNode === void 0 ? void 0 : previousNode.nodeSize) || 1);
         }
       } else if (direction === DIRECTION.RIGHT && shouldEnableNestedDndA11y) {
         if (isTopLevelNode && editorExperiment('advanced_layouts', true) && fg('platform_editor_advanced_layouts_accessibility')) {
           var _api$core4, _api$core5;
-          var endOfDoc = $pos.end();
-          moveToPos = $pos.posAtIndex($pos.index() + 1);
+          var endOfDoc = $currentNodePos.end();
+          moveToPos = $currentNodePos.posAtIndex($currentNodePos.index() + 1);
           if (moveToPos >= endOfDoc) {
             return false;
           }
@@ -175,8 +183,8 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
           return true;
         } else if (isLayoutColumnSelected && fg('platform_editor_advanced_layouts_accessibility')) {
           var _api$core6, _api$blockControls4;
-          var _index = $pos.index($pos.depth);
-          var parent = $pos.node($pos.depth);
+          var _index = $currentNodePos.index($currentNodePos.depth);
+          var parent = $currentNodePos.node($currentNodePos.depth);
           // get the next layoutColumn node
           var nextNode = parent ? parent.maybeChild(_index + 1) : null;
 
@@ -186,29 +194,29 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
             return true;
           }
           var moveToEnd = _index === parent.childCount - 2;
-          moveToPos = moveToEnd ? $pos.before() : selection.to + ((nextNode === null || nextNode === void 0 ? void 0 : nextNode.nodeSize) || 1);
+          moveToPos = moveToEnd ? $currentNodePos.before() : selection.to + ((nextNode === null || nextNode === void 0 ? void 0 : nextNode.nodeSize) || 1);
           api === null || api === void 0 || (_api$core6 = api.core) === null || _api$core6 === void 0 || _api$core6.actions.execute(api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 || (_api$blockControls4 = _api$blockControls4.commands) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.moveToLayout(currentNodePos, moveToPos, {
             moveToEnd: moveToEnd,
             selectMovedNode: true
           }));
           return true;
         } else {
-          if ($pos.depth < 2 || !isParentNodeOfTypeLayout) {
+          if ($currentNodePos.depth < 2 || !isParentNodeOfTypeLayout) {
             return false;
           }
-          moveToPos = $pos.after($pos.depth) + 1;
+          moveToPos = $currentNodePos.after($currentNodePos.depth) + 1;
         }
       } else if (direction === DIRECTION.UP) {
         if (isLayoutColumnSelected && fg('platform_editor_advanced_layouts_accessibility')) {
-          moveToPos = $pos.start() - 1;
+          moveToPos = $currentNodePos.start() - 1;
         } else {
-          var _nodeBefore = $pos.depth > 1 && nodeIndex === 0 && shouldEnableNestedDndA11y ? $pos.node($pos.depth) : $pos.nodeBefore;
+          var _nodeBefore = $currentNodePos.depth > 1 && nodeIndex === 0 && shouldEnableNestedDndA11y ? $currentNodePos.node($currentNodePos.depth) : $currentNodePos.nodeBefore;
           if (_nodeBefore) {
             moveToPos = currentNodePos - _nodeBefore.nodeSize;
           }
         }
       } else {
-        var _endOfDoc = $pos.end();
+        var _endOfDoc = $currentNodePos.end();
         if (nodeAfterPos > _endOfDoc) {
           return false;
         }
@@ -225,14 +233,23 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
       var nodeType = (_state$doc$nodeAt = state.doc.nodeAt(currentNodePos)) === null || _state$doc$nodeAt === void 0 ? void 0 : _state$doc$nodeAt.type.name;
 
       // only move the node if the destination is at the same depth, not support moving a nested node to a parent node
-      var shouldMoveNode = (shouldEnableNestedDndA11y ? moveToPos > -1 && $pos.depth === state.doc.resolve(moveToPos).depth || nodeType === 'layoutColumn' : moveToPos > -1) || nodeType === 'layoutColumn' && fg('platform_editor_advanced_layouts_accessibility');
+      var shouldMoveNode = (shouldEnableNestedDndA11y ? moveToPos > -1 && $currentNodePos.depth === state.doc.resolve(moveToPos).depth || nodeType === 'layoutColumn' : moveToPos > -1) || nodeType === 'layoutColumn' && fg('platform_editor_advanced_layouts_accessibility');
+      var _expandSelectionBound = expandSelectionBounds($currentNodePos, selection.$to),
+        $newAnchor = _expandSelectionBound.$anchor,
+        $newHead = _expandSelectionBound.$head;
       if (shouldMoveNode) {
         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
-          });
+          if (fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+            api === null || api === void 0 || api.blockControls.commands.setMultiSelectPositions($newAnchor.pos, $newHead.pos)({
+              tr: tr
+            });
+          } else {
+            api === null || api === void 0 || api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+              tr: tr
+            });
+          }
           moveNode(api)(currentNodePos, moveToPos, INPUT_METHOD.SHORTCUT, formatMessage)({
             tr: tr
           });
@@ -254,9 +271,15 @@ export var moveNodeViaShortcut = function moveNodeViaShortcut(api, direction, fo
         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
-          });
+          if (fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+            api === null || api === void 0 || api.blockControls.commands.setMultiSelectPositions($newAnchor.pos, $newHead.pos)({
+              tr: tr
+            });
+          } else {
+            api === null || api === void 0 || api.blockControls.commands.setMultiSelectPositions(expandedAnchor, expandedHead)({
+              tr: tr
+            });
+          }
           tr.scrollIntoView();
           return tr;
         });
@@ -287,6 +310,12 @@ export var moveNode = function moveNode(api) {
       var isMultiSelect = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true, {
         exposure: true
       });
+      if (fg('platform_editor_ease_of_use_metrics')) {
+        var _api$metrics;
+        api === null || api === void 0 || (_api$metrics = api.metrics) === null || _api$metrics === void 0 || _api$metrics.commands.setContentMoved()({
+          tr: tr
+        });
+      }
       var slicePosition = getSelectedSlicePosition(start, tr, api);
       if (isMultiSelect) {
         sliceFrom = slicePosition.from;

package/dist/esm/editor-commands/move-to-layout.js

@@ -313,6 +313,12 @@ export var moveToLayout = function moveToLayout(api) {
       if (!fromContentWithoutBreakout) {
         return tr;
       }
+      if (fg('platform_editor_ease_of_use_metrics')) {
+        var _api$metrics;
+        api === null || api === void 0 || (_api$metrics = api.metrics) === null || _api$metrics === void 0 || _api$metrics.commands.setContentMoved()({
+          tr: tr
+        });
+      }
       var isMultiSelect = editorExperiment('platform_editor_element_drag_and_drop_multiselect', true);
       if (toNode.type === layoutSection) {
         var toPos = options !== null && options !== void 0 && options.moveToEnd ? to + toNode.nodeSize - 1 : to + 1;

package/dist/esm/pm-plugins/decorations-drag-handle.js

@@ -68,7 +68,7 @@ export var dragHandleDecoration = function dragHandleDecoration(api, formatMessa
     // temporarily re-instating ReactDOM.render to fix drag handle focus issue, fix to
     // follow via ED-26546
 
-    // if (fg('platform_editor_react18_plugin_portalprovider')) {
+    // previous under platform_editor_react18_plugin_portalprovider
     // 	nodeViewPortalProviderAPI.render(
     // 		() =>
     // 			createElement(DragHandle, {
@@ -84,7 +84,7 @@ export var dragHandleDecoration = function dragHandleDecoration(api, formatMessa
     // 		element,
     // 		key,
     // 	);
-    // } else {
+
     ReactDOM.render( /*#__PURE__*/createElement(DragHandle, {
       view: view,
       api: api,

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

@@ -131,6 +131,12 @@ var destroyFn = function destroyFn(api, editorView) {
             })
           })(tr);
         }
+        if (fg('platform_editor_ease_of_use_metrics')) {
+          var _api$metrics;
+          api === null || api === void 0 || (_api$metrics = api.metrics) === null || _api$metrics === void 0 || _api$metrics.commands.startActiveSessionTimer()({
+            tr: tr
+          });
+        }
         return tr.setMeta(key, _objectSpread(_objectSpread({}, tr.getMeta(key)), {}, {
           isDragging: false,
           isPMDragging: false,
@@ -584,7 +590,7 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
       },
       handleDOMEvents: {
         drop: function drop(view, event) {
-          var _pluginState, _pluginState2, _pluginState3, _event$target;
+          var _pluginState, _pluginState2, _pluginState3, _event$target, _event$target$closest;
           // Prevent native DnD from triggering if we are in drag
           var dispatch = view.dispatch,
             dragging = view.dragging,
@@ -593,6 +599,12 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
           var pluginState = key.getState(state);
           var dndDragCancelled = (_pluginState = pluginState) === null || _pluginState === void 0 ? void 0 : _pluginState.lastDragCancelled;
           if ((_pluginState2 = pluginState) !== null && _pluginState2 !== void 0 && _pluginState2.isPMDragging || dndDragCancelled && isMultiSelectEnabled) {
+            if (fg('platform_editor_ease_of_use_metrics')) {
+              var _api$metrics2;
+              api === null || api === void 0 || (_api$metrics2 = api.metrics) === null || _api$metrics2 === void 0 || _api$metrics2.commands.startActiveSessionTimer()({
+                tr: tr
+              });
+            }
             dispatch(tr.setMeta(key, _objectSpread(_objectSpread({}, tr.getMeta(key)), {}, {
               isPMDragging: false,
               lastDragCancelled: false
@@ -610,7 +622,7 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
             event.preventDefault();
             return false;
           }
-          var nodeElement = (_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.closest('[data-drag-handler-anchor-name]');
+          var nodeElement = (_event$target = event.target) === null || _event$target === void 0 || (_event$target$closest = _event$target.closest) === null || _event$target$closest === void 0 ? void 0 : _event$target$closest.call(_event$target, '[data-drag-handler-anchor-name]');
           if (!nodeElement) {
             return false;
           }
@@ -656,9 +668,17 @@ export var createPlugin = function createPlugin(api, getIntl, nodeViewPortalProv
           var state = view.state,
             dispatch = view.dispatch;
           if ((_key$getState3 = key.getState(state)) !== null && _key$getState3 !== void 0 && _key$getState3.isPMDragging) {
-            dispatch(state.tr.setMeta(key, _objectSpread(_objectSpread({}, state.tr.getMeta(key)), {}, {
+            var tr = state.tr;
+            tr.setMeta(key, _objectSpread(_objectSpread({}, state.tr.getMeta(key)), {}, {
               isPMDragging: false
-            })));
+            }));
+            if (fg('platform_editor_ease_of_use_metrics')) {
+              var _api$metrics3;
+              api === null || api === void 0 || (_api$metrics3 = api.metrics) === null || _api$metrics3 === void 0 || _api$metrics3.commands.startActiveSessionTimer()({
+                tr: tr
+              });
+            }
+            dispatch(tr);
           }
         },
         mouseover: function mouseover(view, event) {

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

@@ -2,6 +2,7 @@ import { GapCursorSelection, Side } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { selectTableClosestToPos } from '@atlaskit/editor-tables/utils';
+import { fg } from '@atlaskit/platform-feature-flags';
 export var getInlineNodePos = function getInlineNodePos(tr, start, nodeSize) {
   var $startPos = tr.doc.resolve(start);
   // To trigger the annotation floating toolbar for non-selectable node, we need to select inline nodes
@@ -53,6 +54,8 @@ export var getSelection = function getSelection(tr, start) {
   // we need a quick way to make all child media nodes appear as selected without the need for a custom selection
   nodeName === 'mediaGroup') {
     return new NodeSelection($startPos);
+  } else if (nodeName === 'taskList' && fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+    return TextSelection.create(tr.doc, start, start + nodeSize);
   } else {
     var _getInlineNodePos = getInlineNodePos(tr, start, nodeSize),
       inlineNodePos = _getInlineNodePos.inlineNodePos,
@@ -98,21 +101,42 @@ export var isHandleCorrelatedToSelection = function isHandleCorrelatedToSelectio
   if (selection.empty) {
     return false;
   }
+  var nodeStart;
   var $selectionFrom = selection.$from;
-  var selectionFrom = $selectionFrom.pos;
-  var nodeStart = $selectionFrom.depth ? $selectionFrom.before() : selectionFrom;
-  var $resolvedNodePos = state.doc.resolve(nodeStart);
-  if (['tableRow', 'tableCell', 'tableHeader'].includes($resolvedNodePos.node().type.name)) {
-    var parentNodeFindRes = findParentNodeOfType(state.schema.nodes['table'])(selection);
-    var tablePos = parentNodeFindRes === null || parentNodeFindRes === void 0 ? void 0 : parentNodeFindRes.pos;
-    nodeStart = typeof tablePos === 'undefined' ? nodeStart : tablePos;
-  } else if (['listItem'].includes($resolvedNodePos.node().type.name)) {
-    nodeStart = $resolvedNodePos.before(rootListDepth($resolvedNodePos));
-  } else if (['taskList'].includes($resolvedNodePos.node().type.name)) {
-    var listdepth = rootTaskListDepth($resolvedNodePos);
-    nodeStart = $resolvedNodePos.before(listdepth);
-  } else if (['blockquote'].includes($resolvedNodePos.node().type.name)) {
-    nodeStart = $resolvedNodePos.before();
+  if (fg('platform_editor_elements_dnd_multi_select_patch_1')) {
+    nodeStart = $selectionFrom.before($selectionFrom.sharedDepth(selection.to) + 1);
+    if (nodeStart === $selectionFrom.pos) {
+      nodeStart = $selectionFrom.depth ? $selectionFrom.before() : $selectionFrom.pos;
+    }
+    var $resolvedNodePos = state.doc.resolve(nodeStart);
+    if (['tableRow', 'tableCell', 'tableHeader'].includes($resolvedNodePos.node().type.name)) {
+      var parentNodeFindRes = findParentNodeOfType(state.schema.nodes['table'])(selection);
+      var tablePos = parentNodeFindRes === null || parentNodeFindRes === void 0 ? void 0 : parentNodeFindRes.pos;
+      nodeStart = typeof tablePos === 'undefined' ? nodeStart : tablePos;
+    } else if (['listItem'].includes($resolvedNodePos.node().type.name)) {
+      nodeStart = $resolvedNodePos.before(rootListDepth($resolvedNodePos));
+    } else if (['taskList'].includes($resolvedNodePos.node().type.name)) {
+      var listdepth = rootTaskListDepth($resolvedNodePos);
+      nodeStart = $resolvedNodePos.before(listdepth);
+    } else if (['blockquote'].includes($resolvedNodePos.node().type.name)) {
+      nodeStart = $resolvedNodePos.before();
+    }
+  } else {
+    var selectionFrom = $selectionFrom.pos;
+    nodeStart = $selectionFrom.depth ? $selectionFrom.before() : selectionFrom;
+    var _$resolvedNodePos = state.doc.resolve(nodeStart);
+    if (['tableRow', 'tableCell', 'tableHeader'].includes(_$resolvedNodePos.node().type.name)) {
+      var _parentNodeFindRes = findParentNodeOfType(state.schema.nodes['table'])(selection);
+      var _tablePos = _parentNodeFindRes === null || _parentNodeFindRes === void 0 ? void 0 : _parentNodeFindRes.pos;
+      nodeStart = typeof _tablePos === 'undefined' ? nodeStart : _tablePos;
+    } else if (['listItem'].includes(_$resolvedNodePos.node().type.name)) {
+      nodeStart = _$resolvedNodePos.before(rootListDepth(_$resolvedNodePos));
+    } else if (['taskList'].includes(_$resolvedNodePos.node().type.name)) {
+      var _listdepth = rootTaskListDepth(_$resolvedNodePos);
+      nodeStart = _$resolvedNodePos.before(_listdepth);
+    } else if (['blockquote'].includes(_$resolvedNodePos.node().type.name)) {
+      nodeStart = _$resolvedNodePos.before();
+    }
   }
   return Boolean(handlePos < selection.$to.pos && handlePos >= nodeStart);
 };

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

@@ -303,7 +303,7 @@ export var DragHandle = function DragHandle(_ref) {
               return tr;
             }
             var oldHandlePosCheck = handlePos >= tr.selection.$from.start() - 1 && handlePos <= tr.selection.to;
-            var newHandlePosCheck = handlePos >= (tr.selection.$from.depth ? tr.selection.$from.before() : tr.selection.from) && handlePos < tr.selection.to;
+            var newHandlePosCheck = isHandleCorrelatedToSelection(view.state, tr.selection, handlePos);
             if (!tr.selection.empty && (fg('platform_editor_elements_dnd_multi_select_patch_1') ? newHandlePosCheck : oldHandlePosCheck)) {
               var _api$blockControls4;
               api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 || _api$blockControls4.commands.setMultiSelectPositions()({

package/dist/types/blockControlsPluginType.d.ts

@@ -5,6 +5,7 @@ import type { AccessibilityUtilsPlugin } from '@atlaskit/editor-plugin-accessibi
 import { type AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
+import type { MetricsPlugin } from '@atlaskit/editor-plugin-metrics';
 import type { QuickInsertPlugin } from '@atlaskit/editor-plugin-quick-insert';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
@@ -74,7 +75,8 @@ export type BlockControlsPluginDependencies = [
      * Clean up ticket ED-24824
      */
     OptionalPlugin<QuickInsertPlugin>,
-    OptionalPlugin<SelectionPlugin>
+    OptionalPlugin<SelectionPlugin>,
+    OptionalPlugin<MetricsPlugin>
 ];
 export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
     dependencies: BlockControlsPluginDependencies;

package/dist/types/ui/block-menu.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { WrappedComponentProps } from 'react-intl-next';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { EditorView } from '@atlaskit/editor-prosemirror/dist/types/view';
+import { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { BlockControlsPlugin } from '../blockControlsPluginType';
 type BlockMenuProps = {
     editorView: EditorView | undefined;

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

@@ -5,6 +5,7 @@ import type { AccessibilityUtilsPlugin } from '@atlaskit/editor-plugin-accessibi
 import { type AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { EditorDisabledPlugin } from '@atlaskit/editor-plugin-editor-disabled';
 import type { FeatureFlagsPlugin } from '@atlaskit/editor-plugin-feature-flags';
+import type { MetricsPlugin } from '@atlaskit/editor-plugin-metrics';
 import type { QuickInsertPlugin } from '@atlaskit/editor-plugin-quick-insert';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
@@ -74,7 +75,8 @@ export type BlockControlsPluginDependencies = [
      * Clean up ticket ED-24824
      */
     OptionalPlugin<QuickInsertPlugin>,
-    OptionalPlugin<SelectionPlugin>
+    OptionalPlugin<SelectionPlugin>,
+    OptionalPlugin<MetricsPlugin>
 ];
 export type BlockControlsPlugin = NextEditorPlugin<'blockControls', {
     dependencies: BlockControlsPluginDependencies;

package/dist/types-ts4.5/ui/block-menu.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import type { WrappedComponentProps } from 'react-intl-next';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import { EditorView } from '@atlaskit/editor-prosemirror/dist/types/view';
+import { EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { BlockControlsPlugin } from '../blockControlsPluginType';
 type BlockMenuProps = {
     editorView: EditorView | undefined;