@atlaskit/editor-plugin-block-type 6.2.18 → 6.2.19

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # @atlaskit/editor-plugin-block-type
 
+## 6.2.19
+
+### Patch Changes
+
+- [`652bf219a308e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/652bf219a308e) -
+  [ux] ED-28581: Added isSelected state for block type and lists"
+- [`652bf219a308e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/652bf219a308e) -
+  [ux] ED-28581: isSelected for block type and list
+- Updated dependencies
+
 ## 6.2.18
 
 ### Patch Changes

package/dist/cjs/blockTypePlugin.js

@@ -140,7 +140,7 @@ var blockTypePlugin = exports.blockTypePlugin = function blockTypePlugin(_ref3)
   }
   if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)) {
     var _api$blockMenu;
-    api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents((0, _ui.getBlockTypeComponents)());
+    api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents((0, _ui.getBlockTypeComponents)(api));
   }
   return {
     name: 'blockType',

package/dist/cjs/ui/HeadingBlockMenuItem.js

@@ -0,0 +1,63 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createHeadingBlockMenuItem = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _messages = require("@atlaskit/editor-common/messages");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
+var _state = require("@atlaskit/editor-prosemirror/state");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _textHeadingFive = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-five"));
+var _textHeadingFour = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-four"));
+var _textHeadingOne = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-one"));
+var _textHeadingSix = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-six"));
+var _textHeadingThree = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-three"));
+var _textHeadingTwo = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-two"));
+var _consts = require("./consts");
+var headingIcons = [_textHeadingOne.default, _textHeadingTwo.default, _textHeadingThree.default, _textHeadingFour.default, _textHeadingFive.default, _textHeadingSix.default];
+var headingMessages = [_messages.blockTypeMessages.heading1, _messages.blockTypeMessages.heading2, _messages.blockTypeMessages.heading3, _messages.blockTypeMessages.heading4, _messages.blockTypeMessages.heading5, _messages.blockTypeMessages.heading6];
+var HeadingBlockTypes = [_consts.HEADING_1, _consts.HEADING_2, _consts.HEADING_3, _consts.HEADING_4, _consts.HEADING_5, _consts.HEADING_6];
+var HeadingBlockMenuItem = function HeadingBlockMenuItem(_ref) {
+  var level = _ref.level,
+    api = _ref.api;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var Icon = headingIcons[level - 1];
+  var message = headingMessages[level - 1];
+  var currentBlockType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.currentBlockType');
+  var selection = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'selection.selection');
+  var isTextSelection = selection instanceof _state.TextSelection;
+  var isHeading = isTextSelection && currentBlockType && HeadingBlockTypes.includes(currentBlockType);
+  var currentHeadingLevel = isHeading ? currentBlockType.level : undefined;
+  var isSelected = isHeading && currentHeadingLevel === level;
+  var handleClick = function handleClick() {
+    if (!selection) {
+      return;
+    }
+    if (!isSelected) {
+      var _api$blockMenu;
+      api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("heading".concat(level)));
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isSelected,
+    elemBefore: /*#__PURE__*/_react.default.createElement(Icon, {
+      label: ""
+    })
+  }, formatMessage(message));
+};
+var createHeadingBlockMenuItem = exports.createHeadingBlockMenuItem = function createHeadingBlockMenuItem(_ref2) {
+  var level = _ref2.level,
+    api = _ref2.api;
+  return function () {
+    return /*#__PURE__*/_react.default.createElement(HeadingBlockMenuItem, {
+      level: level,
+      api: api
+    });
+  };
+};

package/dist/cjs/ui/ParagraphBlockMenuItem.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createParagraphBlockMenuItem = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _messages = require("@atlaskit/editor-common/messages");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
+var _state = require("@atlaskit/editor-prosemirror/state");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _textParagraph = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-paragraph"));
+var _consts = require("./consts");
+var ParagraphBlockMenuItem = function ParagraphBlockMenuItem(_ref) {
+  var api = _ref.api;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var currentBlockType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.currentBlockType');
+  var bulletListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.bulletListActive');
+  var orderedListActive = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'list.orderedListActive');
+  var selection = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'selection.selection');
+  var isTextSelection = selection instanceof _state.TextSelection;
+  var isParagraph = isTextSelection && currentBlockType && currentBlockType === _consts.NORMAL_TEXT && !bulletListActive && !orderedListActive;
+  var handleClick = function handleClick() {
+    if (!selection) {
+      return;
+    }
+    if (!isParagraph) {
+      var _api$blockMenu;
+      api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("paragraph"));
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isParagraph,
+    elemBefore: /*#__PURE__*/_react.default.createElement(_textParagraph.default, {
+      label: ""
+    })
+  }, formatMessage(_messages.blockMenuMessages.paragraph));
+};
+var createParagraphBlockMenuItem = exports.createParagraphBlockMenuItem = function createParagraphBlockMenuItem(_ref2) {
+  var api = _ref2.api;
+  return function () {
+    return /*#__PURE__*/_react.default.createElement(ParagraphBlockMenuItem, {
+      api: api
+    });
+  };
+};

package/dist/cjs/ui/QuoteBlockMenuItem.js

@@ -0,0 +1,42 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createQuoteBlockMenuItem = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _messages = require("@atlaskit/editor-common/messages");
+var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
+var _editorToolbar = require("@atlaskit/editor-toolbar");
+var _quotationMark = _interopRequireDefault(require("@atlaskit/icon/core/quotation-mark"));
+var _consts = require("./consts");
+var QuoteBlockMenuItem = function QuoteBlockMenuItem(_ref) {
+  var api = _ref.api;
+  var _useIntl = (0, _reactIntlNext.useIntl)(),
+    formatMessage = _useIntl.formatMessage;
+  var currentBlockType = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'blockType.currentBlockType');
+  var isBlockQuote = currentBlockType && currentBlockType === _consts.BLOCK_QUOTE;
+  var handleClick = function handleClick() {
+    if (!isBlockQuote) {
+      var _api$blockMenu;
+      api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("blockquote"));
+    }
+  };
+  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isBlockQuote,
+    elemBefore: /*#__PURE__*/_react.default.createElement(_quotationMark.default, {
+      label: ""
+    })
+  }, formatMessage(_messages.blockTypeMessages.blockquote));
+};
+var createQuoteBlockMenuItem = exports.createQuoteBlockMenuItem = function createQuoteBlockMenuItem(_ref2) {
+  var api = _ref2.api;
+  return function () {
+    return /*#__PURE__*/_react.default.createElement(QuoteBlockMenuItem, {
+      api: api
+    });
+  };
+};

package/dist/cjs/ui/index.js

@@ -1,16 +1,14 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getBlockTypeComponents = void 0;
-var _react = _interopRequireDefault(require("react"));
 var _blockMenu = require("@atlaskit/editor-common/block-menu");
-var _HeadingMenuItem = require("./HeadingMenuItem");
-var _ParagraphMenuItem = require("./ParagraphMenuItem");
-var _QuoteMenuItem = require("./QuoteMenuItem");
-var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockTypeComponents() {
+var _HeadingBlockMenuItem = require("./HeadingBlockMenuItem");
+var _ParagraphBlockMenuItem = require("./ParagraphBlockMenuItem");
+var _QuoteBlockMenuItem = require("./QuoteBlockMenuItem");
+var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockTypeComponents(api) {
   return [{
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_HEADING_1_MENU_ITEM.key,
@@ -19,11 +17,10 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_1_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
-        level: 1
-      });
-    }
+    component: (0, _HeadingBlockMenuItem.createHeadingBlockMenuItem)({
+      level: 1,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_HEADING_2_MENU_ITEM.key,
@@ -32,11 +29,10 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_2_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
-        level: 2
-      });
-    }
+    component: (0, _HeadingBlockMenuItem.createHeadingBlockMenuItem)({
+      level: 2,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_HEADING_3_MENU_ITEM.key,
@@ -45,11 +41,10 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_3_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
-        level: 3
-      });
-    }
+    component: (0, _HeadingBlockMenuItem.createHeadingBlockMenuItem)({
+      level: 3,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_HEADING_4_MENU_ITEM.key,
@@ -58,11 +53,10 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_4_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
-        level: 4
-      });
-    }
+    component: (0, _HeadingBlockMenuItem.createHeadingBlockMenuItem)({
+      level: 4,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_HEADING_5_MENU_ITEM.key,
@@ -71,11 +65,10 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_5_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
-        level: 5
-      });
-    }
+    component: (0, _HeadingBlockMenuItem.createHeadingBlockMenuItem)({
+      level: 5,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_HEADING_6_MENU_ITEM.key,
@@ -84,11 +77,10 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_6_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
-        level: 6
-      });
-    }
+    component: (0, _HeadingBlockMenuItem.createHeadingBlockMenuItem)({
+      level: 6,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_PARAGRAPH_MENU_ITEM.key,
@@ -97,9 +89,9 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_PARAGRAPH_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_ParagraphMenuItem.ParagraphMenuItem, null);
-    }
+    component: (0, _ParagraphBlockMenuItem.createParagraphBlockMenuItem)({
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: _blockMenu.FORMAT_QUOTE_MENU_ITEM.key,
@@ -108,8 +100,8 @@ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockT
       key: 'nested-menu-format-section-primary',
       rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_QUOTE_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/_react.default.createElement(_QuoteMenuItem.QuoteMenuItem, null);
-    }
+    component: (0, _QuoteBlockMenuItem.createQuoteBlockMenuItem)({
+      api: api
+    })
   }];
 };

package/dist/es2019/blockTypePlugin.js

@@ -129,7 +129,7 @@ const blockTypePlugin = ({
   }
   if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
     var _api$blockMenu;
-    api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents(getBlockTypeComponents());
+    api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents(getBlockTypeComponents(api));
   }
   return {
     name: 'blockType',

package/dist/es2019/ui/HeadingBlockMenuItem.js

@@ -0,0 +1,57 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { blockTypeMessages } from '@atlaskit/editor-common/messages';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
+import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
+import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
+import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
+import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
+import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
+import { HEADING_2, HEADING_5, HEADING_1, HEADING_3, HEADING_4, HEADING_6 } from './consts';
+const headingIcons = [TextHeadingOneIcon, TextHeadingTwoIcon, TextHeadingThreeIcon, TextHeadingFourIcon, TextHeadingFiveIcon, TextHeadingSixIcon];
+const headingMessages = [blockTypeMessages.heading1, blockTypeMessages.heading2, blockTypeMessages.heading3, blockTypeMessages.heading4, blockTypeMessages.heading5, blockTypeMessages.heading6];
+const HeadingBlockTypes = [HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
+const HeadingBlockMenuItem = ({
+  level,
+  api
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const Icon = headingIcons[level - 1];
+  const message = headingMessages[level - 1];
+  const currentBlockType = useSharedPluginStateSelector(api, 'blockType.currentBlockType');
+  const selection = useSharedPluginStateSelector(api, 'selection.selection');
+  const isTextSelection = selection instanceof TextSelection;
+  const isHeading = isTextSelection && currentBlockType && HeadingBlockTypes.includes(currentBlockType);
+  const currentHeadingLevel = isHeading ? currentBlockType.level : undefined;
+  const isSelected = isHeading && currentHeadingLevel === level;
+  const handleClick = () => {
+    if (!selection) {
+      return;
+    }
+    if (!isSelected) {
+      var _api$blockMenu;
+      api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode(`heading${level}`));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isSelected,
+    elemBefore: /*#__PURE__*/React.createElement(Icon, {
+      label: ""
+    })
+  }, formatMessage(message));
+};
+export const createHeadingBlockMenuItem = ({
+  level,
+  api
+}) => {
+  return () => /*#__PURE__*/React.createElement(HeadingBlockMenuItem, {
+    level: level,
+    api: api
+  });
+};

package/dist/es2019/ui/ParagraphBlockMenuItem.js

@@ -0,0 +1,44 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { blockMenuMessages } from '@atlaskit/editor-common/messages';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import TextParagraphIcon from '@atlaskit/icon-lab/core/text-paragraph';
+import { NORMAL_TEXT } from './consts';
+const ParagraphBlockMenuItem = ({
+  api
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const currentBlockType = useSharedPluginStateSelector(api, 'blockType.currentBlockType');
+  const bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
+  const orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
+  const selection = useSharedPluginStateSelector(api, 'selection.selection');
+  const isTextSelection = selection instanceof TextSelection;
+  const isParagraph = isTextSelection && currentBlockType && currentBlockType === NORMAL_TEXT && !bulletListActive && !orderedListActive;
+  const handleClick = () => {
+    if (!selection) {
+      return;
+    }
+    if (!isParagraph) {
+      var _api$blockMenu;
+      api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode(`paragraph`));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isParagraph,
+    elemBefore: /*#__PURE__*/React.createElement(TextParagraphIcon, {
+      label: ""
+    })
+  }, formatMessage(blockMenuMessages.paragraph));
+};
+export const createParagraphBlockMenuItem = ({
+  api
+}) => {
+  return () => /*#__PURE__*/React.createElement(ParagraphBlockMenuItem, {
+    api: api
+  });
+};

package/dist/es2019/ui/QuoteBlockMenuItem.js

@@ -0,0 +1,36 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { blockTypeMessages } from '@atlaskit/editor-common/messages';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
+import { BLOCK_QUOTE } from './consts';
+const QuoteBlockMenuItem = ({
+  api
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const currentBlockType = useSharedPluginStateSelector(api, 'blockType.currentBlockType');
+  const isBlockQuote = currentBlockType && currentBlockType === BLOCK_QUOTE;
+  const handleClick = () => {
+    if (!isBlockQuote) {
+      var _api$blockMenu;
+      api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode(`blockquote`));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isBlockQuote,
+    elemBefore: /*#__PURE__*/React.createElement(QuotationMarkIcon, {
+      label: ""
+    })
+  }, formatMessage(blockTypeMessages.blockquote));
+};
+export const createQuoteBlockMenuItem = ({
+  api
+}) => {
+  return () => /*#__PURE__*/React.createElement(QuoteBlockMenuItem, {
+    api: api
+  });
+};

package/dist/es2019/ui/index.js

@@ -1,9 +1,8 @@
-import React from 'react';
 import { FORMAT_HEADING_1_MENU_ITEM, FORMAT_HEADING_2_MENU_ITEM, FORMAT_HEADING_3_MENU_ITEM, FORMAT_HEADING_4_MENU_ITEM, FORMAT_HEADING_5_MENU_ITEM, FORMAT_HEADING_6_MENU_ITEM, FORMAT_NESTED_MENU_RANK, FORMAT_PARAGRAPH_MENU_ITEM, FORMAT_QUOTE_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
-import { HeadingMenuItem } from './HeadingMenuItem';
-import { ParagraphMenuItem } from './ParagraphMenuItem';
-import { QuoteMenuItem } from './QuoteMenuItem';
-export const getBlockTypeComponents = () => {
+import { createHeadingBlockMenuItem } from './HeadingBlockMenuItem';
+import { createParagraphBlockMenuItem } from './ParagraphBlockMenuItem';
+import { createQuoteBlockMenuItem } from './QuoteBlockMenuItem';
+export const getBlockTypeComponents = api => {
   return [{
     type: 'block-menu-item',
     key: FORMAT_HEADING_1_MENU_ITEM.key,
@@ -12,8 +11,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_1_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
-      level: 1
+    component: createHeadingBlockMenuItem({
+      level: 1,
+      api
     })
   }, {
     type: 'block-menu-item',
@@ -23,8 +23,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_2_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
-      level: 2
+    component: createHeadingBlockMenuItem({
+      level: 2,
+      api
     })
   }, {
     type: 'block-menu-item',
@@ -34,8 +35,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_3_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
-      level: 3
+    component: createHeadingBlockMenuItem({
+      level: 3,
+      api
     })
   }, {
     type: 'block-menu-item',
@@ -45,8 +47,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_4_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
-      level: 4
+    component: createHeadingBlockMenuItem({
+      level: 4,
+      api
     })
   }, {
     type: 'block-menu-item',
@@ -56,8 +59,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_5_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
-      level: 5
+    component: createHeadingBlockMenuItem({
+      level: 5,
+      api
     })
   }, {
     type: 'block-menu-item',
@@ -67,8 +71,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_6_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
-      level: 6
+    component: createHeadingBlockMenuItem({
+      level: 6,
+      api
     })
   }, {
     type: 'block-menu-item',
@@ -78,7 +83,9 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_PARAGRAPH_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(ParagraphMenuItem, null)
+    component: createParagraphBlockMenuItem({
+      api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_QUOTE_MENU_ITEM.key,
@@ -87,6 +94,8 @@ export const getBlockTypeComponents = () => {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_QUOTE_MENU_ITEM.key]
     },
-    component: () => /*#__PURE__*/React.createElement(QuoteMenuItem, null)
+    component: createQuoteBlockMenuItem({
+      api
+    })
   }];
 };

package/dist/esm/blockTypePlugin.js

@@ -133,7 +133,7 @@ var blockTypePlugin = function blockTypePlugin(_ref3) {
   }
   if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
     var _api$blockMenu;
-    api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents(getBlockTypeComponents());
+    api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents(getBlockTypeComponents(api));
   }
   return {
     name: 'blockType',

package/dist/esm/ui/HeadingBlockMenuItem.js

@@ -0,0 +1,56 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { blockTypeMessages } from '@atlaskit/editor-common/messages';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
+import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
+import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
+import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
+import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
+import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
+import { HEADING_2, HEADING_5, HEADING_1, HEADING_3, HEADING_4, HEADING_6 } from './consts';
+var headingIcons = [TextHeadingOneIcon, TextHeadingTwoIcon, TextHeadingThreeIcon, TextHeadingFourIcon, TextHeadingFiveIcon, TextHeadingSixIcon];
+var headingMessages = [blockTypeMessages.heading1, blockTypeMessages.heading2, blockTypeMessages.heading3, blockTypeMessages.heading4, blockTypeMessages.heading5, blockTypeMessages.heading6];
+var HeadingBlockTypes = [HEADING_1, HEADING_2, HEADING_3, HEADING_4, HEADING_5, HEADING_6];
+var HeadingBlockMenuItem = function HeadingBlockMenuItem(_ref) {
+  var level = _ref.level,
+    api = _ref.api;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var Icon = headingIcons[level - 1];
+  var message = headingMessages[level - 1];
+  var currentBlockType = useSharedPluginStateSelector(api, 'blockType.currentBlockType');
+  var selection = useSharedPluginStateSelector(api, 'selection.selection');
+  var isTextSelection = selection instanceof TextSelection;
+  var isHeading = isTextSelection && currentBlockType && HeadingBlockTypes.includes(currentBlockType);
+  var currentHeadingLevel = isHeading ? currentBlockType.level : undefined;
+  var isSelected = isHeading && currentHeadingLevel === level;
+  var handleClick = function handleClick() {
+    if (!selection) {
+      return;
+    }
+    if (!isSelected) {
+      var _api$blockMenu;
+      api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("heading".concat(level)));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isSelected,
+    elemBefore: /*#__PURE__*/React.createElement(Icon, {
+      label: ""
+    })
+  }, formatMessage(message));
+};
+export var createHeadingBlockMenuItem = function createHeadingBlockMenuItem(_ref2) {
+  var level = _ref2.level,
+    api = _ref2.api;
+  return function () {
+    return /*#__PURE__*/React.createElement(HeadingBlockMenuItem, {
+      level: level,
+      api: api
+    });
+  };
+};

package/dist/esm/ui/ParagraphBlockMenuItem.js

@@ -0,0 +1,43 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { blockMenuMessages } from '@atlaskit/editor-common/messages';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import TextParagraphIcon from '@atlaskit/icon-lab/core/text-paragraph';
+import { NORMAL_TEXT } from './consts';
+var ParagraphBlockMenuItem = function ParagraphBlockMenuItem(_ref) {
+  var api = _ref.api;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var currentBlockType = useSharedPluginStateSelector(api, 'blockType.currentBlockType');
+  var bulletListActive = useSharedPluginStateSelector(api, 'list.bulletListActive');
+  var orderedListActive = useSharedPluginStateSelector(api, 'list.orderedListActive');
+  var selection = useSharedPluginStateSelector(api, 'selection.selection');
+  var isTextSelection = selection instanceof TextSelection;
+  var isParagraph = isTextSelection && currentBlockType && currentBlockType === NORMAL_TEXT && !bulletListActive && !orderedListActive;
+  var handleClick = function handleClick() {
+    if (!selection) {
+      return;
+    }
+    if (!isParagraph) {
+      var _api$blockMenu;
+      api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("paragraph"));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isParagraph,
+    elemBefore: /*#__PURE__*/React.createElement(TextParagraphIcon, {
+      label: ""
+    })
+  }, formatMessage(blockMenuMessages.paragraph));
+};
+export var createParagraphBlockMenuItem = function createParagraphBlockMenuItem(_ref2) {
+  var api = _ref2.api;
+  return function () {
+    return /*#__PURE__*/React.createElement(ParagraphBlockMenuItem, {
+      api: api
+    });
+  };
+};

package/dist/esm/ui/QuoteBlockMenuItem.js

@@ -0,0 +1,35 @@
+import React from 'react';
+import { useIntl } from 'react-intl-next';
+import { blockTypeMessages } from '@atlaskit/editor-common/messages';
+import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
+import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
+import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
+import { BLOCK_QUOTE } from './consts';
+var QuoteBlockMenuItem = function QuoteBlockMenuItem(_ref) {
+  var api = _ref.api;
+  var _useIntl = useIntl(),
+    formatMessage = _useIntl.formatMessage;
+  var currentBlockType = useSharedPluginStateSelector(api, 'blockType.currentBlockType');
+  var isBlockQuote = currentBlockType && currentBlockType === BLOCK_QUOTE;
+  var handleClick = function handleClick() {
+    if (!isBlockQuote) {
+      var _api$blockMenu;
+      api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.commands.formatNode("blockquote"));
+    }
+  };
+  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
+    onClick: handleClick,
+    isSelected: isBlockQuote,
+    elemBefore: /*#__PURE__*/React.createElement(QuotationMarkIcon, {
+      label: ""
+    })
+  }, formatMessage(blockTypeMessages.blockquote));
+};
+export var createQuoteBlockMenuItem = function createQuoteBlockMenuItem(_ref2) {
+  var api = _ref2.api;
+  return function () {
+    return /*#__PURE__*/React.createElement(QuoteBlockMenuItem, {
+      api: api
+    });
+  };
+};

package/dist/esm/ui/index.js

@@ -1,9 +1,8 @@
-import React from 'react';
 import { FORMAT_HEADING_1_MENU_ITEM, FORMAT_HEADING_2_MENU_ITEM, FORMAT_HEADING_3_MENU_ITEM, FORMAT_HEADING_4_MENU_ITEM, FORMAT_HEADING_5_MENU_ITEM, FORMAT_HEADING_6_MENU_ITEM, FORMAT_NESTED_MENU_RANK, FORMAT_PARAGRAPH_MENU_ITEM, FORMAT_QUOTE_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
-import { HeadingMenuItem } from './HeadingMenuItem';
-import { ParagraphMenuItem } from './ParagraphMenuItem';
-import { QuoteMenuItem } from './QuoteMenuItem';
-export var getBlockTypeComponents = function getBlockTypeComponents() {
+import { createHeadingBlockMenuItem } from './HeadingBlockMenuItem';
+import { createParagraphBlockMenuItem } from './ParagraphBlockMenuItem';
+import { createQuoteBlockMenuItem } from './QuoteBlockMenuItem';
+export var getBlockTypeComponents = function getBlockTypeComponents(api) {
   return [{
     type: 'block-menu-item',
     key: FORMAT_HEADING_1_MENU_ITEM.key,
@@ -12,11 +11,10 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_1_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(HeadingMenuItem, {
-        level: 1
-      });
-    }
+    component: createHeadingBlockMenuItem({
+      level: 1,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_HEADING_2_MENU_ITEM.key,
@@ -25,11 +23,10 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_2_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(HeadingMenuItem, {
-        level: 2
-      });
-    }
+    component: createHeadingBlockMenuItem({
+      level: 2,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_HEADING_3_MENU_ITEM.key,
@@ -38,11 +35,10 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_3_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(HeadingMenuItem, {
-        level: 3
-      });
-    }
+    component: createHeadingBlockMenuItem({
+      level: 3,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_HEADING_4_MENU_ITEM.key,
@@ -51,11 +47,10 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_4_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(HeadingMenuItem, {
-        level: 4
-      });
-    }
+    component: createHeadingBlockMenuItem({
+      level: 4,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_HEADING_5_MENU_ITEM.key,
@@ -64,11 +59,10 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_5_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(HeadingMenuItem, {
-        level: 5
-      });
-    }
+    component: createHeadingBlockMenuItem({
+      level: 5,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_HEADING_6_MENU_ITEM.key,
@@ -77,11 +71,10 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_6_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(HeadingMenuItem, {
-        level: 6
-      });
-    }
+    component: createHeadingBlockMenuItem({
+      level: 6,
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_PARAGRAPH_MENU_ITEM.key,
@@ -90,9 +83,9 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_PARAGRAPH_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(ParagraphMenuItem, null);
-    }
+    component: createParagraphBlockMenuItem({
+      api: api
+    })
   }, {
     type: 'block-menu-item',
     key: FORMAT_QUOTE_MENU_ITEM.key,
@@ -101,8 +94,8 @@ export var getBlockTypeComponents = function getBlockTypeComponents() {
       key: 'nested-menu-format-section-primary',
       rank: FORMAT_NESTED_MENU_RANK[FORMAT_QUOTE_MENU_ITEM.key]
     },
-    component: function component() {
-      return /*#__PURE__*/React.createElement(QuoteMenuItem, null);
-    }
+    component: createQuoteBlockMenuItem({
+      api: api
+    })
   }];
 };

package/dist/types/blockTypePluginType.d.ts

@@ -1,7 +1,9 @@
 import type { Command, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { BlockMenuPlugin } from '@atlaskit/editor-plugin-block-menu';
+import type { ListPlugin } from '@atlaskit/editor-plugin-list';
 import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
+import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { SelectionToolbarPlugin } from '@atlaskit/editor-plugin-selection-toolbar';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UserPreferencesPlugin } from '@atlaskit/editor-plugin-user-preferences';
@@ -24,7 +26,9 @@ export type BlockTypePlugin = NextEditorPlugin<'blockType', {
         OptionalPlugin<SelectionToolbarPlugin>,
         OptionalPlugin<UserPreferencesPlugin>,
         OptionalPlugin<ToolbarPlugin>,
-        OptionalPlugin<BlockMenuPlugin>
+        OptionalPlugin<BlockMenuPlugin>,
+        OptionalPlugin<ListPlugin>,
+        OptionalPlugin<SelectionPlugin>
     ];
     pluginConfiguration: BlockTypePluginOptions | undefined;
     sharedState: BlockTypeState | undefined;

package/dist/types/ui/HeadingBlockMenuItem.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockTypePlugin } from '../blockTypePluginType';
+type HeadingBlockMenuItemProps = {
+    api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
+    level: 1 | 2 | 3 | 4 | 5 | 6;
+};
+export declare const createHeadingBlockMenuItem: ({ level, api }: HeadingBlockMenuItemProps) => () => React.JSX.Element;
+export {};

package/dist/types/ui/ParagraphBlockMenuItem.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockTypePlugin } from '../blockTypePluginType';
+type ParagraphBlockMenuItemProps = {
+    api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
+};
+export declare const createParagraphBlockMenuItem: ({ api }: ParagraphBlockMenuItemProps) => () => React.JSX.Element;
+export {};

package/dist/types/ui/QuoteBlockMenuItem.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockTypePlugin } from '../blockTypePluginType';
+type QuoteBlockMenuItemProps = {
+    api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
+};
+export declare const createQuoteBlockMenuItem: ({ api }: QuoteBlockMenuItemProps) => () => React.JSX.Element;
+export {};

package/dist/types/ui/index.d.ts

@@ -1,2 +1,4 @@
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { RegisterBlockMenuComponent } from '@atlaskit/editor-plugin-block-menu';
-export declare const getBlockTypeComponents: () => RegisterBlockMenuComponent[];
+import type { BlockTypePlugin } from '../blockTypePluginType';
+export declare const getBlockTypeComponents: (api: ExtractInjectionAPI<BlockTypePlugin> | undefined) => RegisterBlockMenuComponent[];

package/dist/types-ts4.5/blockTypePluginType.d.ts

@@ -1,7 +1,9 @@
 import type { Command, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 import type { BlockMenuPlugin } from '@atlaskit/editor-plugin-block-menu';
+import type { ListPlugin } from '@atlaskit/editor-plugin-list';
 import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
+import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { SelectionToolbarPlugin } from '@atlaskit/editor-plugin-selection-toolbar';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { UserPreferencesPlugin } from '@atlaskit/editor-plugin-user-preferences';
@@ -24,7 +26,9 @@ export type BlockTypePlugin = NextEditorPlugin<'blockType', {
         OptionalPlugin<SelectionToolbarPlugin>,
         OptionalPlugin<UserPreferencesPlugin>,
         OptionalPlugin<ToolbarPlugin>,
-        OptionalPlugin<BlockMenuPlugin>
+        OptionalPlugin<BlockMenuPlugin>,
+        OptionalPlugin<ListPlugin>,
+        OptionalPlugin<SelectionPlugin>
     ];
     pluginConfiguration: BlockTypePluginOptions | undefined;
     sharedState: BlockTypeState | undefined;

package/dist/types-ts4.5/ui/HeadingBlockMenuItem.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockTypePlugin } from '../blockTypePluginType';
+type HeadingBlockMenuItemProps = {
+    api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
+    level: 1 | 2 | 3 | 4 | 5 | 6;
+};
+export declare const createHeadingBlockMenuItem: ({ level, api }: HeadingBlockMenuItemProps) => () => React.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/ParagraphBlockMenuItem.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockTypePlugin } from '../blockTypePluginType';
+type ParagraphBlockMenuItemProps = {
+    api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
+};
+export declare const createParagraphBlockMenuItem: ({ api }: ParagraphBlockMenuItemProps) => () => React.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/QuoteBlockMenuItem.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
+import type { BlockTypePlugin } from '../blockTypePluginType';
+type QuoteBlockMenuItemProps = {
+    api: ExtractInjectionAPI<BlockTypePlugin> | undefined;
+};
+export declare const createQuoteBlockMenuItem: ({ api }: QuoteBlockMenuItemProps) => () => React.JSX.Element;
+export {};

package/dist/types-ts4.5/ui/index.d.ts

@@ -1,2 +1,4 @@
+import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { RegisterBlockMenuComponent } from '@atlaskit/editor-plugin-block-menu';
-export declare const getBlockTypeComponents: () => RegisterBlockMenuComponent[];
+import type { BlockTypePlugin } from '../blockTypePluginType';
+export declare const getBlockTypeComponents: (api: ExtractInjectionAPI<BlockTypePlugin> | undefined) => RegisterBlockMenuComponent[];

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-block-type",
-	"version": "6.2.18",
+	"version": "6.2.19",
 	"description": "BlockType plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -32,8 +32,10 @@
 		"@atlaskit/adf-schema": "^50.2.3",
 		"@atlaskit/css": "^0.12.0",
 		"@atlaskit/editor-plugin-analytics": "^3.0.0",
-		"@atlaskit/editor-plugin-block-menu": "^0.0.19",
+		"@atlaskit/editor-plugin-block-menu": "^0.0.20",
+		"@atlaskit/editor-plugin-list": "^5.1.0",
 		"@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
+		"@atlaskit/editor-plugin-selection": "^3.2.0",
 		"@atlaskit/editor-plugin-selection-toolbar": "^4.3.0",
 		"@atlaskit/editor-plugin-toolbar": "^0.4.0",
 		"@atlaskit/editor-prosemirror": "7.0.0",

package/dist/cjs/ui/HeadingMenuItem.js

@@ -1,31 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.HeadingMenuItem = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactIntlNext = require("react-intl-next");
-var _messages = require("@atlaskit/editor-common/messages");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
-var _textHeadingFive = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-five"));
-var _textHeadingFour = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-four"));
-var _textHeadingOne = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-one"));
-var _textHeadingSix = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-six"));
-var _textHeadingThree = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-three"));
-var _textHeadingTwo = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-two"));
-var headingIcons = [_textHeadingOne.default, _textHeadingTwo.default, _textHeadingThree.default, _textHeadingFour.default, _textHeadingFive.default, _textHeadingSix.default];
-var headingMessages = [_messages.blockTypeMessages.heading1, _messages.blockTypeMessages.heading2, _messages.blockTypeMessages.heading3, _messages.blockTypeMessages.heading4, _messages.blockTypeMessages.heading5, _messages.blockTypeMessages.heading6];
-var HeadingMenuItem = exports.HeadingMenuItem = function HeadingMenuItem(_ref) {
-  var level = _ref.level;
-  var _useIntl = (0, _reactIntlNext.useIntl)(),
-    formatMessage = _useIntl.formatMessage;
-  var Icon = headingIcons[level - 1];
-  var message = headingMessages[level - 1];
-  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/_react.default.createElement(Icon, {
-      label: formatMessage(message)
-    })
-  }, formatMessage(message));
-};

package/dist/cjs/ui/ParagraphMenuItem.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ParagraphMenuItem = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactIntlNext = require("react-intl-next");
-var _messages = require("@atlaskit/editor-common/messages");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
-var _textParagraph = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-paragraph"));
-var ParagraphMenuItem = exports.ParagraphMenuItem = function ParagraphMenuItem() {
-  var _useIntl = (0, _reactIntlNext.useIntl)(),
-    formatMessage = _useIntl.formatMessage;
-  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/_react.default.createElement(_textParagraph.default, {
-      label: formatMessage(_messages.blockMenuMessages.paragraph)
-    })
-  }, formatMessage(_messages.blockMenuMessages.paragraph));
-};

package/dist/cjs/ui/QuoteMenuItem.js

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.QuoteMenuItem = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _reactIntlNext = require("react-intl-next");
-var _messages = require("@atlaskit/editor-common/messages");
-var _editorToolbar = require("@atlaskit/editor-toolbar");
-var _quotationMark = _interopRequireDefault(require("@atlaskit/icon/core/quotation-mark"));
-var QuoteMenuItem = exports.QuoteMenuItem = function QuoteMenuItem() {
-  var _useIntl = (0, _reactIntlNext.useIntl)(),
-    formatMessage = _useIntl.formatMessage;
-  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/_react.default.createElement(_quotationMark.default, {
-      label: formatMessage(_messages.blockTypeMessages.blockquote)
-    })
-  }, formatMessage(_messages.blockTypeMessages.blockquote));
-};

package/dist/es2019/ui/HeadingMenuItem.js

@@ -1,26 +0,0 @@
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import { blockTypeMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
-import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
-import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
-import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
-import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
-import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
-import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
-const headingIcons = [TextHeadingOneIcon, TextHeadingTwoIcon, TextHeadingThreeIcon, TextHeadingFourIcon, TextHeadingFiveIcon, TextHeadingSixIcon];
-const headingMessages = [blockTypeMessages.heading1, blockTypeMessages.heading2, blockTypeMessages.heading3, blockTypeMessages.heading4, blockTypeMessages.heading5, blockTypeMessages.heading6];
-export const HeadingMenuItem = ({
-  level
-}) => {
-  const {
-    formatMessage
-  } = useIntl();
-  const Icon = headingIcons[level - 1];
-  const message = headingMessages[level - 1];
-  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/React.createElement(Icon, {
-      label: formatMessage(message)
-    })
-  }, formatMessage(message));
-};

package/dist/es2019/ui/ParagraphMenuItem.js

@@ -1,15 +0,0 @@
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import { blockMenuMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
-import TextParagraphIcon from '@atlaskit/icon-lab/core/text-paragraph';
-export const ParagraphMenuItem = () => {
-  const {
-    formatMessage
-  } = useIntl();
-  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/React.createElement(TextParagraphIcon, {
-      label: formatMessage(blockMenuMessages.paragraph)
-    })
-  }, formatMessage(blockMenuMessages.paragraph));
-};

package/dist/es2019/ui/QuoteMenuItem.js

@@ -1,15 +0,0 @@
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import { blockTypeMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
-import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
-export const QuoteMenuItem = () => {
-  const {
-    formatMessage
-  } = useIntl();
-  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/React.createElement(QuotationMarkIcon, {
-      label: formatMessage(blockTypeMessages.blockquote)
-    })
-  }, formatMessage(blockTypeMessages.blockquote));
-};

package/dist/esm/ui/HeadingMenuItem.js

@@ -1,24 +0,0 @@
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import { blockTypeMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
-import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
-import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
-import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
-import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
-import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
-import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
-var headingIcons = [TextHeadingOneIcon, TextHeadingTwoIcon, TextHeadingThreeIcon, TextHeadingFourIcon, TextHeadingFiveIcon, TextHeadingSixIcon];
-var headingMessages = [blockTypeMessages.heading1, blockTypeMessages.heading2, blockTypeMessages.heading3, blockTypeMessages.heading4, blockTypeMessages.heading5, blockTypeMessages.heading6];
-export var HeadingMenuItem = function HeadingMenuItem(_ref) {
-  var level = _ref.level;
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
-  var Icon = headingIcons[level - 1];
-  var message = headingMessages[level - 1];
-  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/React.createElement(Icon, {
-      label: formatMessage(message)
-    })
-  }, formatMessage(message));
-};

package/dist/esm/ui/ParagraphMenuItem.js

@@ -1,14 +0,0 @@
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import { blockMenuMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
-import TextParagraphIcon from '@atlaskit/icon-lab/core/text-paragraph';
-export var ParagraphMenuItem = function ParagraphMenuItem() {
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
-  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/React.createElement(TextParagraphIcon, {
-      label: formatMessage(blockMenuMessages.paragraph)
-    })
-  }, formatMessage(blockMenuMessages.paragraph));
-};

package/dist/esm/ui/QuoteMenuItem.js

@@ -1,14 +0,0 @@
-import React from 'react';
-import { useIntl } from 'react-intl-next';
-import { blockTypeMessages } from '@atlaskit/editor-common/messages';
-import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
-import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
-export var QuoteMenuItem = function QuoteMenuItem() {
-  var _useIntl = useIntl(),
-    formatMessage = _useIntl.formatMessage;
-  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
-    elemBefore: /*#__PURE__*/React.createElement(QuotationMarkIcon, {
-      label: formatMessage(blockTypeMessages.blockquote)
-    })
-  }, formatMessage(blockTypeMessages.blockquote));
-};

package/dist/types/ui/HeadingMenuItem.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-type HeadingMenuItemProps = {
-    level: 1 | 2 | 3 | 4 | 5 | 6;
-};
-export declare const HeadingMenuItem: ({ level }: HeadingMenuItemProps) => React.JSX.Element;
-export {};

package/dist/types/ui/ParagraphMenuItem.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const ParagraphMenuItem: () => React.JSX.Element;

package/dist/types/ui/QuoteMenuItem.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const QuoteMenuItem: () => React.JSX.Element;

package/dist/types-ts4.5/ui/HeadingMenuItem.d.ts

@@ -1,6 +0,0 @@
-import React from 'react';
-type HeadingMenuItemProps = {
-    level: 1 | 2 | 3 | 4 | 5 | 6;
-};
-export declare const HeadingMenuItem: ({ level }: HeadingMenuItemProps) => React.JSX.Element;
-export {};

package/dist/types-ts4.5/ui/ParagraphMenuItem.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const ParagraphMenuItem: () => React.JSX.Element;

package/dist/types-ts4.5/ui/QuoteMenuItem.d.ts

@@ -1,2 +0,0 @@
-import React from 'react';
-export declare const QuoteMenuItem: () => React.JSX.Element;