@atlaskit/editor-plugin-selection-extension 10.0.6 → 10.1.0

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.
Files changed (16) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/cjs/selectionExtensionPlugin.js +1 -1
  3. package/dist/cjs/ui/extension/SelectionExtensionComponentWrapper.js +3 -3
  4. package/dist/cjs/ui/menu/SelectionExtensionDropdownItem.js +9 -0
  5. package/dist/cjs/ui/utils/registerBlockMenuItems.js +65 -29
  6. package/dist/es2019/selectionExtensionPlugin.js +1 -1
  7. package/dist/es2019/ui/extension/SelectionExtensionComponentWrapper.js +3 -3
  8. package/dist/es2019/ui/menu/SelectionExtensionDropdownItem.js +9 -0
  9. package/dist/es2019/ui/utils/registerBlockMenuItems.js +64 -28
  10. package/dist/esm/selectionExtensionPlugin.js +1 -1
  11. package/dist/esm/ui/extension/SelectionExtensionComponentWrapper.js +3 -3
  12. package/dist/esm/ui/menu/SelectionExtensionDropdownItem.js +9 -0
  13. package/dist/esm/ui/utils/registerBlockMenuItems.js +66 -30
  14. package/dist/types/types/index.d.ts +16 -9
  15. package/dist/types-ts4.5/types/index.d.ts +16 -9
  16. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,18 @@
1
1
  # @atlaskit/editor-plugin-selection-extension
2
2
 
3
+ ## 10.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [`1993b8227cbf3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/1993b8227cbf3) -
8
+ [ux] Update selection extension APIs to allow Snippets to register at parent level
9
+
10
+ ### Patch Changes
11
+
12
+ - [`c947ea0c83c0e`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c947ea0c83c0e) -
13
+ [ED-29456] clean up platform_editor_toolbar_aifc_selection_extension
14
+ - Updated dependencies
15
+
3
16
  ## 10.0.6
4
17
 
5
18
  ### Patch Changes
package/dist/cjs/selectionExtensionPlugin.js CHANGED
@@ -151,7 +151,7 @@ var selectionExtensionPlugin = exports.selectionExtensionPlugin = function selec
151
151
  if ((0, _expValEquals.expValEquals)('platform_editor_hydratable_ui', 'isEnabled', true) && (0, _coreUtils.isSSR)()) {
152
152
  return;
153
153
  }
154
- if (isToolbarAIFCEnabled && (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_selection_extension', 'isEnabled', true)) {
154
+ if (isToolbarAIFCEnabled) {
155
155
  var _api$toolbar;
156
156
  api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents((0, _toolbarComponents.getToolbarComponents)({
157
157
  api: api,
package/dist/cjs/ui/extension/SelectionExtensionComponentWrapper.js CHANGED
@@ -14,7 +14,7 @@ var SelectionExtensionComponentWrapper = exports.SelectionExtensionComponentWrap
14
14
  var api = _ref.api,
15
15
  editorAnalyticsAPI = _ref.editorAnalyticsAPI;
16
16
  var componentRef = (0, _react.useRef)();
17
- var isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar) && (0, _expValEquals.expValEquals)('platform_editor_toolbar_aifc_selection_extension', 'isEnabled', true);
17
+ var isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar);
18
18
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['selectionExtension', 'editorViewMode'], function (states) {
19
19
  var _states$selectionExte, _states$editorViewMod;
20
20
  return {
@@ -74,7 +74,7 @@ var SelectionExtensionComponentWrapper = exports.SelectionExtensionComponentWrap
74
74
  }
75
75
  return;
76
76
  }
77
- // delete this when cleanup platform_editor_toolbar_aifc_selection_extension
77
+ // delete this when cleaning up platform_editor_toolbar_aifc
78
78
  if (extension && 'component' in extension && componentRef.current !== extension.component && extension.component !== undefined) {
79
79
  if (editorAnalyticsAPI) {
80
80
  editorAnalyticsAPI.fireAnalyticsEvent({
@@ -114,7 +114,7 @@ var SelectionExtensionComponentWrapper = exports.SelectionExtensionComponentWrap
114
114
  });
115
115
  }
116
116
 
117
- // delete this when cleanup platform_editor_toolbar_aifc_selection_extension
117
+ // delete this when cleaning up platform_editor_toolbar_aifc
118
118
  if (!('component' in extension) || !extension.component) {
119
119
  return null;
120
120
  }
package/dist/cjs/ui/menu/SelectionExtensionDropdownItem.js CHANGED
@@ -41,6 +41,7 @@ var SelectionExtensionDropdownItem = exports.SelectionExtensionDropdownItem = fu
41
41
  }));
42
42
  }
43
43
  api.core.actions.execute(function (_ref2) {
44
+ var _api$blockControls2;
44
45
  var tr = _ref2.tr;
45
46
  var _getSelectionAdfInfoN = (0, _utils.getSelectionAdfInfoNew)(selection),
46
47
  selectedNode = _getSelectionAdfInfoN.selectedNode,
@@ -50,6 +51,14 @@ var SelectionExtensionDropdownItem = exports.SelectionExtensionDropdownItem = fu
50
51
  selectedNode: selectedNode,
51
52
  nodePos: nodePos
52
53
  });
54
+
55
+ // Close the block menu for featured items since they're at top level
56
+ // and don't have a parent menu context to auto-close
57
+ api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
58
+ closeMenu: true
59
+ })({
60
+ tr: tr
61
+ });
53
62
  return tr;
54
63
  });
55
64
  (_dropdownItem$onClick = dropdownItem.onClick) === null || _dropdownItem$onClick === void 0 || _dropdownItem$onClick.call(dropdownItem);
package/dist/cjs/ui/utils/registerBlockMenuItems.js CHANGED
@@ -23,35 +23,71 @@ function registerBlockMenuItems(_ref) {
23
23
  if (!(api !== null && api !== void 0 && api.blockMenu)) {
24
24
  return;
25
25
  }
26
- var component = function component() {
27
- var editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
28
- if (!editorView) {
29
- return null;
30
- }
31
- return /*#__PURE__*/_react.default.createElement(_SelectionExtensionComponentContext.SelectionExtensionComponentContextProvider, {
32
- value: {
33
- api: api,
34
- editorView: editorView,
35
- extensionKey: key,
36
- extensionSource: source,
37
- extensionLocation: 'block-menu'
26
+ var componentsToRegister = [];
27
+
28
+ // Use placement from BlockMenuExtensionConfiguration
29
+ // Featured placement: register under TRANSFORM_MENU_SECTION
30
+ // Default placement: register under TRANSFORM_CREATE_MENU_SECTION
31
+ if (blockMenu.placement === 'featured') {
32
+ componentsToRegister.push({
33
+ type: 'block-menu-item',
34
+ key: "selection-extension-".concat(key),
35
+ parent: {
36
+ type: 'block-menu-section',
37
+ key: _blockMenu.BLOCK_ACTIONS_MENU_SECTION.key,
38
+ rank: _blockMenu.BLOCK_ACTIONS_MENU_SECTION_RANK[_blockMenu.BLOCK_ACTIONS_FEATURED_EXTENSION_SLOT_MENU_ITEM.key]
39
+ },
40
+ component: function component() {
41
+ var editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
42
+ if (!editorView) {
43
+ return null;
44
+ }
45
+ return /*#__PURE__*/_react.default.createElement(_SelectionExtensionComponentContext.SelectionExtensionComponentContextProvider, {
46
+ value: {
47
+ api: api,
48
+ editorView: editorView,
49
+ extensionKey: key,
50
+ extensionSource: source,
51
+ extensionLocation: 'block-menu'
52
+ }
53
+ }, /*#__PURE__*/_react.default.createElement(_SelectionExtensionMenuItems.SelectionExtensionMenuItems, {
54
+ getMenuItems: blockMenu.getMenuItems
55
+ }));
56
+ }
57
+ });
58
+ } else {
59
+ componentsToRegister.push({
60
+ type: 'block-menu-item',
61
+ key: "selection-extension-".concat(key),
62
+ isHidden: function isHidden() {
63
+ return blockMenu.getMenuItems().length === 0;
64
+ },
65
+ parent: {
66
+ type: 'block-menu-section',
67
+ key: _blockMenu.TRANSFORM_CREATE_MENU_SECTION.key,
68
+ rank: _blockMenu.TRANSFORM_CREATE_MENU_SECTION_RANK[_blockMenu.TRANSFORM_DEFAULT_EXTENSION_SLOT_MENU_ITEM.key]
69
+ },
70
+ component: function component() {
71
+ var editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
72
+ if (!editorView) {
73
+ return null;
74
+ }
75
+ return /*#__PURE__*/_react.default.createElement(_SelectionExtensionComponentContext.SelectionExtensionComponentContextProvider, {
76
+ value: {
77
+ api: api,
78
+ editorView: editorView,
79
+ extensionKey: key,
80
+ extensionSource: source,
81
+ extensionLocation: 'block-menu'
82
+ }
83
+ }, /*#__PURE__*/_react.default.createElement(_SelectionExtensionMenuItems.SelectionExtensionMenuItems, {
84
+ getMenuItems: blockMenu.getMenuItems
85
+ }));
38
86
  }
39
- }, /*#__PURE__*/_react.default.createElement(_SelectionExtensionMenuItems.SelectionExtensionMenuItems, {
40
- getMenuItems: blockMenu.getMenuItems
41
- }));
42
- };
43
- api.blockMenu.actions.registerBlockMenuComponents([{
44
- type: 'block-menu-item',
45
- key: "selection-extension-".concat(key),
46
- isHidden: function isHidden() {
47
- return blockMenu.getMenuItems().length === 0;
48
- },
49
- parent: {
50
- type: 'block-menu-section',
51
- key: _blockMenu.TRANSFORM_CREATE_MENU_SECTION.key,
52
- rank: _blockMenu.TRANSFORM_MENU_ITEM_RANK[_blockMenu.TRANSFORM_CREATE_MENU_SECTION.key]
53
- },
54
- component: component
55
- }]);
87
+ });
88
+ }
89
+ if (componentsToRegister.length > 0) {
90
+ api.blockMenu.actions.registerBlockMenuComponents(componentsToRegister);
91
+ }
56
92
  });
57
93
  }
package/dist/es2019/selectionExtensionPlugin.js CHANGED
@@ -146,7 +146,7 @@ export const selectionExtensionPlugin = ({
146
146
  if (expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) && isSSR()) {
147
147
  return;
148
148
  }
149
- if (isToolbarAIFCEnabled && expValEquals('platform_editor_toolbar_aifc_selection_extension', 'isEnabled', true)) {
149
+ if (isToolbarAIFCEnabled) {
150
150
  var _api$toolbar;
151
151
  api === null || api === void 0 ? void 0 : (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 ? void 0 : _api$toolbar.actions.registerComponents(getToolbarComponents({
152
152
  api,
package/dist/es2019/ui/extension/SelectionExtensionComponentWrapper.js CHANGED
@@ -7,7 +7,7 @@ export const SelectionExtensionComponentWrapper = ({
7
7
  editorAnalyticsAPI
8
8
  }) => {
9
9
  const componentRef = useRef();
10
- const isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar) && expValEquals('platform_editor_toolbar_aifc_selection_extension', 'isEnabled', true);
10
+ const isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar);
11
11
  const {
12
12
  activeExtension,
13
13
  mode
@@ -68,7 +68,7 @@ export const SelectionExtensionComponentWrapper = ({
68
68
  }
69
69
  return;
70
70
  }
71
- // delete this when cleanup platform_editor_toolbar_aifc_selection_extension
71
+ // delete this when cleaning up platform_editor_toolbar_aifc
72
72
  if (extension && 'component' in extension && componentRef.current !== extension.component && extension.component !== undefined) {
73
73
  if (editorAnalyticsAPI) {
74
74
  editorAnalyticsAPI.fireAnalyticsEvent({
@@ -108,7 +108,7 @@ export const SelectionExtensionComponentWrapper = ({
108
108
  });
109
109
  }
110
110
 
111
- // delete this when cleanup platform_editor_toolbar_aifc_selection_extension
111
+ // delete this when cleaning up platform_editor_toolbar_aifc
112
112
  if (!('component' in extension) || !extension.component) {
113
113
  return null;
114
114
  }
package/dist/es2019/ui/menu/SelectionExtensionDropdownItem.js CHANGED
@@ -38,6 +38,7 @@ export const SelectionExtensionDropdownItem = ({
38
38
  api.core.actions.execute(({
39
39
  tr
40
40
  }) => {
41
+ var _api$blockControls2;
41
42
  const {
42
43
  selectedNode,
43
44
  nodePos
@@ -47,6 +48,14 @@ export const SelectionExtensionDropdownItem = ({
47
48
  selectedNode,
48
49
  nodePos
49
50
  });
51
+
52
+ // Close the block menu for featured items since they're at top level
53
+ // and don't have a parent menu context to auto-close
54
+ api === null || api === void 0 ? void 0 : (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 ? void 0 : _api$blockControls2.commands.toggleBlockMenu({
55
+ closeMenu: true
56
+ })({
57
+ tr
58
+ });
50
59
  return tr;
51
60
  });
52
61
  (_dropdownItem$onClick = dropdownItem.onClick) === null || _dropdownItem$onClick === void 0 ? void 0 : _dropdownItem$onClick.call(dropdownItem);
package/dist/es2019/ui/utils/registerBlockMenuItems.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { TRANSFORM_CREATE_MENU_SECTION, TRANSFORM_MENU_ITEM_RANK } from '@atlaskit/editor-common/block-menu';
2
+ import { BLOCK_ACTIONS_MENU_SECTION, BLOCK_ACTIONS_FEATURED_EXTENSION_SLOT_MENU_ITEM, BLOCK_ACTIONS_MENU_SECTION_RANK, TRANSFORM_CREATE_MENU_SECTION, TRANSFORM_CREATE_MENU_SECTION_RANK, TRANSFORM_DEFAULT_EXTENSION_SLOT_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
3
3
  import { SelectionExtensionMenuItems } from '../menu/SelectionExtensionMenuItems';
4
4
  import { SelectionExtensionComponentContextProvider } from '../SelectionExtensionComponentContext';
5
5
  export function registerBlockMenuItems({
@@ -18,33 +18,69 @@ export function registerBlockMenuItems({
18
18
  if (!(api !== null && api !== void 0 && api.blockMenu)) {
19
19
  return;
20
20
  }
21
- const component = () => {
22
- const editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
23
- if (!editorView) {
24
- return null;
25
- }
26
- return /*#__PURE__*/React.createElement(SelectionExtensionComponentContextProvider, {
27
- value: {
28
- api,
29
- editorView,
30
- extensionKey: key,
31
- extensionSource: source,
32
- extensionLocation: 'block-menu'
21
+ const componentsToRegister = [];
22
+
23
+ // Use placement from BlockMenuExtensionConfiguration
24
+ // Featured placement: register under TRANSFORM_MENU_SECTION
25
+ // Default placement: register under TRANSFORM_CREATE_MENU_SECTION
26
+ if (blockMenu.placement === 'featured') {
27
+ componentsToRegister.push({
28
+ type: 'block-menu-item',
29
+ key: `selection-extension-${key}`,
30
+ parent: {
31
+ type: 'block-menu-section',
32
+ key: BLOCK_ACTIONS_MENU_SECTION.key,
33
+ rank: BLOCK_ACTIONS_MENU_SECTION_RANK[BLOCK_ACTIONS_FEATURED_EXTENSION_SLOT_MENU_ITEM.key]
34
+ },
35
+ component: () => {
36
+ const editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
37
+ if (!editorView) {
38
+ return null;
39
+ }
40
+ return /*#__PURE__*/React.createElement(SelectionExtensionComponentContextProvider, {
41
+ value: {
42
+ api,
43
+ editorView,
44
+ extensionKey: key,
45
+ extensionSource: source,
46
+ extensionLocation: 'block-menu'
47
+ }
48
+ }, /*#__PURE__*/React.createElement(SelectionExtensionMenuItems, {
49
+ getMenuItems: blockMenu.getMenuItems
50
+ }));
33
51
  }
34
- }, /*#__PURE__*/React.createElement(SelectionExtensionMenuItems, {
35
- getMenuItems: blockMenu.getMenuItems
36
- }));
37
- };
38
- api.blockMenu.actions.registerBlockMenuComponents([{
39
- type: 'block-menu-item',
40
- key: `selection-extension-${key}`,
41
- isHidden: () => blockMenu.getMenuItems().length === 0,
42
- parent: {
43
- type: 'block-menu-section',
44
- key: TRANSFORM_CREATE_MENU_SECTION.key,
45
- rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_CREATE_MENU_SECTION.key]
46
- },
47
- component
48
- }]);
52
+ });
53
+ } else {
54
+ componentsToRegister.push({
55
+ type: 'block-menu-item',
56
+ key: `selection-extension-${key}`,
57
+ isHidden: () => blockMenu.getMenuItems().length === 0,
58
+ parent: {
59
+ type: 'block-menu-section',
60
+ key: TRANSFORM_CREATE_MENU_SECTION.key,
61
+ rank: TRANSFORM_CREATE_MENU_SECTION_RANK[TRANSFORM_DEFAULT_EXTENSION_SLOT_MENU_ITEM.key]
62
+ },
63
+ component: () => {
64
+ const editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
65
+ if (!editorView) {
66
+ return null;
67
+ }
68
+ return /*#__PURE__*/React.createElement(SelectionExtensionComponentContextProvider, {
69
+ value: {
70
+ api,
71
+ editorView,
72
+ extensionKey: key,
73
+ extensionSource: source,
74
+ extensionLocation: 'block-menu'
75
+ }
76
+ }, /*#__PURE__*/React.createElement(SelectionExtensionMenuItems, {
77
+ getMenuItems: blockMenu.getMenuItems
78
+ }));
79
+ }
80
+ });
81
+ }
82
+ if (componentsToRegister.length > 0) {
83
+ api.blockMenu.actions.registerBlockMenuComponents(componentsToRegister);
84
+ }
49
85
  });
50
86
  }
package/dist/esm/selectionExtensionPlugin.js CHANGED
@@ -144,7 +144,7 @@ export var selectionExtensionPlugin = function selectionExtensionPlugin(_ref) {
144
144
  if (expValEquals('platform_editor_hydratable_ui', 'isEnabled', true) && isSSR()) {
145
145
  return;
146
146
  }
147
- if (isToolbarAIFCEnabled && expValEquals('platform_editor_toolbar_aifc_selection_extension', 'isEnabled', true)) {
147
+ if (isToolbarAIFCEnabled) {
148
148
  var _api$toolbar;
149
149
  api === null || api === void 0 || (_api$toolbar = api.toolbar) === null || _api$toolbar === void 0 || _api$toolbar.actions.registerComponents(getToolbarComponents({
150
150
  api: api,
package/dist/esm/ui/extension/SelectionExtensionComponentWrapper.js CHANGED
@@ -6,7 +6,7 @@ export var SelectionExtensionComponentWrapper = function SelectionExtensionCompo
6
6
  var api = _ref.api,
7
7
  editorAnalyticsAPI = _ref.editorAnalyticsAPI;
8
8
  var componentRef = useRef();
9
- var isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar) && expValEquals('platform_editor_toolbar_aifc_selection_extension', 'isEnabled', true);
9
+ var isToolbarAIFCEnabled = Boolean(api === null || api === void 0 ? void 0 : api.toolbar);
10
10
  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['selectionExtension', 'editorViewMode'], function (states) {
11
11
  var _states$selectionExte, _states$editorViewMod;
12
12
  return {
@@ -66,7 +66,7 @@ export var SelectionExtensionComponentWrapper = function SelectionExtensionCompo
66
66
  }
67
67
  return;
68
68
  }
69
- // delete this when cleanup platform_editor_toolbar_aifc_selection_extension
69
+ // delete this when cleaning up platform_editor_toolbar_aifc
70
70
  if (extension && 'component' in extension && componentRef.current !== extension.component && extension.component !== undefined) {
71
71
  if (editorAnalyticsAPI) {
72
72
  editorAnalyticsAPI.fireAnalyticsEvent({
@@ -106,7 +106,7 @@ export var SelectionExtensionComponentWrapper = function SelectionExtensionCompo
106
106
  });
107
107
  }
108
108
 
109
- // delete this when cleanup platform_editor_toolbar_aifc_selection_extension
109
+ // delete this when cleaning up platform_editor_toolbar_aifc
110
110
  if (!('component' in extension) || !extension.component) {
111
111
  return null;
112
112
  }
package/dist/esm/ui/menu/SelectionExtensionDropdownItem.js CHANGED
@@ -34,6 +34,7 @@ export var SelectionExtensionDropdownItem = function SelectionExtensionDropdownI
34
34
  }));
35
35
  }
36
36
  api.core.actions.execute(function (_ref2) {
37
+ var _api$blockControls2;
37
38
  var tr = _ref2.tr;
38
39
  var _getSelectionAdfInfoN = getSelectionAdfInfoNew(selection),
39
40
  selectedNode = _getSelectionAdfInfoN.selectedNode,
@@ -43,6 +44,14 @@ export var SelectionExtensionDropdownItem = function SelectionExtensionDropdownI
43
44
  selectedNode: selectedNode,
44
45
  nodePos: nodePos
45
46
  });
47
+
48
+ // Close the block menu for featured items since they're at top level
49
+ // and don't have a parent menu context to auto-close
50
+ api === null || api === void 0 || (_api$blockControls2 = api.blockControls) === null || _api$blockControls2 === void 0 || _api$blockControls2.commands.toggleBlockMenu({
51
+ closeMenu: true
52
+ })({
53
+ tr: tr
54
+ });
46
55
  return tr;
47
56
  });
48
57
  (_dropdownItem$onClick = dropdownItem.onClick) === null || _dropdownItem$onClick === void 0 || _dropdownItem$onClick.call(dropdownItem);
package/dist/esm/ui/utils/registerBlockMenuItems.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import React from 'react';
2
- import { TRANSFORM_CREATE_MENU_SECTION, TRANSFORM_MENU_ITEM_RANK } from '@atlaskit/editor-common/block-menu';
2
+ import { BLOCK_ACTIONS_MENU_SECTION, BLOCK_ACTIONS_FEATURED_EXTENSION_SLOT_MENU_ITEM, BLOCK_ACTIONS_MENU_SECTION_RANK, TRANSFORM_CREATE_MENU_SECTION, TRANSFORM_CREATE_MENU_SECTION_RANK, TRANSFORM_DEFAULT_EXTENSION_SLOT_MENU_ITEM } from '@atlaskit/editor-common/block-menu';
3
3
  import { SelectionExtensionMenuItems } from '../menu/SelectionExtensionMenuItems';
4
4
  import { SelectionExtensionComponentContextProvider } from '../SelectionExtensionComponentContext';
5
5
  export function registerBlockMenuItems(_ref) {
@@ -16,35 +16,71 @@ export function registerBlockMenuItems(_ref) {
16
16
  if (!(api !== null && api !== void 0 && api.blockMenu)) {
17
17
  return;
18
18
  }
19
- var component = function component() {
20
- var editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
21
- if (!editorView) {
22
- return null;
23
- }
24
- return /*#__PURE__*/React.createElement(SelectionExtensionComponentContextProvider, {
25
- value: {
26
- api: api,
27
- editorView: editorView,
28
- extensionKey: key,
29
- extensionSource: source,
30
- extensionLocation: 'block-menu'
19
+ var componentsToRegister = [];
20
+
21
+ // Use placement from BlockMenuExtensionConfiguration
22
+ // Featured placement: register under TRANSFORM_MENU_SECTION
23
+ // Default placement: register under TRANSFORM_CREATE_MENU_SECTION
24
+ if (blockMenu.placement === 'featured') {
25
+ componentsToRegister.push({
26
+ type: 'block-menu-item',
27
+ key: "selection-extension-".concat(key),
28
+ parent: {
29
+ type: 'block-menu-section',
30
+ key: BLOCK_ACTIONS_MENU_SECTION.key,
31
+ rank: BLOCK_ACTIONS_MENU_SECTION_RANK[BLOCK_ACTIONS_FEATURED_EXTENSION_SLOT_MENU_ITEM.key]
32
+ },
33
+ component: function component() {
34
+ var editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
35
+ if (!editorView) {
36
+ return null;
37
+ }
38
+ return /*#__PURE__*/React.createElement(SelectionExtensionComponentContextProvider, {
39
+ value: {
40
+ api: api,
41
+ editorView: editorView,
42
+ extensionKey: key,
43
+ extensionSource: source,
44
+ extensionLocation: 'block-menu'
45
+ }
46
+ }, /*#__PURE__*/React.createElement(SelectionExtensionMenuItems, {
47
+ getMenuItems: blockMenu.getMenuItems
48
+ }));
31
49
  }
32
- }, /*#__PURE__*/React.createElement(SelectionExtensionMenuItems, {
33
- getMenuItems: blockMenu.getMenuItems
34
- }));
35
- };
36
- api.blockMenu.actions.registerBlockMenuComponents([{
37
- type: 'block-menu-item',
38
- key: "selection-extension-".concat(key),
39
- isHidden: function isHidden() {
40
- return blockMenu.getMenuItems().length === 0;
41
- },
42
- parent: {
43
- type: 'block-menu-section',
44
- key: TRANSFORM_CREATE_MENU_SECTION.key,
45
- rank: TRANSFORM_MENU_ITEM_RANK[TRANSFORM_CREATE_MENU_SECTION.key]
46
- },
47
- component: component
48
- }]);
50
+ });
51
+ } else {
52
+ componentsToRegister.push({
53
+ type: 'block-menu-item',
54
+ key: "selection-extension-".concat(key),
55
+ isHidden: function isHidden() {
56
+ return blockMenu.getMenuItems().length === 0;
57
+ },
58
+ parent: {
59
+ type: 'block-menu-section',
60
+ key: TRANSFORM_CREATE_MENU_SECTION.key,
61
+ rank: TRANSFORM_CREATE_MENU_SECTION_RANK[TRANSFORM_DEFAULT_EXTENSION_SLOT_MENU_ITEM.key]
62
+ },
63
+ component: function component() {
64
+ var editorView = editorViewRef === null || editorViewRef === void 0 ? void 0 : editorViewRef.current;
65
+ if (!editorView) {
66
+ return null;
67
+ }
68
+ return /*#__PURE__*/React.createElement(SelectionExtensionComponentContextProvider, {
69
+ value: {
70
+ api: api,
71
+ editorView: editorView,
72
+ extensionKey: key,
73
+ extensionSource: source,
74
+ extensionLocation: 'block-menu'
75
+ }
76
+ }, /*#__PURE__*/React.createElement(SelectionExtensionMenuItems, {
77
+ getMenuItems: blockMenu.getMenuItems
78
+ }));
79
+ }
80
+ });
81
+ }
82
+ if (componentsToRegister.length > 0) {
83
+ api.blockMenu.actions.registerBlockMenuComponents(componentsToRegister);
84
+ }
49
85
  });
50
86
  }
package/dist/types/types/index.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import type { ComponentType, PropsWithChildren } from 'react';
2
2
  import type { ADFEntity } from '@atlaskit/adf-utils/types';
3
+ import type { BlockMenuPlacement } from '@atlaskit/editor-common/block-menu';
3
4
  import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
4
5
  import type { ViewMode } from '@atlaskit/editor-plugin-editor-viewmode';
5
6
  import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
@@ -134,16 +135,22 @@ export type ToolbarExtensionConfiguration = {
134
135
  };
135
136
  export type BlockMenuExtensionConfiguration = {
136
137
  getMenuItems: GetMenuItemsFn;
137
- };
138
- export type ExtensionToolbarItemConfiguration = {
139
138
  /**
140
- * Optional key to identify the toolbar item in analytics events
139
+ * Optional placement hint to control where the menu items appear in the block menu
140
+ * - 'default' (or undefined): Items appear in their normal nested location under create section
141
+ * - 'featured': Items are promoted to top-level alongside the "Turn into" menu
141
142
  */
142
- key?: string;
143
+ placement?: BlockMenuPlacement;
144
+ };
145
+ export type ExtensionToolbarItemConfiguration = {
143
146
  icon: ComponentType<PropsWithChildren<{
144
147
  label: string;
145
148
  }>>;
146
149
  isDisabled?: boolean;
150
+ /**
151
+ * Optional key to identify the toolbar item in analytics events
152
+ */
153
+ key?: string;
147
154
  label?: string;
148
155
  onClick?: () => void;
149
156
  tooltip: string;
@@ -152,16 +159,16 @@ export type ExtensionToolbarItemConfiguration = {
152
159
  * Common fields applicable to all extension menu items
153
160
  */
154
161
  type ExtensionMenuItemBaseConfiguration = {
155
- /**
156
- * Optional key to identify the menu item in analytics events
157
- */
158
- key?: string;
159
162
  icon: ComponentType<PropsWithChildren<{
160
163
  label: string;
161
164
  size?: 'small' | 'medium';
162
165
  }>>;
163
- label: string;
164
166
  isDisabled?: boolean;
167
+ /**
168
+ * Optional key to identify the menu item in analytics events
169
+ */
170
+ key?: string;
171
+ label: string;
165
172
  };
166
173
  /**
167
174
  * Fields for a dropdown item (i.e., an item that does not have further nested menu items)
package/dist/types-ts4.5/types/index.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import type { ComponentType, PropsWithChildren } from 'react';
2
2
  import type { ADFEntity } from '@atlaskit/adf-utils/types';
3
+ import type { BlockMenuPlacement } from '@atlaskit/editor-common/block-menu';
3
4
  import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
4
5
  import type { ViewMode } from '@atlaskit/editor-plugin-editor-viewmode';
5
6
  import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
@@ -134,16 +135,22 @@ export type ToolbarExtensionConfiguration = {
134
135
  };
135
136
  export type BlockMenuExtensionConfiguration = {
136
137
  getMenuItems: GetMenuItemsFn;
137
- };
138
- export type ExtensionToolbarItemConfiguration = {
139
138
  /**
140
- * Optional key to identify the toolbar item in analytics events
139
+ * Optional placement hint to control where the menu items appear in the block menu
140
+ * - 'default' (or undefined): Items appear in their normal nested location under create section
141
+ * - 'featured': Items are promoted to top-level alongside the "Turn into" menu
141
142
  */
142
- key?: string;
143
+ placement?: BlockMenuPlacement;
144
+ };
145
+ export type ExtensionToolbarItemConfiguration = {
143
146
  icon: ComponentType<PropsWithChildren<{
144
147
  label: string;
145
148
  }>>;
146
149
  isDisabled?: boolean;
150
+ /**
151
+ * Optional key to identify the toolbar item in analytics events
152
+ */
153
+ key?: string;
147
154
  label?: string;
148
155
  onClick?: () => void;
149
156
  tooltip: string;
@@ -152,16 +159,16 @@ export type ExtensionToolbarItemConfiguration = {
152
159
  * Common fields applicable to all extension menu items
153
160
  */
154
161
  type ExtensionMenuItemBaseConfiguration = {
155
- /**
156
- * Optional key to identify the menu item in analytics events
157
- */
158
- key?: string;
159
162
  icon: ComponentType<PropsWithChildren<{
160
163
  label: string;
161
164
  size?: 'small' | 'medium';
162
165
  }>>;
163
- label: string;
164
166
  isDisabled?: boolean;
167
+ /**
168
+ * Optional key to identify the menu item in analytics events
169
+ */
170
+ key?: string;
171
+ label: string;
165
172
  };
166
173
  /**
167
174
  * Fields for a dropdown item (i.e., an item that does not have further nested menu items)
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-extension",
3
- "version": "10.0.6",
3
+ "version": "10.1.0",
4
4
  "description": "editor-plugin-selection-extension plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -53,7 +53,7 @@
53
53
  "@atlaskit/platform-feature-flags": "^1.1.0",
54
54
  "@atlaskit/platform-feature-flags-react": "^0.4.0",
55
55
  "@atlaskit/primitives": "^17.0.0",
56
- "@atlaskit/tmp-editor-statsig": "^16.15.0",
56
+ "@atlaskit/tmp-editor-statsig": "^16.19.0",
57
57
  "@atlaskit/tokens": "^9.1.0",
58
58
  "@babel/runtime": "^7.0.0",
59
59
  "lodash": "^4.17.21",
@@ -61,7 +61,7 @@
61
61
  "uuid": "^3.1.0"
62
62
  },
63
63
  "peerDependencies": {
64
- "@atlaskit/editor-common": "^111.7.0",
64
+ "@atlaskit/editor-common": "^111.8.0",
65
65
  "react": "^18.2.0"
66
66
  },
67
67
  "devDependencies": {