@atlaskit/editor-plugin-block-menu 1.0.3 → 1.0.5

package/dist/es2019/editor-commands/transforms/list/transformBetweenListTypes.js

@@ -1,3 +1,5 @@
+import { getSupportedListTypesSet, isBulletOrOrderedList, isTaskList } from '../utils';
+
 /**
  * Convert a block node to inline content suitable for task items
  */
@@ -6,89 +8,92 @@ const convertBlockToInlineContent = (node, schema) => {
     paragraph
   } = schema.nodes;
   if (node.type === paragraph) {
-    // Extract inline content from paragraphs
     return [...node.content.content];
-  } else if (node.isBlock) {
-    // For other block content types eg. codeBlock, extract their text content and create text nodes
+  }
+  if (node.isBlock) {
     const textContent = node.textContent;
-    if (textContent) {
-      const textNode = schema.text(textContent);
-      return [textNode];
-    }
-  } else {
-    // Already inline content, add directly
-    return [node];
+    return textContent ? [schema.text(textContent)] : [];
   }
-  return [];
+  return [node];
 };
 
 /**
- * Transform list structure
+ * Transform list structure between different list types
  */
-export const transformListStructure = (tr, listNode, targetNodeType, nodes) => {
+export const transformListStructure = context => {
+  const {
+    tr,
+    sourceNode,
+    sourcePos,
+    targetNodeType
+  } = context;
+  const nodes = tr.doc.type.schema.nodes;
   try {
+    const listNode = {
+      node: sourceNode,
+      pos: sourcePos
+    };
     const {
       node: sourceList,
       pos: listPos
     } = listNode;
     const {
-      bulletList,
-      orderedList,
       taskList,
       listItem,
       taskItem,
       paragraph
     } = nodes;
-    const isSourceBulletOrOrdered = sourceList.type === bulletList || sourceList.type === orderedList;
-    const isTargetTask = targetNodeType === taskList;
-    const isSourceTask = sourceList.type === taskList;
-    const newListItems = [];
-    const listStart = listPos;
-    const listEnd = listPos + sourceList.nodeSize;
-
-    // Use nodesBetween to efficiently traverse the list structure
-    tr.doc.nodesBetween(listStart, listEnd, (node, pos, parent) => {
-      // Only process direct children of the list (depth 1)
-      if (parent !== sourceList) {
-        return true; // Continue traversal
-      }
-      if (isSourceBulletOrOrdered && isTargetTask) {
-        // Converting from bullet/ordered list to task list
-        // Extract inline content from all children within listItem
-        if (node.type === listItem) {
-          const inlineContent = [];
-          // Extract inline content from all child nodes
-          node.forEach(child => {
-            inlineContent.push(...convertBlockToInlineContent(child, tr.doc.type.schema));
-          });
-          if (inlineContent.length > 0) {
-            const newItem = taskItem.create(null, inlineContent);
-            newListItems.push(newItem);
+    const isSourceBulletOrOrdered = isBulletOrOrderedList(sourceList.type);
+    const isTargetTask = isTaskList(targetNodeType);
+    const isSourceTask = isTaskList(sourceList.type);
+    const isTargetBulletOrOrdered = isBulletOrOrderedList(targetNodeType);
+    const supportedListTypes = getSupportedListTypesSet(nodes);
+    const transformListRecursively = listNode => {
+      const transformedItems = [];
+      listNode.forEach(child => {
+        if (isSourceBulletOrOrdered && isTargetTask) {
+          // Convert bullet/ordered => task
+          if (child.type === listItem) {
+            const inlineContent = [];
+            const nestedTaskLists = [];
+            child.forEach(grandChild => {
+              if (supportedListTypes.has(grandChild.type) && grandChild.type !== taskList) {
+                nestedTaskLists.push(transformListRecursively(grandChild));
+              } else {
+                inlineContent.push(...convertBlockToInlineContent(grandChild, tr.doc.type.schema));
+              }
+            });
+            if (inlineContent.length > 0) {
+              transformedItems.push(taskItem.create(null, inlineContent));
+            }
+            transformedItems.push(...nestedTaskLists);
           }
-        }
-      } else if (isSourceTask && !isTargetTask) {
-        // Converting from task list to bullet/ordered list
-        // Structure: taskItem > inline content -> listItem > paragraph > inline content
-        if (node.type === taskItem) {
-          const inlineContent = [...node.content.content];
-          if (inlineContent.length > 0) {
-            const paragraphNode = paragraph.create(null, inlineContent);
-            const newListItem = listItem.create(null, paragraphNode);
-            newListItems.push(newListItem);
+        } else if (isSourceTask && isTargetBulletOrOrdered) {
+          // Convert task => bullet/ordered
+          if (child.type === taskItem) {
+            const inlineContent = [...child.content.content];
+            if (inlineContent.length > 0) {
+              const paragraphNode = paragraph.create(null, inlineContent);
+              transformedItems.push(listItem.create(null, [paragraphNode]));
+            }
+          } else if (child.type === taskList) {
+            const transformedNestedList = transformListRecursively(child);
+            const lastItem = transformedItems[transformedItems.length - 1];
+            if ((lastItem === null || lastItem === void 0 ? void 0 : lastItem.type) === listItem) {
+              // Attach nested list to previous item
+              const updatedContent = [...lastItem.content.content, transformedNestedList];
+              transformedItems[transformedItems.length - 1] = listItem.create(lastItem.attrs, updatedContent);
+            } else {
+              // No previous item, flatten nested items
+              transformedItems.push(...transformedNestedList.content.content);
+            }
           }
         }
-      }
-      return false; // Don't traverse into children of list items
-    });
-    if (newListItems.length === 0) {
-      return tr;
-    }
-
-    // Create new list with transformed items
-    const newList = targetNodeType.create(null, newListItems);
-
-    // Replace the entire list
-    tr.replaceWith(listStart, listEnd, newList);
+      });
+      return targetNodeType.create(null, transformedItems);
+    };
+    const newList = transformListRecursively(sourceList);
+    tr.replaceWith(listPos, listPos + sourceList.nodeSize, newList);
     return tr;
   } catch {
     return tr;

package/dist/es2019/editor-commands/transforms/list-transforms.js

@@ -1,10 +1,10 @@
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { findWrapping } from '@atlaskit/editor-prosemirror/transform';
-import { findParentNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { transformListStructure } from './list/transformBetweenListTypes';
 import { transformOrderedUnorderedListToBlockNodes } from './list/transformOrderedUnorderedListToBlockNodes';
 import { transformTaskListToBlockNodes } from './list/transformTaskListToBlockNodes';
 import { transformToTaskList } from './list/transformToTaskList';
-import { isBlockNodeType, isContainerNodeType, isListNodeType } from './utils';
+import { getSupportedListTypesSet, isBulletOrOrderedList, isBlockNodeType, isContainerNodeType, isListNodeType, isTaskList } from './utils';
 
 /**
  * Transform selection to list type
@@ -27,7 +27,7 @@ export const transformBlockToList = context => {
   const {
     nodes
   } = tr.doc.type.schema;
-  const isTargetTask = targetNodeType === nodes.taskList;
+  const isTargetTask = isTaskList(targetNodeType);
 
   // Handle task lists differently due to their structure
   if (isTargetTask) {
@@ -65,6 +65,65 @@ export const transformListToBlockNodes = context => {
   }
 };
 
+/**
+ * Wraps bulletList, orderedList or taskList in node of container type
+ */
+export const transformListToContainer = context => {
+  const {
+    tr,
+    sourceNode,
+    sourcePos,
+    targetNodeType,
+    targetAttrs
+  } = context;
+  if (sourcePos === null) {
+    return null;
+  }
+  const {
+    schema
+  } = tr.doc.type;
+  const {
+    blockquote,
+    taskList,
+    taskItem,
+    paragraph
+  } = schema.nodes;
+
+  // Special case: Task list -> Blockquote
+  // Flattens the task list before wrapping by blockquote
+  if (sourceNode.type === taskList && targetNodeType === blockquote) {
+    const extractParagraphsFromTaskList = node => {
+      const paragraphs = [];
+      node.forEach(child => {
+        if (child.type === taskItem) {
+          if (child.content.size > 0) {
+            const paragraphNode = paragraph.createChecked({}, child.content.content);
+            paragraphs.push(paragraphNode);
+          }
+        } else if (child.type === taskList) {
+          paragraphs.push(...extractParagraphsFromTaskList(child));
+        }
+      });
+      return paragraphs;
+    };
+    const liftedParagraphs = extractParagraphsFromTaskList(sourceNode);
+    const containerNode = targetNodeType.createAndFill(targetAttrs, Fragment.from(liftedParagraphs));
+    if (!containerNode) {
+      return null;
+    }
+    tr.replaceWith(sourcePos, sourcePos + sourceNode.nodeSize, containerNode);
+    return tr;
+  }
+
+  // Default case
+  const containerNode = targetNodeType.createAndFill(targetAttrs, [sourceNode]);
+  if (!containerNode) {
+    return null;
+  }
+  tr.replaceWith(sourcePos, sourcePos + sourceNode.nodeSize, containerNode);
+  return tr;
+};
+
 /**
  * Transform list nodes
  */
@@ -80,8 +139,8 @@ export const transformListNode = context => {
 
   // Transform list to container type
   if (isContainerNodeType(targetNodeType)) {
-    // Lift list items out of the list and convert to container type
-    return null;
+    // Wrap list items into container type, where possible
+    return transformListToContainer(context);
   }
 
   // Transform between list types
@@ -102,41 +161,52 @@ export const liftListToBlockType = () => {
 /**
  * Transform between different list types
  */
-export const transformBetweenListTypes = ({
-  tr,
-  targetNodeType
-}) => {
+export const transformBetweenListTypes = context => {
   const {
-    selection
-  } = tr;
+    tr,
+    sourceNode,
+    sourcePos,
+    targetNodeType
+  } = context;
   const {
     nodes
   } = tr.doc.type.schema;
-
-  // Find the list node - support bullet lists, ordered lists, and task lists
-  const supportedListTypes = [nodes.bulletList, nodes.orderedList, nodes.taskList].filter(Boolean); // Filter out undefined nodes in case some schemas don't have all types
-
-  const listNode = findParentNodeOfType(supportedListTypes)(selection);
-  if (!listNode) {
-    return null;
-  }
-  const sourceListType = listNode.node.type;
-  const isSourceBulletOrOrdered = sourceListType === nodes.bulletList || sourceListType === nodes.orderedList;
-  const isTargetTask = targetNodeType === nodes.taskList;
-  const isSourceTask = sourceListType === nodes.taskList;
-  const isTargetBulletOrOrdered = targetNodeType === nodes.bulletList || targetNodeType === nodes.orderedList;
+  const sourceListType = sourceNode.type;
+  const isSourceBulletOrOrdered = isBulletOrOrderedList(sourceListType);
+  const isTargetTask = isTaskList(targetNodeType);
+  const isSourceTask = isTaskList(sourceListType);
+  const isTargetBulletOrOrdered = isBulletOrOrderedList(targetNodeType);
 
   // Check if we need structure transformation
   const needsStructureTransform = isSourceBulletOrOrdered && isTargetTask || isSourceTask && isTargetBulletOrOrdered;
   try {
     if (!needsStructureTransform) {
       // Simple type change for same structure lists (bullet <-> ordered)
-      tr.setNodeMarkup(listNode.pos, targetNodeType);
+      // Apply to the main list
+      tr.setNodeMarkup(sourcePos, targetNodeType);
+
+      // Apply to nested lists
+      const listStart = sourcePos;
+      const listEnd = sourcePos + sourceNode.nodeSize;
+      const supportedListTypesSet = getSupportedListTypesSet(nodes);
+      tr.doc.nodesBetween(listStart, listEnd, (node, pos, parent) => {
+        // Only process nested lists (not the root list we already handled)
+        if (supportedListTypesSet.has(node.type) && pos !== sourcePos) {
+          const isNestedList = parent && (supportedListTypesSet.has(parent.type) || parent.type === nodes.listItem);
+          if (isNestedList) {
+            const shouldTransformNode = node.type === sourceListType || isBulletOrOrderedList(node.type) && isTargetBulletOrOrdered;
+            if (shouldTransformNode) {
+              tr.setNodeMarkup(pos, targetNodeType);
+            }
+          }
+        }
+        return true; // Continue traversing
+      });
+      return tr;
     } else {
-      tr = transformListStructure(tr, listNode, targetNodeType, nodes);
+      return transformListStructure(context);
     }
   } catch {
     return null;
   }
-  return tr;
 };

package/dist/es2019/editor-commands/transforms/transformNodeToTargetType.js

@@ -1,7 +1,8 @@
 import { transformBlockNode } from './block-transforms';
 import { transformContainerNode } from './container-transforms';
+import { convertToLayout } from './layout-transforms';
 import { transformListNode } from './list-transforms';
-import { getTargetNodeInfo, isBlockNode, isListNode, isContainerNode } from './utils';
+import { getTargetNodeInfo, isBlockNode, isListNode, isContainerNode, isLayoutNodeType } from './utils';
 export function transformNodeToTargetType(tr, sourceNode, sourcePos, targetType) {
   const {
     nodes
@@ -41,6 +42,9 @@ export function transformNodeToTargetType(tr, sourceNode, sourcePos, targetType)
 
   // Route to appropriate transformation strategy based on source node type
   try {
+    if (isLayoutNodeType(targetNodeType)) {
+      return convertToLayout(transformationContext);
+    }
     if (isBlockNode(sourceNode)) {
       return transformBlockNode(transformationContext);
     }

package/dist/es2019/editor-commands/transforms/utils.js

@@ -77,6 +77,10 @@ export const getTargetNodeInfo = (targetType, nodes) => {
       return {
         nodeType: nodes.taskList
       };
+    case 'layoutSection':
+      return {
+        nodeType: nodes.layoutSection
+      };
     default:
       return null;
   }
@@ -87,7 +91,7 @@ export const isBlockNode = node => {
   return ['paragraph', 'heading', 'codeBlock'].includes(node.type.name);
 };
 export const isListNode = node => {
-  return ['bulletList', 'orderedList', 'taskList', 'listItem'].includes(node.type.name);
+  return ['bulletList', 'orderedList', 'taskList'].includes(node.type.name);
 };
 export const isContainerNode = node => {
   return ['panel', 'expand', 'blockquote'].includes(node.type.name);
@@ -100,4 +104,21 @@ export const isListNodeType = nodeType => {
 };
 export const isContainerNodeType = nodeType => {
   return ['panel', 'expand', 'blockquote'].includes(nodeType.name);
+};
+
+// List type utilities
+export const isBulletOrOrderedList = nodeType => {
+  return nodeType.name === 'bulletList' || nodeType.name === 'orderedList';
+};
+export const isTaskList = nodeType => {
+  return nodeType.name === 'taskList';
+};
+export const getSupportedListTypes = nodes => {
+  return [nodes.bulletList, nodes.orderedList, nodes.taskList].filter(Boolean);
+};
+export const getSupportedListTypesSet = nodes => {
+  return new Set(getSupportedListTypes(nodes));
+};
+export const isLayoutNodeType = nodeType => {
+  return nodeType.name === 'layoutSection';
 };

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

@@ -54,7 +54,8 @@ const getFormatMenuComponents = () => {
         }),
         elemAfter: /*#__PURE__*/React.createElement(ChevronRightIcon, {
           label: 'example nested menu'
-        })
+        }),
+        enableMaxHeight: true
       }, children);
     }
   }, {

package/dist/esm/editor-commands/formatNode.js

@@ -12,7 +12,7 @@ export var formatNode = function formatNode(targetType) {
 
     // Find the node to format from the current selection
     var nodeToFormat;
-    var nodePos = null;
+    var nodePos = selection.from;
 
     // Try to find the current node from selection
     var selectedNode = findSelectedNodeOfType([nodes.paragraph, nodes.heading, nodes.blockquote, nodes.panel, nodes.expand, nodes.codeBlock, nodes.bulletList, nodes.orderedList, nodes.taskList, nodes.layoutSection])(selection);

package/dist/esm/editor-commands/transforms/layout-transforms.js

@@ -0,0 +1,24 @@
+import { DEFAULT_TWO_COLUMN_LAYOUT_COLUMN_WIDTH } from '@atlaskit/editor-common/styles';
+import { Fragment } from '@atlaskit/editor-prosemirror/model';
+export var convertToLayout = function convertToLayout(context) {
+  var tr = context.tr,
+    sourceNode = context.sourceNode,
+    sourcePos = context.sourcePos;
+  var _ref = tr.doc.type.schema.nodes || {},
+    layoutSection = _ref.layoutSection,
+    layoutColumn = _ref.layoutColumn,
+    paragraph = _ref.paragraph;
+  var content = sourceNode.mark(sourceNode.marks.filter(function (mark) {
+    return mark.type.name !== 'breakout';
+  }));
+  var layoutContent = Fragment.fromArray([layoutColumn.createChecked({
+    width: DEFAULT_TWO_COLUMN_LAYOUT_COLUMN_WIDTH
+  }, content), layoutColumn.create({
+    width: DEFAULT_TWO_COLUMN_LAYOUT_COLUMN_WIDTH
+  }, paragraph.createAndFill())]);
+  var layoutSectionNode = layoutSection.createChecked(undefined, layoutContent);
+
+  // Replace the original node with the new layout node
+  tr.replaceRangeWith(sourcePos || 0, (sourcePos || 0) + sourceNode.nodeSize, layoutSectionNode);
+  return tr;
+};

package/dist/esm/editor-commands/transforms/list/transformBetweenListTypes.js

@@ -1,89 +1,92 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
+import { getSupportedListTypesSet, isBulletOrOrderedList, isTaskList } from '../utils';
+
 /**
  * Convert a block node to inline content suitable for task items
  */
 var convertBlockToInlineContent = function convertBlockToInlineContent(node, schema) {
   var paragraph = schema.nodes.paragraph;
   if (node.type === paragraph) {
-    // Extract inline content from paragraphs
     return _toConsumableArray(node.content.content);
-  } else if (node.isBlock) {
-    // For other block content types eg. codeBlock, extract their text content and create text nodes
+  }
+  if (node.isBlock) {
     var textContent = node.textContent;
-    if (textContent) {
-      var textNode = schema.text(textContent);
-      return [textNode];
-    }
-  } else {
-    // Already inline content, add directly
-    return [node];
+    return textContent ? [schema.text(textContent)] : [];
   }
-  return [];
+  return [node];
 };
 
 /**
- * Transform list structure
+ * Transform list structure between different list types
  */
-export var transformListStructure = function transformListStructure(tr, listNode, targetNodeType, nodes) {
+export var transformListStructure = function transformListStructure(context) {
+  var tr = context.tr,
+    sourceNode = context.sourceNode,
+    sourcePos = context.sourcePos,
+    targetNodeType = context.targetNodeType;
+  var nodes = tr.doc.type.schema.nodes;
   try {
+    var listNode = {
+      node: sourceNode,
+      pos: sourcePos
+    };
     var sourceList = listNode.node,
       listPos = listNode.pos;
-    var bulletList = nodes.bulletList,
-      orderedList = nodes.orderedList,
-      taskList = nodes.taskList,
+    var taskList = nodes.taskList,
       listItem = nodes.listItem,
       taskItem = nodes.taskItem,
       paragraph = nodes.paragraph;
-    var isSourceBulletOrOrdered = sourceList.type === bulletList || sourceList.type === orderedList;
-    var isTargetTask = targetNodeType === taskList;
-    var isSourceTask = sourceList.type === taskList;
-    var newListItems = [];
-    var listStart = listPos;
-    var listEnd = listPos + sourceList.nodeSize;
-
-    // Use nodesBetween to efficiently traverse the list structure
-    tr.doc.nodesBetween(listStart, listEnd, function (node, pos, parent) {
-      // Only process direct children of the list (depth 1)
-      if (parent !== sourceList) {
-        return true; // Continue traversal
-      }
-      if (isSourceBulletOrOrdered && isTargetTask) {
-        // Converting from bullet/ordered list to task list
-        // Extract inline content from all children within listItem
-        if (node.type === listItem) {
-          var inlineContent = [];
-          // Extract inline content from all child nodes
-          node.forEach(function (child) {
-            inlineContent.push.apply(inlineContent, _toConsumableArray(convertBlockToInlineContent(child, tr.doc.type.schema)));
-          });
-          if (inlineContent.length > 0) {
-            var newItem = taskItem.create(null, inlineContent);
-            newListItems.push(newItem);
+    var isSourceBulletOrOrdered = isBulletOrOrderedList(sourceList.type);
+    var isTargetTask = isTaskList(targetNodeType);
+    var isSourceTask = isTaskList(sourceList.type);
+    var isTargetBulletOrOrdered = isBulletOrOrderedList(targetNodeType);
+    var supportedListTypes = getSupportedListTypesSet(nodes);
+    var _transformListRecursively = function transformListRecursively(listNode) {
+      var transformedItems = [];
+      listNode.forEach(function (child) {
+        if (isSourceBulletOrOrdered && isTargetTask) {
+          // Convert bullet/ordered => task
+          if (child.type === listItem) {
+            var inlineContent = [];
+            var nestedTaskLists = [];
+            child.forEach(function (grandChild) {
+              if (supportedListTypes.has(grandChild.type) && grandChild.type !== taskList) {
+                nestedTaskLists.push(_transformListRecursively(grandChild));
+              } else {
+                inlineContent.push.apply(inlineContent, _toConsumableArray(convertBlockToInlineContent(grandChild, tr.doc.type.schema)));
+              }
+            });
+            if (inlineContent.length > 0) {
+              transformedItems.push(taskItem.create(null, inlineContent));
+            }
+            transformedItems.push.apply(transformedItems, nestedTaskLists);
           }
-        }
-      } else if (isSourceTask && !isTargetTask) {
-        // Converting from task list to bullet/ordered list
-        // Structure: taskItem > inline content -> listItem > paragraph > inline content
-        if (node.type === taskItem) {
-          var _inlineContent = _toConsumableArray(node.content.content);
-          if (_inlineContent.length > 0) {
-            var paragraphNode = paragraph.create(null, _inlineContent);
-            var newListItem = listItem.create(null, paragraphNode);
-            newListItems.push(newListItem);
+        } else if (isSourceTask && isTargetBulletOrOrdered) {
+          // Convert task => bullet/ordered
+          if (child.type === taskItem) {
+            var _inlineContent = _toConsumableArray(child.content.content);
+            if (_inlineContent.length > 0) {
+              var paragraphNode = paragraph.create(null, _inlineContent);
+              transformedItems.push(listItem.create(null, [paragraphNode]));
+            }
+          } else if (child.type === taskList) {
+            var transformedNestedList = _transformListRecursively(child);
+            var lastItem = transformedItems[transformedItems.length - 1];
+            if ((lastItem === null || lastItem === void 0 ? void 0 : lastItem.type) === listItem) {
+              // Attach nested list to previous item
+              var updatedContent = [].concat(_toConsumableArray(lastItem.content.content), [transformedNestedList]);
+              transformedItems[transformedItems.length - 1] = listItem.create(lastItem.attrs, updatedContent);
+            } else {
+              // No previous item, flatten nested items
+              transformedItems.push.apply(transformedItems, _toConsumableArray(transformedNestedList.content.content));
+            }
           }
         }
-      }
-      return false; // Don't traverse into children of list items
-    });
-    if (newListItems.length === 0) {
-      return tr;
-    }
-
-    // Create new list with transformed items
-    var newList = targetNodeType.create(null, newListItems);
-
-    // Replace the entire list
-    tr.replaceWith(listStart, listEnd, newList);
+      });
+      return targetNodeType.create(null, transformedItems);
+    };
+    var newList = _transformListRecursively(sourceList);
+    tr.replaceWith(listPos, listPos + sourceList.nodeSize, newList);
     return tr;
   } catch (_unused) {
     return tr;