@atlaskit/editor-plugin-block-menu 5.2.9 → 5.2.11

package/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @atlaskit/editor-plugin-block-menu
 
+## 5.2.11
+
+### Patch Changes
+
+- [`0c673432d72e9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/0c673432d72e9) -
+  [ux] Fix bug / make wrap of expand convert to nestedExpand node
+
+## 5.2.10
+
+### Patch Changes
+
+- [`eb116a739e7c2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/eb116a739e7c2) -
+  [ux] Fix bug / make unwrap of expand convert nestedExpand node to regular expand node
+
 ## 5.2.9
 
 ### Patch Changes

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

@@ -48,21 +48,6 @@ var canWrapInTarget = function canWrapInTarget(node, targetNodeType, targetNodeT
   return targetNodeType.validContent(_model.Fragment.from(node));
 };
 
-/**
- * Converts a nestedExpand to a regular expand node.
- * NestedExpands can only exist inside expands, so when breaking out they must be converted.
- */
-var convertNestedExpandToExpand = function convertNestedExpandToExpand(node, schema) {
-  var _node$attrs;
-  var 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
@@ -108,14 +93,6 @@ var wrapMixedContentStep = exports.wrapMixedContentStep = function wrapMixedCont
       // 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();
-      var expandNode = convertNestedExpandToExpand(node, schema);
-      if (expandNode) {
-        result.push(expandNode);
-      }
     } else if (isTextNode(node)) {
       // Text node (heading, paragraph) that can't be wrapped - convert to paragraph
       // Example: heading can't go in blockquote, so convert to paragraph with same content

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

@@ -89,9 +89,9 @@ var TRANSFORM_STEPS_OVERRIDE = {
     decisionList: [_unwrapStep.unwrapStep, _wrapBlockquoteToDecisionListStep.wrapBlockquoteToDecisionListStep]
   },
   layoutSection: {
-    blockquote: [_unwrapLayoutStep.unwrapLayoutStep, _wrapStep.wrapStep],
+    blockquote: [_unwrapLayoutStep.unwrapLayoutStep, _wrapMixedContentStep.wrapMixedContentStep],
     expand: [_unwrapLayoutStep.unwrapLayoutStep, _wrapStep.wrapStep],
-    panel: [_unwrapLayoutStep.unwrapLayoutStep, _wrapStep.wrapStep],
+    panel: [_unwrapLayoutStep.unwrapLayoutStep, _wrapMixedContentStep.wrapMixedContentStep],
     codeBlock: [_unwrapLayoutStep.unwrapLayoutStep, _flattenStep.flattenStep, _wrapStep.wrapStep],
     paragraph: [_unwrapLayoutStep.unwrapLayoutStep]
   },

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

@@ -1,17 +1,21 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.unwrapExpandStep = void 0;
-var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
 var _unwrapStep = require("./unwrapStep");
+var _utils = require("./utils");
 /**
  * Unwraps an expand/nestedExpand node, converting its title attribute to a paragraph
  * and prepending it to the children.
  *
+ * Any nestedExpand children are converted to regular expands since nestedExpand
+ * can only exist inside an expand.
+ *
  * Example: expand({ title: 'title' })(p('b')) → [p('title'), p('b')]
+ * Example: expand({ title: 'outer' })(nestedExpand({ title: 'inner' })(p('x')))
+ *        → [p('outer'), expand({ title: 'inner' })(p('x'))]
  */
 var unwrapExpandStep = exports.unwrapExpandStep = function unwrapExpandStep(nodes, context) {
   var schema = context.schema;
@@ -33,8 +37,20 @@ var unwrapExpandStep = exports.unwrapExpandStep = function unwrapExpandStep(node
         }
       }
 
-      // Add the children
-      outputNodes.push.apply(outputNodes, (0, _toConsumableArray2.default)(node.children));
+      // Add the children, converting any nestedExpands to regular expands
+      // since nestedExpand can only exist inside an expand
+      node.children.forEach(function (child) {
+        if (child.type.name === nestedExpand.name) {
+          var expandNode = (0, _utils.convertNestedExpandToExpand)(child, schema);
+          if (expandNode) {
+            outputNodes.push(expandNode);
+          } else {
+            outputNodes.push(child);
+          }
+        } else {
+          outputNodes.push(child);
+        }
+      });
     } else {
       (0, _unwrapStep.unwrapStep)([node], context);
     }

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.isListType = exports.getTargetNodeTypeNameInContext = exports.getSelectedNode = exports.getBlockNodesInRange = exports.expandSelectionToBlockRange = void 0;
+exports.isListType = exports.getTargetNodeTypeNameInContext = exports.getSelectedNode = exports.getBlockNodesInRange = exports.expandSelectionToBlockRange = exports.convertNestedExpandToExpand = exports.convertExpandToNestedExpand = void 0;
 var _selection = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils = require("@atlaskit/editor-prosemirror/utils");
@@ -67,7 +67,7 @@ var getTargetNodeTypeNameInContext = exports.getTargetNodeTypeNameInContext = fu
  */
 var expandSelectionToBlockRange = exports.expandSelectionToBlockRange = function expandSelectionToBlockRange(selection, schema) {
   var nodes = schema.nodes;
-  var nodesNeedToExpandRange = [nodes.listItem, nodes.taskItem];
+  var 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
@@ -76,10 +76,11 @@ var expandSelectionToBlockRange = exports.expandSelectionToBlockRange = function
     var table = (0, _utils2.findTable)(selection);
     if (table) {
       var $from = selection.$from.doc.resolve(table.pos);
-      var $to = selection.$from.doc.resolve(table.pos + table.node.nodeSize);
+      var $to = selection.$from.doc.resolve(table.pos + table.node.nodeSize - 1);
       return {
         $from: $from,
-        $to: $to
+        $to: $to,
+        range: $from.blockRange($to)
       };
     }
   }
@@ -112,7 +113,42 @@ var isListType = exports.isListType = function isListType(node, schema) {
     return list === node.type;
   });
 };
+
+/**
+ * Converts a nestedExpand to a regular expand node.
+ * NestedExpands can only exist inside expands, so when breaking out or placing
+ * in containers that don't support nesting, they must be converted.
+ */
+var convertNestedExpandToExpand = exports.convertNestedExpandToExpand = function convertNestedExpandToExpand(node, schema) {
+  var _node$attrs;
+  var 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);
+};
+
+/**
+ * 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.
+ */
+var convertExpandToNestedExpand = exports.convertExpandToNestedExpand = function convertExpandToNestedExpand(node, schema) {
+  var _node$attrs2;
+  var 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);
+};
 var getBlockNodesInRange = exports.getBlockNodesInRange = function getBlockNodesInRange(range) {
+  if (range.startIndex === range.endIndex) {
+    return [];
+  }
   if (range.endIndex - range.startIndex <= 1) {
     return [range.parent.child(range.startIndex)];
   }

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

@@ -4,10 +4,29 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.wrapStep = void 0;
+var _utils = 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.
+ */
 var wrapStep = exports.wrapStep = function wrapStep(nodes, context) {
   var schema = context.schema,
     targetNodeTypeName = context.targetNodeTypeName;
-  var 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
+  var processedNodes = nodes;
+  if (targetNodeTypeName === 'expand') {
+    processedNodes = nodes.map(function (node) {
+      if (node.type.name === 'expand') {
+        var nestedExpandNode = (0, _utils.convertExpandToNestedExpand)(node, schema);
+        return nestedExpandNode !== null && nestedExpandNode !== void 0 ? nestedExpandNode : node;
+      }
+      return node;
+    });
+  }
+  var outputNode = schema.nodes[targetNodeTypeName].createAndFill({}, processedNodes);
   if (outputNode) {
     return [outputNode];
   }

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

@@ -17,7 +17,8 @@ var _formatMenuNested = require("./format-menu-nested");
 var _formatMenuSection = require("./format-menu-section");
 var _moveDown = require("./move-down");
 var _moveUp = require("./move-up");
-var _suggestedItemsRenderer = require("./suggested-items-renderer");
+var _suggestedItemsMenuSection = require("./suggested-items-menu-section");
+var _suggestedMenuItems = require("./suggested-menu-items");
 var getMoveUpMoveDownMenuComponents = function getMoveUpMoveDownMenuComponents(api) {
   return [{
     type: 'block-menu-item',
@@ -74,9 +75,13 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
       rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_SUGGESTED_MENU_SECTION.key]
     },
     component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_suggestedItemsRenderer.SuggestedItemsRenderer, {
+      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+          children: null
+        },
+        children = _ref2.children;
+      return /*#__PURE__*/_react.default.createElement(_suggestedItemsMenuSection.SuggestedItemsMenuSection, {
         api: api
-      });
+      }, children);
     }
   }, {
     type: 'block-menu-item',
@@ -85,6 +90,11 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
       type: 'block-menu-section',
       key: _blockMenu.TRANSFORM_SUGGESTED_MENU_SECTION.key,
       rank: _blockMenu.TRANSFORM_SUGGESTED_MENU_SECTION_RANK[_blockMenu.TRANSFORM_SUGGESTED_MENU_ITEM.key]
+    },
+    component: function component() {
+      return /*#__PURE__*/_react.default.createElement(_suggestedMenuItems.SuggestedMenuItems, {
+        api: api
+      });
     }
   }, {
     type: 'block-menu-section',
@@ -95,10 +105,10 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
       rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_CREATE_MENU_SECTION.key]
     },
     component: function component() {
-      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+      var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
           children: null
         },
-        children = _ref2.children;
+        children = _ref3.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         title: "Create"
       }, children);
@@ -112,10 +122,10 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
       rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION.key]
     },
     component: function component() {
-      var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+      var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
           children: null
         },
-        children = _ref3.children;
+        children = _ref4.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         title: "Structure"
       }, children);
@@ -129,10 +139,10 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
       rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_HEADINGS_MENU_SECTION.key]
     },
     component: function component() {
-      var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+      var _ref5 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
           children: null
         },
-        children = _ref4.children;
+        children = _ref5.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         title: "Headings",
         hasSeparator: true
@@ -142,23 +152,23 @@ var getTurnIntoMenuComponents = function getTurnIntoMenuComponents(api) {
     type: 'block-menu-section',
     key: _blockMenu.TRANSFORM_MENU_SECTION.key,
     rank: _blockMenu.MAIN_BLOCK_MENU_SECTION_RANK[_blockMenu.TRANSFORM_MENU_SECTION.key],
-    component: function component(_ref5) {
-      var children = _ref5.children;
+    component: function component(_ref6) {
+      var children = _ref6.children;
       return /*#__PURE__*/_react.default.createElement(_formatMenuSection.FormatMenuSection, {
         api: api
       }, children);
     }
   }];
 };
-var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(_ref6) {
-  var api = _ref6.api,
-    config = _ref6.config;
+var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(_ref7) {
+  var api = _ref7.api,
+    config = _ref7.config;
   return [].concat((0, _toConsumableArray2.default)(getTurnIntoMenuComponents(api)), [{
     type: 'block-menu-section',
     key: _blockMenu.BLOCK_ACTIONS_MENU_SECTION.key,
     rank: _blockMenu.MAIN_BLOCK_MENU_SECTION_RANK[_blockMenu.BLOCK_ACTIONS_MENU_SECTION.key],
-    component: function component(_ref7) {
-      var children = _ref7.children;
+    component: function component(_ref8) {
+      var children = _ref8.children;
       return /*#__PURE__*/_react.default.createElement(_copySection.CopySection, {
         api: api
       }, children);
@@ -181,8 +191,8 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
     type: 'block-menu-section',
     key: _blockMenu.POSITION_MENU_SECTION.key,
     rank: _blockMenu.MAIN_BLOCK_MENU_SECTION_RANK[_blockMenu.POSITION_MENU_SECTION.key],
-    component: function component(_ref8) {
-      var children = _ref8.children;
+    component: function component(_ref9) {
+      var children = _ref9.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         hasSeparator: true
       }, children);
@@ -191,8 +201,8 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
     type: 'block-menu-section',
     key: _blockMenu.DELETE_MENU_SECTION.key,
     rank: _blockMenu.MAIN_BLOCK_MENU_SECTION_RANK[_blockMenu.DELETE_MENU_SECTION.key],
-    component: function component(_ref9) {
-      var children = _ref9.children;
+    component: function component(_ref0) {
+      var children = _ref0.children;
       return /*#__PURE__*/_react.default.createElement(_deleteSection.DeleteSection, {
         api: api
       }, children);

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

@@ -0,0 +1,57 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useSuggestedItems = void 0;
+var _react = require("react");
+var _hooks = require("@atlaskit/editor-common/hooks");
+var _utils = require("../../editor-commands/transform-node-utils/utils");
+var _suggestedItemsRank = require("../utils/suggested-items-rank");
+var useSuggestedItems = exports.useSuggestedItems = function useSuggestedItems(api) {
+  var _api$blockMenu;
+  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['blockControls', 'selection'], function (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
+      };
+    }),
+    preservedSelection = _useSharedPluginState.preservedSelection,
+    selection = _useSharedPluginState.selection;
+  var blockMenuComponents = api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.getBlockMenuComponents();
+  var menuItemsMap = (0, _react.useMemo)(function () {
+    if (!blockMenuComponents) {
+      return new Map();
+    }
+    return new Map(blockMenuComponents.filter(function (c) {
+      return c.type === 'block-menu-item';
+    }).map(function (item) {
+      return [item.key, item];
+    }));
+  }, [blockMenuComponents]);
+  var suggestedItems = (0, _react.useMemo)(function () {
+    var currentSelection = preservedSelection || selection;
+    if (menuItemsMap.size === 0 || !currentSelection) {
+      return [];
+    }
+    var _expandSelectionToBlo = (0, _utils.expandSelectionToBlockRange)(currentSelection, currentSelection.$from.doc.type.schema),
+      range = _expandSelectionToBlo.range;
+    if (!range) {
+      return [];
+    }
+    var blockNodes = (0, _utils.getBlockNodesInRange)(range);
+    var singleNode = blockNodes.length === 1 ? blockNodes[0] : undefined;
+    if (!singleNode) {
+      return [];
+    }
+    var nodeTypeName = singleNode.type.name;
+    var sortedKeys = (0, _suggestedItemsRank.getSortedSuggestedItems)(nodeTypeName);
+    return sortedKeys.map(function (key) {
+      return menuItemsMap.get(key);
+    }).filter(function (item) {
+      return item !== undefined;
+    });
+  }, [menuItemsMap, preservedSelection, selection]);
+  return suggestedItems;
+};

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

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.SuggestedItemsMenuSection = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _useSuggestedItems = require("./hooks/useSuggestedItems");
+var SuggestedItemsMenuSection = exports.SuggestedItemsMenuSection = /*#__PURE__*/_react.default.memo(function (_ref) {
+  var api = _ref.api,
+    children = _ref.children;
+  var suggestedItems = (0, _useSuggestedItems.useSuggestedItems)(api);
+  if (suggestedItems.length === 0) {
+    return null;
+  }
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
+    title: "Suggested"
+  }, children);
+});

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/steps/wrapMixedContentStep.js

@@ -43,21 +43,6 @@ const canWrapInTarget = (node, targetNodeType, targetNodeTypeName) => {
   return targetNodeType.validContent(Fragment.from(node));
 };
 
-/**
- * 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
@@ -105,14 +90,6 @@ export const wrapMixedContentStep = (nodes, context) => {
       // 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 (isTextNode(node)) {
       // Text node (heading, paragraph) that can't be wrapped - convert to paragraph
       // Example: heading can't go in blockquote, so convert to paragraph with same content

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/unwrapExpandStep.js

@@ -1,10 +1,16 @@
 import { unwrapStep } from './unwrapStep';
+import { convertNestedExpandToExpand } from './utils';
 
 /**
  * Unwraps an expand/nestedExpand node, converting its title attribute to a paragraph
  * and prepending it to the children.
  *
+ * Any nestedExpand children are converted to regular expands since nestedExpand
+ * can only exist inside an expand.
+ *
  * Example: expand({ title: 'title' })(p('b')) → [p('title'), p('b')]
+ * Example: expand({ title: 'outer' })(nestedExpand({ title: 'inner' })(p('x')))
+ *        → [p('outer'), expand({ title: 'inner' })(p('x'))]
  */
 export const unwrapExpandStep = (nodes, context) => {
   const {
@@ -29,8 +35,20 @@ export const unwrapExpandStep = (nodes, context) => {
         }
       }
 
-      // Add the children
-      outputNodes.push(...node.children);
+      // Add the children, converting any nestedExpands to regular expands
+      // since nestedExpand can only exist inside an expand
+      node.children.forEach(child => {
+        if (child.type.name === nestedExpand.name) {
+          const expandNode = convertNestedExpandToExpand(child, schema);
+          if (expandNode) {
+            outputNodes.push(expandNode);
+          } else {
+            outputNodes.push(child);
+          }
+        } else {
+          outputNodes.push(child);
+        }
+      });
     } else {
       unwrapStep([node], context);
     }

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)
       };
     }
   }
@@ -107,7 +108,42 @@ export const isListType = (node, schema) => {
   const lists = [schema.nodes.taskList, schema.nodes.bulletList, schema.nodes.orderedList];
   return lists.some(list => list === node.type);
 };
+
+/**
+ * Converts a nestedExpand to a regular expand node.
+ * NestedExpands can only exist inside expands, so when breaking out or placing
+ * in containers that don't support nesting, they must be converted.
+ */
+export 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);
+};
+
+/**
+ * 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)];
   }