@atlaskit/editor-plugin-selection-extension 3.5.0 → 3.5.2

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-selection-extension
2
2
 
3
+ ## 3.5.2
4
+
5
+ ### Patch Changes
6
+
7
+ - Updated dependencies
8
+
9
+ ## 3.5.1
10
+
11
+ ### Patch Changes
12
+
13
+ - [`364b31a9e1f44`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/364b31a9e1f44) -
14
+ Extend the extension configuration type to support grouping
15
+ - Updated dependencies
16
+
3
17
  ## 3.5.0
4
18
 
5
19
  ### Minor Changes
@@ -73,24 +73,30 @@ var LegacyExtensionToolbarItem = exports.LegacyExtensionToolbarItem = function L
73
73
  setIsOpen(!!(attrs !== null && attrs !== void 0 && attrs.isOpen));
74
74
  };
75
75
  var items = isOpen ? getMenuItems().map(function (menuItem, i) {
76
- return {
77
- key: "menu-item-".concat(i),
78
- content: menuItem.label,
79
- elemBefore: /*#__PURE__*/_react.default.createElement(menuItem.icon, {
80
- label: menuItem.label
81
- }),
82
- onClick: function onClick() {
83
- var _menuItem$onClick;
84
- (_menuItem$onClick = menuItem.onClick) === null || _menuItem$onClick === void 0 || _menuItem$onClick.call(menuItem);
85
- // NEXT PR: here we need to set the active extension so the contentComponent can render
86
- // menuItem.contentComponent
87
- },
88
- isDisabled: menuItem.isDisabled,
89
- 'aria-label': menuItem.label,
90
- value: {
91
- name: menuItem.label
92
- }
93
- };
76
+ // Only process ExtensionMenuItemConfiguration, skip ExtensionMenuSectionConfiguration
77
+ if ('label' in menuItem && 'icon' in menuItem) {
78
+ return {
79
+ key: "menu-item-".concat(i),
80
+ content: menuItem.label,
81
+ elemBefore: /*#__PURE__*/_react.default.createElement(menuItem.icon, {
82
+ label: menuItem.label
83
+ }),
84
+ onClick: function onClick() {
85
+ var _menuItem$onClick;
86
+ (_menuItem$onClick = menuItem.onClick) === null || _menuItem$onClick === void 0 || _menuItem$onClick.call(menuItem);
87
+ // NEXT PR: here we need to set the active extension so the contentComponent can render
88
+ // menuItem.contentComponent
89
+ },
90
+ isDisabled: menuItem.isDisabled,
91
+ 'aria-label': menuItem.label,
92
+ value: {
93
+ name: menuItem.label
94
+ }
95
+ };
96
+ }
97
+ return undefined;
98
+ }).filter(function (item) {
99
+ return item !== undefined;
94
100
  }) : [];
95
101
  return /*#__PURE__*/_react.default.createElement(_uiMenu.DropdownMenuWithKeyboardNavigation, {
96
102
  arrowKeyNavigationProviderOptions: {
@@ -44,15 +44,18 @@ var getMenuItemExtensions = exports.getMenuItemExtensions = function getMenuItem
44
44
  if (source === targetSource && inlineToolbar !== null && inlineToolbar !== void 0 && inlineToolbar.getMenuItems && !inlineToolbar.getToolbarItem) {
45
45
  var menuItems = inlineToolbar.getMenuItems();
46
46
  menuItems.forEach(function (menuItem) {
47
- acc.push({
48
- name: menuItem.label,
49
- icon: menuItem.icon,
50
- onClick: menuItem.onClick,
51
- isDisabled: function isDisabled() {
52
- return !!menuItem.isDisabled;
53
- },
54
- component: menuItem.contentComponent
55
- });
47
+ // Only process ExtensionMenuItemConfiguration, skip ExtensionMenuSectionConfiguration
48
+ if ('label' in menuItem && 'icon' in menuItem) {
49
+ acc.push({
50
+ name: menuItem.label,
51
+ icon: menuItem.icon,
52
+ onClick: menuItem.onClick,
53
+ isDisabled: function isDisabled() {
54
+ return !!menuItem.isDisabled;
55
+ },
56
+ component: menuItem.contentComponent
57
+ });
58
+ }
56
59
  });
57
60
  }
58
61
  return acc;
@@ -10,7 +10,7 @@ exports.getBoundingBoxFromSelection = void 0;
10
10
  * @param view - The editor view instance.
11
11
  * @param from - The starting position of the selection.
12
12
  * @param to - The ending position of the selection.
13
- * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.`
13
+ * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.
14
14
  * @returns An object containing the top, left, bottom, and right coordinates of the bounding box.
15
15
  */
16
16
  var getBoundingBoxFromSelection = exports.getBoundingBoxFromSelection = function getBoundingBoxFromSelection(view, from, to) {
@@ -62,25 +62,29 @@ export const LegacyExtensionToolbarItem = ({
62
62
  setIsOpen(!!(attrs !== null && attrs !== void 0 && attrs.isOpen));
63
63
  };
64
64
  const items = isOpen ? getMenuItems().map((menuItem, i) => {
65
- return {
66
- key: `menu-item-${i}`,
67
- content: menuItem.label,
68
- elemBefore: /*#__PURE__*/React.createElement(menuItem.icon, {
69
- label: menuItem.label
70
- }),
71
- onClick: () => {
72
- var _menuItem$onClick;
73
- (_menuItem$onClick = menuItem.onClick) === null || _menuItem$onClick === void 0 ? void 0 : _menuItem$onClick.call(menuItem);
74
- // NEXT PR: here we need to set the active extension so the contentComponent can render
75
- // menuItem.contentComponent
76
- },
77
- isDisabled: menuItem.isDisabled,
78
- 'aria-label': menuItem.label,
79
- value: {
80
- name: menuItem.label
81
- }
82
- };
83
- }) : [];
65
+ // Only process ExtensionMenuItemConfiguration, skip ExtensionMenuSectionConfiguration
66
+ if ('label' in menuItem && 'icon' in menuItem) {
67
+ return {
68
+ key: `menu-item-${i}`,
69
+ content: menuItem.label,
70
+ elemBefore: /*#__PURE__*/React.createElement(menuItem.icon, {
71
+ label: menuItem.label
72
+ }),
73
+ onClick: () => {
74
+ var _menuItem$onClick;
75
+ (_menuItem$onClick = menuItem.onClick) === null || _menuItem$onClick === void 0 ? void 0 : _menuItem$onClick.call(menuItem);
76
+ // NEXT PR: here we need to set the active extension so the contentComponent can render
77
+ // menuItem.contentComponent
78
+ },
79
+ isDisabled: menuItem.isDisabled,
80
+ 'aria-label': menuItem.label,
81
+ value: {
82
+ name: menuItem.label
83
+ }
84
+ };
85
+ }
86
+ return undefined;
87
+ }).filter(item => item !== undefined) : [];
84
88
  return /*#__PURE__*/React.createElement(DropdownMenu, {
85
89
  arrowKeyNavigationProviderOptions: {
86
90
  type: ArrowKeyNavigationType.MENU
@@ -40,13 +40,16 @@ export const getMenuItemExtensions = (extensionList, targetSource) => {
40
40
  if (source === targetSource && inlineToolbar !== null && inlineToolbar !== void 0 && inlineToolbar.getMenuItems && !inlineToolbar.getToolbarItem) {
41
41
  const menuItems = inlineToolbar.getMenuItems();
42
42
  menuItems.forEach(menuItem => {
43
- acc.push({
44
- name: menuItem.label,
45
- icon: menuItem.icon,
46
- onClick: menuItem.onClick,
47
- isDisabled: () => !!menuItem.isDisabled,
48
- component: menuItem.contentComponent
49
- });
43
+ // Only process ExtensionMenuItemConfiguration, skip ExtensionMenuSectionConfiguration
44
+ if ('label' in menuItem && 'icon' in menuItem) {
45
+ acc.push({
46
+ name: menuItem.label,
47
+ icon: menuItem.icon,
48
+ onClick: menuItem.onClick,
49
+ isDisabled: () => !!menuItem.isDisabled,
50
+ component: menuItem.contentComponent
51
+ });
52
+ }
50
53
  });
51
54
  }
52
55
  return acc;
@@ -4,7 +4,7 @@
4
4
  * @param view - The editor view instance.
5
5
  * @param from - The starting position of the selection.
6
6
  * @param to - The ending position of the selection.
7
- * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.`
7
+ * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.
8
8
  * @returns An object containing the top, left, bottom, and right coordinates of the bounding box.
9
9
  */
10
10
  export const getBoundingBoxFromSelection = (view, from, to, offset = {
@@ -64,24 +64,30 @@ export var LegacyExtensionToolbarItem = function LegacyExtensionToolbarItem(_ref
64
64
  setIsOpen(!!(attrs !== null && attrs !== void 0 && attrs.isOpen));
65
65
  };
66
66
  var items = isOpen ? getMenuItems().map(function (menuItem, i) {
67
- return {
68
- key: "menu-item-".concat(i),
69
- content: menuItem.label,
70
- elemBefore: /*#__PURE__*/React.createElement(menuItem.icon, {
71
- label: menuItem.label
72
- }),
73
- onClick: function onClick() {
74
- var _menuItem$onClick;
75
- (_menuItem$onClick = menuItem.onClick) === null || _menuItem$onClick === void 0 || _menuItem$onClick.call(menuItem);
76
- // NEXT PR: here we need to set the active extension so the contentComponent can render
77
- // menuItem.contentComponent
78
- },
79
- isDisabled: menuItem.isDisabled,
80
- 'aria-label': menuItem.label,
81
- value: {
82
- name: menuItem.label
83
- }
84
- };
67
+ // Only process ExtensionMenuItemConfiguration, skip ExtensionMenuSectionConfiguration
68
+ if ('label' in menuItem && 'icon' in menuItem) {
69
+ return {
70
+ key: "menu-item-".concat(i),
71
+ content: menuItem.label,
72
+ elemBefore: /*#__PURE__*/React.createElement(menuItem.icon, {
73
+ label: menuItem.label
74
+ }),
75
+ onClick: function onClick() {
76
+ var _menuItem$onClick;
77
+ (_menuItem$onClick = menuItem.onClick) === null || _menuItem$onClick === void 0 || _menuItem$onClick.call(menuItem);
78
+ // NEXT PR: here we need to set the active extension so the contentComponent can render
79
+ // menuItem.contentComponent
80
+ },
81
+ isDisabled: menuItem.isDisabled,
82
+ 'aria-label': menuItem.label,
83
+ value: {
84
+ name: menuItem.label
85
+ }
86
+ };
87
+ }
88
+ return undefined;
89
+ }).filter(function (item) {
90
+ return item !== undefined;
85
91
  }) : [];
86
92
  return /*#__PURE__*/React.createElement(DropdownMenu, {
87
93
  arrowKeyNavigationProviderOptions: {
@@ -38,15 +38,18 @@ export var getMenuItemExtensions = function getMenuItemExtensions(extensionList,
38
38
  if (source === targetSource && inlineToolbar !== null && inlineToolbar !== void 0 && inlineToolbar.getMenuItems && !inlineToolbar.getToolbarItem) {
39
39
  var menuItems = inlineToolbar.getMenuItems();
40
40
  menuItems.forEach(function (menuItem) {
41
- acc.push({
42
- name: menuItem.label,
43
- icon: menuItem.icon,
44
- onClick: menuItem.onClick,
45
- isDisabled: function isDisabled() {
46
- return !!menuItem.isDisabled;
47
- },
48
- component: menuItem.contentComponent
49
- });
41
+ // Only process ExtensionMenuItemConfiguration, skip ExtensionMenuSectionConfiguration
42
+ if ('label' in menuItem && 'icon' in menuItem) {
43
+ acc.push({
44
+ name: menuItem.label,
45
+ icon: menuItem.icon,
46
+ onClick: menuItem.onClick,
47
+ isDisabled: function isDisabled() {
48
+ return !!menuItem.isDisabled;
49
+ },
50
+ component: menuItem.contentComponent
51
+ });
52
+ }
50
53
  });
51
54
  }
52
55
  return acc;
@@ -4,7 +4,7 @@
4
4
  * @param view - The editor view instance.
5
5
  * @param from - The starting position of the selection.
6
6
  * @param to - The ending position of the selection.
7
- * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.`
7
+ * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.
8
8
  * @returns An object containing the top, left, bottom, and right coordinates of the bounding box.
9
9
  */
10
10
  export var getBoundingBoxFromSelection = function getBoundingBoxFromSelection(view, from, to) {
@@ -134,13 +134,15 @@ export type ExtensionConfiguration = {
134
134
  blockMenu?: BlockMenuExtensionConfiguration;
135
135
  };
136
136
  export type GetToolbarItemFn = () => ExtensionToolbarItemConfiguration;
137
- export type GetMenuItemsFn = () => ExtensionMenuItemConfiguration[];
137
+ export type GetMenuItemsFn = () => Array<ExtensionMenuItemConfiguration | ExtensionMenuSectionConfiguration>;
138
+ export type GetMenuItemFn = () => Omit<ExtensionMenuItemConfiguration, 'section'>;
138
139
  export type ToolbarExtensionConfiguration = {
139
140
  getToolbarItem?: GetToolbarItemFn;
140
141
  getMenuItems?: GetMenuItemsFn;
141
142
  };
142
143
  export type BlockMenuExtensionConfiguration = {
143
- getMenuItems?: GetMenuItemsFn;
144
+ getMenuItem: GetMenuItemFn;
145
+ getNestedMenuItems?: GetMenuItemsFn;
144
146
  };
145
147
  export type ExtensionToolbarItemConfiguration = {
146
148
  icon: React.ComponentType<React.PropsWithChildren<{
@@ -159,5 +161,17 @@ export type ExtensionMenuItemConfiguration = {
159
161
  onClick?: () => void;
160
162
  isDisabled?: boolean;
161
163
  contentComponent?: React.ComponentType<SelectionExtensionComponentProps>;
164
+ /**
165
+ * Optional menu-section to declare grouping - only used for menu items
166
+ */
167
+ section?: {
168
+ key: string;
169
+ rank: number;
170
+ };
171
+ };
172
+ export type ExtensionMenuSectionConfiguration = {
173
+ key: string;
174
+ rank: number;
175
+ title?: string;
162
176
  };
163
177
  export {};
@@ -6,7 +6,7 @@ import type { SelectionExtensionCoords, BoundingBoxOffset } from '../types';
6
6
  * @param view - The editor view instance.
7
7
  * @param from - The starting position of the selection.
8
8
  * @param to - The ending position of the selection.
9
- * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.`
9
+ * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.
10
10
  * @returns An object containing the top, left, bottom, and right coordinates of the bounding box.
11
11
  */
12
12
  export declare const getBoundingBoxFromSelection: (view: EditorView, from: number, to: number, offset?: BoundingBoxOffset) => SelectionExtensionCoords;
@@ -134,13 +134,15 @@ export type ExtensionConfiguration = {
134
134
  blockMenu?: BlockMenuExtensionConfiguration;
135
135
  };
136
136
  export type GetToolbarItemFn = () => ExtensionToolbarItemConfiguration;
137
- export type GetMenuItemsFn = () => ExtensionMenuItemConfiguration[];
137
+ export type GetMenuItemsFn = () => Array<ExtensionMenuItemConfiguration | ExtensionMenuSectionConfiguration>;
138
+ export type GetMenuItemFn = () => Omit<ExtensionMenuItemConfiguration, 'section'>;
138
139
  export type ToolbarExtensionConfiguration = {
139
140
  getToolbarItem?: GetToolbarItemFn;
140
141
  getMenuItems?: GetMenuItemsFn;
141
142
  };
142
143
  export type BlockMenuExtensionConfiguration = {
143
- getMenuItems?: GetMenuItemsFn;
144
+ getMenuItem: GetMenuItemFn;
145
+ getNestedMenuItems?: GetMenuItemsFn;
144
146
  };
145
147
  export type ExtensionToolbarItemConfiguration = {
146
148
  icon: React.ComponentType<React.PropsWithChildren<{
@@ -159,5 +161,17 @@ export type ExtensionMenuItemConfiguration = {
159
161
  onClick?: () => void;
160
162
  isDisabled?: boolean;
161
163
  contentComponent?: React.ComponentType<SelectionExtensionComponentProps>;
164
+ /**
165
+ * Optional menu-section to declare grouping - only used for menu items
166
+ */
167
+ section?: {
168
+ key: string;
169
+ rank: number;
170
+ };
171
+ };
172
+ export type ExtensionMenuSectionConfiguration = {
173
+ key: string;
174
+ rank: number;
175
+ title?: string;
162
176
  };
163
177
  export {};
@@ -6,7 +6,7 @@ import type { SelectionExtensionCoords, BoundingBoxOffset } from '../types';
6
6
  * @param view - The editor view instance.
7
7
  * @param from - The starting position of the selection.
8
8
  * @param to - The ending position of the selection.
9
- * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.`
9
+ * @param offset - Optional offset to adjust the top and bottom coordinates of the bounding box.
10
10
  * @returns An object containing the top, left, bottom, and right coordinates of the bounding box.
11
11
  */
12
12
  export declare const getBoundingBoxFromSelection: (view: EditorView, from: number, to: number, offset?: BoundingBoxOffset) => SelectionExtensionCoords;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-extension",
3
- "version": "3.5.0",
3
+ "version": "3.5.2",
4
4
  "description": "editor-plugin-selection-extension plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -36,7 +36,7 @@
36
36
  },
37
37
  "dependencies": {
38
38
  "@atlaskit/adf-utils": "^19.21.0",
39
- "@atlaskit/editor-json-transformer": "^8.25.0",
39
+ "@atlaskit/editor-json-transformer": "^8.27.0",
40
40
  "@atlaskit/editor-plugin-analytics": "^3.0.0",
41
41
  "@atlaskit/editor-plugin-editor-viewmode": "^5.0.0",
42
42
  "@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
@@ -45,7 +45,7 @@
45
45
  "@atlaskit/editor-prosemirror": "7.0.0",
46
46
  "@atlaskit/editor-shared-styles": "^3.6.0",
47
47
  "@atlaskit/editor-tables": "^2.9.0",
48
- "@atlaskit/icon": "^27.12.0",
48
+ "@atlaskit/icon": "^28.0.0",
49
49
  "@atlaskit/platform-feature-flags": "^1.1.0",
50
50
  "@atlaskit/primitives": "^14.11.0",
51
51
  "@atlaskit/tmp-editor-statsig": "^11.3.0",
@@ -55,7 +55,7 @@
55
55
  "uuid": "^3.1.0"
56
56
  },
57
57
  "peerDependencies": {
58
- "@atlaskit/editor-common": "^107.25.0",
58
+ "@atlaskit/editor-common": "^107.26.0",
59
59
  "react": "^18.2.0"
60
60
  },
61
61
  "devDependencies": {