@atlaskit/editor-plugin-block-menu 5.2.10 → 5.2.12

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

@@ -0,0 +1,19 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SuggestedMenuItems = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _useSuggestedItems = require("./hooks/useSuggestedItems");
+var SuggestedMenuItems = exports.SuggestedMenuItems = /*#__PURE__*/_react.default.memo(function (_ref) {
+  var api = _ref.api;
+  var suggestedItems = (0, _useSuggestedItems.useSuggestedItems)(api);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, suggestedItems.map(function (item) {
+    var ItemComponent = item.component;
+    return ItemComponent ? /*#__PURE__*/_react.default.createElement(ItemComponent, {
+      key: item.key
+    }) : null;
+  }));
+});

package/dist/cjs/ui/utils/suggested-items-rank.js

@@ -43,7 +43,7 @@ var BLOCK_MENU_NODE_TYPES = exports.BLOCK_MENU_NODE_TYPES = {
   EMBED_CARD: 'embedCard',
   TABLE: 'table'
 };
-var TRANSFORM_SUGGESTED_ITEMS_RANK = exports.TRANSFORM_SUGGESTED_ITEMS_RANK = (_TRANSFORM_SUGGESTED_ = {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_TRANSFORM_SUGGESTED_, BLOCK_MENU_NODE_TYPES.PARAGRAPH, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_HEADINGS_H2_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_HEADINGS_H3_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.EXPAND, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BLOCKQUOTE, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.LAYOUT_SECTION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_HEADINGS_H2_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.PANEL, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.CODE_BLOCK, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.DECISION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BULLET_LIST, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.ORDERED_LIST, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.HEADING, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_HEADINGS_H2_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 300)), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_TRANSFORM_SUGGESTED_, BLOCK_MENU_NODE_TYPES.TASK_LIST, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.MEDIA_SINGLE, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.EXTENSION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BODIED_EXTENSION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BLOCK_CARD, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 200)), BLOCK_MENU_NODE_TYPES.EMBED_CARD, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 200)), BLOCK_MENU_NODE_TYPES.TABLE, (0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 200)));
+var TRANSFORM_SUGGESTED_ITEMS_RANK = exports.TRANSFORM_SUGGESTED_ITEMS_RANK = (_TRANSFORM_SUGGESTED_ = {}, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_TRANSFORM_SUGGESTED_, BLOCK_MENU_NODE_TYPES.PARAGRAPH, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_HEADINGS_H1_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_HEADINGS_H2_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.EXPAND, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BLOCKQUOTE, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.LAYOUT_SECTION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.PANEL, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.CODE_BLOCK, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.DECISION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BULLET_LIST, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.ORDERED_LIST, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.HEADING, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 300)), (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)(_TRANSFORM_SUGGESTED_, BLOCK_MENU_NODE_TYPES.TASK_LIST, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.MEDIA_SINGLE, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.EXTENSION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 300)), BLOCK_MENU_NODE_TYPES.BODIED_EXTENSION, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, _blockMenu.TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key, 100), _blockMenu.TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key, 200), _blockMenu.TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key, 300)));
 var getSuggestedItemsForNodeType = exports.getSuggestedItemsForNodeType = function getSuggestedItemsForNodeType(nodeType) {
   return TRANSFORM_SUGGESTED_ITEMS_RANK[nodeType];
 };

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

@@ -84,9 +84,9 @@ const TRANSFORM_STEPS_OVERRIDE = {
     decisionList: [unwrapStep, wrapBlockquoteToDecisionListStep]
   },
   layoutSection: {
-    blockquote: [unwrapLayoutStep, wrapStep],
+    blockquote: [unwrapLayoutStep, wrapMixedContentStep],
     expand: [unwrapLayoutStep, wrapStep],
-    panel: [unwrapLayoutStep, wrapStep],
+    panel: [unwrapLayoutStep, wrapMixedContentStep],
     codeBlock: [unwrapLayoutStep, flattenStep, wrapStep],
     paragraph: [unwrapLayoutStep]
   },

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

@@ -64,7 +64,7 @@ export const expandSelectionToBlockRange = (selection, schema) => {
   const {
     nodes
   } = schema;
-  const nodesNeedToExpandRange = [nodes.listItem, nodes.taskItem];
+  const nodesNeedToExpandRange = [nodes.bulletList, nodes.orderedList, nodes.taskList, nodes.listItem, nodes.taskItem];
 
   // when adding nodes.tableRow, tableHeader, tableCell in nodesNeedToExpandRang,
   // expandToBlockRange does not return expected table start position, sometimes even freeze editor
@@ -73,10 +73,11 @@ export const expandSelectionToBlockRange = (selection, schema) => {
     const table = findTable(selection);
     if (table) {
       const $from = selection.$from.doc.resolve(table.pos);
-      const $to = selection.$from.doc.resolve(table.pos + table.node.nodeSize);
+      const $to = selection.$from.doc.resolve(table.pos + table.node.nodeSize - 1);
       return {
         $from,
-        $to
+        $to,
+        range: $from.blockRange($to)
       };
     }
   }
@@ -123,7 +124,26 @@ export const convertNestedExpandToExpand = (node, schema) => {
     title: ((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.title) || ''
   }, node.content);
 };
+
+/**
+ * Converts an expand to a nestedExpand node.
+ * When placing an expand inside another expand, it must become a nestedExpand
+ * since expand cannot be a direct child of expand.
+ */
+export const convertExpandToNestedExpand = (node, schema) => {
+  var _node$attrs2;
+  const nestedExpandType = schema.nodes.nestedExpand;
+  if (!nestedExpandType) {
+    return null;
+  }
+  return nestedExpandType.createAndFill({
+    title: ((_node$attrs2 = node.attrs) === null || _node$attrs2 === void 0 ? void 0 : _node$attrs2.title) || ''
+  }, node.content);
+};
 export const getBlockNodesInRange = range => {
+  if (range.startIndex === range.endIndex) {
+    return [];
+  }
   if (range.endIndex - range.startIndex <= 1) {
     return [range.parent.child(range.startIndex)];
   }

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

@@ -1,9 +1,29 @@
+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.
+ */
 export const wrapStep = (nodes, context) => {
   const {
     schema,
     targetNodeTypeName
   } = context;
-  const outputNode = schema.nodes[targetNodeTypeName].createAndFill({}, nodes);
+
+  // When wrapping into expand, convert any expand children to nestedExpand
+  // since expand cannot be a direct child of expand
+  let processedNodes = nodes;
+  if (targetNodeTypeName === 'expand') {
+    processedNodes = nodes.map(node => {
+      if (node.type.name === 'expand') {
+        const nestedExpandNode = convertExpandToNestedExpand(node, schema);
+        return nestedExpandNode !== null && nestedExpandNode !== void 0 ? nestedExpandNode : node;
+      }
+      return node;
+    });
+  }
+  const outputNode = schema.nodes[targetNodeTypeName].createAndFill({}, processedNodes);
   if (outputNode) {
     return [outputNode];
   }

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

@@ -9,7 +9,8 @@ import { FormatMenuComponent } from './format-menu-nested';
 import { FormatMenuSection } from './format-menu-section';
 import { MoveDownDropdownItem } from './move-down';
 import { MoveUpDropdownItem } from './move-up';
-import { SuggestedItemsRenderer } from './suggested-items-renderer';
+import { SuggestedItemsMenuSection } from './suggested-items-menu-section';
+import { SuggestedMenuItems } from './suggested-menu-items';
 const getMoveUpMoveDownMenuComponents = api => {
   return [{
     type: 'block-menu-item',
@@ -61,9 +62,13 @@ const getTurnIntoMenuComponents = api => {
       key: TRANSFORM_MENU_ITEM.key,
       rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_SUGGESTED_MENU_SECTION.key]
     },
-    component: () => /*#__PURE__*/React.createElement(SuggestedItemsRenderer, {
+    component: ({
+      children
+    } = {
+      children: null
+    }) => /*#__PURE__*/React.createElement(SuggestedItemsMenuSection, {
       api: api
-    })
+    }, children)
   }, {
     type: 'block-menu-item',
     key: TRANSFORM_SUGGESTED_MENU_ITEM.key,
@@ -71,7 +76,10 @@ const getTurnIntoMenuComponents = api => {
       type: 'block-menu-section',
       key: TRANSFORM_SUGGESTED_MENU_SECTION.key,
       rank: TRANSFORM_SUGGESTED_MENU_SECTION_RANK[TRANSFORM_SUGGESTED_MENU_ITEM.key]
-    }
+    },
+    component: () => /*#__PURE__*/React.createElement(SuggestedMenuItems, {
+      api: api
+    })
   }, {
     type: 'block-menu-section',
     key: TRANSFORM_CREATE_MENU_SECTION.key,

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

@@ -0,0 +1,31 @@
+import React from 'react';
+import { BlockMenuComponents } from './BlockMenuComponents';
+import { getChildrenMapKey, willComponentRender } from './utils';
+/**
+ * Renders the given registered component based on its type
+ */
+export const BlockMenuComponent = ({
+  registeredComponent,
+  childrenMap,
+  fallbacks
+}) => {
+  if (registeredComponent.type === 'block-menu-item') {
+    const ItemComponent = registeredComponent.component || fallbacks['block-menu-item'];
+    return /*#__PURE__*/React.createElement(ItemComponent, {
+      key: registeredComponent.key
+    });
+  }
+  if (!willComponentRender(registeredComponent, childrenMap)) {
+    return null;
+  }
+  const ParentComponent = registeredComponent.component || fallbacks[registeredComponent.type];
+  const childrenMapKey = getChildrenMapKey(registeredComponent.key, registeredComponent.type);
+  const registeredComponents = childrenMap.get(childrenMapKey);
+  return /*#__PURE__*/React.createElement(ParentComponent, {
+    key: registeredComponent.key
+  }, /*#__PURE__*/React.createElement(BlockMenuComponents, {
+    registeredComponents: registeredComponents,
+    childrenMap: childrenMap,
+    fallbacks: fallbacks
+  }));
+};

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

@@ -0,0 +1,21 @@
+import React from 'react';
+import { BlockMenuComponent } from './BlockMenuComponent';
+/**
+ * Renders the given registered components
+ * Returns null if no components are rendered
+ */
+export const BlockMenuComponents = ({
+  registeredComponents,
+  childrenMap,
+  fallbacks
+}) => {
+  if (!(registeredComponents !== null && registeredComponents !== void 0 && registeredComponents.length)) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(React.Fragment, null, registeredComponents.map(registeredComponent => /*#__PURE__*/React.createElement(BlockMenuComponent, {
+    key: registeredComponent.key,
+    registeredComponent: registeredComponent,
+    childrenMap: childrenMap,
+    fallbacks: fallbacks
+  })));
+};

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

@@ -0,0 +1,24 @@
+import React, { useMemo } from 'react';
+import { BlockMenuComponents } from './BlockMenuComponents';
+import { BLOCK_MENU_FALLBACKS } from './fallbacks';
+import { buildChildrenMap, getSortedTopLevelSections } from './utils';
+/**
+ * BlockMenuRenderer orchestrates the rendering of the entire block menu hierarchy
+ */
+export const BlockMenuRenderer = ({
+  allRegisteredComponents,
+  fallbacks = BLOCK_MENU_FALLBACKS
+}) => {
+  const {
+    childrenMap,
+    topLevelSections
+  } = useMemo(() => ({
+    childrenMap: buildChildrenMap(allRegisteredComponents),
+    topLevelSections: getSortedTopLevelSections(allRegisteredComponents)
+  }), [allRegisteredComponents]);
+  return /*#__PURE__*/React.createElement(BlockMenuComponents, {
+    registeredComponents: topLevelSections,
+    childrenMap: childrenMap,
+    fallbacks: fallbacks
+  });
+};

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

@@ -0,0 +1,21 @@
+import React from 'react';
+import { ToolbarDropdownItem, ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
+import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
+export const BLOCK_MENU_FALLBACKS = {
+  'block-menu-nested': ({
+    children
+  }) => /*#__PURE__*/React.createElement(ToolbarNestedDropdownMenu, {
+    elemBefore: undefined,
+    elemAfter: /*#__PURE__*/React.createElement(ChevronRightIcon, {
+      label: ""
+    }),
+    text: "Nested Menu",
+    enableMaxHeight: true,
+    shouldFitContainer: true
+  }, children),
+  'block-menu-section': ({
+    children
+  }) => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, children),
+  // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-jsx
+  'block-menu-item': () => /*#__PURE__*/React.createElement(ToolbarDropdownItem, null, "Block Menu Item")
+};

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,93 @@
+/**
+ * Type guard to check if a component has a parent
+ *
+ * @param component The block menu component to check
+ * @returns True if the component has a parent, false otherwise
+ */
+const hasParent = component => {
+  return 'parent' in component && !!component.parent;
+};
+
+/**
+ * Type guard to identify top-level sections (sections without a parent)
+ *
+ * @param component The block menu component to check
+ * @returns True if the component is a top-level section, false otherwise
+ */
+const isTopLevelSection = component => {
+  return component.type === 'block-menu-section' && !hasParent(component);
+};
+
+/**
+ * Gets all top-level sections (those without a parent) sorted by rank
+ *
+ * @param components All registered block menu components
+ * @returns Sorted array of top-level sections
+ */
+export const getSortedTopLevelSections = components => {
+  return components.filter(isTopLevelSection).sort((a, b) => (a.rank || 0) - (b.rank || 0));
+};
+
+/**
+ * Generates a unique key from a key and type
+ * Used to lookup children in the childrenMap
+ *
+ * @param key The component's key
+ * @param type The component's type
+ * @returns A unique string key combining type and key
+ */
+export const getChildrenMapKey = (key, type) => {
+  return `${type}:${key}`;
+};
+
+/**
+ * Builds a map of parent keys to their sorted children
+ * This enables efficient hierarchical rendering of the menu structure
+ *
+ * @param components All registered block menu components
+ * @returns Map where keys are parent identifiers and values are sorted child components
+ */
+export const buildChildrenMap = components => {
+  const childrenMap = new Map();
+  for (const component of components) {
+    // Only components with parents can be children
+    if ('parent' in component && !!component.parent) {
+      const childrenMapKey = getChildrenMapKey(component.parent.key, component.parent.type);
+      const existing = childrenMap.get(childrenMapKey) || [];
+      existing.push(component);
+      childrenMap.set(childrenMapKey, existing);
+    }
+  }
+
+  // Sort children by their rank within their parent
+  for (const [, children] of childrenMap.entries()) {
+    children.sort((a, b) => {
+      const rankA = hasParent(a) ? a.parent.rank || 0 : 0;
+      const rankB = hasParent(b) ? b.parent.rank || 0 : 0;
+      return rankA - rankB;
+    });
+  }
+  return childrenMap;
+};
+
+/**
+ * Determines whether a component will render based on its type and children
+ *
+ * Rules:
+ * - An item will not render if has a component that returns null
+ * - A nested menu will render if it has at least one registered child component
+ * - A section will render if it has at least one registered child component that will render
+ *
+ * NOTE: This requires invoking each item's component function to check for null return
+ */
+export const willComponentRender = (registeredComponent, childrenMap) => {
+  if (registeredComponent.type === 'block-menu-item') {
+    return registeredComponent.component ? registeredComponent.component() !== null : true;
+  }
+  const childrenMapKey = getChildrenMapKey(registeredComponent.key, registeredComponent.type);
+  const registeredComponents = childrenMap.get(childrenMapKey) || [];
+  if (registeredComponent.type === 'block-menu-nested') {
+    return registeredComponents.length > 0;
+  }
+  return registeredComponents.some(childComponent => willComponentRender(childComponent, childrenMap));
+};

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

@@ -10,15 +10,15 @@ import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks'
 import { deleteSelectedRange } from '@atlaskit/editor-common/selection';
 import { DRAG_HANDLE_SELECTOR, DRAG_HANDLE_WIDTH } from '@atlaskit/editor-common/styles';
 import { Popup } from '@atlaskit/editor-common/ui';
+import { ArrowKeyNavigationProvider, ArrowKeyNavigationType } from '@atlaskit/editor-common/ui-menu';
 import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners } from '@atlaskit/editor-common/ui-react';
 import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
-import { ToolbarDropdownItem, ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
 import { fg } from '@atlaskit/platform-feature-flags';
 import { conditionalHooksFactory } from '@atlaskit/platform-feature-flags-react';
 import { Box } from '@atlaskit/primitives/compiled';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { useBlockMenu } from './block-menu-provider';
-import { BlockMenuRenderer } from './block-menu-renderer';
+import { BlockMenuRenderer } from './block-menu-renderer/BlockMenuRenderer';
 const styles = {
   base: "_2rko12b0 _bfhk1bhr _16qs130s",
   emptyMenuSectionStyles: "_1cc0glyw _1k2yglyw"
@@ -111,18 +111,11 @@ const BlockMenuContent = ({
     testId: "editor-block-menu",
     ref: ref,
     xcss: cx(styles.base, editorExperiment('platform_synced_block', true) && styles.emptyMenuSectionStyles)
+  }, /*#__PURE__*/React.createElement(ArrowKeyNavigationProvider, {
+    type: ArrowKeyNavigationType.MENU
   }, /*#__PURE__*/React.createElement(BlockMenuRenderer, {
-    components: blockMenuComponents || [],
-    fallbacks: {
-      nestedMenu: () => /*#__PURE__*/React.createElement(ToolbarNestedDropdownMenu, {
-        elemBefore: undefined,
-        elemAfter: undefined
-      }, /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, /*#__PURE__*/React.createElement(ToolbarDropdownItem, null, "Block Menu Item"))),
-      section: () => /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, /*#__PURE__*/React.createElement(ToolbarDropdownItem, null, "Block Menu Item")),
-      // eslint-disable-next-line @atlassian/i18n/no-literal-string-in-jsx
-      item: () => /*#__PURE__*/React.createElement(ToolbarDropdownItem, null, "Block Menu Item")
-    }
-  }));
+    allRegisteredComponents: blockMenuComponents || []
+  })));
 };
 const BlockMenu = ({
   editorView,

package/dist/es2019/ui/hooks/useSuggestedItems.js

@@ -0,0 +1,45 @@
+import { useMemo } from 'react';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { getBlockNodesInRange, expandSelectionToBlockRange } from '../../editor-commands/transform-node-utils/utils';
+import { getSortedSuggestedItems } from '../utils/suggested-items-rank';
+export const useSuggestedItems = api => {
+  var _api$blockMenu;
+  const {
+    preservedSelection,
+    selection
+  } = useSharedPluginStateWithSelector(api, ['blockControls', 'selection'], states => {
+    var _states$blockControls, _states$selectionStat;
+    return {
+      preservedSelection: (_states$blockControls = states.blockControlsState) === null || _states$blockControls === void 0 ? void 0 : _states$blockControls.preservedSelection,
+      selection: (_states$selectionStat = states.selectionState) === null || _states$selectionStat === void 0 ? void 0 : _states$selectionStat.selection
+    };
+  });
+  const blockMenuComponents = api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.getBlockMenuComponents();
+  const menuItemsMap = useMemo(() => {
+    if (!blockMenuComponents) {
+      return new Map();
+    }
+    return new Map(blockMenuComponents.filter(c => c.type === 'block-menu-item').map(item => [item.key, item]));
+  }, [blockMenuComponents]);
+  const suggestedItems = useMemo(() => {
+    const currentSelection = preservedSelection || selection;
+    if (menuItemsMap.size === 0 || !currentSelection) {
+      return [];
+    }
+    const {
+      range
+    } = expandSelectionToBlockRange(currentSelection, currentSelection.$from.doc.type.schema);
+    if (!range) {
+      return [];
+    }
+    const blockNodes = getBlockNodesInRange(range);
+    const singleNode = blockNodes.length === 1 ? blockNodes[0] : undefined;
+    if (!singleNode) {
+      return [];
+    }
+    const nodeTypeName = singleNode.type.name;
+    const sortedKeys = getSortedSuggestedItems(nodeTypeName);
+    return sortedKeys.map(key => menuItemsMap.get(key)).filter(item => item !== undefined);
+  }, [menuItemsMap, preservedSelection, selection]);
+  return suggestedItems;
+};

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

@@ -0,0 +1,15 @@
+import React from 'react';
+import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
+import { useSuggestedItems } from './hooks/useSuggestedItems';
+export const SuggestedItemsMenuSection = /*#__PURE__*/React.memo(({
+  api,
+  children
+}) => {
+  const suggestedItems = useSuggestedItems(api);
+  if (suggestedItems.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
+    title: "Suggested"
+  }, children);
+});

package/dist/es2019/ui/suggested-menu-items.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import { useSuggestedItems } from './hooks/useSuggestedItems';
+export const SuggestedMenuItems = /*#__PURE__*/React.memo(({
+  api
+}) => {
+  const suggestedItems = useSuggestedItems(api);
+  return /*#__PURE__*/React.createElement(React.Fragment, null, suggestedItems.map(item => {
+    const ItemComponent = item.component;
+    return ItemComponent ? /*#__PURE__*/React.createElement(ItemComponent, {
+      key: item.key
+    }) : null;
+  }));
+});

package/dist/es2019/ui/utils/suggested-items-rank.js

@@ -14,7 +14,7 @@
  * }
  */
 
-import { TRANSFORM_STRUCTURE_PANEL_MENU_ITEM, TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM, TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM, TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM, TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM, TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM, TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM, TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM, TRANSFORM_HEADINGS_H2_MENU_ITEM, TRANSFORM_HEADINGS_H3_MENU_ITEM, TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
+import { TRANSFORM_STRUCTURE_PANEL_MENU_ITEM, TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM, TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM, TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM, TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM, TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM, TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM, TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM, TRANSFORM_HEADINGS_H1_MENU_ITEM, TRANSFORM_HEADINGS_H2_MENU_ITEM, TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
 export const BLOCK_MENU_NODE_TYPES = {
   PARAGRAPH: 'paragraph',
   EXPAND: 'expand',
@@ -37,85 +37,73 @@ export const BLOCK_MENU_NODE_TYPES = {
 export const TRANSFORM_SUGGESTED_ITEMS_RANK = {
   [BLOCK_MENU_NODE_TYPES.PARAGRAPH]: {
     [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_HEADINGS_H2_MENU_ITEM.key]: 200,
-    [TRANSFORM_HEADINGS_H3_MENU_ITEM.key]: 300
+    [TRANSFORM_HEADINGS_H1_MENU_ITEM.key]: 200,
+    [TRANSFORM_HEADINGS_H2_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.EXPAND]: {
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 200,
     [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.BLOCKQUOTE]: {
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.LAYOUT_SECTION]: {
     [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
     [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 200,
-    [TRANSFORM_HEADINGS_H2_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.PANEL]: {
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.CODE_BLOCK]: {
     [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.DECISION]: {
     [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.BULLET_LIST]: {
     [TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key]: 100,
     [TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.ORDERED_LIST]: {
-    [TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_TASK_LIST_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.HEADING]: {
     [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 100,
-    [TRANSFORM_HEADINGS_H2_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.TASK_LIST]: {
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
     [TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_CODE_BLOCK_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_BULLETED_LIST_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.MEDIA_SINGLE]: {
     [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_QUOTE_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.EXTENSION]: {
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 300
+    [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 300
   },
   [BLOCK_MENU_NODE_TYPES.BODIED_EXTENSION]: {
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 200,
-    [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 300
-  },
-  [BLOCK_MENU_NODE_TYPES.BLOCK_CARD]: {
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 200
-  },
-  [BLOCK_MENU_NODE_TYPES.EMBED_CARD]: {
-    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 200
-  },
-  [BLOCK_MENU_NODE_TYPES.TABLE]: {
     [TRANSFORM_STRUCTURE_EXPAND_MENU_ITEM.key]: 100,
-    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 200
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_LAYOUT_MENU_ITEM.key]: 300
   }
 };
 export const getSuggestedItemsForNodeType = nodeType => {

package/dist/esm/editor-commands/transform-node-utils/transform.js

@@ -84,9 +84,9 @@ var TRANSFORM_STEPS_OVERRIDE = {
     decisionList: [unwrapStep, wrapBlockquoteToDecisionListStep]
   },
   layoutSection: {
-    blockquote: [unwrapLayoutStep, wrapStep],
+    blockquote: [unwrapLayoutStep, wrapMixedContentStep],
     expand: [unwrapLayoutStep, wrapStep],
-    panel: [unwrapLayoutStep, wrapStep],
+    panel: [unwrapLayoutStep, wrapMixedContentStep],
     codeBlock: [unwrapLayoutStep, flattenStep, wrapStep],
     paragraph: [unwrapLayoutStep]
   },