@atlaskit/editor-plugin-media 2.3.10 → 2.3.12

package/dist/es2019/ui/toolbar/index.js

@@ -78,41 +78,10 @@ export const handleShowMediaViewer = ({
 };
 const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) => {
   var _mediaPluginState$med, _pluginInjectionApi$c, _pluginInjectionApi$c2, _pluginInjectionApi$c3;
-  if (isViewOnly) {
-    return [];
-  }
   const enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 ? void 0 : (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
   const disableDownloadButton = typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
-  const {
-    mediaGroup
-  } = state.schema.nodes;
-  const items = [{
-    id: 'editor.media.view.switcher.inline',
-    type: 'button',
-    icon: ImageInlineIcon,
-    iconFallback: IconInline,
-    selected: false,
-    focusEditoronEnter: true,
-    disabled: false,
-    onClick: changeMediaCardToInline(editorAnalyticsAPI, forceFocusSelector),
-    title: intl.formatMessage(cardMessages.inlineTitle),
-    testId: 'inline-appearance',
-    className: 'inline-appearance' // a11y. uses to force focus on item
-  }, {
-    id: 'editor.media.view.switcher.thumbnail',
-    type: 'button',
-    icon: SmartLinkCardIcon,
-    iconFallback: IconCard,
-    selected: true,
-    disabled: false,
-    focusEditoronEnter: true,
-    onClick: () => true,
-    title: intl.formatMessage(cardMessages.blockTitle),
-    testId: 'thumbnail-appearance',
-    className: 'thumbnail-appearance' // a11y. uses to force focus on item
-  }, {
-    type: 'separator'
-  }, {
+  const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
+  const preview = {
     id: 'editor.media.viewer',
     testId: 'file-preview-toolbar-button',
     type: 'button',
@@ -128,9 +97,8 @@ const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDe
     },
     disabled: (pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$c = pluginInjectionApi.connectivity) === null || _pluginInjectionApi$c === void 0 ? void 0 : (_pluginInjectionApi$c2 = _pluginInjectionApi$c.sharedState) === null || _pluginInjectionApi$c2 === void 0 ? void 0 : (_pluginInjectionApi$c3 = _pluginInjectionApi$c2.currentState()) === null || _pluginInjectionApi$c3 === void 0 ? void 0 : _pluginInjectionApi$c3.mode) === 'offline',
     supportsViewMode: true
-  }, {
-    type: 'separator'
-  }, {
+  };
+  const download = {
     id: 'editor.media.card.download',
     type: 'button',
     icon: DownloadIcon,
@@ -139,34 +107,116 @@ const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDe
       return true;
     },
     title: intl.formatMessage(messages.download),
-    disabled: disableDownloadButton
-  }, {
-    type: 'separator'
-  }, {
-    type: 'copy-button',
-    supportsViewMode: true,
-    items: [{
-      state,
-      formatMessage: intl.formatMessage,
-      nodeType: mediaGroup
-    }]
-  }, {
-    type: 'separator'
-  }, {
-    id: 'editor.media.delete',
-    type: 'button',
-    appearance: 'danger',
-    focusEditoronEnter: true,
-    icon: DeleteIcon,
-    iconFallback: RemoveIcon,
-    onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, true),
-    onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, false),
-    onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, true),
-    onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, false),
-    title: intl.formatMessage(commonMessages.remove),
-    onClick: handleRemoveMediaGroup,
-    testId: 'media-toolbar-remove-button'
-  }];
+    disabled: disableDownloadButton,
+    ...(isEditorControlsEnabled && {
+      supportsViewMode: true
+    })
+  };
+  if (isViewOnly && !isEditorControlsEnabled) {
+    return [];
+  }
+  const {
+    mediaGroup
+  } = state.schema.nodes;
+  const items = [];
+  if (!isEditorControlsEnabled) {
+    items.push({
+      id: 'editor.media.view.switcher.inline',
+      type: 'button',
+      icon: ImageInlineIcon,
+      iconFallback: IconInline,
+      selected: false,
+      focusEditoronEnter: true,
+      disabled: false,
+      onClick: changeMediaCardToInline(editorAnalyticsAPI, forceFocusSelector),
+      title: intl.formatMessage(cardMessages.inlineTitle),
+      testId: 'inline-appearance',
+      className: 'inline-appearance' // a11y. uses to force focus on item
+    }, {
+      id: 'editor.media.view.switcher.thumbnail',
+      type: 'button',
+      icon: SmartLinkCardIcon,
+      iconFallback: IconCard,
+      selected: true,
+      disabled: false,
+      focusEditoronEnter: true,
+      onClick: () => true,
+      title: intl.formatMessage(cardMessages.blockTitle),
+      testId: 'thumbnail-appearance',
+      className: 'thumbnail-appearance' // a11y. uses to force focus on item
+    }, {
+      type: 'separator'
+    }, preview, {
+      type: 'separator'
+    }, download, {
+      type: 'separator'
+    }, {
+      type: 'copy-button',
+      supportsViewMode: true,
+      items: [{
+        state,
+        formatMessage: intl.formatMessage,
+        nodeType: mediaGroup
+      }]
+    }, {
+      type: 'separator'
+    }, {
+      id: 'editor.media.delete',
+      type: 'button',
+      appearance: 'danger',
+      focusEditoronEnter: true,
+      icon: DeleteIcon,
+      iconFallback: RemoveIcon,
+      onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, true),
+      onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, false),
+      onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, true),
+      onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaGroup, false),
+      title: intl.formatMessage(commonMessages.remove),
+      onClick: handleRemoveMediaGroup,
+      testId: 'media-toolbar-remove-button'
+    });
+  } else {
+    const options = [{
+      id: 'editor.media.view.switcher.inline',
+      title: intl.formatMessage(cardMessages.inlineTitle),
+      onClick: changeMediaCardToInline(editorAnalyticsAPI, forceFocusSelector),
+      icon: /*#__PURE__*/React.createElement(ImageInlineIcon, {
+        label: "",
+        spacing: "spacious"
+      })
+    }, {
+      id: 'editor.media.view.switcher.thumbnail',
+      title: intl.formatMessage(cardMessages.blockTitle),
+      selected: true,
+      onClick: () => true,
+      icon: /*#__PURE__*/React.createElement(SmartLinkCardIcon, {
+        label: "",
+        spacing: "spacious"
+      })
+    }];
+    const switcherDropdown = {
+      title: intl.formatMessage(messages.fileDisplayOptions),
+      id: 'media-group-inline-switcher-toolbar-item',
+      testId: 'media-group-inline-switcher-dropdown',
+      type: 'dropdown',
+      options,
+      icon: () => /*#__PURE__*/React.createElement(SmartLinkCardIcon, {
+        label: "",
+        spacing: "spacious"
+      })
+    };
+    items.push(switcherDropdown, {
+      type: 'separator',
+      fullHeight: true
+    }, download, {
+      type: 'separator',
+      fullHeight: true,
+      supportsViewMode: true
+    }, preview, {
+      type: 'separator',
+      fullHeight: true
+    });
+  }
   return items;
 };
 const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, mediaLinkingState, pluginInjectionApi) => {

package/dist/es2019/ui/toolbar/mediaInline.js

@@ -4,6 +4,7 @@ import { IconCard, IconEmbed, IconInline } from '@atlaskit/editor-common/card';
 import commonMessages, { cardMessages, mediaAndEmbedToolbarMessages } from '@atlaskit/editor-common/messages';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import DeleteIcon from '@atlaskit/icon/core/delete';
+import GrowDiagonalIcon from '@atlaskit/icon/core/grow-diagonal';
 import ImageFullscreenIcon from '@atlaskit/icon/core/image-fullscreen';
 import ImageInlineIcon from '@atlaskit/icon/core/image-inline';
 import MaximizeIcon from '@atlaskit/icon/core/maximize';
@@ -37,37 +38,13 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
   if (mediaPluginState.allowInlineImages && isImage(mediaType)) {
     return getMediaInlineImageToolbar(state, intl, mediaPluginState, hoverDecoration, editorAnalyticsAPI, pluginInjectionApi, mediaLinkingState, options);
   }
-  const items = [{
-    id: 'editor.media.view.switcher.inline',
-    type: 'button',
-    icon: ImageInlineIcon,
-    iconFallback: IconInline,
-    selected: true,
-    disabled: false,
-    focusEditoronEnter: true,
-    onClick: () => true,
-    title: intl.formatMessage(cardMessages.inlineTitle),
-    testId: 'inline-appearance',
-    className: 'inline-appearance' // a11y. uses to force focus on item
-  }, {
-    id: 'editor.media.view.switcher.thumbnail',
-    type: 'button',
-    icon: SmartLinkCardIcon,
-    iconFallback: IconCard,
-    selected: false,
-    disabled: false,
-    focusEditoronEnter: true,
-    onClick: changeInlineToMediaCard(editorAnalyticsAPI, forceFocusSelector),
-    title: intl.formatMessage(cardMessages.blockTitle),
-    testId: 'thumbnail-appearance',
-    className: 'thumbnail-appearance' // a11y. uses to force focus on item
-  }, {
-    type: 'separator'
-  }, {
+  const items = [];
+  const isEditorControlsEnabled = editorExperiment('platform_editor_controls', 'variant1');
+  const preview = {
     id: 'editor.media.viewer',
     testId: 'file-preview-toolbar-button',
     type: 'button',
-    icon: MaximizeIcon,
+    icon: editorExperiment('platform_editor_controls', 'variant1') ? GrowDiagonalIcon : MaximizeIcon,
     iconFallback: FilePreviewIcon,
     title: intl.formatMessage(messages.preview),
     onClick: () => {
@@ -76,11 +53,12 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
         mediaPluginState,
         api: pluginInjectionApi
       })) !== null && _handleShowMediaViewe !== void 0 ? _handleShowMediaViewe : false;
-    }
-  }, {
-    type: 'separator',
-    fullHeight: editorExperiment('platform_editor_controls', 'variant1')
-  }, {
+    },
+    ...(isEditorControlsEnabled && {
+      supportsViewMode: true
+    })
+  };
+  const download = {
     id: 'editor.media.card.download',
     type: 'button',
     icon: DownloadIcon,
@@ -88,34 +66,109 @@ export const generateMediaInlineFloatingToolbar = (state, intl, mediaPluginState
       downloadMedia(mediaPluginState);
       return true;
     },
-    title: intl.formatMessage(messages.download)
-  }, {
-    type: 'separator'
-  }, {
-    type: 'copy-button',
-    supportsViewMode: true,
-    items: [{
-      state,
-      formatMessage: intl.formatMessage,
-      nodeType: mediaInline
-    }]
-  }, {
-    type: 'separator'
-  }, {
-    id: 'editor.media.delete',
-    type: 'button',
-    appearance: 'danger',
-    focusEditoronEnter: true,
-    icon: DeleteIcon,
-    iconFallback: RemoveIcon,
-    onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, true),
-    onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, false),
-    onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, true),
-    onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, false),
-    title: intl.formatMessage(commonMessages.remove),
-    onClick: removeInlineCard,
-    testId: 'media-toolbar-remove-button'
-  }];
+    title: intl.formatMessage(messages.download),
+    ...(isEditorControlsEnabled && {
+      supportsViewMode: true
+    })
+  };
+  if (!isEditorControlsEnabled) {
+    items.push({
+      id: 'editor.media.view.switcher.inline',
+      type: 'button',
+      icon: ImageInlineIcon,
+      iconFallback: IconInline,
+      selected: true,
+      disabled: false,
+      focusEditoronEnter: true,
+      onClick: () => true,
+      title: intl.formatMessage(cardMessages.inlineTitle),
+      testId: 'inline-appearance',
+      className: 'inline-appearance' // a11y. uses to force focus on item
+    }, {
+      id: 'editor.media.view.switcher.thumbnail',
+      type: 'button',
+      icon: SmartLinkCardIcon,
+      iconFallback: IconCard,
+      selected: false,
+      disabled: false,
+      focusEditoronEnter: true,
+      onClick: changeInlineToMediaCard(editorAnalyticsAPI, forceFocusSelector),
+      title: intl.formatMessage(cardMessages.blockTitle),
+      testId: 'thumbnail-appearance',
+      className: 'thumbnail-appearance' // a11y. uses to force focus on item
+    }, {
+      type: 'separator'
+    }, preview, {
+      type: 'separator'
+    }, download, {
+      type: 'separator'
+    }, {
+      type: 'copy-button',
+      supportsViewMode: true,
+      items: [{
+        state,
+        formatMessage: intl.formatMessage,
+        nodeType: mediaInline
+      }]
+    }, {
+      type: 'separator'
+    }, {
+      id: 'editor.media.delete',
+      type: 'button',
+      appearance: 'danger',
+      focusEditoronEnter: true,
+      icon: DeleteIcon,
+      iconFallback: RemoveIcon,
+      onMouseEnter: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, true),
+      onMouseLeave: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, false),
+      onFocus: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, true),
+      onBlur: hoverDecoration === null || hoverDecoration === void 0 ? void 0 : hoverDecoration(mediaInline, false),
+      title: intl.formatMessage(commonMessages.remove),
+      onClick: removeInlineCard,
+      testId: 'media-toolbar-remove-button'
+    });
+  } else {
+    const options = [{
+      id: 'editor.media.view.switcher.inline',
+      title: intl.formatMessage(cardMessages.inlineTitle),
+      onClick: () => true,
+      selected: true,
+      icon: /*#__PURE__*/React.createElement(ImageInlineIcon, {
+        label: "",
+        spacing: "spacious"
+      })
+    }, {
+      id: 'editor.media.view.switcher.thumbnail',
+      title: intl.formatMessage(cardMessages.blockTitle),
+      onClick: changeInlineToMediaCard(editorAnalyticsAPI, forceFocusSelector),
+      icon: /*#__PURE__*/React.createElement(SmartLinkCardIcon, {
+        label: "",
+        spacing: "spacious"
+      })
+    }];
+    const switcherDropdown = {
+      title: intl.formatMessage(messages.fileDisplayOptions),
+      id: 'media-group-inline-switcher-toolbar-item',
+      testId: 'media-group-inline-switcher-dropdown',
+      type: 'dropdown',
+      options,
+      icon: () => /*#__PURE__*/React.createElement(ImageInlineIcon, {
+        label: "",
+        spacing: "spacious"
+      })
+    };
+    items.push(switcherDropdown, {
+      type: 'separator',
+      fullHeight: true
+    }, download, {
+      type: 'separator',
+      fullHeight: true,
+      supportsViewMode: true
+    }, preview, {
+      type: 'separator',
+      fullHeight: true
+    });
+  }
   return items;
 };
 const getMediaInlineImageToolbar = (state, intl, mediaPluginState, hoverDecoration, editorAnalyticsAPI, pluginInjectionApi, mediaLinkingState, options = {}) => {

package/dist/esm/mediaPlugin.js

@@ -297,7 +297,7 @@ export var mediaPlugin = function mediaPlugin(_ref3) {
     pluginsOptions: {
       quickInsert: function quickInsert(_ref14) {
         var formatMessage = _ref14.formatMessage;
-        return editorExperiment('add-media-from-url', true) ? [] : [{
+        return fg('platform_editor_add_media_from_url_rollout') ? [] : [{
           id: 'media',
           title: formatMessage(messages.mediaFiles),
           description: formatMessage(messages.mediaFilesDescription),

package/dist/esm/nodeviews/mediaGroup.js

@@ -21,6 +21,7 @@ import EditorCloseIcon from '@atlaskit/icon/glyph/editor/close';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
 import { Filmstrip } from '@atlaskit/media-filmstrip';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { stateKey as mediaStateKey } from '../pm-plugins/plugin-key';
 import { useMediaProvider } from '../ui/hooks/useMediaProvider';
 import { MediaGroupNext } from './mediaGroupNext';
@@ -174,7 +175,7 @@ var MediaGroup = /*#__PURE__*/function (_React$Component) {
         items: items,
         mediaClientConfig: viewMediaClientConfig,
         featureFlags: mediaOptions.featureFlags,
-        shouldOpenMediaViewer: editorViewMode
+        shouldOpenMediaViewer: editorViewMode && editorExperiment('platform_editor_controls', 'control')
       });
     });
     _this.mediaNodes = [];

package/dist/esm/nodeviews/mediaGroupNext.js

@@ -12,6 +12,7 @@ import { isNodeSelectedOrInRange, SelectedState, setNodeSelection } from '@atlas
 import EditorCloseIcon from '@atlaskit/icon/glyph/editor/close';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
 import { Filmstrip } from '@atlaskit/media-filmstrip';
+import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { stateKey as mediaStateKey } from '../pm-plugins/plugin-key';
 import { createMediaNodeUpdater } from './mediaNodeUpdater';
 var getIdentifier = function getIdentifier(item) {
@@ -279,7 +280,7 @@ export var MediaGroupNext = injectIntl( /*#__PURE__*/React.memo(function (props)
     items: items,
     mediaClientConfig: viewMediaClientConfig,
     featureFlags: featureFlags,
-    shouldOpenMediaViewer: editorViewMode
+    shouldOpenMediaViewer: editorViewMode && editorExperiment('platform_editor_controls', 'control')
   });
 }));
 MediaGroupNext.displayName = 'MediaGroup';

package/dist/esm/nodeviews/mediaInline.js

@@ -28,6 +28,7 @@ import { SelectionBasedNodeView } from '@atlaskit/editor-common/selection-based-
 import { MediaInlineCard } from '@atlaskit/media-card';
 import { getMediaClient } from '@atlaskit/media-client-react';
 import { MediaInlineCardLoadingView } from '@atlaskit/media-ui';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { isImage } from '../pm-plugins/utils/is-type';
 import { MediaViewerContainer } from '../ui/MediaViewer/MediaViewerContainer';
 import { MediaNodeUpdater } from './mediaNodeUpdater';
@@ -207,7 +208,8 @@ export var MediaInline = function MediaInline(props) {
     mediaNode: props.node,
     mediaPluginState: props.mediaPluginState,
     isEditorViewMode: props.editorViewMode,
-    isSelected: props.isSelected
+    isSelected: props.isSelected,
+    isInline: fg('platform_editor_render_media_viewer_as_inline')
   }, jsx(MediaInlineCard, {
     isSelected: props.isSelected,
     identifier: identifier,

package/dist/esm/nodeviews/mediaSingle.js

@@ -35,7 +35,6 @@ import { findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/u
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { getAttrsFromUrl } from '@atlaskit/media-client';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { insertAndSelectCaptionFromMediaSinglePos } from '../pm-plugins/commands/captions';
 import { MEDIA_CONTENT_WRAP_CLASS_NAME } from '../pm-plugins/main';
 import { isMediaBlobUrlFromAttrs } from '../pm-plugins/utils/media-common';
@@ -309,7 +308,6 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function () {
       var _componentDidMount = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee3() {
-        var _this$props$node$firs2;
         var contextIdentifierProvider;
         return _regeneratorRuntime.wrap(function _callee3$(_context3) {
           while (1) switch (_context3.prev = _context3.next) {
@@ -328,20 +326,7 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
                 contextIdentifierProvider: _context3.t1
               };
               _context3.t0.setState.call(_context3.t0, _context3.t2);
-              // No-op but logging an exposure when an external image is rendered
-              // Remove this block when cleaning up platform_editor_add_media_from_url
-              if (((_this$props$node$firs2 = this.props.node.firstChild) === null || _this$props$node$firs2 === void 0 ? void 0 : _this$props$node$firs2.attrs.type) === 'external') {
-                if (editorExperiment('add-media-from-url', true)) {
-                  editorExperiment('add-media-from-url', true, {
-                    exposure: true
-                  });
-                } else {
-                  editorExperiment('add-media-from-url', false, {
-                    exposure: true
-                  });
-                }
-              }
-            case 11:
+            case 10:
             case "end":
               return _context3.stop();
           }
@@ -468,7 +453,6 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
       var shouldShowPlaceholder = mediaOptions.allowCaptions && node.childCount !== 2 && isSelected && state.selection instanceof NodeSelection;
       shouldShowPlaceholder = !editorDisabled && shouldShowPlaceholder;
       var isCurrentNodeDrafting = (annotationPluginState === null || annotationPluginState === void 0 ? void 0 : annotationPluginState.isDrafting) && (annotationPluginState === null || annotationPluginState === void 0 ? void 0 : annotationPluginState.targetNodeId) === (node === null || node === void 0 || (_node$firstChild = node.firstChild) === null || _node$firstChild === void 0 ? void 0 : _node$firstChild.attrs.id);
-      var shouldShowExternalMediaBadge = attrs.type === 'external';
       var pos = getPos();
       var isInsideTable = pos !== undefined && findParentNodeOfTypeClosestToPos(state.doc.resolve(pos), [state.schema.nodes.table]);
       var currentMediaElement = function currentMediaElement() {
@@ -487,29 +471,24 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
         ,
         className: MediaSingleNodeSelector,
         onClick: this.onMediaSingleClicked
-      }, editorExperiment('add-media-from-url', true) && jsx(MediaBadges, {
+      }, fg('platform_editor_add_media_from_url_rollout') && jsx(MediaBadges, {
         mediaElement: currentMediaElement(),
         mediaHeight: height,
         mediaWidth: width,
         extendedResizeOffset: fg('platform_editor_media_extended_resize_experience') && !isInsideTable
       }, function (_ref5) {
-        var badgeSize = _ref5.badgeSize,
-          visible = _ref5.visible;
-        return jsx(React.Fragment, null, fg('platform_editor_hide_external_media_badge') ? visible && jsx(ExternalImageBadge, {
-          badgeSize: badgeSize,
+        var visible = _ref5.visible;
+        return jsx(React.Fragment, null, visible && jsx(ExternalImageBadge, {
           type: attrs.type,
           url: attrs.type === 'external' ? attrs.url : undefined
-        }) : shouldShowExternalMediaBadge && visible && jsx(ExternalImageBadge, {
-          badgeSize: badgeSize
         }), mediaOptions.allowCommentsOnMedia && jsx(CommentBadgeNextWrapper, {
           view: view,
           api: pluginInjectionApi,
           mediaNode: node === null || node === void 0 ? void 0 : node.firstChild,
           getPos: getPos,
-          isDrafting: isCurrentNodeDrafting,
-          badgeSize: badgeSize
+          isDrafting: isCurrentNodeDrafting
         }));
-      }), !editorExperiment('add-media-from-url', true) && mediaOptions.allowCommentsOnMedia && jsx(CommentBadge, {
+      }), !fg('platform_editor_add_media_from_url_rollout') && mediaOptions.allowCommentsOnMedia && jsx(CommentBadge, {
         view: view,
         api: pluginInjectionApi,
         mediaNode: node === null || node === void 0 ? void 0 : node.firstChild,

package/dist/esm/nodeviews/mediaSingleNext.js

@@ -22,7 +22,6 @@ import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
 import { findParentNodeOfTypeClosestToPos } from '@atlaskit/editor-prosemirror/utils';
 import { getAttrsFromUrl } from '@atlaskit/media-client';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { insertAndSelectCaptionFromMediaSinglePos } from '../pm-plugins/commands/captions';
 import { isMediaBlobUrlFromAttrs } from '../pm-plugins/utils/media-common';
 import { CaptionPlaceholder, CaptionPlaceholderButton } from '../ui/CaptionPlaceholder';
@@ -281,7 +280,7 @@ var useUpdateSizeCallback = function useUpdateSizeCallback(_ref5) {
  */
 var FALLBACK_MOST_COMMON_WIDTH = 760;
 export var MediaSingleNodeNext = function MediaSingleNodeNext(mediaSingleNodeNextProps) {
-  var _pluginInjectionApi$m, _mediaNode$firstChild2;
+  var _pluginInjectionApi$m, _mediaNode$firstChild;
   var selected = mediaSingleNodeNextProps.selected,
     getPos = mediaSingleNodeNextProps.getPos,
     nextMediaNode = mediaSingleNodeNextProps.node,
@@ -357,22 +356,6 @@ export var MediaSingleNodeNext = function MediaSingleNodeNext(mediaSingleNodeNex
       }
     });
   }, [contextIdentifierProviderPromise]);
-  React.useEffect(function () {
-    var _mediaNode$firstChild;
-    // No-op but logging an exposure when an external image is rendered
-    // Remove this block when cleaning up platform_editor_add_media_from_url
-    if (((_mediaNode$firstChild = mediaNode.firstChild) === null || _mediaNode$firstChild === void 0 ? void 0 : _mediaNode$firstChild.attrs.type) === 'external') {
-      if (editorExperiment('add-media-from-url', true)) {
-        editorExperiment('add-media-from-url', true, {
-          exposure: true
-        });
-      } else {
-        editorExperiment('add-media-from-url', false, {
-          exposure: true
-        });
-      }
-    }
-  }, [mediaNode]);
   var _ref6 = mediaNode.attrs,
     layout = _ref6.layout,
     widthType = _ref6.widthType,
@@ -447,8 +430,7 @@ export var MediaSingleNodeNext = function MediaSingleNodeNext(mediaSingleNodeNex
   }, [mediaSingleWidthAttribute, widthType, width, layout, contentWidthForLegacyExperience, containerWidth]);
   var currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 || (_pluginInjectionApi$m = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth : undefined;
   var contentWidth = currentMaxWidth || lineLength;
-  var isCurrentNodeDrafting = Boolean((annotationPluginState === null || annotationPluginState === void 0 ? void 0 : annotationPluginState.isDrafting) && (annotationPluginState === null || annotationPluginState === void 0 ? void 0 : annotationPluginState.targetNodeId) === (mediaNode === null || mediaNode === void 0 || (_mediaNode$firstChild2 = mediaNode.firstChild) === null || _mediaNode$firstChild2 === void 0 ? void 0 : _mediaNode$firstChild2.attrs.id));
-  var shouldShowExternalMediaBadge = childMediaNodeAttrs.type === 'external';
+  var isCurrentNodeDrafting = Boolean((annotationPluginState === null || annotationPluginState === void 0 ? void 0 : annotationPluginState.isDrafting) && (annotationPluginState === null || annotationPluginState === void 0 ? void 0 : annotationPluginState.targetNodeId) === (mediaNode === null || mediaNode === void 0 || (_mediaNode$firstChild = mediaNode.firstChild) === null || _mediaNode$firstChild === void 0 ? void 0 : _mediaNode$firstChild.attrs.id));
   var mediaSingleWrapperRef = /*#__PURE__*/React.createRef();
   var captionPlaceHolderRef = /*#__PURE__*/React.createRef();
   var onMediaSingleClicked = React.useCallback(function (event) {
@@ -485,29 +467,24 @@ export var MediaSingleNodeNext = function MediaSingleNodeNext(mediaSingleNodeNex
     ,
     className: MediaSingleNodeSelector,
     onClick: onMediaSingleClicked
-  }, editorExperiment('add-media-from-url', true) && jsx(MediaBadges, {
+  }, fg('platform_editor_add_media_from_url_rollout') && jsx(MediaBadges, {
     mediaElement: currentMediaElement(),
     mediaHeight: height,
     mediaWidth: width,
     extendedResizeOffset: fg('platform_editor_media_extended_resize_experience') && !isInsideTable
   }, function (_ref7) {
-    var badgeSize = _ref7.badgeSize,
-      visible = _ref7.visible;
-    return jsx(React.Fragment, null, fg('platform_editor_hide_external_media_badge') ? visible && jsx(ExternalImageBadge, {
-      badgeSize: badgeSize,
+    var visible = _ref7.visible;
+    return jsx(React.Fragment, null, visible && jsx(ExternalImageBadge, {
       type: childMediaNodeAttrs.type,
       url: childMediaNodeAttrs.type === 'external' ? childMediaNodeAttrs.url : undefined
-    }) : shouldShowExternalMediaBadge && visible && jsx(ExternalImageBadge, {
-      badgeSize: badgeSize
     }), mediaOptions.allowCommentsOnMedia && jsx(CommentBadgeNextWrapper, {
       view: view,
       api: pluginInjectionApi,
       mediaNode: mediaNode === null || mediaNode === void 0 ? void 0 : mediaNode.firstChild,
       getPos: getPos,
-      isDrafting: isCurrentNodeDrafting,
-      badgeSize: badgeSize
+      isDrafting: isCurrentNodeDrafting
     }));
-  }), !editorExperiment('add-media-from-url', true) && mediaOptions.allowCommentsOnMedia && jsx(CommentBadge, {
+  }), !fg('platform_editor_add_media_from_url_rollout') && mediaOptions.allowCommentsOnMedia && jsx(CommentBadge, {
     view: view,
     api: pluginInjectionApi,
     mediaNode: mediaNode === null || mediaNode === void 0 ? void 0 : mediaNode.firstChild,

package/dist/esm/pm-plugins/main.js

@@ -24,7 +24,6 @@ import { Decoration, DecorationSet } from '@atlaskit/editor-prosemirror/view';
 import { CellSelection } from '@atlaskit/editor-tables/cell-selection';
 import { isFileIdentifier } from '@atlaskit/media-client';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
-import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { updateMediaNodeAttrs } from '../pm-plugins/commands/helpers';
 // Ignored via go/ees005
 // eslint-disable-next-line import/no-namespace
@@ -209,9 +208,6 @@ export var MediaPluginStateImplementation = /*#__PURE__*/function () {
     });
     _defineProperty(this, "showMediaPicker", function () {
       if (_this.openMediaPickerBrowser) {
-        editorExperiment('add-media-from-url', false, {
-          exposure: true
-        });
         return _this.openMediaPickerBrowser();
       }
       _this.onPopupToggleCallback(true);