@atlaskit/editor-plugin-insert-block 16.0.14 → 16.0.15

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 (11) hide show
  1. package/CHANGELOG.md +9 -0
  2. package/dist/cjs/insertBlockPlugin.js +19 -64
  3. package/dist/cjs/ui/ToolbarInsertBlock/create-items.js +27 -60
  4. package/dist/cjs/ui/toolbar-components/EmojiButton.js +4 -13
  5. package/dist/es2019/insertBlockPlugin.js +19 -64
  6. package/dist/es2019/ui/ToolbarInsertBlock/create-items.js +27 -60
  7. package/dist/es2019/ui/toolbar-components/EmojiButton.js +4 -13
  8. package/dist/esm/insertBlockPlugin.js +19 -64
  9. package/dist/esm/ui/ToolbarInsertBlock/create-items.js +27 -60
  10. package/dist/esm/ui/toolbar-components/EmojiButton.js +4 -13
  11. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,14 @@
1
1
  # @atlaskit/editor-plugin-insert-block
2
2
 
3
+ ## 16.0.15
4
+
5
+ ### Patch Changes
6
+
7
+ - [`b4c4cd8f205e4`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/b4c4cd8f205e4) -
8
+ Clean up experiment `platform_editor_prevent_toolbar_layout_shifts` and keep the enabled toolbar
9
+ layout behavior.
10
+ - Updated dependencies
11
+
3
12
  ## 16.0.14
4
13
 
5
14
  ### Patch Changes
package/dist/cjs/insertBlockPlugin.js CHANGED
@@ -10,13 +10,11 @@ var _react = _interopRequireWildcard(require("react"));
10
10
  var _analytics = require("@atlaskit/editor-common/analytics");
11
11
  var _elementBrowser = require("@atlaskit/editor-common/element-browser");
12
12
  var _hooks = require("@atlaskit/editor-common/hooks");
13
- var _providerFactory = require("@atlaskit/editor-common/provider-factory");
14
13
  var _types = require("@atlaskit/editor-common/types");
15
14
  var _useSharedPluginStateSelector = require("@atlaskit/editor-common/use-shared-plugin-state-selector");
16
15
  var _consts = require("@atlaskit/editor-plugin-block-type/consts");
17
16
  var _editorPluginConnectivity = require("@atlaskit/editor-plugin-connectivity");
18
17
  var _fg = require("@atlaskit/platform-feature-flags/fg");
19
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
20
18
  var _toolbarActionExperiences = require("./pm-plugins/experiences/toolbar-action-experiences");
21
19
  var _toggleInsertBlock = require("./pm-plugins/toggleInsertBlock");
22
20
  var _toolbarComponents = require("./ui/toolbar-components");
@@ -123,55 +121,24 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
123
121
  isToolbarReducedSpacing = _ref2.isToolbarReducedSpacing,
124
122
  isLastItem = _ref2.isLastItem;
125
123
  refs.popupsMountPoint = popupsMountPoint || undefined;
126
- var renderNode = function renderNode(providers) {
127
- if (!editorView) {
128
- return null;
129
- }
130
- return /*#__PURE__*/_react.default.createElement(ToolbarInsertBlockWithInjectionApi, {
131
- pluginInjectionApi: api,
132
- editorView: editorView,
133
- editorActions: editorActions,
134
- dispatchAnalyticsEvent: dispatchAnalyticsEvent,
135
- providerFactory: providerFactory,
136
- popupsMountPoint: popupsMountPoint,
137
- popupsBoundariesElement: popupsBoundariesElement,
138
- popupsScrollableElement: popupsScrollableElement,
139
- toolbarSize: toolbarSize,
140
- disabled: disabled,
141
- isToolbarReducedSpacing: isToolbarReducedSpacing,
142
- isLastItem: isLastItem,
143
- providers: providers,
144
- options: options,
145
- appearance: options.appearance
146
- });
147
- };
148
- if ((0, _experiments.editorExperiment)('platform_editor_prevent_toolbar_layout_shifts', true)) {
149
- if (!editorView) {
150
- return null;
151
- }
152
- return /*#__PURE__*/_react.default.createElement(ToolbarInsertBlockWithInjectionApi, {
153
- pluginInjectionApi: api,
154
- editorView: editorView,
155
- editorActions: editorActions,
156
- dispatchAnalyticsEvent: dispatchAnalyticsEvent,
157
- providerFactory: providerFactory,
158
- popupsMountPoint: popupsMountPoint,
159
- popupsBoundariesElement: popupsBoundariesElement,
160
- popupsScrollableElement: popupsScrollableElement,
161
- toolbarSize: toolbarSize,
162
- disabled: disabled,
163
- isToolbarReducedSpacing: isToolbarReducedSpacing,
164
- isLastItem: isLastItem,
165
- options: options,
166
- appearance: options.appearance
167
- });
124
+ if (!editorView) {
125
+ return null;
168
126
  }
169
- return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
170
- providerFactory: providerFactory
171
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
172
- ,
173
- providers: ['emojiProvider'],
174
- renderNode: renderNode
127
+ return /*#__PURE__*/_react.default.createElement(ToolbarInsertBlockWithInjectionApi, {
128
+ pluginInjectionApi: api,
129
+ editorView: editorView,
130
+ editorActions: editorActions,
131
+ dispatchAnalyticsEvent: dispatchAnalyticsEvent,
132
+ providerFactory: providerFactory,
133
+ popupsMountPoint: popupsMountPoint,
134
+ popupsBoundariesElement: popupsBoundariesElement,
135
+ popupsScrollableElement: popupsScrollableElement,
136
+ toolbarSize: toolbarSize,
137
+ disabled: disabled,
138
+ isToolbarReducedSpacing: isToolbarReducedSpacing,
139
+ isLastItem: isLastItem,
140
+ options: options,
141
+ appearance: options.appearance
175
142
  });
176
143
  };
177
144
  if (isToolbarAIFCEnabled) {
@@ -252,9 +219,8 @@ var insertBlockPlugin = exports.insertBlockPlugin = function insertBlockPlugin(_
252
219
  return plugin;
253
220
  };
254
221
  var selector = function selector(states) {
255
- var _states$emojiState, _states$mediaState, _states$mediaState2, _states$insertBlockSt, _states$typeAheadStat, _states$mentionState, _states$mentionState2, _states$dateState, _states$placeholderTe, _states$connectivityS, _states$imageUploadSt, _states$blockTypeStat, _states$hyperlinkStat, _states$hyperlinkStat2;
222
+ var _states$mediaState, _states$mediaState2, _states$insertBlockSt, _states$typeAheadStat, _states$mentionState, _states$mentionState2, _states$dateState, _states$placeholderTe, _states$connectivityS, _states$imageUploadSt, _states$blockTypeStat, _states$hyperlinkStat, _states$hyperlinkStat2;
256
223
  return {
257
- emojiProviderSelector: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProvider,
258
224
  showMediaPicker: (_states$mediaState = states.mediaState) === null || _states$mediaState === void 0 ? void 0 : _states$mediaState.showMediaPicker,
259
225
  mediaAllowsUploads: (_states$mediaState2 = states.mediaState) === null || _states$mediaState2 === void 0 ? void 0 : _states$mediaState2.allowsUploads,
260
226
  showElementBrowser: (_states$insertBlockSt = states.insertBlockState) === null || _states$insertBlockSt === void 0 ? void 0 : _states$insertBlockSt.showElementBrowser,
@@ -287,7 +253,6 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
287
253
  appearance = _ref4.appearance;
288
254
  var buttons = toolbarSizeToButtons(toolbarSize, appearance);
289
255
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media', 'typeAhead', 'placeholderText', 'insertBlock', 'connectivity'], selector),
290
- emojiProviderSelector = _useSharedPluginState.emojiProviderSelector,
291
256
  showMediaPicker = _useSharedPluginState.showMediaPicker,
292
257
  mediaAllowsUploads = _useSharedPluginState.mediaAllowsUploads,
293
258
  showElementBrowser = _useSharedPluginState.showElementBrowser,
@@ -301,17 +266,7 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
301
266
  availableWrapperBlockTypes = _useSharedPluginState.availableWrapperBlockTypes,
302
267
  canInsertLink = _useSharedPluginState.canInsertLink,
303
268
  activeLinkMark = _useSharedPluginState.activeLinkMark;
304
- var emojiProviderPromise = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'emoji.emojiProviderPromise', {
305
- disabled: !(0, _experiments.editorExperiment)('platform_editor_prevent_toolbar_layout_shifts', true)
306
- });
307
- var getEmojiProvider = function getEmojiProvider() {
308
- if (emojiProviderSelector) {
309
- return Promise.resolve(emojiProviderSelector);
310
- }
311
- };
312
- var emojiProvider = (0, _experiments.editorExperiment)('platform_editor_prevent_toolbar_layout_shifts', true, {
313
- exposure: true
314
- }) ? emojiProviderPromise : getEmojiProvider();
269
+ var emojiProvider = (0, _useSharedPluginStateSelector.useSharedPluginStateSelector)(pluginInjectionApi, 'emoji.emojiProviderPromise');
315
270
  var onShowMediaPicker = function onShowMediaPicker(mountInfo) {
316
271
  var _pluginInjectionApi$m, _pluginInjectionApi$c, _pluginInjectionApi$m2;
317
272
  if (!showMediaPicker) {
package/dist/cjs/ui/ToolbarInsertBlock/create-items.js CHANGED
@@ -13,7 +13,6 @@ var _memoizeOne = _interopRequireDefault(require("memoize-one"));
13
13
  var _keymaps = require("@atlaskit/editor-common/keymaps");
14
14
  var _messages = require("@atlaskit/editor-common/messages");
15
15
  var _fg = require("@atlaskit/platform-feature-flags/fg");
16
- var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
17
16
  var _item = require("./item");
18
17
  var _shallowEquals = require("./shallow-equals");
19
18
  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; }
@@ -85,65 +84,33 @@ var createInsertBlockItems = function createInsertBlockItems(config) {
85
84
  'aria-haspopup': 'dialog'
86
85
  }));
87
86
  }
88
- if ((0, _experiments.editorExperiment)('platform_editor_prevent_toolbar_layout_shifts', true)) {
89
- if (imageUploadSupported) {
90
- items.push((0, _item.imageUpload)({
91
- content: formatMessage(_messages.toolbarInsertBlockMessages.image),
92
- disabled: !imageUploadEnabled || isOffline
93
- }));
94
- } else if (hasMediaPlugin) {
95
- items.push((0, _item.media)({
96
- content: formatMessage(_messages.toolbarInsertBlockMessages.addMediaFiles),
97
- tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.mediaFilesDescription),
98
- disabled: isOffline || !mediaSupported || !mediaUploadsEnabled
99
- }));
100
- }
101
- if (hasMentionsPlugin) {
102
- items.push((0, _item.mention)({
103
- content: formatMessage(_messages.toolbarInsertBlockMessages.mention),
104
- tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.mentionDescription),
105
- disabled: !isTypeAheadAllowed || !!mentionsDisabled || !mentionsSupported,
106
- 'aria-haspopup': 'listbox'
107
- }));
108
- }
109
- if (hasEmojiPlugin) {
110
- items.push((0, _item.emoji)({
111
- content: formatMessage(_messages.toolbarInsertBlockMessages.emoji),
112
- tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.emojiDescription),
113
- disabled: emojiDisabled || !isTypeAheadAllowed || !emojiProvider,
114
- 'aria-haspopup': 'dialog'
115
- }));
116
- }
117
- } else {
118
- if (mediaSupported && mediaUploadsEnabled) {
119
- items.push((0, _item.media)({
120
- content: formatMessage(_messages.toolbarInsertBlockMessages.addMediaFiles),
121
- tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.mediaFilesDescription),
122
- disabled: isOffline
123
- }));
124
- }
125
- if (imageUploadSupported) {
126
- items.push((0, _item.imageUpload)({
127
- content: formatMessage(_messages.toolbarInsertBlockMessages.image),
128
- disabled: !imageUploadEnabled || isOffline
129
- }));
130
- }
131
- if (mentionsSupported) {
132
- items.push((0, _item.mention)({
133
- content: formatMessage(_messages.toolbarInsertBlockMessages.mention),
134
- tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.mentionDescription),
135
- disabled: !isTypeAheadAllowed || !!mentionsDisabled,
136
- 'aria-haspopup': 'listbox'
137
- }));
138
- }
139
- if (emojiProvider) {
140
- items.push((0, _item.emoji)({
141
- content: formatMessage(_messages.toolbarInsertBlockMessages.emoji),
142
- tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.emojiDescription),
143
- disabled: emojiDisabled || !isTypeAheadAllowed,
144
- 'aria-haspopup': 'dialog'
145
- }));
146
- }
87
+ if (imageUploadSupported) {
88
+ items.push((0, _item.imageUpload)({
89
+ content: formatMessage(_messages.toolbarInsertBlockMessages.image),
90
+ disabled: !imageUploadEnabled || isOffline
91
+ }));
92
+ } else if (hasMediaPlugin) {
93
+ items.push((0, _item.media)({
94
+ content: formatMessage(_messages.toolbarInsertBlockMessages.addMediaFiles),
95
+ tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.mediaFilesDescription),
96
+ disabled: isOffline || !mediaSupported || !mediaUploadsEnabled
97
+ }));
98
+ }
99
+ if (hasMentionsPlugin) {
100
+ items.push((0, _item.mention)({
101
+ content: formatMessage(_messages.toolbarInsertBlockMessages.mention),
102
+ tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.mentionDescription),
103
+ disabled: !isTypeAheadAllowed || !!mentionsDisabled || !mentionsSupported,
104
+ 'aria-haspopup': 'listbox'
105
+ }));
106
+ }
107
+ if (hasEmojiPlugin) {
108
+ items.push((0, _item.emoji)({
109
+ content: formatMessage(_messages.toolbarInsertBlockMessages.emoji),
110
+ tooltipDescription: formatMessage(_messages.toolbarInsertBlockMessages.emojiDescription),
111
+ disabled: emojiDisabled || !isTypeAheadAllowed || !emojiProvider,
112
+ 'aria-haspopup': 'dialog'
113
+ }));
147
114
  }
148
115
  if (tableSupported) {
149
116
  items.push((0, _item.table)({
package/dist/cjs/ui/toolbar-components/EmojiButton.js CHANGED
@@ -12,7 +12,6 @@ var _keymaps = require("@atlaskit/editor-common/keymaps");
12
12
  var _messages = require("@atlaskit/editor-common/messages");
13
13
  var _toolbar = require("@atlaskit/editor-common/toolbar");
14
14
  var _editorToolbar = require("@atlaskit/editor-toolbar");
15
- var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
16
15
  var _useEmojiPickerPopup = require("./hooks/useEmojiPickerPopup");
17
16
  var _EmojiPickerPopup = require("./popups/EmojiPickerPopup");
18
17
  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); }
@@ -26,14 +25,12 @@ var EmojiButton = exports.EmojiButton = function EmojiButton(_ref) {
26
25
  popupsBoundariesElement = _useToolbarUI.popupsBoundariesElement,
27
26
  popupsScrollableElement = _useToolbarUI.popupsScrollableElement;
28
27
  var _useSharedPluginState = (0, _hooks.useSharedPluginStateWithSelector)(api, ['emoji', 'typeAhead'], function (states) {
29
- var _states$emojiState, _states$emojiState2, _states$typeAheadStat;
28
+ var _states$emojiState, _states$typeAheadStat;
30
29
  return {
31
- emojiProviderSelector: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProvider,
32
- emojiProviderPromise: (_states$emojiState2 = states.emojiState) === null || _states$emojiState2 === void 0 ? void 0 : _states$emojiState2.emojiProviderPromise,
30
+ emojiProviderPromise: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProviderPromise,
33
31
  isTypeAheadAllowed: (_states$typeAheadStat = states.typeAheadState) === null || _states$typeAheadStat === void 0 ? void 0 : _states$typeAheadStat.isAllowed
34
32
  };
35
33
  }),
36
- emojiProviderSelector = _useSharedPluginState.emojiProviderSelector,
37
34
  emojiProviderPromise = _useSharedPluginState.emojiProviderPromise,
38
35
  isTypeAheadAllowed = _useSharedPluginState.isTypeAheadAllowed;
39
36
  var emojiPickerPopup = (0, _useEmojiPickerPopup.useEmojiPickerPopup)({
@@ -43,16 +40,10 @@ var EmojiButton = exports.EmojiButton = function EmojiButton(_ref) {
43
40
  if (!(api !== null && api !== void 0 && api.emoji)) {
44
41
  return null;
45
42
  }
46
- var getEmojiProvider = function getEmojiProvider() {
47
- if (emojiProviderSelector) {
48
- return Promise.resolve(emojiProviderSelector);
49
- }
50
- };
51
- var emojiProvider = (0, _expValEquals.expValEquals)('platform_editor_prevent_toolbar_layout_shifts', 'isEnabled', true) ? emojiProviderPromise : getEmojiProvider();
52
43
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_EmojiPickerPopup.EmojiPickerPopup, {
53
44
  isOpen: emojiPickerPopup.isOpen,
54
45
  targetRef: emojiButtonRef,
55
- emojiProvider: emojiProvider,
46
+ emojiProvider: emojiProviderPromise,
56
47
  onSelection: emojiPickerPopup.handleSelectedEmoji,
57
48
  onClickOutside: emojiPickerPopup.handleClickOutside,
58
49
  onEscapeKeydown: emojiPickerPopup.handleEscapeKeydown,
@@ -78,7 +69,7 @@ var EmojiButton = exports.EmojiButton = function EmojiButton(_ref) {
78
69
  return emojiPickerPopup.toggle();
79
70
  },
80
71
  isSelected: emojiPickerPopup.isOpen,
81
- isDisabled: !isTypeAheadAllowed || !emojiProvider,
72
+ isDisabled: !isTypeAheadAllowed || !emojiProviderPromise,
82
73
  testId: _toolbar.TOOLBAR_BUTTON_TEST_ID.EMOJI
83
74
  })));
84
75
  };
package/dist/es2019/insertBlockPlugin.js CHANGED
@@ -2,13 +2,11 @@ import React, { useEffect } from 'react';
2
2
  import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
3
3
  import { ElementBrowser } from '@atlaskit/editor-common/element-browser';
4
4
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
5
- import { WithProviders } from '@atlaskit/editor-common/provider-factory';
6
5
  import { ToolbarSize } from '@atlaskit/editor-common/types';
7
6
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
8
7
  import { BLOCK_QUOTE, CODE_BLOCK, PANEL } from '@atlaskit/editor-plugin-block-type/consts';
9
8
  import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
10
9
  import { fg } from '@atlaskit/platform-feature-flags/fg';
11
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
12
10
  import { getToolbarActionExperiencesPlugin } from './pm-plugins/experiences/toolbar-action-experiences';
13
11
  import { toggleInsertBlockPmKey, toggleInsertBlockPmPlugin } from './pm-plugins/toggleInsertBlock';
14
12
  import { getToolbarComponents } from './ui/toolbar-components';
@@ -108,55 +106,24 @@ export const insertBlockPlugin = ({
108
106
  isLastItem
109
107
  }) => {
110
108
  refs.popupsMountPoint = popupsMountPoint || undefined;
111
- const renderNode = providers => {
112
- if (!editorView) {
113
- return null;
114
- }
115
- return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
116
- pluginInjectionApi: api,
117
- editorView: editorView,
118
- editorActions: editorActions,
119
- dispatchAnalyticsEvent: dispatchAnalyticsEvent,
120
- providerFactory: providerFactory,
121
- popupsMountPoint: popupsMountPoint,
122
- popupsBoundariesElement: popupsBoundariesElement,
123
- popupsScrollableElement: popupsScrollableElement,
124
- toolbarSize: toolbarSize,
125
- disabled: disabled,
126
- isToolbarReducedSpacing: isToolbarReducedSpacing,
127
- isLastItem: isLastItem,
128
- providers: providers,
129
- options: options,
130
- appearance: options.appearance
131
- });
132
- };
133
- if (editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true)) {
134
- if (!editorView) {
135
- return null;
136
- }
137
- return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
138
- pluginInjectionApi: api,
139
- editorView: editorView,
140
- editorActions: editorActions,
141
- dispatchAnalyticsEvent: dispatchAnalyticsEvent,
142
- providerFactory: providerFactory,
143
- popupsMountPoint: popupsMountPoint,
144
- popupsBoundariesElement: popupsBoundariesElement,
145
- popupsScrollableElement: popupsScrollableElement,
146
- toolbarSize: toolbarSize,
147
- disabled: disabled,
148
- isToolbarReducedSpacing: isToolbarReducedSpacing,
149
- isLastItem: isLastItem,
150
- options: options,
151
- appearance: options.appearance
152
- });
109
+ if (!editorView) {
110
+ return null;
153
111
  }
154
- return /*#__PURE__*/React.createElement(WithProviders, {
155
- providerFactory: providerFactory
156
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
157
- ,
158
- providers: ['emojiProvider'],
159
- renderNode: renderNode
112
+ return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
113
+ pluginInjectionApi: api,
114
+ editorView: editorView,
115
+ editorActions: editorActions,
116
+ dispatchAnalyticsEvent: dispatchAnalyticsEvent,
117
+ providerFactory: providerFactory,
118
+ popupsMountPoint: popupsMountPoint,
119
+ popupsBoundariesElement: popupsBoundariesElement,
120
+ popupsScrollableElement: popupsScrollableElement,
121
+ toolbarSize: toolbarSize,
122
+ disabled: disabled,
123
+ isToolbarReducedSpacing: isToolbarReducedSpacing,
124
+ isLastItem: isLastItem,
125
+ options: options,
126
+ appearance: options.appearance
160
127
  });
161
128
  };
162
129
  if (isToolbarAIFCEnabled) {
@@ -234,9 +201,8 @@ export const insertBlockPlugin = ({
234
201
  return plugin;
235
202
  };
236
203
  const selector = states => {
237
- var _states$emojiState, _states$mediaState, _states$mediaState2, _states$insertBlockSt, _states$typeAheadStat, _states$mentionState, _states$mentionState2, _states$dateState, _states$placeholderTe, _states$connectivityS, _states$imageUploadSt, _states$blockTypeStat, _states$hyperlinkStat, _states$hyperlinkStat2;
204
+ var _states$mediaState, _states$mediaState2, _states$insertBlockSt, _states$typeAheadStat, _states$mentionState, _states$mentionState2, _states$dateState, _states$placeholderTe, _states$connectivityS, _states$imageUploadSt, _states$blockTypeStat, _states$hyperlinkStat, _states$hyperlinkStat2;
238
205
  return {
239
- emojiProviderSelector: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProvider,
240
206
  showMediaPicker: (_states$mediaState = states.mediaState) === null || _states$mediaState === void 0 ? void 0 : _states$mediaState.showMediaPicker,
241
207
  mediaAllowsUploads: (_states$mediaState2 = states.mediaState) === null || _states$mediaState2 === void 0 ? void 0 : _states$mediaState2.allowsUploads,
242
208
  showElementBrowser: (_states$insertBlockSt = states.insertBlockState) === null || _states$insertBlockSt === void 0 ? void 0 : _states$insertBlockSt.showElementBrowser,
@@ -270,7 +236,6 @@ function ToolbarInsertBlockWithInjectionApi({
270
236
  var _pluginInjectionApi$i, _pluginInjectionApi$c2, _pluginInjectionApi$p, _pluginInjectionApi$b, _pluginInjectionApi$e;
271
237
  const buttons = toolbarSizeToButtons(toolbarSize, appearance);
272
238
  const {
273
- emojiProviderSelector,
274
239
  showMediaPicker,
275
240
  mediaAllowsUploads,
276
241
  showElementBrowser,
@@ -285,17 +250,7 @@ function ToolbarInsertBlockWithInjectionApi({
285
250
  canInsertLink,
286
251
  activeLinkMark
287
252
  } = useSharedPluginStateWithSelector(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media', 'typeAhead', 'placeholderText', 'insertBlock', 'connectivity'], selector);
288
- const emojiProviderPromise = useSharedPluginStateSelector(pluginInjectionApi, 'emoji.emojiProviderPromise', {
289
- disabled: !editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true)
290
- });
291
- const getEmojiProvider = () => {
292
- if (emojiProviderSelector) {
293
- return Promise.resolve(emojiProviderSelector);
294
- }
295
- };
296
- const emojiProvider = editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true, {
297
- exposure: true
298
- }) ? emojiProviderPromise : getEmojiProvider();
253
+ const emojiProvider = useSharedPluginStateSelector(pluginInjectionApi, 'emoji.emojiProviderPromise');
299
254
  const onShowMediaPicker = mountInfo => {
300
255
  var _pluginInjectionApi$m, _pluginInjectionApi$c, _pluginInjectionApi$m2;
301
256
  if (!showMediaPicker) {
package/dist/es2019/ui/ToolbarInsertBlock/create-items.js CHANGED
@@ -4,7 +4,6 @@ import memoizeOne from 'memoize-one';
4
4
  import { ToolTipContent } from '@atlaskit/editor-common/keymaps';
5
5
  import { blockTypeMessages, toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
6
6
  import { fg } from '@atlaskit/platform-feature-flags/fg';
7
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
8
7
  import { action, blockquote, codeblock, date, decision, emoji, expand, horizontalrule, imageUpload, layout, link, media, mention, panel, placeholder, status, table, tableSelector } from './item';
9
8
  import { shallowEquals } from './shallow-equals';
10
9
  const buttonToItem = memoize(button => ({
@@ -72,65 +71,33 @@ const createInsertBlockItems = config => {
72
71
  'aria-haspopup': 'dialog'
73
72
  }));
74
73
  }
75
- if (editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true)) {
76
- if (imageUploadSupported) {
77
- items.push(imageUpload({
78
- content: formatMessage(messages.image),
79
- disabled: !imageUploadEnabled || isOffline
80
- }));
81
- } else if (hasMediaPlugin) {
82
- items.push(media({
83
- content: formatMessage(messages.addMediaFiles),
84
- tooltipDescription: formatMessage(messages.mediaFilesDescription),
85
- disabled: isOffline || !mediaSupported || !mediaUploadsEnabled
86
- }));
87
- }
88
- if (hasMentionsPlugin) {
89
- items.push(mention({
90
- content: formatMessage(messages.mention),
91
- tooltipDescription: formatMessage(messages.mentionDescription),
92
- disabled: !isTypeAheadAllowed || !!mentionsDisabled || !mentionsSupported,
93
- 'aria-haspopup': 'listbox'
94
- }));
95
- }
96
- if (hasEmojiPlugin) {
97
- items.push(emoji({
98
- content: formatMessage(messages.emoji),
99
- tooltipDescription: formatMessage(messages.emojiDescription),
100
- disabled: emojiDisabled || !isTypeAheadAllowed || !emojiProvider,
101
- 'aria-haspopup': 'dialog'
102
- }));
103
- }
104
- } else {
105
- if (mediaSupported && mediaUploadsEnabled) {
106
- items.push(media({
107
- content: formatMessage(messages.addMediaFiles),
108
- tooltipDescription: formatMessage(messages.mediaFilesDescription),
109
- disabled: isOffline
110
- }));
111
- }
112
- if (imageUploadSupported) {
113
- items.push(imageUpload({
114
- content: formatMessage(messages.image),
115
- disabled: !imageUploadEnabled || isOffline
116
- }));
117
- }
118
- if (mentionsSupported) {
119
- items.push(mention({
120
- content: formatMessage(messages.mention),
121
- tooltipDescription: formatMessage(messages.mentionDescription),
122
- disabled: !isTypeAheadAllowed || !!mentionsDisabled,
123
- 'aria-haspopup': 'listbox'
124
- }));
125
- }
126
- if (emojiProvider) {
127
- items.push(emoji({
128
- content: formatMessage(messages.emoji),
129
- tooltipDescription: formatMessage(messages.emojiDescription),
130
- disabled: emojiDisabled || !isTypeAheadAllowed,
131
- 'aria-haspopup': 'dialog'
132
- }));
133
- }
74
+ if (imageUploadSupported) {
75
+ items.push(imageUpload({
76
+ content: formatMessage(messages.image),
77
+ disabled: !imageUploadEnabled || isOffline
78
+ }));
79
+ } else if (hasMediaPlugin) {
80
+ items.push(media({
81
+ content: formatMessage(messages.addMediaFiles),
82
+ tooltipDescription: formatMessage(messages.mediaFilesDescription),
83
+ disabled: isOffline || !mediaSupported || !mediaUploadsEnabled
84
+ }));
85
+ }
86
+ if (hasMentionsPlugin) {
87
+ items.push(mention({
88
+ content: formatMessage(messages.mention),
89
+ tooltipDescription: formatMessage(messages.mentionDescription),
90
+ disabled: !isTypeAheadAllowed || !!mentionsDisabled || !mentionsSupported,
91
+ 'aria-haspopup': 'listbox'
92
+ }));
93
+ }
94
+ if (hasEmojiPlugin) {
95
+ items.push(emoji({
96
+ content: formatMessage(messages.emoji),
97
+ tooltipDescription: formatMessage(messages.emojiDescription),
98
+ disabled: emojiDisabled || !isTypeAheadAllowed || !emojiProvider,
99
+ 'aria-haspopup': 'dialog'
100
+ }));
134
101
  }
135
102
  if (tableSupported) {
136
103
  items.push(table({
package/dist/es2019/ui/toolbar-components/EmojiButton.js CHANGED
@@ -5,7 +5,6 @@ import { ToolTipContent, insertEmoji } from '@atlaskit/editor-common/keymaps';
5
5
  import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
6
6
  import { TOOLBAR_BUTTON_TEST_ID } from '@atlaskit/editor-common/toolbar';
7
7
  import { ToolbarButton, ToolbarTooltip, EmojiIcon, useToolbarUI } from '@atlaskit/editor-toolbar';
8
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
8
  import { useEmojiPickerPopup } from './hooks/useEmojiPickerPopup';
10
9
  import { EmojiPickerPopup } from './popups/EmojiPickerPopup';
11
10
  export const EmojiButton = ({
@@ -21,14 +20,12 @@ export const EmojiButton = ({
21
20
  popupsScrollableElement
22
21
  } = useToolbarUI();
23
22
  const {
24
- emojiProviderSelector,
25
23
  emojiProviderPromise,
26
24
  isTypeAheadAllowed
27
25
  } = useSharedPluginStateWithSelector(api, ['emoji', 'typeAhead'], states => {
28
- var _states$emojiState, _states$emojiState2, _states$typeAheadStat;
26
+ var _states$emojiState, _states$typeAheadStat;
29
27
  return {
30
- emojiProviderSelector: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProvider,
31
- emojiProviderPromise: (_states$emojiState2 = states.emojiState) === null || _states$emojiState2 === void 0 ? void 0 : _states$emojiState2.emojiProviderPromise,
28
+ emojiProviderPromise: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProviderPromise,
32
29
  isTypeAheadAllowed: (_states$typeAheadStat = states.typeAheadState) === null || _states$typeAheadStat === void 0 ? void 0 : _states$typeAheadStat.isAllowed
33
30
  };
34
31
  });
@@ -39,16 +36,10 @@ export const EmojiButton = ({
39
36
  if (!(api !== null && api !== void 0 && api.emoji)) {
40
37
  return null;
41
38
  }
42
- const getEmojiProvider = () => {
43
- if (emojiProviderSelector) {
44
- return Promise.resolve(emojiProviderSelector);
45
- }
46
- };
47
- const emojiProvider = expValEquals('platform_editor_prevent_toolbar_layout_shifts', 'isEnabled', true) ? emojiProviderPromise : getEmojiProvider();
48
39
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EmojiPickerPopup, {
49
40
  isOpen: emojiPickerPopup.isOpen,
50
41
  targetRef: emojiButtonRef,
51
- emojiProvider: emojiProvider,
42
+ emojiProvider: emojiProviderPromise,
52
43
  onSelection: emojiPickerPopup.handleSelectedEmoji,
53
44
  onClickOutside: emojiPickerPopup.handleClickOutside,
54
45
  onEscapeKeydown: emojiPickerPopup.handleEscapeKeydown,
@@ -72,7 +63,7 @@ export const EmojiButton = ({
72
63
  ,
73
64
  onClick: () => emojiPickerPopup.toggle(),
74
65
  isSelected: emojiPickerPopup.isOpen,
75
- isDisabled: !isTypeAheadAllowed || !emojiProvider,
66
+ isDisabled: !isTypeAheadAllowed || !emojiProviderPromise,
76
67
  testId: TOOLBAR_BUTTON_TEST_ID.EMOJI
77
68
  })));
78
69
  };
package/dist/esm/insertBlockPlugin.js CHANGED
@@ -2,13 +2,11 @@ import React, { useEffect } from 'react';
2
2
  import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
3
3
  import { ElementBrowser } from '@atlaskit/editor-common/element-browser';
4
4
  import { useSharedPluginStateWithSelector } from '@atlaskit/editor-common/hooks';
5
- import { WithProviders } from '@atlaskit/editor-common/provider-factory';
6
5
  import { ToolbarSize } from '@atlaskit/editor-common/types';
7
6
  import { useSharedPluginStateSelector } from '@atlaskit/editor-common/use-shared-plugin-state-selector';
8
7
  import { BLOCK_QUOTE, CODE_BLOCK, PANEL } from '@atlaskit/editor-plugin-block-type/consts';
9
8
  import { isOfflineMode } from '@atlaskit/editor-plugin-connectivity';
10
9
  import { fg } from '@atlaskit/platform-feature-flags/fg';
11
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
12
10
  import { getToolbarActionExperiencesPlugin } from './pm-plugins/experiences/toolbar-action-experiences';
13
11
  import { toggleInsertBlockPmKey, toggleInsertBlockPmPlugin } from './pm-plugins/toggleInsertBlock';
14
12
  import { getToolbarComponents } from './ui/toolbar-components';
@@ -113,55 +111,24 @@ export var insertBlockPlugin = function insertBlockPlugin(_ref) {
113
111
  isToolbarReducedSpacing = _ref2.isToolbarReducedSpacing,
114
112
  isLastItem = _ref2.isLastItem;
115
113
  refs.popupsMountPoint = popupsMountPoint || undefined;
116
- var renderNode = function renderNode(providers) {
117
- if (!editorView) {
118
- return null;
119
- }
120
- return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
121
- pluginInjectionApi: api,
122
- editorView: editorView,
123
- editorActions: editorActions,
124
- dispatchAnalyticsEvent: dispatchAnalyticsEvent,
125
- providerFactory: providerFactory,
126
- popupsMountPoint: popupsMountPoint,
127
- popupsBoundariesElement: popupsBoundariesElement,
128
- popupsScrollableElement: popupsScrollableElement,
129
- toolbarSize: toolbarSize,
130
- disabled: disabled,
131
- isToolbarReducedSpacing: isToolbarReducedSpacing,
132
- isLastItem: isLastItem,
133
- providers: providers,
134
- options: options,
135
- appearance: options.appearance
136
- });
137
- };
138
- if (editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true)) {
139
- if (!editorView) {
140
- return null;
141
- }
142
- return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
143
- pluginInjectionApi: api,
144
- editorView: editorView,
145
- editorActions: editorActions,
146
- dispatchAnalyticsEvent: dispatchAnalyticsEvent,
147
- providerFactory: providerFactory,
148
- popupsMountPoint: popupsMountPoint,
149
- popupsBoundariesElement: popupsBoundariesElement,
150
- popupsScrollableElement: popupsScrollableElement,
151
- toolbarSize: toolbarSize,
152
- disabled: disabled,
153
- isToolbarReducedSpacing: isToolbarReducedSpacing,
154
- isLastItem: isLastItem,
155
- options: options,
156
- appearance: options.appearance
157
- });
114
+ if (!editorView) {
115
+ return null;
158
116
  }
159
- return /*#__PURE__*/React.createElement(WithProviders, {
160
- providerFactory: providerFactory
161
- // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
162
- ,
163
- providers: ['emojiProvider'],
164
- renderNode: renderNode
117
+ return /*#__PURE__*/React.createElement(ToolbarInsertBlockWithInjectionApi, {
118
+ pluginInjectionApi: api,
119
+ editorView: editorView,
120
+ editorActions: editorActions,
121
+ dispatchAnalyticsEvent: dispatchAnalyticsEvent,
122
+ providerFactory: providerFactory,
123
+ popupsMountPoint: popupsMountPoint,
124
+ popupsBoundariesElement: popupsBoundariesElement,
125
+ popupsScrollableElement: popupsScrollableElement,
126
+ toolbarSize: toolbarSize,
127
+ disabled: disabled,
128
+ isToolbarReducedSpacing: isToolbarReducedSpacing,
129
+ isLastItem: isLastItem,
130
+ options: options,
131
+ appearance: options.appearance
165
132
  });
166
133
  };
167
134
  if (isToolbarAIFCEnabled) {
@@ -242,9 +209,8 @@ export var insertBlockPlugin = function insertBlockPlugin(_ref) {
242
209
  return plugin;
243
210
  };
244
211
  var selector = function selector(states) {
245
- var _states$emojiState, _states$mediaState, _states$mediaState2, _states$insertBlockSt, _states$typeAheadStat, _states$mentionState, _states$mentionState2, _states$dateState, _states$placeholderTe, _states$connectivityS, _states$imageUploadSt, _states$blockTypeStat, _states$hyperlinkStat, _states$hyperlinkStat2;
212
+ var _states$mediaState, _states$mediaState2, _states$insertBlockSt, _states$typeAheadStat, _states$mentionState, _states$mentionState2, _states$dateState, _states$placeholderTe, _states$connectivityS, _states$imageUploadSt, _states$blockTypeStat, _states$hyperlinkStat, _states$hyperlinkStat2;
246
213
  return {
247
- emojiProviderSelector: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProvider,
248
214
  showMediaPicker: (_states$mediaState = states.mediaState) === null || _states$mediaState === void 0 ? void 0 : _states$mediaState.showMediaPicker,
249
215
  mediaAllowsUploads: (_states$mediaState2 = states.mediaState) === null || _states$mediaState2 === void 0 ? void 0 : _states$mediaState2.allowsUploads,
250
216
  showElementBrowser: (_states$insertBlockSt = states.insertBlockState) === null || _states$insertBlockSt === void 0 ? void 0 : _states$insertBlockSt.showElementBrowser,
@@ -277,7 +243,6 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
277
243
  appearance = _ref4.appearance;
278
244
  var buttons = toolbarSizeToButtons(toolbarSize, appearance);
279
245
  var _useSharedPluginState = useSharedPluginStateWithSelector(pluginInjectionApi, ['hyperlink', 'date', 'imageUpload', 'mention', 'emoji', 'blockType', 'media', 'typeAhead', 'placeholderText', 'insertBlock', 'connectivity'], selector),
280
- emojiProviderSelector = _useSharedPluginState.emojiProviderSelector,
281
246
  showMediaPicker = _useSharedPluginState.showMediaPicker,
282
247
  mediaAllowsUploads = _useSharedPluginState.mediaAllowsUploads,
283
248
  showElementBrowser = _useSharedPluginState.showElementBrowser,
@@ -291,17 +256,7 @@ function ToolbarInsertBlockWithInjectionApi(_ref4) {
291
256
  availableWrapperBlockTypes = _useSharedPluginState.availableWrapperBlockTypes,
292
257
  canInsertLink = _useSharedPluginState.canInsertLink,
293
258
  activeLinkMark = _useSharedPluginState.activeLinkMark;
294
- var emojiProviderPromise = useSharedPluginStateSelector(pluginInjectionApi, 'emoji.emojiProviderPromise', {
295
- disabled: !editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true)
296
- });
297
- var getEmojiProvider = function getEmojiProvider() {
298
- if (emojiProviderSelector) {
299
- return Promise.resolve(emojiProviderSelector);
300
- }
301
- };
302
- var emojiProvider = editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true, {
303
- exposure: true
304
- }) ? emojiProviderPromise : getEmojiProvider();
259
+ var emojiProvider = useSharedPluginStateSelector(pluginInjectionApi, 'emoji.emojiProviderPromise');
305
260
  var onShowMediaPicker = function onShowMediaPicker(mountInfo) {
306
261
  var _pluginInjectionApi$m, _pluginInjectionApi$c, _pluginInjectionApi$m2;
307
262
  if (!showMediaPicker) {
package/dist/esm/ui/ToolbarInsertBlock/create-items.js CHANGED
@@ -8,7 +8,6 @@ import memoizeOne from 'memoize-one';
8
8
  import { ToolTipContent } from '@atlaskit/editor-common/keymaps';
9
9
  import { blockTypeMessages, toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
10
10
  import { fg } from '@atlaskit/platform-feature-flags/fg';
11
- import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
12
11
  import { action, blockquote, codeblock, date, decision, emoji, expand, horizontalrule, imageUpload, layout, link, media, mention, panel, placeholder, status, table, tableSelector } from './item';
13
12
  import { shallowEquals } from './shallow-equals';
14
13
  var buttonToItem = memoize(function (button) {
@@ -78,65 +77,33 @@ var createInsertBlockItems = function createInsertBlockItems(config) {
78
77
  'aria-haspopup': 'dialog'
79
78
  }));
80
79
  }
81
- if (editorExperiment('platform_editor_prevent_toolbar_layout_shifts', true)) {
82
- if (imageUploadSupported) {
83
- items.push(imageUpload({
84
- content: formatMessage(messages.image),
85
- disabled: !imageUploadEnabled || isOffline
86
- }));
87
- } else if (hasMediaPlugin) {
88
- items.push(media({
89
- content: formatMessage(messages.addMediaFiles),
90
- tooltipDescription: formatMessage(messages.mediaFilesDescription),
91
- disabled: isOffline || !mediaSupported || !mediaUploadsEnabled
92
- }));
93
- }
94
- if (hasMentionsPlugin) {
95
- items.push(mention({
96
- content: formatMessage(messages.mention),
97
- tooltipDescription: formatMessage(messages.mentionDescription),
98
- disabled: !isTypeAheadAllowed || !!mentionsDisabled || !mentionsSupported,
99
- 'aria-haspopup': 'listbox'
100
- }));
101
- }
102
- if (hasEmojiPlugin) {
103
- items.push(emoji({
104
- content: formatMessage(messages.emoji),
105
- tooltipDescription: formatMessage(messages.emojiDescription),
106
- disabled: emojiDisabled || !isTypeAheadAllowed || !emojiProvider,
107
- 'aria-haspopup': 'dialog'
108
- }));
109
- }
110
- } else {
111
- if (mediaSupported && mediaUploadsEnabled) {
112
- items.push(media({
113
- content: formatMessage(messages.addMediaFiles),
114
- tooltipDescription: formatMessage(messages.mediaFilesDescription),
115
- disabled: isOffline
116
- }));
117
- }
118
- if (imageUploadSupported) {
119
- items.push(imageUpload({
120
- content: formatMessage(messages.image),
121
- disabled: !imageUploadEnabled || isOffline
122
- }));
123
- }
124
- if (mentionsSupported) {
125
- items.push(mention({
126
- content: formatMessage(messages.mention),
127
- tooltipDescription: formatMessage(messages.mentionDescription),
128
- disabled: !isTypeAheadAllowed || !!mentionsDisabled,
129
- 'aria-haspopup': 'listbox'
130
- }));
131
- }
132
- if (emojiProvider) {
133
- items.push(emoji({
134
- content: formatMessage(messages.emoji),
135
- tooltipDescription: formatMessage(messages.emojiDescription),
136
- disabled: emojiDisabled || !isTypeAheadAllowed,
137
- 'aria-haspopup': 'dialog'
138
- }));
139
- }
80
+ if (imageUploadSupported) {
81
+ items.push(imageUpload({
82
+ content: formatMessage(messages.image),
83
+ disabled: !imageUploadEnabled || isOffline
84
+ }));
85
+ } else if (hasMediaPlugin) {
86
+ items.push(media({
87
+ content: formatMessage(messages.addMediaFiles),
88
+ tooltipDescription: formatMessage(messages.mediaFilesDescription),
89
+ disabled: isOffline || !mediaSupported || !mediaUploadsEnabled
90
+ }));
91
+ }
92
+ if (hasMentionsPlugin) {
93
+ items.push(mention({
94
+ content: formatMessage(messages.mention),
95
+ tooltipDescription: formatMessage(messages.mentionDescription),
96
+ disabled: !isTypeAheadAllowed || !!mentionsDisabled || !mentionsSupported,
97
+ 'aria-haspopup': 'listbox'
98
+ }));
99
+ }
100
+ if (hasEmojiPlugin) {
101
+ items.push(emoji({
102
+ content: formatMessage(messages.emoji),
103
+ tooltipDescription: formatMessage(messages.emojiDescription),
104
+ disabled: emojiDisabled || !isTypeAheadAllowed || !emojiProvider,
105
+ 'aria-haspopup': 'dialog'
106
+ }));
140
107
  }
141
108
  if (tableSupported) {
142
109
  items.push(table({
package/dist/esm/ui/toolbar-components/EmojiButton.js CHANGED
@@ -5,7 +5,6 @@ import { ToolTipContent, insertEmoji } from '@atlaskit/editor-common/keymaps';
5
5
  import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
6
6
  import { TOOLBAR_BUTTON_TEST_ID } from '@atlaskit/editor-common/toolbar';
7
7
  import { ToolbarButton, ToolbarTooltip, EmojiIcon, useToolbarUI } from '@atlaskit/editor-toolbar';
8
- import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
9
8
  import { useEmojiPickerPopup } from './hooks/useEmojiPickerPopup';
10
9
  import { EmojiPickerPopup } from './popups/EmojiPickerPopup';
11
10
  export var EmojiButton = function EmojiButton(_ref) {
@@ -18,14 +17,12 @@ export var EmojiButton = function EmojiButton(_ref) {
18
17
  popupsBoundariesElement = _useToolbarUI.popupsBoundariesElement,
19
18
  popupsScrollableElement = _useToolbarUI.popupsScrollableElement;
20
19
  var _useSharedPluginState = useSharedPluginStateWithSelector(api, ['emoji', 'typeAhead'], function (states) {
21
- var _states$emojiState, _states$emojiState2, _states$typeAheadStat;
20
+ var _states$emojiState, _states$typeAheadStat;
22
21
  return {
23
- emojiProviderSelector: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProvider,
24
- emojiProviderPromise: (_states$emojiState2 = states.emojiState) === null || _states$emojiState2 === void 0 ? void 0 : _states$emojiState2.emojiProviderPromise,
22
+ emojiProviderPromise: (_states$emojiState = states.emojiState) === null || _states$emojiState === void 0 ? void 0 : _states$emojiState.emojiProviderPromise,
25
23
  isTypeAheadAllowed: (_states$typeAheadStat = states.typeAheadState) === null || _states$typeAheadStat === void 0 ? void 0 : _states$typeAheadStat.isAllowed
26
24
  };
27
25
  }),
28
- emojiProviderSelector = _useSharedPluginState.emojiProviderSelector,
29
26
  emojiProviderPromise = _useSharedPluginState.emojiProviderPromise,
30
27
  isTypeAheadAllowed = _useSharedPluginState.isTypeAheadAllowed;
31
28
  var emojiPickerPopup = useEmojiPickerPopup({
@@ -35,16 +32,10 @@ export var EmojiButton = function EmojiButton(_ref) {
35
32
  if (!(api !== null && api !== void 0 && api.emoji)) {
36
33
  return null;
37
34
  }
38
- var getEmojiProvider = function getEmojiProvider() {
39
- if (emojiProviderSelector) {
40
- return Promise.resolve(emojiProviderSelector);
41
- }
42
- };
43
- var emojiProvider = expValEquals('platform_editor_prevent_toolbar_layout_shifts', 'isEnabled', true) ? emojiProviderPromise : getEmojiProvider();
44
35
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EmojiPickerPopup, {
45
36
  isOpen: emojiPickerPopup.isOpen,
46
37
  targetRef: emojiButtonRef,
47
- emojiProvider: emojiProvider,
38
+ emojiProvider: emojiProviderPromise,
48
39
  onSelection: emojiPickerPopup.handleSelectedEmoji,
49
40
  onClickOutside: emojiPickerPopup.handleClickOutside,
50
41
  onEscapeKeydown: emojiPickerPopup.handleEscapeKeydown,
@@ -70,7 +61,7 @@ export var EmojiButton = function EmojiButton(_ref) {
70
61
  return emojiPickerPopup.toggle();
71
62
  },
72
63
  isSelected: emojiPickerPopup.isOpen,
73
- isDisabled: !isTypeAheadAllowed || !emojiProvider,
64
+ isDisabled: !isTypeAheadAllowed || !emojiProviderPromise,
74
65
  testId: TOOLBAR_BUTTON_TEST_ID.EMOJI
75
66
  })));
76
67
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-insert-block",
3
- "version": "16.0.14",
3
+ "version": "16.0.15",
4
4
  "description": "Insert block plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -56,7 +56,7 @@
56
56
  "@atlaskit/icon": "^37.5.0",
57
57
  "@atlaskit/icon-lab": "^7.7.0",
58
58
  "@atlaskit/platform-feature-flags": "^2.1.0",
59
- "@atlaskit/tmp-editor-statsig": "^159.0.0",
59
+ "@atlaskit/tmp-editor-statsig": "^160.0.0",
60
60
  "@atlaskit/tokens": "^16.8.0",
61
61
  "@babel/runtime": "^7.0.0",
62
62
  "@emotion/react": "^11.7.1",