@atlaskit/editor-plugin-selection-toolbar 4.3.0 → 4.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,20 @@
1
1
  # @atlaskit/editor-plugin-selection-toolbar
2
2
 
3
+ ## 4.3.2
4
+
5
+ ### Patch Changes
6
+
7
+ - [#199957](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/199957)
8
+ [`5c4cd82cd1ea3`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/5c4cd82cd1ea3) -
9
+ Add unpinned version of menu item and hook up, add UiToolbarContext to primary toolbar components
10
+ - Updated dependencies
11
+
12
+ ## 4.3.1
13
+
14
+ ### Patch Changes
15
+
16
+ - Updated dependencies
17
+
3
18
  ## 4.3.0
4
19
 
5
20
  ### Minor Changes
@@ -8,12 +8,10 @@ exports.PinMenuItem = void 0;
8
8
  var _react = _interopRequireDefault(require("react"));
9
9
  var _reactIntlNext = require("react-intl-next");
10
10
  var _messages = require("@atlaskit/editor-common/messages");
11
+ var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
11
12
  var _editorToolbar = require("@atlaskit/editor-toolbar");
12
- var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
13
- var shouldShowPinMenuItem = function shouldShowPinMenuItem(api) {
14
- var _api$userPreferences, _api$selectionToolbar;
15
- var isDocked = (0, _platformFeatureFlags.fg)('platform_editor_use_preferences_plugin') ? (api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.sharedState.currentState()) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.preferences) === null || _api$userPreferences === void 0 ? void 0 : _api$userPreferences.toolbarDockingPosition) === 'top' : (api === null || api === void 0 || (_api$selectionToolbar = api.selectionToolbar.sharedState.currentState()) === null || _api$selectionToolbar === void 0 ? void 0 : _api$selectionToolbar.toolbarDocking) === 'top';
16
- return !isDocked;
13
+ var shouldShowPinMenuItem = function shouldShowPinMenuItem(editMode) {
14
+ return editMode !== 'view';
17
15
  };
18
16
  /**
19
17
  * The menu-item version of pin only appears in selection toolbar - the primary toolbar will have its own component
@@ -21,17 +19,30 @@ var shouldShowPinMenuItem = function shouldShowPinMenuItem(api) {
21
19
  var PinMenuItem = exports.PinMenuItem = function PinMenuItem(_ref) {
22
20
  var api = _ref.api;
23
21
  var intl = (0, _reactIntlNext.useIntl)();
24
- if (!shouldShowPinMenuItem(api)) {
22
+ var editMode = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'editorViewMode.mode');
23
+ var toolbarDocking = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(api, 'userPreferences.preferences.toolbarDockingPosition');
24
+ var isToolbarDocked = toolbarDocking === 'top';
25
+ if (!shouldShowPinMenuItem(editMode)) {
25
26
  return null;
26
27
  }
27
28
  var onClick = function onClick() {
28
- var _api$selectionToolbar2, _api$selectionToolbar3;
29
- 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 || _api$selectionToolbar3.call(_api$selectionToolbar2, 'top');
29
+ if (!api) {
30
+ return;
31
+ }
32
+ if (isToolbarDocked) {
33
+ var _api$selectionToolbar, _api$selectionToolbar2;
34
+ (_api$selectionToolbar = api.selectionToolbar.actions) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar2 = _api$selectionToolbar.setToolbarDocking) === null || _api$selectionToolbar2 === void 0 || _api$selectionToolbar2.call(_api$selectionToolbar, 'none');
35
+ } else {
36
+ var _api$selectionToolbar3, _api$selectionToolbar4;
37
+ (_api$selectionToolbar3 = api.selectionToolbar.actions) === null || _api$selectionToolbar3 === void 0 || (_api$selectionToolbar4 = _api$selectionToolbar3.setToolbarDocking) === null || _api$selectionToolbar4 === void 0 || _api$selectionToolbar4.call(_api$selectionToolbar3, 'top');
38
+ }
30
39
  };
31
- var message = intl.formatMessage(_messages.selectionToolbarMessages.toolbarPositionUnpinnedConcise);
40
+ var message = intl.formatMessage(isToolbarDocked ? _messages.selectionToolbarMessages.toolbarPositionPinedAtTop : _messages.selectionToolbarMessages.toolbarPositionUnpinnedConcise);
32
41
  return /*#__PURE__*/_react.default.createElement(_editorToolbar.ToolbarDropdownItem, {
33
42
  onClick: onClick,
34
- elemBefore: /*#__PURE__*/_react.default.createElement(_editorToolbar.PinIcon, {
43
+ elemBefore: isToolbarDocked ? /*#__PURE__*/_react.default.createElement(_editorToolbar.PinnedIcon, {
44
+ label: ""
45
+ }) : /*#__PURE__*/_react.default.createElement(_editorToolbar.PinIcon, {
35
46
  label: ""
36
47
  })
37
48
  }, message);
@@ -1,12 +1,10 @@
1
1
  import React from 'react';
2
2
  import { useIntl } from 'react-intl-next';
3
3
  import { selectionToolbarMessages } from '@atlaskit/editor-common/messages';
4
- import { PinIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
- import { fg } from '@atlaskit/platform-feature-flags';
6
- const shouldShowPinMenuItem = api => {
7
- var _api$userPreferences, _api$userPreferences$, _api$userPreferences$2, _api$selectionToolbar;
8
- const isDocked = fg('platform_editor_use_preferences_plugin') ? (api === null || api === void 0 ? void 0 : (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 ? void 0 : (_api$userPreferences$ = _api$userPreferences.sharedState.currentState()) === null || _api$userPreferences$ === void 0 ? void 0 : (_api$userPreferences$2 = _api$userPreferences$.preferences) === null || _api$userPreferences$2 === void 0 ? void 0 : _api$userPreferences$2.toolbarDockingPosition) === 'top' : (api === null || api === void 0 ? void 0 : (_api$selectionToolbar = api.selectionToolbar.sharedState.currentState()) === null || _api$selectionToolbar === void 0 ? void 0 : _api$selectionToolbar.toolbarDocking) === 'top';
9
- return !isDocked;
4
+ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
5
+ import { PinIcon, PinnedIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
6
+ const shouldShowPinMenuItem = editMode => {
7
+ return editMode !== 'view';
10
8
  };
11
9
  /**
12
10
  * The menu-item version of pin only appears in selection toolbar - the primary toolbar will have its own component
@@ -15,17 +13,30 @@ export const PinMenuItem = ({
15
13
  api
16
14
  }) => {
17
15
  const intl = useIntl();
18
- if (!shouldShowPinMenuItem(api)) {
16
+ const editMode = useSharedPluginStateSelector(api, 'editorViewMode.mode');
17
+ const toolbarDocking = useSharedPluginStateSelector(api, 'userPreferences.preferences.toolbarDockingPosition');
18
+ const isToolbarDocked = toolbarDocking === 'top';
19
+ if (!shouldShowPinMenuItem(editMode)) {
19
20
  return null;
20
21
  }
21
22
  const onClick = () => {
22
- var _api$selectionToolbar2, _api$selectionToolbar3;
23
- 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, 'top');
23
+ if (!api) {
24
+ return;
25
+ }
26
+ if (isToolbarDocked) {
27
+ var _api$selectionToolbar, _api$selectionToolbar2;
28
+ (_api$selectionToolbar = api.selectionToolbar.actions) === null || _api$selectionToolbar === void 0 ? void 0 : (_api$selectionToolbar2 = _api$selectionToolbar.setToolbarDocking) === null || _api$selectionToolbar2 === void 0 ? void 0 : _api$selectionToolbar2.call(_api$selectionToolbar, 'none');
29
+ } else {
30
+ var _api$selectionToolbar3, _api$selectionToolbar4;
31
+ (_api$selectionToolbar3 = api.selectionToolbar.actions) === null || _api$selectionToolbar3 === void 0 ? void 0 : (_api$selectionToolbar4 = _api$selectionToolbar3.setToolbarDocking) === null || _api$selectionToolbar4 === void 0 ? void 0 : _api$selectionToolbar4.call(_api$selectionToolbar3, 'top');
32
+ }
24
33
  };
25
- const message = intl.formatMessage(selectionToolbarMessages.toolbarPositionUnpinnedConcise);
34
+ const message = intl.formatMessage(isToolbarDocked ? selectionToolbarMessages.toolbarPositionPinedAtTop : selectionToolbarMessages.toolbarPositionUnpinnedConcise);
26
35
  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
27
36
  onClick: onClick,
28
- elemBefore: /*#__PURE__*/React.createElement(PinIcon, {
37
+ elemBefore: isToolbarDocked ? /*#__PURE__*/React.createElement(PinnedIcon, {
38
+ label: ""
39
+ }) : /*#__PURE__*/React.createElement(PinIcon, {
29
40
  label: ""
30
41
  })
31
42
  }, message);
@@ -1,12 +1,10 @@
1
1
  import React from 'react';
2
2
  import { useIntl } from 'react-intl-next';
3
3
  import { selectionToolbarMessages } from '@atlaskit/editor-common/messages';
4
- import { PinIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
5
- import { fg } from '@atlaskit/platform-feature-flags';
6
- var shouldShowPinMenuItem = function shouldShowPinMenuItem(api) {
7
- var _api$userPreferences, _api$selectionToolbar;
8
- var isDocked = fg('platform_editor_use_preferences_plugin') ? (api === null || api === void 0 || (_api$userPreferences = api.userPreferences) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.sharedState.currentState()) === null || _api$userPreferences === void 0 || (_api$userPreferences = _api$userPreferences.preferences) === null || _api$userPreferences === void 0 ? void 0 : _api$userPreferences.toolbarDockingPosition) === 'top' : (api === null || api === void 0 || (_api$selectionToolbar = api.selectionToolbar.sharedState.currentState()) === null || _api$selectionToolbar === void 0 ? void 0 : _api$selectionToolbar.toolbarDocking) === 'top';
9
- return !isDocked;
4
+ import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
5
+ import { PinIcon, PinnedIcon, ToolbarDropdownItem } from '@atlaskit/editor-toolbar';
6
+ var shouldShowPinMenuItem = function shouldShowPinMenuItem(editMode) {
7
+ return editMode !== 'view';
10
8
  };
11
9
  /**
12
10
  * The menu-item version of pin only appears in selection toolbar - the primary toolbar will have its own component
@@ -14,17 +12,30 @@ var shouldShowPinMenuItem = function shouldShowPinMenuItem(api) {
14
12
  export var PinMenuItem = function PinMenuItem(_ref) {
15
13
  var api = _ref.api;
16
14
  var intl = useIntl();
17
- if (!shouldShowPinMenuItem(api)) {
15
+ var editMode = useSharedPluginStateSelector(api, 'editorViewMode.mode');
16
+ var toolbarDocking = useSharedPluginStateSelector(api, 'userPreferences.preferences.toolbarDockingPosition');
17
+ var isToolbarDocked = toolbarDocking === 'top';
18
+ if (!shouldShowPinMenuItem(editMode)) {
18
19
  return null;
19
20
  }
20
21
  var onClick = function onClick() {
21
- var _api$selectionToolbar2, _api$selectionToolbar3;
22
- 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 || _api$selectionToolbar3.call(_api$selectionToolbar2, 'top');
22
+ if (!api) {
23
+ return;
24
+ }
25
+ if (isToolbarDocked) {
26
+ var _api$selectionToolbar, _api$selectionToolbar2;
27
+ (_api$selectionToolbar = api.selectionToolbar.actions) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar2 = _api$selectionToolbar.setToolbarDocking) === null || _api$selectionToolbar2 === void 0 || _api$selectionToolbar2.call(_api$selectionToolbar, 'none');
28
+ } else {
29
+ var _api$selectionToolbar3, _api$selectionToolbar4;
30
+ (_api$selectionToolbar3 = api.selectionToolbar.actions) === null || _api$selectionToolbar3 === void 0 || (_api$selectionToolbar4 = _api$selectionToolbar3.setToolbarDocking) === null || _api$selectionToolbar4 === void 0 || _api$selectionToolbar4.call(_api$selectionToolbar3, 'top');
31
+ }
23
32
  };
24
- var message = intl.formatMessage(selectionToolbarMessages.toolbarPositionUnpinnedConcise);
33
+ var message = intl.formatMessage(isToolbarDocked ? selectionToolbarMessages.toolbarPositionPinedAtTop : selectionToolbarMessages.toolbarPositionUnpinnedConcise);
25
34
  return /*#__PURE__*/React.createElement(ToolbarDropdownItem, {
26
35
  onClick: onClick,
27
- elemBefore: /*#__PURE__*/React.createElement(PinIcon, {
36
+ elemBefore: isToolbarDocked ? /*#__PURE__*/React.createElement(PinnedIcon, {
37
+ label: ""
38
+ }) : /*#__PURE__*/React.createElement(PinIcon, {
28
39
  label: ""
29
40
  })
30
41
  }, message);
@@ -9,10 +9,10 @@ export declare const updateToolbarDocking: ({ toolbarDocking }: {
9
9
  }) => EditorCommand;
10
10
  export declare const setToolbarDocking: ({ toolbarDocking, userPreferencesProvider, editorAnalyticsApi, }: {
11
11
  toolbarDocking: ToolbarDocking;
12
- userPreferencesProvider?: UserPreferencesProvider | undefined;
12
+ userPreferencesProvider?: UserPreferencesProvider;
13
13
  editorAnalyticsApi?: EditorAnalyticsAPI | undefined;
14
14
  }) => EditorCommand;
15
15
  export declare const forceToolbarDockingWithoutAnalytics: ({ toolbarDocking, userPreferencesProvider, }: {
16
16
  toolbarDocking: ToolbarDocking;
17
- userPreferencesProvider?: UserPreferencesProvider | undefined;
17
+ userPreferencesProvider?: UserPreferencesProvider;
18
18
  }) => EditorCommand;
@@ -2,5 +2,5 @@ import type { ExtractInjectionAPI, UserPreferencesProvider } from '@atlaskit/edi
2
2
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
3
3
  export declare const PageVisibilityWatcher: ({ api, userPreferencesProvider, }: {
4
4
  api: ExtractInjectionAPI<SelectionToolbarPlugin> | undefined;
5
- userPreferencesProvider?: UserPreferencesProvider | undefined;
5
+ userPreferencesProvider?: UserPreferencesProvider;
6
6
  }) => null;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
2
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
4
3
  type PrimaryToolbarComponentProps = {
@@ -9,10 +9,10 @@ export declare const updateToolbarDocking: ({ toolbarDocking }: {
9
9
  }) => EditorCommand;
10
10
  export declare const setToolbarDocking: ({ toolbarDocking, userPreferencesProvider, editorAnalyticsApi, }: {
11
11
  toolbarDocking: ToolbarDocking;
12
- userPreferencesProvider?: UserPreferencesProvider | undefined;
12
+ userPreferencesProvider?: UserPreferencesProvider;
13
13
  editorAnalyticsApi?: EditorAnalyticsAPI | undefined;
14
14
  }) => EditorCommand;
15
15
  export declare const forceToolbarDockingWithoutAnalytics: ({ toolbarDocking, userPreferencesProvider, }: {
16
16
  toolbarDocking: ToolbarDocking;
17
- userPreferencesProvider?: UserPreferencesProvider | undefined;
17
+ userPreferencesProvider?: UserPreferencesProvider;
18
18
  }) => EditorCommand;
@@ -2,5 +2,5 @@ import type { ExtractInjectionAPI, UserPreferencesProvider } from '@atlaskit/edi
2
2
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
3
3
  export declare const PageVisibilityWatcher: ({ api, userPreferencesProvider, }: {
4
4
  api: ExtractInjectionAPI<SelectionToolbarPlugin> | undefined;
5
- userPreferencesProvider?: UserPreferencesProvider | undefined;
5
+ userPreferencesProvider?: UserPreferencesProvider;
6
6
  }) => null;
@@ -1,4 +1,3 @@
1
- /// <reference types="react" />
2
1
  import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
3
2
  import type { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
4
3
  type PrimaryToolbarComponentProps = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-toolbar",
3
- "version": "4.3.0",
3
+ "version": "4.3.2",
4
4
  "description": "@atlaskit/editor-plugin-selection-toolbar for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -38,22 +38,22 @@
38
38
  "@atlaskit/editor-plugin-connectivity": "^3.1.0",
39
39
  "@atlaskit/editor-plugin-editor-viewmode": "^5.0.0",
40
40
  "@atlaskit/editor-plugin-primary-toolbar": "^4.1.0",
41
- "@atlaskit/editor-plugin-toolbar": "^0.1.0",
41
+ "@atlaskit/editor-plugin-toolbar": "^0.2.0",
42
42
  "@atlaskit/editor-plugin-user-preferences": "^1.2.0",
43
43
  "@atlaskit/editor-prosemirror": "7.0.0",
44
- "@atlaskit/editor-toolbar": "^0.1.0",
45
- "@atlaskit/editor-toolbar-model": "^0.0.4",
46
- "@atlaskit/icon": "^27.10.0",
44
+ "@atlaskit/editor-toolbar": "^0.2.0",
45
+ "@atlaskit/editor-toolbar-model": "^0.1.0",
46
+ "@atlaskit/icon": "^27.11.0",
47
47
  "@atlaskit/icon-lab": "^5.4.0",
48
- "@atlaskit/menu": "^8.1.0",
48
+ "@atlaskit/menu": "^8.2.0",
49
49
  "@atlaskit/platform-feature-flags": "^1.1.0",
50
- "@atlaskit/tmp-editor-statsig": "^9.25.0",
50
+ "@atlaskit/tmp-editor-statsig": "^9.27.0",
51
51
  "@atlaskit/tokens": "^6.0.0",
52
52
  "@babel/runtime": "^7.0.0",
53
53
  "bind-event-listener": "^3.0.0"
54
54
  },
55
55
  "peerDependencies": {
56
- "@atlaskit/editor-common": "^107.19.0",
56
+ "@atlaskit/editor-common": "^107.22.0",
57
57
  "react": "^18.2.0",
58
58
  "react-dom": "^18.2.0",
59
59
  "react-intl-next": "npm:react-intl@^5.18.1"