@atlaskit/editor-plugin-block-type 6.2.14 → 6.2.15

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  # @atlaskit/editor-plugin-block-type
2
2
 
3
+ ## 6.2.15
4
+
5
+ ### Patch Changes
6
+
7
+ - [`1ab3eb4c56ebb`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1ab3eb4c56ebb) -
8
+ [ux] ED-28581: Registered components for block type and list plugins
9
+ - Updated dependencies
10
+
3
11
  ## 6.2.14
4
12
 
5
13
  ### Patch Changes
@@ -16,6 +16,7 @@ var _quickInsert = require("@atlaskit/editor-common/quick-insert");
16
16
  var _types = require("@atlaskit/editor-common/types");
17
17
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
18
18
  var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
19
+ var _expValEqualsNoExposure = require("@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure");
19
20
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
20
21
  var _blockType = require("./pm-plugins/commands/block-type");
21
22
  var _inputRule = _interopRequireDefault(require("./pm-plugins/input-rule"));
@@ -24,6 +25,7 @@ var _main = require("./pm-plugins/main");
24
25
  var _FloatingToolbarComponent = require("./pm-plugins/ui/FloatingToolbarComponent");
25
26
  var _PrimaryToolbarComponent = require("./pm-plugins/ui/PrimaryToolbarComponent");
26
27
  var _ToolbarComponents = require("./pm-plugins/ui/ToolbarComponents");
28
+ var _ui = require("./ui");
27
29
  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; }
28
30
  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) { (0, _defineProperty2.default)(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; }
29
31
  var headingPluginOptions = function headingPluginOptions(_ref, isAllowed, editorAnalyticsApi) {
@@ -136,6 +138,10 @@ var blockTypePlugin = exports.blockTypePlugin = function blockTypePlugin(_ref3)
136
138
  component: primaryToolbarComponent
137
139
  });
138
140
  }
141
+ if ((0, _expValEqualsNoExposure.expValEqualsNoExposure)('platform_editor_block_menu', 'isEnabled', true)) {
142
+ var _api$blockMenu;
143
+ api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents((0, _ui.getBlockTypeComponents)());
144
+ }
139
145
  return {
140
146
  name: 'blockType',
141
147
  nodes: function nodes() {
@@ -0,0 +1,31 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.HeadingMenuItem = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _reactIntlNext = require("react-intl-next");
10
+ var _messages = require("@atlaskit/editor-common/messages");
11
+ var _editorToolbar = require("@atlaskit/editor-toolbar");
12
+ var _textHeadingFive = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-five"));
13
+ var _textHeadingFour = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-four"));
14
+ var _textHeadingOne = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-one"));
15
+ var _textHeadingSix = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-six"));
16
+ var _textHeadingThree = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-three"));
17
+ var _textHeadingTwo = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-heading-two"));
18
+ var headingIcons = [_textHeadingOne.default, _textHeadingTwo.default, _textHeadingThree.default, _textHeadingFour.default, _textHeadingFive.default, _textHeadingSix.default];
19
+ var headingMessages = [_messages.blockTypeMessages.heading1, _messages.blockTypeMessages.heading2, _messages.blockTypeMessages.heading3, _messages.blockTypeMessages.heading4, _messages.blockTypeMessages.heading5, _messages.blockTypeMessages.heading6];
20
+ var HeadingMenuItem = exports.HeadingMenuItem = function HeadingMenuItem(_ref) {
21
+ var level = _ref.level;
22
+ var _useIntl = (0, _reactIntlNext.useIntl)(),
23
+ formatMessage = _useIntl.formatMessage;
24
+ var Icon = headingIcons[level - 1];
25
+ var message = headingMessages[level - 1];
26
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
27
+ elemBefore: /*#__PURE__*/_react.default.createElement(Icon, {
28
+ label: formatMessage(message)
29
+ })
30
+ }, formatMessage(message));
31
+ };
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.ParagraphMenuItem = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _reactIntlNext = require("react-intl-next");
10
+ var _messages = require("@atlaskit/editor-common/messages");
11
+ var _editorToolbar = require("@atlaskit/editor-toolbar");
12
+ var _textParagraph = _interopRequireDefault(require("@atlaskit/icon-lab/core/text-paragraph"));
13
+ var ParagraphMenuItem = exports.ParagraphMenuItem = function ParagraphMenuItem() {
14
+ var _useIntl = (0, _reactIntlNext.useIntl)(),
15
+ formatMessage = _useIntl.formatMessage;
16
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
17
+ elemBefore: /*#__PURE__*/_react.default.createElement(_textParagraph.default, {
18
+ label: formatMessage(_messages.blockMenuMessages.paragraph)
19
+ })
20
+ }, formatMessage(_messages.blockMenuMessages.paragraph));
21
+ };
@@ -0,0 +1,21 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.QuoteMenuItem = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _reactIntlNext = require("react-intl-next");
10
+ var _messages = require("@atlaskit/editor-common/messages");
11
+ var _editorToolbar = require("@atlaskit/editor-toolbar");
12
+ var _quotationMark = _interopRequireDefault(require("@atlaskit/icon/core/quotation-mark"));
13
+ var QuoteMenuItem = exports.QuoteMenuItem = function QuoteMenuItem() {
14
+ var _useIntl = (0, _reactIntlNext.useIntl)(),
15
+ formatMessage = _useIntl.formatMessage;
16
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
17
+ elemBefore: /*#__PURE__*/_react.default.createElement(_quotationMark.default, {
18
+ label: formatMessage(_messages.blockTypeMessages.blockquote)
19
+ })
20
+ }, formatMessage(_messages.blockTypeMessages.blockquote));
21
+ };
@@ -0,0 +1,115 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.getBlockTypeComponents = void 0;
8
+ var _react = _interopRequireDefault(require("react"));
9
+ var _blockMenu = require("@atlaskit/editor-common/block-menu");
10
+ var _HeadingMenuItem = require("./HeadingMenuItem");
11
+ var _ParagraphMenuItem = require("./ParagraphMenuItem");
12
+ var _QuoteMenuItem = require("./QuoteMenuItem");
13
+ var getBlockTypeComponents = exports.getBlockTypeComponents = function getBlockTypeComponents() {
14
+ return [{
15
+ type: 'block-menu-item',
16
+ key: _blockMenu.FORMAT_HEADING_1_MENU_ITEM.key,
17
+ parent: {
18
+ type: 'block-menu-section',
19
+ key: 'nested-menu-format-section-primary',
20
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_1_MENU_ITEM.key]
21
+ },
22
+ component: function component() {
23
+ return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
24
+ level: 1
25
+ });
26
+ }
27
+ }, {
28
+ type: 'block-menu-item',
29
+ key: _blockMenu.FORMAT_HEADING_2_MENU_ITEM.key,
30
+ parent: {
31
+ type: 'block-menu-section',
32
+ key: 'nested-menu-format-section-primary',
33
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_2_MENU_ITEM.key]
34
+ },
35
+ component: function component() {
36
+ return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
37
+ level: 2
38
+ });
39
+ }
40
+ }, {
41
+ type: 'block-menu-item',
42
+ key: _blockMenu.FORMAT_HEADING_3_MENU_ITEM.key,
43
+ parent: {
44
+ type: 'block-menu-section',
45
+ key: 'nested-menu-format-section-primary',
46
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_3_MENU_ITEM.key]
47
+ },
48
+ component: function component() {
49
+ return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
50
+ level: 3
51
+ });
52
+ }
53
+ }, {
54
+ type: 'block-menu-item',
55
+ key: _blockMenu.FORMAT_HEADING_4_MENU_ITEM.key,
56
+ parent: {
57
+ type: 'block-menu-section',
58
+ key: 'nested-menu-format-section-primary',
59
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_4_MENU_ITEM.key]
60
+ },
61
+ component: function component() {
62
+ return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
63
+ level: 4
64
+ });
65
+ }
66
+ }, {
67
+ type: 'block-menu-item',
68
+ key: _blockMenu.FORMAT_HEADING_5_MENU_ITEM.key,
69
+ parent: {
70
+ type: 'block-menu-section',
71
+ key: 'nested-menu-format-section-primary',
72
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_5_MENU_ITEM.key]
73
+ },
74
+ component: function component() {
75
+ return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
76
+ level: 5
77
+ });
78
+ }
79
+ }, {
80
+ type: 'block-menu-item',
81
+ key: _blockMenu.FORMAT_HEADING_6_MENU_ITEM.key,
82
+ parent: {
83
+ type: 'block-menu-section',
84
+ key: 'nested-menu-format-section-primary',
85
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_HEADING_6_MENU_ITEM.key]
86
+ },
87
+ component: function component() {
88
+ return /*#__PURE__*/_react.default.createElement(_HeadingMenuItem.HeadingMenuItem, {
89
+ level: 6
90
+ });
91
+ }
92
+ }, {
93
+ type: 'block-menu-item',
94
+ key: _blockMenu.FORMAT_PARAGRAPH_MENU_ITEM.key,
95
+ parent: {
96
+ type: 'block-menu-section',
97
+ key: 'nested-menu-format-section-primary',
98
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_PARAGRAPH_MENU_ITEM.key]
99
+ },
100
+ component: function component() {
101
+ return /*#__PURE__*/_react.default.createElement(_ParagraphMenuItem.ParagraphMenuItem, null);
102
+ }
103
+ }, {
104
+ type: 'block-menu-item',
105
+ key: _blockMenu.FORMAT_QUOTE_MENU_ITEM.key,
106
+ parent: {
107
+ type: 'block-menu-section',
108
+ key: 'nested-menu-format-section-primary',
109
+ rank: _blockMenu.FORMAT_NESTED_MENU_RANK[_blockMenu.FORMAT_QUOTE_MENU_ITEM.key]
110
+ },
111
+ component: function component() {
112
+ return /*#__PURE__*/_react.default.createElement(_QuoteMenuItem.QuoteMenuItem, null);
113
+ }
114
+ }];
115
+ };
@@ -7,6 +7,7 @@ import { IconHeading, IconQuote } from '@atlaskit/editor-common/quick-insert';
7
7
  import { ToolbarSize } from '@atlaskit/editor-common/types';
8
8
  import { fg } from '@atlaskit/platform-feature-flags';
9
9
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
10
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
10
11
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
11
12
  import { clearFormatting, insertBlockQuoteWithAnalytics, insertBlockQuoteWithAnalyticsCommand, setBlockTypeWithAnalytics } from './pm-plugins/commands/block-type';
12
13
  import inputRulePlugin from './pm-plugins/input-rule';
@@ -15,6 +16,7 @@ import { createPlugin, pluginKey } from './pm-plugins/main';
15
16
  import { FloatingToolbarComponent } from './pm-plugins/ui/FloatingToolbarComponent';
16
17
  import { PrimaryToolbarComponent } from './pm-plugins/ui/PrimaryToolbarComponent';
17
18
  import { getToolbarComponents } from './pm-plugins/ui/ToolbarComponents';
19
+ import { getBlockTypeComponents } from './ui';
18
20
  const headingPluginOptions = ({
19
21
  formatMessage
20
22
  }, isAllowed, editorAnalyticsApi) => {
@@ -125,6 +127,10 @@ const blockTypePlugin = ({
125
127
  component: primaryToolbarComponent
126
128
  });
127
129
  }
130
+ if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
131
+ var _api$blockMenu;
132
+ api === null || api === void 0 ? void 0 : (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 ? void 0 : _api$blockMenu.actions.registerBlockMenuComponents(getBlockTypeComponents());
133
+ }
128
134
  return {
129
135
  name: 'blockType',
130
136
  nodes() {
@@ -0,0 +1,26 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl-next';
3
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
6
+ import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
7
+ import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
8
+ import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
9
+ import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
10
+ import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
11
+ const headingIcons = [TextHeadingOneIcon, TextHeadingTwoIcon, TextHeadingThreeIcon, TextHeadingFourIcon, TextHeadingFiveIcon, TextHeadingSixIcon];
12
+ const headingMessages = [blockTypeMessages.heading1, blockTypeMessages.heading2, blockTypeMessages.heading3, blockTypeMessages.heading4, blockTypeMessages.heading5, blockTypeMessages.heading6];
13
+ export const HeadingMenuItem = ({
14
+ level
15
+ }) => {
16
+ const {
17
+ formatMessage
18
+ } = useIntl();
19
+ const Icon = headingIcons[level - 1];
20
+ const message = headingMessages[level - 1];
21
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
22
+ elemBefore: /*#__PURE__*/React.createElement(Icon, {
23
+ label: formatMessage(message)
24
+ })
25
+ }, formatMessage(message));
26
+ };
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl-next';
3
+ import { blockMenuMessages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import TextParagraphIcon from '@atlaskit/icon-lab/core/text-paragraph';
6
+ export const ParagraphMenuItem = () => {
7
+ const {
8
+ formatMessage
9
+ } = useIntl();
10
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
11
+ elemBefore: /*#__PURE__*/React.createElement(TextParagraphIcon, {
12
+ label: formatMessage(blockMenuMessages.paragraph)
13
+ })
14
+ }, formatMessage(blockMenuMessages.paragraph));
15
+ };
@@ -0,0 +1,15 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl-next';
3
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
6
+ export const QuoteMenuItem = () => {
7
+ const {
8
+ formatMessage
9
+ } = useIntl();
10
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
11
+ elemBefore: /*#__PURE__*/React.createElement(QuotationMarkIcon, {
12
+ label: formatMessage(blockTypeMessages.blockquote)
13
+ })
14
+ }, formatMessage(blockTypeMessages.blockquote));
15
+ };
@@ -0,0 +1,92 @@
1
+ import React from 'react';
2
+ 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';
3
+ import { HeadingMenuItem } from './HeadingMenuItem';
4
+ import { ParagraphMenuItem } from './ParagraphMenuItem';
5
+ import { QuoteMenuItem } from './QuoteMenuItem';
6
+ export const getBlockTypeComponents = () => {
7
+ return [{
8
+ type: 'block-menu-item',
9
+ key: FORMAT_HEADING_1_MENU_ITEM.key,
10
+ parent: {
11
+ type: 'block-menu-section',
12
+ key: 'nested-menu-format-section-primary',
13
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_1_MENU_ITEM.key]
14
+ },
15
+ component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
16
+ level: 1
17
+ })
18
+ }, {
19
+ type: 'block-menu-item',
20
+ key: FORMAT_HEADING_2_MENU_ITEM.key,
21
+ parent: {
22
+ type: 'block-menu-section',
23
+ key: 'nested-menu-format-section-primary',
24
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_2_MENU_ITEM.key]
25
+ },
26
+ component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
27
+ level: 2
28
+ })
29
+ }, {
30
+ type: 'block-menu-item',
31
+ key: FORMAT_HEADING_3_MENU_ITEM.key,
32
+ parent: {
33
+ type: 'block-menu-section',
34
+ key: 'nested-menu-format-section-primary',
35
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_3_MENU_ITEM.key]
36
+ },
37
+ component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
38
+ level: 3
39
+ })
40
+ }, {
41
+ type: 'block-menu-item',
42
+ key: FORMAT_HEADING_4_MENU_ITEM.key,
43
+ parent: {
44
+ type: 'block-menu-section',
45
+ key: 'nested-menu-format-section-primary',
46
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_4_MENU_ITEM.key]
47
+ },
48
+ component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
49
+ level: 4
50
+ })
51
+ }, {
52
+ type: 'block-menu-item',
53
+ key: FORMAT_HEADING_5_MENU_ITEM.key,
54
+ parent: {
55
+ type: 'block-menu-section',
56
+ key: 'nested-menu-format-section-primary',
57
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_5_MENU_ITEM.key]
58
+ },
59
+ component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
60
+ level: 5
61
+ })
62
+ }, {
63
+ type: 'block-menu-item',
64
+ key: FORMAT_HEADING_6_MENU_ITEM.key,
65
+ parent: {
66
+ type: 'block-menu-section',
67
+ key: 'nested-menu-format-section-primary',
68
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_6_MENU_ITEM.key]
69
+ },
70
+ component: () => /*#__PURE__*/React.createElement(HeadingMenuItem, {
71
+ level: 6
72
+ })
73
+ }, {
74
+ type: 'block-menu-item',
75
+ key: FORMAT_PARAGRAPH_MENU_ITEM.key,
76
+ parent: {
77
+ type: 'block-menu-section',
78
+ key: 'nested-menu-format-section-primary',
79
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_PARAGRAPH_MENU_ITEM.key]
80
+ },
81
+ component: () => /*#__PURE__*/React.createElement(ParagraphMenuItem, null)
82
+ }, {
83
+ type: 'block-menu-item',
84
+ key: FORMAT_QUOTE_MENU_ITEM.key,
85
+ parent: {
86
+ type: 'block-menu-section',
87
+ key: 'nested-menu-format-section-primary',
88
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_QUOTE_MENU_ITEM.key]
89
+ },
90
+ component: () => /*#__PURE__*/React.createElement(QuoteMenuItem, null)
91
+ }];
92
+ };
@@ -11,6 +11,7 @@ import { IconHeading, IconQuote } from '@atlaskit/editor-common/quick-insert';
11
11
  import { ToolbarSize } from '@atlaskit/editor-common/types';
12
12
  import { fg } from '@atlaskit/platform-feature-flags';
13
13
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
14
+ import { expValEqualsNoExposure } from '@atlaskit/tmp-editor-statsig/exp-val-equals-no-exposure';
14
15
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
15
16
  import { clearFormatting as _clearFormatting, insertBlockQuoteWithAnalytics, insertBlockQuoteWithAnalyticsCommand, setBlockTypeWithAnalytics } from './pm-plugins/commands/block-type';
16
17
  import inputRulePlugin from './pm-plugins/input-rule';
@@ -19,6 +20,7 @@ import { createPlugin, pluginKey } from './pm-plugins/main';
19
20
  import { FloatingToolbarComponent } from './pm-plugins/ui/FloatingToolbarComponent';
20
21
  import { PrimaryToolbarComponent } from './pm-plugins/ui/PrimaryToolbarComponent';
21
22
  import { getToolbarComponents } from './pm-plugins/ui/ToolbarComponents';
23
+ import { getBlockTypeComponents } from './ui';
22
24
  var headingPluginOptions = function headingPluginOptions(_ref, isAllowed, editorAnalyticsApi) {
23
25
  var formatMessage = _ref.formatMessage;
24
26
  if (!isAllowed) {
@@ -129,6 +131,10 @@ var blockTypePlugin = function blockTypePlugin(_ref3) {
129
131
  component: primaryToolbarComponent
130
132
  });
131
133
  }
134
+ if (expValEqualsNoExposure('platform_editor_block_menu', 'isEnabled', true)) {
135
+ var _api$blockMenu;
136
+ api === null || api === void 0 || (_api$blockMenu = api.blockMenu) === null || _api$blockMenu === void 0 || _api$blockMenu.actions.registerBlockMenuComponents(getBlockTypeComponents());
137
+ }
132
138
  return {
133
139
  name: 'blockType',
134
140
  nodes: function nodes() {
@@ -0,0 +1,24 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl-next';
3
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import TextHeadingFiveIcon from '@atlaskit/icon-lab/core/text-heading-five';
6
+ import TextHeadingFourIcon from '@atlaskit/icon-lab/core/text-heading-four';
7
+ import TextHeadingOneIcon from '@atlaskit/icon-lab/core/text-heading-one';
8
+ import TextHeadingSixIcon from '@atlaskit/icon-lab/core/text-heading-six';
9
+ import TextHeadingThreeIcon from '@atlaskit/icon-lab/core/text-heading-three';
10
+ import TextHeadingTwoIcon from '@atlaskit/icon-lab/core/text-heading-two';
11
+ var headingIcons = [TextHeadingOneIcon, TextHeadingTwoIcon, TextHeadingThreeIcon, TextHeadingFourIcon, TextHeadingFiveIcon, TextHeadingSixIcon];
12
+ var headingMessages = [blockTypeMessages.heading1, blockTypeMessages.heading2, blockTypeMessages.heading3, blockTypeMessages.heading4, blockTypeMessages.heading5, blockTypeMessages.heading6];
13
+ export var HeadingMenuItem = function HeadingMenuItem(_ref) {
14
+ var level = _ref.level;
15
+ var _useIntl = useIntl(),
16
+ formatMessage = _useIntl.formatMessage;
17
+ var Icon = headingIcons[level - 1];
18
+ var message = headingMessages[level - 1];
19
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
20
+ elemBefore: /*#__PURE__*/React.createElement(Icon, {
21
+ label: formatMessage(message)
22
+ })
23
+ }, formatMessage(message));
24
+ };
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl-next';
3
+ import { blockMenuMessages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import TextParagraphIcon from '@atlaskit/icon-lab/core/text-paragraph';
6
+ export var ParagraphMenuItem = function ParagraphMenuItem() {
7
+ var _useIntl = useIntl(),
8
+ formatMessage = _useIntl.formatMessage;
9
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
10
+ elemBefore: /*#__PURE__*/React.createElement(TextParagraphIcon, {
11
+ label: formatMessage(blockMenuMessages.paragraph)
12
+ })
13
+ }, formatMessage(blockMenuMessages.paragraph));
14
+ };
@@ -0,0 +1,14 @@
1
+ import React from 'react';
2
+ import { useIntl } from 'react-intl-next';
3
+ import { blockTypeMessages } from '@atlaskit/editor-common/messages';
4
+ import { ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
+ import QuotationMarkIcon from '@atlaskit/icon/core/quotation-mark';
6
+ export var QuoteMenuItem = function QuoteMenuItem() {
7
+ var _useIntl = useIntl(),
8
+ formatMessage = _useIntl.formatMessage;
9
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
10
+ elemBefore: /*#__PURE__*/React.createElement(QuotationMarkIcon, {
11
+ label: formatMessage(blockTypeMessages.blockquote)
12
+ })
13
+ }, formatMessage(blockTypeMessages.blockquote));
14
+ };
@@ -0,0 +1,108 @@
1
+ import React from 'react';
2
+ 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';
3
+ import { HeadingMenuItem } from './HeadingMenuItem';
4
+ import { ParagraphMenuItem } from './ParagraphMenuItem';
5
+ import { QuoteMenuItem } from './QuoteMenuItem';
6
+ export var getBlockTypeComponents = function getBlockTypeComponents() {
7
+ return [{
8
+ type: 'block-menu-item',
9
+ key: FORMAT_HEADING_1_MENU_ITEM.key,
10
+ parent: {
11
+ type: 'block-menu-section',
12
+ key: 'nested-menu-format-section-primary',
13
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_1_MENU_ITEM.key]
14
+ },
15
+ component: function component() {
16
+ return /*#__PURE__*/React.createElement(HeadingMenuItem, {
17
+ level: 1
18
+ });
19
+ }
20
+ }, {
21
+ type: 'block-menu-item',
22
+ key: FORMAT_HEADING_2_MENU_ITEM.key,
23
+ parent: {
24
+ type: 'block-menu-section',
25
+ key: 'nested-menu-format-section-primary',
26
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_2_MENU_ITEM.key]
27
+ },
28
+ component: function component() {
29
+ return /*#__PURE__*/React.createElement(HeadingMenuItem, {
30
+ level: 2
31
+ });
32
+ }
33
+ }, {
34
+ type: 'block-menu-item',
35
+ key: FORMAT_HEADING_3_MENU_ITEM.key,
36
+ parent: {
37
+ type: 'block-menu-section',
38
+ key: 'nested-menu-format-section-primary',
39
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_3_MENU_ITEM.key]
40
+ },
41
+ component: function component() {
42
+ return /*#__PURE__*/React.createElement(HeadingMenuItem, {
43
+ level: 3
44
+ });
45
+ }
46
+ }, {
47
+ type: 'block-menu-item',
48
+ key: FORMAT_HEADING_4_MENU_ITEM.key,
49
+ parent: {
50
+ type: 'block-menu-section',
51
+ key: 'nested-menu-format-section-primary',
52
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_4_MENU_ITEM.key]
53
+ },
54
+ component: function component() {
55
+ return /*#__PURE__*/React.createElement(HeadingMenuItem, {
56
+ level: 4
57
+ });
58
+ }
59
+ }, {
60
+ type: 'block-menu-item',
61
+ key: FORMAT_HEADING_5_MENU_ITEM.key,
62
+ parent: {
63
+ type: 'block-menu-section',
64
+ key: 'nested-menu-format-section-primary',
65
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_5_MENU_ITEM.key]
66
+ },
67
+ component: function component() {
68
+ return /*#__PURE__*/React.createElement(HeadingMenuItem, {
69
+ level: 5
70
+ });
71
+ }
72
+ }, {
73
+ type: 'block-menu-item',
74
+ key: FORMAT_HEADING_6_MENU_ITEM.key,
75
+ parent: {
76
+ type: 'block-menu-section',
77
+ key: 'nested-menu-format-section-primary',
78
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_HEADING_6_MENU_ITEM.key]
79
+ },
80
+ component: function component() {
81
+ return /*#__PURE__*/React.createElement(HeadingMenuItem, {
82
+ level: 6
83
+ });
84
+ }
85
+ }, {
86
+ type: 'block-menu-item',
87
+ key: FORMAT_PARAGRAPH_MENU_ITEM.key,
88
+ parent: {
89
+ type: 'block-menu-section',
90
+ key: 'nested-menu-format-section-primary',
91
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_PARAGRAPH_MENU_ITEM.key]
92
+ },
93
+ component: function component() {
94
+ return /*#__PURE__*/React.createElement(ParagraphMenuItem, null);
95
+ }
96
+ }, {
97
+ type: 'block-menu-item',
98
+ key: FORMAT_QUOTE_MENU_ITEM.key,
99
+ parent: {
100
+ type: 'block-menu-section',
101
+ key: 'nested-menu-format-section-primary',
102
+ rank: FORMAT_NESTED_MENU_RANK[FORMAT_QUOTE_MENU_ITEM.key]
103
+ },
104
+ component: function component() {
105
+ return /*#__PURE__*/React.createElement(QuoteMenuItem, null);
106
+ }
107
+ }];
108
+ };
@@ -1,5 +1,6 @@
1
1
  import type { Command, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
2
2
  import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
3
+ import type { BlockMenuPlugin } from '@atlaskit/editor-plugin-block-menu';
3
4
  import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
4
5
  import type { SelectionToolbarPlugin } from '@atlaskit/editor-plugin-selection-toolbar';
5
6
  import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
@@ -22,7 +23,8 @@ export type BlockTypePlugin = NextEditorPlugin<'blockType', {
22
23
  OptionalPlugin<PrimaryToolbarPlugin>,
23
24
  OptionalPlugin<SelectionToolbarPlugin>,
24
25
  OptionalPlugin<UserPreferencesPlugin>,
25
- OptionalPlugin<ToolbarPlugin>
26
+ OptionalPlugin<ToolbarPlugin>,
27
+ OptionalPlugin<BlockMenuPlugin>
26
28
  ];
27
29
  pluginConfiguration: BlockTypePluginOptions | undefined;
28
30
  sharedState: BlockTypeState | undefined;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ type HeadingMenuItemProps = {
3
+ level: 1 | 2 | 3 | 4 | 5 | 6;
4
+ };
5
+ export declare const HeadingMenuItem: ({ level }: HeadingMenuItemProps) => React.JSX.Element;
6
+ export {};
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export declare const ParagraphMenuItem: () => React.JSX.Element;
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export declare const QuoteMenuItem: () => React.JSX.Element;
@@ -0,0 +1,2 @@
1
+ import type { RegisterBlockMenuComponent } from '@atlaskit/editor-plugin-block-menu';
2
+ export declare const getBlockTypeComponents: () => RegisterBlockMenuComponent[];
@@ -1,5 +1,6 @@
1
1
  import type { Command, EditorCommand, NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
2
2
  import type { AnalyticsPlugin } from '@atlaskit/editor-plugin-analytics';
3
+ import type { BlockMenuPlugin } from '@atlaskit/editor-plugin-block-menu';
3
4
  import type { PrimaryToolbarPlugin } from '@atlaskit/editor-plugin-primary-toolbar';
4
5
  import type { SelectionToolbarPlugin } from '@atlaskit/editor-plugin-selection-toolbar';
5
6
  import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
@@ -22,7 +23,8 @@ export type BlockTypePlugin = NextEditorPlugin<'blockType', {
22
23
  OptionalPlugin<PrimaryToolbarPlugin>,
23
24
  OptionalPlugin<SelectionToolbarPlugin>,
24
25
  OptionalPlugin<UserPreferencesPlugin>,
25
- OptionalPlugin<ToolbarPlugin>
26
+ OptionalPlugin<ToolbarPlugin>,
27
+ OptionalPlugin<BlockMenuPlugin>
26
28
  ];
27
29
  pluginConfiguration: BlockTypePluginOptions | undefined;
28
30
  sharedState: BlockTypeState | undefined;
@@ -0,0 +1,6 @@
1
+ import React from 'react';
2
+ type HeadingMenuItemProps = {
3
+ level: 1 | 2 | 3 | 4 | 5 | 6;
4
+ };
5
+ export declare const HeadingMenuItem: ({ level }: HeadingMenuItemProps) => React.JSX.Element;
6
+ export {};
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export declare const ParagraphMenuItem: () => React.JSX.Element;
@@ -0,0 +1,2 @@
1
+ import React from 'react';
2
+ export declare const QuoteMenuItem: () => React.JSX.Element;
@@ -0,0 +1,2 @@
1
+ import type { RegisterBlockMenuComponent } from '@atlaskit/editor-plugin-block-menu';
2
+ export declare const getBlockTypeComponents: () => RegisterBlockMenuComponent[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-type",
3
- "version": "6.2.14",
3
+ "version": "6.2.15",
4
4
  "description": "BlockType plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -32,6 +32,7 @@
32
32
  "@atlaskit/adf-schema": "^50.2.3",
33
33
  "@atlaskit/css": "^0.12.0",
34
34
  "@atlaskit/editor-plugin-analytics": "^3.0.0",
35
+ "@atlaskit/editor-plugin-block-menu": "^0.0.16",
35
36
  "@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
36
37
  "@atlaskit/editor-plugin-selection-toolbar": "^4.3.0",
37
38
  "@atlaskit/editor-plugin-toolbar": "^0.4.0",