@atlaskit/editor-plugin-media 2.3.10 → 2.3.12

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-plugin-media
 
+## 2.3.12
+
+### Patch Changes
+
+- [#128664](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/128664)
+  [`abca3266336d9`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/abca3266336d9) -
+  [ED-23250] Remove form element from MediaFromUrl and consolidate experiments and feature flags in
+  prepartion for jira release
+- Updated dependencies
+
+## 2.3.11
+
+### Patch Changes
+
+- [#128574](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/128574)
+  [`cba34b8397ba2`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cba34b8397ba2) -
+  [ux] [ED-26973] Update floating toolbar for inline and thumbnail file
+- Updated dependencies
+
 ## 2.3.10
 
 ### Patch Changes

package/dist/cjs/mediaPlugin.js

@@ -307,7 +307,7 @@ var mediaPlugin = exports.mediaPlugin = function mediaPlugin(_ref3) {
     pluginsOptions: {
       quickInsert: function quickInsert(_ref14) {
         var formatMessage = _ref14.formatMessage;
-        return (0, _experiments.editorExperiment)('add-media-from-url', true) ? [] : [{
+        return (0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout') ? [] : [{
           id: 'media',
           title: formatMessage(_messages.toolbarInsertBlockMessages.mediaFiles),
           description: formatMessage(_messages.toolbarInsertBlockMessages.mediaFilesDescription),

package/dist/cjs/nodeviews/mediaGroup.js

@@ -24,6 +24,7 @@ var _close = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/close")
 var _mediaCommon = require("@atlaskit/media-common");
 var _mediaFilmstrip = require("@atlaskit/media-filmstrip");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _pluginKey = require("../pm-plugins/plugin-key");
 var _useMediaProvider = require("../ui/hooks/useMediaProvider");
 var _mediaGroupNext = require("./mediaGroupNext");
@@ -181,7 +182,7 @@ var MediaGroup = /*#__PURE__*/function (_React$Component) {
         items: items,
         mediaClientConfig: viewMediaClientConfig,
         featureFlags: mediaOptions.featureFlags,
-        shouldOpenMediaViewer: editorViewMode
+        shouldOpenMediaViewer: editorViewMode && (0, _experiments.editorExperiment)('platform_editor_controls', 'control')
       });
     });
     _this.mediaNodes = [];

package/dist/cjs/nodeviews/mediaGroupNext.js

@@ -18,6 +18,7 @@ var _utils = require("@atlaskit/editor-common/utils");
 var _close = _interopRequireDefault(require("@atlaskit/icon/glyph/editor/close"));
 var _mediaCommon = require("@atlaskit/media-common");
 var _mediaFilmstrip = require("@atlaskit/media-filmstrip");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _pluginKey = require("../pm-plugins/plugin-key");
 var _mediaNodeUpdater = require("./mediaNodeUpdater");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
@@ -289,7 +290,7 @@ var MediaGroupNext = exports.MediaGroupNext = (0, _reactIntlNext.injectIntl)( /*
     items: items,
     mediaClientConfig: viewMediaClientConfig,
     featureFlags: featureFlags,
-    shouldOpenMediaViewer: editorViewMode
+    shouldOpenMediaViewer: editorViewMode && (0, _experiments.editorExperiment)('platform_editor_controls', 'control')
   });
 }));
 MediaGroupNext.displayName = 'MediaGroup';

package/dist/cjs/nodeviews/mediaInline.js

@@ -24,6 +24,7 @@ var _selectionBasedNodeView = require("@atlaskit/editor-common/selection-based-n
 var _mediaCard = require("@atlaskit/media-card");
 var _mediaClientReact = require("@atlaskit/media-client-react");
 var _mediaUi = require("@atlaskit/media-ui");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _isType = require("../pm-plugins/utils/is-type");
 var _MediaViewerContainer = require("../ui/MediaViewer/MediaViewerContainer");
 var _mediaNodeUpdater = require("./mediaNodeUpdater");
@@ -211,7 +212,8 @@ var MediaInline = exports.MediaInline = function MediaInline(props) {
     mediaNode: props.node,
     mediaPluginState: props.mediaPluginState,
     isEditorViewMode: props.editorViewMode,
-    isSelected: props.isSelected
+    isSelected: props.isSelected,
+    isInline: (0, _platformFeatureFlags.fg)('platform_editor_render_media_viewer_as_inline')
   }, (0, _react2.jsx)(_mediaCard.MediaInlineCard, {
     isSelected: props.isSelected,
     identifier: identifier,

package/dist/cjs/nodeviews/mediaSingle.js

@@ -30,7 +30,6 @@ var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _mediaClient = require("@atlaskit/media-client");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _captions = require("../pm-plugins/commands/captions");
 var _main = require("../pm-plugins/main");
 var _mediaCommon = require("../pm-plugins/utils/media-common");
@@ -315,7 +314,6 @@ var MediaSingleNode = exports.default = /*#__PURE__*/function (_Component) {
     key: "componentDidMount",
     value: function () {
       var _componentDidMount = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee3() {
-        var _this$props$node$firs2;
         var contextIdentifierProvider;
         return _regenerator.default.wrap(function _callee3$(_context3) {
           while (1) switch (_context3.prev = _context3.next) {
@@ -334,20 +332,7 @@ var MediaSingleNode = exports.default = /*#__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 ((0, _experiments.editorExperiment)('add-media-from-url', true)) {
-                  (0, _experiments.editorExperiment)('add-media-from-url', true, {
-                    exposure: true
-                  });
-                } else {
-                  (0, _experiments.editorExperiment)('add-media-from-url', false, {
-                    exposure: true
-                  });
-                }
-              }
-            case 11:
+            case 10:
             case "end":
               return _context3.stop();
           }
@@ -474,7 +459,6 @@ var MediaSingleNode = exports.default = /*#__PURE__*/function (_Component) {
       var shouldShowPlaceholder = mediaOptions.allowCaptions && node.childCount !== 2 && isSelected && state.selection instanceof _state.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 && (0, _utils2.findParentNodeOfTypeClosestToPos)(state.doc.resolve(pos), [state.schema.nodes.table]);
       var currentMediaElement = function currentMediaElement() {
@@ -493,29 +477,24 @@ var MediaSingleNode = exports.default = /*#__PURE__*/function (_Component) {
         ,
         className: _styles.MediaSingleNodeSelector,
         onClick: this.onMediaSingleClicked
-      }, (0, _experiments.editorExperiment)('add-media-from-url', true) && (0, _react2.jsx)(_mediaSingle.MediaBadges, {
+      }, (0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout') && (0, _react2.jsx)(_mediaSingle.MediaBadges, {
         mediaElement: currentMediaElement(),
         mediaHeight: height,
         mediaWidth: width,
         extendedResizeOffset: (0, _platformFeatureFlags.fg)('platform_editor_media_extended_resize_experience') && !isInsideTable
       }, function (_ref5) {
-        var badgeSize = _ref5.badgeSize,
-          visible = _ref5.visible;
-        return (0, _react2.jsx)(_react.default.Fragment, null, (0, _platformFeatureFlags.fg)('platform_editor_hide_external_media_badge') ? visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
-          badgeSize: badgeSize,
+        var visible = _ref5.visible;
+        return (0, _react2.jsx)(_react.default.Fragment, null, visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
           type: attrs.type,
           url: attrs.type === 'external' ? attrs.url : undefined
-        }) : shouldShowExternalMediaBadge && visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
-          badgeSize: badgeSize
         }), mediaOptions.allowCommentsOnMedia && (0, _react2.jsx)(_CommentBadge.CommentBadgeNextWrapper, {
           view: view,
           api: pluginInjectionApi,
           mediaNode: node === null || node === void 0 ? void 0 : node.firstChild,
           getPos: getPos,
-          isDrafting: isCurrentNodeDrafting,
-          badgeSize: badgeSize
+          isDrafting: isCurrentNodeDrafting
         }));
-      }), !(0, _experiments.editorExperiment)('add-media-from-url', true) && mediaOptions.allowCommentsOnMedia && (0, _react2.jsx)(_CommentBadge.CommentBadge, {
+      }), !(0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout') && mediaOptions.allowCommentsOnMedia && (0, _react2.jsx)(_CommentBadge.CommentBadge, {
         view: view,
         api: pluginInjectionApi,
         mediaNode: node === null || node === void 0 ? void 0 : node.firstChild,

package/dist/cjs/nodeviews/mediaSingleNext.js

@@ -21,7 +21,6 @@ var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _mediaClient = require("@atlaskit/media-client");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _captions = require("../pm-plugins/commands/captions");
 var _mediaCommon = require("../pm-plugins/utils/media-common");
 var _CaptionPlaceholder = require("../ui/CaptionPlaceholder");
@@ -288,7 +287,7 @@ var useUpdateSizeCallback = function useUpdateSizeCallback(_ref5) {
  */
 var FALLBACK_MOST_COMMON_WIDTH = 760;
 var MediaSingleNodeNext = exports.MediaSingleNodeNext = function MediaSingleNodeNext(mediaSingleNodeNextProps) {
-  var _pluginInjectionApi$m, _mediaNode$firstChild2;
+  var _pluginInjectionApi$m, _mediaNode$firstChild;
   var selected = mediaSingleNodeNextProps.selected,
     getPos = mediaSingleNodeNextProps.getPos,
     nextMediaNode = mediaSingleNodeNextProps.node,
@@ -364,22 +363,6 @@ var MediaSingleNodeNext = exports.MediaSingleNodeNext = function MediaSingleNode
       }
     });
   }, [contextIdentifierProviderPromise]);
-  _react.default.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 ((0, _experiments.editorExperiment)('add-media-from-url', true)) {
-        (0, _experiments.editorExperiment)('add-media-from-url', true, {
-          exposure: true
-        });
-      } else {
-        (0, _experiments.editorExperiment)('add-media-from-url', false, {
-          exposure: true
-        });
-      }
-    }
-  }, [mediaNode]);
   var _ref6 = mediaNode.attrs,
     layout = _ref6.layout,
     widthType = _ref6.widthType,
@@ -454,8 +437,7 @@ var MediaSingleNodeNext = exports.MediaSingleNodeNext = function MediaSingleNode
   }, [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.default.createRef();
   var captionPlaceHolderRef = /*#__PURE__*/_react.default.createRef();
   var onMediaSingleClicked = _react.default.useCallback(function (event) {
@@ -492,29 +474,24 @@ var MediaSingleNodeNext = exports.MediaSingleNodeNext = function MediaSingleNode
     ,
     className: _styles.MediaSingleNodeSelector,
     onClick: onMediaSingleClicked
-  }, (0, _experiments.editorExperiment)('add-media-from-url', true) && (0, _react2.jsx)(_mediaSingle.MediaBadges, {
+  }, (0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout') && (0, _react2.jsx)(_mediaSingle.MediaBadges, {
     mediaElement: currentMediaElement(),
     mediaHeight: height,
     mediaWidth: width,
     extendedResizeOffset: (0, _platformFeatureFlags.fg)('platform_editor_media_extended_resize_experience') && !isInsideTable
   }, function (_ref7) {
-    var badgeSize = _ref7.badgeSize,
-      visible = _ref7.visible;
-    return (0, _react2.jsx)(_react.default.Fragment, null, (0, _platformFeatureFlags.fg)('platform_editor_hide_external_media_badge') ? visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
-      badgeSize: badgeSize,
+    var visible = _ref7.visible;
+    return (0, _react2.jsx)(_react.default.Fragment, null, visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
       type: childMediaNodeAttrs.type,
       url: childMediaNodeAttrs.type === 'external' ? childMediaNodeAttrs.url : undefined
-    }) : shouldShowExternalMediaBadge && visible && (0, _react2.jsx)(_mediaSingle.ExternalImageBadge, {
-      badgeSize: badgeSize
     }), mediaOptions.allowCommentsOnMedia && (0, _react2.jsx)(_CommentBadge.CommentBadgeNextWrapper, {
       view: view,
       api: pluginInjectionApi,
       mediaNode: mediaNode === null || mediaNode === void 0 ? void 0 : mediaNode.firstChild,
       getPos: getPos,
-      isDrafting: isCurrentNodeDrafting,
-      badgeSize: badgeSize
+      isDrafting: isCurrentNodeDrafting
     }));
-  }), !(0, _experiments.editorExperiment)('add-media-from-url', true) && mediaOptions.allowCommentsOnMedia && (0, _react2.jsx)(_CommentBadge.CommentBadge, {
+  }), !(0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout') && mediaOptions.allowCommentsOnMedia && (0, _react2.jsx)(_CommentBadge.CommentBadge, {
     view: view,
     api: pluginInjectionApi,
     mediaNode: mediaNode === null || mediaNode === void 0 ? void 0 : mediaNode.firstChild,

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

@@ -27,7 +27,6 @@ var _view2 = require("@atlaskit/editor-prosemirror/view");
 var _cellSelection = require("@atlaskit/editor-tables/cell-selection");
 var _mediaClient = require("@atlaskit/media-client");
 var _mediaCommon = require("@atlaskit/media-common");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _helpers = _interopRequireWildcard(require("../pm-plugins/commands/helpers"));
 var helpers = _helpers;
 var _mediaCommon2 = require("../pm-plugins/utils/media-common");
@@ -218,9 +217,6 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
     });
     (0, _defineProperty2.default)(this, "showMediaPicker", function () {
       if (_this.openMediaPickerBrowser) {
-        (0, _experiments.editorExperiment)('add-media-from-url', false, {
-          exposure: true
-        });
         return _this.openMediaPickerBrowser();
       }
       _this.onPopupToggleCallback(true);

package/dist/cjs/pm-plugins/utils/media-single.js

@@ -16,7 +16,6 @@ var _model = require("@atlaskit/editor-prosemirror/model");
 var _state = require("@atlaskit/editor-prosemirror/state");
 var _utils2 = require("@atlaskit/editor-prosemirror/utils");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _mediaCommon = require("../utils/media-common");
 var _analytics2 = require("./analytics");
 var _isType = require("./is-type");
@@ -107,7 +106,7 @@ var insertMediaAsMediaSingle = exports.insertMediaAsMediaSingle = function inser
     return false;
   }
   var resizeExperience = (0, _platformFeatureFlags.fg)('platform_editor_media_extended_resize_experience');
-  var insertMediaPopup = (0, _experiments.editorExperiment)('add-media-from-url', true);
+  var insertMediaPopup = (0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout');
   var mediaSingleAttrs = resizeExperience && insertMediaPopup ? {
     widthType: 'pixel',
     width: (0, _mediaSingle.getMediaSingleInitialWidth)((_node$attrs$width = node.attrs.width) !== null && _node$attrs$width !== void 0 ? _node$attrs$width : _mediaSingle.DEFAULT_IMAGE_WIDTH),

package/dist/cjs/ui/CommentBadge/index.js

@@ -85,7 +85,7 @@ var CommentBadge = exports.CommentBadge = (0, _reactIntlNext.injectIntl)(Comment
 /**
  * Remove CommentBadgeWrapper component above
  * and rename CommentBadgeNextWrapper to CommentBadgeWrapper
- * when clean up platform_editor_add_media_from_url feature flag
+ * when clean up platform_editor_add_media_from_url_rollout feature flag
  */
 
 var CommentBadgeNextWrapper = exports.CommentBadgeNextWrapper = function CommentBadgeNextWrapper(_ref2) {
@@ -93,8 +93,7 @@ var CommentBadgeNextWrapper = exports.CommentBadgeNextWrapper = function Comment
     mediaNode = _ref2.mediaNode,
     view = _ref2.view,
     getPos = _ref2.getPos,
-    isDrafting = _ref2.isDrafting,
-    badgeSize = _ref2.badgeSize;
+    isDrafting = _ref2.isDrafting;
   var _useState3 = (0, _react.useState)(false),
     _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
     entered = _useState4[0],
@@ -140,7 +139,6 @@ var CommentBadgeNextWrapper = exports.CommentBadgeNextWrapper = function Comment
     },
     onMouseLeave: function onMouseLeave() {
       return setEntered(false);
-    },
-    badgeSize: badgeSize
+    }
   });
 };

package/dist/cjs/ui/MediaViewer/MediaViewerContainer.js

@@ -9,6 +9,7 @@ exports.MediaViewerContainer = void 0;
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
 var _react2 = require("@emotion/react");
+var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _isType = require("../../pm-plugins/utils/is-type");
 var _utils = require("../../ui/toolbar/utils");
 var _PortalWrapper = require("./PortalWrapper");
@@ -52,7 +53,7 @@ var MediaViewerContainer = exports.MediaViewerContainer = function MediaViewerCo
     setShowMediaViewer(false);
   };
   var isVideoMedia = (0, _isType.isVideo)((_mediaNode$firstChild = mediaNode.firstChild) === null || _mediaNode$firstChild === void 0 ? void 0 : _mediaNode$firstChild.attrs.__fileMimeType);
-  var shouldShowViewer = isEditorViewMode && showViewer && selectedNodeAttrs && mediaClientConfig && !isVideoMedia;
+  var shouldShowViewer = isEditorViewMode && showViewer && selectedNodeAttrs && mediaClientConfig && !isVideoMedia && (0, _experiments.editorExperiment)('platform_editor_controls', 'control');
   return (0, _react2.jsx)(_react.Fragment, null, isEditorViewMode ? (0, _react2.jsx)(_react.Fragment, null, isInline ?
   // eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions
   (0, _react2.jsx)("span", {

package/dist/cjs/ui/MediaViewer/PortalWrapper.js

@@ -8,7 +8,7 @@ exports.RenderMediaViewer = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _mediaViewer = require("@atlaskit/media-viewer");
-var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _utils = require("../../ui/toolbar/utils");
 var getIdentifier = function getIdentifier(attrs) {
   if ((0, _utils.isExternalMedia)(attrs)) {
@@ -33,7 +33,7 @@ var RenderMediaViewer = exports.RenderMediaViewer = function RenderMediaViewer(_
     selectedNodeAttrs = _ref.selectedNodeAttrs,
     _ref$items = _ref.items,
     items = _ref$items === void 0 ? [] : _ref$items;
-  if ((0, _experiments.editorExperiment)('add-media-from-url', true)) {
+  if ((0, _platformFeatureFlags.fg)('platform_editor_add_media_from_url_rollout')) {
     var _identifier = getIdentifier(selectedNodeAttrs);
     var collectionName = (0, _utils.isExternalMedia)(selectedNodeAttrs) ? '' : selectedNodeAttrs.collection;
     return /*#__PURE__*/_reactDom.default.createPortal( /*#__PURE__*/_react.default.createElement(_mediaViewer.MediaViewer, {

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

@@ -6,9 +6,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.handleShowMediaViewer = exports.floatingToolbar = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _react = _interopRequireDefault(require("react"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _card = require("@atlaskit/editor-common/card");
@@ -91,41 +91,10 @@ var handleShowMediaViewer = exports.handleShowMediaViewer = function handleShowM
 };
 var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) {
   var _mediaPluginState$med, _pluginInjectionApi$c;
-  if (isViewOnly) {
-    return [];
-  }
   var enforceMediaDataSecurityPolicy = mediaPluginState === null || mediaPluginState === void 0 || (_mediaPluginState$med = mediaPluginState.mediaClientConfig) === null || _mediaPluginState$med === void 0 ? void 0 : _mediaPluginState$med.enforceDataSecurityPolicy;
   var disableDownloadButton = typeof enforceMediaDataSecurityPolicy === 'boolean' ? enforceMediaDataSecurityPolicy : false;
-  var mediaGroup = state.schema.nodes.mediaGroup;
-  var items = [{
-    id: 'editor.media.view.switcher.inline',
-    type: 'button',
-    icon: _imageInline.default,
-    iconFallback: _card.IconInline,
-    selected: false,
-    focusEditoronEnter: true,
-    disabled: false,
-    onClick: (0, _commands3.changeMediaCardToInline)(editorAnalyticsAPI, forceFocusSelector),
-    title: intl.formatMessage(_messages.cardMessages.inlineTitle),
-    testId: 'inline-appearance',
-    className: 'inline-appearance' // a11y. uses to force focus on item
-  }, {
-    id: 'editor.media.view.switcher.thumbnail',
-    type: 'button',
-    icon: _smartLinkCard.default,
-    iconFallback: _card.IconCard,
-    selected: true,
-    disabled: false,
-    focusEditoronEnter: true,
-    onClick: function onClick() {
-      return true;
-    },
-    title: intl.formatMessage(_messages.cardMessages.blockTitle),
-    testId: 'thumbnail-appearance',
-    className: 'thumbnail-appearance' // a11y. uses to force focus on item
-  }, {
-    type: 'separator'
-  }, {
+  var isEditorControlsEnabled = (0, _experiments.editorExperiment)('platform_editor_controls', 'variant1');
+  var preview = {
     id: 'editor.media.viewer',
     testId: 'file-preview-toolbar-button',
     type: 'button',
@@ -141,9 +110,8 @@ var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar
     },
     disabled: (pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$c = pluginInjectionApi.connectivity) === null || _pluginInjectionApi$c === void 0 || (_pluginInjectionApi$c = _pluginInjectionApi$c.sharedState) === null || _pluginInjectionApi$c === void 0 || (_pluginInjectionApi$c = _pluginInjectionApi$c.currentState()) === null || _pluginInjectionApi$c === void 0 ? void 0 : _pluginInjectionApi$c.mode) === 'offline',
     supportsViewMode: true
-  }, {
-    type: 'separator'
-  }, {
+  };
+  var download = _objectSpread({
     id: 'editor.media.card.download',
     type: 'button',
     icon: _download.default,
@@ -153,33 +121,118 @@ var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar
     },
     title: intl.formatMessage(_mediaUi.messages.download),
     disabled: disableDownloadButton
-  }, {
-    type: 'separator'
-  }, {
-    type: 'copy-button',
-    supportsViewMode: true,
-    items: [{
-      state: state,
-      formatMessage: intl.formatMessage,
-      nodeType: mediaGroup
-    }]
-  }, {
-    type: 'separator'
-  }, {
-    id: 'editor.media.delete',
-    type: 'button',
-    appearance: 'danger',
-    focusEditoronEnter: true,
-    icon: _delete.default,
-    iconFallback: _remove.default,
-    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(_messages.default.remove),
-    onClick: handleRemoveMediaGroup,
-    testId: 'media-toolbar-remove-button'
-  }];
+  }, isEditorControlsEnabled && {
+    supportsViewMode: true
+  });
+  if (isViewOnly && !isEditorControlsEnabled) {
+    return [];
+  }
+  var mediaGroup = state.schema.nodes.mediaGroup;
+  var items = [];
+  if (!isEditorControlsEnabled) {
+    items.push({
+      id: 'editor.media.view.switcher.inline',
+      type: 'button',
+      icon: _imageInline.default,
+      iconFallback: _card.IconInline,
+      selected: false,
+      focusEditoronEnter: true,
+      disabled: false,
+      onClick: (0, _commands3.changeMediaCardToInline)(editorAnalyticsAPI, forceFocusSelector),
+      title: intl.formatMessage(_messages.cardMessages.inlineTitle),
+      testId: 'inline-appearance',
+      className: 'inline-appearance' // a11y. uses to force focus on item
+    }, {
+      id: 'editor.media.view.switcher.thumbnail',
+      type: 'button',
+      icon: _smartLinkCard.default,
+      iconFallback: _card.IconCard,
+      selected: true,
+      disabled: false,
+      focusEditoronEnter: true,
+      onClick: function onClick() {
+        return true;
+      },
+      title: intl.formatMessage(_messages.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: state,
+        formatMessage: intl.formatMessage,
+        nodeType: mediaGroup
+      }]
+    }, {
+      type: 'separator'
+    }, {
+      id: 'editor.media.delete',
+      type: 'button',
+      appearance: 'danger',
+      focusEditoronEnter: true,
+      icon: _delete.default,
+      iconFallback: _remove.default,
+      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(_messages.default.remove),
+      onClick: handleRemoveMediaGroup,
+      testId: 'media-toolbar-remove-button'
+    });
+  } else {
+    var options = [{
+      id: 'editor.media.view.switcher.inline',
+      title: intl.formatMessage(_messages.cardMessages.inlineTitle),
+      onClick: (0, _commands3.changeMediaCardToInline)(editorAnalyticsAPI, forceFocusSelector),
+      icon: /*#__PURE__*/_react.default.createElement(_imageInline.default, {
+        label: "",
+        spacing: "spacious"
+      })
+    }, {
+      id: 'editor.media.view.switcher.thumbnail',
+      title: intl.formatMessage(_messages.cardMessages.blockTitle),
+      selected: true,
+      onClick: function onClick() {
+        return true;
+      },
+      icon: /*#__PURE__*/_react.default.createElement(_smartLinkCard.default, {
+        label: "",
+        spacing: "spacious"
+      })
+    }];
+    var switcherDropdown = {
+      title: intl.formatMessage(_mediaUi.messages.fileDisplayOptions),
+      id: 'media-group-inline-switcher-toolbar-item',
+      testId: 'media-group-inline-switcher-dropdown',
+      type: 'dropdown',
+      options: options,
+      icon: function icon() {
+        return /*#__PURE__*/_react.default.createElement(_smartLinkCard.default, {
+          label: "",
+          spacing: "spacious"
+        });
+      }
+    };
+    items.push(switcherDropdown, {
+      type: 'separator',
+      fullHeight: true
+    }, download, {
+      type: 'separator',
+      fullHeight: true,
+      supportsViewMode: true
+    }, preview, {
+      type: 'separator',
+      fullHeight: true
+    });
+  }
   return items;
 };
 var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToolbar(state, intl, options, pluginState, mediaLinkingState, pluginInjectionApi) {