@atlaskit/editor-plugin-selection-toolbar 4.0.0 → 4.1.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.
Files changed (15) hide show
  1. package/CHANGELOG.md +18 -0
  2. package/dist/cjs/selectionToolbarPlugin.js +24 -52
  3. package/dist/cjs/ui/PrimaryToolbarComponent.js +6 -84
  4. package/dist/cjs/ui/overflow-toolbar-config.js +10 -70
  5. package/dist/es2019/selectionToolbarPlugin.js +17 -44
  6. package/dist/es2019/ui/PrimaryToolbarComponent.js +3 -74
  7. package/dist/es2019/ui/overflow-toolbar-config.js +8 -69
  8. package/dist/esm/selectionToolbarPlugin.js +25 -53
  9. package/dist/esm/ui/PrimaryToolbarComponent.js +5 -82
  10. package/dist/esm/ui/overflow-toolbar-config.js +9 -69
  11. package/dist/types/ui/PrimaryToolbarComponent.d.ts +2 -17
  12. package/dist/types/ui/overflow-toolbar-config.d.ts +0 -2
  13. package/dist/types-ts4.5/ui/PrimaryToolbarComponent.d.ts +2 -17
  14. package/dist/types-ts4.5/ui/overflow-toolbar-config.d.ts +0 -2
  15. package/package.json +7 -7
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-selection-toolbar
2
2
 
3
+ ## 4.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#185617](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/185617)
8
+ [`c766e636b2d44`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/c766e636b2d44) -
9
+ ED-28220 clean up exp platform_editor_controls_toolbar_pinning_exp
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
15
+ ## 4.0.1
16
+
17
+ ### Patch Changes
18
+
19
+ - Updated dependencies
20
+
3
21
  ## 4.0.0
4
22
 
5
23
  ### Major Changes
package/dist/cjs/selectionToolbarPlugin.js CHANGED
@@ -17,7 +17,6 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
17
17
  var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
18
18
  var _commands = require("./pm-plugins/commands");
19
19
  var _pluginKey = require("./pm-plugins/plugin-key");
20
- var _overflowToolbarConfig = require("./ui/overflow-toolbar-config");
21
20
  var _PageVisibilityWatcher = require("./ui/PageVisibilityWatcher");
22
21
  var _pinToolbarConfig = require("./ui/pin-toolbar-config");
23
22
  var _PrimaryToolbarComponent = require("./ui/PrimaryToolbarComponent");
@@ -46,37 +45,18 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
46
45
  if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1', {
47
46
  exposure: true
48
47
  })) {
49
- if ((0, _experiments.editorExperiment)('platform_editor_controls_toolbar_pinning_exp', true)) {
50
- var _api$primaryToolbar;
51
- primaryToolbarComponent = function primaryToolbarComponent(_ref2) {
52
- var disabled = _ref2.disabled;
53
- return /*#__PURE__*/_react.default.createElement(_PrimaryToolbarComponent.PrimaryToolbarComponentNew, {
54
- api: api,
55
- disabled: disabled
56
- });
57
- };
58
- api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
59
- name: 'pinToolbar',
60
- component: primaryToolbarComponent
61
- });
62
- } else {
63
- var _api$primaryToolbar2;
64
- primaryToolbarComponent = function primaryToolbarComponent(_ref3) {
65
- var popupsBoundariesElement = _ref3.popupsBoundariesElement,
66
- popupsMountPoint = _ref3.popupsMountPoint,
67
- popupsScrollableElement = _ref3.popupsScrollableElement;
68
- return /*#__PURE__*/_react.default.createElement(_PrimaryToolbarComponent.PrimaryToolbarComponent, {
69
- api: api,
70
- popupsBoundariesElement: popupsBoundariesElement,
71
- popupsMountPoint: popupsMountPoint,
72
- popupsScrollableElement: popupsScrollableElement
73
- });
74
- };
75
- api === null || api === void 0 || (_api$primaryToolbar2 = api.primaryToolbar) === null || _api$primaryToolbar2 === void 0 || _api$primaryToolbar2.actions.registerComponent({
76
- name: 'overflowMenu',
77
- component: primaryToolbarComponent
48
+ var _api$primaryToolbar;
49
+ primaryToolbarComponent = function primaryToolbarComponent(_ref2) {
50
+ var disabled = _ref2.disabled;
51
+ return /*#__PURE__*/_react.default.createElement(_PrimaryToolbarComponent.PrimaryToolbarComponent, {
52
+ api: api,
53
+ disabled: disabled
78
54
  });
79
- }
55
+ };
56
+ api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
57
+ name: 'pinToolbar',
58
+ component: primaryToolbarComponent
59
+ });
80
60
  }
81
61
  var previousToolbarDocking = (userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) || null;
82
62
  var isPreferenceInitialized = false;
@@ -246,10 +226,10 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
246
226
  },
247
227
  pluginsOptions: {
248
228
  floatingToolbar: function floatingToolbar(state, intl, providerFactory) {
249
- var _ref4 = _pluginKey.selectionToolbarPluginKey.getState(state),
250
- selectionStable = _ref4.selectionStable,
251
- hide = _ref4.hide,
252
- toolbarDocking = _ref4.toolbarDocking;
229
+ var _ref3 = _pluginKey.selectionToolbarPluginKey.getState(state),
230
+ selectionStable = _ref3.selectionStable,
231
+ hide = _ref3.hide,
232
+ toolbarDocking = _ref3.toolbarDocking;
253
233
  var isCellSelection = ('$anchorCell' in state.selection);
254
234
  var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
255
235
  if (state.selection.empty || !selectionStable || hide || state.selection instanceof _state.NodeSelection ||
@@ -281,11 +261,11 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
281
261
  // they add to the selection toolbar.
282
262
  // ie. if you want to have your plugin's group appear first, set rank to -10 if there is currently another
283
263
  // plugin you expect to be run at the same time as with an rank of -9
284
- resolved.sort(function (_ref5, _ref6) {
264
+ resolved.sort(function (_ref4, _ref5) {
265
+ var _ref4$rank = _ref4.rank,
266
+ rankA = _ref4$rank === void 0 ? 0 : _ref4$rank;
285
267
  var _ref5$rank = _ref5.rank,
286
- rankA = _ref5$rank === void 0 ? 0 : _ref5$rank;
287
- var _ref6$rank = _ref6.rank,
288
- rankB = _ref6$rank === void 0 ? 0 : _ref6$rank;
268
+ rankB = _ref5$rank === void 0 ? 0 : _ref5$rank;
289
269
  if (rankA < rankB) {
290
270
  return 1;
291
271
  }
@@ -321,19 +301,11 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
321
301
  if (items.length > 0 && contextualFormattingEnabled && isEditorControlsEnabled) {
322
302
  var _api$userPreferences3;
323
303
  var toolbarDockingPref = api !== null && api !== void 0 && api.userPreferences && (0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin') ? api === null || api === void 0 || (_api$userPreferences3 = api.userPreferences) === null || _api$userPreferences3 === void 0 || (_api$userPreferences3 = _api$userPreferences3.sharedState.currentState()) === null || _api$userPreferences3 === void 0 || (_api$userPreferences3 = _api$userPreferences3.preferences) === null || _api$userPreferences3 === void 0 ? void 0 : _api$userPreferences3.toolbarDockingPosition : toolbarDocking;
324
- if ((0, _experiments.editorExperiment)('platform_editor_controls_toolbar_pinning_exp', true)) {
325
- items.push.apply(items, (0, _toConsumableArray2.default)((0, _pinToolbarConfig.getPinOptionToolbarConfig)({
326
- api: api,
327
- toolbarDocking: toolbarDockingPref,
328
- intl: intl
329
- })));
330
- } else {
331
- items.push.apply(items, (0, _toConsumableArray2.default)((0, _overflowToolbarConfig.getOverflowFloatingToolbarConfig)({
332
- api: api,
333
- toolbarDocking: toolbarDockingPref,
334
- intl: intl
335
- })));
336
- }
304
+ items.push.apply(items, (0, _toConsumableArray2.default)((0, _pinToolbarConfig.getPinOptionToolbarConfig)({
305
+ api: api,
306
+ toolbarDocking: toolbarDockingPref,
307
+ intl: intl
308
+ })));
337
309
  }
338
310
  var onPositionCalculated;
339
311
  var toolbarTitle = 'Selection toolbar';
package/dist/cjs/ui/PrimaryToolbarComponent.js CHANGED
@@ -6,105 +6,27 @@ var _typeof = require("@babel/runtime/helpers/typeof");
6
6
  Object.defineProperty(exports, "__esModule", {
7
7
  value: true
8
8
  });
9
- exports.PrimaryToolbarComponent = PrimaryToolbarComponent;
10
- exports.PrimaryToolbarComponentNew = void 0;
9
+ exports.PrimaryToolbarComponent = void 0;
11
10
  require("./PrimaryToolbarComponent.compiled.css");
12
- var _react = _interopRequireWildcard(require("react"));
13
- var React = _react;
11
+ var React = _interopRequireWildcard(require("react"));
14
12
  var _runtime = require("@compiled/react/runtime");
15
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
16
13
  var _reactIntlNext = require("react-intl-next");
17
- var _analytics = require("@atlaskit/editor-common/analytics");
18
- var _keymaps = require("@atlaskit/editor-common/keymaps");
19
- var _messages = _interopRequireWildcard(require("@atlaskit/editor-common/messages"));
14
+ var _messages = require("@atlaskit/editor-common/messages");
20
15
  var _uiMenu = require("@atlaskit/editor-common/ui-menu");
21
16
  var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
22
17
  var _pin = _interopRequireDefault(require("@atlaskit/icon/core/pin"));
23
18
  var _pinFilled = _interopRequireDefault(require("@atlaskit/icon/core/pin-filled"));
24
- var _showMoreHorizontal = _interopRequireDefault(require("@atlaskit/icon/core/show-more-horizontal"));
25
19
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
26
- var _overflowToolbarConfig = require("./overflow-toolbar-config");
27
20
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
28
- var DROPDOWN_WIDTH = 240;
29
21
  var buttonStyles = null;
30
- /**
31
- * A component used to renderer a dropdown with
32
- * toolbar docking options.
33
- */
34
- function PrimaryToolbarComponent(_ref) {
35
- var api = _ref.api,
36
- popupsBoundariesElement = _ref.popupsBoundariesElement,
37
- popupsMountPoint = _ref.popupsMountPoint,
38
- popupsScrollableElement = _ref.popupsScrollableElement;
39
- var intl = (0, _reactIntlNext.useIntl)();
40
- var _useState = (0, _react.useState)(false),
41
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
42
- isOpen = _useState2[0],
43
- setIsOpen = _useState2[1];
44
- var items = (0, _react.useMemo)(function () {
45
- return (0, _overflowToolbarConfig.getOverflowPrimaryToolbarConfig)({
46
- api: api,
47
- intl: intl
48
- });
49
- }, [api, intl]);
50
- var content = intl.formatMessage(_messages.default.viewMore);
51
- var onClick = (0, _react.useCallback)(function () {
52
- setIsOpen(!isOpen);
53
- }, [isOpen]);
54
- var onMenuItemActivated = (0, _react.useCallback)(function (_ref2) {
55
- var _item$onClick;
56
- var item = _ref2.item;
57
- item === null || item === void 0 || (_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item);
58
- }, []);
59
- (0, _react.useEffect)(function () {
60
- var _api$analytics;
61
- api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
62
- action: _analytics.ACTION.RENDERED,
63
- actionSubject: _analytics.ACTION_SUBJECT.TOOLBAR,
64
- actionSubjectId: _analytics.ACTION_SUBJECT_ID.DOCKED_PRIMARY_TOOLBAR,
65
- eventType: _analytics.EVENT_TYPE.UI
66
- });
67
- // eslint-disable-next-line react-hooks/exhaustive-deps
68
- }, []);
69
- return /*#__PURE__*/React.createElement(_uiMenu.DropdownMenu, {
70
- isOpen: isOpen,
71
- onOpenChange: function onOpenChange(attrs) {
72
- return setIsOpen(attrs.isOpen);
73
- },
74
- items: items,
75
- arrowKeyNavigationProviderOptions: {
76
- type: _uiMenu.ArrowKeyNavigationType.MENU
77
- },
78
- boundariesElement: popupsBoundariesElement,
79
- mountTo: popupsMountPoint,
80
- scrollableElement: popupsScrollableElement,
81
- section: {
82
- hasSeparator: true
83
- },
84
- onItemActivated: onMenuItemActivated,
85
- fitWidth: DROPDOWN_WIDTH
86
- }, /*#__PURE__*/React.createElement(_uiMenu.ToolbarButton, {
87
- onClick: onClick,
88
- "aria-haspopup": "dialog",
89
- "aria-keyshortcuts": (0, _keymaps.getAriaKeyshortcuts)(_keymaps.addLink),
90
- "aria-label": content,
91
- title: content
92
- // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
93
- ,
94
- className: (0, _runtime.ax)(["_ca0q12x7 _n3td12x7 _19bv12x7 _u5f312x7"])
95
- }, /*#__PURE__*/React.createElement(_showMoreHorizontal.default, {
96
- label: content
97
- })));
98
- }
99
-
100
22
  /**
101
23
  * A component used to renderer a pin/unpin
102
24
  * button to the toolbar to the or make it in-line.
103
25
  */
104
- var PrimaryToolbarComponentNew = exports.PrimaryToolbarComponentNew = function PrimaryToolbarComponentNew(_ref3) {
26
+ var PrimaryToolbarComponent = exports.PrimaryToolbarComponent = function PrimaryToolbarComponent(_ref) {
105
27
  var _api$userPreferences, _api$selectionToolbar;
106
- var api = _ref3.api,
107
- disabled = _ref3.disabled;
28
+ var api = _ref.api,
29
+ disabled = _ref.disabled;
108
30
  var intl = (0, _reactIntlNext.useIntl)();
109
31
  var mode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'connectivity.mode');
110
32
  var isOffline = mode === 'offline' || false;
package/dist/cjs/ui/overflow-toolbar-config.js CHANGED
@@ -6,7 +6,7 @@ var _typeof = require("@babel/runtime/helpers/typeof");
6
6
  Object.defineProperty(exports, "__esModule", {
7
7
  value: true
8
8
  });
9
- exports.getOverflowPrimaryToolbarConfig = exports.getOverflowFloatingToolbarConfig = void 0;
9
+ exports.getOverflowPrimaryToolbarConfig = void 0;
10
10
  var React = _interopRequireWildcard(require("react"));
11
11
  var _runtime = require("@compiled/react/runtime");
12
12
  var _messages = require("@atlaskit/editor-common/messages");
@@ -16,69 +16,9 @@ var _minus = _interopRequireDefault(require("@atlaskit/icon/core/minus"));
16
16
  var _menu = require("@atlaskit/menu");
17
17
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
18
18
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
19
- // New editor controls
20
- var getOverflowFloatingToolbarConfig = exports.getOverflowFloatingToolbarConfig = function getOverflowFloatingToolbarConfig(_ref) {
19
+ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarConfig(_ref) {
21
20
  var api = _ref.api,
22
- toolbarDocking = _ref.toolbarDocking,
23
21
  intl = _ref.intl;
24
- var isDockedToTop = toolbarDocking === 'top';
25
- var dropdownOptions = [{
26
- type: 'overflow-dropdown-heading',
27
- title: intl.formatMessage(_messages.selectionToolbarMessages.toolbarAppears)
28
- }, {
29
- title: intl.formatMessage(_messages.selectionToolbarMessages.toolbarPositionInline),
30
- onClick: function onClick() {
31
- var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
32
- if ((0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin')) {
33
- var _api$core$actions$exe, _api$userPreferences, _api$userPreferences$;
34
- return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.actions) === null || _api$userPreferences === void 0 || (_api$userPreferences$ = _api$userPreferences.updateUserPreference) === null || _api$userPreferences$ === void 0 ? void 0 : _api$userPreferences$.call(_api$userPreferences, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
35
- }
36
- 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;
37
- },
38
- icon: (0, _minus.default)({
39
- label: ''
40
- }),
41
- selected: !isDockedToTop,
42
- elemAfter: !isDockedToTop ? /*#__PURE__*/React.createElement(_checkMark.default, {
43
- label: "",
44
- size: "small"
45
- }) : undefined
46
- }, {
47
- title: intl.formatMessage(_messages.selectionToolbarMessages.toolbarPositionFixedAtTop),
48
- onClick: function onClick() {
49
- var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
50
- if ((0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin')) {
51
- var _api$core$actions$exe2, _api$userPreferences2, _api$userPreferences3;
52
- return (_api$core$actions$exe2 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences2 = api.userPreferences) === null || _api$userPreferences2 === void 0 || (_api$userPreferences2 = _api$userPreferences2.actions) === null || _api$userPreferences2 === void 0 || (_api$userPreferences3 = _api$userPreferences2.updateUserPreference) === null || _api$userPreferences3 === void 0 ? void 0 : _api$userPreferences3.call(_api$userPreferences2, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe2 !== void 0 ? _api$core$actions$exe2 : false;
53
- }
54
- 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;
55
- },
56
- icon: (0, _dockToolbarTop.default)({
57
- label: ''
58
- }),
59
- selected: isDockedToTop,
60
- elemAfter: isDockedToTop ? /*#__PURE__*/React.createElement(_checkMark.default, {
61
- label: "",
62
- size: "small"
63
- }) : undefined
64
- }];
65
-
66
- // testId is required to show focus on trigger button on ESC key press
67
- // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
68
- var testId = 'selectionToolbar-overflow-dropdown-trigger';
69
- return [{
70
- type: 'separator',
71
- fullHeight: true
72
- }, {
73
- type: 'overflow-dropdown',
74
- testId: testId,
75
- dropdownWidth: 240,
76
- options: dropdownOptions
77
- }];
78
- };
79
- var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarConfig(_ref2) {
80
- var api = _ref2.api,
81
- intl = _ref2.intl;
82
22
  return [{
83
23
  items: [{
84
24
  content: /*#__PURE__*/React.createElement(_menu.HeadingItem, null, intl.formatMessage(_messages.selectionToolbarMessages.toolbarAppears)),
@@ -92,12 +32,12 @@ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig =
92
32
  name: 'contextual'
93
33
  },
94
34
  onClick: function onClick() {
95
- var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
35
+ var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
96
36
  if ((0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin')) {
97
- var _api$core$actions$exe3, _api$userPreferences4, _api$userPreferences5;
98
- return (_api$core$actions$exe3 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences4 = api.userPreferences) === null || _api$userPreferences4 === void 0 || (_api$userPreferences4 = _api$userPreferences4.actions) === null || _api$userPreferences4 === void 0 || (_api$userPreferences5 = _api$userPreferences4.updateUserPreference) === null || _api$userPreferences5 === void 0 ? void 0 : _api$userPreferences5.call(_api$userPreferences4, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe3 !== void 0 ? _api$core$actions$exe3 : false;
37
+ var _api$core$actions$exe, _api$userPreferences, _api$userPreferences$;
38
+ return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.actions) === null || _api$userPreferences === void 0 || (_api$userPreferences$ = _api$userPreferences.updateUserPreference) === null || _api$userPreferences$ === void 0 ? void 0 : _api$userPreferences$.call(_api$userPreferences, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
99
39
  }
100
- 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;
40
+ 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;
101
41
  },
102
42
  elemBefore: (0, _minus.default)({
103
43
  label: ''
@@ -108,12 +48,12 @@ var getOverflowPrimaryToolbarConfig = exports.getOverflowPrimaryToolbarConfig =
108
48
  name: 'fixed'
109
49
  },
110
50
  onClick: function onClick() {
111
- var _api$selectionToolbar0, _api$selectionToolbar1, _api$selectionToolbar10;
51
+ var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
112
52
  if ((0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin')) {
113
- var _api$core$actions$exe4, _api$userPreferences6, _api$userPreferences7;
114
- return (_api$core$actions$exe4 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences6 = api.userPreferences) === null || _api$userPreferences6 === void 0 || (_api$userPreferences6 = _api$userPreferences6.actions) === null || _api$userPreferences6 === void 0 || (_api$userPreferences7 = _api$userPreferences6.updateUserPreference) === null || _api$userPreferences7 === void 0 ? void 0 : _api$userPreferences7.call(_api$userPreferences6, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe4 !== void 0 ? _api$core$actions$exe4 : false;
53
+ var _api$core$actions$exe2, _api$userPreferences2, _api$userPreferences3;
54
+ return (_api$core$actions$exe2 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences2 = api.userPreferences) === null || _api$userPreferences2 === void 0 || (_api$userPreferences2 = _api$userPreferences2.actions) === null || _api$userPreferences2 === void 0 || (_api$userPreferences3 = _api$userPreferences2.updateUserPreference) === null || _api$userPreferences3 === void 0 ? void 0 : _api$userPreferences3.call(_api$userPreferences2, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe2 !== void 0 ? _api$core$actions$exe2 : false;
115
55
  }
116
- return (_api$selectionToolbar0 = api === null || api === void 0 || (_api$selectionToolbar1 = api.selectionToolbar.actions) === null || _api$selectionToolbar1 === void 0 || (_api$selectionToolbar10 = _api$selectionToolbar1.setToolbarDocking) === null || _api$selectionToolbar10 === void 0 ? void 0 : _api$selectionToolbar10.call(_api$selectionToolbar1, 'top')) !== null && _api$selectionToolbar0 !== void 0 ? _api$selectionToolbar0 : false;
56
+ 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;
117
57
  },
118
58
  isActive: true,
119
59
  elemBefore: (0, _dockToolbarTop.default)({
package/dist/es2019/selectionToolbarPlugin.js CHANGED
@@ -8,10 +8,9 @@ import { fg } from '@atlaskit/platform-feature-flags';
8
8
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
9
9
  import { setToolbarDocking, toggleToolbar, updateToolbarDocking, forceToolbarDockingWithoutAnalytics } from './pm-plugins/commands';
10
10
  import { selectionToolbarPluginKey } from './pm-plugins/plugin-key';
11
- import { getOverflowFloatingToolbarConfig } from './ui/overflow-toolbar-config';
12
11
  import { PageVisibilityWatcher } from './ui/PageVisibilityWatcher';
13
12
  import { getPinOptionToolbarConfig } from './ui/pin-toolbar-config';
14
- import { PrimaryToolbarComponent, PrimaryToolbarComponentNew } from './ui/PrimaryToolbarComponent';
13
+ import { PrimaryToolbarComponent } from './ui/PrimaryToolbarComponent';
15
14
  const getToolbarDocking = (contextualFormattingEnabled, userPreferencesProvider) => {
16
15
  if (contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
17
16
  var _userPreferencesProvi;
@@ -38,37 +37,19 @@ export const selectionToolbarPlugin = ({
38
37
  if (editorExperiment('platform_editor_controls', 'variant1', {
39
38
  exposure: true
40
39
  })) {
41
- if (editorExperiment('platform_editor_controls_toolbar_pinning_exp', true)) {
42
- var _api$primaryToolbar;
43
- primaryToolbarComponent = ({
44
- disabled
45
- }) => {
46
- return /*#__PURE__*/React.createElement(PrimaryToolbarComponentNew, {
47
- api: api,
48
- disabled: disabled
49
- });
50
- };
51
- api === null || api === void 0 ? void 0 : (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 ? void 0 : _api$primaryToolbar.actions.registerComponent({
52
- name: 'pinToolbar',
53
- component: primaryToolbarComponent
54
- });
55
- } else {
56
- var _api$primaryToolbar2;
57
- primaryToolbarComponent = ({
58
- popupsBoundariesElement,
59
- popupsMountPoint,
60
- popupsScrollableElement
61
- }) => /*#__PURE__*/React.createElement(PrimaryToolbarComponent, {
40
+ var _api$primaryToolbar;
41
+ primaryToolbarComponent = ({
42
+ disabled
43
+ }) => {
44
+ return /*#__PURE__*/React.createElement(PrimaryToolbarComponent, {
62
45
  api: api,
63
- popupsBoundariesElement: popupsBoundariesElement,
64
- popupsMountPoint: popupsMountPoint,
65
- popupsScrollableElement: popupsScrollableElement
66
- });
67
- api === null || api === void 0 ? void 0 : (_api$primaryToolbar2 = api.primaryToolbar) === null || _api$primaryToolbar2 === void 0 ? void 0 : _api$primaryToolbar2.actions.registerComponent({
68
- name: 'overflowMenu',
69
- component: primaryToolbarComponent
46
+ disabled: disabled
70
47
  });
71
- }
48
+ };
49
+ api === null || api === void 0 ? void 0 : (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 ? void 0 : _api$primaryToolbar.actions.registerComponent({
50
+ name: 'pinToolbar',
51
+ component: primaryToolbarComponent
52
+ });
72
53
  }
73
54
  let previousToolbarDocking = (userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) || null;
74
55
  let isPreferenceInitialized = false;
@@ -314,19 +295,11 @@ export const selectionToolbarPlugin = ({
314
295
  if (items.length > 0 && contextualFormattingEnabled && isEditorControlsEnabled) {
315
296
  var _api$userPreferences5, _api$userPreferences6, _api$userPreferences7;
316
297
  const toolbarDockingPref = api !== null && api !== void 0 && api.userPreferences && fg('platform_editor_use_preferences_plugin') ? api === null || api === void 0 ? void 0 : (_api$userPreferences5 = api.userPreferences) === null || _api$userPreferences5 === void 0 ? void 0 : (_api$userPreferences6 = _api$userPreferences5.sharedState.currentState()) === null || _api$userPreferences6 === void 0 ? void 0 : (_api$userPreferences7 = _api$userPreferences6.preferences) === null || _api$userPreferences7 === void 0 ? void 0 : _api$userPreferences7.toolbarDockingPosition : toolbarDocking;
317
- if (editorExperiment('platform_editor_controls_toolbar_pinning_exp', true)) {
318
- items.push(...getPinOptionToolbarConfig({
319
- api,
320
- toolbarDocking: toolbarDockingPref,
321
- intl
322
- }));
323
- } else {
324
- items.push(...getOverflowFloatingToolbarConfig({
325
- api,
326
- toolbarDocking: toolbarDockingPref,
327
- intl
328
- }));
329
- }
298
+ items.push(...getPinOptionToolbarConfig({
299
+ api,
300
+ toolbarDocking: toolbarDockingPref,
301
+ intl
302
+ }));
330
303
  }
331
304
  let onPositionCalculated;
332
305
  const toolbarTitle = 'Selection toolbar';
package/dist/es2019/ui/PrimaryToolbarComponent.js CHANGED
@@ -2,90 +2,19 @@
2
2
  import "./PrimaryToolbarComponent.compiled.css";
3
3
  import * as React from 'react';
4
4
  import { ax, ix } from "@compiled/react/runtime";
5
- import { useCallback, useEffect, useMemo, useState } from 'react';
6
5
  import { useIntl } from 'react-intl-next';
7
- import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
8
- import { addLink, getAriaKeyshortcuts } from '@atlaskit/editor-common/keymaps';
9
- import messages, { selectionToolbarMessages } from '@atlaskit/editor-common/messages';
10
- import { ArrowKeyNavigationType, DropdownMenu, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
6
+ import { selectionToolbarMessages } from '@atlaskit/editor-common/messages';
7
+ import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
11
8
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
12
9
  import PinIcon from '@atlaskit/icon/core/pin';
13
10
  import PinFilledIcon from '@atlaskit/icon/core/pin-filled';
14
- import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
15
11
  import { fg } from '@atlaskit/platform-feature-flags';
16
- import { getOverflowPrimaryToolbarConfig } from './overflow-toolbar-config';
17
- const DROPDOWN_WIDTH = 240;
18
12
  const buttonStyles = null;
19
- /**
20
- * A component used to renderer a dropdown with
21
- * toolbar docking options.
22
- */
23
- export function PrimaryToolbarComponent({
24
- api,
25
- popupsBoundariesElement,
26
- popupsMountPoint,
27
- popupsScrollableElement
28
- }) {
29
- const intl = useIntl();
30
- const [isOpen, setIsOpen] = useState(false);
31
- const items = useMemo(() => getOverflowPrimaryToolbarConfig({
32
- api,
33
- intl
34
- }), [api, intl]);
35
- const content = intl.formatMessage(messages.viewMore);
36
- const onClick = useCallback(() => {
37
- setIsOpen(!isOpen);
38
- }, [isOpen]);
39
- const onMenuItemActivated = useCallback(({
40
- item
41
- }) => {
42
- var _item$onClick;
43
- item === null || item === void 0 ? void 0 : (_item$onClick = item.onClick) === null || _item$onClick === void 0 ? void 0 : _item$onClick.call(item);
44
- }, []);
45
- useEffect(() => {
46
- var _api$analytics;
47
- api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions.fireAnalyticsEvent({
48
- action: ACTION.RENDERED,
49
- actionSubject: ACTION_SUBJECT.TOOLBAR,
50
- actionSubjectId: ACTION_SUBJECT_ID.DOCKED_PRIMARY_TOOLBAR,
51
- eventType: EVENT_TYPE.UI
52
- });
53
- // eslint-disable-next-line react-hooks/exhaustive-deps
54
- }, []);
55
- return /*#__PURE__*/React.createElement(DropdownMenu, {
56
- isOpen: isOpen,
57
- onOpenChange: attrs => setIsOpen(attrs.isOpen),
58
- items: items,
59
- arrowKeyNavigationProviderOptions: {
60
- type: ArrowKeyNavigationType.MENU
61
- },
62
- boundariesElement: popupsBoundariesElement,
63
- mountTo: popupsMountPoint,
64
- scrollableElement: popupsScrollableElement,
65
- section: {
66
- hasSeparator: true
67
- },
68
- onItemActivated: onMenuItemActivated,
69
- fitWidth: DROPDOWN_WIDTH
70
- }, /*#__PURE__*/React.createElement(ToolbarButton, {
71
- onClick: onClick,
72
- "aria-haspopup": "dialog",
73
- "aria-keyshortcuts": getAriaKeyshortcuts(addLink),
74
- "aria-label": content,
75
- title: content
76
- // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
77
- ,
78
- className: ax(["_ca0q12x7 _n3td12x7 _19bv12x7 _u5f312x7"])
79
- }, /*#__PURE__*/React.createElement(ShowMoreHorizontalIcon, {
80
- label: content
81
- })));
82
- }
83
-
84
13
  /**
85
14
  * A component used to renderer a pin/unpin
86
15
  * button to the toolbar to the or make it in-line.
87
16
  */
88
- export const PrimaryToolbarComponentNew = ({
17
+ export const PrimaryToolbarComponent = ({
89
18
  api,
90
19
  disabled
91
20
  }) => {
package/dist/es2019/ui/overflow-toolbar-config.js CHANGED
@@ -7,67 +7,6 @@ import CheckMarkIcon from '@atlaskit/icon/core/check-mark';
7
7
  import MinusIcon from '@atlaskit/icon/core/minus';
8
8
  import { HeadingItem } from '@atlaskit/menu';
9
9
  import { fg } from '@atlaskit/platform-feature-flags';
10
- // New editor controls
11
- export const getOverflowFloatingToolbarConfig = ({
12
- api,
13
- toolbarDocking,
14
- intl
15
- }) => {
16
- const isDockedToTop = toolbarDocking === 'top';
17
- const dropdownOptions = [{
18
- type: 'overflow-dropdown-heading',
19
- title: intl.formatMessage(selectionToolbarMessages.toolbarAppears)
20
- }, {
21
- title: intl.formatMessage(selectionToolbarMessages.toolbarPositionInline),
22
- onClick: () => {
23
- var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
24
- if (fg('platform_editor_use_preferences_plugin')) {
25
- var _api$core$actions$exe, _api$userPreferences, _api$userPreferences$, _api$userPreferences$2;
26
- return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 ? void 0 : (_api$userPreferences$ = _api$userPreferences.actions) === null || _api$userPreferences$ === void 0 ? void 0 : (_api$userPreferences$2 = _api$userPreferences$.updateUserPreference) === null || _api$userPreferences$2 === void 0 ? void 0 : _api$userPreferences$2.call(_api$userPreferences$, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
27
- }
28
- 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;
29
- },
30
- icon: MinusIcon({
31
- label: ''
32
- }),
33
- selected: !isDockedToTop,
34
- elemAfter: !isDockedToTop ? /*#__PURE__*/React.createElement(CheckMarkIcon, {
35
- label: "",
36
- size: "small"
37
- }) : undefined
38
- }, {
39
- title: intl.formatMessage(selectionToolbarMessages.toolbarPositionFixedAtTop),
40
- onClick: () => {
41
- var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
42
- if (fg('platform_editor_use_preferences_plugin')) {
43
- var _api$core$actions$exe2, _api$userPreferences2, _api$userPreferences3, _api$userPreferences4;
44
- return (_api$core$actions$exe2 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userPreferences2 = api.userPreferences) === null || _api$userPreferences2 === void 0 ? void 0 : (_api$userPreferences3 = _api$userPreferences2.actions) === null || _api$userPreferences3 === void 0 ? void 0 : (_api$userPreferences4 = _api$userPreferences3.updateUserPreference) === null || _api$userPreferences4 === void 0 ? void 0 : _api$userPreferences4.call(_api$userPreferences3, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe2 !== void 0 ? _api$core$actions$exe2 : false;
45
- }
46
- 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;
47
- },
48
- icon: DockToolbarTopIcon({
49
- label: ''
50
- }),
51
- selected: isDockedToTop,
52
- elemAfter: isDockedToTop ? /*#__PURE__*/React.createElement(CheckMarkIcon, {
53
- label: "",
54
- size: "small"
55
- }) : undefined
56
- }];
57
-
58
- // testId is required to show focus on trigger button on ESC key press
59
- // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
60
- const testId = 'selectionToolbar-overflow-dropdown-trigger';
61
- return [{
62
- type: 'separator',
63
- fullHeight: true
64
- }, {
65
- type: 'overflow-dropdown',
66
- testId,
67
- dropdownWidth: 240,
68
- options: dropdownOptions
69
- }];
70
- };
71
10
  export const getOverflowPrimaryToolbarConfig = ({
72
11
  api,
73
12
  intl
@@ -84,12 +23,12 @@ export const getOverflowPrimaryToolbarConfig = ({
84
23
  name: 'contextual'
85
24
  },
86
25
  onClick: () => {
87
- var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
26
+ var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
88
27
  if (fg('platform_editor_use_preferences_plugin')) {
89
- var _api$core$actions$exe3, _api$userPreferences5, _api$userPreferences6, _api$userPreferences7;
90
- return (_api$core$actions$exe3 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userPreferences5 = api.userPreferences) === null || _api$userPreferences5 === void 0 ? void 0 : (_api$userPreferences6 = _api$userPreferences5.actions) === null || _api$userPreferences6 === void 0 ? void 0 : (_api$userPreferences7 = _api$userPreferences6.updateUserPreference) === null || _api$userPreferences7 === void 0 ? void 0 : _api$userPreferences7.call(_api$userPreferences6, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe3 !== void 0 ? _api$core$actions$exe3 : false;
28
+ var _api$core$actions$exe, _api$userPreferences, _api$userPreferences$, _api$userPreferences$2;
29
+ return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 ? void 0 : (_api$userPreferences$ = _api$userPreferences.actions) === null || _api$userPreferences$ === void 0 ? void 0 : (_api$userPreferences$2 = _api$userPreferences$.updateUserPreference) === null || _api$userPreferences$2 === void 0 ? void 0 : _api$userPreferences$2.call(_api$userPreferences$, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
91
30
  }
92
- 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;
31
+ 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;
93
32
  },
94
33
  elemBefore: MinusIcon({
95
34
  label: ''
@@ -100,12 +39,12 @@ export const getOverflowPrimaryToolbarConfig = ({
100
39
  name: 'fixed'
101
40
  },
102
41
  onClick: () => {
103
- var _api$selectionToolbar0, _api$selectionToolbar1, _api$selectionToolbar10;
42
+ var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
104
43
  if (fg('platform_editor_use_preferences_plugin')) {
105
- var _api$core$actions$exe4, _api$userPreferences8, _api$userPreferences9, _api$userPreferences0;
106
- return (_api$core$actions$exe4 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userPreferences8 = api.userPreferences) === null || _api$userPreferences8 === void 0 ? void 0 : (_api$userPreferences9 = _api$userPreferences8.actions) === null || _api$userPreferences9 === void 0 ? void 0 : (_api$userPreferences0 = _api$userPreferences9.updateUserPreference) === null || _api$userPreferences0 === void 0 ? void 0 : _api$userPreferences0.call(_api$userPreferences9, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe4 !== void 0 ? _api$core$actions$exe4 : false;
44
+ var _api$core$actions$exe2, _api$userPreferences2, _api$userPreferences3, _api$userPreferences4;
45
+ return (_api$core$actions$exe2 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 ? void 0 : (_api$userPreferences2 = api.userPreferences) === null || _api$userPreferences2 === void 0 ? void 0 : (_api$userPreferences3 = _api$userPreferences2.actions) === null || _api$userPreferences3 === void 0 ? void 0 : (_api$userPreferences4 = _api$userPreferences3.updateUserPreference) === null || _api$userPreferences4 === void 0 ? void 0 : _api$userPreferences4.call(_api$userPreferences3, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe2 !== void 0 ? _api$core$actions$exe2 : false;
107
46
  }
108
- return (_api$selectionToolbar0 = api === null || api === void 0 ? void 0 : (_api$selectionToolbar1 = api.selectionToolbar.actions) === null || _api$selectionToolbar1 === void 0 ? void 0 : (_api$selectionToolbar10 = _api$selectionToolbar1.setToolbarDocking) === null || _api$selectionToolbar10 === void 0 ? void 0 : _api$selectionToolbar10.call(_api$selectionToolbar1, 'top')) !== null && _api$selectionToolbar0 !== void 0 ? _api$selectionToolbar0 : false;
47
+ 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;
109
48
  },
110
49
  isActive: true,
111
50
  elemBefore: DockToolbarTopIcon({
package/dist/esm/selectionToolbarPlugin.js CHANGED
@@ -12,10 +12,9 @@ import { fg } from '@atlaskit/platform-feature-flags';
12
12
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
13
13
  import { setToolbarDocking as _setToolbarDocking, toggleToolbar, updateToolbarDocking, forceToolbarDockingWithoutAnalytics as _forceToolbarDockingWithoutAnalytics } from './pm-plugins/commands';
14
14
  import { selectionToolbarPluginKey } from './pm-plugins/plugin-key';
15
- import { getOverflowFloatingToolbarConfig } from './ui/overflow-toolbar-config';
16
15
  import { PageVisibilityWatcher } from './ui/PageVisibilityWatcher';
17
16
  import { getPinOptionToolbarConfig } from './ui/pin-toolbar-config';
18
- import { PrimaryToolbarComponent, PrimaryToolbarComponentNew } from './ui/PrimaryToolbarComponent';
17
+ import { PrimaryToolbarComponent } from './ui/PrimaryToolbarComponent';
19
18
  var getToolbarDocking = function getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
20
19
  if (contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
21
20
  var _userPreferencesProvi;
@@ -39,37 +38,18 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
39
38
  if (editorExperiment('platform_editor_controls', 'variant1', {
40
39
  exposure: true
41
40
  })) {
42
- if (editorExperiment('platform_editor_controls_toolbar_pinning_exp', true)) {
43
- var _api$primaryToolbar;
44
- primaryToolbarComponent = function primaryToolbarComponent(_ref2) {
45
- var disabled = _ref2.disabled;
46
- return /*#__PURE__*/React.createElement(PrimaryToolbarComponentNew, {
47
- api: api,
48
- disabled: disabled
49
- });
50
- };
51
- api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
52
- name: 'pinToolbar',
53
- component: primaryToolbarComponent
54
- });
55
- } else {
56
- var _api$primaryToolbar2;
57
- primaryToolbarComponent = function primaryToolbarComponent(_ref3) {
58
- var popupsBoundariesElement = _ref3.popupsBoundariesElement,
59
- popupsMountPoint = _ref3.popupsMountPoint,
60
- popupsScrollableElement = _ref3.popupsScrollableElement;
61
- return /*#__PURE__*/React.createElement(PrimaryToolbarComponent, {
62
- api: api,
63
- popupsBoundariesElement: popupsBoundariesElement,
64
- popupsMountPoint: popupsMountPoint,
65
- popupsScrollableElement: popupsScrollableElement
66
- });
67
- };
68
- api === null || api === void 0 || (_api$primaryToolbar2 = api.primaryToolbar) === null || _api$primaryToolbar2 === void 0 || _api$primaryToolbar2.actions.registerComponent({
69
- name: 'overflowMenu',
70
- component: primaryToolbarComponent
41
+ var _api$primaryToolbar;
42
+ primaryToolbarComponent = function primaryToolbarComponent(_ref2) {
43
+ var disabled = _ref2.disabled;
44
+ return /*#__PURE__*/React.createElement(PrimaryToolbarComponent, {
45
+ api: api,
46
+ disabled: disabled
71
47
  });
72
- }
48
+ };
49
+ api === null || api === void 0 || (_api$primaryToolbar = api.primaryToolbar) === null || _api$primaryToolbar === void 0 || _api$primaryToolbar.actions.registerComponent({
50
+ name: 'pinToolbar',
51
+ component: primaryToolbarComponent
52
+ });
73
53
  }
74
54
  var previousToolbarDocking = (userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) || null;
75
55
  var isPreferenceInitialized = false;
@@ -239,10 +219,10 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
239
219
  },
240
220
  pluginsOptions: {
241
221
  floatingToolbar: function floatingToolbar(state, intl, providerFactory) {
242
- var _ref4 = selectionToolbarPluginKey.getState(state),
243
- selectionStable = _ref4.selectionStable,
244
- hide = _ref4.hide,
245
- toolbarDocking = _ref4.toolbarDocking;
222
+ var _ref3 = selectionToolbarPluginKey.getState(state),
223
+ selectionStable = _ref3.selectionStable,
224
+ hide = _ref3.hide,
225
+ toolbarDocking = _ref3.toolbarDocking;
246
226
  var isCellSelection = ('$anchorCell' in state.selection);
247
227
  var isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
248
228
  if (state.selection.empty || !selectionStable || hide || state.selection instanceof NodeSelection ||
@@ -274,11 +254,11 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
274
254
  // they add to the selection toolbar.
275
255
  // ie. if you want to have your plugin's group appear first, set rank to -10 if there is currently another
276
256
  // plugin you expect to be run at the same time as with an rank of -9
277
- resolved.sort(function (_ref5, _ref6) {
257
+ resolved.sort(function (_ref4, _ref5) {
258
+ var _ref4$rank = _ref4.rank,
259
+ rankA = _ref4$rank === void 0 ? 0 : _ref4$rank;
278
260
  var _ref5$rank = _ref5.rank,
279
- rankA = _ref5$rank === void 0 ? 0 : _ref5$rank;
280
- var _ref6$rank = _ref6.rank,
281
- rankB = _ref6$rank === void 0 ? 0 : _ref6$rank;
261
+ rankB = _ref5$rank === void 0 ? 0 : _ref5$rank;
282
262
  if (rankA < rankB) {
283
263
  return 1;
284
264
  }
@@ -314,19 +294,11 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
314
294
  if (items.length > 0 && contextualFormattingEnabled && isEditorControlsEnabled) {
315
295
  var _api$userPreferences3;
316
296
  var toolbarDockingPref = api !== null && api !== void 0 && api.userPreferences && fg('platform_editor_use_preferences_plugin') ? api === null || api === void 0 || (_api$userPreferences3 = api.userPreferences) === null || _api$userPreferences3 === void 0 || (_api$userPreferences3 = _api$userPreferences3.sharedState.currentState()) === null || _api$userPreferences3 === void 0 || (_api$userPreferences3 = _api$userPreferences3.preferences) === null || _api$userPreferences3 === void 0 ? void 0 : _api$userPreferences3.toolbarDockingPosition : toolbarDocking;
317
- if (editorExperiment('platform_editor_controls_toolbar_pinning_exp', true)) {
318
- items.push.apply(items, _toConsumableArray(getPinOptionToolbarConfig({
319
- api: api,
320
- toolbarDocking: toolbarDockingPref,
321
- intl: intl
322
- })));
323
- } else {
324
- items.push.apply(items, _toConsumableArray(getOverflowFloatingToolbarConfig({
325
- api: api,
326
- toolbarDocking: toolbarDockingPref,
327
- intl: intl
328
- })));
329
- }
297
+ items.push.apply(items, _toConsumableArray(getPinOptionToolbarConfig({
298
+ api: api,
299
+ toolbarDocking: toolbarDockingPref,
300
+ intl: intl
301
+ })));
330
302
  }
331
303
  var onPositionCalculated;
332
304
  var toolbarTitle = 'Selection toolbar';
package/dist/esm/ui/PrimaryToolbarComponent.js CHANGED
@@ -1,100 +1,23 @@
1
1
  /* PrimaryToolbarComponent.tsx generated by @compiled/babel-plugin v0.36.1 */
2
- import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
3
2
  import "./PrimaryToolbarComponent.compiled.css";
4
3
  import * as React from 'react';
5
4
  import { ax, ix } from "@compiled/react/runtime";
6
- import { useCallback, useEffect, useMemo, useState } from 'react';
7
5
  import { useIntl } from 'react-intl-next';
8
- import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
9
- import { addLink, getAriaKeyshortcuts } from '@atlaskit/editor-common/keymaps';
10
- import messages, { selectionToolbarMessages } from '@atlaskit/editor-common/messages';
11
- import { ArrowKeyNavigationType, DropdownMenu, ToolbarButton } from '@atlaskit/editor-common/ui-menu';
6
+ import { selectionToolbarMessages } from '@atlaskit/editor-common/messages';
7
+ import { ToolbarButton } from '@atlaskit/editor-common/ui-menu';
12
8
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
13
9
  import PinIcon from '@atlaskit/icon/core/pin';
14
10
  import PinFilledIcon from '@atlaskit/icon/core/pin-filled';
15
- import ShowMoreHorizontalIcon from '@atlaskit/icon/core/show-more-horizontal';
16
11
  import { fg } from '@atlaskit/platform-feature-flags';
17
- import { getOverflowPrimaryToolbarConfig } from './overflow-toolbar-config';
18
- var DROPDOWN_WIDTH = 240;
19
12
  var buttonStyles = null;
20
- /**
21
- * A component used to renderer a dropdown with
22
- * toolbar docking options.
23
- */
24
- export function PrimaryToolbarComponent(_ref) {
25
- var api = _ref.api,
26
- popupsBoundariesElement = _ref.popupsBoundariesElement,
27
- popupsMountPoint = _ref.popupsMountPoint,
28
- popupsScrollableElement = _ref.popupsScrollableElement;
29
- var intl = useIntl();
30
- var _useState = useState(false),
31
- _useState2 = _slicedToArray(_useState, 2),
32
- isOpen = _useState2[0],
33
- setIsOpen = _useState2[1];
34
- var items = useMemo(function () {
35
- return getOverflowPrimaryToolbarConfig({
36
- api: api,
37
- intl: intl
38
- });
39
- }, [api, intl]);
40
- var content = intl.formatMessage(messages.viewMore);
41
- var onClick = useCallback(function () {
42
- setIsOpen(!isOpen);
43
- }, [isOpen]);
44
- var onMenuItemActivated = useCallback(function (_ref2) {
45
- var _item$onClick;
46
- var item = _ref2.item;
47
- item === null || item === void 0 || (_item$onClick = item.onClick) === null || _item$onClick === void 0 || _item$onClick.call(item);
48
- }, []);
49
- useEffect(function () {
50
- var _api$analytics;
51
- api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || _api$analytics.actions.fireAnalyticsEvent({
52
- action: ACTION.RENDERED,
53
- actionSubject: ACTION_SUBJECT.TOOLBAR,
54
- actionSubjectId: ACTION_SUBJECT_ID.DOCKED_PRIMARY_TOOLBAR,
55
- eventType: EVENT_TYPE.UI
56
- });
57
- // eslint-disable-next-line react-hooks/exhaustive-deps
58
- }, []);
59
- return /*#__PURE__*/React.createElement(DropdownMenu, {
60
- isOpen: isOpen,
61
- onOpenChange: function onOpenChange(attrs) {
62
- return setIsOpen(attrs.isOpen);
63
- },
64
- items: items,
65
- arrowKeyNavigationProviderOptions: {
66
- type: ArrowKeyNavigationType.MENU
67
- },
68
- boundariesElement: popupsBoundariesElement,
69
- mountTo: popupsMountPoint,
70
- scrollableElement: popupsScrollableElement,
71
- section: {
72
- hasSeparator: true
73
- },
74
- onItemActivated: onMenuItemActivated,
75
- fitWidth: DROPDOWN_WIDTH
76
- }, /*#__PURE__*/React.createElement(ToolbarButton, {
77
- onClick: onClick,
78
- "aria-haspopup": "dialog",
79
- "aria-keyshortcuts": getAriaKeyshortcuts(addLink),
80
- "aria-label": content,
81
- title: content
82
- // eslint-disable-next-line @atlaskit/design-system/no-unsafe-style-overrides -- Ignored via go/DSP-18766
83
- ,
84
- className: ax(["_ca0q12x7 _n3td12x7 _19bv12x7 _u5f312x7"])
85
- }, /*#__PURE__*/React.createElement(ShowMoreHorizontalIcon, {
86
- label: content
87
- })));
88
- }
89
-
90
13
  /**
91
14
  * A component used to renderer a pin/unpin
92
15
  * button to the toolbar to the or make it in-line.
93
16
  */
94
- export var PrimaryToolbarComponentNew = function PrimaryToolbarComponentNew(_ref3) {
17
+ export var PrimaryToolbarComponent = function PrimaryToolbarComponent(_ref) {
95
18
  var _api$userPreferences, _api$selectionToolbar;
96
- var api = _ref3.api,
97
- disabled = _ref3.disabled;
19
+ var api = _ref.api,
20
+ disabled = _ref.disabled;
98
21
  var intl = useIntl();
99
22
  var mode = useSharedPluginStateSelector(api, 'connectivity.mode');
100
23
  var isOffline = mode === 'offline' || false;
package/dist/esm/ui/overflow-toolbar-config.js CHANGED
@@ -7,69 +7,9 @@ import CheckMarkIcon from '@atlaskit/icon/core/check-mark';
7
7
  import MinusIcon from '@atlaskit/icon/core/minus';
8
8
  import { HeadingItem } from '@atlaskit/menu';
9
9
  import { fg } from '@atlaskit/platform-feature-flags';
10
- // New editor controls
11
- export var getOverflowFloatingToolbarConfig = function getOverflowFloatingToolbarConfig(_ref) {
10
+ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarConfig(_ref) {
12
11
  var api = _ref.api,
13
- toolbarDocking = _ref.toolbarDocking,
14
12
  intl = _ref.intl;
15
- var isDockedToTop = toolbarDocking === 'top';
16
- var dropdownOptions = [{
17
- type: 'overflow-dropdown-heading',
18
- title: intl.formatMessage(selectionToolbarMessages.toolbarAppears)
19
- }, {
20
- title: intl.formatMessage(selectionToolbarMessages.toolbarPositionInline),
21
- onClick: function onClick() {
22
- var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
23
- if (fg('platform_editor_use_preferences_plugin')) {
24
- var _api$core$actions$exe, _api$userPreferences, _api$userPreferences$;
25
- return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.actions) === null || _api$userPreferences === void 0 || (_api$userPreferences$ = _api$userPreferences.updateUserPreference) === null || _api$userPreferences$ === void 0 ? void 0 : _api$userPreferences$.call(_api$userPreferences, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
26
- }
27
- 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
- },
29
- icon: MinusIcon({
30
- label: ''
31
- }),
32
- selected: !isDockedToTop,
33
- elemAfter: !isDockedToTop ? /*#__PURE__*/React.createElement(CheckMarkIcon, {
34
- label: "",
35
- size: "small"
36
- }) : undefined
37
- }, {
38
- title: intl.formatMessage(selectionToolbarMessages.toolbarPositionFixedAtTop),
39
- onClick: function onClick() {
40
- var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
41
- if (fg('platform_editor_use_preferences_plugin')) {
42
- var _api$core$actions$exe2, _api$userPreferences2, _api$userPreferences3;
43
- return (_api$core$actions$exe2 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences2 = api.userPreferences) === null || _api$userPreferences2 === void 0 || (_api$userPreferences2 = _api$userPreferences2.actions) === null || _api$userPreferences2 === void 0 || (_api$userPreferences3 = _api$userPreferences2.updateUserPreference) === null || _api$userPreferences3 === void 0 ? void 0 : _api$userPreferences3.call(_api$userPreferences2, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe2 !== void 0 ? _api$core$actions$exe2 : false;
44
- }
45
- 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;
46
- },
47
- icon: DockToolbarTopIcon({
48
- label: ''
49
- }),
50
- selected: isDockedToTop,
51
- elemAfter: isDockedToTop ? /*#__PURE__*/React.createElement(CheckMarkIcon, {
52
- label: "",
53
- size: "small"
54
- }) : undefined
55
- }];
56
-
57
- // testId is required to show focus on trigger button on ESC key press
58
- // see hideOnEsc in platform/packages/editor/editor-plugin-floating-toolbar/src/ui/Dropdown.tsx
59
- var testId = 'selectionToolbar-overflow-dropdown-trigger';
60
- return [{
61
- type: 'separator',
62
- fullHeight: true
63
- }, {
64
- type: 'overflow-dropdown',
65
- testId: testId,
66
- dropdownWidth: 240,
67
- options: dropdownOptions
68
- }];
69
- };
70
- export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarConfig(_ref2) {
71
- var api = _ref2.api,
72
- intl = _ref2.intl;
73
13
  return [{
74
14
  items: [{
75
15
  content: /*#__PURE__*/React.createElement(HeadingItem, null, intl.formatMessage(selectionToolbarMessages.toolbarAppears)),
@@ -83,12 +23,12 @@ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarC
83
23
  name: 'contextual'
84
24
  },
85
25
  onClick: function onClick() {
86
- var _api$selectionToolbar7, _api$selectionToolbar8, _api$selectionToolbar9;
26
+ var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
87
27
  if (fg('platform_editor_use_preferences_plugin')) {
88
- var _api$core$actions$exe3, _api$userPreferences4, _api$userPreferences5;
89
- return (_api$core$actions$exe3 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences4 = api.userPreferences) === null || _api$userPreferences4 === void 0 || (_api$userPreferences4 = _api$userPreferences4.actions) === null || _api$userPreferences4 === void 0 || (_api$userPreferences5 = _api$userPreferences4.updateUserPreference) === null || _api$userPreferences5 === void 0 ? void 0 : _api$userPreferences5.call(_api$userPreferences4, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe3 !== void 0 ? _api$core$actions$exe3 : false;
28
+ var _api$core$actions$exe, _api$userPreferences, _api$userPreferences$;
29
+ return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.actions) === null || _api$userPreferences === void 0 || (_api$userPreferences$ = _api$userPreferences.updateUserPreference) === null || _api$userPreferences$ === void 0 ? void 0 : _api$userPreferences$.call(_api$userPreferences, 'toolbarDockingPosition', 'none'))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
90
30
  }
91
- 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;
31
+ 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;
92
32
  },
93
33
  elemBefore: MinusIcon({
94
34
  label: ''
@@ -99,12 +39,12 @@ export var getOverflowPrimaryToolbarConfig = function getOverflowPrimaryToolbarC
99
39
  name: 'fixed'
100
40
  },
101
41
  onClick: function onClick() {
102
- var _api$selectionToolbar0, _api$selectionToolbar1, _api$selectionToolbar10;
42
+ var _api$selectionToolbar4, _api$selectionToolbar5, _api$selectionToolbar6;
103
43
  if (fg('platform_editor_use_preferences_plugin')) {
104
- var _api$core$actions$exe4, _api$userPreferences6, _api$userPreferences7;
105
- return (_api$core$actions$exe4 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences6 = api.userPreferences) === null || _api$userPreferences6 === void 0 || (_api$userPreferences6 = _api$userPreferences6.actions) === null || _api$userPreferences6 === void 0 || (_api$userPreferences7 = _api$userPreferences6.updateUserPreference) === null || _api$userPreferences7 === void 0 ? void 0 : _api$userPreferences7.call(_api$userPreferences6, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe4 !== void 0 ? _api$core$actions$exe4 : false;
44
+ var _api$core$actions$exe2, _api$userPreferences2, _api$userPreferences3;
45
+ return (_api$core$actions$exe2 = api === null || api === void 0 ? void 0 : api.core.actions.execute(api === null || api === void 0 || (_api$userPreferences2 = api.userPreferences) === null || _api$userPreferences2 === void 0 || (_api$userPreferences2 = _api$userPreferences2.actions) === null || _api$userPreferences2 === void 0 || (_api$userPreferences3 = _api$userPreferences2.updateUserPreference) === null || _api$userPreferences3 === void 0 ? void 0 : _api$userPreferences3.call(_api$userPreferences2, 'toolbarDockingPosition', 'top'))) !== null && _api$core$actions$exe2 !== void 0 ? _api$core$actions$exe2 : false;
106
46
  }
107
- return (_api$selectionToolbar0 = api === null || api === void 0 || (_api$selectionToolbar1 = api.selectionToolbar.actions) === null || _api$selectionToolbar1 === void 0 || (_api$selectionToolbar10 = _api$selectionToolbar1.setToolbarDocking) === null || _api$selectionToolbar10 === void 0 ? void 0 : _api$selectionToolbar10.call(_api$selectionToolbar1, 'top')) !== null && _api$selectionToolbar0 !== void 0 ? _api$selectionToolbar0 : false;
47
+ 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;
108
48
  },
109
49
  isActive: true,
110
50
  elemBefore: DockToolbarTopIcon({
package/dist/types/ui/PrimaryToolbarComponent.d.ts CHANGED
@@ -1,28 +1,13 @@
1
- /**
2
- * @jsxRuntime classic
3
- * @jsx jsx
4
- */
5
1
  /// <reference types="react" />
6
2
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
7
3
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
8
- type Props = {
9
- api?: ExtractInjectionAPI<SelectionToolbarPlugin>;
10
- popupsBoundariesElement?: HTMLElement;
11
- popupsMountPoint?: HTMLElement;
12
- popupsScrollableElement?: HTMLElement;
13
- };
14
- type PrimaryToolbarComponentNewProps = {
4
+ type PrimaryToolbarComponentProps = {
15
5
  api?: ExtractInjectionAPI<SelectionToolbarPlugin>;
16
6
  disabled?: boolean;
17
7
  };
18
- /**
19
- * A component used to renderer a dropdown with
20
- * toolbar docking options.
21
- */
22
- export declare function PrimaryToolbarComponent({ api, popupsBoundariesElement, popupsMountPoint, popupsScrollableElement, }: Props): JSX.Element;
23
8
  /**
24
9
  * A component used to renderer a pin/unpin
25
10
  * button to the toolbar to the or make it in-line.
26
11
  */
27
- export declare const PrimaryToolbarComponentNew: ({ api, disabled }: PrimaryToolbarComponentNewProps) => JSX.Element;
12
+ export declare const PrimaryToolbarComponent: ({ api, disabled }: PrimaryToolbarComponentProps) => JSX.Element;
28
13
  export {};
package/dist/types/ui/overflow-toolbar-config.d.ts CHANGED
@@ -4,7 +4,6 @@
4
4
  * @jsxFrag
5
5
  */
6
6
  import { type IntlShape } from 'react-intl-next';
7
- import type { Command, FloatingToolbarItem } from '@atlaskit/editor-common/types';
8
7
  import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
9
8
  import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
10
9
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
@@ -13,7 +12,6 @@ type OverflowToobarConfigOptions = {
13
12
  toolbarDocking?: 'top' | 'none';
14
13
  intl: IntlShape;
15
14
  };
16
- export declare const getOverflowFloatingToolbarConfig: ({ api, toolbarDocking, intl, }: OverflowToobarConfigOptions) => FloatingToolbarItem<Command>[];
17
15
  export declare const getOverflowPrimaryToolbarConfig: ({ api, intl, }: OverflowToobarConfigOptions) => {
18
16
  items: MenuItem[];
19
17
  }[];
package/dist/types-ts4.5/ui/PrimaryToolbarComponent.d.ts CHANGED
@@ -1,28 +1,13 @@
1
1
  /// <reference types="react" />
2
- /**
3
- * @jsxRuntime classic
4
- * @jsx jsx
5
- */
6
2
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
7
3
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
8
- type Props = {
9
- api?: ExtractInjectionAPI<SelectionToolbarPlugin>;
10
- popupsBoundariesElement?: HTMLElement;
11
- popupsMountPoint?: HTMLElement;
12
- popupsScrollableElement?: HTMLElement;
13
- };
14
- type PrimaryToolbarComponentNewProps = {
4
+ type PrimaryToolbarComponentProps = {
15
5
  api?: ExtractInjectionAPI<SelectionToolbarPlugin>;
16
6
  disabled?: boolean;
17
7
  };
18
- /**
19
- * A component used to renderer a dropdown with
20
- * toolbar docking options.
21
- */
22
- export declare function PrimaryToolbarComponent({ api, popupsBoundariesElement, popupsMountPoint, popupsScrollableElement, }: Props): JSX.Element;
23
8
  /**
24
9
  * A component used to renderer a pin/unpin
25
10
  * button to the toolbar to the or make it in-line.
26
11
  */
27
- export declare const PrimaryToolbarComponentNew: ({ api, disabled }: PrimaryToolbarComponentNewProps) => JSX.Element;
12
+ export declare const PrimaryToolbarComponent: ({ api, disabled }: PrimaryToolbarComponentProps) => JSX.Element;
28
13
  export {};
package/dist/types-ts4.5/ui/overflow-toolbar-config.d.ts CHANGED
@@ -4,7 +4,6 @@
4
4
  * @jsxFrag
5
5
  */
6
6
  import { type IntlShape } from 'react-intl-next';
7
- import type { Command, FloatingToolbarItem } from '@atlaskit/editor-common/types';
8
7
  import { type ExtractInjectionAPI } from '@atlaskit/editor-common/types';
9
8
  import type { MenuItem } from '@atlaskit/editor-common/ui-menu';
10
9
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
@@ -13,7 +12,6 @@ type OverflowToobarConfigOptions = {
13
12
  toolbarDocking?: 'top' | 'none';
14
13
  intl: IntlShape;
15
14
  };
16
- export declare const getOverflowFloatingToolbarConfig: ({ api, toolbarDocking, intl, }: OverflowToobarConfigOptions) => FloatingToolbarItem<Command>[];
17
15
  export declare const getOverflowPrimaryToolbarConfig: ({ api, intl, }: OverflowToobarConfigOptions) => {
18
16
  items: MenuItem[];
19
17
  }[];
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-toolbar",
3
- "version": "4.0.0",
3
+ "version": "4.1.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",
@@ -37,20 +37,20 @@
37
37
  "@atlaskit/editor-plugin-block-controls": "^4.0.0",
38
38
  "@atlaskit/editor-plugin-connectivity": "^3.0.0",
39
39
  "@atlaskit/editor-plugin-editor-viewmode": "^5.0.0",
40
- "@atlaskit/editor-plugin-primary-toolbar": "^4.0.0",
41
- "@atlaskit/editor-plugin-user-preferences": "^1.0.0",
40
+ "@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
41
+ "@atlaskit/editor-plugin-user-preferences": "^1.1.0",
42
42
  "@atlaskit/editor-prosemirror": "7.0.0",
43
- "@atlaskit/icon": "^27.2.0",
43
+ "@atlaskit/icon": "^27.3.0",
44
44
  "@atlaskit/icon-lab": "^5.1.0",
45
45
  "@atlaskit/menu": "^8.0.0",
46
46
  "@atlaskit/platform-feature-flags": "^1.1.0",
47
- "@atlaskit/tmp-editor-statsig": "^8.7.0",
48
- "@atlaskit/tokens": "^5.4.0",
47
+ "@atlaskit/tmp-editor-statsig": "^9.7.0",
48
+ "@atlaskit/tokens": "^5.5.0",
49
49
  "@babel/runtime": "^7.0.0",
50
50
  "bind-event-listener": "^3.0.0"
51
51
  },
52
52
  "peerDependencies": {
53
- "@atlaskit/editor-common": "^107.6.0",
53
+ "@atlaskit/editor-common": "^107.8.0",
54
54
  "react": "^18.2.0",
55
55
  "react-dom": "^18.2.0",
56
56
  "react-intl-next": "npm:react-intl@^5.18.1"