@atlaskit/editor-plugin-toolbar 0.2.1 → 0.2.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,22 @@
1
1
  # @atlaskit/editor-plugin-toolbar
2
2
 
3
+ ## 0.2.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [`3145f278b1f7a`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/3145f278b1f7a) -
8
+ [ux] [ED-28473] minor UI updates for editor-toolbar
9
+
10
+ - Use ADS ButtonGroup for ToolbarButtonGroup
11
+ - Remove groupLocation prop and use CSS instead
12
+ - Use DropdownItemGroup for ToolbarDropdownItemSection and expand props for section separator and
13
+ title
14
+ - Support ReactNode as content for ToolbarTooltip and add missing shortcuts in tooltips
15
+ - Center Icons for split buttons and make chevron icon 24px wide
16
+ - Align dropdown menu UI with current editor design
17
+
18
+ - Updated dependencies
19
+
3
20
  ## 0.2.1
4
21
 
5
22
  ### Patch Changes
@@ -24,10 +24,12 @@ var toolbarPlugin = exports.toolbarPlugin = function toolbarPlugin(_ref) {
24
24
  }
25
25
  },
26
26
  contentComponent: function contentComponent(_ref2) {
27
- var editorView = _ref2.editorView;
27
+ var editorView = _ref2.editorView,
28
+ popupsMountPoint = _ref2.popupsMountPoint;
28
29
  return /*#__PURE__*/_react.default.createElement(_SelectionToolbar.SelectionToolbar, {
29
30
  api: api,
30
- editorView: editorView
31
+ editorView: editorView,
32
+ mountPoint: popupsMountPoint
31
33
  });
32
34
  }
33
35
  };
@@ -21,7 +21,8 @@ var isToolbarComponent = function isToolbarComponent(component) {
21
21
  };
22
22
  var SelectionToolbar = exports.SelectionToolbar = function SelectionToolbar(_ref) {
23
23
  var api = _ref.api,
24
- editorView = _ref.editorView;
24
+ editorView = _ref.editorView,
25
+ mountPoint = _ref.mountPoint;
25
26
  var components = api === null || api === void 0 ? void 0 : api.toolbar.actions.getComponents();
26
27
  var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
27
28
  return isToolbarComponent(component);
@@ -42,7 +43,8 @@ var SelectionToolbar = exports.SelectionToolbar = function SelectionToolbar(_ref
42
43
  target: getDomRefFromSelection(editorView),
43
44
  onPositionCalculated: function onPositionCalculated(position) {
44
45
  return (0, _utils.calculateToolbarPositionTrackHead)(_consts.TOOLBAR_LABEL)(editorView, position);
45
- }
46
+ },
47
+ mountTo: mountPoint
46
48
  }, /*#__PURE__*/_react.default.createElement(_toolbar.EditorToolbarProvider, {
47
49
  editorView: editorView
48
50
  }, /*#__PURE__*/_react.default.createElement(_toolbar.EditorToolbarUIProvider, {
@@ -18,11 +18,13 @@ export const toolbarPlugin = ({
18
18
  }
19
19
  },
20
20
  contentComponent: ({
21
- editorView
21
+ editorView,
22
+ popupsMountPoint
22
23
  }) => {
23
24
  return /*#__PURE__*/React.createElement(SelectionToolbar, {
24
25
  api: api,
25
- editorView: editorView
26
+ editorView: editorView,
27
+ mountPoint: popupsMountPoint
26
28
  });
27
29
  }
28
30
  };
@@ -14,7 +14,8 @@ const isToolbarComponent = component => {
14
14
  };
15
15
  export const SelectionToolbar = ({
16
16
  api,
17
- editorView
17
+ editorView,
18
+ mountPoint
18
19
  }) => {
19
20
  const components = api === null || api === void 0 ? void 0 : api.toolbar.actions.getComponents();
20
21
  const toolbar = components === null || components === void 0 ? void 0 : components.find(component => isToolbarComponent(component));
@@ -32,7 +33,8 @@ export const SelectionToolbar = ({
32
33
  return /*#__PURE__*/React.createElement(Popup, {
33
34
  offset: [0, 10],
34
35
  target: getDomRefFromSelection(editorView),
35
- onPositionCalculated: position => calculateToolbarPositionTrackHead(TOOLBAR_LABEL)(editorView, position)
36
+ onPositionCalculated: position => calculateToolbarPositionTrackHead(TOOLBAR_LABEL)(editorView, position),
37
+ mountTo: mountPoint
36
38
  }, /*#__PURE__*/React.createElement(EditorToolbarProvider, {
37
39
  editorView: editorView
38
40
  }, /*#__PURE__*/React.createElement(EditorToolbarUIProvider, {
@@ -17,10 +17,12 @@ export var toolbarPlugin = function toolbarPlugin(_ref) {
17
17
  }
18
18
  },
19
19
  contentComponent: function contentComponent(_ref2) {
20
- var editorView = _ref2.editorView;
20
+ var editorView = _ref2.editorView,
21
+ popupsMountPoint = _ref2.popupsMountPoint;
21
22
  return /*#__PURE__*/React.createElement(SelectionToolbar, {
22
23
  api: api,
23
- editorView: editorView
24
+ editorView: editorView,
25
+ mountPoint: popupsMountPoint
24
26
  });
25
27
  }
26
28
  };
@@ -14,7 +14,8 @@ var isToolbarComponent = function isToolbarComponent(component) {
14
14
  };
15
15
  export var SelectionToolbar = function SelectionToolbar(_ref) {
16
16
  var api = _ref.api,
17
- editorView = _ref.editorView;
17
+ editorView = _ref.editorView,
18
+ mountPoint = _ref.mountPoint;
18
19
  var components = api === null || api === void 0 ? void 0 : api.toolbar.actions.getComponents();
19
20
  var toolbar = components === null || components === void 0 ? void 0 : components.find(function (component) {
20
21
  return isToolbarComponent(component);
@@ -35,7 +36,8 @@ export var SelectionToolbar = function SelectionToolbar(_ref) {
35
36
  target: getDomRefFromSelection(editorView),
36
37
  onPositionCalculated: function onPositionCalculated(position) {
37
38
  return calculateToolbarPositionTrackHead(TOOLBAR_LABEL)(editorView, position);
38
- }
39
+ },
40
+ mountTo: mountPoint
39
41
  }, /*#__PURE__*/React.createElement(EditorToolbarProvider, {
40
42
  editorView: editorView
41
43
  }, /*#__PURE__*/React.createElement(EditorToolbarUIProvider, {
@@ -5,6 +5,7 @@ import type { ToolbarPlugin } from '../../toolbarPluginType';
5
5
  type SelectionToolbarProps = {
6
6
  editorView: EditorView;
7
7
  api?: ExtractInjectionAPI<ToolbarPlugin>;
8
+ mountPoint: HTMLElement | undefined;
8
9
  };
9
- export declare const SelectionToolbar: ({ api, editorView }: SelectionToolbarProps) => React.JSX.Element | null;
10
+ export declare const SelectionToolbar: ({ api, editorView, mountPoint }: SelectionToolbarProps) => React.JSX.Element | null;
10
11
  export {};
@@ -5,6 +5,7 @@ import type { ToolbarPlugin } from '../../toolbarPluginType';
5
5
  type SelectionToolbarProps = {
6
6
  editorView: EditorView;
7
7
  api?: ExtractInjectionAPI<ToolbarPlugin>;
8
+ mountPoint: HTMLElement | undefined;
8
9
  };
9
- export declare const SelectionToolbar: ({ api, editorView }: SelectionToolbarProps) => React.JSX.Element | null;
10
+ export declare const SelectionToolbar: ({ api, editorView, mountPoint }: SelectionToolbarProps) => React.JSX.Element | null;
10
11
  export {};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-toolbar",
3
- "version": "0.2.1",
3
+ "version": "0.2.2",
4
4
  "description": "Toolbar plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -42,7 +42,7 @@
42
42
  "react-intl-next": "npm:react-intl@^5.18.1"
43
43
  },
44
44
  "peerDependencies": {
45
- "@atlaskit/editor-common": "^107.23.0",
45
+ "@atlaskit/editor-common": "^107.24.0",
46
46
  "react": "^18.2.0"
47
47
  },
48
48
  "techstack": {