@atlaskit/editor-plugin-selection-toolbar 3.4.1 → 3.5.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
+ ## 3.5.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#141267](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/141267)
8
+ [`105e8bc4d7bd5`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/105e8bc4d7bd5) -
9
+ ED-27501 apply user preference across tabs without a refresh
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
3
15
  ## 3.4.1
4
16
 
5
17
  ### Patch Changes
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.toggleToolbar = exports.setToolbarDocking = void 0;
6
+ exports.updateToolbarDocking = exports.toggleToolbar = exports.setToolbarDocking = void 0;
7
7
  var _analytics = require("@atlaskit/editor-common/analytics");
8
8
  var _state = require("@atlaskit/editor-prosemirror/state");
9
9
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
@@ -18,12 +18,22 @@ var toggleToolbar = exports.toggleToolbar = function toggleToolbar(_ref) {
18
18
  return tr;
19
19
  };
20
20
  };
21
- var setToolbarDocking = exports.setToolbarDocking = function setToolbarDocking(_ref3) {
22
- var toolbarDocking = _ref3.toolbarDocking,
23
- userPreferencesProvider = _ref3.userPreferencesProvider,
24
- editorAnalyticsApi = _ref3.editorAnalyticsApi;
21
+ var updateToolbarDocking = exports.updateToolbarDocking = function updateToolbarDocking(_ref3) {
22
+ var toolbarDocking = _ref3.toolbarDocking;
25
23
  return function (_ref4) {
26
24
  var tr = _ref4.tr;
25
+ tr.setMeta(_pluginKey.selectionToolbarPluginKey, {
26
+ toolbarDocking: toolbarDocking
27
+ });
28
+ return tr;
29
+ };
30
+ };
31
+ var setToolbarDocking = exports.setToolbarDocking = function setToolbarDocking(_ref5) {
32
+ var toolbarDocking = _ref5.toolbarDocking,
33
+ userPreferencesProvider = _ref5.userPreferencesProvider,
34
+ editorAnalyticsApi = _ref5.editorAnalyticsApi;
35
+ return function (_ref6) {
36
+ var tr = _ref6.tr;
27
37
  // We currently ignore any update failures, need to confirm this is the desired behaviour
28
38
  userPreferencesProvider === null || userPreferencesProvider === void 0 || userPreferencesProvider.updatePreference('toolbarDockingInitialPosition', toolbarDocking);
29
39
  tr.setMeta(_pluginKey.selectionToolbarPluginKey, {
@@ -18,10 +18,11 @@ 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
20
  var _overflowToolbarConfig = require("./ui/overflow-toolbar-config");
21
+ var _PageVisibilityWatcher = require("./ui/PageVisibilityWatcher");
21
22
  var _PrimaryToolbarComponent = require("./ui/PrimaryToolbarComponent");
22
23
  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; }
23
24
  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; }
24
- var getInitialToolbarDocking = function getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
25
+ var getToolbarDocking = function getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
25
26
  if (contextualFormattingEnabled && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
26
27
  var _userPreferencesProvi;
27
28
  return (_userPreferencesProvi = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) !== null && _userPreferencesProvi !== void 0 ? _userPreferencesProvi : 'none';
@@ -79,6 +80,16 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
79
80
  userPreferencesProvider: userPreferencesProvider,
80
81
  editorAnalyticsApi: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
81
82
  }))) !== null && _api$core$actions$exe3 !== void 0 ? _api$core$actions$exe3 : false;
83
+ },
84
+ refreshToolbarDocking: function refreshToolbarDocking() {
85
+ if (userPreferencesProvider) {
86
+ var _api$core$actions$exe4;
87
+ var userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
88
+ return (_api$core$actions$exe4 = api === null || api === void 0 ? void 0 : api.core.actions.execute((0, _commands.updateToolbarDocking)({
89
+ toolbarDocking: userToolbarDockingPref
90
+ }))) !== null && _api$core$actions$exe4 !== void 0 ? _api$core$actions$exe4 : false;
91
+ }
92
+ return false;
82
93
  }
83
94
  },
84
95
  getSharedState: function getSharedState(editorState) {
@@ -101,7 +112,7 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
101
112
  return {
102
113
  selectionStable: false,
103
114
  hide: false,
104
- toolbarDocking: getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
115
+ toolbarDocking: getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
105
116
  };
106
117
  },
107
118
  apply: function apply(tr, pluginState) {
@@ -117,7 +128,7 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
117
128
  var toolbarDockingPreference = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition');
118
129
  if (toolbarDockingPreference && toolbarDockingPreference !== previousToolbarDocking) {
119
130
  previousToolbarDocking = toolbarDockingPreference;
120
- var userToolbarDockingPref = getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
131
+ var userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
121
132
  if (pluginState.toolbarDocking !== userToolbarDockingPref) {
122
133
  return _objectSpread(_objectSpread({}, pluginState), {}, {
123
134
  toolbarDocking: userToolbarDockingPref
@@ -165,7 +176,7 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
165
176
  if (toolbarDockingPreference !== undefined) {
166
177
  var _api$analytics2;
167
178
  isPreferenceInitialized = true;
168
- var userToolbarDockingPref = getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
179
+ var userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
169
180
  var tr = newState.tr;
170
181
  if (!(0, _platformFeatureFlags.fg)('platform_editor_controls_patch_4')) {
171
182
  tr.setMeta(_pluginKey.selectionToolbarPluginKey, {
@@ -309,6 +320,12 @@ var selectionToolbarPlugin = exports.selectionToolbarPlugin = function selection
309
320
  });
310
321
  }
311
322
  },
323
+ contentComponent: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_user_preferences_provider_update') ? function () {
324
+ return /*#__PURE__*/_react.default.createElement(_PageVisibilityWatcher.PageVisibilityWatcher, {
325
+ api: api,
326
+ userPreferencesProvider: userPreferencesProvider
327
+ });
328
+ } : undefined,
312
329
  primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1', {
313
330
  exposure: true
314
331
  }) ? primaryToolbarComponent : undefined
@@ -0,0 +1,60 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.PageVisibilityWatcher = void 0;
8
+ var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
9
+ var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
10
+ var _react = require("react");
11
+ var _bindEventListener = require("bind-event-listener");
12
+ var _monitoring = require("@atlaskit/editor-common/monitoring");
13
+ var PageVisibilityWatcher = exports.PageVisibilityWatcher = function PageVisibilityWatcher(_ref) {
14
+ var api = _ref.api,
15
+ userPreferencesProvider = _ref.userPreferencesProvider;
16
+ (0, _react.useEffect)(function () {
17
+ if (!userPreferencesProvider || !api) {
18
+ return;
19
+ }
20
+ return (0, _bindEventListener.bind)(document, {
21
+ type: 'visibilitychange',
22
+ listener: function () {
23
+ var _listener = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
24
+ var _api$selectionToolbar, _api$selectionToolbar2;
25
+ return _regenerator.default.wrap(function _callee$(_context) {
26
+ while (1) switch (_context.prev = _context.next) {
27
+ case 0:
28
+ if (!(document.visibilityState === 'visible')) {
29
+ _context.next = 10;
30
+ break;
31
+ }
32
+ _context.prev = 1;
33
+ _context.next = 4;
34
+ return userPreferencesProvider.loadPreferences();
35
+ case 4:
36
+ _context.next = 9;
37
+ break;
38
+ case 6:
39
+ _context.prev = 6;
40
+ _context.t0 = _context["catch"](1);
41
+ (0, _monitoring.logException)(_context.t0, {
42
+ location: 'editor-plugin-selection-toolbar/PageVisibilityWatcher'
43
+ });
44
+ case 9:
45
+ api === null || api === void 0 || (_api$selectionToolbar = api.selectionToolbar) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar = _api$selectionToolbar.actions) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar2 = _api$selectionToolbar.refreshToolbarDocking) === null || _api$selectionToolbar2 === void 0 || _api$selectionToolbar2.call(_api$selectionToolbar);
46
+ case 10:
47
+ case "end":
48
+ return _context.stop();
49
+ }
50
+ }, _callee, null, [[1, 6]]);
51
+ }));
52
+ function listener() {
53
+ return _listener.apply(this, arguments);
54
+ }
55
+ return listener;
56
+ }()
57
+ });
58
+ }, [api, userPreferencesProvider]);
59
+ return null;
60
+ };
@@ -12,6 +12,16 @@ export const toggleToolbar = ({
12
12
  });
13
13
  return tr;
14
14
  };
15
+ export const updateToolbarDocking = ({
16
+ toolbarDocking
17
+ }) => ({
18
+ tr
19
+ }) => {
20
+ tr.setMeta(selectionToolbarPluginKey, {
21
+ toolbarDocking
22
+ });
23
+ return tr;
24
+ };
15
25
  export const setToolbarDocking = ({
16
26
  toolbarDocking,
17
27
  userPreferencesProvider,
@@ -6,11 +6,12 @@ import { calculateToolbarPositionAboveSelection, calculateToolbarPositionOnCellS
6
6
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
7
7
  import { fg } from '@atlaskit/platform-feature-flags';
8
8
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
9
- import { setToolbarDocking, toggleToolbar } from './pm-plugins/commands';
9
+ import { setToolbarDocking, toggleToolbar, updateToolbarDocking } from './pm-plugins/commands';
10
10
  import { selectionToolbarPluginKey } from './pm-plugins/plugin-key';
11
11
  import { getOverflowFloatingToolbarConfig } from './ui/overflow-toolbar-config';
12
+ import { PageVisibilityWatcher } from './ui/PageVisibilityWatcher';
12
13
  import { PrimaryToolbarComponent } from './ui/PrimaryToolbarComponent';
13
- const getInitialToolbarDocking = (contextualFormattingEnabled, userPreferencesProvider) => {
14
+ const getToolbarDocking = (contextualFormattingEnabled, userPreferencesProvider) => {
14
15
  if (contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
15
16
  var _userPreferencesProvi;
16
17
  return (_userPreferencesProvi = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) !== null && _userPreferencesProvi !== void 0 ? _userPreferencesProvi : 'none';
@@ -70,6 +71,16 @@ export const selectionToolbarPlugin = ({
70
71
  userPreferencesProvider,
71
72
  editorAnalyticsApi: api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
72
73
  }))) !== null && _api$core$actions$exe3 !== void 0 ? _api$core$actions$exe3 : false;
74
+ },
75
+ refreshToolbarDocking: () => {
76
+ if (userPreferencesProvider) {
77
+ var _api$core$actions$exe4;
78
+ const userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
79
+ return (_api$core$actions$exe4 = api === null || api === void 0 ? void 0 : api.core.actions.execute(updateToolbarDocking({
80
+ toolbarDocking: userToolbarDockingPref
81
+ }))) !== null && _api$core$actions$exe4 !== void 0 ? _api$core$actions$exe4 : false;
82
+ }
83
+ return false;
73
84
  }
74
85
  },
75
86
  getSharedState(editorState) {
@@ -92,7 +103,7 @@ export const selectionToolbarPlugin = ({
92
103
  return {
93
104
  selectionStable: false,
94
105
  hide: false,
95
- toolbarDocking: getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
106
+ toolbarDocking: getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
96
107
  };
97
108
  },
98
109
  apply(tr, pluginState) {
@@ -111,7 +122,7 @@ export const selectionToolbarPlugin = ({
111
122
  const toolbarDockingPreference = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition');
112
123
  if (toolbarDockingPreference && toolbarDockingPreference !== previousToolbarDocking) {
113
124
  previousToolbarDocking = toolbarDockingPreference;
114
- const userToolbarDockingPref = getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
125
+ const userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
115
126
  if (pluginState.toolbarDocking !== userToolbarDockingPref) {
116
127
  return {
117
128
  ...pluginState,
@@ -160,7 +171,7 @@ export const selectionToolbarPlugin = ({
160
171
  if (toolbarDockingPreference !== undefined) {
161
172
  var _api$analytics2;
162
173
  isPreferenceInitialized = true;
163
- const userToolbarDockingPref = getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
174
+ const userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
164
175
  const tr = newState.tr;
165
176
  if (!fg('platform_editor_controls_patch_4')) {
166
177
  tr.setMeta(selectionToolbarPluginKey, {
@@ -301,6 +312,10 @@ export const selectionToolbarPlugin = ({
301
312
  };
302
313
  }
303
314
  },
315
+ contentComponent: editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_user_preferences_provider_update') ? () => /*#__PURE__*/React.createElement(PageVisibilityWatcher, {
316
+ api: api,
317
+ userPreferencesProvider: userPreferencesProvider
318
+ }) : undefined,
304
319
  primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) && editorExperiment('platform_editor_controls', 'variant1', {
305
320
  exposure: true
306
321
  }) ? primaryToolbarComponent : undefined
@@ -0,0 +1,30 @@
1
+ import { useEffect } from 'react';
2
+ import { bind } from 'bind-event-listener';
3
+ import { logException } from '@atlaskit/editor-common/monitoring';
4
+ export const PageVisibilityWatcher = ({
5
+ api,
6
+ userPreferencesProvider
7
+ }) => {
8
+ useEffect(() => {
9
+ if (!userPreferencesProvider || !api) {
10
+ return;
11
+ }
12
+ return bind(document, {
13
+ type: 'visibilitychange',
14
+ listener: async () => {
15
+ if (document.visibilityState === 'visible') {
16
+ var _api$selectionToolbar, _api$selectionToolbar2, _api$selectionToolbar3;
17
+ try {
18
+ await userPreferencesProvider.loadPreferences();
19
+ } catch (error) {
20
+ logException(error, {
21
+ location: 'editor-plugin-selection-toolbar/PageVisibilityWatcher'
22
+ });
23
+ }
24
+ api === null || api === void 0 ? void 0 : (_api$selectionToolbar = api.selectionToolbar) === null || _api$selectionToolbar === void 0 ? void 0 : (_api$selectionToolbar2 = _api$selectionToolbar.actions) === null || _api$selectionToolbar2 === void 0 ? void 0 : (_api$selectionToolbar3 = _api$selectionToolbar2.refreshToolbarDocking) === null || _api$selectionToolbar3 === void 0 ? void 0 : _api$selectionToolbar3.call(_api$selectionToolbar2);
25
+ }
26
+ }
27
+ });
28
+ }, [api, userPreferencesProvider]);
29
+ return null;
30
+ };
@@ -12,12 +12,22 @@ export var toggleToolbar = function toggleToolbar(_ref) {
12
12
  return tr;
13
13
  };
14
14
  };
15
- export var setToolbarDocking = function setToolbarDocking(_ref3) {
16
- var toolbarDocking = _ref3.toolbarDocking,
17
- userPreferencesProvider = _ref3.userPreferencesProvider,
18
- editorAnalyticsApi = _ref3.editorAnalyticsApi;
15
+ export var updateToolbarDocking = function updateToolbarDocking(_ref3) {
16
+ var toolbarDocking = _ref3.toolbarDocking;
19
17
  return function (_ref4) {
20
18
  var tr = _ref4.tr;
19
+ tr.setMeta(selectionToolbarPluginKey, {
20
+ toolbarDocking: toolbarDocking
21
+ });
22
+ return tr;
23
+ };
24
+ };
25
+ export var setToolbarDocking = function setToolbarDocking(_ref5) {
26
+ var toolbarDocking = _ref5.toolbarDocking,
27
+ userPreferencesProvider = _ref5.userPreferencesProvider,
28
+ editorAnalyticsApi = _ref5.editorAnalyticsApi;
29
+ return function (_ref6) {
30
+ var tr = _ref6.tr;
21
31
  // We currently ignore any update failures, need to confirm this is the desired behaviour
22
32
  userPreferencesProvider === null || userPreferencesProvider === void 0 || userPreferencesProvider.updatePreference('toolbarDockingInitialPosition', toolbarDocking);
23
33
  tr.setMeta(selectionToolbarPluginKey, {
@@ -10,11 +10,12 @@ import { calculateToolbarPositionAboveSelection, calculateToolbarPositionOnCellS
10
10
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
11
11
  import { fg } from '@atlaskit/platform-feature-flags';
12
12
  import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
13
- import { setToolbarDocking as _setToolbarDocking, toggleToolbar } from './pm-plugins/commands';
13
+ import { setToolbarDocking as _setToolbarDocking, toggleToolbar, updateToolbarDocking } from './pm-plugins/commands';
14
14
  import { selectionToolbarPluginKey } from './pm-plugins/plugin-key';
15
15
  import { getOverflowFloatingToolbarConfig } from './ui/overflow-toolbar-config';
16
+ import { PageVisibilityWatcher } from './ui/PageVisibilityWatcher';
16
17
  import { PrimaryToolbarComponent } from './ui/PrimaryToolbarComponent';
17
- var getInitialToolbarDocking = function getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
18
+ var getToolbarDocking = function getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider) {
18
19
  if (contextualFormattingEnabled && editorExperiment('platform_editor_controls', 'variant1')) {
19
20
  var _userPreferencesProvi;
20
21
  return (_userPreferencesProvi = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition')) !== null && _userPreferencesProvi !== void 0 ? _userPreferencesProvi : 'none';
@@ -72,6 +73,16 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
72
73
  userPreferencesProvider: userPreferencesProvider,
73
74
  editorAnalyticsApi: api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.actions
74
75
  }))) !== null && _api$core$actions$exe3 !== void 0 ? _api$core$actions$exe3 : false;
76
+ },
77
+ refreshToolbarDocking: function refreshToolbarDocking() {
78
+ if (userPreferencesProvider) {
79
+ var _api$core$actions$exe4;
80
+ var userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
81
+ return (_api$core$actions$exe4 = api === null || api === void 0 ? void 0 : api.core.actions.execute(updateToolbarDocking({
82
+ toolbarDocking: userToolbarDockingPref
83
+ }))) !== null && _api$core$actions$exe4 !== void 0 ? _api$core$actions$exe4 : false;
84
+ }
85
+ return false;
75
86
  }
76
87
  },
77
88
  getSharedState: function getSharedState(editorState) {
@@ -94,7 +105,7 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
94
105
  return {
95
106
  selectionStable: false,
96
107
  hide: false,
97
- toolbarDocking: getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
108
+ toolbarDocking: getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider)
98
109
  };
99
110
  },
100
111
  apply: function apply(tr, pluginState) {
@@ -110,7 +121,7 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
110
121
  var toolbarDockingPreference = userPreferencesProvider === null || userPreferencesProvider === void 0 ? void 0 : userPreferencesProvider.getPreference('toolbarDockingInitialPosition');
111
122
  if (toolbarDockingPreference && toolbarDockingPreference !== previousToolbarDocking) {
112
123
  previousToolbarDocking = toolbarDockingPreference;
113
- var userToolbarDockingPref = getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
124
+ var userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
114
125
  if (pluginState.toolbarDocking !== userToolbarDockingPref) {
115
126
  return _objectSpread(_objectSpread({}, pluginState), {}, {
116
127
  toolbarDocking: userToolbarDockingPref
@@ -158,7 +169,7 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
158
169
  if (toolbarDockingPreference !== undefined) {
159
170
  var _api$analytics2;
160
171
  isPreferenceInitialized = true;
161
- var userToolbarDockingPref = getInitialToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
172
+ var userToolbarDockingPref = getToolbarDocking(contextualFormattingEnabled, userPreferencesProvider);
162
173
  var tr = newState.tr;
163
174
  if (!fg('platform_editor_controls_patch_4')) {
164
175
  tr.setMeta(selectionToolbarPluginKey, {
@@ -302,6 +313,12 @@ export var selectionToolbarPlugin = function selectionToolbarPlugin(_ref) {
302
313
  });
303
314
  }
304
315
  },
316
+ contentComponent: editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_user_preferences_provider_update') ? function () {
317
+ return /*#__PURE__*/React.createElement(PageVisibilityWatcher, {
318
+ api: api,
319
+ userPreferencesProvider: userPreferencesProvider
320
+ });
321
+ } : undefined,
305
322
  primaryToolbarComponent: !(api !== null && api !== void 0 && api.primaryToolbar) && editorExperiment('platform_editor_controls', 'variant1', {
306
323
  exposure: true
307
324
  }) ? primaryToolbarComponent : undefined
@@ -0,0 +1,53 @@
1
+ import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
2
+ import _regeneratorRuntime from "@babel/runtime/regenerator";
3
+ import { useEffect } from 'react';
4
+ import { bind } from 'bind-event-listener';
5
+ import { logException } from '@atlaskit/editor-common/monitoring';
6
+ export var PageVisibilityWatcher = function PageVisibilityWatcher(_ref) {
7
+ var api = _ref.api,
8
+ userPreferencesProvider = _ref.userPreferencesProvider;
9
+ useEffect(function () {
10
+ if (!userPreferencesProvider || !api) {
11
+ return;
12
+ }
13
+ return bind(document, {
14
+ type: 'visibilitychange',
15
+ listener: function () {
16
+ var _listener = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
17
+ var _api$selectionToolbar, _api$selectionToolbar2;
18
+ return _regeneratorRuntime.wrap(function _callee$(_context) {
19
+ while (1) switch (_context.prev = _context.next) {
20
+ case 0:
21
+ if (!(document.visibilityState === 'visible')) {
22
+ _context.next = 10;
23
+ break;
24
+ }
25
+ _context.prev = 1;
26
+ _context.next = 4;
27
+ return userPreferencesProvider.loadPreferences();
28
+ case 4:
29
+ _context.next = 9;
30
+ break;
31
+ case 6:
32
+ _context.prev = 6;
33
+ _context.t0 = _context["catch"](1);
34
+ logException(_context.t0, {
35
+ location: 'editor-plugin-selection-toolbar/PageVisibilityWatcher'
36
+ });
37
+ case 9:
38
+ api === null || api === void 0 || (_api$selectionToolbar = api.selectionToolbar) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar = _api$selectionToolbar.actions) === null || _api$selectionToolbar === void 0 || (_api$selectionToolbar2 = _api$selectionToolbar.refreshToolbarDocking) === null || _api$selectionToolbar2 === void 0 || _api$selectionToolbar2.call(_api$selectionToolbar);
39
+ case 10:
40
+ case "end":
41
+ return _context.stop();
42
+ }
43
+ }, _callee, null, [[1, 6]]);
44
+ }));
45
+ function listener() {
46
+ return _listener.apply(this, arguments);
47
+ }
48
+ return listener;
49
+ }()
50
+ });
51
+ }, [api, userPreferencesProvider]);
52
+ return null;
53
+ };
@@ -4,6 +4,9 @@ import type { ToolbarDocking } from '../types';
4
4
  export declare const toggleToolbar: ({ hide }: {
5
5
  hide: boolean;
6
6
  }) => EditorCommand;
7
+ export declare const updateToolbarDocking: ({ toolbarDocking }: {
8
+ toolbarDocking: ToolbarDocking;
9
+ }) => EditorCommand;
7
10
  export declare const setToolbarDocking: ({ toolbarDocking, userPreferencesProvider, editorAnalyticsApi, }: {
8
11
  toolbarDocking: ToolbarDocking;
9
12
  userPreferencesProvider?: UserPreferencesProvider | undefined;
@@ -25,5 +25,6 @@ export type SelectionToolbarPlugin = NextEditorPlugin<'selectionToolbar', {
25
25
  suppressToolbar?: () => boolean;
26
26
  unsuppressToolbar?: () => boolean;
27
27
  setToolbarDocking?: (toolbarDocking: ToolbarDocking) => boolean;
28
+ refreshToolbarDocking?: () => boolean;
28
29
  };
29
30
  }>;
@@ -0,0 +1,6 @@
1
+ import { ExtractInjectionAPI, UserPreferencesProvider } from '@atlaskit/editor-common/types';
2
+ import { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
3
+ export declare const PageVisibilityWatcher: ({ api, userPreferencesProvider, }: {
4
+ api: ExtractInjectionAPI<SelectionToolbarPlugin> | undefined;
5
+ userPreferencesProvider?: UserPreferencesProvider | undefined;
6
+ }) => null;
@@ -4,6 +4,9 @@ import type { ToolbarDocking } from '../types';
4
4
  export declare const toggleToolbar: ({ hide }: {
5
5
  hide: boolean;
6
6
  }) => EditorCommand;
7
+ export declare const updateToolbarDocking: ({ toolbarDocking }: {
8
+ toolbarDocking: ToolbarDocking;
9
+ }) => EditorCommand;
7
10
  export declare const setToolbarDocking: ({ toolbarDocking, userPreferencesProvider, editorAnalyticsApi, }: {
8
11
  toolbarDocking: ToolbarDocking;
9
12
  userPreferencesProvider?: UserPreferencesProvider | undefined;
@@ -25,5 +25,6 @@ export type SelectionToolbarPlugin = NextEditorPlugin<'selectionToolbar', {
25
25
  suppressToolbar?: () => boolean;
26
26
  unsuppressToolbar?: () => boolean;
27
27
  setToolbarDocking?: (toolbarDocking: ToolbarDocking) => boolean;
28
+ refreshToolbarDocking?: () => boolean;
28
29
  };
29
30
  }>;
@@ -0,0 +1,6 @@
1
+ import { ExtractInjectionAPI, UserPreferencesProvider } from '@atlaskit/editor-common/types';
2
+ import { SelectionToolbarPlugin } from '../selectionToolbarPluginType';
3
+ export declare const PageVisibilityWatcher: ({ api, userPreferencesProvider, }: {
4
+ api: ExtractInjectionAPI<SelectionToolbarPlugin> | undefined;
5
+ userPreferencesProvider?: UserPreferencesProvider | undefined;
6
+ }) => null;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-selection-toolbar",
3
- "version": "3.4.1",
3
+ "version": "3.5.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",
@@ -34,7 +34,7 @@
34
34
  },
35
35
  "dependencies": {
36
36
  "@atlaskit/css": "^0.10.0",
37
- "@atlaskit/editor-common": "^103.7.0",
37
+ "@atlaskit/editor-common": "^103.8.0",
38
38
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
39
39
  "@atlaskit/editor-plugin-block-controls": "^3.10.0",
40
40
  "@atlaskit/editor-plugin-editor-viewmode": "^3.1.0",
@@ -44,8 +44,8 @@
44
44
  "@atlaskit/icon-lab": "^4.8.0",
45
45
  "@atlaskit/menu": "^3.2.0",
46
46
  "@atlaskit/platform-feature-flags": "^1.1.0",
47
- "@atlaskit/tmp-editor-statsig": "^4.8.0",
48
- "@atlaskit/tokens": "^4.7.0",
47
+ "@atlaskit/tmp-editor-statsig": "^4.9.0",
48
+ "@atlaskit/tokens": "^4.8.0",
49
49
  "@babel/runtime": "^7.0.0",
50
50
  "bind-event-listener": "^3.0.0"
51
51
  },
@@ -95,6 +95,9 @@
95
95
  }
96
96
  },
97
97
  "platform-feature-flags": {
98
+ "platform_editor_user_preferences_provider_update": {
99
+ "type": "boolean"
100
+ },
98
101
  "platform_editor_controls_patch_2": {
99
102
  "type": "boolean"
100
103
  },