@atlaskit/editor-plugin-block-menu 3.2.0 → 3.2.2

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

@@ -2,7 +2,7 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { Fragment, Slice } from '@atlaskit/editor-prosemirror/model';
 import { findChildrenByType } from '@atlaskit/editor-prosemirror/utils';
 import { getInlineNodeTextContent } from './inline-node-transforms';
-import { isBlockNodeType, isListNodeType, isContainerNodeType, isBlockNodeForExtraction, convertNodeToInlineContent, getContentSupportChecker, convertCodeBlockContentToParagraphs, filterMarksForTargetNodeType } from './utils';
+import { isBlockNodeType, isListNodeType, isContainerNodeType, isBlockNodeForExtraction, convertNodeToInlineContent, getContentSupportChecker, convertCodeBlockContentToParagraphs, filterMarksForTargetNodeType, getMarksWithBreakout } from './utils';
 var convertInvalidNodeToValidNodeType = function convertInvalidNodeToValidNodeType(sourceContent, sourceNodeType, validNodeType, withMarks) {
   var validTransformedContent = [];
   // Headings are not valid inside headings so convert heading nodes to paragraphs
@@ -28,9 +28,11 @@ export var transformToContainer = function transformToContainer(_ref) {
   var schema = tr.doc.type.schema;
   var content = selection.content().content;
   var transformedContent = content;
+  var marks = [];
   if (sourceNode.type === schema.nodes.codeBlock) {
     var paragraphNodes = convertCodeBlockContentToParagraphs(sourceNode, schema);
     transformedContent = Fragment.fromArray(paragraphNodes);
+    marks = getMarksWithBreakout(sourceNode, targetNodeType);
   }
   if (targetNodeType === schema.nodes.blockquote) {
     transformedContent = convertInvalidNodeToValidNodeType(transformedContent, schema.nodes.heading, schema.nodes.paragraph, true);
@@ -42,7 +44,7 @@ export var transformToContainer = function transformToContainer(_ref) {
   if (sourceNode.type === schema.nodes.paragraph || sourceNode.type === schema.nodes.heading) {
     transformedContent = filterMarksForTargetNodeType(transformedContent, targetNodeType);
   }
-  var newNode = targetNodeType.createAndFill(targetAttrs, transformedContent);
+  var newNode = targetNodeType.createAndFill(targetAttrs, transformedContent, marks);
   if (!newNode) {
     return null;
   }
@@ -168,7 +170,8 @@ export var unwrapAndConvertToBlockType = function unwrapAndConvertToBlockType(co
     var codeBlockContent = sourceChildren.map(function (node) {
       return node.content.textBetween(0, node.content.size, '\n');
     }).join('\n');
-    transformedContent = [codeBlock.createChecked({}, schema.text(codeBlockContent))];
+    var marks = getMarksWithBreakout(sourceNode, targetNodeType);
+    transformedContent = [codeBlock.createChecked({}, schema.text(codeBlockContent), marks)];
   }
   var slice = new Slice(Fragment.fromArray(transformedContent), 0, 0);
   tr.replaceRange(rangeStart, rangeStart + sourceNode.nodeSize, slice);
@@ -265,6 +268,12 @@ export var transformBetweenContainerTypes = function transformBetweenContainerTy
   // Special handling for codeBlock target
   if (targetNodeType.name === 'codeBlock') {
     var _contentSplits = splitContentForCodeBlock(sourceNode, targetNodeType, targetAttrs, tr.doc.type.schema);
+    if (_contentSplits.length === 0) {
+      var schema = tr.doc.type.schema;
+      var marks = getMarksWithBreakout(sourceNode, targetNodeType);
+      var codeBlock = schema.nodes.codeBlock.create(targetAttrs, null, marks);
+      return tr.replaceWith(sourcePos, sourcePos + sourceNode.nodeSize, codeBlock);
+    }
     return applySplitsToTransaction(tr, sourcePos, sourceNode.nodeSize, _contentSplits);
   }
 
@@ -312,7 +321,8 @@ var splitContentForCodeBlock = function splitContentForCodeBlock(sourceNode, tar
   var flushCurrentCodeBlock = function flushCurrentCodeBlock() {
     if (currentTextContent.length > 0) {
       var codeText = currentTextContent.join('\n');
-      var codeBlockNode = targetNodeType.create(targetAttrs, schema.text(codeText));
+      var marks = getMarksWithBreakout(sourceNode, targetNodeType);
+      var codeBlockNode = targetNodeType.create(targetAttrs, schema.text(codeText), marks);
       splits.push(codeBlockNode);
       currentTextContent = [];
     }
@@ -383,7 +393,8 @@ var splitContentAroundUnsupportedBlocks = function splitContentAroundUnsupported
   }
   var flushCurrentContainer = function flushCurrentContainer() {
     if (currentContainerContent.length > 0) {
-      var containerNode = targetNodeType.create(targetAttrs, Fragment.fromArray(currentContainerContent));
+      var marks = getMarksWithBreakout(sourceNode, targetNodeType);
+      var containerNode = targetNodeType.create(targetAttrs, Fragment.fromArray(currentContainerContent), marks);
       splits.push(containerNode);
       currentContainerContent = [];
     }

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

@@ -2,26 +2,37 @@ import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { DEFAULT_TWO_COLUMN_LAYOUT_COLUMN_WIDTH } from '@atlaskit/editor-common/styles';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import { convertUnwrappedLayoutContent, unwrapLayoutNodesToTextNodes } from './layout/utils';
+import { getMarksWithBreakout, isHeadingOrParagraphNode } from './utils';
+export var createDefaultLayoutSection = function createDefaultLayoutSection(schema, content, marks) {
+  var _schema$nodes = schema.nodes,
+    layoutSection = _schema$nodes.layoutSection,
+    layoutColumn = _schema$nodes.layoutColumn,
+    paragraph = _schema$nodes.paragraph;
+  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())]);
+  return layoutSection.createChecked(undefined, layoutContent, marks);
+};
 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, sourcePos + sourceNode.nodeSize, layoutSectionNode);
+  // Layout supports breakout mark that can have width attribute
+  // When other nodes with breakout (codeBlock and expand) are converted to a layout, the layout should get width of original node
+  var marks = getMarksWithBreakout(sourceNode, tr.doc.type.schema.nodes.layoutSection);
+  var layoutSectionNode = createDefaultLayoutSection(tr.doc.type.schema, content, marks);
+  if (isHeadingOrParagraphNode(sourceNode)) {
+    // -1 to fix when sourceNode is the last node in the document, unable to convert to layout
+    tr.replaceRangeWith(sourcePos > 0 ? sourcePos - 1 : sourcePos, sourcePos + sourceNode.nodeSize - 1, layoutSectionNode);
+  } else {
+    tr.replaceRangeWith(sourcePos, sourcePos + sourceNode.nodeSize, layoutSectionNode);
+  }
   return tr;
 };
 export var transformLayoutNode = function transformLayoutNode(context) {
@@ -31,11 +42,11 @@ export var transformLayoutNode = function transformLayoutNode(context) {
     sourcePos = context.sourcePos,
     targetAttrs = context.targetAttrs;
   var schema = tr.doc.type.schema || {};
-  var _ref2 = schema.nodes || {},
-    layoutSection = _ref2.layoutSection,
-    layoutColumn = _ref2.layoutColumn,
-    paragraph = _ref2.paragraph,
-    heading = _ref2.heading;
+  var _ref = schema.nodes || {},
+    layoutSection = _ref.layoutSection,
+    layoutColumn = _ref.layoutColumn,
+    paragraph = _ref.paragraph,
+    heading = _ref.heading;
   var layoutColumnNodes = [];
   var targetTextNodeType = targetNodeType === heading ? heading : paragraph;
   sourceNode.children.forEach(function (child) {

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

@@ -1,3 +1,4 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 export var getTargetNodeInfo = function getTargetNodeInfo(targetType, nodes) {
   switch (targetType) {
@@ -196,4 +197,21 @@ export var convertCodeBlockContentToParagraphs = function convertCodeBlockConten
     paragraphNodes.push(paragraphNode);
   });
   return paragraphNodes;
+};
+var isBreakoutMarkSupported = function isBreakoutMarkSupported(nodeType) {
+  return ['codeBlock', 'expand', 'layoutSection'].includes(nodeType.name);
+};
+export var getMarksWithBreakout = function getMarksWithBreakout(sourceNode, targetNodeType) {
+  var allowedMarks = targetNodeType.allowedMarks(sourceNode.marks);
+  var sourceBreakoutMark = sourceNode.marks.find(function (mark) {
+    return mark.type.name === 'breakout';
+  });
+  if (sourceBreakoutMark && isBreakoutMarkSupported(targetNodeType)) {
+    // Check if breakout mark is already in allowedMarks to avoid duplicates
+    var hasBreakoutMark = allowedMarks.some(function (mark) {
+      return mark.type.name === 'breakout';
+    });
+    return hasBreakoutMark ? allowedMarks : [].concat(_toConsumableArray(allowedMarks), [sourceBreakoutMark]);
+  }
+  return allowedMarks;
 };

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

@@ -1,13 +1,13 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import React from 'react';
 import { MOVE_UP_MENU_ITEM, MOVE_UP_DOWN_MENU_SECTION, MOVE_DOWN_MENU_ITEM, MOVE_BLOCK_SECTION_RANK, PRIMARY_MENU_SECTION, BLOCK_MENU_SECTION_RANK, COPY_MENU_SECTION, COPY_BLOCK_MENU_ITEM, COPY_MENU_SECTION_RANK, COPY_LINK_MENU_ITEM, DELETE_MENU_SECTION, DELETE_MENU_ITEM, DELETE_SECTION_RANK, NESTED_FORMAT_MENU_SECTION, NESTED_FORMAT_MENU } from '@atlaskit/editor-common/block-menu';
-import { ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
-import ChangesIcon from '@atlaskit/icon/core/changes';
-import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
+import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
 import CopyBlockMenuItem from './copy-block';
 import { CopyLinkDropdownItem } from './copy-link';
 import { CopySection } from './copy-section';
 import { DeleteDropdownItem } from './delete-button';
+import { DeleteSection } from './delete-section';
+import { FormatMenuComponent } from './format-menu-nested';
 import { FormatMenuSection } from './format-menu-section';
 import { MoveDownDropdownItem } from './move-down';
 import { MoveUpDropdownItem } from './move-up';
@@ -54,16 +54,7 @@ var getFormatMenuComponents = function getFormatMenuComponents(api) {
           children: null
         },
         children = _ref.children;
-      return /*#__PURE__*/React.createElement(ToolbarNestedDropdownMenu, {
-        text: "Format",
-        elemBefore: /*#__PURE__*/React.createElement(ChangesIcon, {
-          label: ""
-        }),
-        elemAfter: /*#__PURE__*/React.createElement(ChevronRightIcon, {
-          label: 'example nested menu'
-        }),
-        enableMaxHeight: true
-      }, children);
+      return /*#__PURE__*/React.createElement(FormatMenuComponent, null, children);
     }
   }, {
     type: 'block-menu-section',
@@ -148,8 +139,8 @@ export var getBlockMenuComponents = function getBlockMenuComponents(_ref4) {
     rank: BLOCK_MENU_SECTION_RANK[DELETE_MENU_SECTION.key],
     component: function component(_ref7) {
       var children = _ref7.children;
-      return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
-        hasSeparator: true
+      return /*#__PURE__*/React.createElement(DeleteSection, {
+        api: api
       }, children);
     }
   }], _toConsumableArray(getMoveUpMoveDownMenuComponents(api)), [{

package/dist/esm/ui/block-menu-provider.js

@@ -0,0 +1,32 @@
+import React, { useCallback, createContext, useContext } from 'react';
+var BlockMenuContext = /*#__PURE__*/createContext({
+  onDropdownOpenChanged: function onDropdownOpenChanged() {}
+});
+export var useBlockMenu = function useBlockMenu() {
+  var context = useContext(BlockMenuContext);
+  if (!context) {
+    throw new Error('useBlockMenu must be used within BlockMenuProvider');
+  }
+  return context;
+};
+export var BlockMenuProvider = function BlockMenuProvider(_ref) {
+  var children = _ref.children,
+    api = _ref.api;
+  var onDropdownOpenChanged = useCallback(function (isOpen) {
+    if (!isOpen) {
+      // On Dropdown closed, return focus to editor
+      setTimeout(function () {
+        return requestAnimationFrame(function () {
+          api === null || api === void 0 || api.core.actions.focus({
+            scrollIntoView: false
+          });
+        });
+      }, 1);
+    }
+  }, [api]);
+  return /*#__PURE__*/React.createElement(BlockMenuContext.Provider, {
+    value: {
+      onDropdownOpenChanged: onDropdownOpenChanged
+    }
+  }, children);
+};

package/dist/esm/ui/block-menu.js

@@ -1,4 +1,4 @@
-/* block-menu.tsx generated by @compiled/babel-plugin v0.36.1 */
+/* block-menu.tsx generated by @compiled/babel-plugin v0.38.1 */
 import "./block-menu.compiled.css";
 import { ax, ix } from "@compiled/react/runtime";
 import React, { useContext, useEffect } from 'react';
@@ -11,6 +11,8 @@ import { OutsideClickTargetRefContext, withReactEditorViewOuterListeners } from
 import { akEditorFloatingOverlapPanelZIndex } from '@atlaskit/editor-shared-styles';
 import { ToolbarDropdownItem, ToolbarDropdownItemSection, ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
 import { Box } from '@atlaskit/primitives/compiled';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
+import { useBlockMenu } from './block-menu-provider';
 import { BlockMenuRenderer } from './block-menu-renderer';
 var styles = {
   base: "_2rko12b0 _bfhk1bhr _16qs1cd0"
@@ -65,15 +67,22 @@ var BlockMenu = function BlockMenu(_ref2) {
     isSelectedViaDragHandle = _useSharedPluginState.isSelectedViaDragHandle,
     isMenuOpen = _useSharedPluginState.isMenuOpen,
     currentUserIntent = _useSharedPluginState.currentUserIntent;
+  var _useBlockMenu = useBlockMenu(),
+    onDropdownOpenChanged = _useBlockMenu.onDropdownOpenChanged;
   var hasFocus = (_editorView$hasFocus = editorView === null || editorView === void 0 ? void 0 : editorView.hasFocus()) !== null && _editorView$hasFocus !== void 0 ? _editorView$hasFocus : false;
   var hasSelection = !!editorView && !editorView.state.selection.empty;
+  var emptyLineEnabled = expValEqualsNoExposure('platform_editor_block_menu_empty_line', 'isEnabled', true);
+
+  // hasSelection true, always show block menu
+  // hasSelection false, only show block menu when empty line experiment is enabled
+  var shouldShowBlockMenuForEmptyLine = hasSelection || emptyLineEnabled && !hasSelection;
   useEffect(function () {
     var _api$userIntent;
-    if (!isMenuOpen || !menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
+    if (!isMenuOpen || !menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !shouldShowBlockMenuForEmptyLine || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
       return;
     }
     api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.commands.setCurrentUserIntent('blockMenuOpen'));
-  }, [api, isMenuOpen, menuTriggerBy, isSelectedViaDragHandle, hasFocus, hasSelection, currentUserIntent]);
+  }, [api, isMenuOpen, menuTriggerBy, isSelectedViaDragHandle, hasFocus, shouldShowBlockMenuForEmptyLine, currentUserIntent]);
   if (!isMenuOpen) {
     return null;
   }
@@ -86,13 +95,14 @@ var BlockMenu = function BlockMenu(_ref2) {
       })({
         tr: tr
       });
+      onDropdownOpenChanged(false);
       api === null || api === void 0 || (_api$userIntent2 = api.userIntent) === null || _api$userIntent2 === void 0 || _api$userIntent2.commands.setCurrentUserIntent(currentUserIntent === 'blockMenuOpen' ? 'default' : currentUserIntent || 'default')({
         tr: tr
       });
       return tr;
     });
   };
-  if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !hasSelection || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
+  if (!menuTriggerBy || !isSelectedViaDragHandle || !hasFocus || !shouldShowBlockMenuForEmptyLine || ['resizing', 'dragging'].includes(currentUserIntent || '')) {
     closeMenu();
     return null;
   }

package/dist/esm/ui/copy-block.js

@@ -1,3 +1,6 @@
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import React from 'react';
 import { injectIntl, useIntl } from 'react-intl-next';
 import { messages } from '@atlaskit/editor-common/block-menu';
@@ -73,10 +76,15 @@ var CopyBlockMenuItem = function CopyBlockMenuItem(_ref) {
         // When nodeType.inlineContent is true, it will be treated as an inline node in the copyDomNode function,
         // but we want to treat it as a block node when copying, hence setting it to false here
         if (selection.node.type.name === 'codeBlock') {
-          _nodeType.inlineContent = false;
+          var codeBlockNodeType = _objectSpread(_objectSpread({}, _nodeType), {}, {
+            inlineContent: false
+          });
+          var _domNode2 = toDOM(selection.node, schema);
+          copyDomNode(_domNode2, codeBlockNodeType, selection);
+        } else {
+          var _domNode3 = toDOM(selection.node, schema);
+          copyDomNode(_domNode3, _nodeType, selection);
         }
-        var _domNode2 = toDOM(selection.node, schema);
-        copyDomNode(_domNode2, _nodeType, selection);
       }
 
       // close the block menu after copying

package/dist/esm/ui/copy-section.js

@@ -1,12 +1,19 @@
 import React, { useCallback } from 'react';
 import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { checkIsFormatMenuHidden } from './utils/checkIsFormatMenuHidden';
 export var CopySection = function CopySection(_ref) {
+  var _api$selection;
   var api = _ref.api,
     children = _ref.children;
   var isFormatMenuHidden = useCallback(function () {
     return checkIsFormatMenuHidden(api);
   }, [api]);
+  var selection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 || (_api$selection = _api$selection.sharedState) === null || _api$selection === void 0 || (_api$selection = _api$selection.currentState()) === null || _api$selection === void 0 ? void 0 : _api$selection.selection;
+  var isEmptyLineSelected = !!(selection !== null && selection !== void 0 && selection.empty) && expValEqualsNoExposure('platform_editor_block_menu_empty_line', 'isEnabled', true);
+  if (isEmptyLineSelected) {
+    return null;
+  }
   return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
     hasSeparator: !isFormatMenuHidden()
   }, children);

package/dist/esm/ui/delete-section.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
+export var DeleteSection = function DeleteSection(_ref) {
+  var _api$selection;
+  var api = _ref.api,
+    children = _ref.children;
+  var selection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 || (_api$selection = _api$selection.sharedState) === null || _api$selection === void 0 || (_api$selection = _api$selection.currentState()) === null || _api$selection === void 0 ? void 0 : _api$selection.selection;
+  var isEmptyLineSelected = !!(selection !== null && selection !== void 0 && selection.empty) && expValEqualsNoExposure('platform_editor_block_menu_empty_line', 'isEnabled', true);
+  if (isEmptyLineSelected) {
+    return null;
+  }
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
+    hasSeparator: true
+  }, children);
+};

package/dist/esm/ui/format-menu-nested.js

@@ -0,0 +1,21 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { messages } from '@atlaskit/editor-common/block-menu';
+import { ToolbarNestedDropdownMenu } from '@atlaskit/editor-toolbar';
+import ChangesIcon from '@atlaskit/icon/core/changes';
+import ChevronRightIcon from '@atlaskit/icon/core/chevron-right';
+export var FormatMenuComponent = function FormatMenuComponent(_ref) {
+  var children = _ref.children;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  return /*#__PURE__*/React.createElement(ToolbarNestedDropdownMenu, {
+    text: formatMessage(messages.turnInto),
+    elemBefore: /*#__PURE__*/React.createElement(ChangesIcon, {
+      label: ""
+    }),
+    elemAfter: /*#__PURE__*/React.createElement(ChevronRightIcon, {
+      label: ""
+    }),
+    enableMaxHeight: true
+  }, children);
+};

package/dist/esm/ui/utils/checkIsFormatMenuHidden.js

@@ -1,5 +1,6 @@
 import { findParentNodeOfType, findSelectedNodeOfType } from '@atlaskit/editor-prosemirror/utils';
 import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
+import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
 import { isNestedNode } from './isNestedNode';
 var getIsFormatMenuHidden = function getIsFormatMenuHidden(selection, schema, menuTriggerBy) {
   var nodes = schema.nodes;
@@ -26,6 +27,39 @@ var getIsFormatMenuHidden = function getIsFormatMenuHidden(selection, schema, me
   var isNested = isNestedNode(selection, menuTriggerBy);
   return !content || isNested;
 };
+var getIsFormatMenuHiddenEmptyLine = function getIsFormatMenuHiddenEmptyLine(selection, schema, menuTriggerBy) {
+  var nodes = schema.nodes;
+  if (!nodes) {
+    return false;
+  }
+  var isNested = isNestedNode(selection, menuTriggerBy);
+  if (selection.empty || selection.content().size === 0) {
+    // if empty selection, show format menu
+    return false;
+  } else if (isNested) {
+    // if nested,  always hide format menu
+    return true;
+  } else {
+    var content;
+    var allowedNodes = [nodes.paragraph, nodes.heading, nodes.blockquote, nodes.panel, nodes.codeBlock, nodes.bulletList, nodes.orderedList, nodes.taskList];
+    if (expValEquals('platform_editor_block_menu_layout_format', 'isEnabled', true)) {
+      allowedNodes.push(nodes.layoutSection);
+    }
+    if (expValEquals('platform_editor_block_menu_expand_format', 'isEnabled', true)) {
+      allowedNodes.push(nodes.expand);
+    }
+    var selectedNode = findSelectedNodeOfType(allowedNodes)(selection);
+    if (selectedNode) {
+      content = selectedNode.node;
+    } else {
+      var listTypeOrBlockQuoteNode = findParentNodeOfType([nodes.paragraph, nodes.heading, nodes.blockquote, nodes.listItem, nodes.taskItem])(selection);
+      if (listTypeOrBlockQuoteNode) {
+        content = listTypeOrBlockQuoteNode.node;
+      }
+    }
+    return !content;
+  }
+};
 export var checkIsFormatMenuHidden = function checkIsFormatMenuHidden(api) {
   var _api$selection, _api$core$sharedState, _api$blockControls;
   var selection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 || (_api$selection = _api$selection.sharedState) === null || _api$selection === void 0 || (_api$selection = _api$selection.currentState()) === null || _api$selection === void 0 ? void 0 : _api$selection.selection;
@@ -34,5 +68,5 @@ export var checkIsFormatMenuHidden = function checkIsFormatMenuHidden(api) {
   if (!selection || !schema || !menuTriggerBy) {
     return false;
   }
-  return getIsFormatMenuHidden(selection, schema, menuTriggerBy);
+  return expValEqualsNoExposure('platform_editor_block_menu_empty_line', 'isEnabled', true) ? getIsFormatMenuHiddenEmptyLine(selection, schema, menuTriggerBy) : getIsFormatMenuHidden(selection, schema, menuTriggerBy);
 };

package/dist/types/editor-commands/transforms/layout-transforms.d.ts

@@ -1,3 +1,6 @@
 import type { TransformContext } from '@atlaskit/editor-common/transforms';
+import type { Mark, Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import { type Schema } from '@atlaskit/editor-prosemirror/model';
+export declare const createDefaultLayoutSection: (schema: Schema, content: PMNode, marks?: readonly Mark[]) => PMNode;
 export declare const convertToLayout: (context: TransformContext) => import("prosemirror-state").Transaction;
 export declare const transformLayoutNode: (context: TransformContext) => import("prosemirror-state").Transaction;

package/dist/types/editor-commands/transforms/utils.d.ts

@@ -1,4 +1,4 @@
-import type { Node as PMNode, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
+import type { Mark, Node as PMNode, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import type { FormatNodeTargetType } from './types';
 export declare const getTargetNodeInfo: (targetType: FormatNodeTargetType, nodes: Record<string, NodeType>) => {
@@ -37,3 +37,4 @@ export declare const filterMarksForTargetNodeType: (content: Fragment, targetNod
 /** * Convert content from a code block node into multiple paragraph nodes
  */
 export declare const convertCodeBlockContentToParagraphs: (codeBlockNode: PMNode, schema: Schema) => PMNode[];
+export declare const getMarksWithBreakout: (sourceNode: PMNode, targetNodeType: NodeType) => readonly Mark[];

package/dist/types/ui/block-menu-components.d.ts

@@ -1,6 +1,5 @@
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import type { BlockMenuPlugin, BlockMenuPluginOptions } from '../blockMenuPluginType';
-import { type RegisterBlockMenuComponent } from '../blockMenuPluginType';
+import type { BlockMenuPlugin, BlockMenuPluginOptions, RegisterBlockMenuComponent } from '../blockMenuPluginType';
 export declare const getBlockMenuComponents: ({ api, config, }: {
     api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
     config: BlockMenuPluginOptions | undefined;

package/dist/types/ui/block-menu-provider.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockMenuPlugin } from '../blockMenuPluginType';
+type BlockMenuProviderProps = {
+    api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
+    children: React.ReactNode;
+};
+export type BlockMenuContextType = {
+    /**
+     * Callback for when the dropdown is open/closed. Receives an object with `isOpen` state.
+     *
+     * If the dropdown was closed programmatically, the `event` parameter will be `null`.
+     */
+    onDropdownOpenChanged: (isOpen: boolean) => void;
+};
+export declare const useBlockMenu: () => BlockMenuContextType;
+export declare const BlockMenuProvider: ({ children, api }: BlockMenuProviderProps) => React.JSX.Element;
+export {};

package/dist/types/ui/block-menu.d.ts

@@ -3,7 +3,7 @@ import type { WrappedComponentProps } from 'react-intl-next';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { BlockMenuPlugin } from '../blockMenuPluginType';
-type BlockMenuProps = {
+export type BlockMenuProps = {
     api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
     boundariesElement?: HTMLElement;
     editorView: EditorView | undefined;

package/dist/types/ui/copy-section.d.ts

@@ -4,4 +4,4 @@ import type { BlockMenuPlugin } from '../blockMenuPluginType';
 export declare const CopySection: ({ api, children, }: {
     api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
     children: React.ReactNode;
-}) => React.JSX.Element;
+}) => React.JSX.Element | null;

package/dist/types/ui/delete-section.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockMenuPlugin } from '../blockMenuPluginType';
+export declare const DeleteSection: ({ api, children, }: {
+    api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
+    children: React.ReactNode;
+}) => React.JSX.Element | null;

package/dist/types/ui/format-menu-nested.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const FormatMenuComponent: ({ children }: {
+    children: React.ReactNode;
+}) => React.JSX.Element;

package/dist/types-ts4.5/editor-commands/transforms/layout-transforms.d.ts

@@ -1,3 +1,6 @@
 import type { TransformContext } from '@atlaskit/editor-common/transforms';
+import type { Mark, Node as PMNode } from '@atlaskit/editor-prosemirror/model';
+import { type Schema } from '@atlaskit/editor-prosemirror/model';
+export declare const createDefaultLayoutSection: (schema: Schema, content: PMNode, marks?: readonly Mark[]) => PMNode;
 export declare const convertToLayout: (context: TransformContext) => import("prosemirror-state").Transaction;
 export declare const transformLayoutNode: (context: TransformContext) => import("prosemirror-state").Transaction;

package/dist/types-ts4.5/editor-commands/transforms/utils.d.ts

@@ -1,4 +1,4 @@
-import type { Node as PMNode, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
+import type { Mark, Node as PMNode, NodeType, Schema } from '@atlaskit/editor-prosemirror/model';
 import { Fragment } from '@atlaskit/editor-prosemirror/model';
 import type { FormatNodeTargetType } from './types';
 export declare const getTargetNodeInfo: (targetType: FormatNodeTargetType, nodes: Record<string, NodeType>) => {
@@ -37,3 +37,4 @@ export declare const filterMarksForTargetNodeType: (content: Fragment, targetNod
 /** * Convert content from a code block node into multiple paragraph nodes
  */
 export declare const convertCodeBlockContentToParagraphs: (codeBlockNode: PMNode, schema: Schema) => PMNode[];
+export declare const getMarksWithBreakout: (sourceNode: PMNode, targetNodeType: NodeType) => readonly Mark[];

package/dist/types-ts4.5/ui/block-menu-components.d.ts

@@ -1,6 +1,5 @@
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
-import type { BlockMenuPlugin, BlockMenuPluginOptions } from '../blockMenuPluginType';
-import { type RegisterBlockMenuComponent } from '../blockMenuPluginType';
+import type { BlockMenuPlugin, BlockMenuPluginOptions, RegisterBlockMenuComponent } from '../blockMenuPluginType';
 export declare const getBlockMenuComponents: ({ api, config, }: {
     api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
     config: BlockMenuPluginOptions | undefined;

package/dist/types-ts4.5/ui/block-menu-provider.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockMenuPlugin } from '../blockMenuPluginType';
+type BlockMenuProviderProps = {
+    api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
+    children: React.ReactNode;
+};
+export type BlockMenuContextType = {
+    /**
+     * Callback for when the dropdown is open/closed. Receives an object with `isOpen` state.
+     *
+     * If the dropdown was closed programmatically, the `event` parameter will be `null`.
+     */
+    onDropdownOpenChanged: (isOpen: boolean) => void;
+};
+export declare const useBlockMenu: () => BlockMenuContextType;
+export declare const BlockMenuProvider: ({ children, api }: BlockMenuProviderProps) => React.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/block-menu.d.ts

@@ -3,7 +3,7 @@ import type { WrappedComponentProps } from 'react-intl-next';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import { type EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { BlockMenuPlugin } from '../blockMenuPluginType';
-type BlockMenuProps = {
+export type BlockMenuProps = {
     api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
     boundariesElement?: HTMLElement;
     editorView: EditorView | undefined;

package/dist/types-ts4.5/ui/copy-section.d.ts

@@ -4,4 +4,4 @@ import type { BlockMenuPlugin } from '../blockMenuPluginType';
 export declare const CopySection: ({ api, children, }: {
     api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
     children: React.ReactNode;
-}) => React.JSX.Element;
+}) => React.JSX.Element | null;

package/dist/types-ts4.5/ui/delete-section.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockMenuPlugin } from '../blockMenuPluginType';
+export declare const DeleteSection: ({ api, children, }: {
+    api: ExtractInjectionAPI<BlockMenuPlugin> | undefined;
+    children: React.ReactNode;
+}) => React.JSX.Element | null;

package/dist/types-ts4.5/ui/format-menu-nested.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const FormatMenuComponent: ({ children }: {
+    children: React.ReactNode;
+}) => React.JSX.Element;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-menu",
-	"version": "3.2.0",
+	"version": "3.2.2",
 	"description": "BlockMenu plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -41,13 +41,13 @@
 		"@atlaskit/icon": "^28.2.0",
 		"@atlaskit/icon-lab": "^5.7.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^14.14.0",
-		"@atlaskit/tmp-editor-statsig": "^12.25.0",
+		"@atlaskit/primitives": "^14.15.0",
+		"@atlaskit/tmp-editor-statsig": "^12.26.0",
 		"@atlaskit/tokens": "^6.3.0",
 		"@babel/runtime": "^7.0.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^109.10.0",
+		"@atlaskit/editor-common": "^109.11.0",
 		"react": "^18.2.0",
 		"react-intl-next": "npm:react-intl@^5.18.1"
 	},