@atlaskit/editor-plugin-selection-toolbar 2.1.3 → 2.2.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.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # @atlaskit/editor-plugin-selection-toolbar
2
2
 
3
+ ## 2.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#130044](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/130044)
8
+ [`cad348d512cdf`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cad348d512cdf) -
9
+ [ux] ED-26802 contextual formatting configuration
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
3
15
  ## 2.1.3
4
16
 
5
17
  ### Patch Changes
@@ -19,12 +19,20 @@ var _overflowToolbarConfig = require("./ui/overflow-toolbar-config");
19
19
  var _PrimaryToolbarComponent = require("./ui/PrimaryToolbarComponent");
20
20
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
21
21
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
22
+ var getInitialToolbarDocking = function getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
23
+ if (contextualFormattingEnabled && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
24
+ var _userPreferencesProvi;
25
+ return (_userPreferencesProvi = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) !== null && _userPreferencesProvi !== void 0 ? _userPreferencesProvi : 'none';
26
+ }
27
+ return 'top';
28
+ };
22
29
  var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
23
30
  var api = _ref.api,
24
31
  config = _ref.config;
25
32
  var __selectionToolbarHandlers = [];
26
33
  var primaryToolbarComponent;
27
- var userPreferencesProvider = config.userPreferencesProvider;
34
+ var userPreferencesProvider = config.userPreferencesProvider,
35
+ contextualFormattingEnabled = config.contextualFormattingEnabled;
28
36
  if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1', {
29
37
  exposure: true
30
38
  })) {
@@ -85,14 +93,10 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
85
93
  key: _pluginKey.selectionToolbarPluginKey,
86
94
  state: {
87
95
  init: function init() {
88
- var toolbarDocking = 'top';
89
- if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
90
- toolbarDocking = (userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) || 'none';
91
- }
92
96
  return {
93
97
  selectionStable: false,
94
98
  hide: false,
95
- toolbarDocking: toolbarDocking
99
+ toolbarDocking: getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
96
100
  };
97
101
  },
98
102
  apply: function apply(tr, pluginState) {
@@ -221,7 +225,7 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
221
225
  }
222
226
  }
223
227
  }
224
- if (items.length > 0 && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
228
+ if (items.length > 0 && contextualFormattingEnabled && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
225
229
  items.push.apply(items, (0, _toConsumableArray2.default)((0, _overflowToolbarConfig.getOverflowFloatingToolbarConfig)({
226
230
  api: api,
227
231
  toolbarDocking: toolbarDocking
@@ -6,11 +6,11 @@ Object.defineProperty(exports, "__esModule", {
6
6
  });
7
7
  exports.getOverflowPrimaryToolbarConfig = exports.getOverflowFloatingToolbarConfig = void 0;
8
8
  var _react = require("@emotion/react");
9
+ var _dockToolbarTop = _interopRequireDefault(require("@atlaskit/icon-lab/core/dock-toolbar-top"));
10
+ var _minus = _interopRequireDefault(require("@atlaskit/icon/core/minus"));
9
11
  var _checkMark = _interopRequireDefault(require("@atlaskit/icon/utility/check-mark"));
10
12
  var _chevronRight = _interopRequireDefault(require("@atlaskit/icon/utility/migration/chevron-right"));
11
13
  var _menu = require("@atlaskit/menu");
12
- var _ContextualToolbarIcon = require("./icons/ContextualToolbarIcon");
13
- var _FixedToolbarIcon = require("./icons/FixedToolbarIcon");
14
14
  /**
15
15
  * @jsxRuntime classic
16
16
  * @jsx jsx
@@ -56,8 +56,8 @@ var getOverflowFloatingToolbarConfig = exports.getOverflowFloatingToolbarConfig
56
56
  var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
57
57
  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;
58
58
  },
59
- icon: (0, _react.jsx)(_ContextualToolbarIcon.ContextualToolbarIcon, {
60
- label: "Contextual toolbar"
59
+ icon: (0, _minus.default)({
60
+ label: 'Contextual toolbar'
61
61
  }),
62
62
  selected: !isDockedToTop,
63
63
  elemAfter: !isDockedToTop ? (0, _react.jsx)(_checkMark.default, {
@@ -69,8 +69,8 @@ var getOverflowFloatingToolbarConfig = exports.getOverflowFloatingToolbarConfig
69
69
  var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
70
70
  return (_api$selectionToolbar4 = api === null || api === void 0 || (_api$selectionToolbar5 = api.selectionToolbar.actions) === null || _api$selectionToolbar5 === void 0 || (_api$selectionToolbar6 = _api$selectionToolbar5.setToolbarDocking) === null || _api$selectionToolbar6 === void 0 ? void 0 : _api$selectionToolbar6.call(_api$selectionToolbar5, 'top')) !== null && _api$selectionToolbar4 !== void 0 ? _api$selectionToolbar4 : false;
71
71
  },
72
- icon: (0, _react.jsx)(_FixedToolbarIcon.FixedToolbarIcon, {
73
- label: "Fixed toolbar"
72
+ icon: (0, _dockToolbarTop.default)({
73
+ label: 'Fixed toolbar'
74
74
  }),
75
75
  selected: isDockedToTop,
76
76
  elemAfter: isDockedToTop ? (0, _react.jsx)(_checkMark.default, {
@@ -104,8 +104,8 @@ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig =
104
104
  var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
105
105
  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;
106
106
  },
107
- elemBefore: (0, _react.jsx)(_ContextualToolbarIcon.ContextualToolbarIcon, {
108
- label: "Contextual toolbar"
107
+ elemBefore: (0, _minus.default)({
108
+ label: 'Contextual toolbar'
109
109
  })
110
110
  }, {
111
111
  content: 'Fixed at top',
@@ -117,8 +117,8 @@ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig =
117
117
  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;
118
118
  },
119
119
  isActive: true,
120
- elemBefore: (0, _react.jsx)(_FixedToolbarIcon.FixedToolbarIcon, {
121
- label: "Fixed toolbar"
120
+ elemBefore: (0, _dockToolbarTop.default)({
121
+ label: 'Fixed toolbar'
122
122
  }),
123
123
  elemAfter: (0, _react.jsx)(_checkMark.default, {
124
124
  label: ""
@@ -8,6 +8,13 @@ import { setToolbarDocking, toggleToolbar } from './pm-plugins/commands';
8
8
  import { selectionToolbarPluginKey } from './pm-plugins/plugin-key';
9
9
  import { getOverflowFloatingToolbarConfig } from './ui/overflow-toolbar-config';
10
10
  import { PrimaryToolbarComponent } from './ui/PrimaryToolbarComponent';
11
+ const getInitialToolbarDocking = (contextualFormattingEnabled, userPreferencesProvider) => {
12
+ if (contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
13
+ var _userPreferencesProvi;
14
+ return (_userPreferencesProvi = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) !== null && _userPreferencesProvi !== void 0 ? _userPreferencesProvi : 'none';
15
+ }
16
+ return 'top';
17
+ };
11
18
  export const selectionToolbarPlugin = ({
12
19
  api,
13
20
  config
@@ -15,7 +22,8 @@ export const selectionToolbarPlugin = ({
15
22
  const __selectionToolbarHandlers = [];
16
23
  let primaryToolbarComponent;
17
24
  const {
18
- userPreferencesProvider
25
+ userPreferencesProvider,
26
+ contextualFormattingEnabled
19
27
  } = config;
20
28
  if (editorExperiment('platform_editor_controls', 'variant1', {
21
29
  exposure: true
@@ -76,14 +84,10 @@ export const selectionToolbarPlugin = ({
76
84
  key: selectionToolbarPluginKey,
77
85
  state: {
78
86
  init() {
79
- let toolbarDocking = 'top';
80
- if (editorExperiment('platform_editor_controls', 'variant1')) {
81
- toolbarDocking = (userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) || 'none';
82
- }
83
87
  return {
84
88
  selectionStable: false,
85
89
  hide: false,
86
- toolbarDocking
90
+ toolbarDocking: getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
87
91
  };
88
92
  },
89
93
  apply(tr, pluginState) {
@@ -212,7 +216,7 @@ export const selectionToolbarPlugin = ({
212
216
  }
213
217
  }
214
218
  }
215
- if (items.length > 0 && editorExperiment('platform_editor_controls', 'variant1')) {
219
+ if (items.length > 0 && contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
216
220
  items.push(...getOverflowFloatingToolbarConfig({
217
221
  api,
218
222
  toolbarDocking
@@ -5,11 +5,11 @@
5
5
  */
6
6
  import { jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
7
7
 
8
+ import DockToolbarTopIcon from '@atlaskit/icon-lab/core/dock-toolbar-top';
9
+ import MinusIcon from '@atlaskit/icon/core/minus';
8
10
  import CheckMarkIcon from '@atlaskit/icon/utility/check-mark';
9
11
  import ChevronRightIcon from '@atlaskit/icon/utility/migration/chevron-right';
10
12
  import { HeadingItem } from '@atlaskit/menu';
11
- import { ContextualToolbarIcon } from './icons/ContextualToolbarIcon';
12
- import { FixedToolbarIcon } from './icons/FixedToolbarIcon';
13
13
  // New editor controls
14
14
  export const getOverflowFloatingToolbarConfig = ({
15
15
  api,
@@ -49,8 +49,8 @@ export const getOverflowFloatingToolbarConfig = ({
49
49
  var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
50
50
  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;
51
51
  },
52
- icon: jsx(ContextualToolbarIcon, {
53
- label: "Contextual toolbar"
52
+ icon: MinusIcon({
53
+ label: 'Contextual toolbar'
54
54
  }),
55
55
  selected: !isDockedToTop,
56
56
  elemAfter: !isDockedToTop ? jsx(CheckMarkIcon, {
@@ -62,8 +62,8 @@ export const getOverflowFloatingToolbarConfig = ({
62
62
  var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
63
63
  return (_api$selectionToolbar4 = api === null || api === void 0 ? void 0 : (_api$selectionToolbar5 = api.selectionToolbar.actions) === null || _api$selectionToolbar5 === void 0 ? void 0 : (_api$selectionToolbar6 = _api$selectionToolbar5.setToolbarDocking) === null || _api$selectionToolbar6 === void 0 ? void 0 : _api$selectionToolbar6.call(_api$selectionToolbar5, 'top')) !== null && _api$selectionToolbar4 !== void 0 ? _api$selectionToolbar4 : false;
64
64
  },
65
- icon: jsx(FixedToolbarIcon, {
66
- label: "Fixed toolbar"
65
+ icon: DockToolbarTopIcon({
66
+ label: 'Fixed toolbar'
67
67
  }),
68
68
  selected: isDockedToTop,
69
69
  elemAfter: isDockedToTop ? jsx(CheckMarkIcon, {
@@ -97,8 +97,8 @@ export const getOverflowPrimaryToolbarConfig = ({
97
97
  var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
98
98
  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;
99
99
  },
100
- elemBefore: jsx(ContextualToolbarIcon, {
101
- label: "Contextual toolbar"
100
+ elemBefore: MinusIcon({
101
+ label: 'Contextual toolbar'
102
102
  })
103
103
  }, {
104
104
  content: 'Fixed at top',
@@ -110,8 +110,8 @@ export const getOverflowPrimaryToolbarConfig = ({
110
110
  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;
111
111
  },
112
112
  isActive: true,
113
- elemBefore: jsx(FixedToolbarIcon, {
114
- label: "Fixed toolbar"
113
+ elemBefore: DockToolbarTopIcon({
114
+ label: 'Fixed toolbar'
115
115
  }),
116
116
  elemAfter: jsx(CheckMarkIcon, {
117
117
  label: ""
@@ -12,12 +12,20 @@ import { setToolbarDocking as _setToolbarDocking, toggleToolbar } from './pm-plu
12
12
  import { selectionToolbarPluginKey } from './pm-plugins/plugin-key';
13
13
  import { getOverflowFloatingToolbarConfig } from './ui/overflow-toolbar-config';
14
14
  import { PrimaryToolbarComponent } from './ui/PrimaryToolbarComponent';
15
+ var getInitialToolbarDocking = function getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
16
+ if (contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
17
+ var _userPreferencesProvi;
18
+ return (_userPreferencesProvi = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) !== null && _userPreferencesProvi !== void 0 ? _userPreferencesProvi : 'none';
19
+ }
20
+ return 'top';
21
+ };
15
22
  export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
16
23
  var api = _ref.api,
17
24
  config = _ref.config;
18
25
  var __selectionToolbarHandlers = [];
19
26
  var primaryToolbarComponent;
20
- var userPreferencesProvider = config.userPreferencesProvider;
27
+ var userPreferencesProvider = config.userPreferencesProvider,
28
+ contextualFormattingEnabled = config.contextualFormattingEnabled;
21
29
  if (editorExperiment('platform_editor_controls', 'variant1', {
22
30
  exposure: true
23
31
  })) {
@@ -78,14 +86,10 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
78
86
  key: selectionToolbarPluginKey,
79
87
  state: {
80
88
  init: function init() {
81
- var toolbarDocking = 'top';
82
- if (editorExperiment('platform_editor_controls', 'variant1')) {
83
- toolbarDocking = (userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) || 'none';
84
- }
85
89
  return {
86
90
  selectionStable: false,
87
91
  hide: false,
88
- toolbarDocking: toolbarDocking
92
+ toolbarDocking: getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
89
93
  };
90
94
  },
91
95
  apply: function apply(tr, pluginState) {
@@ -214,7 +218,7 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
214
218
  }
215
219
  }
216
220
  }
217
- if (items.length > 0 && editorExperiment('platform_editor_controls', 'variant1')) {
221
+ if (items.length > 0 && contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
218
222
  items.push.apply(items, _toConsumableArray(getOverflowFloatingToolbarConfig({
219
223
  api: api,
220
224
  toolbarDocking: toolbarDocking
@@ -5,11 +5,11 @@
5
5
  */
6
6
  import { jsx } from '@emotion/react'; // eslint-disable-line @atlaskit/ui-styling-standard/use-compiled
7
7
 
8
+ import DockToolbarTopIcon from '@atlaskit/icon-lab/core/dock-toolbar-top';
9
+ import MinusIcon from '@atlaskit/icon/core/minus';
8
10
  import CheckMarkIcon from '@atlaskit/icon/utility/check-mark';
9
11
  import ChevronRightIcon from '@atlaskit/icon/utility/migration/chevron-right';
10
12
  import { HeadingItem } from '@atlaskit/menu';
11
- import { ContextualToolbarIcon } from './icons/ContextualToolbarIcon';
12
- import { FixedToolbarIcon } from './icons/FixedToolbarIcon';
13
13
  // New editor controls
14
14
  export var getOverflowFloatingToolbarConfig = function getOverflowFloatingToolbarConfig(_ref) {
15
15
  var api = _ref.api,
@@ -48,8 +48,8 @@ export var getOverflowFloatingToolbarConfig = function getOverflowFloatingToolba
48
48
  var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
49
49
  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;
50
50
  },
51
- icon: jsx(ContextualToolbarIcon, {
52
- label: "Contextual toolbar"
51
+ icon: MinusIcon({
52
+ label: 'Contextual toolbar'
53
53
  }),
54
54
  selected: !isDockedToTop,
55
55
  elemAfter: !isDockedToTop ? jsx(CheckMarkIcon, {
@@ -61,8 +61,8 @@ export var getOverflowFloatingToolbarConfig = function getOverflowFloatingToolba
61
61
  var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
62
62
  return (_api$selectionToolbar4 = api === null || api === void 0 || (_api$selectionToolbar5 = api.selectionToolbar.actions) === null || _api$selectionToolbar5 === void 0 || (_api$selectionToolbar6 = _api$selectionToolbar5.setToolbarDocking) === null || _api$selectionToolbar6 === void 0 ? void 0 : _api$selectionToolbar6.call(_api$selectionToolbar5, 'top')) !== null && _api$selectionToolbar4 !== void 0 ? _api$selectionToolbar4 : false;
63
63
  },
64
- icon: jsx(FixedToolbarIcon, {
65
- label: "Fixed toolbar"
64
+ icon: DockToolbarTopIcon({
65
+ label: 'Fixed toolbar'
66
66
  }),
67
67
  selected: isDockedToTop,
68
68
  elemAfter: isDockedToTop ? jsx(CheckMarkIcon, {
@@ -96,8 +96,8 @@ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarC
96
96
  var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
97
97
  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;
98
98
  },
99
- elemBefore: jsx(ContextualToolbarIcon, {
100
- label: "Contextual toolbar"
99
+ elemBefore: MinusIcon({
100
+ label: 'Contextual toolbar'
101
101
  })
102
102
  }, {
103
103
  content: 'Fixed at top',
@@ -109,8 +109,8 @@ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarC
109
109
  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;
110
110
  },
111
111
  isActive: true,
112
- elemBefore: jsx(FixedToolbarIcon, {
113
- label: "Fixed toolbar"
112
+ elemBefore: DockToolbarTopIcon({
113
+ label: 'Fixed toolbar'
114
114
  }),
115
115
  elemAfter: jsx(CheckMarkIcon, {
116
116
  label: ""
@@ -12,6 +12,7 @@ export type SelectionToolbarPlugin = NextEditorPlugin<'selectionToolbar', {
12
12
  */
13
13
  preferenceToolbarAboveSelection?: boolean;
14
14
  userPreferencesProvider?: UserPreferencesProvider;
15
+ contextualFormattingEnabled?: boolean;
15
16
  };
16
17
  dependencies: [OptionalPlugin<EditorViewModePlugin>, OptionalPlugin<PrimaryToolbarPlugin>];
17
18
  actions?: {
@@ -12,6 +12,7 @@ export type SelectionToolbarPlugin = NextEditorPlugin<'selectionToolbar', {
12
12
  */
13
13
  preferenceToolbarAboveSelection?: boolean;
14
14
  userPreferencesProvider?: UserPreferencesProvider;
15
+ contextualFormattingEnabled?: boolean;
15
16
  };
16
17
  dependencies: [
17
18
  OptionalPlugin<EditorViewModePlugin>,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-toolbar",
3
- "version": "2.1.3",
3
+ "version": "2.2.0",
4
4
  "description": "@atlaskit/editor-plugin-selection-toolbar for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -33,11 +33,12 @@
33
33
  ".": "./src/index.ts"
34
34
  },
35
35
  "dependencies": {
36
- "@atlaskit/editor-common": "^102.11.0",
36
+ "@atlaskit/editor-common": "^102.12.0",
37
37
  "@atlaskit/editor-plugin-editor-viewmode": "^3.0.0",
38
- "@atlaskit/editor-plugin-primary-toolbar": "^3.0.0",
38
+ "@atlaskit/editor-plugin-primary-toolbar": "^3.1.0",
39
39
  "@atlaskit/editor-prosemirror": "7.0.0",
40
40
  "@atlaskit/icon": "^25.0.0",
41
+ "@atlaskit/icon-lab": "^4.2.0",
41
42
  "@atlaskit/menu": "^3.1.0",
42
43
  "@atlaskit/platform-feature-flags": "^1.1.0",
43
44
  "@atlaskit/tmp-editor-statsig": "^4.1.0",
@@ -1,29 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.ContextualToolbarIcon = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var ContextualToolbarIcon = exports.ContextualToolbarIcon = function ContextualToolbarIcon(props) {
10
- var primaryColor = props.primaryColor,
11
- label = props.label;
12
- return /*#__PURE__*/_react.default.createElement("svg", {
13
- width: "16",
14
- height: "16",
15
- viewBox: "0 0 16 16",
16
- style: {
17
- color: primaryColor,
18
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
19
- fill: "var(--ds-background-neutral-subtle, #00000000)"
20
- },
21
- "aria-label": label || undefined,
22
- role: label ? 'img' : 'presentation'
23
- }, /*#__PURE__*/_react.default.createElement("path", {
24
- "fill-rule": "evenodd",
25
- "clip-rule": "evenodd",
26
- d: "M14 8.75H2V7.25H14V8.75Z",
27
- fill: "currentColor"
28
- }));
29
- };
@@ -1,38 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.FixedToolbarIcon = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var FixedToolbarIcon = exports.FixedToolbarIcon = function FixedToolbarIcon(props) {
10
- var primaryColor = props.primaryColor,
11
- label = props.label;
12
- return /*#__PURE__*/_react.default.createElement("svg", {
13
- width: "16",
14
- height: "16",
15
- viewBox: "0 0 16 16",
16
- style: {
17
- color: primaryColor,
18
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
19
- fill: "var(--ds-background-neutral-subtle, #00000000)"
20
- },
21
- "aria-label": label || undefined,
22
- role: label ? 'img' : 'presentation'
23
- }, /*#__PURE__*/_react.default.createElement("rect", {
24
- x: "0.75",
25
- y: "1.00586",
26
- width: "14.5",
27
- height: "13.9879",
28
- rx: "2.25",
29
- stroke: "currentColor",
30
- "stroke-width": "1.5"
31
- }), /*#__PURE__*/_react.default.createElement("rect", {
32
- x: "4",
33
- y: "3.75586",
34
- width: "8",
35
- height: "1.5",
36
- fill: "currentColor"
37
- }));
38
- };
@@ -1,24 +0,0 @@
1
- import React from 'react';
2
- export const ContextualToolbarIcon = props => {
3
- const {
4
- primaryColor,
5
- label
6
- } = props;
7
- return /*#__PURE__*/React.createElement("svg", {
8
- width: "16",
9
- height: "16",
10
- viewBox: "0 0 16 16",
11
- style: {
12
- color: primaryColor,
13
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
14
- fill: "var(--ds-background-neutral-subtle, #00000000)"
15
- },
16
- "aria-label": label || undefined,
17
- role: label ? 'img' : 'presentation'
18
- }, /*#__PURE__*/React.createElement("path", {
19
- "fill-rule": "evenodd",
20
- "clip-rule": "evenodd",
21
- d: "M14 8.75H2V7.25H14V8.75Z",
22
- fill: "currentColor"
23
- }));
24
- };
@@ -1,33 +0,0 @@
1
- import React from 'react';
2
- export const FixedToolbarIcon = props => {
3
- const {
4
- primaryColor,
5
- label
6
- } = props;
7
- return /*#__PURE__*/React.createElement("svg", {
8
- width: "16",
9
- height: "16",
10
- viewBox: "0 0 16 16",
11
- style: {
12
- color: primaryColor,
13
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
14
- fill: "var(--ds-background-neutral-subtle, #00000000)"
15
- },
16
- "aria-label": label || undefined,
17
- role: label ? 'img' : 'presentation'
18
- }, /*#__PURE__*/React.createElement("rect", {
19
- x: "0.75",
20
- y: "1.00586",
21
- width: "14.5",
22
- height: "13.9879",
23
- rx: "2.25",
24
- stroke: "currentColor",
25
- "stroke-width": "1.5"
26
- }), /*#__PURE__*/React.createElement("rect", {
27
- x: "4",
28
- y: "3.75586",
29
- width: "8",
30
- height: "1.5",
31
- fill: "currentColor"
32
- }));
33
- };
@@ -1,22 +0,0 @@
1
- import React from 'react';
2
- export var ContextualToolbarIcon = function ContextualToolbarIcon(props) {
3
- var primaryColor = props.primaryColor,
4
- label = props.label;
5
- return /*#__PURE__*/React.createElement("svg", {
6
- width: "16",
7
- height: "16",
8
- viewBox: "0 0 16 16",
9
- style: {
10
- color: primaryColor,
11
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
12
- fill: "var(--ds-background-neutral-subtle, #00000000)"
13
- },
14
- "aria-label": label || undefined,
15
- role: label ? 'img' : 'presentation'
16
- }, /*#__PURE__*/React.createElement("path", {
17
- "fill-rule": "evenodd",
18
- "clip-rule": "evenodd",
19
- d: "M14 8.75H2V7.25H14V8.75Z",
20
- fill: "currentColor"
21
- }));
22
- };
@@ -1,31 +0,0 @@
1
- import React from 'react';
2
- export var FixedToolbarIcon = function FixedToolbarIcon(props) {
3
- var primaryColor = props.primaryColor,
4
- label = props.label;
5
- return /*#__PURE__*/React.createElement("svg", {
6
- width: "16",
7
- height: "16",
8
- viewBox: "0 0 16 16",
9
- style: {
10
- color: primaryColor,
11
- // eslint-disable-next-line @atlaskit/ui-styling-standard/enforce-style-prop
12
- fill: "var(--ds-background-neutral-subtle, #00000000)"
13
- },
14
- "aria-label": label || undefined,
15
- role: label ? 'img' : 'presentation'
16
- }, /*#__PURE__*/React.createElement("rect", {
17
- x: "0.75",
18
- y: "1.00586",
19
- width: "14.5",
20
- height: "13.9879",
21
- rx: "2.25",
22
- stroke: "currentColor",
23
- "stroke-width": "1.5"
24
- }), /*#__PURE__*/React.createElement("rect", {
25
- x: "4",
26
- y: "3.75586",
27
- width: "8",
28
- height: "1.5",
29
- fill: "currentColor"
30
- }));
31
- };
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- import type { SVGProps } from '@atlaskit/icon/types';
3
- export declare const ContextualToolbarIcon: (props: SVGProps) => React.JSX.Element;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- import type { SVGProps } from '@atlaskit/icon/types';
3
- export declare const FixedToolbarIcon: (props: SVGProps) => React.JSX.Element;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- import type { SVGProps } from '@atlaskit/icon/types';
3
- export declare const ContextualToolbarIcon: (props: SVGProps) => React.JSX.Element;
@@ -1,3 +0,0 @@
1
- import React from 'react';
2
- import type { SVGProps } from '@atlaskit/icon/types';
3
- export declare const FixedToolbarIcon: (props: SVGProps) => React.JSX.Element;