@atlaskit/editor-plugin-selection-extension 3.5.0 → 3.5.1
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 +8 -0
- package/dist/cjs/ui/LegacyToolbarComponent.js +24 -18
- package/dist/cjs/ui/extensions.js +12 -9
- package/dist/cjs/ui/getBoundingBoxFromSelection.js +1 -1
- package/dist/es2019/ui/LegacyToolbarComponent.js +23 -19
- package/dist/es2019/ui/extensions.js +10 -7
- package/dist/es2019/ui/getBoundingBoxFromSelection.js +1 -1
- package/dist/esm/ui/LegacyToolbarComponent.js +24 -18
- package/dist/esm/ui/extensions.js +12 -9
- package/dist/esm/ui/getBoundingBoxFromSelection.js +1 -1
- package/dist/types/types/index.d.ts +16 -2
- package/dist/types/ui/getBoundingBoxFromSelection.d.ts +1 -1
- package/dist/types-ts4.5/types/index.d.ts +16 -2
- package/dist/types-ts4.5/ui/getBoundingBoxFromSelection.d.ts +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
# @atlaskit/editor-plugin-selection-extension
|
|
2
2
|
|
|
3
|
+
## 3.5.1
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- [`364b31a9e1f44`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/364b31a9e1f44) -
|
|
8
|
+
Extend the extension configuration type to support grouping
|
|
9
|
+
- Updated dependencies
|
|
10
|
+
|
|
3
11
|
## 3.5.0
|
|
4
12
|
|
|
5
13
|
### 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
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
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
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
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
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
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
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
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
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
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
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
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
|
-
|
|
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
|
-
|
|
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.
|
|
3
|
+
"version": "3.5.1",
|
|
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.
|
|
39
|
+
"@atlaskit/editor-json-transformer": "^8.26.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",
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
"uuid": "^3.1.0"
|
|
56
56
|
},
|
|
57
57
|
"peerDependencies": {
|
|
58
|
-
"@atlaskit/editor-common": "^107.
|
|
58
|
+
"@atlaskit/editor-common": "^107.26.0",
|
|
59
59
|
"react": "^18.2.0"
|
|
60
60
|
},
|
|
61
61
|
"devDependencies": {
|