@atlaskit/editor-plugin-block-menu 5.0.6 → 5.0.8

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,19 @@
1
1
  # @atlaskit/editor-plugin-block-menu
2
2
 
3
+ ## 5.0.8
4
+
5
+ ### Patch Changes
6
+
7
+ - [`66669e4c6a5d3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/66669e4c6a5d3) -
8
+ [ux] Update block menu renderer to support mulitple sections inside of a nested menu
9
+ - Updated dependencies
10
+
11
+ ## 5.0.7
12
+
13
+ ### Patch Changes
14
+
15
+ - Updated dependencies
16
+
3
17
  ## 5.0.6
4
18
 
5
19
  ### Patch Changes
@@ -81,27 +81,62 @@ var getFormatMenuComponents = function getFormatMenuComponents(api) {
81
81
  children = _ref2.children;
82
82
  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, null, children);
83
83
  }
84
+ }, {
85
+ type: 'block-menu-section',
86
+ key: _blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION.key,
87
+ parent: {
88
+ type: 'block-menu-nested',
89
+ key: _blockMenu.NESTED_FORMAT_MENU.key,
90
+ rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_STRUCTURE_MENU_SECTION.key]
91
+ },
92
+ component: function component() {
93
+ var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
94
+ children: null
95
+ },
96
+ children = _ref3.children;
97
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
98
+ title: "Structure"
99
+ }, children);
100
+ }
101
+ }, {
102
+ type: 'block-menu-section',
103
+ key: _blockMenu.TRANSFORM_HEADINGS_MENU_SECTION.key,
104
+ parent: {
105
+ type: 'block-menu-nested',
106
+ key: _blockMenu.NESTED_FORMAT_MENU.key,
107
+ rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_HEADINGS_MENU_SECTION.key]
108
+ },
109
+ component: function component() {
110
+ var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
111
+ children: null
112
+ },
113
+ children = _ref4.children;
114
+ return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
115
+ title: "Headings",
116
+ hasSeparator: true
117
+ }, children);
118
+ }
84
119
  }, {
85
120
  type: 'block-menu-section',
86
121
  key: _blockMenu.PRIMARY_MENU_SECTION.key,
87
122
  rank: 100,
88
- component: function component(_ref3) {
89
- var children = _ref3.children;
123
+ component: function component(_ref5) {
124
+ var children = _ref5.children;
90
125
  return /*#__PURE__*/_react.default.createElement(_formatMenuSection.FormatMenuSection, {
91
126
  api: api
92
127
  }, children);
93
128
  }
94
129
  }];
95
130
  };
96
- var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(_ref4) {
97
- var api = _ref4.api,
98
- config = _ref4.config;
131
+ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockMenuComponents(_ref6) {
132
+ var api = _ref6.api,
133
+ config = _ref6.config;
99
134
  return [].concat((0, _toConsumableArray2.default)(getFormatMenuComponents(api)), (0, _toConsumableArray2.default)((0, _expValEquals.expValEquals)('platform_synced_block', 'isEnabled', true) ? [{
100
135
  type: 'block-menu-section',
101
136
  key: _blockMenu.ADD_BLOCKS_MENU_SECTION.key,
102
137
  rank: _blockMenu.BLOCK_MENU_SECTION_RANK[_blockMenu.ADD_BLOCKS_MENU_SECTION.key],
103
- component: function component(_ref5) {
104
- var children = _ref5.children;
138
+ component: function component(_ref7) {
139
+ var children = _ref7.children;
105
140
  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
106
141
  hasSeparator: true
107
142
  }, children);
@@ -110,8 +145,8 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
110
145
  type: 'block-menu-section',
111
146
  key: _blockMenu.COPY_MENU_SECTION.key,
112
147
  rank: _blockMenu.BLOCK_MENU_SECTION_RANK[_blockMenu.COPY_MENU_SECTION.key],
113
- component: function component(_ref6) {
114
- var children = _ref6.children;
148
+ component: function component(_ref8) {
149
+ var children = _ref8.children;
115
150
  return /*#__PURE__*/_react.default.createElement(_copySection.CopySection, {
116
151
  api: api
117
152
  }, children);
@@ -147,8 +182,8 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
147
182
  type: 'block-menu-section',
148
183
  key: _blockMenu.MOVE_UP_DOWN_MENU_SECTION.key,
149
184
  rank: _blockMenu.BLOCK_MENU_SECTION_RANK[_blockMenu.MOVE_UP_DOWN_MENU_SECTION.key],
150
- component: function component(_ref7) {
151
- var children = _ref7.children;
185
+ component: function component(_ref9) {
186
+ var children = _ref9.children;
152
187
  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItemSection, {
153
188
  hasSeparator: true
154
189
  }, children);
@@ -157,8 +192,8 @@ var getBlockMenuComponents = exports.getBlockMenuComponents = function getBlockM
157
192
  type: 'block-menu-section',
158
193
  key: _blockMenu.DELETE_MENU_SECTION.key,
159
194
  rank: _blockMenu.BLOCK_MENU_SECTION_RANK[_blockMenu.DELETE_MENU_SECTION.key],
160
- component: function component(_ref8) {
161
- var children = _ref8.children;
195
+ component: function component(_ref0) {
196
+ var children = _ref0.children;
162
197
  return /*#__PURE__*/_react.default.createElement(_deleteSection.DeleteSection, {
163
198
  api: api
164
199
  }, children);
@@ -65,21 +65,25 @@ var BlockMenuRenderer = exports.BlockMenuRenderer = function BlockMenuRenderer(_
65
65
  return items.map(function (item) {
66
66
  if (isNestedMenu(item)) {
67
67
  var sortedNestedSections = getSortedNestedSections(components, item.key);
68
- return sortedNestedSections.map(function (section) {
68
+ var sections = sortedNestedSections.map(function (section) {
69
69
  var sortedNestedMenuItems = getSortedChildren(menuItems, section.key);
70
- var NestedMenuComponent = item.component || fallbacks.nestedMenu || NoOp;
70
+ if (sortedNestedMenuItems.length === 0) {
71
+ return null;
72
+ }
71
73
  var NestedSection = section.component || fallbacks.section || NoOp;
72
- return /*#__PURE__*/_react.default.createElement(NestedMenuComponent, {
73
- key: item.key
74
- }, /*#__PURE__*/_react.default.createElement(NestedSection, {
74
+ return /*#__PURE__*/_react.default.createElement(NestedSection, {
75
75
  key: section.key
76
76
  }, sortedNestedMenuItems.map(function (nestedItem) {
77
77
  var NestedMenuItemComponent = nestedItem.component || fallbacks.item || NoOp;
78
78
  return /*#__PURE__*/_react.default.createElement(NestedMenuItemComponent, {
79
79
  key: nestedItem.key
80
80
  });
81
- })));
81
+ }));
82
82
  });
83
+ var NestedMenuComponent = item.component || fallbacks.nestedMenu || NoOp;
84
+ return /*#__PURE__*/_react.default.createElement(NestedMenuComponent, {
85
+ key: item.key
86
+ }, sections);
83
87
  } else {
84
88
  var ItemComponent = item.component || fallbacks.item || NoOp;
85
89
  return /*#__PURE__*/_react.default.createElement(ItemComponent, {
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { ADD_BLOCKS_MENU_SECTION, 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';
2
+ import { ADD_BLOCKS_MENU_SECTION, 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, TRANSFORM_MENU_ITEM_RANK, TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_HEADINGS_MENU_SECTION } from '@atlaskit/editor-common/block-menu';
3
3
  import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
4
4
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
5
5
  import CopyBlockMenuItem from './copy-block';
@@ -69,6 +69,41 @@ const getFormatMenuComponents = api => {
69
69
  }) => {
70
70
  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, children);
71
71
  }
72
+ }, {
73
+ type: 'block-menu-section',
74
+ key: TRANSFORM_STRUCTURE_MENU_SECTION.key,
75
+ parent: {
76
+ type: 'block-menu-nested',
77
+ key: NESTED_FORMAT_MENU.key,
78
+ rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_STRUCTURE_MENU_SECTION.key]
79
+ },
80
+ component: ({
81
+ children
82
+ } = {
83
+ children: null
84
+ }) => {
85
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
86
+ title: "Structure"
87
+ }, children);
88
+ }
89
+ }, {
90
+ type: 'block-menu-section',
91
+ key: TRANSFORM_HEADINGS_MENU_SECTION.key,
92
+ parent: {
93
+ type: 'block-menu-nested',
94
+ key: NESTED_FORMAT_MENU.key,
95
+ rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_HEADINGS_MENU_SECTION.key]
96
+ },
97
+ component: ({
98
+ children
99
+ } = {
100
+ children: null
101
+ }) => {
102
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
103
+ title: "Headings",
104
+ hasSeparator: true
105
+ }, children);
106
+ }
72
107
  }, {
73
108
  type: 'block-menu-section',
74
109
  key: PRIMARY_MENU_SECTION.key,
@@ -44,21 +44,25 @@ export const BlockMenuRenderer = ({
44
44
  return items.map(item => {
45
45
  if (isNestedMenu(item)) {
46
46
  const sortedNestedSections = getSortedNestedSections(components, item.key);
47
- return sortedNestedSections.map(section => {
47
+ const sections = sortedNestedSections.map(section => {
48
48
  const sortedNestedMenuItems = getSortedChildren(menuItems, section.key);
49
- const NestedMenuComponent = item.component || fallbacks.nestedMenu || NoOp;
49
+ if (sortedNestedMenuItems.length === 0) {
50
+ return null;
51
+ }
50
52
  const NestedSection = section.component || fallbacks.section || NoOp;
51
- return /*#__PURE__*/React.createElement(NestedMenuComponent, {
52
- key: item.key
53
- }, /*#__PURE__*/React.createElement(NestedSection, {
53
+ return /*#__PURE__*/React.createElement(NestedSection, {
54
54
  key: section.key
55
55
  }, sortedNestedMenuItems.map(nestedItem => {
56
56
  const NestedMenuItemComponent = nestedItem.component || fallbacks.item || NoOp;
57
57
  return /*#__PURE__*/React.createElement(NestedMenuItemComponent, {
58
58
  key: nestedItem.key
59
59
  });
60
- })));
60
+ }));
61
61
  });
62
+ const NestedMenuComponent = item.component || fallbacks.nestedMenu || NoOp;
63
+ return /*#__PURE__*/React.createElement(NestedMenuComponent, {
64
+ key: item.key
65
+ }, sections);
62
66
  } else {
63
67
  const ItemComponent = item.component || fallbacks.item || NoOp;
64
68
  return /*#__PURE__*/React.createElement(ItemComponent, {
@@ -1,6 +1,6 @@
1
1
  import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
2
2
  import React from 'react';
3
- import { ADD_BLOCKS_MENU_SECTION, 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';
3
+ import { ADD_BLOCKS_MENU_SECTION, 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, TRANSFORM_MENU_ITEM_RANK, TRANSFORM_STRUCTURE_MENU_SECTION, TRANSFORM_HEADINGS_MENU_SECTION } from '@atlaskit/editor-common/block-menu';
4
4
  import { ToolbarDropdownItemSection } from '@atlaskit/editor-toolbar';
5
5
  import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
6
6
  import CopyBlockMenuItem from './copy-block';
@@ -74,27 +74,62 @@ var getFormatMenuComponents = function getFormatMenuComponents(api) {
74
74
  children = _ref2.children;
75
75
  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, null, children);
76
76
  }
77
+ }, {
78
+ type: 'block-menu-section',
79
+ key: TRANSFORM_STRUCTURE_MENU_SECTION.key,
80
+ parent: {
81
+ type: 'block-menu-nested',
82
+ key: NESTED_FORMAT_MENU.key,
83
+ rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_STRUCTURE_MENU_SECTION.key]
84
+ },
85
+ component: function component() {
86
+ var _ref3 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
87
+ children: null
88
+ },
89
+ children = _ref3.children;
90
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
91
+ title: "Structure"
92
+ }, children);
93
+ }
94
+ }, {
95
+ type: 'block-menu-section',
96
+ key: TRANSFORM_HEADINGS_MENU_SECTION.key,
97
+ parent: {
98
+ type: 'block-menu-nested',
99
+ key: NESTED_FORMAT_MENU.key,
100
+ rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_HEADINGS_MENU_SECTION.key]
101
+ },
102
+ component: function component() {
103
+ var _ref4 = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {
104
+ children: null
105
+ },
106
+ children = _ref4.children;
107
+ return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
108
+ title: "Headings",
109
+ hasSeparator: true
110
+ }, children);
111
+ }
77
112
  }, {
78
113
  type: 'block-menu-section',
79
114
  key: PRIMARY_MENU_SECTION.key,
80
115
  rank: 100,
81
- component: function component(_ref3) {
82
- var children = _ref3.children;
116
+ component: function component(_ref5) {
117
+ var children = _ref5.children;
83
118
  return /*#__PURE__*/React.createElement(FormatMenuSection, {
84
119
  api: api
85
120
  }, children);
86
121
  }
87
122
  }];
88
123
  };
89
- export var getBlockMenuComponents = function getBlockMenuComponents(_ref4) {
90
- var api = _ref4.api,
91
- config = _ref4.config;
124
+ export var getBlockMenuComponents = function getBlockMenuComponents(_ref6) {
125
+ var api = _ref6.api,
126
+ config = _ref6.config;
92
127
  return [].concat(_toConsumableArray(getFormatMenuComponents(api)), _toConsumableArray(expValEquals('platform_synced_block', 'isEnabled', true) ? [{
93
128
  type: 'block-menu-section',
94
129
  key: ADD_BLOCKS_MENU_SECTION.key,
95
130
  rank: BLOCK_MENU_SECTION_RANK[ADD_BLOCKS_MENU_SECTION.key],
96
- component: function component(_ref5) {
97
- var children = _ref5.children;
131
+ component: function component(_ref7) {
132
+ var children = _ref7.children;
98
133
  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
99
134
  hasSeparator: true
100
135
  }, children);
@@ -103,8 +138,8 @@ export var getBlockMenuComponents = function getBlockMenuComponents(_ref4) {
103
138
  type: 'block-menu-section',
104
139
  key: COPY_MENU_SECTION.key,
105
140
  rank: BLOCK_MENU_SECTION_RANK[COPY_MENU_SECTION.key],
106
- component: function component(_ref6) {
107
- var children = _ref6.children;
141
+ component: function component(_ref8) {
142
+ var children = _ref8.children;
108
143
  return /*#__PURE__*/React.createElement(CopySection, {
109
144
  api: api
110
145
  }, children);
@@ -140,8 +175,8 @@ export var getBlockMenuComponents = function getBlockMenuComponents(_ref4) {
140
175
  type: 'block-menu-section',
141
176
  key: MOVE_UP_DOWN_MENU_SECTION.key,
142
177
  rank: BLOCK_MENU_SECTION_RANK[MOVE_UP_DOWN_MENU_SECTION.key],
143
- component: function component(_ref7) {
144
- var children = _ref7.children;
178
+ component: function component(_ref9) {
179
+ var children = _ref9.children;
145
180
  return /*#__PURE__*/React.createElement(ToolbarDropdownItemSection, {
146
181
  hasSeparator: true
147
182
  }, children);
@@ -150,8 +185,8 @@ export var getBlockMenuComponents = function getBlockMenuComponents(_ref4) {
150
185
  type: 'block-menu-section',
151
186
  key: DELETE_MENU_SECTION.key,
152
187
  rank: BLOCK_MENU_SECTION_RANK[DELETE_MENU_SECTION.key],
153
- component: function component(_ref8) {
154
- var children = _ref8.children;
188
+ component: function component(_ref0) {
189
+ var children = _ref0.children;
155
190
  return /*#__PURE__*/React.createElement(DeleteSection, {
156
191
  api: api
157
192
  }, children);
@@ -56,21 +56,25 @@ export var BlockMenuRenderer = function BlockMenuRenderer(_ref) {
56
56
  return items.map(function (item) {
57
57
  if (isNestedMenu(item)) {
58
58
  var sortedNestedSections = getSortedNestedSections(components, item.key);
59
- return sortedNestedSections.map(function (section) {
59
+ var sections = sortedNestedSections.map(function (section) {
60
60
  var sortedNestedMenuItems = getSortedChildren(menuItems, section.key);
61
- var NestedMenuComponent = item.component || fallbacks.nestedMenu || NoOp;
61
+ if (sortedNestedMenuItems.length === 0) {
62
+ return null;
63
+ }
62
64
  var NestedSection = section.component || fallbacks.section || NoOp;
63
- return /*#__PURE__*/React.createElement(NestedMenuComponent, {
64
- key: item.key
65
- }, /*#__PURE__*/React.createElement(NestedSection, {
65
+ return /*#__PURE__*/React.createElement(NestedSection, {
66
66
  key: section.key
67
67
  }, sortedNestedMenuItems.map(function (nestedItem) {
68
68
  var NestedMenuItemComponent = nestedItem.component || fallbacks.item || NoOp;
69
69
  return /*#__PURE__*/React.createElement(NestedMenuItemComponent, {
70
70
  key: nestedItem.key
71
71
  });
72
- })));
72
+ }));
73
73
  });
74
+ var NestedMenuComponent = item.component || fallbacks.nestedMenu || NoOp;
75
+ return /*#__PURE__*/React.createElement(NestedMenuComponent, {
76
+ key: item.key
77
+ }, sections);
74
78
  } else {
75
79
  var ItemComponent = item.component || fallbacks.item || NoOp;
76
80
  return /*#__PURE__*/React.createElement(ItemComponent, {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-block-menu",
3
- "version": "5.0.6",
3
+ "version": "5.0.8",
4
4
  "description": "BlockMenu plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -39,17 +39,17 @@
39
39
  "@atlaskit/editor-shared-styles": "^3.9.0",
40
40
  "@atlaskit/editor-tables": "^2.9.0",
41
41
  "@atlaskit/editor-toolbar": "^0.17.0",
42
- "@atlaskit/icon": "^28.5.0",
42
+ "@atlaskit/icon": "^29.0.0",
43
43
  "@atlaskit/icon-lab": "^5.12.0",
44
44
  "@atlaskit/platform-feature-flags": "^1.1.0",
45
45
  "@atlaskit/platform-feature-flags-react": "^0.4.0",
46
46
  "@atlaskit/primitives": "^16.1.0",
47
- "@atlaskit/tmp-editor-statsig": "^13.35.0",
47
+ "@atlaskit/tmp-editor-statsig": "^13.36.0",
48
48
  "@atlaskit/tokens": "^8.0.0",
49
49
  "@babel/runtime": "^7.0.0"
50
50
  },
51
51
  "peerDependencies": {
52
- "@atlaskit/editor-common": "^110.26.0",
52
+ "@atlaskit/editor-common": "^110.27.0",
53
53
  "react": "^18.2.0",
54
54
  "react-intl-next": "npm:react-intl@^5.18.1"
55
55
  },