@atlaskit/editor-plugin-selection-toolbar 1.10.0 → 2.0.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 CHANGED
@@ -1,5 +1,31 @@
1
1
  # @atlaskit/editor-plugin-selection-toolbar
2
2
 
3
+ ## 2.0.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#118657](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/118657)
8
+ [`849aa409da86d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/849aa409da86d) -
9
+ [ux] ED-26673 Toolbar overflow menu shows active docking preference
10
+
11
+ ## 2.0.0
12
+
13
+ ### Major Changes
14
+
15
+ - [#117363](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/117363)
16
+ [`10a0f7f6c2027`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/10a0f7f6c2027) -
17
+ This package's `peerDependencies` have been adjusted for `react` and/or `react-dom` to reflect the
18
+ status of only supporting React 18 going forward. No explicit breaking change to React support has
19
+ been made in this release, but this is to signify going forward, breaking changes for React 16 or
20
+ React 17 may come via non-major semver releases.
21
+
22
+ Please refer this community post for more details:
23
+ https://community.developer.atlassian.com/t/rfc-78-dropping-support-for-react-16-and-rendering-in-a-react-18-concurrent-root-in-jira-and-confluence/87026
24
+
25
+ ### Patch Changes
26
+
27
+ - Updated dependencies
28
+
3
29
  ## 1.10.0
4
30
 
5
31
  ### Minor Changes
@@ -66,14 +66,12 @@ function PrimaryToolbarComponent(_ref) {
66
66
  "aria-haspopup": "dialog",
67
67
  "aria-keyshortcuts": (0, _keymaps.getAriaKeyshortcuts)(_keymaps.addLink),
68
68
  "aria-label": content,
69
- testId: content,
70
- spacing: "default",
71
69
  title: content
72
70
  // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
73
71
  ,
74
72
  css: buttonStyles
75
73
  }, (0, _react2.jsx)(_showMoreHorizontal.default, {
76
- label: "Show more items"
74
+ label: content
77
75
  })));
78
76
  }
79
77
  var buttonStyles = (0, _react2.css)({
@@ -1,10 +1,12 @@
1
1
  "use strict";
2
2
 
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
6
7
  exports.getOverflowPrimaryToolbarConfig = exports.getOverflowFloatingToolbarConfig = void 0;
7
8
  var _react = require("@emotion/react");
9
+ var _checkMark = _interopRequireDefault(require("@atlaskit/icon/utility/check-mark"));
8
10
  var _menu = require("@atlaskit/menu");
9
11
  var _ContextualToolbarIcon = require("./icons/ContextualToolbarIcon");
10
12
  var _FixedToolbarIcon = require("./icons/FixedToolbarIcon");
@@ -23,18 +25,20 @@ var getOverflowFloatingToolbarConfig = exports.getOverflowFloatingToolbarConfig
23
25
  }, {
24
26
  type: 'overflow-dropdown',
25
27
  options: [{
26
- type: 'separator'
27
- }, {
28
28
  type: 'overflow-dropdown-heading',
29
- title: 'Toolbar position'
29
+ title: 'Toolbar appears'
30
30
  }, {
31
- title: 'Contextual',
31
+ title: 'In-line with text',
32
32
  onClick: function onClick() {
33
33
  var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
34
34
  return (_api$selectionToolbar = api === null || api === void 0 || (_api$selectionToolbar2 = api.selectionToolbar.actions) === null || _api$selectionToolbar2 === void 0 || (_api$selectionToolbar3 = _api$selectionToolbar2.setToolbarDocking) === null || _api$selectionToolbar3 === void 0 ? void 0 : _api$selectionToolbar3.call(_api$selectionToolbar2, 'none')) !== null && _api$selectionToolbar !== void 0 ? _api$selectionToolbar : false;
35
35
  },
36
36
  icon: (0, _react.jsx)(_ContextualToolbarIcon.ContextualToolbarIcon, {
37
37
  label: "Contextual toolbar"
38
+ }),
39
+ selected: true,
40
+ elemAfter: (0, _react.jsx)(_checkMark.default, {
41
+ label: ""
38
42
  })
39
43
  }, {
40
44
  title: 'Fixed at top',
@@ -52,24 +56,23 @@ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig =
52
56
  var api = _ref2.api;
53
57
  return [{
54
58
  items: [{
55
- content:
56
- // eslint-disable-next-line @atlaskit/design-system/use-primitives
57
- (0, _react.jsx)("div", {
58
- css: headingContainerStyles
59
- }, (0, _react.jsx)(_menu.HeadingItem, null, "Toolbar position")),
59
+ content: (0, _react.jsx)(_menu.HeadingItem, null, "Toolbar appears"),
60
60
  value: {
61
61
  name: ''
62
62
  },
63
63
  isDisabled: true
64
64
  }, {
65
- content: 'Contextual',
65
+ content: 'In-line with text',
66
66
  value: {
67
67
  name: 'contextual'
68
68
  },
69
69
  onClick: function onClick() {
70
70
  var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
71
71
  return (_api$selectionToolbar7 = api === null || api === void 0 || (_api$selectionToolbar8 = api.selectionToolbar.actions) === null || _api$selectionToolbar8 === void 0 || (_api$selectionToolbar9 = _api$selectionToolbar8.setToolbarDocking) === null || _api$selectionToolbar9 === void 0 ? void 0 : _api$selectionToolbar9.call(_api$selectionToolbar8, 'none')) !== null && _api$selectionToolbar7 !== void 0 ? _api$selectionToolbar7 : false;
72
- }
72
+ },
73
+ elemBefore: (0, _react.jsx)(_ContextualToolbarIcon.ContextualToolbarIcon, {
74
+ label: "Contextual toolbar"
75
+ })
73
76
  }, {
74
77
  content: 'Fixed at top',
75
78
  value: {
@@ -78,11 +81,14 @@ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig =
78
81
  onClick: function onClick() {
79
82
  var _api$selectionToolbar10, _api$selectionToolbar11, _api$selectionToolbar12;
80
83
  return (_api$selectionToolbar10 = api === null || api === void 0 || (_api$selectionToolbar11 = api.selectionToolbar.actions) === null || _api$selectionToolbar11 === void 0 || (_api$selectionToolbar12 = _api$selectionToolbar11.setToolbarDocking) === null || _api$selectionToolbar12 === void 0 ? void 0 : _api$selectionToolbar12.call(_api$selectionToolbar11, 'top')) !== null && _api$selectionToolbar10 !== void 0 ? _api$selectionToolbar10 : false;
81
- }
84
+ },
85
+ isActive: true,
86
+ elemBefore: (0, _react.jsx)(_FixedToolbarIcon.FixedToolbarIcon, {
87
+ label: "Fixed toolbar"
88
+ }),
89
+ elemAfter: (0, _react.jsx)(_checkMark.default, {
90
+ label: ""
91
+ })
82
92
  }]
83
93
  }];
84
- };
85
- var headingContainerStyles = (0, _react.css)({
86
- padding: "var(--ds-space-100, 8px)".concat(" 0"),
87
- margin: "var(--ds-space-negative-100, -8px)".concat(" 0")
88
- });
94
+ };
@@ -51,14 +51,12 @@ export function PrimaryToolbarComponent({
51
51
  "aria-haspopup": "dialog",
52
52
  "aria-keyshortcuts": getAriaKeyshortcuts(addLink),
53
53
  "aria-label": content,
54
- testId: content,
55
- spacing: "default",
56
54
  title: content
57
55
  // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
58
56
  ,
59
57
  css: buttonStyles
60
58
  }, jsx(ShowMoreHorizontalIcon, {
61
- label: "Show more items"
59
+ label: content
62
60
  })));
63
61
  }
64
62
  const buttonStyles = css({
@@ -3,8 +3,9 @@
3
3
  * @jsx jsx
4
4
  * @jsxFrag
5
5
  */
6
- import { css, jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
6
+ import { jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
7
7
 
8
+ import CheckMarkIcon from '@atlaskit/icon/utility/check-mark';
8
9
  import { HeadingItem } from '@atlaskit/menu';
9
10
  import { ContextualToolbarIcon } from './icons/ContextualToolbarIcon';
10
11
  import { FixedToolbarIcon } from './icons/FixedToolbarIcon';
@@ -16,18 +17,20 @@ export const getOverflowFloatingToolbarConfig = ({
16
17
  }, {
17
18
  type: 'overflow-dropdown',
18
19
  options: [{
19
- type: 'separator'
20
- }, {
21
20
  type: 'overflow-dropdown-heading',
22
- title: 'Toolbar position'
21
+ title: 'Toolbar appears'
23
22
  }, {
24
- title: 'Contextual',
23
+ title: 'In-line with text',
25
24
  onClick: () => {
26
25
  var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
27
26
  return (_api$selectionToolbar = api === null || api === void 0 ? void 0 : (_api$selectionToolbar2 = api.selectionToolbar.actions) === null || _api$selectionToolbar2 === void 0 ? void 0 : (_api$selectionToolbar3 = _api$selectionToolbar2.setToolbarDocking) === null || _api$selectionToolbar3 === void 0 ? void 0 : _api$selectionToolbar3.call(_api$selectionToolbar2, 'none')) !== null && _api$selectionToolbar !== void 0 ? _api$selectionToolbar : false;
28
27
  },
29
28
  icon: jsx(ContextualToolbarIcon, {
30
29
  label: "Contextual toolbar"
30
+ }),
31
+ selected: true,
32
+ elemAfter: jsx(CheckMarkIcon, {
33
+ label: ""
31
34
  })
32
35
  }, {
33
36
  title: 'Fixed at top',
@@ -44,24 +47,23 @@ export const getOverflowPrimaryToolbarConfig = ({
44
47
  api
45
48
  }) => [{
46
49
  items: [{
47
- content:
48
- // eslint-disable-next-line @atlaskit/design-system/use-primitives
49
- jsx("div", {
50
- css: headingContainerStyles
51
- }, jsx(HeadingItem, null, "Toolbar position")),
50
+ content: jsx(HeadingItem, null, "Toolbar appears"),
52
51
  value: {
53
52
  name: ''
54
53
  },
55
54
  isDisabled: true
56
55
  }, {
57
- content: 'Contextual',
56
+ content: 'In-line with text',
58
57
  value: {
59
58
  name: 'contextual'
60
59
  },
61
60
  onClick: () => {
62
61
  var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
63
62
  return (_api$selectionToolbar7 = api === null || api === void 0 ? void 0 : (_api$selectionToolbar8 = api.selectionToolbar.actions) === null || _api$selectionToolbar8 === void 0 ? void 0 : (_api$selectionToolbar9 = _api$selectionToolbar8.setToolbarDocking) === null || _api$selectionToolbar9 === void 0 ? void 0 : _api$selectionToolbar9.call(_api$selectionToolbar8, 'none')) !== null && _api$selectionToolbar7 !== void 0 ? _api$selectionToolbar7 : false;
64
- }
63
+ },
64
+ elemBefore: jsx(ContextualToolbarIcon, {
65
+ label: "Contextual toolbar"
66
+ })
65
67
  }, {
66
68
  content: 'Fixed at top',
67
69
  value: {
@@ -70,10 +72,13 @@ export const getOverflowPrimaryToolbarConfig = ({
70
72
  onClick: () => {
71
73
  var _api$selectionToolbar10, _api$selectionToolbar11, _api$selectionToolbar12;
72
74
  return (_api$selectionToolbar10 = api === null || api === void 0 ? void 0 : (_api$selectionToolbar11 = api.selectionToolbar.actions) === null || _api$selectionToolbar11 === void 0 ? void 0 : (_api$selectionToolbar12 = _api$selectionToolbar11.setToolbarDocking) === null || _api$selectionToolbar12 === void 0 ? void 0 : _api$selectionToolbar12.call(_api$selectionToolbar11, 'top')) !== null && _api$selectionToolbar10 !== void 0 ? _api$selectionToolbar10 : false;
73
- }
75
+ },
76
+ isActive: true,
77
+ elemBefore: jsx(FixedToolbarIcon, {
78
+ label: "Fixed toolbar"
79
+ }),
80
+ elemAfter: jsx(CheckMarkIcon, {
81
+ label: ""
82
+ })
74
83
  }]
75
- }];
76
- const headingContainerStyles = css({
77
- padding: `${"var(--ds-space-100, 8px)"} 0`,
78
- margin: `${"var(--ds-space-negative-100, -8px)"} 0`
79
- });
84
+ }];
@@ -57,14 +57,12 @@ export function PrimaryToolbarComponent(_ref) {
57
57
  "aria-haspopup": "dialog",
58
58
  "aria-keyshortcuts": getAriaKeyshortcuts(addLink),
59
59
  "aria-label": content,
60
- testId: content,
61
- spacing: "default",
62
60
  title: content
63
61
  // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
64
62
  ,
65
63
  css: buttonStyles
66
64
  }, jsx(ShowMoreHorizontalIcon, {
67
- label: "Show more items"
65
+ label: content
68
66
  })));
69
67
  }
70
68
  var buttonStyles = css({
@@ -3,8 +3,9 @@
3
3
  * @jsx jsx
4
4
  * @jsxFrag
5
5
  */
6
- import { css, jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
6
+ import { jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
7
7
 
8
+ import CheckMarkIcon from '@atlaskit/icon/utility/check-mark';
8
9
  import { HeadingItem } from '@atlaskit/menu';
9
10
  import { ContextualToolbarIcon } from './icons/ContextualToolbarIcon';
10
11
  import { FixedToolbarIcon } from './icons/FixedToolbarIcon';
@@ -16,18 +17,20 @@ export var getOverflowFloatingToolbarConfig = function getOverflowFloatingToolba
16
17
  }, {
17
18
  type: 'overflow-dropdown',
18
19
  options: [{
19
- type: 'separator'
20
- }, {
21
20
  type: 'overflow-dropdown-heading',
22
- title: 'Toolbar position'
21
+ title: 'Toolbar appears'
23
22
  }, {
24
- title: 'Contextual',
23
+ title: 'In-line with text',
25
24
  onClick: function onClick() {
26
25
  var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
27
26
  return (_api$selectionToolbar = api === null || api === void 0 || (_api$selectionToolbar2 = api.selectionToolbar.actions) === null || _api$selectionToolbar2 === void 0 || (_api$selectionToolbar3 = _api$selectionToolbar2.setToolbarDocking) === null || _api$selectionToolbar3 === void 0 ? void 0 : _api$selectionToolbar3.call(_api$selectionToolbar2, 'none')) !== null && _api$selectionToolbar !== void 0 ? _api$selectionToolbar : false;
28
27
  },
29
28
  icon: jsx(ContextualToolbarIcon, {
30
29
  label: "Contextual toolbar"
30
+ }),
31
+ selected: true,
32
+ elemAfter: jsx(CheckMarkIcon, {
33
+ label: ""
31
34
  })
32
35
  }, {
33
36
  title: 'Fixed at top',
@@ -45,24 +48,23 @@ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarC
45
48
  var api = _ref2.api;
46
49
  return [{
47
50
  items: [{
48
- content:
49
- // eslint-disable-next-line @atlaskit/design-system/use-primitives
50
- jsx("div", {
51
- css: headingContainerStyles
52
- }, jsx(HeadingItem, null, "Toolbar position")),
51
+ content: jsx(HeadingItem, null, "Toolbar appears"),
53
52
  value: {
54
53
  name: ''
55
54
  },
56
55
  isDisabled: true
57
56
  }, {
58
- content: 'Contextual',
57
+ content: 'In-line with text',
59
58
  value: {
60
59
  name: 'contextual'
61
60
  },
62
61
  onClick: function onClick() {
63
62
  var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
64
63
  return (_api$selectionToolbar7 = api === null || api === void 0 || (_api$selectionToolbar8 = api.selectionToolbar.actions) === null || _api$selectionToolbar8 === void 0 || (_api$selectionToolbar9 = _api$selectionToolbar8.setToolbarDocking) === null || _api$selectionToolbar9 === void 0 ? void 0 : _api$selectionToolbar9.call(_api$selectionToolbar8, 'none')) !== null && _api$selectionToolbar7 !== void 0 ? _api$selectionToolbar7 : false;
65
- }
64
+ },
65
+ elemBefore: jsx(ContextualToolbarIcon, {
66
+ label: "Contextual toolbar"
67
+ })
66
68
  }, {
67
69
  content: 'Fixed at top',
68
70
  value: {
@@ -71,11 +73,14 @@ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarC
71
73
  onClick: function onClick() {
72
74
  var _api$selectionToolbar10, _api$selectionToolbar11, _api$selectionToolbar12;
73
75
  return (_api$selectionToolbar10 = api === null || api === void 0 || (_api$selectionToolbar11 = api.selectionToolbar.actions) === null || _api$selectionToolbar11 === void 0 || (_api$selectionToolbar12 = _api$selectionToolbar11.setToolbarDocking) === null || _api$selectionToolbar12 === void 0 ? void 0 : _api$selectionToolbar12.call(_api$selectionToolbar11, 'top')) !== null && _api$selectionToolbar10 !== void 0 ? _api$selectionToolbar10 : false;
74
- }
76
+ },
77
+ isActive: true,
78
+ elemBefore: jsx(FixedToolbarIcon, {
79
+ label: "Fixed toolbar"
80
+ }),
81
+ elemAfter: jsx(CheckMarkIcon, {
82
+ label: ""
83
+ })
75
84
  }]
76
85
  }];
77
- };
78
- var headingContainerStyles = css({
79
- padding: "var(--ds-space-100, 8px)".concat(" 0"),
80
- margin: "var(--ds-space-negative-100, -8px)".concat(" 0")
81
- });
86
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-toolbar",
3
- "version": "1.10.0",
3
+ "version": "2.0.1",
4
4
  "description": "@atlaskit/editor-plugin-selection-toolbar for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -31,18 +31,18 @@
31
31
  ".": "./src/index.ts"
32
32
  },
33
33
  "dependencies": {
34
- "@atlaskit/editor-common": "^99.19.0",
35
- "@atlaskit/editor-plugin-editor-viewmode": "^2.2.0",
36
- "@atlaskit/editor-plugin-primary-toolbar": "^2.4.0",
34
+ "@atlaskit/editor-common": "^100.1.0",
35
+ "@atlaskit/editor-plugin-editor-viewmode": "^3.0.0",
36
+ "@atlaskit/editor-plugin-primary-toolbar": "^3.0.0",
37
37
  "@atlaskit/editor-prosemirror": "7.0.0",
38
38
  "@atlaskit/platform-feature-flags": "^1.1.0",
39
- "@atlaskit/tmp-editor-statsig": "^2.47.0",
39
+ "@atlaskit/tmp-editor-statsig": "^3.2.0",
40
40
  "@babel/runtime": "^7.0.0",
41
41
  "bind-event-listener": "^3.0.0"
42
42
  },
43
43
  "peerDependencies": {
44
- "react": "^16.8.0 || ^17.0.0 || ~18.2.0",
45
- "react-dom": "^16.8.0 || ^17.0.0 || ^18.2.0"
44
+ "react": "^18.2.0",
45
+ "react-dom": "^18.2.0"
46
46
  },
47
47
  "devDependencies": {
48
48
  "@af/visual-regression": "*",