@atlaskit/editor-plugin-block-menu 3.0.1 → 3.0.2

package/CHANGELOG.md

@@ -1,5 +1,13 @@
 # @atlaskit/editor-plugin-block-menu
 
+## 3.0.2
+
+### Patch Changes
+
+- [`d6f3f3b09ebff`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/d6f3f3b09ebff) -
+  [ux] ED-29255 Fix layout transformation when column is empty, transform nested lists to match
+  container to list transformations and fix task list transforms when task item is empty
+
 ## 3.0.1
 
 ### Patch Changes

package/dist/cjs/editor-commands/transforms/inline-node-transforms.js

@@ -11,7 +11,7 @@ var getInlineNodeTextContent = exports.getInlineNodeTextContent = function getIn
   }
   // Headings are not valid inside headings so convert heading nodes to paragraphs
   sourceContent.forEach(function (node) {
-    if (['paragraph', 'heading'].includes(node.type.name)) {
+    if (['paragraph', 'heading', 'taskItem'].includes(node.type.name)) {
       node.content.forEach(function (inlineNode) {
         if (inlineNode.type.name === 'status') {
           validTransformedContent += inlineNode.attrs.text;

package/dist/cjs/editor-commands/transforms/layout/utils.js

@@ -80,57 +80,104 @@ var unwrapLayoutNodesToTextNodes = exports.unwrapLayoutNodesToTextNodes = functi
   }
   return [sourceNode];
 };
-var transformToBlockNode = function transformToBlockNode(nodes, targetNodeType, schema) {
-  if (targetNodeType === schema.nodes.codeBlock) {
-    var newNodes = [];
-    nodes.forEach(function (node) {
-      if (node.isTextblock) {
-        var inlineTextContent = node.type === schema.nodes.codeBlock ? node.textContent : (0, _inlineNodeTransforms.getInlineNodeTextContent)(_model.Fragment.from(node));
-
-        // For first node, add directly
-        if (newNodes.length === 0) {
-          newNodes.push({
-            canBeTransformed: true,
-            content: [inlineTextContent]
-          });
-        } else {
-          // Check if last node can also be transformed, if yes then append content
-          var lastItem = newNodes[newNodes.length - 1];
-          if (lastItem.canBeTransformed) {
-            newNodes[newNodes.length - 1] = {
-              content: [].concat((0, _toConsumableArray2.default)(lastItem.content), [inlineTextContent]),
-              canBeTransformed: true
-            };
-          } else {
-            newNodes.push({
-              content: [inlineTextContent],
-              canBeTransformed: true
-            });
-          }
-        }
+var transformToCodeBlock = function transformToCodeBlock(nodes, schema) {
+  var newNodes = [];
+  var addToNewNodes = function addToNewNodes(content) {
+    if (newNodes.length === 0) {
+      newNodes.push({
+        canBeTransformed: true,
+        content: content
+      });
+    } else {
+      // Check if last node can also be transformed, if yes then append content
+      var lastItem = newNodes[newNodes.length - 1];
+      if (lastItem.canBeTransformed) {
+        newNodes[newNodes.length - 1] = {
+          content: [].concat((0, _toConsumableArray2.default)(lastItem.content), (0, _toConsumableArray2.default)(content)),
+          canBeTransformed: true
+        };
       } else {
-        // If not text block, then cannot be transformed
         newNodes.push({
-          canBeTransformed: false,
-          content: node
+          content: content,
+          canBeTransformed: true
         });
       }
-    });
-    return newNodes.map(function (_ref) {
-      var canBeTransformed = _ref.canBeTransformed,
-        content = _ref.content;
-      if (canBeTransformed) {
-        var text = content.join('\n');
-        if (text === '') {
-          return undefined;
+    }
+  };
+  nodes.forEach(function (node) {
+    if (node.isTextblock) {
+      var inlineTextContent = node.type === schema.nodes.codeBlock ? node.textContent : (0, _inlineNodeTransforms.getInlineNodeTextContent)(_model.Fragment.from(node));
+
+      // For first node, add directly
+      addToNewNodes([inlineTextContent]);
+    } else if ((0, _utils2.isListNode)(node)) {
+      var textContent = [];
+      var listItemType = node.type === schema.nodes.taskList ? schema.nodes.taskItem : schema.nodes.listItem;
+      var listItems = (0, _utils.findChildrenByType)(node, listItemType).map(function (item) {
+        return item.node;
+      });
+      listItems.forEach(function (listItem) {
+        if (listItem.type === schema.nodes.taskItem) {
+          var _inlineTextContent = (0, _inlineNodeTransforms.getInlineNodeTextContent)(_model.Fragment.from(listItem));
+          textContent.push(_inlineTextContent);
+        } else {
+          var _inlineTextContent2 = (0, _inlineNodeTransforms.getInlineNodeTextContent)(listItem.content);
+          textContent.push(_inlineTextContent2);
         }
-        return targetNodeType.createChecked(null, schema.text(text));
-      } else {
-        return content;
+      });
+      addToNewNodes(textContent);
+    } else {
+      // If not text block or list node, then cannot be transformed
+      newNodes.push({
+        canBeTransformed: false,
+        content: node
+      });
+    }
+  });
+  return newNodes.map(function (_ref) {
+    var canBeTransformed = _ref.canBeTransformed,
+      content = _ref.content;
+    if (canBeTransformed) {
+      var text = content.join('\n');
+      if (text === '') {
+        return undefined;
       }
-    }).filter(Boolean);
+      return schema.nodes.codeBlock.createChecked(null, schema.text(text));
+    } else {
+      return content;
+    }
+  }).filter(Boolean);
+};
+var transformToBlockNode = function transformToBlockNode(nodes, targetNodeType, schema) {
+  if (targetNodeType === schema.nodes.codeBlock) {
+    return transformToCodeBlock(nodes, schema);
   }
-  return nodes;
+  var newNodes = [];
+  nodes.forEach(function (node) {
+    if ((0, _utils2.isListNode)(node)) {
+      var listItemType = node.type === schema.nodes.taskList ? schema.nodes.taskItem : schema.nodes.listItem;
+      var listItems = (0, _utils.findChildrenByType)(node, listItemType).map(function (item) {
+        return item.node;
+      });
+      listItems.forEach(function (listItem) {
+        if (listItem.type === schema.nodes.taskItem) {
+          var inlineContent = (0, _toConsumableArray2.default)(listItem.content.content);
+          if (inlineContent.length > 0) {
+            newNodes.push(targetNodeType.createChecked(null, inlineContent));
+          }
+        } else {
+          listItem.forEach(function (child) {
+            if ((0, _utils2.isHeadingOrParagraphNode)(child)) {
+              newNodes.push(targetNodeType.createChecked(null, (0, _toConsumableArray2.default)(child.content.content)));
+            }
+          });
+        }
+      });
+    } else {
+      newNodes.push(node);
+    }
+  });
+  return newNodes;
 };
 var transformToContainerNode = function transformToContainerNode(nodes, targetNodeType) {
   var newNodes = [];
@@ -276,6 +323,9 @@ var transformToListNode = exports.transformToListNode = function transformToList
   });
 };
 var convertUnwrappedLayoutContent = exports.convertUnwrappedLayoutContent = function convertUnwrappedLayoutContent(nodes, targetNodeType, schema) {
+  if (nodes.length === 1 && nodes[0].content.size === 0) {
+    return nodes;
+  }
   if ((0, _utils2.isBlockNodeType)(targetNodeType)) {
     return transformToBlockNode(nodes, targetNodeType, schema);
   }

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

@@ -54,19 +54,15 @@ var _transformListRecursively = exports.transformListRecursively = function tran
             inlineContent.push.apply(inlineContent, (0, _toConsumableArray2.default)(convertBlockToInlineContent(grandChild, schema)));
           }
         });
-        if (inlineContent.length > 0) {
-          transformedItems.push(taskItem.create(null, inlineContent));
-        }
+        transformedItems.push(taskItem.create(null, inlineContent.length > 0 ? inlineContent : null));
         transformedItems.push.apply(transformedItems, nestedTaskLists);
       }
     } else if (isSourceTask && isTargetBulletOrOrdered) {
       // Convert task => bullet/ordered
       if (child.type === taskItem) {
         var _inlineContent = (0, _toConsumableArray2.default)(child.content.content);
-        if (_inlineContent.length > 0) {
-          var paragraphNode = paragraph.create(null, _inlineContent);
-          transformedItems.push(listItem.create(null, [paragraphNode]));
-        }
+        var paragraphNode = paragraph.create(null, _inlineContent.length > 0 ? _inlineContent : null);
+        transformedItems.push(listItem.create(null, [paragraphNode]));
       } else if (child.type === taskList) {
         var transformedNestedList = _transformListRecursively(_objectSpread(_objectSpread({}, props), {}, {
           listNode: child

package/dist/es2019/editor-commands/transforms/inline-node-transforms.js

@@ -5,7 +5,7 @@ export const getInlineNodeTextContent = sourceContent => {
   }
   // Headings are not valid inside headings so convert heading nodes to paragraphs
   sourceContent.forEach(node => {
-    if (['paragraph', 'heading'].includes(node.type.name)) {
+    if (['paragraph', 'heading', 'taskItem'].includes(node.type.name)) {
       node.content.forEach(inlineNode => {
         if (inlineNode.type.name === 'status') {
           validTransformedContent += inlineNode.attrs.text;

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

@@ -62,58 +62,101 @@ export const unwrapLayoutNodesToTextNodes = (context, finalTargetNodeType) => {
   }
   return [sourceNode];
 };
-const transformToBlockNode = (nodes, targetNodeType, schema) => {
-  if (targetNodeType === schema.nodes.codeBlock) {
-    const newNodes = [];
-    nodes.forEach(node => {
-      if (node.isTextblock) {
-        const inlineTextContent = node.type === schema.nodes.codeBlock ? node.textContent : getInlineNodeTextContent(Fragment.from(node));
-
-        // For first node, add directly
-        if (newNodes.length === 0) {
-          newNodes.push({
-            canBeTransformed: true,
-            content: [inlineTextContent]
-          });
-        } else {
-          // Check if last node can also be transformed, if yes then append content
-          const lastItem = newNodes[newNodes.length - 1];
-          if (lastItem.canBeTransformed) {
-            newNodes[newNodes.length - 1] = {
-              content: [...lastItem.content, inlineTextContent],
-              canBeTransformed: true
-            };
-          } else {
-            newNodes.push({
-              content: [inlineTextContent],
-              canBeTransformed: true
-            });
-          }
-        }
+const transformToCodeBlock = (nodes, schema) => {
+  const newNodes = [];
+  const addToNewNodes = content => {
+    if (newNodes.length === 0) {
+      newNodes.push({
+        canBeTransformed: true,
+        content
+      });
+    } else {
+      // Check if last node can also be transformed, if yes then append content
+      const lastItem = newNodes[newNodes.length - 1];
+      if (lastItem.canBeTransformed) {
+        newNodes[newNodes.length - 1] = {
+          content: [...lastItem.content, ...content],
+          canBeTransformed: true
+        };
       } else {
-        // If not text block, then cannot be transformed
         newNodes.push({
-          canBeTransformed: false,
-          content: node
+          content,
+          canBeTransformed: true
         });
       }
-    });
-    return newNodes.map(({
-      canBeTransformed,
-      content
-    }) => {
-      if (canBeTransformed) {
-        const text = content.join('\n');
-        if (text === '') {
-          return undefined;
+    }
+  };
+  nodes.forEach(node => {
+    if (node.isTextblock) {
+      const inlineTextContent = node.type === schema.nodes.codeBlock ? node.textContent : getInlineNodeTextContent(Fragment.from(node));
+
+      // For first node, add directly
+      addToNewNodes([inlineTextContent]);
+    } else if (isListNode(node)) {
+      const textContent = [];
+      const listItemType = node.type === schema.nodes.taskList ? schema.nodes.taskItem : schema.nodes.listItem;
+      const listItems = findChildrenByType(node, listItemType).map(item => item.node);
+      listItems.forEach(listItem => {
+        if (listItem.type === schema.nodes.taskItem) {
+          const inlineTextContent = getInlineNodeTextContent(Fragment.from(listItem));
+          textContent.push(inlineTextContent);
+        } else {
+          const inlineTextContent = getInlineNodeTextContent(listItem.content);
+          textContent.push(inlineTextContent);
         }
-        return targetNodeType.createChecked(null, schema.text(text));
-      } else {
-        return content;
+      });
+      addToNewNodes(textContent);
+    } else {
+      // If not text block or list node, then cannot be transformed
+      newNodes.push({
+        canBeTransformed: false,
+        content: node
+      });
+    }
+  });
+  return newNodes.map(({
+    canBeTransformed,
+    content
+  }) => {
+    if (canBeTransformed) {
+      const text = content.join('\n');
+      if (text === '') {
+        return undefined;
       }
-    }).filter(Boolean);
+      return schema.nodes.codeBlock.createChecked(null, schema.text(text));
+    } else {
+      return content;
+    }
+  }).filter(Boolean);
+};
+const transformToBlockNode = (nodes, targetNodeType, schema) => {
+  if (targetNodeType === schema.nodes.codeBlock) {
+    return transformToCodeBlock(nodes, schema);
   }
-  return nodes;
+  const newNodes = [];
+  nodes.forEach(node => {
+    if (isListNode(node)) {
+      const listItemType = node.type === schema.nodes.taskList ? schema.nodes.taskItem : schema.nodes.listItem;
+      const listItems = findChildrenByType(node, listItemType).map(item => item.node);
+      listItems.forEach(listItem => {
+        if (listItem.type === schema.nodes.taskItem) {
+          const inlineContent = [...listItem.content.content];
+          if (inlineContent.length > 0) {
+            newNodes.push(targetNodeType.createChecked(null, inlineContent));
+          }
+        } else {
+          listItem.forEach(child => {
+            if (isHeadingOrParagraphNode(child)) {
+              newNodes.push(targetNodeType.createChecked(null, [...child.content.content]));
+            }
+          });
+        }
+      });
+    } else {
+      newNodes.push(node);
+    }
+  });
+  return newNodes;
 };
 const transformToContainerNode = (nodes, targetNodeType) => {
   const newNodes = [];
@@ -259,6 +302,9 @@ export const transformToListNode = (nodes, targetNodeType, schema) => {
   });
 };
 export const convertUnwrappedLayoutContent = (nodes, targetNodeType, schema) => {
+  if (nodes.length === 1 && nodes[0].content.size === 0) {
+    return nodes;
+  }
   if (isBlockNodeType(targetNodeType)) {
     return transformToBlockNode(nodes, targetNodeType, schema);
   }

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

@@ -50,19 +50,15 @@ export const transformListRecursively = props => {
             inlineContent.push(...convertBlockToInlineContent(grandChild, schema));
           }
         });
-        if (inlineContent.length > 0) {
-          transformedItems.push(taskItem.create(null, inlineContent));
-        }
+        transformedItems.push(taskItem.create(null, inlineContent.length > 0 ? inlineContent : null));
         transformedItems.push(...nestedTaskLists);
       }
     } 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]));
-        }
+        const paragraphNode = paragraph.create(null, inlineContent.length > 0 ? inlineContent : null);
+        transformedItems.push(listItem.create(null, [paragraphNode]));
       } else if (child.type === taskList) {
         const transformedNestedList = transformListRecursively({
           ...props,

package/dist/esm/editor-commands/transforms/inline-node-transforms.js

@@ -5,7 +5,7 @@ export var getInlineNodeTextContent = function getInlineNodeTextContent(sourceCo
   }
   // Headings are not valid inside headings so convert heading nodes to paragraphs
   sourceContent.forEach(function (node) {
-    if (['paragraph', 'heading'].includes(node.type.name)) {
+    if (['paragraph', 'heading', 'taskItem'].includes(node.type.name)) {
       node.content.forEach(function (inlineNode) {
         if (inlineNode.type.name === 'status') {
           validTransformedContent += inlineNode.attrs.text;

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

@@ -73,57 +73,104 @@ export var unwrapLayoutNodesToTextNodes = function unwrapLayoutNodesToTextNodes(
   }
   return [sourceNode];
 };
-var transformToBlockNode = function transformToBlockNode(nodes, targetNodeType, schema) {
-  if (targetNodeType === schema.nodes.codeBlock) {
-    var newNodes = [];
-    nodes.forEach(function (node) {
-      if (node.isTextblock) {
-        var inlineTextContent = node.type === schema.nodes.codeBlock ? node.textContent : getInlineNodeTextContent(Fragment.from(node));
-
-        // For first node, add directly
-        if (newNodes.length === 0) {
-          newNodes.push({
-            canBeTransformed: true,
-            content: [inlineTextContent]
-          });
-        } else {
-          // Check if last node can also be transformed, if yes then append content
-          var lastItem = newNodes[newNodes.length - 1];
-          if (lastItem.canBeTransformed) {
-            newNodes[newNodes.length - 1] = {
-              content: [].concat(_toConsumableArray(lastItem.content), [inlineTextContent]),
-              canBeTransformed: true
-            };
-          } else {
-            newNodes.push({
-              content: [inlineTextContent],
-              canBeTransformed: true
-            });
-          }
-        }
+var transformToCodeBlock = function transformToCodeBlock(nodes, schema) {
+  var newNodes = [];
+  var addToNewNodes = function addToNewNodes(content) {
+    if (newNodes.length === 0) {
+      newNodes.push({
+        canBeTransformed: true,
+        content: content
+      });
+    } else {
+      // Check if last node can also be transformed, if yes then append content
+      var lastItem = newNodes[newNodes.length - 1];
+      if (lastItem.canBeTransformed) {
+        newNodes[newNodes.length - 1] = {
+          content: [].concat(_toConsumableArray(lastItem.content), _toConsumableArray(content)),
+          canBeTransformed: true
+        };
       } else {
-        // If not text block, then cannot be transformed
         newNodes.push({
-          canBeTransformed: false,
-          content: node
+          content: content,
+          canBeTransformed: true
         });
       }
-    });
-    return newNodes.map(function (_ref) {
-      var canBeTransformed = _ref.canBeTransformed,
-        content = _ref.content;
-      if (canBeTransformed) {
-        var text = content.join('\n');
-        if (text === '') {
-          return undefined;
+    }
+  };
+  nodes.forEach(function (node) {
+    if (node.isTextblock) {
+      var inlineTextContent = node.type === schema.nodes.codeBlock ? node.textContent : getInlineNodeTextContent(Fragment.from(node));
+
+      // For first node, add directly
+      addToNewNodes([inlineTextContent]);
+    } else if (isListNode(node)) {
+      var textContent = [];
+      var listItemType = node.type === schema.nodes.taskList ? schema.nodes.taskItem : schema.nodes.listItem;
+      var listItems = findChildrenByType(node, listItemType).map(function (item) {
+        return item.node;
+      });
+      listItems.forEach(function (listItem) {
+        if (listItem.type === schema.nodes.taskItem) {
+          var _inlineTextContent = getInlineNodeTextContent(Fragment.from(listItem));
+          textContent.push(_inlineTextContent);
+        } else {
+          var _inlineTextContent2 = getInlineNodeTextContent(listItem.content);
+          textContent.push(_inlineTextContent2);
         }
-        return targetNodeType.createChecked(null, schema.text(text));
-      } else {
-        return content;
+      });
+      addToNewNodes(textContent);
+    } else {
+      // If not text block or list node, then cannot be transformed
+      newNodes.push({
+        canBeTransformed: false,
+        content: node
+      });
+    }
+  });
+  return newNodes.map(function (_ref) {
+    var canBeTransformed = _ref.canBeTransformed,
+      content = _ref.content;
+    if (canBeTransformed) {
+      var text = content.join('\n');
+      if (text === '') {
+        return undefined;
       }
-    }).filter(Boolean);
+      return schema.nodes.codeBlock.createChecked(null, schema.text(text));
+    } else {
+      return content;
+    }
+  }).filter(Boolean);
+};
+var transformToBlockNode = function transformToBlockNode(nodes, targetNodeType, schema) {
+  if (targetNodeType === schema.nodes.codeBlock) {
+    return transformToCodeBlock(nodes, schema);
   }
-  return nodes;
+  var newNodes = [];
+  nodes.forEach(function (node) {
+    if (isListNode(node)) {
+      var listItemType = node.type === schema.nodes.taskList ? schema.nodes.taskItem : schema.nodes.listItem;
+      var listItems = findChildrenByType(node, listItemType).map(function (item) {
+        return item.node;
+      });
+      listItems.forEach(function (listItem) {
+        if (listItem.type === schema.nodes.taskItem) {
+          var inlineContent = _toConsumableArray(listItem.content.content);
+          if (inlineContent.length > 0) {
+            newNodes.push(targetNodeType.createChecked(null, inlineContent));
+          }
+        } else {
+          listItem.forEach(function (child) {
+            if (isHeadingOrParagraphNode(child)) {
+              newNodes.push(targetNodeType.createChecked(null, _toConsumableArray(child.content.content)));
+            }
+          });
+        }
+      });
+    } else {
+      newNodes.push(node);
+    }
+  });
+  return newNodes;
 };
 var transformToContainerNode = function transformToContainerNode(nodes, targetNodeType) {
   var newNodes = [];
@@ -269,6 +316,9 @@ export var transformToListNode = function transformToListNode(nodes, targetNodeT
   });
 };
 export var convertUnwrappedLayoutContent = function convertUnwrappedLayoutContent(nodes, targetNodeType, schema) {
+  if (nodes.length === 1 && nodes[0].content.size === 0) {
+    return nodes;
+  }
   if (isBlockNodeType(targetNodeType)) {
     return transformToBlockNode(nodes, targetNodeType, schema);
   }

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

@@ -48,19 +48,15 @@ var _transformListRecursively = function transformListRecursively(props) {
             inlineContent.push.apply(inlineContent, _toConsumableArray(convertBlockToInlineContent(grandChild, schema)));
           }
         });
-        if (inlineContent.length > 0) {
-          transformedItems.push(taskItem.create(null, inlineContent));
-        }
+        transformedItems.push(taskItem.create(null, inlineContent.length > 0 ? inlineContent : null));
         transformedItems.push.apply(transformedItems, nestedTaskLists);
       }
     } 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]));
-        }
+        var paragraphNode = paragraph.create(null, _inlineContent.length > 0 ? _inlineContent : null);
+        transformedItems.push(listItem.create(null, [paragraphNode]));
       } else if (child.type === taskList) {
         var transformedNestedList = _transformListRecursively(_objectSpread(_objectSpread({}, props), {}, {
           listNode: child

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-menu",
-	"version": "3.0.1",
+	"version": "3.0.2",
 	"description": "BlockMenu plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -30,7 +30,7 @@
 	"dependencies": {
 		"@atlaskit/css": "^0.14.0",
 		"@atlaskit/dropdown-menu": "^16.3.0",
-		"@atlaskit/editor-plugin-block-controls": "^6.0.0",
+		"@atlaskit/editor-plugin-block-controls": "^6.1.0",
 		"@atlaskit/editor-plugin-decorations": "^5.0.0",
 		"@atlaskit/editor-plugin-selection": "^5.0.0",
 		"@atlaskit/editor-plugin-user-intent": "^3.0.0",
@@ -46,7 +46,7 @@
 		"@babel/runtime": "^7.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^109.2.0",
+		"@atlaskit/editor-common": "^109.3.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},