@atlaskit/editor-plugin-block-controls 3.19.4 → 3.19.6

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 3.19.6
+
+### Patch Changes
+
+- [#172583](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/172583)
+  [`40f387a0c0962`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/40f387a0c0962) -
+  Clean up platform_editor_controls_patch_2
+- Updated dependencies
+
+## 3.19.5
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 3.19.4
 
 ### Patch Changes

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

@@ -59,14 +59,20 @@ var canMoveNodeOrSliceToPos = exports.canMoveNodeOrSliceToPos = function canMove
   }
   return true;
 };
-var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = function getActiveDropTargetDecorations(activeDropTargetNode, state, api, formatMessage, nodeViewPortalProviderAPI, activeNode) {
+var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = function getActiveDropTargetDecorations(activeDropTargetNode, state, api, existingDecs, formatMessage, nodeViewPortalProviderAPI, activeNode) {
   if (!(0, _platformFeatureFlags.fg)('platform_editor_block_controls_drop_target_mem_fix')) {
     (0, _decorationsCommon.unmountDecorations)(nodeViewPortalProviderAPI, 'data-blocks-drop-target-container', 'data-blocks-drop-target-key');
   }
-  var decs = [];
+  var decsToAdd = [];
+  var decsToRemove = existingDecs.filter(function (dec) {
+    return !!dec;
+  });
   var activeNodePos = activeNode === null || activeNode === void 0 ? void 0 : activeNode.pos;
   var $activeNodePos = typeof activeNodePos === 'number' && state.doc.resolve(activeNodePos);
   var $toPos = state.doc.resolve(activeDropTargetNode.pos);
+  var existingDecsPos = decsToRemove.map(function (dec) {
+    return dec.from;
+  });
   var _findSurroundingNodes = (0, _decorationsFindSurroundingNodes.findSurroundingNodes)(state, $toPos, activeDropTargetNode.nodeTypeName),
     parent = _findSurroundingNodes.parent,
     index = _findSurroundingNodes.index,
@@ -81,32 +87,52 @@ var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = fu
    * above the first child and below the last child.
    */
   if (isContainerNode(node)) {
+    var isEmptyContainer = node.childCount === 0 || node.childCount === 1 && (0, _utils.isEmptyParagraph)(node.firstChild);
+
     // can move to before first child
-    if (node.firstChild && canMoveNodeOrSliceToPos(state, node.firstChild, node, 0, state.doc.resolve(pos + 1),
-    // +1 to get the position of the first child
-    activeNode)) {
-      decs.push((0, _decorationsDropTarget.createDropTargetDecoration)(pos + 1, {
-        api: api,
-        prevNode: undefined,
-        nextNode: node.firstChild,
-        parentNode: node,
-        formatMessage: formatMessage,
-        dropTargetStyle: 'default'
-      }, nodeViewPortalProviderAPI, 1));
+    var posBeforeFirstChild = pos + 1; // +1 to get the position of the first child
+    if (node.firstChild && canMoveNodeOrSliceToPos(state, node.firstChild, node, 0, state.doc.resolve(posBeforeFirstChild), activeNode)) {
+      if (existingDecsPos.includes(posBeforeFirstChild)) {
+        // if the decoration already exists, we don't add it again.
+        decsToRemove = decsToRemove.filter(function (dec) {
+          return dec.from !== posBeforeFirstChild;
+        });
+      } else {
+        decsToAdd.push((0, _decorationsDropTarget.createDropTargetDecoration)(posBeforeFirstChild, {
+          api: api,
+          prevNode: undefined,
+          nextNode: node.firstChild,
+          parentNode: node,
+          formatMessage: formatMessage,
+          dropTargetStyle: isEmptyContainer ? 'remainingHeight' : 'default'
+        }, nodeViewPortalProviderAPI, 1));
+      }
     }
 
     // can move to after last child
-    if (node.lastChild && canMoveNodeOrSliceToPos(state, node.lastChild, node, node.childCount - 1, state.doc.resolve(pos + node.nodeSize - 1),
-    // -1 to get the position after last child
-    activeNode)) {
-      decs.push((0, _decorationsDropTarget.createDropTargetDecoration)(pos + node.nodeSize - 1, {
-        api: api,
-        prevNode: node.lastChild,
-        nextNode: undefined,
-        parentNode: node,
-        formatMessage: formatMessage,
-        dropTargetStyle: 'default'
-      }, nodeViewPortalProviderAPI, -1));
+    // if the node is empty, we don't show the drop target at the end of the node
+    if (!isEmptyContainer) {
+      var posAfterLastChild = pos + node.nodeSize - 1; // -1 to get the position after last child
+
+      if (node.lastChild && canMoveNodeOrSliceToPos(state, node.lastChild, node, node.childCount - 1, state.doc.resolve(posAfterLastChild),
+      // -1 to get the position after last child
+      activeNode)) {
+        if (existingDecsPos.includes(posAfterLastChild)) {
+          // if the decoration already exists, we don't add it again.
+          decsToRemove = decsToRemove.filter(function (dec) {
+            return dec.from !== posAfterLastChild;
+          });
+        } else {
+          decsToAdd.push((0, _decorationsDropTarget.createDropTargetDecoration)(posAfterLastChild, {
+            api: api,
+            prevNode: node.lastChild,
+            nextNode: undefined,
+            parentNode: node,
+            formatMessage: formatMessage,
+            dropTargetStyle: 'remainingHeight'
+          }, nodeViewPortalProviderAPI, -1));
+        }
+      }
     }
   }
 
@@ -118,24 +144,41 @@ var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = fu
     var isInSupportedContainer = ['tableCell', 'tableHeader', 'layoutColumn'].includes((parent === null || parent === void 0 ? void 0 : parent.type.name) || '');
     var shouldShowFullHeight = isInSupportedContainer && (parent === null || parent === void 0 ? void 0 : parent.lastChild) === node && (0, _utils.isEmptyParagraph)(node);
     if (canMoveNodeOrSliceToPos(state, node, parent, index, $toPos, activeNode)) {
-      decs.push((0, _decorationsDropTarget.createDropTargetDecoration)(pos, {
-        api: api,
-        prevNode: before || undefined,
-        nextNode: node,
-        parentNode: parent || undefined,
-        formatMessage: formatMessage,
-        dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
-      }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+      if (existingDecsPos.includes(pos)) {
+        // if the decoration already exists, we don't add it again.
+        decsToRemove = decsToRemove.filter(function (dec) {
+          return dec.from !== pos;
+        });
+      } else {
+        decsToAdd.push((0, _decorationsDropTarget.createDropTargetDecoration)(pos, {
+          api: api,
+          prevNode: before || undefined,
+          nextNode: node,
+          parentNode: parent || undefined,
+          formatMessage: formatMessage,
+          dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
+        }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+      }
     }
-    if (canMoveNodeOrSliceToPos(state, node, parent, index + 1, state.doc.resolve(pos + node.nodeSize), activeNode)) {
-      decs.push((0, _decorationsDropTarget.createDropTargetDecoration)(pos + node.nodeSize, {
-        api: api,
-        prevNode: node,
-        nextNode: after || undefined,
-        parentNode: parent || undefined,
-        formatMessage: formatMessage,
-        dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
-      }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+
+    // if the node is a container node, we show the drop target after the node
+    var posAfterNode = pos + node.nodeSize;
+    if (canMoveNodeOrSliceToPos(state, node, parent, index + 1, state.doc.resolve(posAfterNode), activeNode)) {
+      if (existingDecsPos.includes(posAfterNode)) {
+        // if the decoration already exists, we don't add it again.
+        decsToRemove = decsToRemove.filter(function (dec) {
+          return dec.from !== posAfterNode;
+        });
+      } else {
+        decsToAdd.push((0, _decorationsDropTarget.createDropTargetDecoration)(posAfterNode, {
+          api: api,
+          prevNode: node,
+          nextNode: after || undefined,
+          parentNode: parent || undefined,
+          formatMessage: formatMessage,
+          dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
+        }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+      }
     }
   }
   var rootNodeWithPos = {
@@ -146,14 +189,21 @@ var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = fu
   // if the current node is not a top level node, we create one for advanced layout drop targets
   if (depth > 1) {
     var root = (0, _decorationsFindSurroundingNodes.findSurroundingNodes)(state, state.doc.resolve($toPos.before(2)));
-    decs.push((0, _decorationsDropTarget.createDropTargetDecoration)(root.pos, {
-      api: api,
-      prevNode: root.before || undefined,
-      nextNode: root.node,
-      parentNode: state.doc || undefined,
-      formatMessage: formatMessage,
-      dropTargetStyle: 'default'
-    }, nodeViewPortalProviderAPI, 0, undefined, false));
+    if (existingDecsPos.includes(root.pos)) {
+      // if the decoration already exists, we don't add it again.
+      decsToRemove = decsToRemove.filter(function (dec) {
+        return dec.from !== root.pos;
+      });
+    } else {
+      decsToAdd.push((0, _decorationsDropTarget.createDropTargetDecoration)(root.pos, {
+        api: api,
+        prevNode: root.before || undefined,
+        nextNode: root.node,
+        parentNode: state.doc || undefined,
+        formatMessage: formatMessage,
+        dropTargetStyle: 'default'
+      }, nodeViewPortalProviderAPI, 0, undefined, false));
+    }
     rootNodeWithPos = {
       node: root.node,
       pos: root.pos
@@ -167,11 +217,19 @@ var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = fu
         layoutSectionNode.descendants(function (childNode, childPos, parent, index) {
           if (childNode.type.name === 'layoutColumn' && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'layoutSection' && index !== 0 // Not the first node
           ) {
-            decs.push((0, _decorationsDropTarget.createLayoutDropTargetDecoration)(rootNodeWithPos.pos + childPos + 1, {
-              api: api,
-              parent: parent,
-              formatMessage: formatMessage
-            }, nodeViewPortalProviderAPI, undefined));
+            var currentPos = rootNodeWithPos.pos + childPos + 1;
+            if (existingDecsPos.includes(currentPos)) {
+              // if the decoration already exists, we don't add it again.
+              decsToRemove = decsToRemove.filter(function (dec) {
+                return dec.from !== currentPos;
+              });
+            } else {
+              decsToAdd.push((0, _decorationsDropTarget.createLayoutDropTargetDecoration)(rootNodeWithPos.pos + childPos + 1, {
+                api: api,
+                parent: parent,
+                formatMessage: formatMessage
+              }, nodeViewPortalProviderAPI, undefined));
+            }
           }
           return false;
         });
@@ -179,5 +237,8 @@ var getActiveDropTargetDecorations = exports.getActiveDropTargetDecorations = fu
     }
   }
   _activeAnchorTracker.defaultActiveAnchorTracker.emit((0, _decorationsCommon.getNodeAnchor)(rootNodeWithPos.node));
-  return decs;
+  return {
+    decsToAdd: decsToAdd,
+    decsToRemove: decsToRemove
+  };
 };

package/dist/cjs/pm-plugins/decorations-find-surrounding-nodes.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.findSurroundingNodes = void 0;
 var IGNORE_NODES = ['tableRow', 'listItem', 'caption', 'media'];
 var blockLeafNodes = ['blockCard', 'rule'];
+var DISABLE_CHILD_DROP_TARGET = ['orderedList', 'bulletList'];
 
 /**
  * This function returns the surrounding nodes of a given resolved position in the editor.
@@ -33,17 +34,25 @@ var _findSurroundingNodes = exports.findSurroundingNodes = function findSurround
       before: _before,
       after: _after,
       index: _index,
-      depth: 1
+      depth: depth
     };
   }
   var isRootNode = depth === 1;
   var node = $pos.node(depth);
-  var isIgnoredNode = IGNORE_NODES.includes(node.type.name);
-  if (isIgnoredNode && !isRootNode) {
+
+  // go through the path to find the first node that is not allow child drop target
+  // From top to bottom, we check the node types at each depth
+  for (var i = 1; i < depth; i++) {
+    var _nodeType = $pos.node(i).type.name;
+    if (DISABLE_CHILD_DROP_TARGET.includes(_nodeType)) {
+      return _findSurroundingNodes(state, state.doc.resolve($pos.before(i + 1)), _nodeType);
+    }
+  }
+  if (IGNORE_NODES.includes(node.type.name) && !isRootNode) {
     // If the node is an ignored node, we return the surrounding nodes of its parent
     return _findSurroundingNodes(state, state.doc.resolve($pos.before(depth - 1)));
   }
-  var pos = $pos.before(depth);
+  var pos = depth > 0 ? $pos.before(depth) : 0;
   var parent = isRootNode ? state.doc : $pos.node(depth - 1);
   var index = $pos.index(depth - 1);
   var before = index > 0 ? parent.child(index - 1) : null;

package/dist/cjs/pm-plugins/handle-mouse-down.js

@@ -4,7 +4,6 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.handleMouseDown = void 0;
-var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var handleMouseDown = exports.handleMouseDown = function handleMouseDown(api) {
   return function (view, event) {
     if (!(event.target instanceof HTMLElement)) {
@@ -20,7 +19,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(api) {
         return false;
       }
       api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.showDragHandleAt(rootPos, '', (_rootNode$type$name = rootNode.type.name) !== null && _rootNode$type$name !== void 0 ? _rootNode$type$name : '', undefined, rootPos, '', (_rootNode$type$name2 = rootNode.type.name) !== null && _rootNode$type$name2 !== void 0 ? _rootNode$type$name2 : ''));
-    } else if ((0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5')) {
+    } else {
       var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle]') !== null;
       api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
     }

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

@@ -251,8 +251,7 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
     menuTriggerBy = currentState.menuTriggerBy,
     isPMDragging = currentState.isPMDragging,
     isShiftDown = currentState.isShiftDown,
-    lastDragCancelled = currentState.lastDragCancelled,
-    isSelectedViaDragHandle = currentState.isSelectedViaDragHandle;
+    lastDragCancelled = currentState.lastDragCancelled;
   var isActiveNodeDeleted = false;
   var _getTrMetadata = (0, _transactions.getTrMetadata)(tr),
     from = _getTrMetadata.from,
@@ -443,12 +442,21 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
   var currentActiveDropTargetNode = isDragging ? currentState.activeDropTargetNode : undefined;
   if (api) {
     if ((0, _expValEquals.expValEquals)('platform_editor_block_controls_perf_optimization', 'isEnabled', true)) {
+      // If page is updated while dragging (likely by remote updates), we simply remove the drop targets
+      // and add them back when the use interacts with the editor again
+      if (isDropTargetsMissing) {
+        var oldDropTargetDecs = (0, _decorationsDropTarget.findDropTargetDecs)(decorations);
+        decorations = decorations.remove(oldDropTargetDecs);
+      }
       if (meta !== null && meta !== void 0 && meta.activeDropTargetNode) {
         currentActiveDropTargetNode = meta === null || meta === void 0 ? void 0 : meta.activeDropTargetNode;
-        var decos = (0, _decorationsDropTargetActive.getActiveDropTargetDecorations)(meta.activeDropTargetNode, newState, api, formatMessage, nodeViewPortalProviderAPI, latestActiveNode);
-        decorations = decorations.remove((0, _decorationsDropTarget.findDropTargetDecs)(decorations));
-        if (decos.length > 0) {
-          decorations = decorations.add(newState.doc, decos);
+        var _oldDropTargetDecs = (0, _decorationsDropTarget.findDropTargetDecs)(decorations);
+        var _getActiveDropTargetD = (0, _decorationsDropTargetActive.getActiveDropTargetDecorations)(meta.activeDropTargetNode, newState, api, _oldDropTargetDecs, formatMessage, nodeViewPortalProviderAPI, latestActiveNode),
+          decsToAdd = _getActiveDropTargetD.decsToAdd,
+          decsToRemove = _getActiveDropTargetD.decsToRemove;
+        decorations = decorations.remove(decsToRemove);
+        if (decsToAdd.length > 0) {
+          decorations = decorations.add(newState.doc, decsToAdd);
         }
       }
     } else if (meta !== null && meta !== void 0 && meta.isDragging || isDropTargetsMissing) {
@@ -484,7 +492,7 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
   } else if (meta !== null && meta !== void 0 && meta.toggleMenu) {
     isMenuOpenNew = !isMenuOpen;
   }
-  var isSelectedViaDragHandleNew = (meta === null || meta === void 0 ? void 0 : meta.isSelectedViaDragHandle) !== undefined && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5') ? meta === null || meta === void 0 ? void 0 : meta.isSelectedViaDragHandle : isSelectedViaDragHandle;
+  var isSelectedViaDragHandle = (meta === null || meta === void 0 ? void 0 : meta.isSelectedViaDragHandle) !== undefined && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (meta === null || meta === void 0 ? void 0 : meta.isSelectedViaDragHandle);
   return {
     decorations: decorations,
     activeNode: newActiveNode,
@@ -501,7 +509,7 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
     multiSelectDnD: multiSelectDnD,
     isShiftDown: (_meta$isShiftDown = meta === null || meta === void 0 ? void 0 : meta.isShiftDown) !== null && _meta$isShiftDown !== void 0 ? _meta$isShiftDown : isShiftDown,
     lastDragCancelled: (_meta$lastDragCancell = meta === null || meta === void 0 ? void 0 : meta.lastDragCancelled) !== null && _meta$lastDragCancell !== void 0 ? _meta$lastDragCancell : lastDragCancelled,
-    isSelectedViaDragHandle: isSelectedViaDragHandleNew
+    isSelectedViaDragHandle: isSelectedViaDragHandle
   };
 };
 var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, nodeViewPortalProviderAPI) {
@@ -651,7 +659,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           (0, _handleMouseOver.handleMouseOver)(view, event, api);
           return false;
         },
-        mousedown: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_2') ? (0, _handleMouseDown.handleMouseDown)(api) : undefined,
+        mousedown: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _handleMouseDown.handleMouseDown)(api) : undefined,
         keydown: function keydown(view, event) {
           if (isMultiSelectEnabled) {
             if (event.shiftKey && event.ctrlKey) {
@@ -675,11 +683,11 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
                 return true;
               }
             }
-            if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5')) {
+            if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
               var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
               api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
             }
-            if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5')) {
+            if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
               var _api$blockControls$sh2;
               if (api !== null && api !== void 0 && (_api$blockControls$sh2 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh2 !== void 0 && _api$blockControls$sh2.isSelectedViaDragHandle) {
                 api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(false));
@@ -712,11 +720,11 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
                 return true;
               }
             }
-            if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5')) {
+            if ((event.key === 'Enter' || event.key === ' ') && event.target instanceof HTMLElement && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
               var _isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle="true"]') !== null;
               api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(_isDragHandle));
             }
-            if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_5')) {
+            if ((event.key === 'ArrowLeft' || event.key === 'ArrowRight' || event.key === 'ArrowDown' || event.key === 'ArrowUp') && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
               var _api$blockControls$sh3;
               if (api !== null && api !== void 0 && (_api$blockControls$sh3 = api.blockControls.sharedState.currentState()) !== null && _api$blockControls$sh3 !== void 0 && _api$blockControls$sh3.isSelectedViaDragHandle) {
                 api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(false));

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

@@ -609,7 +609,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
     var node = parentPos !== undefined ? view.state.doc.nodeAt(parentPos) : undefined;
     var parentNodeType = node === null || node === void 0 ? void 0 : node.type.name;
     var supportsAnchor = CSS.supports('top', "anchor(".concat(anchorName, " start)")) && CSS.supports('left', "anchor(".concat(anchorName, " start)"));
-    var safeAnchorName = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_2') ? (0, _anchorName.refreshAnchorName)({
+    var safeAnchorName = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _anchorName.refreshAnchorName)({
       getPos: getPos,
       view: view,
       anchorName: anchorName
@@ -655,7 +655,7 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
     var node = parentPos !== undefined ? view.state.doc.nodeAt(parentPos) : undefined;
     var parentNodeType = node === null || node === void 0 ? void 0 : node.type.name;
     var supportsAnchor = CSS.supports('top', "anchor(".concat(anchorName, " start)")) && CSS.supports('left', "anchor(".concat(anchorName, " start)"));
-    var safeAnchorName = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_2') ? (0, _anchorName.refreshAnchorName)({
+    var safeAnchorName = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _anchorName.refreshAnchorName)({
       getPos: getPos,
       view: view,
       anchorName: anchorName

package/dist/cjs/ui/quick-insert-button.js

@@ -129,11 +129,11 @@ var TypeAheadControl = exports.TypeAheadControl = function TypeAheadControl(_ref
   // CHANGES - `removed editorExperiment('advanced_layouts', true) && isLayoutColumn` checks as quick insert button will not be positioned for layout column
   var calculatePosition = (0, _react.useCallback)(function () {
     var supportsAnchor = CSS.supports('top', "anchor(".concat(rootAnchorName, " start)")) && CSS.supports('left', "anchor(".concat(rootAnchorName, " start)"));
-    var safeAnchorName = (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_2') ? (0, _anchorName.refreshAnchorName)({
+    var safeAnchorName = (0, _anchorName.refreshAnchorName)({
       getPos: getPos,
       view: view,
       anchorName: rootAnchorName
-    }) : rootAnchorName;
+    });
     var dom = view.dom.querySelector("[data-drag-handler-anchor-name=\"".concat(safeAnchorName, "\"]"));
     var hasResizer = rootNodeType === 'table' || rootNodeType === 'mediaSingle';
     var isExtension = rootNodeType === 'extension' || rootNodeType === 'bodiedExtension';

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

@@ -55,14 +55,16 @@ export const canMoveNodeOrSliceToPos = (state, node, parent, index, $toPos, acti
   }
   return true;
 };
-export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api, formatMessage, nodeViewPortalProviderAPI, activeNode) => {
+export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api, existingDecs, formatMessage, nodeViewPortalProviderAPI, activeNode) => {
   if (!fg('platform_editor_block_controls_drop_target_mem_fix')) {
     unmountDecorations(nodeViewPortalProviderAPI, 'data-blocks-drop-target-container', 'data-blocks-drop-target-key');
   }
-  const decs = [];
+  const decsToAdd = [];
+  let decsToRemove = existingDecs.filter(dec => !!dec);
   const activeNodePos = activeNode === null || activeNode === void 0 ? void 0 : activeNode.pos;
   const $activeNodePos = typeof activeNodePos === 'number' && state.doc.resolve(activeNodePos);
   const $toPos = state.doc.resolve(activeDropTargetNode.pos);
+  const existingDecsPos = decsToRemove.map(dec => dec.from);
   const {
     parent,
     index,
@@ -78,32 +80,48 @@ export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api,
    * above the first child and below the last child.
    */
   if (isContainerNode(node)) {
+    const isEmptyContainer = node.childCount === 0 || node.childCount === 1 && isEmptyParagraph(node.firstChild);
+
     // can move to before first child
-    if (node.firstChild && canMoveNodeOrSliceToPos(state, node.firstChild, node, 0, state.doc.resolve(pos + 1),
-    // +1 to get the position of the first child
-    activeNode)) {
-      decs.push(createDropTargetDecoration(pos + 1, {
-        api,
-        prevNode: undefined,
-        nextNode: node.firstChild,
-        parentNode: node,
-        formatMessage,
-        dropTargetStyle: 'default'
-      }, nodeViewPortalProviderAPI, 1));
+    const posBeforeFirstChild = pos + 1; // +1 to get the position of the first child
+    if (node.firstChild && canMoveNodeOrSliceToPos(state, node.firstChild, node, 0, state.doc.resolve(posBeforeFirstChild), activeNode)) {
+      if (existingDecsPos.includes(posBeforeFirstChild)) {
+        // if the decoration already exists, we don't add it again.
+        decsToRemove = decsToRemove.filter(dec => dec.from !== posBeforeFirstChild);
+      } else {
+        decsToAdd.push(createDropTargetDecoration(posBeforeFirstChild, {
+          api,
+          prevNode: undefined,
+          nextNode: node.firstChild,
+          parentNode: node,
+          formatMessage,
+          dropTargetStyle: isEmptyContainer ? 'remainingHeight' : 'default'
+        }, nodeViewPortalProviderAPI, 1));
+      }
     }
 
     // can move to after last child
-    if (node.lastChild && canMoveNodeOrSliceToPos(state, node.lastChild, node, node.childCount - 1, state.doc.resolve(pos + node.nodeSize - 1),
-    // -1 to get the position after last child
-    activeNode)) {
-      decs.push(createDropTargetDecoration(pos + node.nodeSize - 1, {
-        api,
-        prevNode: node.lastChild,
-        nextNode: undefined,
-        parentNode: node,
-        formatMessage,
-        dropTargetStyle: 'default'
-      }, nodeViewPortalProviderAPI, -1));
+    // if the node is empty, we don't show the drop target at the end of the node
+    if (!isEmptyContainer) {
+      const posAfterLastChild = pos + node.nodeSize - 1; // -1 to get the position after last child
+
+      if (node.lastChild && canMoveNodeOrSliceToPos(state, node.lastChild, node, node.childCount - 1, state.doc.resolve(posAfterLastChild),
+      // -1 to get the position after last child
+      activeNode)) {
+        if (existingDecsPos.includes(posAfterLastChild)) {
+          // if the decoration already exists, we don't add it again.
+          decsToRemove = decsToRemove.filter(dec => dec.from !== posAfterLastChild);
+        } else {
+          decsToAdd.push(createDropTargetDecoration(posAfterLastChild, {
+            api,
+            prevNode: node.lastChild,
+            nextNode: undefined,
+            parentNode: node,
+            formatMessage,
+            dropTargetStyle: 'remainingHeight'
+          }, nodeViewPortalProviderAPI, -1));
+        }
+      }
     }
   }
 
@@ -115,24 +133,37 @@ export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api,
     const isInSupportedContainer = ['tableCell', 'tableHeader', 'layoutColumn'].includes((parent === null || parent === void 0 ? void 0 : parent.type.name) || '');
     const shouldShowFullHeight = isInSupportedContainer && (parent === null || parent === void 0 ? void 0 : parent.lastChild) === node && isEmptyParagraph(node);
     if (canMoveNodeOrSliceToPos(state, node, parent, index, $toPos, activeNode)) {
-      decs.push(createDropTargetDecoration(pos, {
-        api,
-        prevNode: before || undefined,
-        nextNode: node,
-        parentNode: parent || undefined,
-        formatMessage,
-        dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
-      }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+      if (existingDecsPos.includes(pos)) {
+        // if the decoration already exists, we don't add it again.
+        decsToRemove = decsToRemove.filter(dec => dec.from !== pos);
+      } else {
+        decsToAdd.push(createDropTargetDecoration(pos, {
+          api,
+          prevNode: before || undefined,
+          nextNode: node,
+          parentNode: parent || undefined,
+          formatMessage,
+          dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
+        }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+      }
     }
-    if (canMoveNodeOrSliceToPos(state, node, parent, index + 1, state.doc.resolve(pos + node.nodeSize), activeNode)) {
-      decs.push(createDropTargetDecoration(pos + node.nodeSize, {
-        api,
-        prevNode: node,
-        nextNode: after || undefined,
-        parentNode: parent || undefined,
-        formatMessage,
-        dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
-      }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+
+    // if the node is a container node, we show the drop target after the node
+    const posAfterNode = pos + node.nodeSize;
+    if (canMoveNodeOrSliceToPos(state, node, parent, index + 1, state.doc.resolve(posAfterNode), activeNode)) {
+      if (existingDecsPos.includes(posAfterNode)) {
+        // if the decoration already exists, we don't add it again.
+        decsToRemove = decsToRemove.filter(dec => dec.from !== posAfterNode);
+      } else {
+        decsToAdd.push(createDropTargetDecoration(posAfterNode, {
+          api,
+          prevNode: node,
+          nextNode: after || undefined,
+          parentNode: parent || undefined,
+          formatMessage,
+          dropTargetStyle: shouldShowFullHeight ? 'remainingHeight' : 'default'
+        }, nodeViewPortalProviderAPI, -1, undefined, isSameLayout));
+      }
     }
   }
   let rootNodeWithPos = {
@@ -143,14 +174,19 @@ export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api,
   // if the current node is not a top level node, we create one for advanced layout drop targets
   if (depth > 1) {
     const root = findSurroundingNodes(state, state.doc.resolve($toPos.before(2)));
-    decs.push(createDropTargetDecoration(root.pos, {
-      api,
-      prevNode: root.before || undefined,
-      nextNode: root.node,
-      parentNode: state.doc || undefined,
-      formatMessage,
-      dropTargetStyle: 'default'
-    }, nodeViewPortalProviderAPI, 0, undefined, false));
+    if (existingDecsPos.includes(root.pos)) {
+      // if the decoration already exists, we don't add it again.
+      decsToRemove = decsToRemove.filter(dec => dec.from !== root.pos);
+    } else {
+      decsToAdd.push(createDropTargetDecoration(root.pos, {
+        api,
+        prevNode: root.before || undefined,
+        nextNode: root.node,
+        parentNode: state.doc || undefined,
+        formatMessage,
+        dropTargetStyle: 'default'
+      }, nodeViewPortalProviderAPI, 0, undefined, false));
+    }
     rootNodeWithPos = {
       node: root.node,
       pos: root.pos
@@ -164,11 +200,17 @@ export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api,
         layoutSectionNode.descendants((childNode, childPos, parent, index) => {
           if (childNode.type.name === 'layoutColumn' && (parent === null || parent === void 0 ? void 0 : parent.type.name) === 'layoutSection' && index !== 0 // Not the first node
           ) {
-            decs.push(createLayoutDropTargetDecoration(rootNodeWithPos.pos + childPos + 1, {
-              api,
-              parent,
-              formatMessage
-            }, nodeViewPortalProviderAPI, undefined));
+            const currentPos = rootNodeWithPos.pos + childPos + 1;
+            if (existingDecsPos.includes(currentPos)) {
+              // if the decoration already exists, we don't add it again.
+              decsToRemove = decsToRemove.filter(dec => dec.from !== currentPos);
+            } else {
+              decsToAdd.push(createLayoutDropTargetDecoration(rootNodeWithPos.pos + childPos + 1, {
+                api,
+                parent,
+                formatMessage
+              }, nodeViewPortalProviderAPI, undefined));
+            }
           }
           return false;
         });
@@ -176,5 +218,8 @@ export const getActiveDropTargetDecorations = (activeDropTargetNode, state, api,
     }
   }
   defaultActiveAnchorTracker.emit(getNodeAnchor(rootNodeWithPos.node));
-  return decs;
+  return {
+    decsToAdd,
+    decsToRemove
+  };
 };