@atlaskit/editor-plugin-media 5.1.7 → 5.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,5 +1,26 @@
1
1
  # @atlaskit/editor-plugin-media
2
2
 
3
+ ## 5.2.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#189314](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/189314)
8
+ [`22c6251496010`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/22c6251496010) -
9
+ Exported missing types that were already being inferred from existing exports
10
+
11
+ ### Patch Changes
12
+
13
+ - Updated dependencies
14
+
15
+ ## 5.1.8
16
+
17
+ ### Patch Changes
18
+
19
+ - [#188597](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/188597)
20
+ [`4de5a96f3e24c`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/4de5a96f3e24c) -
21
+ [ED-28523] Enable new editor element toolbars UI for Jira
22
+ - Updated dependencies
23
+
3
24
  ## 5.1.7
4
25
 
5
26
  ### Patch Changes
@@ -15,6 +15,7 @@ var _card = require("@atlaskit/editor-common/card");
15
15
  var _editorAnalytics = require("@atlaskit/editor-common/editor-analytics");
16
16
  var _mediaInline = require("@atlaskit/editor-common/media-inline");
17
17
  var _messages = _interopRequireWildcard(require("@atlaskit/editor-common/messages"));
18
+ var _toolbarFlagCheck = require("@atlaskit/editor-common/toolbar-flag-check");
18
19
  var _state2 = require("@atlaskit/editor-prosemirror/state");
19
20
  var _utils = require("@atlaskit/editor-prosemirror/utils");
20
21
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
@@ -123,12 +124,12 @@ var handleShowMediaViewer = exports.handleShowMediaViewer = function handleShowM
123
124
  var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) {
124
125
  var _pluginInjectionApi$c;
125
126
  var disableDownloadButton = (0, _utils2.getIsDownloadDisabledByDataSecurityPolicy)(mediaPluginState);
126
- var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
127
+ var isNewEditorToolbarEnabled = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)();
127
128
  var preview = {
128
129
  id: 'editor.media.viewer',
129
130
  testId: 'file-preview-toolbar-button',
130
131
  type: 'button',
131
- icon: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? _growDiagonal.default : _maximize.default,
132
+ icon: isNewEditorToolbarEnabled ? _growDiagonal.default : _maximize.default,
132
133
  title: intl.formatMessage(_mediaUi.messages.preview),
133
134
  onClick: function onClick() {
134
135
  var _handleShowMediaViewe;
@@ -150,15 +151,15 @@ var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar
150
151
  },
151
152
  title: intl.formatMessage(_mediaUi.messages.download),
152
153
  disabled: disableDownloadButton
153
- }, isEditorControlsEnabled && {
154
+ }, isNewEditorToolbarEnabled && {
154
155
  supportsViewMode: true
155
156
  });
156
- if (isViewOnly && !isEditorControlsEnabled) {
157
+ if (isViewOnly && !isNewEditorToolbarEnabled) {
157
158
  return [];
158
159
  }
159
160
  var mediaGroup = state.schema.nodes.mediaGroup;
160
161
  var items = [];
161
- if (!isEditorControlsEnabled) {
162
+ if (!isNewEditorToolbarEnabled) {
162
163
  items.push({
163
164
  id: 'editor.media.view.switcher.inline',
164
165
  type: 'button',
@@ -278,7 +279,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
278
279
  var toolbarButtons = [];
279
280
  var _ref2 = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
280
281
  hoverDecoration = _ref2.hoverDecoration;
281
- var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
282
+ var isNewEditorToolbarEnabled = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)();
282
283
  var disableDownloadButton = (0, _utils2.getIsDownloadDisabledByDataSecurityPolicy)(pluginState);
283
284
  if ((0, _imageBorder.shouldShowImageBorder)(state)) {
284
285
  toolbarButtons.push({
@@ -305,7 +306,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
305
306
  });
306
307
  }
307
308
  });
308
- if (!isEditorControlsEnabled) {
309
+ if (!isNewEditorToolbarEnabled) {
309
310
  toolbarButtons.push({
310
311
  type: 'separator'
311
312
  });
@@ -326,7 +327,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
326
327
  }
327
328
  var layoutButtons = (0, _card.buildLayoutButtons)(state, intl, state.schema.nodes.mediaSingle, widthPlugin, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions, allowResizing, allowResizingInTables, true, true, isChangingLayoutDisabled, allowPixelResizing);
328
329
  var addLayoutDropdownToToolbar = function addLayoutDropdownToToolbar() {
329
- if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
330
+ if (isNewEditorToolbarEnabled) {
330
331
  var _pluginInjectionApi$a4;
331
332
  var layoutDropdown = (0, _card.buildLayoutDropdown)(state, intl, state.schema.nodes.mediaSingle, widthPlugin, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions, allowResizing, allowResizingInTables, true, true, isChangingLayoutDisabled, allowPixelResizing);
332
333
  toolbarButtons = [].concat((0, _toConsumableArray2.default)(toolbarButtons), (0, _toConsumableArray2.default)(layoutDropdown));
@@ -354,7 +355,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
354
355
  title: intl.formatMessage(_card.layoutToMessages[selectedLayoutIcon.value]),
355
356
  icon: selectedLayoutIcon.icon
356
357
  };
357
- toolbarButtons = [].concat((0, _toConsumableArray2.default)(toolbarButtons), [trigger], (0, _toConsumableArray2.default)(isEditorControlsEnabled ? [] : [{
358
+ toolbarButtons = [].concat((0, _toConsumableArray2.default)(toolbarButtons), [trigger], (0, _toConsumableArray2.default)(isNewEditorToolbarEnabled ? [] : [{
358
359
  type: 'separator'
359
360
  }]));
360
361
  }
@@ -392,7 +393,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
392
393
  var hasCaption = (0, _utils.contains)(selectedNode.node, state.schema.nodes.caption);
393
394
  var inlineSwitcherTitle = intl.formatMessage(hasCaption ? _messages.mediaAndEmbedToolbarMessages.changeToMediaInlineImageCaptionWarning : _messages.mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
394
395
  var floatingSwitcherTitle = intl.formatMessage(_messages.mediaAndEmbedToolbarMessages.changeToMediaSingle);
395
- if (!isEditorControlsEnabled) {
396
+ if (!isNewEditorToolbarEnabled) {
396
397
  var _pluginInjectionApi$a5;
397
398
  toolbarButtons.push({
398
399
  type: 'button',
@@ -480,14 +481,14 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
480
481
  }
481
482
  return [sizeInput];
482
483
  }
483
- if (!isEditorControlsEnabled) {
484
+ if (!isNewEditorToolbarEnabled) {
484
485
  toolbarButtons.push(sizeInput);
485
486
  toolbarButtons.push({
486
487
  type: 'separator'
487
488
  });
488
489
  }
489
490
  }
490
- if (!isEditorControlsEnabled) {
491
+ if (!isNewEditorToolbarEnabled) {
491
492
  if (allowCommentsOnMedia) {
492
493
  toolbarButtons.push((0, _comments.commentButton)(intl, state, pluginInjectionApi, onCommentButtonMount), {
493
494
  type: 'separator',
@@ -549,7 +550,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
549
550
  id: 'editor.media.viewer',
550
551
  testId: 'file-preview-toolbar-button',
551
552
  type: 'button',
552
- icon: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? _growDiagonal.default : _maximize.default,
553
+ icon: _maximize.default,
553
554
  title: intl.formatMessage(_mediaUi.messages.preview),
554
555
  onClick: function onClick() {
555
556
  var _handleShowMediaViewe2;
@@ -585,7 +586,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
585
586
  supportsViewMode: true
586
587
  });
587
588
  }
588
- if (!isEditorControlsEnabled) {
589
+ if (!isNewEditorToolbarEnabled) {
589
590
  var _pluginInjectionApi$a8;
590
591
  if (allowAltTextOnImages) {
591
592
  var _pluginInjectionApi$a7;
@@ -635,7 +636,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
635
636
  id: 'editor.media.viewer',
636
637
  testId: 'file-preview-toolbar-button',
637
638
  type: 'button',
638
- icon: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? _growDiagonal.default : _maximize.default,
639
+ icon: _growDiagonal.default,
639
640
  title: intl.formatMessage(_mediaUi.messages.preview),
640
641
  onClick: function onClick() {
641
642
  var _handleShowMediaViewe3;
@@ -801,7 +802,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
801
802
  };
802
803
  items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);
803
804
  }
804
- if (!mediaPluginState.isResizing && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
805
+ if (!mediaPluginState.isResizing && (0, _toolbarFlagCheck.areToolbarFlagsEnabled)()) {
805
806
  var _pluginInjectionApi$a0, _pluginInjectionApi$a1;
806
807
  (0, _utils2.updateToFullHeightSeparator)(items);
807
808
  var customOptions = [].concat((0, _toConsumableArray2.default)((0, _linking3.getLinkingDropdownOptions)(state, intl, mediaLinkingState, allowMediaInline && selectedNodeType && selectedNodeType === mediaInline, allowLinking, isViewOnly)), (0, _toConsumableArray2.default)((0, _altText2.getAltTextDropdownOption)(state, intl.formatMessage, allowAltTextOnImages, selectedNodeType, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a0 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a0 === void 0 ? void 0 : _pluginInjectionApi$a0.actions)), (0, _toConsumableArray2.default)((0, _pixelResizing2.getResizeDropdownOption)(options, state, intl.formatMessage, selectedNodeType)));
@@ -10,6 +10,7 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
10
10
  var _react = _interopRequireDefault(require("react"));
11
11
  var _analytics = require("@atlaskit/editor-common/analytics");
12
12
  var _messages = _interopRequireWildcard(require("@atlaskit/editor-common/messages"));
13
+ var _toolbarFlagCheck = require("@atlaskit/editor-common/toolbar-flag-check");
13
14
  var _state2 = require("@atlaskit/editor-prosemirror/state");
14
15
  var _delete = _interopRequireDefault(require("@atlaskit/icon/core/delete"));
15
16
  var _growDiagonal = _interopRequireDefault(require("@atlaskit/icon/core/grow-diagonal"));
@@ -47,12 +48,12 @@ var generateMediaInlineFloatingToolbar = exports.generateMediaInlineFloatingTool
47
48
  return getMediaInlineImageToolbar(state, intl, mediaPluginState, hoverDecoration, editorAnalyticsAPI, pluginInjectionApi, mediaLinkingState, options);
48
49
  }
49
50
  var items = [];
50
- var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
51
+ var isNewEditorToolbarEnabled = (0, _toolbarFlagCheck.areToolbarFlagsEnabled)();
51
52
  var preview = _objectSpread({
52
53
  id: 'editor.media.viewer',
53
54
  testId: 'file-preview-toolbar-button',
54
55
  type: 'button',
55
- icon: (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') ? _growDiagonal.default : _maximize.default,
56
+ icon: isNewEditorToolbarEnabled ? _growDiagonal.default : _maximize.default,
56
57
  title: intl.formatMessage(_mediaUi.messages.preview),
57
58
  onClick: function onClick() {
58
59
  var _handleShowMediaViewe;
@@ -61,7 +62,7 @@ var generateMediaInlineFloatingToolbar = exports.generateMediaInlineFloatingTool
61
62
  api: pluginInjectionApi
62
63
  })) !== null && _handleShowMediaViewe !== void 0 ? _handleShowMediaViewe : false;
63
64
  }
64
- }, isEditorControlsEnabled && {
65
+ }, isNewEditorToolbarEnabled && {
65
66
  supportsViewMode: true
66
67
  });
67
68
  var disableDownloadButton = (0, _utils.getIsDownloadDisabledByDataSecurityPolicy)(mediaPluginState);
@@ -75,10 +76,10 @@ var generateMediaInlineFloatingToolbar = exports.generateMediaInlineFloatingTool
75
76
  },
76
77
  disabled: disableDownloadButton,
77
78
  title: intl.formatMessage(_mediaUi.messages.download)
78
- }, isEditorControlsEnabled && {
79
+ }, isNewEditorToolbarEnabled && {
79
80
  supportsViewMode: true
80
81
  });
81
- if (!isEditorControlsEnabled) {
82
+ if (!isNewEditorToolbarEnabled) {
82
83
  items.push({
83
84
  id: 'editor.media.view.switcher.inline',
84
85
  type: 'button',
@@ -5,6 +5,7 @@ import { alignmentIcons, buildLayoutButtons, buildLayoutDropdown, layoutToMessag
5
5
  import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
6
6
  import { mediaInlineImagesEnabled } from '@atlaskit/editor-common/media-inline';
7
7
  import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
8
+ import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-check';
8
9
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
9
10
  import { contains, findParentNodeOfType, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
10
11
  import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
@@ -111,12 +112,12 @@ export const handleShowMediaViewer = ({
111
112
  const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) => {
112
113
  var _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$c3;
113
114
  const disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
114
- const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
115
+ const isNewEditorToolbarEnabled = areToolbarFlagsEnabled();
115
116
  const preview = {
116
117
  id: 'editor.media.viewer',
117
118
  testId: 'file-preview-toolbar-button',
118
119
  type: 'button',
119
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
120
+ icon: isNewEditorToolbarEnabled ? GrowDiagonalIcon : MaximizeIcon,
120
121
  title: intl.formatMessage(messages.preview),
121
122
  onClick: () => {
122
123
  var _handleShowMediaViewe;
@@ -138,18 +139,18 @@ const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDe
138
139
  },
139
140
  title: intl.formatMessage(messages.download),
140
141
  disabled: disableDownloadButton,
141
- ...(isEditorControlsEnabled && {
142
+ ...(isNewEditorToolbarEnabled && {
142
143
  supportsViewMode: true
143
144
  })
144
145
  };
145
- if (isViewOnly && !isEditorControlsEnabled) {
146
+ if (isViewOnly && !isNewEditorToolbarEnabled) {
146
147
  return [];
147
148
  }
148
149
  const {
149
150
  mediaGroup
150
151
  } = state.schema.nodes;
151
152
  const items = [];
152
- if (!isEditorControlsEnabled) {
153
+ if (!isNewEditorToolbarEnabled) {
153
154
  items.push({
154
155
  id: 'editor.media.view.switcher.inline',
155
156
  type: 'button',
@@ -268,7 +269,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
268
269
  const {
269
270
  hoverDecoration
270
271
  } = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {};
271
- const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
272
+ const isNewEditorToolbarEnabled = areToolbarFlagsEnabled();
272
273
  const disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(pluginState);
273
274
  if (shouldShowImageBorder(state)) {
274
275
  toolbarButtons.push({
@@ -297,7 +298,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
297
298
  });
298
299
  }
299
300
  });
300
- if (!isEditorControlsEnabled) {
301
+ if (!isNewEditorToolbarEnabled) {
301
302
  toolbarButtons.push({
302
303
  type: 'separator'
303
304
  });
@@ -318,7 +319,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
318
319
  }
319
320
  const layoutButtons = buildLayoutButtons(state, intl, state.schema.nodes.mediaSingle, widthPlugin, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions, allowResizing, allowResizingInTables, true, true, isChangingLayoutDisabled, allowPixelResizing);
320
321
  const addLayoutDropdownToToolbar = () => {
321
- if (editorExperiment('platform_editor_controls', 'variant1')) {
322
+ if (isNewEditorToolbarEnabled) {
322
323
  var _pluginInjectionApi$a4;
323
324
  const layoutDropdown = buildLayoutDropdown(state, intl, state.schema.nodes.mediaSingle, widthPlugin, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions, allowResizing, allowResizingInTables, true, true, isChangingLayoutDisabled, allowPixelResizing);
324
325
  toolbarButtons = [...toolbarButtons, ...layoutDropdown];
@@ -346,7 +347,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
346
347
  title: intl.formatMessage(layoutToMessages[selectedLayoutIcon.value]),
347
348
  icon: selectedLayoutIcon.icon
348
349
  };
349
- toolbarButtons = [...toolbarButtons, trigger, ...(isEditorControlsEnabled ? [] : [{
350
+ toolbarButtons = [...toolbarButtons, trigger, ...(isNewEditorToolbarEnabled ? [] : [{
350
351
  type: 'separator'
351
352
  }])];
352
353
  }
@@ -384,7 +385,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
384
385
  const hasCaption = contains(selectedNode.node, state.schema.nodes.caption);
385
386
  const inlineSwitcherTitle = intl.formatMessage(hasCaption ? mediaAndEmbedToolbarMessages.changeToMediaInlineImageCaptionWarning : mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
386
387
  const floatingSwitcherTitle = intl.formatMessage(mediaAndEmbedToolbarMessages.changeToMediaSingle);
387
- if (!isEditorControlsEnabled) {
388
+ if (!isNewEditorToolbarEnabled) {
388
389
  var _pluginInjectionApi$a5;
389
390
  toolbarButtons.push({
390
391
  type: 'button',
@@ -472,14 +473,14 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
472
473
  }
473
474
  return [sizeInput];
474
475
  }
475
- if (!isEditorControlsEnabled) {
476
+ if (!isNewEditorToolbarEnabled) {
476
477
  toolbarButtons.push(sizeInput);
477
478
  toolbarButtons.push({
478
479
  type: 'separator'
479
480
  });
480
481
  }
481
482
  }
482
- if (!isEditorControlsEnabled) {
483
+ if (!isNewEditorToolbarEnabled) {
483
484
  if (allowCommentsOnMedia) {
484
485
  toolbarButtons.push(commentButton(intl, state, pluginInjectionApi, onCommentButtonMount), {
485
486
  type: 'separator',
@@ -547,7 +548,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
547
548
  id: 'editor.media.viewer',
548
549
  testId: 'file-preview-toolbar-button',
549
550
  type: 'button',
550
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
551
+ icon: MaximizeIcon,
551
552
  title: intl.formatMessage(messages.preview),
552
553
  onClick: () => {
553
554
  var _handleShowMediaViewe2;
@@ -583,7 +584,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
583
584
  supportsViewMode: true
584
585
  });
585
586
  }
586
- if (!isEditorControlsEnabled) {
587
+ if (!isNewEditorToolbarEnabled) {
587
588
  var _pluginInjectionApi$a8;
588
589
  if (allowAltTextOnImages) {
589
590
  var _pluginInjectionApi$a7;
@@ -633,7 +634,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
633
634
  id: 'editor.media.viewer',
634
635
  testId: 'file-preview-toolbar-button',
635
636
  type: 'button',
636
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
637
+ icon: GrowDiagonalIcon,
637
638
  title: intl.formatMessage(messages.preview),
638
639
  onClick: () => {
639
640
  var _handleShowMediaViewe3;
@@ -803,7 +804,7 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
803
804
  };
804
805
  items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);
805
806
  }
806
- if (!mediaPluginState.isResizing && editorExperiment('platform_editor_controls', 'variant1')) {
807
+ if (!mediaPluginState.isResizing && areToolbarFlagsEnabled()) {
807
808
  var _pluginInjectionApi$a0, _pluginInjectionApi$a1;
808
809
  updateToFullHeightSeparator(items);
809
810
  const customOptions = [...getLinkingDropdownOptions(state, intl, mediaLinkingState, allowMediaInline && selectedNodeType && selectedNodeType === mediaInline, allowLinking, isViewOnly), ...getAltTextDropdownOption(state, intl.formatMessage, allowAltTextOnImages, selectedNodeType, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a0 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a0 === void 0 ? void 0 : _pluginInjectionApi$a0.actions), ...getResizeDropdownOption(options, state, intl.formatMessage, selectedNodeType)];
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
3
3
  import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
4
+ import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-check';
4
5
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
5
6
  import DeleteIcon from '@atlaskit/icon/core/delete';
6
7
  import GrowDiagonalIcon from '@atlaskit/icon/core/grow-diagonal';
@@ -36,12 +37,12 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
36
37
  return getMediaInlineImageToolbar(state, intl, mediaPluginState, hoverDecoration, editorAnalyticsAPI, pluginInjectionApi, mediaLinkingState, options);
37
38
  }
38
39
  const items = [];
39
- const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
40
+ const isNewEditorToolbarEnabled = areToolbarFlagsEnabled();
40
41
  const preview = {
41
42
  id: 'editor.media.viewer',
42
43
  testId: 'file-preview-toolbar-button',
43
44
  type: 'button',
44
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
45
+ icon: isNewEditorToolbarEnabled ? GrowDiagonalIcon : MaximizeIcon,
45
46
  title: intl.formatMessage(messages.preview),
46
47
  onClick: () => {
47
48
  var _handleShowMediaViewe;
@@ -50,7 +51,7 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
50
51
  api: pluginInjectionApi
51
52
  })) !== null && _handleShowMediaViewe !== void 0 ? _handleShowMediaViewe : false;
52
53
  },
53
- ...(isEditorControlsEnabled && {
54
+ ...(isNewEditorToolbarEnabled && {
54
55
  supportsViewMode: true
55
56
  })
56
57
  };
@@ -65,11 +66,11 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
65
66
  },
66
67
  disabled: disableDownloadButton,
67
68
  title: intl.formatMessage(messages.download),
68
- ...(isEditorControlsEnabled && {
69
+ ...(isNewEditorToolbarEnabled && {
69
70
  supportsViewMode: true
70
71
  })
71
72
  };
72
- if (!isEditorControlsEnabled) {
73
+ if (!isNewEditorToolbarEnabled) {
73
74
  items.push({
74
75
  id: 'editor.media.view.switcher.inline',
75
76
  type: 'button',
@@ -9,6 +9,7 @@ import { alignmentIcons, buildLayoutButtons, buildLayoutDropdown, layoutToMessag
9
9
  import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
10
10
  import { mediaInlineImagesEnabled } from '@atlaskit/editor-common/media-inline';
11
11
  import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
12
+ import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-check';
12
13
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
13
14
  import { contains, findParentNodeOfType, hasParentNodeOfType, removeSelectedNode } from '@atlaskit/editor-prosemirror/utils';
14
15
  import { akEditorSelectedNodeClassName } from '@atlaskit/editor-shared-styles';
@@ -114,12 +115,12 @@ export var handleShowMediaViewer = function handleShowMediaViewer(_ref) {
114
115
  var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) {
115
116
  var _pluginInjectionApi$c;
116
117
  var disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
117
- var isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
118
+ var isNewEditorToolbarEnabled = areToolbarFlagsEnabled();
118
119
  var preview = {
119
120
  id: 'editor.media.viewer',
120
121
  testId: 'file-preview-toolbar-button',
121
122
  type: 'button',
122
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
123
+ icon: isNewEditorToolbarEnabled ? GrowDiagonalIcon : MaximizeIcon,
123
124
  title: intl.formatMessage(messages.preview),
124
125
  onClick: function onClick() {
125
126
  var _handleShowMediaViewe;
@@ -141,15 +142,15 @@ var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar
141
142
  },
142
143
  title: intl.formatMessage(messages.download),
143
144
  disabled: disableDownloadButton
144
- }, isEditorControlsEnabled && {
145
+ }, isNewEditorToolbarEnabled && {
145
146
  supportsViewMode: true
146
147
  });
147
- if (isViewOnly && !isEditorControlsEnabled) {
148
+ if (isViewOnly && !isNewEditorToolbarEnabled) {
148
149
  return [];
149
150
  }
150
151
  var mediaGroup = state.schema.nodes.mediaGroup;
151
152
  var items = [];
152
- if (!isEditorControlsEnabled) {
153
+ if (!isNewEditorToolbarEnabled) {
153
154
  items.push({
154
155
  id: 'editor.media.view.switcher.inline',
155
156
  type: 'button',
@@ -269,7 +270,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
269
270
  var toolbarButtons = [];
270
271
  var _ref2 = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
271
272
  hoverDecoration = _ref2.hoverDecoration;
272
- var isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
273
+ var isNewEditorToolbarEnabled = areToolbarFlagsEnabled();
273
274
  var disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(pluginState);
274
275
  if (shouldShowImageBorder(state)) {
275
276
  toolbarButtons.push({
@@ -296,7 +297,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
296
297
  });
297
298
  }
298
299
  });
299
- if (!isEditorControlsEnabled) {
300
+ if (!isNewEditorToolbarEnabled) {
300
301
  toolbarButtons.push({
301
302
  type: 'separator'
302
303
  });
@@ -317,7 +318,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
317
318
  }
318
319
  var layoutButtons = buildLayoutButtons(state, intl, state.schema.nodes.mediaSingle, widthPlugin, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a3 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a3 === void 0 ? void 0 : _pluginInjectionApi$a3.actions, allowResizing, allowResizingInTables, true, true, isChangingLayoutDisabled, allowPixelResizing);
319
320
  var addLayoutDropdownToToolbar = function addLayoutDropdownToToolbar() {
320
- if (editorExperiment('platform_editor_controls', 'variant1')) {
321
+ if (isNewEditorToolbarEnabled) {
321
322
  var _pluginInjectionApi$a4;
322
323
  var layoutDropdown = buildLayoutDropdown(state, intl, state.schema.nodes.mediaSingle, widthPlugin, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions, allowResizing, allowResizingInTables, true, true, isChangingLayoutDisabled, allowPixelResizing);
323
324
  toolbarButtons = [].concat(_toConsumableArray(toolbarButtons), _toConsumableArray(layoutDropdown));
@@ -345,7 +346,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
345
346
  title: intl.formatMessage(layoutToMessages[selectedLayoutIcon.value]),
346
347
  icon: selectedLayoutIcon.icon
347
348
  };
348
- toolbarButtons = [].concat(_toConsumableArray(toolbarButtons), [trigger], _toConsumableArray(isEditorControlsEnabled ? [] : [{
349
+ toolbarButtons = [].concat(_toConsumableArray(toolbarButtons), [trigger], _toConsumableArray(isNewEditorToolbarEnabled ? [] : [{
349
350
  type: 'separator'
350
351
  }]));
351
352
  }
@@ -383,7 +384,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
383
384
  var hasCaption = contains(selectedNode.node, state.schema.nodes.caption);
384
385
  var inlineSwitcherTitle = intl.formatMessage(hasCaption ? mediaAndEmbedToolbarMessages.changeToMediaInlineImageCaptionWarning : mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
385
386
  var floatingSwitcherTitle = intl.formatMessage(mediaAndEmbedToolbarMessages.changeToMediaSingle);
386
- if (!isEditorControlsEnabled) {
387
+ if (!isNewEditorToolbarEnabled) {
387
388
  var _pluginInjectionApi$a5;
388
389
  toolbarButtons.push({
389
390
  type: 'button',
@@ -471,14 +472,14 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
471
472
  }
472
473
  return [sizeInput];
473
474
  }
474
- if (!isEditorControlsEnabled) {
475
+ if (!isNewEditorToolbarEnabled) {
475
476
  toolbarButtons.push(sizeInput);
476
477
  toolbarButtons.push({
477
478
  type: 'separator'
478
479
  });
479
480
  }
480
481
  }
481
- if (!isEditorControlsEnabled) {
482
+ if (!isNewEditorToolbarEnabled) {
482
483
  if (allowCommentsOnMedia) {
483
484
  toolbarButtons.push(commentButton(intl, state, pluginInjectionApi, onCommentButtonMount), {
484
485
  type: 'separator',
@@ -540,7 +541,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
540
541
  id: 'editor.media.viewer',
541
542
  testId: 'file-preview-toolbar-button',
542
543
  type: 'button',
543
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
544
+ icon: MaximizeIcon,
544
545
  title: intl.formatMessage(messages.preview),
545
546
  onClick: function onClick() {
546
547
  var _handleShowMediaViewe2;
@@ -576,7 +577,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
576
577
  supportsViewMode: true
577
578
  });
578
579
  }
579
- if (!isEditorControlsEnabled) {
580
+ if (!isNewEditorToolbarEnabled) {
580
581
  var _pluginInjectionApi$a8;
581
582
  if (allowAltTextOnImages) {
582
583
  var _pluginInjectionApi$a7;
@@ -626,7 +627,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
626
627
  id: 'editor.media.viewer',
627
628
  testId: 'file-preview-toolbar-button',
628
629
  type: 'button',
629
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
630
+ icon: GrowDiagonalIcon,
630
631
  title: intl.formatMessage(messages.preview),
631
632
  onClick: function onClick() {
632
633
  var _handleShowMediaViewe3;
@@ -792,7 +793,7 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
792
793
  };
793
794
  items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);
794
795
  }
795
- if (!mediaPluginState.isResizing && editorExperiment('platform_editor_controls', 'variant1')) {
796
+ if (!mediaPluginState.isResizing && areToolbarFlagsEnabled()) {
796
797
  var _pluginInjectionApi$a0, _pluginInjectionApi$a1;
797
798
  updateToFullHeightSeparator(items);
798
799
  var customOptions = [].concat(_toConsumableArray(getLinkingDropdownOptions(state, intl, mediaLinkingState, allowMediaInline && selectedNodeType && selectedNodeType === mediaInline, allowLinking, isViewOnly)), _toConsumableArray(getAltTextDropdownOption(state, intl.formatMessage, allowAltTextOnImages, selectedNodeType, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a0 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a0 === void 0 ? void 0 : _pluginInjectionApi$a0.actions)), _toConsumableArray(getResizeDropdownOption(options, state, intl.formatMessage, selectedNodeType)));
@@ -4,6 +4,7 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
4
4
  import React from 'react';
5
5
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
6
6
  import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
7
+ import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-check';
7
8
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
8
9
  import DeleteIcon from '@atlaskit/icon/core/delete';
9
10
  import GrowDiagonalIcon from '@atlaskit/icon/core/grow-diagonal';
@@ -38,12 +39,12 @@ export var generateMediaInlineFloatingToolbar = function generateMediaInlineFloa
38
39
  return getMediaInlineImageToolbar(state, intl, mediaPluginState, hoverDecoration, editorAnalyticsAPI, pluginInjectionApi, mediaLinkingState, options);
39
40
  }
40
41
  var items = [];
41
- var isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
42
+ var isNewEditorToolbarEnabled = areToolbarFlagsEnabled();
42
43
  var preview = _objectSpread({
43
44
  id: 'editor.media.viewer',
44
45
  testId: 'file-preview-toolbar-button',
45
46
  type: 'button',
46
- icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
47
+ icon: isNewEditorToolbarEnabled ? GrowDiagonalIcon : MaximizeIcon,
47
48
  title: intl.formatMessage(messages.preview),
48
49
  onClick: function onClick() {
49
50
  var _handleShowMediaViewe;
@@ -52,7 +53,7 @@ export var generateMediaInlineFloatingToolbar = function generateMediaInlineFloa
52
53
  api: pluginInjectionApi
53
54
  })) !== null && _handleShowMediaViewe !== void 0 ? _handleShowMediaViewe : false;
54
55
  }
55
- }, isEditorControlsEnabled && {
56
+ }, isNewEditorToolbarEnabled && {
56
57
  supportsViewMode: true
57
58
  });
58
59
  var disableDownloadButton = getIsDownloadDisabledByDataSecurityPolicy(mediaPluginState);
@@ -66,10 +67,10 @@ export var generateMediaInlineFloatingToolbar = function generateMediaInlineFloa
66
67
  },
67
68
  disabled: disableDownloadButton,
68
69
  title: intl.formatMessage(messages.download)
69
- }, isEditorControlsEnabled && {
70
+ }, isNewEditorToolbarEnabled && {
70
71
  supportsViewMode: true
71
72
  });
72
- if (!isEditorControlsEnabled) {
73
+ if (!isNewEditorToolbarEnabled) {
73
74
  items.push({
74
75
  id: 'editor.media.view.switcher.inline',
75
76
  type: 'button',
@@ -1,3 +1,3 @@
1
- export type { MediaNextEditorPluginType as MediaPlugin } from './mediaPluginType';
1
+ export type { MediaNextEditorPluginType as MediaPlugin, MediaPluginDependencies, } from './mediaPluginType';
2
2
  export type { MediaPluginOptions } from './types/index';
3
3
  export { mediaPlugin } from './mediaPlugin';
@@ -1,3 +1,3 @@
1
- export type { MediaNextEditorPluginType as MediaPlugin } from './mediaPluginType';
1
+ export type { MediaNextEditorPluginType as MediaPlugin, MediaPluginDependencies, } from './mediaPluginType';
2
2
  export type { MediaPluginOptions } from './types/index';
3
3
  export { mediaPlugin } from './mediaPlugin';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-media",
3
- "version": "5.1.7",
3
+ "version": "5.2.0",
4
4
  "description": "Media plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -39,14 +39,14 @@
39
39
  "@atlaskit/button": "^23.2.0",
40
40
  "@atlaskit/editor-palette": "^2.1.0",
41
41
  "@atlaskit/editor-plugin-analytics": "^3.0.0",
42
- "@atlaskit/editor-plugin-annotation": "^3.0.0",
43
- "@atlaskit/editor-plugin-connectivity": "^3.0.0",
42
+ "@atlaskit/editor-plugin-annotation": "^3.1.0",
43
+ "@atlaskit/editor-plugin-connectivity": "^3.1.0",
44
44
  "@atlaskit/editor-plugin-decorations": "^3.0.0",
45
45
  "@atlaskit/editor-plugin-editor-disabled": "^3.0.0",
46
46
  "@atlaskit/editor-plugin-editor-viewmode": "^5.0.0",
47
- "@atlaskit/editor-plugin-floating-toolbar": "^5.0.0",
47
+ "@atlaskit/editor-plugin-floating-toolbar": "^5.1.0",
48
48
  "@atlaskit/editor-plugin-focus": "^2.0.0",
49
- "@atlaskit/editor-plugin-grid": "^3.0.0",
49
+ "@atlaskit/editor-plugin-grid": "^3.1.0",
50
50
  "@atlaskit/editor-plugin-guideline": "^3.0.0",
51
51
  "@atlaskit/editor-plugin-interaction": "^4.0.0",
52
52
  "@atlaskit/editor-plugin-selection": "^3.0.0",
@@ -55,8 +55,8 @@
55
55
  "@atlaskit/editor-shared-styles": "^3.5.0",
56
56
  "@atlaskit/editor-tables": "^2.9.0",
57
57
  "@atlaskit/form": "^12.0.0",
58
- "@atlaskit/icon": "^27.3.0",
59
- "@atlaskit/icon-lab": "^5.1.0",
58
+ "@atlaskit/icon": "^27.5.0",
59
+ "@atlaskit/icon-lab": "^5.2.0",
60
60
  "@atlaskit/media-card": "^79.4.0",
61
61
  "@atlaskit/media-client": "^35.1.0",
62
62
  "@atlaskit/media-client-react": "^4.1.0",
@@ -69,8 +69,8 @@
69
69
  "@atlaskit/primitives": "^14.10.0",
70
70
  "@atlaskit/textfield": "^8.0.0",
71
71
  "@atlaskit/theme": "^19.0.0",
72
- "@atlaskit/tmp-editor-statsig": "^9.8.0",
73
- "@atlaskit/tokens": "^5.5.0",
72
+ "@atlaskit/tmp-editor-statsig": "^9.9.0",
73
+ "@atlaskit/tokens": "^5.6.0",
74
74
  "@atlaskit/tooltip": "^20.3.0",
75
75
  "@babel/runtime": "^7.0.0",
76
76
  "@emotion/react": "^11.7.1",
@@ -84,7 +84,7 @@
84
84
  "typescript": "~5.4.2"
85
85
  },
86
86
  "peerDependencies": {
87
- "@atlaskit/editor-common": "^107.8.0",
87
+ "@atlaskit/editor-common": "^107.9.0",
88
88
  "@atlaskit/media-core": "^37.0.0",
89
89
  "react": "^18.2.0",
90
90
  "react-dom": "^18.2.0",