@atlaskit/editor-plugin-block-menu 5.1.6 → 5.1.8

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

@@ -1,33 +1,28 @@
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
-const extractNestedLists = (node, listTypes, itemTypes) => {
+const extractNestedLists = (node, listTypes, itemTypes, schema) => {
   const items = [];
+  const paragraph = schema.nodes.paragraph;
   const extract = currentNode => {
     currentNode.forEach(child => {
-      // list item -> take content without nested lists, then recurse into nested lists
       if (itemTypes.some(type => child.type === type)) {
-        // Filter out nested list nodes from the list item's content
         const contentWithoutNestedLists = [];
         const nestedLists = [];
         child.forEach(grandChild => {
           if (listTypes.some(type => grandChild.type === type)) {
-            // This is a nested list - collect it for later processing
             nestedLists.push(grandChild);
           } else {
-            // This is regular content (paragraph, etc.) - keep it
-            contentWithoutNestedLists.push(grandChild);
+            if (grandChild.isText) {
+              contentWithoutNestedLists.push(paragraph.createAndFill({}, grandChild));
+            } else {
+              contentWithoutNestedLists.push(grandChild);
+            }
           }
         });
-
-        // Add the list item with only its non-list content
         items.push(child.copy(Fragment.from(contentWithoutNestedLists)));
-
-        // Now process nested lists to maintain document order
         nestedLists.forEach(nestedList => {
           extract(nestedList);
         });
-      }
-      // lists -> keep operating
-      else if (listTypes.some(type => child.type === type)) {
+      } else if (listTypes.some(type => child.type === type)) {
         extract(child);
       }
     });
@@ -41,24 +36,6 @@ const extractNestedLists = (node, listTypes, itemTypes) => {
  * to it's first ancestor list, maintaining document order.
  *
  * @example
- * Input:
- * - bulletList
- *   - listItem "A"
- *   - listItem "B"
- *     - bulletList
- *       - listItem "C"
- *       - listItem "D"
- *   - listItem "E"
- *
- * Output:
- * - bulletList
- *   - listItem "A"
- *   - listItem "B"
- *   - listItem "C"
- *   - listItem "D"
- *   - listItem "E"
- *
- * @example
  * Input (deeply nested):
  * - bulletList
  *   - listItem "1"
@@ -87,7 +64,7 @@ export const flattenListStep = (nodes, context) => {
   const listTypes = [context.schema.nodes.bulletList, context.schema.nodes.orderedList, context.schema.nodes.taskList];
   return nodes.map(node => {
     if (listTypes.some(type => node.type === type)) {
-      return node.copy(Fragment.from(extractNestedLists(node, listTypes, [context.schema.nodes.listItem, context.schema.nodes.taskItem])));
+      return node.copy(Fragment.from(extractNestedLists(node, listTypes, [context.schema.nodes.listItem, context.schema.nodes.taskItem], context.schema)));
     }
     return node;
   });

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

@@ -8,6 +8,7 @@ import { unwrapExpandStep } from './unwrapExpandStep';
 import { unwrapListStep } from './unwrapListStep';
 import { unwrapStep } from './unwrapStep';
 import { wrapIntoLayoutStep } from './wrapIntoLayoutStep';
+import { wrapMixedContentStep } from './wrapMixedContentStep';
 import { wrapStep } from './wrapStep';
 
 // Exampled step for overrides:
@@ -57,15 +58,15 @@ const TRANSFORM_STEPS_OVERRIDE = {
     codeBlock: [unwrapStep, flattenStep, wrapStep]
   },
   expand: {
-    panel: [unwrapExpandStep, wrapStep],
-    blockquote: [unwrapExpandStep, wrapStep],
+    panel: [unwrapExpandStep, wrapMixedContentStep],
+    blockquote: [unwrapExpandStep, wrapMixedContentStep],
     layoutSection: [unwrapExpandStep, wrapIntoLayoutStep],
     paragraph: [unwrapExpandStep],
     codeBlock: [unwrapExpandStep, flattenStep, wrapStep]
   },
   nestedExpand: {
-    panel: [unwrapExpandStep, wrapStep],
-    blockquote: [unwrapExpandStep, wrapStep],
+    panel: [unwrapExpandStep, wrapMixedContentStep],
+    blockquote: [unwrapExpandStep, wrapMixedContentStep],
     paragraph: [unwrapExpandStep],
     codeBlock: [unwrapExpandStep, flattenStep, wrapStep]
   },

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

@@ -1,6 +1,21 @@
 /**
- * Given an array of nodes, returns an array with the flattened children of any list nodes.
+ * Given an array of nodes, processes each list removing all parent list nodes and
+ * just returning their child contents.
+ *
+ * @example
+ * Input:
+ * - bulletList
+ *   - listItem "1"
+ *     - paragraph "1"
+ *   - listItem "2"
+ *     - paragraph "2"
+ *
+ * Output:
+ * - paragraph "1"
+ * - paragraph "2"
+ *
  * @param nodes
+ * @param context
  * @returns
  */
 export const unwrapListStep = (nodes, context) => {

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

@@ -1,5 +1,6 @@
+import { expandToBlockRange } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
-import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
+import { findParentNodeOfType, hasParentNode } from '@atlaskit/editor-prosemirror/utils';
 import { CellSelection } from '@atlaskit/editor-tables';
 export const getSelectedNode = selection => {
   if (selection instanceof NodeSelection) {
@@ -49,4 +50,31 @@ export const getTargetNodeTypeNameInContext = (nodeTypeName, isNested) => {
     return 'nestedExpand';
   }
   return nodeTypeName;
+};
+
+/**
+ * Use common expandToBlockRange function, but account for edge cases with lists.
+ *
+ * @param selection
+ * @param schema
+ * @returns
+ */
+export const expandSelectionToBlockRange = (selection, schema) => {
+  const isListInSelection = hasParentNode(node => node.type === schema.nodes.bulletList || node.type === schema.nodes.orderedList)(selection);
+  const {
+    $from,
+    $to
+  } = expandToBlockRange(selection.$from, selection.$to, node => {
+    if (!isListInSelection) {
+      return true;
+    }
+    if (node.type === schema.nodes.bulletList || node.type === schema.nodes.orderedList) {
+      return true;
+    }
+    return false;
+  });
+  return {
+    $from,
+    $to
+  };
 };

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

@@ -0,0 +1,135 @@
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
+import { NODE_CATEGORY_BY_TYPE } from './types';
+import { unwrapStep } from './unwrapStep';
+
+/**
+ * Determines if a node can be flattened (unwrapped and its contents merged).
+ *
+ * According to the text transformations list, flattenable nodes are:
+ * - Bulleted list, Numbered list, Task list
+ * - Text nodes (heading, paragraph)
+ *
+ * Containers (panels, expands, layouts, blockquotes) and atomic nodes (tables, media, macros) break out.
+ */
+const canFlatten = node => {
+  const category = NODE_CATEGORY_BY_TYPE[node.type.name];
+  // Text and list nodes can be flattened (converted to simpler forms)
+  return category === 'text' || category === 'list';
+};
+
+/**
+ * Flattens a node by extracting its contents using the appropriate unwrap step.
+ * This is only called for text and list nodes that can be converted to simpler forms.
+ * Uses unwrapStep to extract children from list containers.
+ */
+const flattenNode = (node, context) => {
+  return unwrapStep([node], context);
+};
+
+/**
+ * Determines if a node can be wrapped in the target container type.
+ * Uses the schema's validContent to check if the target container can hold this node.
+ *
+ * Note: What can be wrapped depends on the target container type - for example:
+ * - Tables and media CAN go inside expand nodes
+ * - Tables CANNOT go inside panels or blockquotes
+ */
+const canWrapInTarget = (node, targetNodeType, targetNodeTypeName) => {
+  // Same-type containers should break out as separate containers
+  if (node.type.name === targetNodeTypeName) {
+    return false;
+  }
+
+  // Use the schema to determine if this node can be contained in the target
+  try {
+    return targetNodeType.validContent(Fragment.from(node));
+  } catch {
+    return false;
+  }
+};
+
+/**
+ * Converts a nestedExpand to a regular expand node.
+ * NestedExpands can only exist inside expands, so when breaking out they must be converted.
+ */
+const convertNestedExpandToExpand = (node, schema) => {
+  var _node$attrs;
+  const expandType = schema.nodes.expand;
+  if (!expandType) {
+    return null;
+  }
+  return expandType.createAndFill({
+    title: ((_node$attrs = node.attrs) === null || _node$attrs === void 0 ? void 0 : _node$attrs.title) || ''
+  }, node.content);
+};
+
+/**
+ * A wrap step that handles mixed content according to the Compatibility Matrix:
+ * - Wraps consecutive compatible nodes into the target container
+ * - Same-type containers break out as separate containers (preserved as-is)
+ * - NestedExpands break out as regular expands (converted since nestedExpand can't exist outside expand)
+ * - Container structures that can't be nested in target break out (not flattened)
+ * - Text/list nodes that can't be wrapped are flattened and merged into the container
+ * - Atomic nodes (tables, media, macros) break out
+ *
+ * What can be wrapped depends on the target container's schema:
+ * - expand → panel: tables break out, nestedExpands convert to expands and break out
+ * - expand → blockquote: tables/media break out, nestedExpands convert to expands and break out
+ * - expand → expand: tables/media stay inside (expands can contain them)
+ *
+ * Example: expand(p('a'), table(), p('b')) → panel: [panel(p('a')), table(), panel(p('b'))]
+ * Example: expand(p('a'), panel(p('x')), p('b')) → panel: [panel(p('a')), panel(p('x')), panel(p('b'))]
+ * Example: expand(p('a'), nestedExpand({title: 'inner'})(p('x')), p('b')) → panel: [panel(p('a')), expand({title: 'inner'})(p('x')), panel(p('b'))]
+ */
+export const wrapMixedContentStep = (nodes, context) => {
+  const {
+    schema,
+    targetNodeTypeName
+  } = context;
+  const targetNodeType = schema.nodes[targetNodeTypeName];
+  if (!targetNodeType) {
+    return nodes;
+  }
+  const result = [];
+  let currentContainerContent = [];
+  const flushCurrentContainer = () => {
+    if (currentContainerContent.length > 0) {
+      const containerNode = targetNodeType.createAndFill({}, Fragment.fromArray(currentContainerContent));
+      if (containerNode) {
+        result.push(containerNode);
+      }
+      currentContainerContent = [];
+    }
+  };
+  nodes.forEach(node => {
+    if (canWrapInTarget(node, targetNodeType, targetNodeTypeName)) {
+      // Node can be wrapped - add to current container content
+      currentContainerContent.push(node);
+    } else if (node.type.name === targetNodeTypeName) {
+      // Same-type container - breaks out as a separate container (preserved as-is)
+      // This handles: "If there's a panel in the expand, it breaks out into a separate panel"
+      flushCurrentContainer();
+      result.push(node);
+    } else if (node.type.name === 'nestedExpand') {
+      // NestedExpand can't be wrapped and can't exist outside an expand
+      // Convert to regular expand and break out
+      flushCurrentContainer();
+      const expandNode = convertNestedExpandToExpand(node, schema);
+      if (expandNode) {
+        result.push(expandNode);
+      }
+    } else if (canFlatten(node)) {
+      // Node cannot be wrapped but CAN be flattened - flatten and add to container
+      const flattenedNodes = flattenNode(node, context);
+      currentContainerContent.push(...flattenedNodes);
+    } else {
+      // Node cannot be wrapped AND cannot be flattened (containers, tables, media, macros) - break out
+      flushCurrentContainer();
+      result.push(node);
+    }
+  });
+
+  // Flush any remaining content into a container
+  flushCurrentContainer();
+  return result.length > 0 ? result : nodes;
+};

package/dist/es2019/editor-commands/transformNode.js

@@ -1,7 +1,7 @@
-import { expandToBlockRange } from '@atlaskit/editor-common/selection';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { isNestedNode } from '../ui/utils/isNestedNode';
 import { getOutputNodes } from './transform-node-utils/transform';
+import { expandSelectionToBlockRange } from './transform-node-utils/utils';
 import { isListNode } from './transforms/utils';
 export const transformNode = api =>
 // eslint-disable-next-line no-unused-vars
@@ -17,7 +17,7 @@ export const transformNode = api =>
     const {
       $from,
       $to
-    } = expandToBlockRange(preservedSelection.$from, preservedSelection.$to);
+    } = expandSelectionToBlockRange(preservedSelection, tr.doc.type.schema);
     const isNested = isNestedNode(preservedSelection, '');
     const selectedParent = $from.parent;
     let fragment = Fragment.empty;

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { BLOCK_ACTIONS_COPY_LINK_TO_BLOCK_MENU_ITEM, BLOCK_ACTIONS_MENU_SECTION, BLOCK_ACTIONS_MENU_SECTION_RANK, DELETE_MENU_SECTION, DELETE_MENU_SECTION_RANK, DELETE_MENU_ITEM, POSITION_MENU_SECTION, POSITION_MENU_SECTION_RANK, POSITION_MOVE_DOWN_MENU_ITEM, POSITION_MOVE_UP_MENU_ITEM, TRANSFORM_MENU_ITEM, TRANSFORM_MENU_ITEM_RANK, TRANSFORM_MENU_SECTION, TRANSFORM_MENU_SECTION_RANK, TRANSFORM_CREATE_MENU_SECTION, TRANSFORM_SUGGESTED_MENU_SECTION, TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_HEADINGS_MENU_SECTION, MAIN_BLOCK_MENU_SECTION_RANK } from '@atlaskit/editor-common/block-menu';
+import { BLOCK_ACTIONS_COPY_LINK_TO_BLOCK_MENU_ITEM, BLOCK_ACTIONS_MENU_SECTION, BLOCK_ACTIONS_MENU_SECTION_RANK, DELETE_MENU_SECTION, DELETE_MENU_SECTION_RANK, DELETE_MENU_ITEM, POSITION_MENU_SECTION, POSITION_MENU_SECTION_RANK, POSITION_MOVE_DOWN_MENU_ITEM, POSITION_MOVE_UP_MENU_ITEM, TRANSFORM_MENU_ITEM, TRANSFORM_MENU_ITEM_RANK, TRANSFORM_MENU_SECTION, TRANSFORM_MENU_SECTION_RANK, TRANSFORM_CREATE_MENU_SECTION, TRANSFORM_SUGGESTED_MENU_SECTION, TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_HEADINGS_MENU_SECTION, MAIN_BLOCK_MENU_SECTION_RANK, TRANSFORM_SUGGESTED_MENU_SECTION_RANK, TRANSFORM_SUGGESTED_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
 import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
 import { CopyLinkDropdownItem } from './copy-link';
 import { CopySection } from './copy-section';
@@ -9,6 +9,7 @@ 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';
 const getMoveUpMoveDownMenuComponents = api => {
   return [{
     type: 'block-menu-item',
@@ -60,14 +61,16 @@ const getTurnIntoMenuComponents = api => {
       key: TRANSFORM_MENU_ITEM.key,
       rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_SUGGESTED_MENU_SECTION.key]
     },
-    component: ({
-      children
-    } = {
-      children: null
-    }) => {
-      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
-        title: "Suggested"
-      }, children);
+    component: () => /*#__PURE__*/React.createElement(SuggestedItemsRenderer, {
+      api: api
+    })
+  }, {
+    type: 'block-menu-item',
+    key: TRANSFORM_SUGGESTED_MENU_ITEM.key,
+    parent: {
+      type: 'block-menu-section',
+      key: TRANSFORM_SUGGESTED_MENU_SECTION.key,
+      rank: TRANSFORM_SUGGESTED_MENU_SECTION_RANK[TRANSFORM_SUGGESTED_MENU_ITEM.key]
     }
   }, {
     type: 'block-menu-section',

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

@@ -0,0 +1,48 @@
+import React, { useMemo } from 'react';
+import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
+import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
+import { getSelectedNode } from '../editor-commands/transform-node-utils/utils';
+import { getSortedSuggestedItems } from './utils/suggested-items-rank';
+export const SuggestedItemsRenderer = /*#__PURE__*/React.memo(({
+  api
+}) => {
+  var _api$blockMenu;
+  const {
+    preservedSelection
+  } = useSharedPluginStateWithSelector(api, ['blockControls'], states => {
+    var _states$blockControls;
+    return {
+      preservedSelection: (_states$blockControls = states.blockControlsState) === null || _states$blockControls === void 0 ? void 0 : _states$blockControls.preservedSelection
+    };
+  });
+  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(() => {
+    if (!preservedSelection || menuItemsMap.size === 0) {
+      return [];
+    }
+    const selectedNode = getSelectedNode(preservedSelection);
+    if (!selectedNode) {
+      return [];
+    }
+    const nodeTypeName = selectedNode.node.type.name;
+    const sortedKeys = getSortedSuggestedItems(nodeTypeName);
+    return sortedKeys.map(key => menuItemsMap.get(key)).filter(item => item !== undefined);
+  }, [menuItemsMap, preservedSelection]);
+  if (suggestedItems.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
+    title: "Suggested"
+  }, 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

@@ -0,0 +1,130 @@
+/**
+ * Suggested transformations mapping for each block type.
+ * Based on the Block Menu Compatibility Matrix:
+ * https://hello.atlassian.net/wiki/spaces/egcuc/pages/5868774224/Block+Menu+Compatibility+Matrix#Suggested-for-each-block-type
+ *
+ * This mapping defines which transform items should appear in the TRANSFORM_SUGGESTED_MENU_SECTION
+ * for each block type, ranked by priority (lower rank = higher priority).
+ *
+ * Structure:
+ * {
+ *   [sourceNodeType]: {
+ *     [targetMenuItemKey]: rank
+ *   }
+ * }
+ */
+
+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';
+export const BLOCK_MENU_NODE_TYPES = {
+  PARAGRAPH: 'paragraph',
+  EXPAND: 'expand',
+  BLOCKQUOTE: 'blockquote',
+  LAYOUT_SECTION: 'layoutSection',
+  PANEL: 'panel',
+  CODE_BLOCK: 'codeBlock',
+  DECISION: 'decisionList',
+  BULLET_LIST: 'bulletList',
+  ORDERED_LIST: 'orderedList',
+  HEADING: 'heading',
+  TASK_LIST: 'taskList',
+  MEDIA_SINGLE: 'mediaSingle',
+  EXTENSION: 'extension',
+  BODIED_EXTENSION: 'bodiedExtension',
+  BLOCK_CARD: 'blockCard',
+  EMBED_CARD: 'embedCard',
+  TABLE: 'table'
+};
+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
+  },
+  [BLOCK_MENU_NODE_TYPES.EXPAND]: {
+    [TRANSFORM_STRUCTURE_PANEL_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_LAYOUT_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
+  },
+  [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
+  },
+  [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
+  },
+  [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
+  },
+  [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
+  },
+  [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
+  },
+  [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
+  },
+  [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
+  },
+  [BLOCK_MENU_NODE_TYPES.TASK_LIST]: {
+    [TRANSFORM_STRUCTURE_PARAGRAPH_MENU_ITEM.key]: 100,
+    [TRANSFORM_STRUCTURE_NUMBERED_LIST_MENU_ITEM.key]: 200,
+    [TRANSFORM_STRUCTURE_CODE_BLOCK_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
+  },
+  [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
+  },
+  [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
+  }
+};
+export const getSuggestedItemsForNodeType = nodeType => {
+  return TRANSFORM_SUGGESTED_ITEMS_RANK[nodeType];
+};
+export const getSortedSuggestedItems = nodeType => {
+  const suggestions = getSuggestedItemsForNodeType(nodeType);
+  if (!suggestions) {
+    return [];
+  }
+  return Object.entries(suggestions).sort(([, rankA], [, rankB]) => rankA - rankB).map(([key]) => key);
+};

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

@@ -1,37 +1,32 @@
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
-var extractNestedLists = function extractNestedLists(node, listTypes, itemTypes) {
+var extractNestedLists = function extractNestedLists(node, listTypes, itemTypes, schema) {
   var items = [];
+  var paragraph = schema.nodes.paragraph;
   var _extract = function extract(currentNode) {
     currentNode.forEach(function (child) {
-      // list item -> take content without nested lists, then recurse into nested lists
       if (itemTypes.some(function (type) {
         return child.type === type;
       })) {
-        // Filter out nested list nodes from the list item's content
         var contentWithoutNestedLists = [];
         var nestedLists = [];
         child.forEach(function (grandChild) {
           if (listTypes.some(function (type) {
             return grandChild.type === type;
           })) {
-            // This is a nested list - collect it for later processing
             nestedLists.push(grandChild);
           } else {
-            // This is regular content (paragraph, etc.) - keep it
-            contentWithoutNestedLists.push(grandChild);
+            if (grandChild.isText) {
+              contentWithoutNestedLists.push(paragraph.createAndFill({}, grandChild));
+            } else {
+              contentWithoutNestedLists.push(grandChild);
+            }
           }
         });
-
-        // Add the list item with only its non-list content
         items.push(child.copy(Fragment.from(contentWithoutNestedLists)));
-
-        // Now process nested lists to maintain document order
         nestedLists.forEach(function (nestedList) {
           _extract(nestedList);
         });
-      }
-      // lists -> keep operating
-      else if (listTypes.some(function (type) {
+      } else if (listTypes.some(function (type) {
         return child.type === type;
       })) {
         _extract(child);
@@ -47,24 +42,6 @@ var extractNestedLists = function extractNestedLists(node, listTypes, itemTypes)
  * to it's first ancestor list, maintaining document order.
  *
  * @example
- * Input:
- * - bulletList
- *   - listItem "A"
- *   - listItem "B"
- *     - bulletList
- *       - listItem "C"
- *       - listItem "D"
- *   - listItem "E"
- *
- * Output:
- * - bulletList
- *   - listItem "A"
- *   - listItem "B"
- *   - listItem "C"
- *   - listItem "D"
- *   - listItem "E"
- *
- * @example
  * Input (deeply nested):
  * - bulletList
  *   - listItem "1"
@@ -95,7 +72,7 @@ export var flattenListStep = function flattenListStep(nodes, context) {
     if (listTypes.some(function (type) {
       return node.type === type;
     })) {
-      return node.copy(Fragment.from(extractNestedLists(node, listTypes, [context.schema.nodes.listItem, context.schema.nodes.taskItem])));
+      return node.copy(Fragment.from(extractNestedLists(node, listTypes, [context.schema.nodes.listItem, context.schema.nodes.taskItem], context.schema)));
     }
     return node;
   });

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

@@ -8,6 +8,7 @@ import { unwrapExpandStep } from './unwrapExpandStep';
 import { unwrapListStep } from './unwrapListStep';
 import { unwrapStep } from './unwrapStep';
 import { wrapIntoLayoutStep } from './wrapIntoLayoutStep';
+import { wrapMixedContentStep } from './wrapMixedContentStep';
 import { wrapStep } from './wrapStep';
 
 // Exampled step for overrides:
@@ -57,15 +58,15 @@ var TRANSFORM_STEPS_OVERRIDE = {
     codeBlock: [unwrapStep, flattenStep, wrapStep]
   },
   expand: {
-    panel: [unwrapExpandStep, wrapStep],
-    blockquote: [unwrapExpandStep, wrapStep],
+    panel: [unwrapExpandStep, wrapMixedContentStep],
+    blockquote: [unwrapExpandStep, wrapMixedContentStep],
     layoutSection: [unwrapExpandStep, wrapIntoLayoutStep],
     paragraph: [unwrapExpandStep],
     codeBlock: [unwrapExpandStep, flattenStep, wrapStep]
   },
   nestedExpand: {
-    panel: [unwrapExpandStep, wrapStep],
-    blockquote: [unwrapExpandStep, wrapStep],
+    panel: [unwrapExpandStep, wrapMixedContentStep],
+    blockquote: [unwrapExpandStep, wrapMixedContentStep],
     paragraph: [unwrapExpandStep],
     codeBlock: [unwrapExpandStep, flattenStep, wrapStep]
   },

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

@@ -1,7 +1,22 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 /**
- * Given an array of nodes, returns an array with the flattened children of any list nodes.
+ * Given an array of nodes, processes each list removing all parent list nodes and
+ * just returning their child contents.
+ *
+ * @example
+ * Input:
+ * - bulletList
+ *   - listItem "1"
+ *     - paragraph "1"
+ *   - listItem "2"
+ *     - paragraph "2"
+ *
+ * Output:
+ * - paragraph "1"
+ * - paragraph "2"
+ *
  * @param nodes
+ * @param context
  * @returns
  */
 export var unwrapListStep = function unwrapListStep(nodes, context) {