@atlaskit/editor-plugin-block-controls 4.1.10 → 4.1.12

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # @atlaskit/editor-plugin-block-controls
 
+## 4.1.12
+
+### Patch Changes
+
+- [`20d3223b57972`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/20d3223b57972) -
+  Opted out of debounced portal provider
+- [`e33be5daddd2b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e33be5daddd2b) -
+  ED-28892 Limited mode: adjust how we're triggering cleanup logic for block control plugin. Hook up
+  banner. Other misc setup.
+- Updated dependencies
+
+## 4.1.11
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 4.1.10
 
 ### Patch Changes

package/dist/cjs/blockControlsPlugin.js

@@ -65,14 +65,14 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
               rootAnchorName: rootAnchorName,
               rootNodeType: rootNodeType
             },
-            closeMenu: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? true : undefined
+            closeMenu: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && !(0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? true : undefined
           }));
           return tr;
         };
       },
       toggleBlockMenu: function toggleBlockMenu(options) {
         return function (_ref4) {
-          var _options$anchorName;
+          var _options$anchorName, _api$blockControls;
           var tr = _ref4.tr;
           var currMeta = tr.getMeta(_main.key);
           if (options !== null && options !== void 0 && options.closeMenu) {
@@ -94,12 +94,24 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
               anchorName: options === null || options === void 0 ? void 0 : options.anchorName
             }
           }));
+          var menuTriggerBy = api === null || api === void 0 || (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 || (_api$blockControls = _api$blockControls.sharedState.currentState()) === null || _api$blockControls === void 0 ? void 0 : _api$blockControls.menuTriggerBy;
+          if (menuTriggerBy === undefined || !!menuTriggerBy && menuTriggerBy === (options === null || options === void 0 ? void 0 : options.anchorName)) {
+            var _api$userIntent;
+            // Toggled from drag handle
+            var currentUserIntent = api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent;
+            if (currentUserIntent === 'blockMenuOpen') {
+              var _api$userIntent2;
+              api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent('default')({
+                tr: tr
+              });
+            }
+          }
           return tr;
         };
       },
       setNodeDragged: function setNodeDragged(getPos, anchorName, nodeType) {
         return function (_ref5) {
-          var _api$userIntent;
+          var _api$userIntent3;
           var tr = _ref5.tr;
           var pos = getPos();
           if (pos === undefined) {
@@ -123,7 +135,7 @@ var blockControlsPlugin = exports.blockControlsPlugin = function blockControlsPl
               tr: tr
             });
           }
-          api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || _api$userIntent.commands.setCurrentUserIntent('dragging')({
+          api === null || api === void 0 || (_api$userIntent3 = api.userIntent) === null || _api$userIntent3 === void 0 || _api$userIntent3.commands.setCurrentUserIntent('dragging')({
             tr: tr
           });
           return tr;

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

@@ -109,7 +109,9 @@ var createDropTargetDecoration = exports.createDropTargetDecoration = function c
         anchorRectCache: anchorRectCache,
         isSameLayout: isSameLayout
       }));
-    }, element, key);
+    }, element, key, undefined,
+    // @portal-render-immediately
+    true);
     return element;
   }, {
     type: _decorationsCommon.TYPE_DROP_TARGET_DEC,
@@ -140,7 +142,9 @@ var createLayoutDropTargetDecoration = exports.createLayoutDropTargetDecoration
         getPos: getPos,
         anchorRectCache: anchorRectCache
       }));
-    }, element, key);
+    }, element, key, undefined,
+    // @portal-render-immediately
+    true);
     return element;
   }, {
     type: _decorationsCommon.TYPE_DROP_TARGET_DEC,

package/dist/cjs/pm-plugins/decorations-quick-insert-button.js

@@ -100,7 +100,9 @@ var quickInsertButtonDecoration = exports.quickInsertButtonDecoration = function
         rootNodeType: rootNodeType !== null && rootNodeType !== void 0 ? rootNodeType : nodeType,
         anchorRectCache: anchorRectCache
       });
-    }, element, key);
+    }, element, key, undefined,
+    // @portal-render-immediately
+    true);
     return element;
   }, widgetSpec);
 };

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

@@ -4,6 +4,8 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.handleMouseDown = void 0;
+var _styles = require("@atlaskit/editor-common/styles");
+var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
 var handleMouseDown = exports.handleMouseDown = function handleMouseDown(api) {
   return function (view, event) {
     if (!(event.target instanceof HTMLElement)) {
@@ -20,7 +22,7 @@ var handleMouseDown = exports.handleMouseDown = function handleMouseDown(api) {
       }
       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 {
-      var isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle]') !== null;
+      var isDragHandle = event.target.closest((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? _styles.DRAG_HANDLE_SELECTOR : '[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));
     }
     return false;

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

@@ -131,7 +131,8 @@ var handleMouseOver = exports.handleMouseOver = function handleMouseOver(view, e
         api === null || api === void 0 || (_api$core2 = api.core) === null || _api$core2 === void 0 || _api$core2.actions.execute(api === null || api === void 0 || (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 ? void 0 : _api$blockControls3.commands.showDragHandleAt(targetPos, anchorName, nodeType));
       }
       if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)) {
-        if (isMenuOpen && originalAnchorName) {
+        var _api$userIntent;
+        if (isMenuOpen && originalAnchorName && (api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 || (_api$userIntent = _api$userIntent.sharedState.currentState()) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.currentUserIntent) === 'blockMenuOpen') {
           var _api$core3, _api$blockControls4;
           api === null || api === void 0 || (_api$core3 = api.core) === null || _api$core3 === void 0 || _api$core3.actions.execute(api === null || api === void 0 || (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.toggleBlockMenu());
         }

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

@@ -11,6 +11,7 @@ var _analytics = require("@atlaskit/editor-common/analytics");
 var _browser = require("@atlaskit/editor-common/browser");
 var _performanceMeasures = require("@atlaskit/editor-common/performance-measures");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+var _styles = require("@atlaskit/editor-common/styles");
 var _ui = require("@atlaskit/editor-common/ui");
 var _utils = require("@atlaskit/editor-common/utils");
 var _state = require("@atlaskit/editor-prosemirror/state");
@@ -75,7 +76,6 @@ var destroyFn = function destroyFn(api, editorView) {
         if ((0, _performanceMeasures.isMeasuring)(EDITOR_BLOCKS_DRAG_INIT)) {
           (0, _performanceMeasures.stopMeasure)(EDITOR_BLOCKS_DRAG_INIT, function (duration, startTime) {
             var _api$analytics;
-            var state = editorView.state;
             api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
               action: _analytics.ACTION.BLOCKS_DRAG_INIT,
               actionSubject: _analytics.ACTION_SUBJECT.EDITOR,
@@ -83,7 +83,7 @@ var destroyFn = function destroyFn(api, editorView) {
               attributes: {
                 duration: duration,
                 startTime: startTime,
-                nodesCount: state.doc.nodeSize
+                nodesCount: editorView === null || editorView === void 0 ? void 0 : editorView.state.doc.nodeSize
               }
             });
           });
@@ -195,7 +195,7 @@ var destroyFn = function destroyFn(api, editorView) {
                   dragInitializationDuration: dragInitializationDuration,
                   dropProcessingDuration: duration,
                   isCancelled: isCancelled,
-                  nodesCount: editorView.state.doc.nodeSize
+                  nodesCount: editorView === null || editorView === void 0 ? void 0 : editorView.state.doc.nodeSize
                 }
               });
             });
@@ -238,8 +238,8 @@ var getDecorationAtPos = function getDecorationAtPos(state, decorations, pos, to
   var nodeDecAtActivePos = nodeDecsAtActivePos.pop();
   return nodeDecAtActivePos;
 };
-var _apply = exports.apply = function apply(api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache) {
-  var _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _activeNode3, _activeNode4, _meta$isDragging2, _meta$isDragging3, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
+var _apply = exports.apply = function apply(api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache, resizeObserverWidth, pragmaticCleanup) {
+  var _api$limitedMode, _meta$multiSelectDnD, _activeNode, _activeNode2, _meta$activeNode$hand, _activeNode3, _activeNode4, _meta$isDragging2, _meta$isDragging3, _meta$toggleMenu, _meta$editorHeight, _meta$editorWidthLeft, _meta$editorWidthRigh, _meta$isPMDragging, _meta$isShiftDown, _meta$lastDragCancell;
   var activeNode = currentState.activeNode,
     decorations = currentState.decorations,
     isResizerResizing = currentState.isResizerResizing,
@@ -262,6 +262,18 @@ var _apply = exports.apply = function apply(api, formatMessage, tr, currentState
     isAllText = _getTrMetadata.isAllText,
     isReplacedWithSameSize = _getTrMetadata.isReplacedWithSameSize;
   var meta = tr.getMeta(key);
+  var hasDocumentSizeBreachedThreshold = api === null || api === void 0 || (_api$limitedMode = api.limitedMode) === null || _api$limitedMode === void 0 || (_api$limitedMode = _api$limitedMode.sharedState.currentState()) === null || _api$limitedMode === void 0 || (_api$limitedMode = _api$limitedMode.limitedModePluginKey.getState(newState)) === null || _api$limitedMode === void 0 ? void 0 : _api$limitedMode.documentSizeBreachesThreshold;
+  if (hasDocumentSizeBreachedThreshold) {
+    /**
+     * INFO: This if statement is a duplicate of the logic in destroy(). When the threshold is breached and we enter limited mode, we want to trigger the cleanup logic in destroy().
+     */
+    var editorContentArea = document.querySelector('.fabric-editor-popup-scroll-parent');
+    if (editorContentArea && resizeObserverWidth) {
+      resizeObserverWidth.unobserve(editorContentArea);
+    }
+    pragmaticCleanup === null || pragmaticCleanup === void 0 || pragmaticCleanup();
+    return currentState;
+  }
 
   // When steps exist, remap existing decorations, activeNode and multi select positions
   if (tr.docChanged) {
@@ -556,6 +568,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
   if (!(0, _anchorUtils.isAnchorSupported)()) {
     anchorRectCache = new _anchorUtils.AnchorRectCache();
   }
+  var resizeObserverWidth;
+  var pragmaticCleanup = null;
   return new _safePlugin.SafePlugin({
     key: key,
     state: {
@@ -563,13 +577,13 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
         return initialState;
       },
       apply: function apply(tr, currentState, _, newState) {
-        return _apply(api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache);
+        return _apply(api, formatMessage, tr, currentState, newState, flags, nodeViewPortalProviderAPI, anchorRectCache, resizeObserverWidth, pragmaticCleanup);
       }
     },
     props: {
       decorations: function decorations(state) {
-        var _api$limitedMode, _api$editorDisabled, _key$getState2;
-        if (api !== null && api !== void 0 && (_api$limitedMode = api.limitedMode) !== null && _api$limitedMode !== void 0 && (_api$limitedMode = _api$limitedMode.sharedState.currentState()) !== null && _api$limitedMode !== void 0 && _api$limitedMode.enabled) {
+        var _api$limitedMode2, _api$editorDisabled, _key$getState2;
+        if (api !== null && api !== void 0 && (_api$limitedMode2 = api.limitedMode) !== null && _api$limitedMode2 !== void 0 && (_api$limitedMode2 = _api$limitedMode2.sharedState.currentState()) !== null && _api$limitedMode2 !== void 0 && _api$limitedMode2.enabled) {
           return;
         }
         var isDisabled = api === null || api === void 0 || (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 || (_api$editorDisabled = _api$editorDisabled.sharedState.currentState()) === null || _api$editorDisabled === void 0 ? void 0 : _api$editorDisabled.editorDisabled;
@@ -628,8 +642,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           return false;
         },
         dragenter: function dragenter(view, event) {
-          var _api$limitedMode2;
-          if (api !== null && api !== void 0 && (_api$limitedMode2 = api.limitedMode) !== null && _api$limitedMode2 !== void 0 && (_api$limitedMode2 = _api$limitedMode2.sharedState.currentState()) !== null && _api$limitedMode2 !== void 0 && _api$limitedMode2.enabled) {
+          var _api$limitedMode3;
+          if (api !== null && api !== void 0 && (_api$limitedMode3 = api.limitedMode) !== null && _api$limitedMode3 !== void 0 && (_api$limitedMode3 = _api$limitedMode3.sharedState.currentState()) !== null && _api$limitedMode3 !== void 0 && _api$limitedMode3.enabled) {
             return;
           }
           if (isHTMLElement(event.target) && (0, _expValEquals.expValEquals)('platform_editor_block_controls_perf_optimization', 'isEnabled', true)) {
@@ -662,8 +676,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           }
         },
         dragstart: function dragstart(view) {
-          var _api$limitedMode3, _anchorRectCache2;
-          if (api !== null && api !== void 0 && (_api$limitedMode3 = api.limitedMode) !== null && _api$limitedMode3 !== void 0 && (_api$limitedMode3 = _api$limitedMode3.sharedState.currentState()) !== null && _api$limitedMode3 !== void 0 && _api$limitedMode3.enabled) {
+          var _api$limitedMode4, _anchorRectCache2;
+          if (api !== null && api !== void 0 && (_api$limitedMode4 = api.limitedMode) !== null && _api$limitedMode4 !== void 0 && (_api$limitedMode4 = _api$limitedMode4.sharedState.currentState()) !== null && _api$limitedMode4 !== void 0 && _api$limitedMode4.enabled) {
             return;
           }
           (0, _performanceMeasures.startMeasure)(EDITOR_BLOCKS_DRAG_INIT);
@@ -680,8 +694,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           })));
         },
         dragend: function dragend(view) {
-          var _api$limitedMode4, _key$getState3;
-          if (api !== null && api !== void 0 && (_api$limitedMode4 = api.limitedMode) !== null && _api$limitedMode4 !== void 0 && (_api$limitedMode4 = _api$limitedMode4.sharedState.currentState()) !== null && _api$limitedMode4 !== void 0 && _api$limitedMode4.enabled) {
+          var _api$limitedMode5, _key$getState3;
+          if (api !== null && api !== void 0 && (_api$limitedMode5 = api.limitedMode) !== null && _api$limitedMode5 !== void 0 && (_api$limitedMode5 = _api$limitedMode5.sharedState.currentState()) !== null && _api$limitedMode5 !== void 0 && _api$limitedMode5.enabled) {
             return;
           }
           var state = view.state,
@@ -701,23 +715,23 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           }
         },
         mouseover: function mouseover(view, event) {
-          var _api$limitedMode5;
-          if (api !== null && api !== void 0 && (_api$limitedMode5 = api.limitedMode) !== null && _api$limitedMode5 !== void 0 && (_api$limitedMode5 = _api$limitedMode5.sharedState.currentState()) !== null && _api$limitedMode5 !== void 0 && _api$limitedMode5.enabled) {
+          var _api$limitedMode6;
+          if (api !== null && api !== void 0 && (_api$limitedMode6 = api.limitedMode) !== null && _api$limitedMode6 !== void 0 && (_api$limitedMode6 = _api$limitedMode6.sharedState.currentState()) !== null && _api$limitedMode6 !== void 0 && _api$limitedMode6.enabled) {
             return;
           }
           (0, _handleMouseOver.handleMouseOver)(view, event, api);
           return false;
         },
         mousedown: function mousedown(view, event) {
-          var _api$limitedMode6;
-          if (api !== null && api !== void 0 && (_api$limitedMode6 = api.limitedMode) !== null && _api$limitedMode6 !== void 0 && (_api$limitedMode6 = _api$limitedMode6.sharedState.currentState()) !== null && _api$limitedMode6 !== void 0 && _api$limitedMode6.enabled) {
+          var _api$limitedMode7;
+          if (api !== null && api !== void 0 && (_api$limitedMode7 = api.limitedMode) !== null && _api$limitedMode7 !== void 0 && (_api$limitedMode7 = _api$limitedMode7.sharedState.currentState()) !== null && _api$limitedMode7 !== void 0 && _api$limitedMode7.enabled) {
             return;
           }
           return (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _handleMouseDown.handleMouseDown)(api)(view, event) : undefined;
         },
         keydown: function keydown(view, event) {
-          var _api$limitedMode7;
-          if (api !== null && api !== void 0 && (_api$limitedMode7 = api.limitedMode) !== null && _api$limitedMode7 !== void 0 && (_api$limitedMode7 = _api$limitedMode7.sharedState.currentState()) !== null && _api$limitedMode7 !== void 0 && _api$limitedMode7.enabled) {
+          var _api$limitedMode8;
+          if (api !== null && api !== void 0 && (_api$limitedMode8 = api.limitedMode) !== null && _api$limitedMode8 !== void 0 && (_api$limitedMode8 = _api$limitedMode8.sharedState.currentState()) !== null && _api$limitedMode8 !== void 0 && _api$limitedMode8.enabled) {
             return;
           }
           if (isMultiSelectEnabled) {
@@ -743,7 +757,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
               }
             }
             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;
+              var isDragHandle = event.target.closest((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? _styles.DRAG_HANDLE_SELECTOR : '[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')) {
@@ -780,7 +794,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
               }
             }
             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;
+              var _isDragHandle = event.target.closest((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true) ? _styles.DRAG_HANDLE_SELECTOR : '[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')) {
@@ -792,8 +806,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           }
         },
         keyup: function keyup(view, event) {
-          var _api$limitedMode8;
-          if (api !== null && api !== void 0 && (_api$limitedMode8 = api.limitedMode) !== null && _api$limitedMode8 !== void 0 && (_api$limitedMode8 = _api$limitedMode8.sharedState.currentState()) !== null && _api$limitedMode8 !== void 0 && _api$limitedMode8.enabled) {
+          var _api$limitedMode9;
+          if (api !== null && api !== void 0 && (_api$limitedMode9 = api.limitedMode) !== null && _api$limitedMode9 !== void 0 && (_api$limitedMode9 = _api$limitedMode9.sharedState.currentState()) !== null && _api$limitedMode9 !== void 0 && _api$limitedMode9.enabled) {
             return;
           }
           if (!event.repeat && event.key === 'Shift') {
@@ -803,8 +817,8 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
           }
         },
         blur: function blur(view, event) {
-          var _api$limitedMode9;
-          if (api !== null && api !== void 0 && (_api$limitedMode9 = api.limitedMode) !== null && _api$limitedMode9 !== void 0 && (_api$limitedMode9 = _api$limitedMode9.sharedState.currentState()) !== null && _api$limitedMode9 !== void 0 && _api$limitedMode9.enabled) {
+          var _api$limitedMode0;
+          if (api !== null && api !== void 0 && (_api$limitedMode0 = api.limitedMode) !== null && _api$limitedMode0 !== void 0 && (_api$limitedMode0 = _api$limitedMode0.sharedState.currentState()) !== null && _api$limitedMode0 !== void 0 && _api$limitedMode0.enabled) {
             return;
           }
           if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
@@ -834,7 +848,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
       var editorContentArea = editorView.dom.closest('.fabric-editor-popup-scroll-parent');
 
       // Use ResizeObserver to observe resizer (scroll-parent typically grows when resizing) and editor width changes
-      var resizeObserverWidth = new ResizeObserver((0, _rafSchd.default)(function (entries) {
+      resizeObserverWidth = new ResizeObserver((0, _rafSchd.default)(function (entries) {
         var pluginState = key.getState(editorView.state);
         if (!(pluginState !== null && pluginState !== void 0 && pluginState.isDragging)) {
           var isResizerResizing = !!dom.querySelector('.is-resizing');
@@ -863,13 +877,14 @@ var createPlugin = exports.createPlugin = function createPlugin(api, getIntl, no
       }
 
       // Start pragmatic monitors
-      var pragmaticCleanup = destroyFn(api, editorView);
+      pragmaticCleanup = destroyFn(api, editorView);
       return {
         destroy: function destroy() {
+          var _pragmaticCleanup;
           if (editorContentArea) {
             resizeObserverWidth.unobserve(editorContentArea);
           }
-          pragmaticCleanup();
+          (_pragmaticCleanup = pragmaticCleanup) === null || _pragmaticCleanup === void 0 || _pragmaticCleanup();
         }
       };
     }

package/dist/cjs/pm-plugins/utils/drag-handle-positions.js

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.shouldMaskNodeControls = exports.shouldBeSticky = exports.getTopPosition = exports.getNodeHeight = exports.getLeftPosition = exports.getControlHeightCSSValue = exports.getControlBottomCSSValue = void 0;
+var _styles = require("@atlaskit/editor-common/styles");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _consts = require("../../ui/consts");
 var STICKY_NODES = ['panel', 'table', 'expand', 'layoutSection', 'bodiedExtension'];
@@ -42,14 +43,14 @@ var getLeftPosition = exports.getLeftPosition = function getLeftPosition(dom, ty
     return 'auto';
   }
   if (!innerContainer) {
-    return type === 'layoutColumn' ? "".concat(dom.offsetLeft + dom.clientWidth / 2 - _consts.DRAG_HANDLE_HEIGHT / 2, "px") : "".concat(dom.offsetLeft - (0, _consts.dragHandleGap)(type, parentType) - _consts.DRAG_HANDLE_WIDTH, "px");
+    return type === 'layoutColumn' ? "".concat(dom.offsetLeft + dom.clientWidth / 2 - _consts.DRAG_HANDLE_HEIGHT / 2, "px") : "".concat(dom.offsetLeft - (0, _consts.dragHandleGap)(type, parentType) - _styles.DRAG_HANDLE_WIDTH, "px");
   }
 
   // There is a showMacroInteractionDesignUpdates prop in extension node wrapper that can add a relative span under the top level div
   // We need to adjust the left offset position of the drag handle to account for the relative span
   var relativeSpan = macroInteractionUpdates ? dom.querySelector('span.relative') : null;
   var leftAdjustment = relativeSpan ? relativeSpan.offsetLeft : 0;
-  return getComputedStyle(innerContainer).transform === 'none' ? "".concat(innerContainer.offsetLeft + leftAdjustment - (0, _consts.dragHandleGap)(type, parentType) - _consts.DRAG_HANDLE_WIDTH, "px") : "".concat(innerContainer.offsetLeft + leftAdjustment - innerContainer.offsetWidth / 2 - (0, _consts.dragHandleGap)(type, parentType) - _consts.DRAG_HANDLE_WIDTH, "px");
+  return getComputedStyle(innerContainer).transform === 'none' ? "".concat(innerContainer.offsetLeft + leftAdjustment - (0, _consts.dragHandleGap)(type, parentType) - _styles.DRAG_HANDLE_WIDTH, "px") : "".concat(innerContainer.offsetLeft + leftAdjustment - innerContainer.offsetWidth / 2 - (0, _consts.dragHandleGap)(type, parentType) - _styles.DRAG_HANDLE_WIDTH, "px");
 };
 
 // anchorRectCache seems to have a 100% cache miss rate

package/dist/cjs/ui/consts.js

@@ -4,19 +4,19 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.topPositionAdjustment = exports.spacingBetweenNodesForPreview = exports.spaceLookupMap = exports.rootElementGap = exports.nodeMargins = exports.getNestedNodeLeftPaddingMargin = exports.dropTargetMarginMap = exports.dragHandleGap = exports.STICKY_CONTROLS_TOP_MARGIN = exports.QUICK_INSERT_WIDTH = exports.QUICK_INSERT_LEFT_OFFSET = exports.QUICK_INSERT_HEIGHT = exports.QUICK_INSERT_DIMENSIONS = exports.DRAG_HANDLE_ZINDEX = exports.DRAG_HANDLE_WIDTH = exports.DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT = exports.DRAG_HANDLE_NARROW_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH = exports.DRAG_HANDLE_MAX_GAP = exports.DRAG_HANDLE_LAYOUT_SECTION_TOP_ADJUSTMENT = exports.DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_H6_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H5_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H4_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H3_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H2_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H1_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DEFAULT_GAP = exports.DRAG_HANDLE_BORDER_RADIUS = exports.DEFAULT_COLUMN_DISTRIBUTIONS = exports.BLOCK_MENU_WIDTH = exports.BLOCK_MENU_ENABLED = void 0;
+exports.topPositionAdjustment = exports.spacingBetweenNodesForPreview = exports.spaceLookupMap = exports.rootElementGap = exports.nodeMargins = exports.getNestedNodeLeftPaddingMargin = exports.dropTargetMarginMap = exports.dragHandleGap = exports.STICKY_CONTROLS_TOP_MARGIN = exports.QUICK_INSERT_WIDTH = exports.QUICK_INSERT_LEFT_OFFSET = exports.QUICK_INSERT_HEIGHT = exports.QUICK_INSERT_DIMENSIONS = exports.DRAG_HANDLE_ZINDEX = exports.DRAG_HANDLE_PARAGRAPH_TOP_ADJUSTMENT = exports.DRAG_HANDLE_NARROW_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_SHIFT_CLICK_DEPTH = exports.DRAG_HANDLE_MAX_GAP = exports.DRAG_HANDLE_LAYOUT_SECTION_TOP_ADJUSTMENT = exports.DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_H6_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H5_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H4_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H3_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H2_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H1_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DEFAULT_GAP = exports.DRAG_HANDLE_BORDER_RADIUS = exports.DEFAULT_COLUMN_DISTRIBUTIONS = exports.BLOCK_MENU_WIDTH = exports.BLOCK_MENU_ENABLED = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _styles = require("@atlaskit/editor-common/styles");
 var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _dropTargetMarginMap;
 var DRAG_HANDLE_HEIGHT = exports.DRAG_HANDLE_HEIGHT = 24;
-var DRAG_HANDLE_WIDTH = exports.DRAG_HANDLE_WIDTH = 12;
 var DRAG_HANDLE_BORDER_RADIUS = exports.DRAG_HANDLE_BORDER_RADIUS = 4;
 var DRAG_HANDLE_ZINDEX = exports.DRAG_HANDLE_ZINDEX = _editorSharedStyles.akRichMediaResizeZIndex + _editorSharedStyles.akEditorUnitZIndex; //place above legacy resizer
 var DRAG_HANDLE_DEFAULT_GAP = exports.DRAG_HANDLE_DEFAULT_GAP = 8;
 var DRAG_HANDLE_NARROW_GAP = exports.DRAG_HANDLE_NARROW_GAP = 4;
 var DRAG_HANDLE_MAX_GAP = exports.DRAG_HANDLE_MAX_GAP = 12;
-var DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = DRAG_HANDLE_WIDTH + DRAG_HANDLE_MAX_GAP;
+var DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = exports.DRAG_HANDLE_MAX_WIDTH_PLUS_GAP = _styles.DRAG_HANDLE_WIDTH + DRAG_HANDLE_MAX_GAP;
 var DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = exports.DRAG_HANDLE_DIVIDER_TOP_ADJUSTMENT = 4 + 2; // 4px for the divider vertical padding and 2px for the divider height
 var DRAG_HANDLE_H1_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H1_TOP_ADJUSTMENT = 5;
 var DRAG_HANDLE_H2_TOP_ADJUSTMENT = exports.DRAG_HANDLE_H2_TOP_ADJUSTMENT = 2;
@@ -94,7 +94,7 @@ var getNestedNodeLeftPaddingMargin = exports.getNestedNodeLeftPaddingMargin = fu
     case 'tableHeader':
       return '8px';
     default:
-      return "".concat(DRAG_HANDLE_WIDTH + DRAG_HANDLE_NARROW_GAP, "px");
+      return "".concat(_styles.DRAG_HANDLE_WIDTH + DRAG_HANDLE_NARROW_GAP, "px");
   }
 };
 var topPositionAdjustment = exports.topPositionAdjustment = function topPositionAdjustment(nodeType) {

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

@@ -108,7 +108,7 @@ var dragHandleButtonStyles = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: _consts2.DRAG_HANDLE_HEIGHT,
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  width: _consts2.DRAG_HANDLE_WIDTH,
+  width: _styles.DRAG_HANDLE_WIDTH,
   border: 'none',
   background: 'transparent',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -154,7 +154,7 @@ var dragHandleButtonStylesOld = (0, _react2.css)({
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
   height: _consts2.DRAG_HANDLE_HEIGHT,
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
-  width: _consts2.DRAG_HANDLE_WIDTH,
+  width: _styles.DRAG_HANDLE_WIDTH,
   border: 'none',
   background: 'transparent',
   // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values -- Ignored via go/DSP-18766
@@ -675,8 +675,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
     if (supportsAnchor) {
       var bottom = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlBottomCSSValue)(safeAnchorName, isSticky, isTopLevelNode, isLayoutColumn) : {};
       return _objectSpread({
-        left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
-        top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
+        left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
+        top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
       }, bottom);
     }
     var height = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlHeightCSSValue)((0, _dragHandlePositions.getNodeHeight)(dom, safeAnchorName, anchorRectCache) || 0, isSticky, isTopLevelNode, "".concat(_consts2.DRAG_HANDLE_HEIGHT), isLayoutColumn) : {};
@@ -721,8 +721,8 @@ var DragHandle = exports.DragHandle = function DragHandle(_ref) {
     if (supportsAnchor) {
       var bottom = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlBottomCSSValue)(safeAnchorName, isSticky, isTopLevelNode, isLayoutColumn) : {};
       return _objectSpread({
-        left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
-        top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_consts2.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
+        left: isEdgeCase ? "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _dragHandlePositions.getLeftPosition)(dom, nodeType, innerContainer, isMacroInteractionUpdates, parentNodeType), ")") : (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc((anchor(".concat(safeAnchorName, " right) + anchor(").concat(safeAnchorName, " left))/2 - ").concat(_consts2.DRAG_HANDLE_HEIGHT / 2, "px)") : "calc(anchor(".concat(safeAnchorName, " start) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px - ").concat((0, _consts2.dragHandleGap)(nodeType, parentNodeType), "px)"),
+        top: (0, _experiments.editorExperiment)('advanced_layouts', true) && isLayoutColumn ? "calc(anchor(".concat(safeAnchorName, " top) - ").concat(_styles.DRAG_HANDLE_WIDTH, "px)") : "calc(anchor(".concat(safeAnchorName, " start) + ").concat((0, _consts2.topPositionAdjustment)(nodeType), "px)")
       }, bottom);
     }
     var height = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? (0, _dragHandlePositions.getControlHeightCSSValue)((0, _dragHandlePositions.getNodeHeight)(dom, safeAnchorName, anchorRectCache) || 0, isSticky, isTopLevelNode, "".concat(_consts2.DRAG_HANDLE_HEIGHT), isLayoutColumn) : {};

package/dist/cjs/ui/global-styles.js

@@ -74,13 +74,13 @@ var extendedHoverZone = function extendedHoverZone() {
     content: '""',
     position: 'absolute',
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
-    top: "".concat(-_consts.DRAG_HANDLE_WIDTH / 2, "px"),
+    top: "".concat(-_styles.DRAG_HANDLE_WIDTH / 2, "px"),
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
     left: 0,
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-unsafe-values, @atlaskit/ui-styling-standard/no-imported-style-values
     width: '100%',
     // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/ui-styling-standard/no-unsafe-values
-    height: "".concat(_consts.DRAG_HANDLE_WIDTH, "px"),
+    height: "".concat(_styles.DRAG_HANDLE_WIDTH, "px"),
     cursor: 'default',
     zIndex: 1
   })), 'hr[data-drag-handler-anchor-name]', {

package/dist/es2019/blockControlsPlugin.js

@@ -55,14 +55,14 @@ export const blockControlsPlugin = ({
           rootAnchorName,
           rootNodeType
         },
-        closeMenu: editorExperiment('platform_editor_controls', 'variant1') ? true : undefined
+        closeMenu: editorExperiment('platform_editor_controls', 'variant1') && !expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? true : undefined
       });
       return tr;
     },
     toggleBlockMenu: options => ({
       tr
     }) => {
-      var _options$anchorName;
+      var _options$anchorName, _api$blockControls, _api$blockControls$sh;
       const currMeta = tr.getMeta(key);
       if (options !== null && options !== void 0 && options.closeMenu) {
         tr.setMeta(key, {
@@ -86,12 +86,24 @@ export const blockControlsPlugin = ({
           anchorName: options === null || options === void 0 ? void 0 : options.anchorName
         }
       });
+      const menuTriggerBy = api === null || api === void 0 ? void 0 : (_api$blockControls = api.blockControls) === null || _api$blockControls === void 0 ? void 0 : (_api$blockControls$sh = _api$blockControls.sharedState.currentState()) === null || _api$blockControls$sh === void 0 ? void 0 : _api$blockControls$sh.menuTriggerBy;
+      if (menuTriggerBy === undefined || !!menuTriggerBy && menuTriggerBy === (options === null || options === void 0 ? void 0 : options.anchorName)) {
+        var _api$userIntent, _api$userIntent$share;
+        // Toggled from drag handle
+        const currentUserIntent = api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : (_api$userIntent$share = _api$userIntent.sharedState.currentState()) === null || _api$userIntent$share === void 0 ? void 0 : _api$userIntent$share.currentUserIntent;
+        if (currentUserIntent === 'blockMenuOpen') {
+          var _api$userIntent2;
+          api === null || api === void 0 ? void 0 : (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 ? void 0 : _api$userIntent2.commands.setCurrentUserIntent('default')({
+            tr
+          });
+        }
+      }
       return tr;
     },
     setNodeDragged: (getPos, anchorName, nodeType) => ({
       tr
     }) => {
-      var _api$userIntent;
+      var _api$userIntent3;
       const pos = getPos();
       if (pos === undefined) {
         return tr;
@@ -115,7 +127,7 @@ export const blockControlsPlugin = ({
           tr
         });
       }
-      api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('dragging')({
+      api === null || api === void 0 ? void 0 : (_api$userIntent3 = api.userIntent) === null || _api$userIntent3 === void 0 ? void 0 : _api$userIntent3.commands.setCurrentUserIntent('dragging')({
         tr
       });
       return tr;

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

@@ -97,7 +97,9 @@ export const createDropTargetDecoration = (pos, props, nodeViewPortalProviderAPI
       getPos,
       anchorRectCache,
       isSameLayout
-    }), element, key);
+    }), element, key, undefined,
+    // @portal-render-immediately
+    true);
     return element;
   }, {
     type: TYPE_DROP_TARGET_DEC,
@@ -127,7 +129,9 @@ export const createLayoutDropTargetDecoration = (pos, props, nodeViewPortalProvi
       ...props,
       getPos,
       anchorRectCache
-    }), element, key);
+    }), element, key, undefined,
+    // @portal-render-immediately
+    true);
     return element;
   }, {
     type: TYPE_DROP_TARGET_DEC,

package/dist/es2019/pm-plugins/decorations-quick-insert-button.js

@@ -90,7 +90,9 @@ export const quickInsertButtonDecoration = ({
       rootAnchorName,
       rootNodeType: rootNodeType !== null && rootNodeType !== void 0 ? rootNodeType : nodeType,
       anchorRectCache
-    }), element, key);
+    }), element, key, undefined,
+    // @portal-render-immediately
+    true);
     return element;
   }, widgetSpec);
 };

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

@@ -1,3 +1,5 @@
+import { DRAG_HANDLE_SELECTOR } from '@atlaskit/editor-common/styles';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 export const handleMouseDown = api => (view, event) => {
   if (!(event.target instanceof HTMLElement)) {
     return false;
@@ -13,7 +15,7 @@ export const handleMouseDown = api => (view, event) => {
     }
     api === null || api === void 0 ? 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 {
-    const isDragHandle = event.target.closest('[data-editor-block-ctrl-drag-handle]') !== null;
+    const isDragHandle = event.target.closest(expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true) ? DRAG_HANDLE_SELECTOR : '[data-editor-block-ctrl-drag-handle]') !== null;
     api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : api.blockControls.commands.setSelectedViaDragHandle(isDragHandle));
   }
   return false;

package/dist/es2019/pm-plugins/handle-mouse-over.js

@@ -126,7 +126,8 @@ export const handleMouseOver = (view, event, api) => {
         api === null || api === void 0 ? void 0 : (_api$core2 = api.core) === null || _api$core2 === void 0 ? void 0 : _api$core2.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls3 = api.blockControls) === null || _api$blockControls3 === void 0 ? void 0 : _api$blockControls3.commands.showDragHandleAt(targetPos, anchorName, nodeType));
       }
       if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
-        if (isMenuOpen && originalAnchorName) {
+        var _api$userIntent, _api$userIntent$share;
+        if (isMenuOpen && originalAnchorName && (api === null || api === void 0 ? void 0 : (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : (_api$userIntent$share = _api$userIntent.sharedState.currentState()) === null || _api$userIntent$share === void 0 ? void 0 : _api$userIntent$share.currentUserIntent) === 'blockMenuOpen') {
           var _api$core3, _api$blockControls4;
           api === null || api === void 0 ? void 0 : (_api$core3 = api.core) === null || _api$core3 === void 0 ? void 0 : _api$core3.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockControls4 = api.blockControls) === null || _api$blockControls4 === void 0 ? void 0 : _api$blockControls4.commands.toggleBlockMenu());
         }