@atlaskit/editor-plugin-block-controls 7.2.7 → 7.2.9

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 7.2.9
+
+### Patch Changes
+
+- [`3a41420ddfc6e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3a41420ddfc6e) -
+  Clean up platform_editor_drag_layout_column_into_nodes
+
+## 7.2.8
+
+### Patch Changes
+
+- [`435745247f7ef`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/435745247f7ef) -
+  [ED-29337] Fix drag handle cannot be focus via shorcut when platform_editor_native_anchor_support
+  is enabled
+
 ## 7.2.7
 
 ### Patch Changes

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

@@ -91,7 +91,7 @@ var isDragLayoutColumnIntoSupportedNodes = function isDragLayoutColumnIntoSuppor
   var _$from$nodeAfter;
   var isTopLevel = $to.depth === 0;
   var isDragIntoNodes = nodesSupportDragLayoutColumnInto.includes($to.parent.type.name);
-  var supportedCondition = (0, _platformFeatureFlags.fg)('platform_editor_drag_layout_column_into_nodes') ? isDragIntoNodes || isTopLevel : isTopLevel;
+  var supportedCondition = isDragIntoNodes || isTopLevel;
   return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && supportedCondition;
 };
 

package/dist/cjs/editor-commands/show-drag-handle.js

@@ -5,9 +5,11 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.showDragHandleAtSelection = void 0;
 var _utils = require("@atlaskit/editor-prosemirror/utils");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _decorationsAnchor = require("../pm-plugins/decorations-anchor");
 var _main = require("../pm-plugins/main");
 var _getNestedNodePosition = require("../pm-plugins/utils/getNestedNodePosition");
+var _domAttrName = require("../ui/utils/dom-attr-name");
 var findParentPosForHandle = function findParentPosForHandle(state) {
   var _activeNode$handleOpt;
   var $from = state.selection.$from;
@@ -37,7 +39,15 @@ var findParentPosForHandle = function findParentPosForHandle(state) {
   }
 
   // else find closest parent node
-  return (0, _getNestedNodePosition.getNestedNodePosition)({
+  return (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true) ?
+  // With native anchor enabled, all nodes have anchor name attribute despite no drag handle support, e.g. listItem, caption,
+  // as opposed to old approach, node decoration is only added to the node that have drag handle,
+  // hence, we need to return the exact position of the node that can have drag handle
+  (0, _getNestedNodePosition.getNestedNodeStartingPosition)({
+    selection: state.selection,
+    schema: state.schema,
+    resolve: state.doc.resolve.bind(state.doc)
+  }) : (0, _getNestedNodePosition.getNestedNodePosition)({
     selection: state.selection,
     schema: state.schema,
     resolve: state.doc.resolve.bind(state.doc)
@@ -78,15 +88,52 @@ var findNextAnchorDecoration = function findNextAnchorDecoration(state) {
   // return the closest decoration to the node
   return nodeDecorations[0];
 };
+var findNextAnchorNode = function findNextAnchorNode(view) {
+  var nextHandleNodePos = findParentPosForHandle(view.state);
+  if (nextHandleNodePos === undefined) {
+    return undefined;
+  }
+  var dom = view.nodeDOM(nextHandleNodePos);
+  if (!(dom instanceof HTMLElement)) {
+    return undefined;
+  }
+  var nodeDOM = dom.closest("[".concat(_domAttrName.NODE_ANCHOR_ATTR_NAME, "]"));
+  if (!nodeDOM) {
+    return undefined;
+  }
+  var nodeType = nodeDOM === null || nodeDOM === void 0 ? void 0 : nodeDOM.getAttribute(_domAttrName.NODE_NODE_TYPE_ATTR_NAME);
+  var anchorName = nodeDOM === null || nodeDOM === void 0 ? void 0 : nodeDOM.getAttribute(_domAttrName.NODE_ANCHOR_ATTR_NAME);
+  if (nodeType && anchorName) {
+    return {
+      pos: nextHandleNodePos,
+      nodeType: nodeType,
+      anchorName: anchorName
+    };
+  }
+};
 var showDragHandleAtSelection = exports.showDragHandleAtSelection = function showDragHandleAtSelection(api) {
-  return function (state) {
-    var decoration = findNextAnchorDecoration(state);
-    if (api && decoration) {
-      api.core.actions.execute(api.blockControls.commands.showDragHandleAt(decoration.from, decoration.spec.anchorName, decoration.spec.nodeTypeWithLevel, {
-        isFocused: true
-      }));
-      return true;
+  return function (state, _, view) {
+    if (view && (0, _expValEquals.expValEquals)('platform_editor_native_anchor_support', 'isEnabled', true)) {
+      var anchorNode = findNextAnchorNode(view);
+      if (api && anchorNode) {
+        var pos = anchorNode.pos,
+          anchorName = anchorNode.anchorName,
+          nodeType = anchorNode.nodeType;
+        api.core.actions.execute(api.blockControls.commands.showDragHandleAt(pos, anchorName, nodeType, {
+          isFocused: true
+        }));
+        return true;
+      }
+      return false;
+    } else {
+      var decoration = findNextAnchorDecoration(state);
+      if (api && decoration) {
+        api.core.actions.execute(api.blockControls.commands.showDragHandleAt(decoration.from, decoration.spec.anchorName, decoration.spec.nodeTypeWithLevel, {
+          isFocused: true
+        }));
+        return true;
+      }
+      return false;
     }
-    return false;
   };
 };

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

@@ -15,8 +15,8 @@ function keymapList(api, formatMessage) {
     (0, _keymaps.bindKeymapWithCommand)(
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    _keymaps.showElementDragHandle.common, function (state) {
-      (0, _showDragHandle.showDragHandleAtSelection)(api)(state);
+    _keymaps.showElementDragHandle.common, function (state, dispatch, view) {
+      (0, _showDragHandle.showDragHandleAtSelection)(api)(state, dispatch, view);
       //we always want to handle this shortcut to prevent default browser special char insert when option + alphabetical key is used
       return true;
     }, keymapList);

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getNestedNodePosition = void 0;
+exports.getNestedNodeStartingPosition = exports.getNestedNodePosition = void 0;
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
 var getNestedNodePosition = exports.getNestedNodePosition = function getNestedNodePosition(_ref) {
@@ -26,4 +26,51 @@ var getNestedNodePosition = exports.getNestedNodePosition = function getNestedNo
     nestedNodePos = selection.$from.pos;
   }
   return nestedNodePos;
+};
+
+/**
+ *
+ * @returns starting position of nested node that drag handle can be shown next to
+ */
+var getNestedNodeStartingPosition = exports.getNestedNodeStartingPosition = function getNestedNodeStartingPosition(_ref2) {
+  var selection = _ref2.selection,
+    schema = _ref2.schema,
+    resolve = _ref2.resolve;
+  var nestedNodePos = selection.$from.before(1);
+  if (selection instanceof _state.TextSelection) {
+    nestedNodePos = selection.$from.before();
+    var $pos = resolve(nestedNodePos);
+    if ($pos.depth < 1) {
+      return nestedNodePos;
+    }
+    var _schema$nodes = schema.nodes,
+      bulletList = _schema$nodes.bulletList,
+      orderedList = _schema$nodes.orderedList,
+      taskList = _schema$nodes.taskList,
+      decisionList = _schema$nodes.decisionList,
+      caption = _schema$nodes.caption;
+    var isInList = (0, _utils.findParentNodeOfType)([bulletList, orderedList, taskList])(selection);
+    var isInNodeWithoutDragHandle = (0, _utils.findParentNodeOfType)([caption, decisionList])(selection);
+    if (isInList) {
+      // Only show drag handle at outermost list parent
+      nestedNodePos = _getOutermostListPos($pos, resolve);
+    } else if (isInNodeWithoutDragHandle) {
+      // return the position of their parent if there should be no drag handle before the node
+      nestedNodePos = $pos.before();
+    }
+  } else {
+    nestedNodePos = selection.$from.pos;
+  }
+  return nestedNodePos;
+};
+var _getOutermostListPos = function getOutermostListPos($pos, resolve) {
+  if ($pos.depth === 0) {
+    return $pos.pos;
+  }
+  var parentPos = $pos.before();
+  var parentNode = $pos.parent;
+  if (parentNode && ['bulletList', 'listItem', 'orderedList', 'taskList', 'taskItem'].includes(parentNode.type.name)) {
+    return _getOutermostListPos(resolve(parentPos), resolve);
+  }
+  return $pos.pos;
 };

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

@@ -121,26 +121,24 @@ function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNodePos,
     if ((destNode === null || destNode === void 0 ? void 0 : destNode.type) === layoutSection || destParentNodeType === doc) {
       return true;
     }
-    if ((0, _platformFeatureFlags.fg)('platform_editor_drag_layout_column_into_nodes')) {
-      if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
-        var contentContainsExpand = (0, _utils.findChildrenByType)(srcNode, expand).length > 0;
-        //convert expand to nestedExpand if there are expands inside the layout column
-        // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
-        var convertedFragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(layoutColumnContent) : layoutColumnContent;
-        if (!convertedFragment) {
-          return false;
-        }
-        return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
-      }
-      if (destParentNodeType === panel) {
-        return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
-      }
-      if (destParentNodeType === expand) {
-        return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
-      }
-      if (destParentNodeType === nestedExpand) {
-        return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
+    if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
+      var contentContainsExpand = (0, _utils.findChildrenByType)(srcNode, expand).length > 0;
+      //convert expand to nestedExpand if there are expands inside the layout column
+      // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
+      var convertedFragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(layoutColumnContent) : layoutColumnContent;
+      if (!convertedFragment) {
+        return false;
       }
+      return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
+    }
+    if (destParentNodeType === panel) {
+      return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
+    }
+    if (destParentNodeType === expand) {
+      return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
+    }
+    if (destParentNodeType === nestedExpand) {
+      return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
     }
   }
 

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

@@ -84,7 +84,7 @@ const isDragLayoutColumnIntoSupportedNodes = ($from, $to) => {
   var _$from$nodeAfter;
   const isTopLevel = $to.depth === 0;
   const isDragIntoNodes = nodesSupportDragLayoutColumnInto.includes($to.parent.type.name);
-  const supportedCondition = fg('platform_editor_drag_layout_column_into_nodes') ? isDragIntoNodes || isTopLevel : isTopLevel;
+  const supportedCondition = isDragIntoNodes || isTopLevel;
   return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && supportedCondition;
 };
 

package/dist/es2019/editor-commands/show-drag-handle.js

@@ -1,7 +1,9 @@
 import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { findNodeDecs } from '../pm-plugins/decorations-anchor';
 import { getDecorations, key } from '../pm-plugins/main';
-import { getNestedNodePosition } from '../pm-plugins/utils/getNestedNodePosition';
+import { getNestedNodePosition, getNestedNodeStartingPosition } from '../pm-plugins/utils/getNestedNodePosition';
+import { NODE_ANCHOR_ATTR_NAME, NODE_NODE_TYPE_ATTR_NAME } from '../ui/utils/dom-attr-name';
 const findParentPosForHandle = state => {
   var _activeNode$handleOpt;
   const {
@@ -36,7 +38,15 @@ const findParentPosForHandle = state => {
   }
 
   // else find closest parent node
-  return getNestedNodePosition({
+  return expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ?
+  // With native anchor enabled, all nodes have anchor name attribute despite no drag handle support, e.g. listItem, caption,
+  // as opposed to old approach, node decoration is only added to the node that have drag handle,
+  // hence, we need to return the exact position of the node that can have drag handle
+  getNestedNodeStartingPosition({
+    selection: state.selection,
+    schema: state.schema,
+    resolve: state.doc.resolve.bind(state.doc)
+  }) : getNestedNodePosition({
     selection: state.selection,
     schema: state.schema,
     resolve: state.doc.resolve.bind(state.doc)
@@ -77,13 +87,52 @@ const findNextAnchorDecoration = state => {
   // return the closest decoration to the node
   return nodeDecorations[0];
 };
-export const showDragHandleAtSelection = api => state => {
-  const decoration = findNextAnchorDecoration(state);
-  if (api && decoration) {
-    api.core.actions.execute(api.blockControls.commands.showDragHandleAt(decoration.from, decoration.spec.anchorName, decoration.spec.nodeTypeWithLevel, {
-      isFocused: true
-    }));
-    return true;
+const findNextAnchorNode = view => {
+  const nextHandleNodePos = findParentPosForHandle(view.state);
+  if (nextHandleNodePos === undefined) {
+    return undefined;
+  }
+  const dom = view.nodeDOM(nextHandleNodePos);
+  if (!(dom instanceof HTMLElement)) {
+    return undefined;
+  }
+  const nodeDOM = dom.closest(`[${NODE_ANCHOR_ATTR_NAME}]`);
+  if (!nodeDOM) {
+    return undefined;
+  }
+  const nodeType = nodeDOM === null || nodeDOM === void 0 ? void 0 : nodeDOM.getAttribute(NODE_NODE_TYPE_ATTR_NAME);
+  const anchorName = nodeDOM === null || nodeDOM === void 0 ? void 0 : nodeDOM.getAttribute(NODE_ANCHOR_ATTR_NAME);
+  if (nodeType && anchorName) {
+    return {
+      pos: nextHandleNodePos,
+      nodeType,
+      anchorName
+    };
+  }
+};
+export const showDragHandleAtSelection = api => (state, _, view) => {
+  if (view && expValEquals('platform_editor_native_anchor_support', 'isEnabled', true)) {
+    const anchorNode = findNextAnchorNode(view);
+    if (api && anchorNode) {
+      const {
+        pos,
+        anchorName,
+        nodeType
+      } = anchorNode;
+      api.core.actions.execute(api.blockControls.commands.showDragHandleAt(pos, anchorName, nodeType, {
+        isFocused: true
+      }));
+      return true;
+    }
+    return false;
+  } else {
+    const decoration = findNextAnchorDecoration(state);
+    if (api && decoration) {
+      api.core.actions.execute(api.blockControls.commands.showDragHandleAt(decoration.from, decoration.spec.anchorName, decoration.spec.nodeTypeWithLevel, {
+        isFocused: true
+      }));
+      return true;
+    }
+    return false;
   }
-  return false;
 };

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

@@ -9,8 +9,8 @@ function keymapList(api, formatMessage) {
     bindKeymapWithCommand(
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    showElementDragHandle.common, state => {
-      showDragHandleAtSelection(api)(state);
+    showElementDragHandle.common, (state, dispatch, view) => {
+      showDragHandleAtSelection(api)(state, dispatch, view);
       //we always want to handle this shortcut to prevent default browser special char insert when option + alphabetical key is used
       return true;
     }, keymapList);

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

@@ -21,4 +21,53 @@ export const getNestedNodePosition = ({
     nestedNodePos = selection.$from.pos;
   }
   return nestedNodePos;
+};
+
+/**
+ *
+ * @returns starting position of nested node that drag handle can be shown next to
+ */
+export const getNestedNodeStartingPosition = ({
+  selection,
+  schema,
+  resolve
+}) => {
+  let nestedNodePos = selection.$from.before(1);
+  if (selection instanceof TextSelection) {
+    nestedNodePos = selection.$from.before();
+    const $pos = resolve(nestedNodePos);
+    if ($pos.depth < 1) {
+      return nestedNodePos;
+    }
+    const {
+      bulletList,
+      orderedList,
+      taskList,
+      decisionList,
+      caption
+    } = schema.nodes;
+    const isInList = findParentNodeOfType([bulletList, orderedList, taskList])(selection);
+    const isInNodeWithoutDragHandle = findParentNodeOfType([caption, decisionList])(selection);
+    if (isInList) {
+      // Only show drag handle at outermost list parent
+      nestedNodePos = getOutermostListPos($pos, resolve);
+    } else if (isInNodeWithoutDragHandle) {
+      // return the position of their parent if there should be no drag handle before the node
+      nestedNodePos = $pos.before();
+    }
+  } else {
+    nestedNodePos = selection.$from.pos;
+  }
+  return nestedNodePos;
+};
+const getOutermostListPos = ($pos, resolve) => {
+  if ($pos.depth === 0) {
+    return $pos.pos;
+  }
+  const parentPos = $pos.before();
+  const parentNode = $pos.parent;
+  if (parentNode && ['bulletList', 'listItem', 'orderedList', 'taskList', 'taskItem'].includes(parentNode.type.name)) {
+    return getOutermostListPos(resolve(parentPos), resolve);
+  }
+  return $pos.pos;
 };

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

@@ -112,26 +112,24 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
     if ((destNode === null || destNode === void 0 ? void 0 : destNode.type) === layoutSection || destParentNodeType === doc) {
       return true;
     }
-    if (fg('platform_editor_drag_layout_column_into_nodes')) {
-      if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
-        const contentContainsExpand = findChildrenByType(srcNode, expand).length > 0;
-        //convert expand to nestedExpand if there are expands inside the layout column
-        // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
-        const convertedFragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(layoutColumnContent) : layoutColumnContent;
-        if (!convertedFragment) {
-          return false;
-        }
-        return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
-      }
-      if (destParentNodeType === panel) {
-        return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
-      }
-      if (destParentNodeType === expand) {
-        return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
-      }
-      if (destParentNodeType === nestedExpand) {
-        return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
+    if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
+      const contentContainsExpand = findChildrenByType(srcNode, expand).length > 0;
+      //convert expand to nestedExpand if there are expands inside the layout column
+      // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
+      const convertedFragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(layoutColumnContent) : layoutColumnContent;
+      if (!convertedFragment) {
+        return false;
       }
+      return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
+    }
+    if (destParentNodeType === panel) {
+      return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
+    }
+    if (destParentNodeType === expand) {
+      return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
+    }
+    if (destParentNodeType === nestedExpand) {
+      return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
     }
   }
 

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

@@ -85,7 +85,7 @@ var isDragLayoutColumnIntoSupportedNodes = function isDragLayoutColumnIntoSuppor
   var _$from$nodeAfter;
   var isTopLevel = $to.depth === 0;
   var isDragIntoNodes = nodesSupportDragLayoutColumnInto.includes($to.parent.type.name);
-  var supportedCondition = fg('platform_editor_drag_layout_column_into_nodes') ? isDragIntoNodes || isTopLevel : isTopLevel;
+  var supportedCondition = isDragIntoNodes || isTopLevel;
   return ((_$from$nodeAfter = $from.nodeAfter) === null || _$from$nodeAfter === void 0 ? void 0 : _$from$nodeAfter.type.name) === 'layoutColumn' && $from.parent.type.name === 'layoutSection' && supportedCondition;
 };
 

package/dist/esm/editor-commands/show-drag-handle.js

@@ -1,7 +1,9 @@
 import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { findNodeDecs } from '../pm-plugins/decorations-anchor';
 import { getDecorations, key } from '../pm-plugins/main';
-import { getNestedNodePosition } from '../pm-plugins/utils/getNestedNodePosition';
+import { getNestedNodePosition, getNestedNodeStartingPosition } from '../pm-plugins/utils/getNestedNodePosition';
+import { NODE_ANCHOR_ATTR_NAME, NODE_NODE_TYPE_ATTR_NAME } from '../ui/utils/dom-attr-name';
 var findParentPosForHandle = function findParentPosForHandle(state) {
   var _activeNode$handleOpt;
   var $from = state.selection.$from;
@@ -31,7 +33,15 @@ var findParentPosForHandle = function findParentPosForHandle(state) {
   }
 
   // else find closest parent node
-  return getNestedNodePosition({
+  return expValEquals('platform_editor_native_anchor_support', 'isEnabled', true) ?
+  // With native anchor enabled, all nodes have anchor name attribute despite no drag handle support, e.g. listItem, caption,
+  // as opposed to old approach, node decoration is only added to the node that have drag handle,
+  // hence, we need to return the exact position of the node that can have drag handle
+  getNestedNodeStartingPosition({
+    selection: state.selection,
+    schema: state.schema,
+    resolve: state.doc.resolve.bind(state.doc)
+  }) : getNestedNodePosition({
     selection: state.selection,
     schema: state.schema,
     resolve: state.doc.resolve.bind(state.doc)
@@ -72,15 +82,52 @@ var findNextAnchorDecoration = function findNextAnchorDecoration(state) {
   // return the closest decoration to the node
   return nodeDecorations[0];
 };
+var findNextAnchorNode = function findNextAnchorNode(view) {
+  var nextHandleNodePos = findParentPosForHandle(view.state);
+  if (nextHandleNodePos === undefined) {
+    return undefined;
+  }
+  var dom = view.nodeDOM(nextHandleNodePos);
+  if (!(dom instanceof HTMLElement)) {
+    return undefined;
+  }
+  var nodeDOM = dom.closest("[".concat(NODE_ANCHOR_ATTR_NAME, "]"));
+  if (!nodeDOM) {
+    return undefined;
+  }
+  var nodeType = nodeDOM === null || nodeDOM === void 0 ? void 0 : nodeDOM.getAttribute(NODE_NODE_TYPE_ATTR_NAME);
+  var anchorName = nodeDOM === null || nodeDOM === void 0 ? void 0 : nodeDOM.getAttribute(NODE_ANCHOR_ATTR_NAME);
+  if (nodeType && anchorName) {
+    return {
+      pos: nextHandleNodePos,
+      nodeType: nodeType,
+      anchorName: anchorName
+    };
+  }
+};
 export var showDragHandleAtSelection = function showDragHandleAtSelection(api) {
-  return function (state) {
-    var decoration = findNextAnchorDecoration(state);
-    if (api && decoration) {
-      api.core.actions.execute(api.blockControls.commands.showDragHandleAt(decoration.from, decoration.spec.anchorName, decoration.spec.nodeTypeWithLevel, {
-        isFocused: true
-      }));
-      return true;
+  return function (state, _, view) {
+    if (view && expValEquals('platform_editor_native_anchor_support', 'isEnabled', true)) {
+      var anchorNode = findNextAnchorNode(view);
+      if (api && anchorNode) {
+        var pos = anchorNode.pos,
+          anchorName = anchorNode.anchorName,
+          nodeType = anchorNode.nodeType;
+        api.core.actions.execute(api.blockControls.commands.showDragHandleAt(pos, anchorName, nodeType, {
+          isFocused: true
+        }));
+        return true;
+      }
+      return false;
+    } else {
+      var decoration = findNextAnchorDecoration(state);
+      if (api && decoration) {
+        api.core.actions.execute(api.blockControls.commands.showDragHandleAt(decoration.from, decoration.spec.anchorName, decoration.spec.nodeTypeWithLevel, {
+          isFocused: true
+        }));
+        return true;
+      }
+      return false;
     }
-    return false;
   };
 };

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

@@ -9,8 +9,8 @@ function keymapList(api, formatMessage) {
     bindKeymapWithCommand(
     // Ignored via go/ees005
     // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-    showElementDragHandle.common, function (state) {
-      showDragHandleAtSelection(api)(state);
+    showElementDragHandle.common, function (state, dispatch, view) {
+      showDragHandleAtSelection(api)(state, dispatch, view);
       //we always want to handle this shortcut to prevent default browser special char insert when option + alphabetical key is used
       return true;
     }, keymapList);

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

@@ -20,4 +20,51 @@ export var getNestedNodePosition = function getNestedNodePosition(_ref) {
     nestedNodePos = selection.$from.pos;
   }
   return nestedNodePos;
+};
+
+/**
+ *
+ * @returns starting position of nested node that drag handle can be shown next to
+ */
+export var getNestedNodeStartingPosition = function getNestedNodeStartingPosition(_ref2) {
+  var selection = _ref2.selection,
+    schema = _ref2.schema,
+    resolve = _ref2.resolve;
+  var nestedNodePos = selection.$from.before(1);
+  if (selection instanceof TextSelection) {
+    nestedNodePos = selection.$from.before();
+    var $pos = resolve(nestedNodePos);
+    if ($pos.depth < 1) {
+      return nestedNodePos;
+    }
+    var _schema$nodes = schema.nodes,
+      bulletList = _schema$nodes.bulletList,
+      orderedList = _schema$nodes.orderedList,
+      taskList = _schema$nodes.taskList,
+      decisionList = _schema$nodes.decisionList,
+      caption = _schema$nodes.caption;
+    var isInList = findParentNodeOfType([bulletList, orderedList, taskList])(selection);
+    var isInNodeWithoutDragHandle = findParentNodeOfType([caption, decisionList])(selection);
+    if (isInList) {
+      // Only show drag handle at outermost list parent
+      nestedNodePos = _getOutermostListPos($pos, resolve);
+    } else if (isInNodeWithoutDragHandle) {
+      // return the position of their parent if there should be no drag handle before the node
+      nestedNodePos = $pos.before();
+    }
+  } else {
+    nestedNodePos = selection.$from.pos;
+  }
+  return nestedNodePos;
+};
+var _getOutermostListPos = function getOutermostListPos($pos, resolve) {
+  if ($pos.depth === 0) {
+    return $pos.pos;
+  }
+  var parentPos = $pos.before();
+  var parentNode = $pos.parent;
+  if (parentNode && ['bulletList', 'listItem', 'orderedList', 'taskList', 'taskItem'].includes(parentNode.type.name)) {
+    return _getOutermostListPos(resolve(parentPos), resolve);
+  }
+  return $pos.pos;
 };

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

@@ -111,26 +111,24 @@ export function canMoveNodeToIndex(destParent, indexIntoParent, srcNode, $destNo
     if ((destNode === null || destNode === void 0 ? void 0 : destNode.type) === layoutSection || destParentNodeType === doc) {
       return true;
     }
-    if (fg('platform_editor_drag_layout_column_into_nodes')) {
-      if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
-        var contentContainsExpand = findChildrenByType(srcNode, expand).length > 0;
-        //convert expand to nestedExpand if there are expands inside the layout column
-        // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
-        var convertedFragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(layoutColumnContent) : layoutColumnContent;
-        if (!convertedFragment) {
-          return false;
-        }
-        return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
-      }
-      if (destParentNodeType === panel) {
-        return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
-      }
-      if (destParentNodeType === expand) {
-        return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
-      }
-      if (destParentNodeType === nestedExpand) {
-        return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
+    if (destParentNodeType === tableCell || destParentNodeType === tableHeader) {
+      var contentContainsExpand = findChildrenByType(srcNode, expand).length > 0;
+      //convert expand to nestedExpand if there are expands inside the layout column
+      // otherwise, the createChecked will fail as expand is not a valid child of tableCell/tableHeader, but nestedExpand is
+      var convertedFragment = contentContainsExpand ? transformFragmentExpandToNestedExpand(layoutColumnContent) : layoutColumnContent;
+      if (!convertedFragment) {
+        return false;
       }
+      return canCreateNodeWithContentInsideAnotherNode([tableCell, tableHeader], convertedFragment);
+    }
+    if (destParentNodeType === panel) {
+      return canCreateNodeWithContentInsideAnotherNode([panel], layoutColumnContent);
+    }
+    if (destParentNodeType === expand) {
+      return canCreateNodeWithContentInsideAnotherNode([expand], layoutColumnContent);
+    }
+    if (destParentNodeType === nestedExpand) {
+      return canCreateNodeWithContentInsideAnotherNode([nestedExpand], layoutColumnContent);
     }
   }
 

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

@@ -5,3 +5,12 @@ export declare const getNestedNodePosition: ({ selection, schema, resolve, }: {
     schema: Schema;
     selection: Selection;
 }) => number;
+/**
+ *
+ * @returns starting position of nested node that drag handle can be shown next to
+ */
+export declare const getNestedNodeStartingPosition: ({ selection, schema, resolve, }: {
+    resolve: (pos: number) => ResolvedPos;
+    schema: Schema;
+    selection: Selection;
+}) => number;

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

@@ -5,3 +5,12 @@ export declare const getNestedNodePosition: ({ selection, schema, resolve, }: {
     schema: Schema;
     selection: Selection;
 }) => number;
+/**
+ *
+ * @returns starting position of nested node that drag handle can be shown next to
+ */
+export declare const getNestedNodeStartingPosition: ({ selection, schema, resolve, }: {
+    resolve: (pos: number) => ResolvedPos;
+    schema: Schema;
+    selection: Selection;
+}) => number;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-controls",
-	"version": "7.2.7",
+	"version": "7.2.9",
 	"description": "Block controls plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -126,9 +126,6 @@
 		"platform_editor_ease_of_use_metrics": {
 			"type": "boolean"
 		},
-		"platform_editor_drag_layout_column_into_nodes": {
-			"type": "boolean"
-		},
 		"platform_editor_elements_dnd_multi_select_patch_2": {
 			"type": "boolean"
 		},