@atlaskit/editor-plugin-block-menu 0.0.12 → 0.0.14

package/CHANGELOG.md

@@ -1,5 +1,20 @@
 # @atlaskit/editor-plugin-block-menu
 
+## 0.0.14
+
+### Patch Changes
+
+- Updated dependencies
+
+## 0.0.13
+
+### Patch Changes
+
+- [`6dd96d8ae168d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/6dd96d8ae168d) -
+  [ux] ED-28581 ED-28581: Updated renderer logic to better support nest menu items register from
+  outside block menu
+- Updated dependencies
+
 ## 0.0.12
 
 ### Patch Changes

package/afm-cc/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-cc/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-cc/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-cc/tsconfig.json"
 		},
@@ -60,4 +63,4 @@
 			"path": "../../editor-common/afm-cc/tsconfig.json"
 		}
 	]
-}
+}

package/afm-dev-agents/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-dev-agents/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-dev-agents/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-dev-agents/tsconfig.json"
 		},

package/afm-jira/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-jira/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-jira/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-jira/tsconfig.json"
 		},

package/afm-passionfruit/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-passionfruit/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-passionfruit/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-passionfruit/tsconfig.json"
 		},

package/afm-post-office/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-post-office/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-post-office/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-post-office/tsconfig.json"
 		},

package/afm-rovo-extension/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-rovo-extension/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-rovo-extension/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-rovo-extension/tsconfig.json"
 		},

package/afm-townsquare/tsconfig.json

@@ -50,6 +50,9 @@
 		{
 			"path": "../../../design-system/icon-lab/afm-townsquare/tsconfig.json"
 		},
+		{
+			"path": "../../../platform/feature-flags/afm-townsquare/tsconfig.json"
+		},
 		{
 			"path": "../../../design-system/primitives/afm-townsquare/tsconfig.json"
 		},

package/dist/cjs/blockMenuPlugin.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.blockMenuPlugin = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _editorActions = require("./editor-actions");
+var _formatNode2 = require("./editor-commands/formatNode");
 var _main = require("./pm-plugins/main");
 var _blockMenu = _interopRequireDefault(require("./ui/block-menu"));
 var _blockMenuComponents = require("./ui/block-menu-components");
@@ -34,6 +35,11 @@ var blockMenuPlugin = exports.blockMenuPlugin = function blockMenuPlugin(_ref) {
         return registry.components;
       }
     },
+    commands: {
+      formatNode: function formatNode(currentNode, targetType) {
+        return (0, _formatNode2.formatNode)(currentNode, targetType);
+      }
+    },
     contentComponent: function contentComponent(_ref2) {
       var editorView = _ref2.editorView,
         popupsMountPoint = _ref2.popupsMountPoint,

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

@@ -0,0 +1,23 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.formatNode = void 0;
+var _transformNodeToTargetType = require("./transforms/transformNodeToTargetType");
+/**
+ * Formats the current node or selection to the specified target type
+ * @param currentNode - The current node
+ * @param targetType - The target node type to convert to
+ */
+var formatNode = exports.formatNode = function formatNode(currentNode, targetType) {
+  return function (_ref) {
+    var tr = _ref.tr;
+    var selection = tr.selection;
+    try {
+      return (0, _transformNodeToTargetType.transformNodeToTargetType)(tr, currentNode, selection.from, targetType);
+    } catch (e) {
+      return null;
+    }
+  };
+};

package/dist/cjs/editor-commands/transforms/block-transforms.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.transformBlockNode = void 0;
+var _containerTransforms = require("./container-transforms");
+var _listTransforms = require("./list-transforms");
+var _utils = require("./utils");
+/**
+ * Transform block nodes (paragraph, heading, codeblock)
+ */
+var transformBlockNode = exports.transformBlockNode = function transformBlockNode(context) {
+  var tr = context.tr,
+    targetNodeType = context.targetNodeType,
+    targetAttrs = context.targetAttrs;
+  var selection = tr.selection;
+  var $from = selection.$from,
+    $to = selection.$to;
+
+  // Handle transformation to list types
+  if ((0, _utils.isListNodeType)(targetNodeType)) {
+    return (0, _listTransforms.transformToList)();
+  }
+
+  // Handle transformation to container types (panel, expand, blockquote)
+  if ((0, _utils.isContainerNodeType)(targetNodeType)) {
+    return (0, _containerTransforms.transformToContainer)();
+  }
+
+  // Handle block type transformation (paragraph, heading, codeblock)
+  if ((0, _utils.isBlockNodeType)(targetNodeType)) {
+    tr.setBlockType($from.pos, $to.pos, targetNodeType, targetAttrs);
+    return tr;
+  }
+  return null;
+};

package/dist/cjs/editor-commands/transforms/container-transforms.js

@@ -0,0 +1,59 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.unwrapAndConvertToList = exports.unwrapAndConvertToBlockType = exports.transformToContainer = exports.transformContainerNode = void 0;
+var _utils = require("./utils");
+/**
+ * Transform selection to container type
+ */
+var transformToContainer = exports.transformToContainer = function transformToContainer() {
+  return null;
+};
+
+/**
+ * Transform container nodes (panel, expand, blockquote)
+ */
+var transformContainerNode = exports.transformContainerNode = function transformContainerNode(_ref) {
+  var tr = _ref.tr,
+    sourcePos = _ref.sourcePos,
+    targetNodeType = _ref.targetNodeType,
+    targetAttrs = _ref.targetAttrs;
+  if (sourcePos === null) {
+    return null;
+  }
+
+  // Transform container to block type - unwrap and convert content
+  if ((0, _utils.isBlockNodeType)(targetNodeType)) {
+    return unwrapAndConvertToBlockType();
+  }
+
+  // Transform container to list type
+  if ((0, _utils.isListNodeType)(targetNodeType)) {
+    return unwrapAndConvertToList();
+  }
+
+  // Transform between container types
+  if ((0, _utils.isContainerNodeType)(targetNodeType)) {
+    tr.setNodeMarkup(sourcePos, targetNodeType, targetAttrs);
+    return tr;
+  }
+  return null;
+};
+
+/**
+ * Unwrap container node and convert content to block type
+ */
+var unwrapAndConvertToBlockType = exports.unwrapAndConvertToBlockType = function unwrapAndConvertToBlockType() {
+  // Convert to block type directly
+  return null;
+};
+
+/**
+ * Unwrap container node and convert content to list
+ */
+var unwrapAndConvertToList = exports.unwrapAndConvertToList = function unwrapAndConvertToList() {
+  // Convert to list directly
+  return null;
+};

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

@@ -0,0 +1,53 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.transformToList = exports.transformListNode = exports.transformBetweenListTypes = exports.liftListToBlockType = void 0;
+var _utils = require("./utils");
+/**
+ * Transform selection to list type
+ */
+var transformToList = exports.transformToList = function transformToList() {
+  return null;
+};
+
+/**
+ * Transform list nodes
+ */
+var transformListNode = exports.transformListNode = function transformListNode(_ref) {
+  var targetNodeType = _ref.targetNodeType;
+  // Transform list to block type
+  if ((0, _utils.isBlockNodeType)(targetNodeType)) {
+    // Lift list items out of the list and convert to target block type
+    return null;
+  }
+
+  // Transform list to container type
+  if ((0, _utils.isContainerNodeType)(targetNodeType)) {
+    // Lift list items out of the list and convert to container type
+    return null;
+  }
+
+  // Transform between list types
+  if ((0, _utils.isListNodeType)(targetNodeType)) {
+    // Lift list items out of the list and convert to the other list type
+    return null;
+  }
+  return null;
+};
+
+/**
+ * Lift list content and convert to block type
+ */
+var liftListToBlockType = exports.liftListToBlockType = function liftListToBlockType() {
+  // Convert to target block type directly
+  return null;
+};
+
+/**
+ * Transform between different list types
+ */
+var transformBetweenListTypes = exports.transformBetweenListTypes = function transformBetweenListTypes() {
+  return null;
+};

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

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.transformNodeToTargetType = transformNodeToTargetType;
+var _blockTransforms = require("./block-transforms");
+var _containerTransforms = require("./container-transforms");
+var _listTransforms = require("./list-transforms");
+var _utils = require("./utils");
+function transformNodeToTargetType(tr, sourceNode, sourcePos, targetType) {
+  var nodes = tr.doc.type.schema.nodes;
+  var targetNodeInfo = (0, _utils.getTargetNodeInfo)(targetType, nodes);
+  if (!targetNodeInfo) {
+    return null;
+  }
+  var targetNodeType = targetNodeInfo.nodeType,
+    targetAttrs = targetNodeInfo.attrs;
+
+  // Early return if trying to transform to the same type
+  if (sourceNode.type === targetNodeType) {
+    return tr; // No transformation needed
+  }
+
+  // Prepare transformation context
+  var transformationContext = {
+    tr: tr,
+    sourceNode: sourceNode,
+    sourcePos: sourcePos,
+    targetNodeType: targetNodeType,
+    targetAttrs: targetAttrs
+  };
+
+  // Route to appropriate transformation strategy based on source node type
+  try {
+    if ((0, _utils.isBlockNode)(sourceNode)) {
+      return (0, _blockTransforms.transformBlockNode)(transformationContext);
+    }
+    if ((0, _utils.isListNode)(sourceNode)) {
+      return (0, _listTransforms.transformListNode)(transformationContext);
+    }
+    if ((0, _utils.isContainerNode)(sourceNode)) {
+      return (0, _containerTransforms.transformContainerNode)(transformationContext);
+    }
+    return null;
+  } catch (e) {
+    // Node transformation failed
+    return null;
+  }
+}

package/dist/cjs/editor-commands/transforms/types.js

@@ -0,0 +1,5 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});

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

@@ -0,0 +1,109 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.isListNodeType = exports.isListNode = exports.isContainerNodeType = exports.isContainerNode = exports.isBlockNodeType = exports.isBlockNode = exports.getTargetNodeInfo = void 0;
+var getTargetNodeInfo = exports.getTargetNodeInfo = function getTargetNodeInfo(targetType, nodes) {
+  switch (targetType) {
+    case 'heading1':
+      return {
+        nodeType: nodes.heading,
+        attrs: {
+          level: 1
+        }
+      };
+    case 'heading2':
+      return {
+        nodeType: nodes.heading,
+        attrs: {
+          level: 2
+        }
+      };
+    case 'heading3':
+      return {
+        nodeType: nodes.heading,
+        attrs: {
+          level: 3
+        }
+      };
+    case 'heading4':
+      return {
+        nodeType: nodes.heading,
+        attrs: {
+          level: 4
+        }
+      };
+    case 'heading5':
+      return {
+        nodeType: nodes.heading,
+        attrs: {
+          level: 5
+        }
+      };
+    case 'heading6':
+      return {
+        nodeType: nodes.heading,
+        attrs: {
+          level: 6
+        }
+      };
+    case 'paragraph':
+      return {
+        nodeType: nodes.paragraph
+      };
+    case 'blockquote':
+      return {
+        nodeType: nodes.blockquote
+      };
+    case 'expand':
+      return {
+        nodeType: nodes.expand
+      };
+    case 'panel':
+      return {
+        nodeType: nodes.panel,
+        attrs: {
+          panelType: 'info'
+        }
+      };
+    case 'codeblock':
+      return {
+        nodeType: nodes.codeBlock
+      };
+    case 'bulletList':
+      return {
+        nodeType: nodes.bulletList
+      };
+    case 'orderedList':
+      return {
+        nodeType: nodes.orderedList
+      };
+    case 'taskList':
+      return {
+        nodeType: nodes.taskList
+      };
+    default:
+      return null;
+  }
+};
+
+// Helper functions to categorize node types
+var isBlockNode = exports.isBlockNode = function isBlockNode(node) {
+  return ['paragraph', 'heading', 'codeBlock'].includes(node.type.name);
+};
+var isListNode = exports.isListNode = function isListNode(node) {
+  return ['bulletList', 'orderedList', 'taskList', 'listItem'].includes(node.type.name);
+};
+var isContainerNode = exports.isContainerNode = function isContainerNode(node) {
+  return ['panel', 'expand', 'blockquote'].includes(node.type.name);
+};
+var isBlockNodeType = exports.isBlockNodeType = function isBlockNodeType(nodeType) {
+  return ['paragraph', 'heading', 'codeBlock'].includes(nodeType.name);
+};
+var isListNodeType = exports.isListNodeType = function isListNodeType(nodeType) {
+  return ['bulletList', 'orderedList', 'taskList'].includes(nodeType.name);
+};
+var isContainerNodeType = exports.isContainerNodeType = function isContainerNodeType(nodeType) {
+  return ['panel', 'expand', 'blockquote'].includes(nodeType.name);
+};

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

@@ -10,8 +10,7 @@ var _react = _interopRequireDefault(require("react"));
 var _editorToolbar = require("@atlaskit/editor-toolbar");
 var _changes = _interopRequireDefault(require("@atlaskit/icon/core/changes"));
 var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/core/chevron-right"));
-var _listBulleted = _interopRequireDefault(require("@atlaskit/icon/core/list-bulleted"));
-var _task = _interopRequireDefault(require("@atlaskit/icon/core/task"));
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _copyBlock = _interopRequireDefault(require("./copy-block"));
 var _copyLink = require("./copy-link");
 var _deleteButton = require("./delete-button");
@@ -46,23 +45,64 @@ var getMoveUpMoveDownMenuComponents = function getMoveUpMoveDownMenuComponents(a
     }
   }];
 };
-var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(_ref) {
-  var api = _ref.api,
-    config = _ref.config;
+var getFormatMenuComponents = function getFormatMenuComponents() {
   return [{
+    type: 'block-menu-nested',
+    key: 'nested-menu-format',
+    parent: {
+      type: 'block-menu-section',
+      key: 'block-menu-section-primary',
+      rank: 100
+    },
+    component: function component() {
+      var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+          children: null
+        },
+        children = _ref.children;
+      return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarNestedDropdownMenu, {
+        text: "Format",
+        elemBefore: /*#__PURE__*/_react.default.createElement(_changes.default, {
+          label: ""
+        }),
+        elemAfter: /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
+          label: 'example nested menu'
+        })
+      }, children);
+    }
+  }, {
     type: 'block-menu-section',
-    key: 'block-menu-section-format',
+    key: 'nested-menu-format-section-primary',
+    parent: {
+      type: 'block-menu-nested',
+      key: 'nested-menu-format',
+      rank: 100
+    },
+    component: function component() {
+      var _ref2 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
+          children: null
+        },
+        children = _ref2.children;
+      return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, null, children);
+    }
+  }];
+};
+var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(_ref3) {
+  var api = _ref3.api,
+    config = _ref3.config;
+  return [].concat((0, _toConsumableArray2.default)((0, _platformFeatureFlags.fg)('platform_editor_block_menu_format') ? getFormatMenuComponents() : []), [{
+    type: 'block-menu-section',
+    key: 'block-menu-section-primary',
     rank: 100,
-    component: function component(_ref2) {
-      var children = _ref2.children;
+    component: function component(_ref4) {
+      var children = _ref4.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, null, children);
     }
   }, {
     type: 'block-menu-section',
     key: 'block-menu-section-copy',
     rank: 200,
-    component: function component(_ref3) {
-      var children = _ref3.children;
+    component: function component(_ref5) {
+      var children = _ref5.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         hasSeparator: true
       }, children);
@@ -98,8 +138,8 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
     type: 'block-menu-section',
     key: 'block-menu-section-move-up-down',
     rank: 300,
-    component: function component(_ref4) {
-      var children = _ref4.children;
+    component: function component(_ref6) {
+      var children = _ref6.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         hasSeparator: true
       }, children);
@@ -108,40 +148,13 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
     type: 'block-menu-section',
     key: 'block-menu-section-delete',
     rank: 400,
-    component: function component(_ref5) {
-      var children = _ref5.children;
+    component: function component(_ref7) {
+      var children = _ref7.children;
       return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
         hasSeparator: true
       }, children);
     }
-  }, {
-    type: 'block-menu-nested',
-    key: 'nested-menu',
-    parent: {
-      type: 'block-menu-section',
-      key: 'block-menu-section-format',
-      rank: 100
-    },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarNestedDropdownMenu, {
-        text: "Format",
-        elemBefore: /*#__PURE__*/_react.default.createElement(_changes.default, {
-          label: ""
-        }),
-        elemAfter: /*#__PURE__*/_react.default.createElement(_chevronRight.default, {
-          label: 'example nested menu'
-        })
-      }, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, null, /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
-        elemBefore: /*#__PURE__*/_react.default.createElement(_task.default, {
-          label: ""
-        })
-      }, "Action item"), /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
-        elemBefore: /*#__PURE__*/_react.default.createElement(_listBulleted.default, {
-          label: ""
-        })
-      }, "Bullet list")));
-    }
-  }].concat((0, _toConsumableArray2.default)(getMoveUpMoveDownMenuComponents(api)), [{
+  }], (0, _toConsumableArray2.default)(getMoveUpMoveDownMenuComponents(api)), [{
     type: 'block-menu-item',
     key: 'block-menu-item-delete',
     parent: {