@atlaskit/editor-plugin-block-menu 6.1.0 → 6.1.1

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/editor-plugin-block-menu
 
+## 6.1.1
+
+### Patch Changes
+
+- [`57f499d6937db`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/57f499d6937db) -
+  Extract ExperienceCheckPopupMutation logic to be reusable for block menu experience tracking
+- [`7ea2e225c0abb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7ea2e225c0abb) -
+  [ux] Minor styling, wording changes for block menu and sync blocks
+- Updated dependencies
+
 ## 6.1.0
 
 ### Minor Changes

package/dist/cjs/editor-commands/transform-node-utils/wrapStep.js

@@ -12,7 +12,7 @@ var _utils2 = require("./utils");
  * Wraps nodes into the target container type.
  * When wrapping into expand, any expand children are converted to nestedExpand
  * since expand cannot be a direct child of expand.
- * 
+ *
  * Preserves breakout marks when both source and target nodes support resizing
  * (codeBlock, expand, layoutSection).
  */

package/dist/cjs/pm-plugins/experiences/block-menu-experiences.js

@@ -33,21 +33,23 @@ var getBlockMenuExperiencesPlugin = exports.getBlockMenuExperiencesPlugin = func
     }
     return popupTargetEl;
   };
+  var getEditorDom = function getEditorDom() {
+    var _editorView2;
+    if (((_editorView2 = editorView) === null || _editorView2 === void 0 ? void 0 : _editorView2.dom) instanceof HTMLElement) {
+      return editorView.dom;
+    }
+    return null;
+  };
   var blockMenuOpenExperience = new _experiences.Experience(_experiences.EXPERIENCE_ID.MENU_OPEN, {
     actionSubjectId: _analytics.ACTION_SUBJECT_ID.BLOCK_MENU,
     dispatchAnalyticsEvent: dispatchAnalyticsEvent,
     checks: [new _experiences.ExperienceCheckTimeout({
       durationMs: TIMEOUT_DURATION
-    }), new _experiences.ExperienceCheckDomMutation({
-      onDomMutation: _experienceCheckUtils.handleMenuOpenDomMutation,
-      observeConfig: function observeConfig() {
-        return {
-          target: getPopupsTarget(),
-          options: {
-            childList: true
-          }
-        };
-      }
+    }), new _experiences.ExperienceCheckPopupMutation({
+      nestedElementQuery: "[data-testid=\"".concat(_blockMenu.BLOCK_MENU_TEST_ID, "\"]"),
+      getTarget: getPopupsTarget,
+      getEditorDom: getEditorDom,
+      type: 'editorContent'
     })]
   });
   var actionObserveConfig = function actionObserveConfig() {

package/dist/cjs/pm-plugins/experiences/experience-check-utils.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.isDragHandleElement = exports.isBlockMenuVisible = exports.handleTransformDomMutation = exports.handleMoveDomMutation = exports.handleMenuOpenDomMutation = exports.handleDeleteDomMutation = exports.getParentDOMAtSelection = void 0;
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _blockMenu = require("@atlaskit/editor-common/block-menu");
 var _experiences = require("@atlaskit/editor-common/experiences");
 var _editorTables = require("@atlaskit/editor-tables");
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
@@ -31,7 +32,7 @@ var isBlockMenuVisible = exports.isBlockMenuVisible = function isBlockMenuVisibl
   if (!popupsTarget) {
     return false;
   }
-  return (0, _experiences.popupWithNestedElement)(popupsTarget, '[data-testid="editor-block-menu"]') !== null;
+  return (0, _experiences.popupWithNestedElement)(popupsTarget, "[data-testid=\"".concat(_blockMenu.BLOCK_MENU_TEST_ID, "\"]")) !== null;
 };
 
 /**
@@ -71,7 +72,7 @@ var isBlockMenuAddedInMutation = function isBlockMenuAddedInMutation(_ref) {
   return type === 'childList' && (0, _toConsumableArray2.default)(addedNodes).some(isBlockMenuWithinNode);
 };
 var isBlockMenuWithinNode = function isBlockMenuWithinNode(node) {
-  return (0, _experiences.popupWithNestedElement)(node, '[data-testid="editor-block-menu"]') !== null;
+  return (0, _experiences.popupWithNestedElement)(node, "[data-testid=\"".concat(_blockMenu.BLOCK_MENU_TEST_ID, "\"]")) !== null;
 };
 
 /**

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

@@ -36,7 +36,7 @@ var createPlugin = exports.createPlugin = function createPlugin(api) {
         }
 
         // Block further handling of key events when block menu is open
-        // Except for backspace/delete/copy/cut/paste/undo/redo/copy-link-to-block which should be handled by the selection preservation plugin
+        // Except for backspace/delete/copy/cut/paste/undo/redo/copy-link-to-selection which should be handled by the selection preservation plugin
         return (0, _shouldSuppressKeyboardEvent.shouldSuppressKeyboardEvent)(event);
       }
     }

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

@@ -12,7 +12,7 @@ exports.shouldSuppressKeyboardEvent = void 0;
  * - Backspace/Delete: Allow deleting selected content
  * - Copy/Cut/Paste: Allow clipboard operations (Cmd/Ctrl+C, Cmd/Ctrl+X, Cmd/Ctrl+V)
  * - Undo/Redo: Allow undo/redo operations (Cmd/Ctrl+Z, Cmd/Ctrl+Y)
- * - Copy Link to Block: Allow the keyboard shortcut (Cmd/Ctrl+Alt+A)
+ * - Copy Link to Selection: Allow the keyboard shortcut (Cmd/Ctrl+Alt+A)
  *
  * @param event - The keyboard event to check
  * @returns true if the event should be suppressed, false if it should be allowed

package/dist/cjs/ui/block-menu-components.js

@@ -22,6 +22,7 @@ var _moveDown = require("./move-down");
 var _moveUp = require("./move-up");
 var _suggestedItemsMenuSection = require("./suggested-items-menu-section");
 var _suggestedMenuItems = require("./suggested-menu-items");
+var _checkHasPreviousSectionContent = require("./utils/checkHasPreviousSectionContent");
 var _createMenuItemsMap = require("./utils/createMenuItemsMap");
 var _getSuggestedItemsFromSelection = require("./utils/getSuggestedItemsFromSelection");
 var MIN_NUMBER_OF_AVAILABLE_NATIVE_TRANSFORMS = 7;
@@ -142,7 +143,8 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
         },
         children = _ref3.children;
       return /*#__PURE__*/_react.default.createElement(_MenuSection.MenuSection, {
-        title: _messages.blockMenuMessages.create
+        title: _messages.blockMenuMessages.create,
+        hasSeparator: (0, _checkHasPreviousSectionContent.hasContentBeforeCreate)(api)
       }, children);
     }
   }, {
@@ -159,7 +161,8 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
         },
         children = _ref4.children;
       return /*#__PURE__*/_react.default.createElement(_MenuSection.MenuSection, {
-        title: _messages.blockMenuMessages.structure
+        title: _messages.blockMenuMessages.structure,
+        hasSeparator: (0, _checkHasPreviousSectionContent.hasContentBeforeStructure)(api)
       }, children);
     }
   }, {
@@ -177,7 +180,7 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
         children = _ref5.children;
       return /*#__PURE__*/_react.default.createElement(_MenuSection.MenuSection, {
         title: _messages.blockMenuMessages.headings,
-        hasSeparator: true
+        hasSeparator: (0, _checkHasPreviousSectionContent.hasContentBeforeHeadings)(api)
       }, children);
     }
   }, {

package/dist/cjs/ui/block-menu-renderer/fallbacks.js

@@ -10,14 +10,20 @@ var _reactIntlNext = require("react-intl-next");
 var _messages = require("@atlaskit/editor-common/messages");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
 var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/core/chevron-right"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var FallbackNestedMenu = function FallbackNestedMenu(_ref) {
   var children = _ref.children;
   var _useIntl = (0, _reactIntlNext.useIntl)(),
     formatMessage = _useIntl.formatMessage;
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarNestedDropdownMenu, {
     elemBefore: undefined,
     elemAfter: /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     text: formatMessage(_messages.blockMenuMessages.fallbackNestedMenu),
     enableMaxHeight: true,

package/dist/cjs/ui/block-menu.js

@@ -14,6 +14,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _css = require("@atlaskit/css");
 var _analytics = require("@atlaskit/editor-common/analytics");
+var _blockMenu = require("@atlaskit/editor-common/block-menu");
 var _errorBoundary = require("@atlaskit/editor-common/error-boundary");
 var _hooks = require("@atlaskit/editor-common/hooks");
 var _styles = require("@atlaskit/editor-common/styles");
@@ -100,7 +101,7 @@ var BlockMenuContent = function BlockMenuContent(_ref2) {
     return target.closest('[data-toolbar-nested-dropdown-menu]') !== null;
   };
   return /*#__PURE__*/_react.default.createElement(_compiled.Box, {
-    testId: "editor-block-menu",
+    testId: _blockMenu.BLOCK_MENU_TEST_ID,
     role: (0, _expValEquals.expValEquals)('platform_editor_enghealth_a11y_jan_fixes', 'isEnabled', true) ? 'menu' : undefined,
     ref: ref,
     xcss: (0, _css.cx)(styles.base, (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_2') && styles.maxWidthStyles, (0, _experiments.editorExperiment)('platform_synced_block', true) && styles.emptyMenuSectionStyles)

package/dist/cjs/ui/copy-link.js

@@ -88,15 +88,26 @@ var CopyLinkDropdownItemContent = function CopyLinkDropdownItemContent(_ref) {
   if (!(0, _platformFeatureFlags.fg)('platform_editor_adf_with_localid')) {
     return null;
   }
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Conditionally display message based on feature flag
+  // To clean up: remove the conditional and use only copyLinkToBlock message
+  var message = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? _messages.blockMenuMessages.copyLinkToBlock : _messages.blockMenuMessages.copyLinkToBlockOld;
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
     onClick: handleClick,
     elemBefore: /*#__PURE__*/_react.default.createElement(_link.default, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     elemAfter: shortcut ? /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarKeyboardShortcutHint, {
       shortcut: shortcut
     }) : undefined,
     ariaKeyshortcuts: shortcut
-  }, formatMessage(_messages.blockMenuMessages.copyLinkToBlock));
+  }, formatMessage(message));
 };
 var CopyLinkDropdownItem = exports.CopyLinkDropdownItem = (0, _reactIntlNext.injectIntl)(CopyLinkDropdownItemContent);

package/dist/cjs/ui/delete-button.js

@@ -14,6 +14,7 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _selection = require("@atlaskit/editor-common/selection");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
 var _delete = _interopRequireDefault(require("@atlaskit/icon/core/delete"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _box = require("@atlaskit/primitives/box");
 var _text = _interopRequireDefault(require("@atlaskit/primitives/text"));
 var _consts = require("./consts");
@@ -96,6 +97,11 @@ var DeleteDropdownItemContent = function DeleteDropdownItemContent(_ref) {
       onRemoveHoverDecoration();
     };
   }, [onRemoveHoverDecoration]);
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_box.Box, {
     onMouseEnter: onShowHoverDecoration,
     onMouseLeave: onRemoveHoverDecoration,
@@ -104,7 +110,8 @@ var DeleteDropdownItemContent = function DeleteDropdownItemContent(_ref) {
   }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
     elemBefore: /*#__PURE__*/_react.default.createElement(_delete.default, {
       color: "var(--ds-icon-danger, #C9372C)",
-      label: ""
+      label: "",
+      size: iconSize
     }),
     onClick: onClick,
     testId: _blockMenu.BLOCK_MENU_ACTION_TEST_ID.DELETE

package/dist/cjs/ui/flag.js

@@ -13,6 +13,7 @@ var _hooks = require("@atlaskit/editor-common/hooks");
 var _messages = require("@atlaskit/editor-common/messages");
 var _flag = _interopRequireWildcard(require("@atlaskit/flag"));
 var _checkCircle = _interopRequireDefault(require("@atlaskit/icon/core/check-circle"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _blockMenuPluginType = require("../blockMenuPluginType");
 var _main = require("../pm-plugins/main");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
@@ -46,6 +47,11 @@ var Flag = exports.Flag = function Flag(_ref) {
     api === null || api === void 0 || api.core.actions.focus();
   };
   var FlagComponent = flagMap[showFlag].autoDismiss ? _flag.AutoDismissFlag : _flag.default;
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_flag.FlagGroup, null, /*#__PURE__*/_react.default.createElement(FlagComponent, {
     onDismissed: onDismissed,
     title: formatMessage(title),
@@ -53,7 +59,8 @@ var Flag = exports.Flag = function Flag(_ref) {
     testId: showFlag,
     icon: /*#__PURE__*/_react.default.createElement(_checkCircle.default, {
       label: "",
-      color: "var(--ds-icon-success, #6A9A23)"
+      color: "var(--ds-icon-success, #6A9A23)",
+      size: iconSize
     })
   }));
 };

package/dist/cjs/ui/format-menu-nested.js

@@ -13,6 +13,7 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
 var _changes = _interopRequireDefault(require("@atlaskit/icon/core/changes"));
 var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/core/chevron-right"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _consts = require("./consts");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 var FormatMenuComponent = exports.FormatMenuComponent = function FormatMenuComponent(_ref) {
@@ -36,13 +37,20 @@ var FormatMenuComponent = exports.FormatMenuComponent = function FormatMenuCompo
       return tr;
     });
   }, [api]);
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarNestedDropdownMenu, {
     text: formatMessage(_messages.blockMenuMessages.turnInto),
     elemBefore: /*#__PURE__*/_react.default.createElement(_changes.default, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     elemAfter: /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     enableMaxHeight: true,
     onClick: handleClick,

package/dist/cjs/ui/move-down.js

@@ -16,6 +16,7 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _types = require("@atlaskit/editor-common/types");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
 var _arrowDown = _interopRequireDefault(require("@atlaskit/icon/core/arrow-down"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _blockMenuProvider = require("./block-menu-provider");
 var _consts = require("./consts");
 var _fixBlockMenuPositionAndScroll = require("./utils/fixBlockMenuPositionAndScroll");
@@ -67,11 +68,17 @@ var MoveDownDropdownItemContent = function MoveDownDropdownItemContent(_ref) {
       (0, _fixBlockMenuPositionAndScroll.fixBlockMenuPositionAndScroll)(newFirstNode);
     });
   };
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
     triggerRef: moveDownRef,
     onClick: handleClick,
     elemBefore: /*#__PURE__*/_react.default.createElement(_arrowDown.default, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     isDisabled: !canMoveDown,
     testId: _blockMenu.BLOCK_MENU_ACTION_TEST_ID.MOVE_DOWN

package/dist/cjs/ui/move-up.js

@@ -16,6 +16,7 @@ var _messages = require("@atlaskit/editor-common/messages");
 var _types = require("@atlaskit/editor-common/types");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
 var _arrowUp = _interopRequireDefault(require("@atlaskit/icon/core/arrow-up"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _blockMenuProvider = require("./block-menu-provider");
 var _consts = require("./consts");
 var _fixBlockMenuPositionAndScroll = require("./utils/fixBlockMenuPositionAndScroll");
@@ -65,11 +66,17 @@ var MoveUpDropdownItemContent = function MoveUpDropdownItemContent(_ref) {
       (0, _fixBlockMenuPositionAndScroll.fixBlockMenuPositionAndScroll)(newFirstNode);
     });
   };
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  var iconSize = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
     triggerRef: moveUpRef,
     onClick: handleClick,
     elemBefore: /*#__PURE__*/_react.default.createElement(_arrowUp.default, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     isDisabled: !canMoveUp,
     testId: _blockMenu.BLOCK_MENU_ACTION_TEST_ID.MOVE_UP

package/dist/cjs/ui/suggested-items-menu-section.js

@@ -9,7 +9,9 @@ var _react = _interopRequireDefault(require("react"));
 var _reactIntlNext = require("react-intl-next");
 var _messages = require("@atlaskit/editor-common/messages");
 var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _useSuggestedItems = require("./hooks/useSuggestedItems");
+var _checkHasPreviousSectionContent = require("./utils/checkHasPreviousSectionContent");
 var SuggestedItemsMenuSection = exports.SuggestedItemsMenuSection = /*#__PURE__*/_react.default.memo(function (_ref) {
   var api = _ref.api,
     children = _ref.children;
@@ -19,7 +21,14 @@ var SuggestedItemsMenuSection = exports.SuggestedItemsMenuSection = /*#__PURE__*
   if (suggestedItems.length === 0) {
     return null;
   }
+
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Conditionally show separator based on whether there's content after this section.
+  // Old behavior: always show separator (true).
+  // To clean up: remove conditional, keep only the hasCreateSectionContent || hasStructureSectionContent logic.
+  var hasSeparator = (0, _platformFeatureFlags.fg)('platform_editor_block_menu_v2_patch_3') ? (0, _checkHasPreviousSectionContent.hasCreateSectionContent)(api) || (0, _checkHasPreviousSectionContent.hasStructureSectionContent)(api) : true;
   return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
-    title: formatMessage(_messages.blockMenuMessages.suggested)
+    title: formatMessage(_messages.blockMenuMessages.suggested),
+    hasSeparator: hasSeparator
   }, children);
 });

package/dist/cjs/ui/utils/checkHasPreviousSectionContent.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.hasSuggestedSectionContent = exports.hasStructureSectionContent = exports.hasCreateSectionContent = exports.hasContentBeforeStructure = exports.hasContentBeforeHeadings = exports.hasContentBeforeCreate = void 0;
+var _blockMenu = require("@atlaskit/editor-common/block-menu");
+var _utils = require("../block-menu-renderer/utils");
+/**
+ * Checks if a section has any visible content (items that will render)
+ */
+var hasSectionContent = function hasSectionContent(sectionKey, api) {
+  var _api$blockMenu;
+  var blockMenuComponents = api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.getBlockMenuComponents();
+  if (!blockMenuComponents) {
+    return false;
+  }
+  var childrenMap = (0, _utils.buildChildrenMap)(blockMenuComponents);
+  var sectionMapKey = (0, _utils.getChildrenMapKey)(sectionKey, 'block-menu-section');
+  var sectionChildren = childrenMap.get(sectionMapKey) || [];
+  return sectionChildren.some(function (child) {
+    return (0, _utils.willComponentRender)(child, childrenMap);
+  });
+};
+
+/**
+ * Checks if the Suggested section has any visible content
+ */
+var hasSuggestedSectionContent = exports.hasSuggestedSectionContent = function hasSuggestedSectionContent(api) {
+  return hasSectionContent(_blockMenu.TRANSFORM_SUGGESTED_MENU_SECTION.key, api);
+};
+
+/**
+ * Checks if the Create section has any visible content
+ */
+var hasCreateSectionContent = exports.hasCreateSectionContent = function hasCreateSectionContent(api) {
+  return hasSectionContent(_blockMenu.TRANSFORM_CREATE_MENU_SECTION.key, api);
+};
+
+/**
+ * Checks if the Structure section has any visible content
+ */
+var hasStructureSectionContent = exports.hasStructureSectionContent = function hasStructureSectionContent(api) {
+  return hasSectionContent(_blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION.key, api);
+};
+
+/**
+ * Checks if there's any content before the Create section (i.e., Suggested section has content)
+ */
+var hasContentBeforeCreate = exports.hasContentBeforeCreate = function hasContentBeforeCreate(api) {
+  return hasSuggestedSectionContent(api);
+};
+
+/**
+ * Checks if there's any content before the Structure section (i.e., Create or Suggested sections have content)
+ */
+var hasContentBeforeStructure = exports.hasContentBeforeStructure = function hasContentBeforeStructure(api) {
+  return hasCreateSectionContent(api) || hasSuggestedSectionContent(api);
+};
+
+/**
+ * Checks if there's any content before the Headings section (i.e., Structure, Create, or Suggested sections have content)
+ */
+var hasContentBeforeHeadings = exports.hasContentBeforeHeadings = function hasContentBeforeHeadings(api) {
+  return hasStructureSectionContent(api) || hasCreateSectionContent(api) || hasSuggestedSectionContent(api);
+};

package/dist/cjs/ui/utils/fixBlockMenuPositionAndScroll.js

@@ -5,12 +5,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.fixBlockMenuPositionAndScroll = void 0;
 var _browserApis = require("@atlaskit/browser-apis");
+var _blockMenu = require("@atlaskit/editor-common/block-menu");
 var fixBlockMenuPositionAndScroll = exports.fixBlockMenuPositionAndScroll = function fixBlockMenuPositionAndScroll(firstSelectedNode) {
   var doc = (0, _browserApis.getDocument)();
   if (!doc) {
     return;
   }
-  var blockMenuEl = doc.querySelector('[data-testid="editor-block-menu"]');
+  var blockMenuEl = doc.querySelector("[data-testid=\"".concat(_blockMenu.BLOCK_MENU_TEST_ID, "\"]"));
   if (!(blockMenuEl !== null && blockMenuEl !== void 0 && blockMenuEl.parentElement)) {
     return;
   }

package/dist/es2019/editor-commands/transform-node-utils/wrapStep.js

@@ -7,7 +7,7 @@ import { convertExpandToNestedExpand } from './utils';
  * Wraps nodes into the target container type.
  * When wrapping into expand, any expand children are converted to nestedExpand
  * since expand cannot be a direct child of expand.
- * 
+ *
  * Preserves breakout marks when both source and target nodes support resizing
  * (codeBlock, expand, layoutSection).
  */

package/dist/es2019/pm-plugins/experiences/block-menu-experiences.js

@@ -1,10 +1,10 @@
 import { bind } from 'bind-event-listener';
 import { ACTION, ACTION_SUBJECT_ID } from '@atlaskit/editor-common/analytics';
-import { BLOCK_MENU_ACTION_TEST_ID } from '@atlaskit/editor-common/block-menu';
-import { Experience, EXPERIENCE_ID, ExperienceCheckDomMutation, ExperienceCheckTimeout, getPopupContainerFromEditorView } from '@atlaskit/editor-common/experiences';
+import { BLOCK_MENU_ACTION_TEST_ID, BLOCK_MENU_TEST_ID } from '@atlaskit/editor-common/block-menu';
+import { Experience, EXPERIENCE_ID, ExperienceCheckDomMutation, ExperienceCheckPopupMutation, ExperienceCheckTimeout, getPopupContainerFromEditorView } from '@atlaskit/editor-common/experiences';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { PluginKey } from '@atlaskit/editor-prosemirror/state';
-import { getParentDOMAtSelection, handleDeleteDomMutation, handleMenuOpenDomMutation, handleMoveDomMutation, handleTransformDomMutation, isBlockMenuVisible, isDragHandleElement } from './experience-check-utils';
+import { getParentDOMAtSelection, handleDeleteDomMutation, handleMoveDomMutation, handleTransformDomMutation, isBlockMenuVisible, isDragHandleElement } from './experience-check-utils';
 const TIMEOUT_DURATION = 1000;
 const pluginKey = new PluginKey('blockMenuExperiences');
 const START_METHOD = {
@@ -28,19 +28,23 @@ export const getBlockMenuExperiencesPlugin = ({
     }
     return popupTargetEl;
   };
+  const getEditorDom = () => {
+    var _editorView2;
+    if (((_editorView2 = editorView) === null || _editorView2 === void 0 ? void 0 : _editorView2.dom) instanceof HTMLElement) {
+      return editorView.dom;
+    }
+    return null;
+  };
   const blockMenuOpenExperience = new Experience(EXPERIENCE_ID.MENU_OPEN, {
     actionSubjectId: ACTION_SUBJECT_ID.BLOCK_MENU,
     dispatchAnalyticsEvent,
     checks: [new ExperienceCheckTimeout({
       durationMs: TIMEOUT_DURATION
-    }), new ExperienceCheckDomMutation({
-      onDomMutation: handleMenuOpenDomMutation,
-      observeConfig: () => ({
-        target: getPopupsTarget(),
-        options: {
-          childList: true
-        }
-      })
+    }), new ExperienceCheckPopupMutation({
+      nestedElementQuery: `[data-testid="${BLOCK_MENU_TEST_ID}"]`,
+      getTarget: getPopupsTarget,
+      getEditorDom,
+      type: 'editorContent'
     })]
   });
   const actionObserveConfig = () => ({

package/dist/es2019/pm-plugins/experiences/experience-check-utils.js

@@ -1,3 +1,4 @@
+import { BLOCK_MENU_TEST_ID } from '@atlaskit/editor-common/block-menu';
 import { popupWithNestedElement } from '@atlaskit/editor-common/experiences';
 import { CellSelection } from '@atlaskit/editor-tables';
 
@@ -21,7 +22,7 @@ export const isBlockMenuVisible = popupsTarget => {
   if (!popupsTarget) {
     return false;
   }
-  return popupWithNestedElement(popupsTarget, '[data-testid="editor-block-menu"]') !== null;
+  return popupWithNestedElement(popupsTarget, `[data-testid="${BLOCK_MENU_TEST_ID}"]`) !== null;
 };
 
 /**
@@ -64,7 +65,7 @@ const isBlockMenuAddedInMutation = ({
   return type === 'childList' && [...addedNodes].some(isBlockMenuWithinNode);
 };
 const isBlockMenuWithinNode = node => {
-  return popupWithNestedElement(node, '[data-testid="editor-block-menu"]') !== null;
+  return popupWithNestedElement(node, `[data-testid="${BLOCK_MENU_TEST_ID}"]`) !== null;
 };
 
 /**

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

@@ -30,7 +30,7 @@ export const createPlugin = api => {
         }
 
         // Block further handling of key events when block menu is open
-        // Except for backspace/delete/copy/cut/paste/undo/redo/copy-link-to-block which should be handled by the selection preservation plugin
+        // Except for backspace/delete/copy/cut/paste/undo/redo/copy-link-to-selection which should be handled by the selection preservation plugin
         return shouldSuppressKeyboardEvent(event);
       }
     }

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

@@ -6,7 +6,7 @@
  * - Backspace/Delete: Allow deleting selected content
  * - Copy/Cut/Paste: Allow clipboard operations (Cmd/Ctrl+C, Cmd/Ctrl+X, Cmd/Ctrl+V)
  * - Undo/Redo: Allow undo/redo operations (Cmd/Ctrl+Z, Cmd/Ctrl+Y)
- * - Copy Link to Block: Allow the keyboard shortcut (Cmd/Ctrl+Alt+A)
+ * - Copy Link to Selection: Allow the keyboard shortcut (Cmd/Ctrl+Alt+A)
  *
  * @param event - The keyboard event to check
  * @returns true if the event should be suppressed, false if it should be allowed

package/dist/es2019/ui/block-menu-components.js

@@ -14,6 +14,7 @@ import { MoveDownDropdownItem } from './move-down';
 import { MoveUpDropdownItem } from './move-up';
 import { SuggestedItemsMenuSection } from './suggested-items-menu-section';
 import { SuggestedMenuItems } from './suggested-menu-items';
+import { hasContentBeforeCreate, hasContentBeforeStructure, hasContentBeforeHeadings } from './utils/checkHasPreviousSectionContent';
 import { createMenuItemsMap } from './utils/createMenuItemsMap';
 import { getSuggestedItemsFromSelection } from './utils/getSuggestedItemsFromSelection';
 const MIN_NUMBER_OF_AVAILABLE_NATIVE_TRANSFORMS = 7;
@@ -124,7 +125,8 @@ const getTurnIntoMenuComponents = api => {
       children: null
     }) => {
       return /*#__PURE__*/React.createElement(MenuSection, {
-        title: blockMenuMessages.create
+        title: blockMenuMessages.create,
+        hasSeparator: hasContentBeforeCreate(api)
       }, children);
     }
   }, {
@@ -141,7 +143,8 @@ const getTurnIntoMenuComponents = api => {
       children: null
     }) => {
       return /*#__PURE__*/React.createElement(MenuSection, {
-        title: blockMenuMessages.structure
+        title: blockMenuMessages.structure,
+        hasSeparator: hasContentBeforeStructure(api)
       }, children);
     }
   }, {
@@ -159,7 +162,7 @@ const getTurnIntoMenuComponents = api => {
     }) => {
       return /*#__PURE__*/React.createElement(MenuSection, {
         title: blockMenuMessages.headings,
-        hasSeparator: true
+        hasSeparator: hasContentBeforeHeadings(api)
       }, children);
     }
   }, {

package/dist/es2019/ui/block-menu-renderer/fallbacks.js

@@ -3,16 +3,22 @@ import { useIntl } from 'react-intl-next';
 import { blockMenuMessages } from '@atlaskit/editor-common/messages';
 import { ToolbarDropdownItem, ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
 import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
+import { fg } from '@atlaskit/platform-feature-flags';
 const FallbackNestedMenu = ({
   children
 }) => {
   const {
     formatMessage
   } = useIntl();
+  // [FEATURE FLAG: platform_editor_block_menu_v2_patch_3]
+  // Adds size="small" to icons for better visual consistency in block menu.
+  // To clean up: remove conditional, keep only size="small" version.
+  const iconSize = fg('platform_editor_block_menu_v2_patch_3') ? 'small' : undefined;
   return /*#__PURE__*/React.createElement(ToolbarNestedDropdownMenu, {
     elemBefore: undefined,
     elemAfter: /*#__PURE__*/React.createElement(ChevronRightIcon, {
-      label: ""
+      label: "",
+      size: iconSize
     }),
     text: formatMessage(blockMenuMessages.fallbackNestedMenu),
     enableMaxHeight: true,