@atlaskit/editor-plugin-media 2.6.2 → 2.6.4

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 +18 -0
  2. package/dist/cjs/pm-plugins/pixel-resizing/ui/index.js +2 -2
  3. package/dist/cjs/ui/ImageBorder/index.js +3 -3
  4. package/dist/cjs/ui/toolbar/index.js +44 -38
  5. package/dist/es2019/pm-plugins/pixel-resizing/ui/index.js +1 -1
  6. package/dist/es2019/ui/ImageBorder/index.js +1 -1
  7. package/dist/es2019/ui/toolbar/index.js +45 -39
  8. package/dist/esm/pm-plugins/pixel-resizing/ui/index.js +1 -1
  9. package/dist/esm/ui/ImageBorder/index.js +1 -1
  10. package/dist/esm/ui/toolbar/index.js +45 -39
  11. package/package.json +6 -3
package/CHANGELOG.md CHANGED
@@ -1,5 +1,23 @@
1
1
  # @atlaskit/editor-plugin-media
2
2
 
3
+ ## 2.6.4
4
+
5
+ ### Patch Changes
6
+
7
+ - [#144829](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/144829)
8
+ [`14b488c2295de`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/14b488c2295de) -
9
+ [ux] ED27537 Update alignment dropdown in media and embed card floating toolbar
10
+ - Updated dependencies
11
+
12
+ ## 2.6.3
13
+
14
+ ### Patch Changes
15
+
16
+ - [#142352](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/142352)
17
+ [`05903fde6d94d`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/05903fde6d94d) -
18
+ Internal change to use Compiled variant of `@atlaskit/primitives`.
19
+ - Updated dependencies
20
+
3
21
  ## 2.6.2
4
22
 
5
23
  ### Patch Changes
package/dist/cjs/pm-plugins/pixel-resizing/ui/index.js CHANGED
@@ -13,7 +13,7 @@ var _mediaSingle = require("@atlaskit/editor-common/media-single");
13
13
  var _state = require("@atlaskit/editor-prosemirror/state");
14
14
  var _utils = require("@atlaskit/editor-prosemirror/utils");
15
15
  var _editorSharedStyles = require("@atlaskit/editor-shared-styles");
16
- var _primitives = require("@atlaskit/primitives");
16
+ var _compiled = require("@atlaskit/primitives/compiled");
17
17
  var _commands = require("../../../ui/toolbar/commands");
18
18
  var _utils2 = require("../../../ui/toolbar/utils");
19
19
  var _mediaSingle2 = require("../../utils/media-single");
@@ -119,6 +119,6 @@ var FullWidthDisplay = exports.FullWidthDisplay = function FullWidthDisplay(_ref
119
119
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-imported-style-values, @atlaskit/design-system/consistent-css-prop-usage -- Ignored via go/DSP-18766
120
120
  (0, _react2.jsx)("div", {
121
121
  css: _styles.pixelSizingFullWidthLabelStyles
122
- }, (0, _react2.jsx)(_primitives.Text, null, formatMessage(_media.pixelEntryMessages.fullWidthLabel)))
122
+ }, (0, _react2.jsx)(_compiled.Text, null, formatMessage(_media.pixelEntryMessages.fullWidthLabel)))
123
123
  );
124
124
  };
package/dist/cjs/ui/ImageBorder/index.js CHANGED
@@ -22,7 +22,7 @@ var _strokeWeightSmall = _interopRequireDefault(require("@atlaskit/icon/core/str
22
22
  var _chevronDown = _interopRequireDefault(require("@atlaskit/icon/glyph/chevron-down"));
23
23
  var _chevronDown2 = _interopRequireDefault(require("@atlaskit/icon/utility/chevron-down"));
24
24
  var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
25
- var _primitives = require("@atlaskit/primitives");
25
+ var _compiled = require("@atlaskit/primitives/compiled");
26
26
  var _tooltip = _interopRequireDefault(require("@atlaskit/tooltip"));
27
27
  var _styles2 = require("./styles");
28
28
  /**
@@ -142,7 +142,7 @@ var ImageBorder = function ImageBorder(_ref) {
142
142
  return setIsColorSubmenuOpen(!isColorSubmenuOpen);
143
143
  });
144
144
  }
145
- }, (0, _react2.jsx)(_primitives.Text, null, formatMessage(_media.imageBorderMessages.borderColor)), (0, _react2.jsx)("div", {
145
+ }, (0, _react2.jsx)(_compiled.Text, null, formatMessage(_media.imageBorderMessages.borderColor)), (0, _react2.jsx)("div", {
146
146
  css: borderColorSelectStyles
147
147
  })), (0, _react2.jsx)("div", {
148
148
  // eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
@@ -209,7 +209,7 @@ var ImageBorder = function ImageBorder(_ref) {
209
209
  return setIsSizeSubmenuOpen(!isSizeSubmenuOpen);
210
210
  });
211
211
  }
212
- }, (0, _react2.jsx)(_primitives.Text, null, formatMessage(_media.imageBorderMessages.borderSize)), (0, _react2.jsx)("div", {
212
+ }, (0, _react2.jsx)(_compiled.Text, null, formatMessage(_media.imageBorderMessages.borderSize)), (0, _react2.jsx)("div", {
213
213
  css: _styles2.contextualMenuArrow
214
214
  })), (0, _react2.jsx)("div", {
215
215
  //eslint-disable-next-line @atlaskit/ui-styling-standard/no-classname-prop -- Ignored via go/DSP-18766
package/dist/cjs/ui/toolbar/index.js CHANGED
@@ -291,32 +291,38 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
291
291
  }
292
292
  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);
293
293
  var addLayoutDropdownToToolbar = function addLayoutDropdownToToolbar() {
294
- var selectedLayoutIcon = (0, _utils2.getSelectedLayoutIcon)([].concat((0, _toConsumableArray2.default)(_card.alignmentIcons), (0, _toConsumableArray2.default)(_card.wrappingIcons)),
295
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
296
- selectedNode.node);
297
- if (selectedLayoutIcon && layoutButtons.length) {
298
- var _options = {
299
- render: function render(props) {
300
- return /*#__PURE__*/_react.default.createElement(_layoutGroup.LayoutGroup, (0, _extends2.default)({
301
- layoutButtons: layoutButtons
302
- // Ignored via go/ees005
303
- // eslint-disable-next-line react/jsx-props-no-spreading
304
- }, props));
305
- },
306
- width: 188,
307
- height: 32
308
- };
309
- var trigger = {
310
- id: 'media-single-layout',
311
- testId: 'media-single-layout-dropdown-trigger',
312
- type: 'dropdown',
313
- options: _options,
314
- title: intl.formatMessage(_card.layoutToMessages[selectedLayoutIcon.value]),
315
- icon: selectedLayoutIcon.icon
316
- };
317
- toolbarButtons = [].concat((0, _toConsumableArray2.default)(toolbarButtons), [trigger, {
318
- type: 'separator'
319
- }]);
294
+ if ((0, _experiments.editorExperiment)('platform_editor_controls', 'variant1') && (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_6')) {
295
+ var _pluginInjectionApi$a4;
296
+ 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);
297
+ toolbarButtons = [].concat((0, _toConsumableArray2.default)(toolbarButtons), (0, _toConsumableArray2.default)(layoutDropdown));
298
+ } else {
299
+ var selectedLayoutIcon = (0, _utils2.getSelectedLayoutIcon)([].concat((0, _toConsumableArray2.default)(_card.alignmentIcons), (0, _toConsumableArray2.default)(_card.wrappingIcons)),
300
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
301
+ selectedNode.node);
302
+ if (selectedLayoutIcon && layoutButtons.length) {
303
+ var _options = {
304
+ render: function render(props) {
305
+ return /*#__PURE__*/_react.default.createElement(_layoutGroup.LayoutGroup, (0, _extends2.default)({
306
+ layoutButtons: layoutButtons
307
+ // Ignored via go/ees005
308
+ // eslint-disable-next-line react/jsx-props-no-spreading
309
+ }, props));
310
+ },
311
+ width: 188,
312
+ height: 32
313
+ };
314
+ var trigger = {
315
+ id: 'media-single-layout',
316
+ testId: 'media-single-layout-dropdown-trigger',
317
+ type: 'dropdown',
318
+ options: _options,
319
+ title: intl.formatMessage(_card.layoutToMessages[selectedLayoutIcon.value]),
320
+ icon: selectedLayoutIcon.icon
321
+ };
322
+ toolbarButtons = [].concat((0, _toConsumableArray2.default)(toolbarButtons), [trigger, {
323
+ type: 'separator'
324
+ }]);
325
+ }
320
326
  }
321
327
  };
322
328
  if ((0, _platformFeatureFlags.fg)('platform_editor_remove_media_inline_feature_flag')) {
@@ -352,7 +358,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
352
358
  var inlineSwitcherTitle = intl.formatMessage(hasCaption ? _messages.mediaAndEmbedToolbarMessages.changeToMediaInlineImageCaptionWarning : _messages.mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
353
359
  var floatingSwitcherTitle = intl.formatMessage(_messages.mediaAndEmbedToolbarMessages.changeToMediaSingle);
354
360
  if (!isEditorControlsEnabled) {
355
- var _pluginInjectionApi$a4;
361
+ var _pluginInjectionApi$a5;
356
362
  toolbarButtons.push({
357
363
  type: 'button',
358
364
  id: 'editor.media.image.view.switcher.inline',
@@ -366,7 +372,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
366
372
  LEGACY_fallbackIcon: _card.IconInline
367
373
  });
368
374
  },
369
- onClick: (0, _commands.changeMediaSingleToMediaInline)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions),
375
+ onClick: (0, _commands.changeMediaSingleToMediaInline)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions),
370
376
  testId: 'image-inline-appearance'
371
377
  }, {
372
378
  type: 'button',
@@ -390,12 +396,12 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
390
396
  type: 'separator'
391
397
  });
392
398
  } else {
393
- var _pluginInjectionApi$a5;
399
+ var _pluginInjectionApi$a6;
394
400
  var inlineTitle = intl.formatMessage(_messages.mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
395
401
  var _options2 = [{
396
402
  id: 'editor.media.convert.mediainline',
397
403
  title: inlineTitle,
398
- onClick: (0, _commands.changeMediaSingleToMediaInline)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions),
404
+ onClick: (0, _commands.changeMediaSingleToMediaInline)(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a6 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a6 === void 0 ? void 0 : _pluginInjectionApi$a6.actions),
399
405
  icon: /*#__PURE__*/_react.default.createElement(_imageInline.default, {
400
406
  color: "currentColor",
401
407
  spacing: "spacious",
@@ -516,10 +522,10 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
516
522
  };
517
523
  var openLink = function openLink() {
518
524
  if (editorView) {
519
- var _pluginInjectionApi$a6;
525
+ var _pluginInjectionApi$a7;
520
526
  var tr = editorView.state.tr,
521
527
  dispatch = editorView.dispatch;
522
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a6 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a6 === void 0 || _pluginInjectionApi$a6.actions.attachAnalyticsEvent({
528
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a7 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a7 === void 0 || _pluginInjectionApi$a7.actions.attachAnalyticsEvent({
523
529
  eventType: _analytics.EVENT_TYPE.TRACK,
524
530
  action: _analytics.ACTION.VISITED,
525
531
  actionSubject: _analytics.ACTION_SUBJECT.MEDIA,
@@ -594,8 +600,8 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
594
600
  }
595
601
  if (!isEditorControlsEnabled) {
596
602
  if (allowAltTextOnImages) {
597
- var _pluginInjectionApi$a7;
598
- toolbarButtons.push((0, _altText2.altTextButton)(intl, state, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a7 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a7 === void 0 ? void 0 : _pluginInjectionApi$a7.actions), {
603
+ var _pluginInjectionApi$a8;
604
+ toolbarButtons.push((0, _altText2.altTextButton)(intl, state, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions), {
599
605
  type: 'separator'
600
606
  });
601
607
  }
@@ -769,7 +775,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
769
775
  selectedNodeType = state.selection.node.type;
770
776
  }
771
777
  if (allowMediaInline && (parentMediaGroupNode === null || parentMediaGroupNode === void 0 ? void 0 : parentMediaGroupNode.node.type) === mediaGroup) {
772
- var _pluginInjectionApi$a8, _pluginInjectionApi$f2;
778
+ var _pluginInjectionApi$a9, _pluginInjectionApi$f2;
773
779
  var mediaOffset = state.selection.$from.parentOffset + 1;
774
780
  baseToolbar.getDomRef = function () {
775
781
  var _mediaPluginState$ele2;
@@ -778,7 +784,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
778
784
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
779
785
  return (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(selector);
780
786
  };
781
- items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector, isViewOnly);
787
+ items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a9 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a9 === void 0 ? void 0 : _pluginInjectionApi$a9.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector, isViewOnly);
782
788
  } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
783
789
  items = (0, _mediaInline2.generateMediaInlineFloatingToolbar)(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options);
784
790
  } else {
@@ -792,9 +798,9 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
792
798
  items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);
793
799
  }
794
800
  if (!mediaPluginState.isResizing && (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1')) {
795
- var _pluginInjectionApi$a9;
801
+ var _pluginInjectionApi$a10;
796
802
  (0, _utils2.updateToFullHeightSeparator)(items);
797
- 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$a9 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a9 === void 0 ? void 0 : _pluginInjectionApi$a9.actions)), (0, _toConsumableArray2.default)((0, _pixelResizing2.getResizeDropdownOption)(options, state, intl.formatMessage, selectedNodeType)));
803
+ 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$a10 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a10 === void 0 ? void 0 : _pluginInjectionApi$a10.actions)), (0, _toConsumableArray2.default)((0, _pixelResizing2.getResizeDropdownOption)(options, state, intl.formatMessage, selectedNodeType)));
798
804
  if (customOptions.length) {
799
805
  customOptions.push({
800
806
  type: 'separator'
package/dist/es2019/pm-plugins/pixel-resizing/ui/index.js CHANGED
@@ -11,7 +11,7 @@ import { calcMinWidth, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlask
11
11
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
12
12
  import { hasParentNode } from '@atlaskit/editor-prosemirror/utils';
13
13
  import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
14
- import { Text } from '@atlaskit/primitives';
14
+ import { Text } from '@atlaskit/primitives/compiled';
15
15
  import { updateMediaSingleWidthTr } from '../../../ui/toolbar/commands';
16
16
  import { getPixelWidthOfElement, calcNewLayout } from '../../../ui/toolbar/utils';
17
17
  import { isVideo } from '../../utils/media-single';
package/dist/es2019/ui/ImageBorder/index.js CHANGED
@@ -20,7 +20,7 @@ import StrokeWeightSmallIcon from '@atlaskit/icon/core/stroke-weight-small';
20
20
  import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
21
21
  import ChevronDownIcon from '@atlaskit/icon/utility/chevron-down';
22
22
  import { fg } from '@atlaskit/platform-feature-flags';
23
- import { Text } from '@atlaskit/primitives';
23
+ import { Text } from '@atlaskit/primitives/compiled';
24
24
  import Tooltip from '@atlaskit/tooltip';
25
25
  import { buttonStyle, buttonWrapperStyle, contextualMenuArrow, contextualMenuColorIcon, contextualSubMenu, dropdownOptionButton, dropdownWrapper, itemSpacing, line, menuItemDimensions, toolbarButtonWrapper } from './styles';
26
26
  const ImageBorder = ({
package/dist/es2019/ui/toolbar/index.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import _extends from "@babel/runtime/helpers/extends";
2
2
  import React from 'react';
3
3
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
4
- import { alignmentIcons, buildLayoutButtons, IconCard, IconEmbed, IconInline, layoutToMessages, wrappingIcons } from '@atlaskit/editor-common/card';
4
+ import { alignmentIcons, buildLayoutButtons, buildLayoutDropdown, IconCard, IconEmbed, IconInline, layoutToMessages, wrappingIcons } from '@atlaskit/editor-common/card';
5
5
  import { mediaInlineImagesEnabled } from '@atlaskit/editor-common/media-inline';
6
6
  import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
7
7
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
@@ -282,32 +282,38 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
282
282
  }
283
283
  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);
284
284
  const addLayoutDropdownToToolbar = () => {
285
- const selectedLayoutIcon = getSelectedLayoutIcon([...alignmentIcons, ...wrappingIcons],
286
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
287
- selectedNode.node);
288
- if (selectedLayoutIcon && layoutButtons.length) {
289
- const options = {
290
- render: props => {
291
- return /*#__PURE__*/React.createElement(LayoutGroup, _extends({
292
- layoutButtons: layoutButtons
293
- // Ignored via go/ees005
294
- // eslint-disable-next-line react/jsx-props-no-spreading
295
- }, props));
296
- },
297
- width: 188,
298
- height: 32
299
- };
300
- const trigger = {
301
- id: 'media-single-layout',
302
- testId: 'media-single-layout-dropdown-trigger',
303
- type: 'dropdown',
304
- options: options,
305
- title: intl.formatMessage(layoutToMessages[selectedLayoutIcon.value]),
306
- icon: selectedLayoutIcon.icon
307
- };
308
- toolbarButtons = [...toolbarButtons, trigger, {
309
- type: 'separator'
310
- }];
285
+ if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
286
+ var _pluginInjectionApi$a4;
287
+ 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);
288
+ toolbarButtons = [...toolbarButtons, ...layoutDropdown];
289
+ } else {
290
+ const selectedLayoutIcon = getSelectedLayoutIcon([...alignmentIcons, ...wrappingIcons],
291
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
292
+ selectedNode.node);
293
+ if (selectedLayoutIcon && layoutButtons.length) {
294
+ const options = {
295
+ render: props => {
296
+ return /*#__PURE__*/React.createElement(LayoutGroup, _extends({
297
+ layoutButtons: layoutButtons
298
+ // Ignored via go/ees005
299
+ // eslint-disable-next-line react/jsx-props-no-spreading
300
+ }, props));
301
+ },
302
+ width: 188,
303
+ height: 32
304
+ };
305
+ const trigger = {
306
+ id: 'media-single-layout',
307
+ testId: 'media-single-layout-dropdown-trigger',
308
+ type: 'dropdown',
309
+ options: options,
310
+ title: intl.formatMessage(layoutToMessages[selectedLayoutIcon.value]),
311
+ icon: selectedLayoutIcon.icon
312
+ };
313
+ toolbarButtons = [...toolbarButtons, trigger, {
314
+ type: 'separator'
315
+ }];
316
+ }
311
317
  }
312
318
  };
313
319
  if (fg('platform_editor_remove_media_inline_feature_flag')) {
@@ -343,7 +349,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
343
349
  const inlineSwitcherTitle = intl.formatMessage(hasCaption ? mediaAndEmbedToolbarMessages.changeToMediaInlineImageCaptionWarning : mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
344
350
  const floatingSwitcherTitle = intl.formatMessage(mediaAndEmbedToolbarMessages.changeToMediaSingle);
345
351
  if (!isEditorControlsEnabled) {
346
- var _pluginInjectionApi$a4;
352
+ var _pluginInjectionApi$a5;
347
353
  toolbarButtons.push({
348
354
  type: 'button',
349
355
  id: 'editor.media.image.view.switcher.inline',
@@ -355,7 +361,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
355
361
  LEGACY_size: "medium",
356
362
  LEGACY_fallbackIcon: IconInline
357
363
  }),
358
- onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions),
364
+ onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions),
359
365
  testId: 'image-inline-appearance'
360
366
  }, {
361
367
  type: 'button',
@@ -377,12 +383,12 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
377
383
  type: 'separator'
378
384
  });
379
385
  } else {
380
- var _pluginInjectionApi$a5;
386
+ var _pluginInjectionApi$a6;
381
387
  const inlineTitle = intl.formatMessage(mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
382
388
  const options = [{
383
389
  id: 'editor.media.convert.mediainline',
384
390
  title: inlineTitle,
385
- onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions),
391
+ onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a6 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a6 === void 0 ? void 0 : _pluginInjectionApi$a6.actions),
386
392
  icon: /*#__PURE__*/React.createElement(ImageInlineIcon, {
387
393
  color: "currentColor",
388
394
  spacing: "spacious",
@@ -507,14 +513,14 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
507
513
  };
508
514
  const openLink = () => {
509
515
  if (editorView) {
510
- var _pluginInjectionApi$a6;
516
+ var _pluginInjectionApi$a7;
511
517
  const {
512
518
  state: {
513
519
  tr
514
520
  },
515
521
  dispatch
516
522
  } = editorView;
517
- pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a6 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a6 === void 0 ? void 0 : _pluginInjectionApi$a6.actions.attachAnalyticsEvent({
523
+ pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a7 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a7 === void 0 ? void 0 : _pluginInjectionApi$a7.actions.attachAnalyticsEvent({
518
524
  eventType: EVENT_TYPE.TRACK,
519
525
  action: ACTION.VISITED,
520
526
  actionSubject: ACTION_SUBJECT.MEDIA,
@@ -589,8 +595,8 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
589
595
  }
590
596
  if (!isEditorControlsEnabled) {
591
597
  if (allowAltTextOnImages) {
592
- var _pluginInjectionApi$a7;
593
- toolbarButtons.push(altTextButton(intl, state, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a7 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a7 === void 0 ? void 0 : _pluginInjectionApi$a7.actions), {
598
+ var _pluginInjectionApi$a8;
599
+ toolbarButtons.push(altTextButton(intl, state, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions), {
594
600
  type: 'separator'
595
601
  });
596
602
  }
@@ -768,7 +774,7 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
768
774
  selectedNodeType = state.selection.node.type;
769
775
  }
770
776
  if (allowMediaInline && (parentMediaGroupNode === null || parentMediaGroupNode === void 0 ? void 0 : parentMediaGroupNode.node.type) === mediaGroup) {
771
- var _pluginInjectionApi$a8, _pluginInjectionApi$f3, _pluginInjectionApi$f4;
777
+ var _pluginInjectionApi$a9, _pluginInjectionApi$f3, _pluginInjectionApi$f4;
772
778
  const mediaOffset = state.selection.$from.parentOffset + 1;
773
779
  baseToolbar.getDomRef = () => {
774
780
  var _mediaPluginState$ele2;
@@ -777,7 +783,7 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
777
783
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
778
784
  return (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(selector);
779
785
  };
780
- items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f3 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f3 === void 0 ? void 0 : (_pluginInjectionApi$f4 = _pluginInjectionApi$f3.actions) === null || _pluginInjectionApi$f4 === void 0 ? void 0 : _pluginInjectionApi$f4.forceFocusSelector, isViewOnly);
786
+ items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a9 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a9 === void 0 ? void 0 : _pluginInjectionApi$a9.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f3 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f3 === void 0 ? void 0 : (_pluginInjectionApi$f4 = _pluginInjectionApi$f3.actions) === null || _pluginInjectionApi$f4 === void 0 ? void 0 : _pluginInjectionApi$f4.forceFocusSelector, isViewOnly);
781
787
  } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
782
788
  items = generateMediaInlineFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options);
783
789
  } else {
@@ -791,9 +797,9 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
791
797
  items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);
792
798
  }
793
799
  if (!mediaPluginState.isResizing && editorExperiment('platform_editor_controls', 'variant1')) {
794
- var _pluginInjectionApi$a9;
800
+ var _pluginInjectionApi$a10;
795
801
  updateToFullHeightSeparator(items);
796
- 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$a9 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a9 === void 0 ? void 0 : _pluginInjectionApi$a9.actions), ...getResizeDropdownOption(options, state, intl.formatMessage, selectedNodeType)];
802
+ 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$a10 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a10 === void 0 ? void 0 : _pluginInjectionApi$a10.actions), ...getResizeDropdownOption(options, state, intl.formatMessage, selectedNodeType)];
797
803
  if (customOptions.length) {
798
804
  customOptions.push({
799
805
  type: 'separator'
package/dist/esm/pm-plugins/pixel-resizing/ui/index.js CHANGED
@@ -14,7 +14,7 @@ import { calcMinWidth, DEFAULT_IMAGE_HEIGHT, DEFAULT_IMAGE_WIDTH } from '@atlask
14
14
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
15
15
  import { hasParentNode } from '@atlaskit/editor-prosemirror/utils';
16
16
  import { akEditorDefaultLayoutWidth, akEditorFullWidthLayoutWidth } from '@atlaskit/editor-shared-styles';
17
- import { Text } from '@atlaskit/primitives';
17
+ import { Text } from '@atlaskit/primitives/compiled';
18
18
  import { updateMediaSingleWidthTr } from '../../../ui/toolbar/commands';
19
19
  import { getPixelWidthOfElement, calcNewLayout } from '../../../ui/toolbar/utils';
20
20
  import { isVideo } from '../../utils/media-single';
package/dist/esm/ui/ImageBorder/index.js CHANGED
@@ -21,7 +21,7 @@ import StrokeWeightSmallIcon from '@atlaskit/icon/core/stroke-weight-small';
21
21
  import ExpandIcon from '@atlaskit/icon/glyph/chevron-down';
22
22
  import ChevronDownIcon from '@atlaskit/icon/utility/chevron-down';
23
23
  import { fg } from '@atlaskit/platform-feature-flags';
24
- import { Text } from '@atlaskit/primitives';
24
+ import { Text } from '@atlaskit/primitives/compiled';
25
25
  import Tooltip from '@atlaskit/tooltip';
26
26
  import { buttonStyle, buttonWrapperStyle, contextualMenuArrow, contextualMenuColorIcon, contextualSubMenu, dropdownOptionButton, dropdownWrapper, itemSpacing, line, menuItemDimensions, toolbarButtonWrapper } from './styles';
27
27
  var ImageBorder = function ImageBorder(_ref) {
package/dist/esm/ui/toolbar/index.js CHANGED
@@ -5,7 +5,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
5
5
  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) { _defineProperty(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; }
6
6
  import React from 'react';
7
7
  import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
8
- import { alignmentIcons, buildLayoutButtons, IconCard, IconEmbed, IconInline, layoutToMessages, wrappingIcons } from '@atlaskit/editor-common/card';
8
+ import { alignmentIcons, buildLayoutButtons, buildLayoutDropdown, IconCard, IconEmbed, IconInline, layoutToMessages, wrappingIcons } from '@atlaskit/editor-common/card';
9
9
  import { mediaInlineImagesEnabled } from '@atlaskit/editor-common/media-inline';
10
10
  import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
11
11
  import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
@@ -281,32 +281,38 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
281
281
  }
282
282
  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);
283
283
  var addLayoutDropdownToToolbar = function addLayoutDropdownToToolbar() {
284
- var selectedLayoutIcon = getSelectedLayoutIcon([].concat(_toConsumableArray(alignmentIcons), _toConsumableArray(wrappingIcons)),
285
- // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
286
- selectedNode.node);
287
- if (selectedLayoutIcon && layoutButtons.length) {
288
- var _options = {
289
- render: function render(props) {
290
- return /*#__PURE__*/React.createElement(LayoutGroup, _extends({
291
- layoutButtons: layoutButtons
292
- // Ignored via go/ees005
293
- // eslint-disable-next-line react/jsx-props-no-spreading
294
- }, props));
295
- },
296
- width: 188,
297
- height: 32
298
- };
299
- var trigger = {
300
- id: 'media-single-layout',
301
- testId: 'media-single-layout-dropdown-trigger',
302
- type: 'dropdown',
303
- options: _options,
304
- title: intl.formatMessage(layoutToMessages[selectedLayoutIcon.value]),
305
- icon: selectedLayoutIcon.icon
306
- };
307
- toolbarButtons = [].concat(_toConsumableArray(toolbarButtons), [trigger, {
308
- type: 'separator'
309
- }]);
284
+ if (editorExperiment('platform_editor_controls', 'variant1') && fg('platform_editor_controls_patch_6')) {
285
+ var _pluginInjectionApi$a4;
286
+ 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);
287
+ toolbarButtons = [].concat(_toConsumableArray(toolbarButtons), _toConsumableArray(layoutDropdown));
288
+ } else {
289
+ var selectedLayoutIcon = getSelectedLayoutIcon([].concat(_toConsumableArray(alignmentIcons), _toConsumableArray(wrappingIcons)),
290
+ // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
291
+ selectedNode.node);
292
+ if (selectedLayoutIcon && layoutButtons.length) {
293
+ var _options = {
294
+ render: function render(props) {
295
+ return /*#__PURE__*/React.createElement(LayoutGroup, _extends({
296
+ layoutButtons: layoutButtons
297
+ // Ignored via go/ees005
298
+ // eslint-disable-next-line react/jsx-props-no-spreading
299
+ }, props));
300
+ },
301
+ width: 188,
302
+ height: 32
303
+ };
304
+ var trigger = {
305
+ id: 'media-single-layout',
306
+ testId: 'media-single-layout-dropdown-trigger',
307
+ type: 'dropdown',
308
+ options: _options,
309
+ title: intl.formatMessage(layoutToMessages[selectedLayoutIcon.value]),
310
+ icon: selectedLayoutIcon.icon
311
+ };
312
+ toolbarButtons = [].concat(_toConsumableArray(toolbarButtons), [trigger, {
313
+ type: 'separator'
314
+ }]);
315
+ }
310
316
  }
311
317
  };
312
318
  if (fg('platform_editor_remove_media_inline_feature_flag')) {
@@ -342,7 +348,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
342
348
  var inlineSwitcherTitle = intl.formatMessage(hasCaption ? mediaAndEmbedToolbarMessages.changeToMediaInlineImageCaptionWarning : mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
343
349
  var floatingSwitcherTitle = intl.formatMessage(mediaAndEmbedToolbarMessages.changeToMediaSingle);
344
350
  if (!isEditorControlsEnabled) {
345
- var _pluginInjectionApi$a4;
351
+ var _pluginInjectionApi$a5;
346
352
  toolbarButtons.push({
347
353
  type: 'button',
348
354
  id: 'editor.media.image.view.switcher.inline',
@@ -356,7 +362,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
356
362
  LEGACY_fallbackIcon: IconInline
357
363
  });
358
364
  },
359
- onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a4 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a4 === void 0 ? void 0 : _pluginInjectionApi$a4.actions),
365
+ onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions),
360
366
  testId: 'image-inline-appearance'
361
367
  }, {
362
368
  type: 'button',
@@ -380,12 +386,12 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
380
386
  type: 'separator'
381
387
  });
382
388
  } else {
383
- var _pluginInjectionApi$a5;
389
+ var _pluginInjectionApi$a6;
384
390
  var inlineTitle = intl.formatMessage(mediaAndEmbedToolbarMessages.changeToMediaInlineImage);
385
391
  var _options2 = [{
386
392
  id: 'editor.media.convert.mediainline',
387
393
  title: inlineTitle,
388
- onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a5 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a5 === void 0 ? void 0 : _pluginInjectionApi$a5.actions),
394
+ onClick: changeMediaSingleToMediaInline(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a6 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a6 === void 0 ? void 0 : _pluginInjectionApi$a6.actions),
389
395
  icon: /*#__PURE__*/React.createElement(ImageInlineIcon, {
390
396
  color: "currentColor",
391
397
  spacing: "spacious",
@@ -506,10 +512,10 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
506
512
  };
507
513
  var openLink = function openLink() {
508
514
  if (editorView) {
509
- var _pluginInjectionApi$a6;
515
+ var _pluginInjectionApi$a7;
510
516
  var tr = editorView.state.tr,
511
517
  dispatch = editorView.dispatch;
512
- pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a6 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a6 === void 0 || _pluginInjectionApi$a6.actions.attachAnalyticsEvent({
518
+ pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a7 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a7 === void 0 || _pluginInjectionApi$a7.actions.attachAnalyticsEvent({
513
519
  eventType: EVENT_TYPE.TRACK,
514
520
  action: ACTION.VISITED,
515
521
  actionSubject: ACTION_SUBJECT.MEDIA,
@@ -584,8 +590,8 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
584
590
  }
585
591
  if (!isEditorControlsEnabled) {
586
592
  if (allowAltTextOnImages) {
587
- var _pluginInjectionApi$a7;
588
- toolbarButtons.push(altTextButton(intl, state, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a7 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a7 === void 0 ? void 0 : _pluginInjectionApi$a7.actions), {
593
+ var _pluginInjectionApi$a8;
594
+ toolbarButtons.push(altTextButton(intl, state, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions), {
589
595
  type: 'separator'
590
596
  });
591
597
  }
@@ -759,7 +765,7 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
759
765
  selectedNodeType = state.selection.node.type;
760
766
  }
761
767
  if (allowMediaInline && (parentMediaGroupNode === null || parentMediaGroupNode === void 0 ? void 0 : parentMediaGroupNode.node.type) === mediaGroup) {
762
- var _pluginInjectionApi$a8, _pluginInjectionApi$f2;
768
+ var _pluginInjectionApi$a9, _pluginInjectionApi$f2;
763
769
  var mediaOffset = state.selection.$from.parentOffset + 1;
764
770
  baseToolbar.getDomRef = function () {
765
771
  var _mediaPluginState$ele2;
@@ -768,7 +774,7 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
768
774
  // eslint-disable-next-line @atlaskit/editor/no-as-casting
769
775
  return (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(selector);
770
776
  };
771
- items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector, isViewOnly);
777
+ items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a9 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a9 === void 0 ? void 0 : _pluginInjectionApi$a9.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector, isViewOnly);
772
778
  } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
773
779
  items = generateMediaInlineFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options);
774
780
  } else {
@@ -782,9 +788,9 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
782
788
  items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);
783
789
  }
784
790
  if (!mediaPluginState.isResizing && editorExperiment('platform_editor_controls', 'variant1')) {
785
- var _pluginInjectionApi$a9;
791
+ var _pluginInjectionApi$a10;
786
792
  updateToFullHeightSeparator(items);
787
- 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$a9 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a9 === void 0 ? void 0 : _pluginInjectionApi$a9.actions)), _toConsumableArray(getResizeDropdownOption(options, state, intl.formatMessage, selectedNodeType)));
793
+ 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$a10 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a10 === void 0 ? void 0 : _pluginInjectionApi$a10.actions)), _toConsumableArray(getResizeDropdownOption(options, state, intl.formatMessage, selectedNodeType)));
788
794
  if (customOptions.length) {
789
795
  customOptions.push({
790
796
  type: 'separator'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/editor-plugin-media",
3
- "version": "2.6.2",
3
+ "version": "2.6.4",
4
4
  "description": "Media plugin for @atlaskit/editor-core",
5
5
  "author": "Atlassian Pty Ltd",
6
6
  "license": "Apache-2.0",
@@ -38,7 +38,7 @@
38
38
  "@atlaskit/analytics-namespaced-context": "^7.0.0",
39
39
  "@atlaskit/analytics-next": "^11.0.0",
40
40
  "@atlaskit/button": "^23.0.0",
41
- "@atlaskit/editor-common": "^103.11.0",
41
+ "@atlaskit/editor-common": "^103.13.0",
42
42
  "@atlaskit/editor-palette": "^2.1.0",
43
43
  "@atlaskit/editor-plugin-analytics": "^2.2.0",
44
44
  "@atlaskit/editor-plugin-annotation": "^2.7.0",
@@ -70,7 +70,7 @@
70
70
  "@atlaskit/primitives": "^14.4.0",
71
71
  "@atlaskit/textfield": "^8.0.0",
72
72
  "@atlaskit/theme": "^18.0.0",
73
- "@atlaskit/tmp-editor-statsig": "^4.12.0",
73
+ "@atlaskit/tmp-editor-statsig": "^4.13.0",
74
74
  "@atlaskit/tokens": "^4.8.0",
75
75
  "@atlaskit/tooltip": "^20.0.0",
76
76
  "@babel/runtime": "^7.0.0",
@@ -178,6 +178,9 @@
178
178
  "platform_editor_media_single_toolbar_target": {
179
179
  "type": "boolean"
180
180
  },
181
+ "platform_editor_controls_patch_6": {
182
+ "type": "boolean"
183
+ },
181
184
  "platform_editor_ssr_media": {
182
185
  "type": "boolean"
183
186
  },