@atlaskit/editor-plugin-media 8.9.0 → 8.10.0

package/dist/esm/mediaPlugin.js

@@ -6,7 +6,6 @@ import { areToolbarFlagsEnabled } from '@atlaskit/editor-common/toolbar-flag-che
 import { NodeSelection, PluginKey } from '@atlaskit/editor-prosemirror/state';
 import { getMediaFeatureFlag } from '@atlaskit/media-common';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { lazyMediaView } from './nodeviews/lazy-media';
 import { lazyMediaGroupView } from './nodeviews/lazy-media-group';
 import { lazyMediaInlineView } from './nodeviews/lazy-media-inline';
@@ -17,7 +16,7 @@ import { mediaInlineSpecWithFixedToDOM } from './nodeviews/toDOM-fixes/mediaInli
 import { mediaSingleSpecWithFixedToDOM } from './nodeviews/toDOM-fixes/mediaSingle';
 import { createPlugin as createMediaAltTextPlugin } from './pm-plugins/alt-text';
 import keymapMediaAltTextPlugin from './pm-plugins/alt-text/keymap';
-import { hideMediaViewer, showMediaViewer, trackMediaPaste, hideImageEditor, showImageEditor } from './pm-plugins/commands';
+import { hideMediaViewer, showMediaViewer, trackMediaPaste } from './pm-plugins/commands';
 import keymapPlugin from './pm-plugins/keymap';
 import keymapMediaSinglePlugin from './pm-plugins/keymap-media';
 import linkingPlugin from './pm-plugins/linking';
@@ -27,7 +26,6 @@ import { createPlugin as createMediaPixelResizingPlugin } from './pm-plugins/pix
 import { stateKey } from './pm-plugins/plugin-key';
 import { createMediaIdentifierArray, extractMediaNodes } from './pm-plugins/utils/media-common';
 import { insertMediaAsMediaSingle as _insertMediaAsMediaSingle } from './pm-plugins/utils/media-single';
-import { RenderImageEditor } from './ui/ImageEditor/ModalWrapper';
 import { MediaPickerComponents } from './ui/MediaPicker';
 import { RenderMediaViewer } from './ui/MediaViewer/PortalWrapper';
 import { floatingToolbar as _floatingToolbar } from './ui/toolbar';
@@ -97,36 +95,10 @@ var MediaViewerFunctionalComponent = function MediaViewerFunctionalComponent(_re
     items: mediaItems
   });
 };
-var imageEditorStateSelector = function imageEditorStateSelector(states) {
-  var _states$mediaState6, _states$mediaState7, _states$mediaState8;
-  return {
-    isImageEditorVisible: (_states$mediaState6 = states.mediaState) === null || _states$mediaState6 === void 0 ? void 0 : _states$mediaState6.isImageEditorVisible,
-    imageEditorSelectedMedia: (_states$mediaState7 = states.mediaState) === null || _states$mediaState7 === void 0 ? void 0 : _states$mediaState7.imageEditorSelectedMedia,
-    mediaClientConfig: (_states$mediaState8 = states.mediaState) === null || _states$mediaState8 === void 0 ? void 0 : _states$mediaState8.mediaClientConfig
-  };
-};
-var ImageEditorFunctionalComponent = function ImageEditorFunctionalComponent(_ref3) {
-  var api = _ref3.api;
-  var _useSharedPluginState3 = useSharedPluginStateWithSelector(api, ['media'], imageEditorStateSelector),
-    isImageEditorVisible = _useSharedPluginState3.isImageEditorVisible,
-    imageEditorSelectedMedia = _useSharedPluginState3.imageEditorSelectedMedia,
-    mediaClientConfig = _useSharedPluginState3.mediaClientConfig;
-  if (!isImageEditorVisible || !imageEditorSelectedMedia || !mediaClientConfig) {
-    return null;
-  }
-  var handleOnClose = function handleOnClose() {
-    api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.media.commands.hideImageEditor);
-  };
-  return /*#__PURE__*/React.createElement(RenderImageEditor, {
-    mediaClientConfig: mediaClientConfig,
-    onClose: handleOnClose,
-    selectedNodeAttrs: imageEditorSelectedMedia
-  });
-};
-export var mediaPlugin = function mediaPlugin(_ref4) {
-  var _ref4$config = _ref4.config,
-    options = _ref4$config === void 0 ? {} : _ref4$config,
-    api = _ref4.api;
+export var mediaPlugin = function mediaPlugin(_ref3) {
+  var _ref3$config = _ref3.config,
+    options = _ref3$config === void 0 ? {} : _ref3$config,
+    api = _ref3.api;
   var previousMediaProvider;
   var mediaErrorLocalIds = new Set();
   return {
@@ -167,8 +139,8 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
           return false;
         }
         previousMediaProvider = provider;
-        return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(function (_ref5) {
-          var tr = _ref5.tr;
+        return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(function (_ref4) {
+          var tr = _ref4.tr;
           return tr.setMeta(stateKey, {
             mediaProvider: provider
           });
@@ -178,21 +150,19 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
     commands: {
       showMediaViewer: showMediaViewer,
       hideMediaViewer: hideMediaViewer,
-      trackMediaPaste: trackMediaPaste,
-      showImageEditor: showImageEditor,
-      hideImageEditor: hideImageEditor
+      trackMediaPaste: trackMediaPaste
     },
     nodes: function nodes() {
-      var _ref6 = options || {},
-        _ref6$allowMediaGroup = _ref6.allowMediaGroup,
-        allowMediaGroup = _ref6$allowMediaGroup === void 0 ? true : _ref6$allowMediaGroup,
-        _ref6$allowMediaSingl = _ref6.allowMediaSingle,
-        allowMediaSingle = _ref6$allowMediaSingl === void 0 ? false : _ref6$allowMediaSingl,
-        _ref6$allowPixelResiz = _ref6.allowPixelResizing,
-        allowPixelResizing = _ref6$allowPixelResiz === void 0 ? false : _ref6$allowPixelResiz,
-        allowCaptions = _ref6.allowCaptions,
-        allowMediaInlineImages = _ref6.allowMediaInlineImages,
-        mediaFeatureFlags = _ref6.featureFlags;
+      var _ref5 = options || {},
+        _ref5$allowMediaGroup = _ref5.allowMediaGroup,
+        allowMediaGroup = _ref5$allowMediaGroup === void 0 ? true : _ref5$allowMediaGroup,
+        _ref5$allowMediaSingl = _ref5.allowMediaSingle,
+        allowMediaSingle = _ref5$allowMediaSingl === void 0 ? false : _ref5$allowMediaSingl,
+        _ref5$allowPixelResiz = _ref5.allowPixelResizing,
+        allowPixelResizing = _ref5$allowPixelResiz === void 0 ? false : _ref5$allowPixelResiz,
+        allowCaptions = _ref5.allowCaptions,
+        allowMediaInlineImages = _ref5.allowMediaInlineImages,
+        mediaFeatureFlags = _ref5.featureFlags;
       var allowMediaInline = fg('platform_editor_remove_media_inline_feature_flag') ? allowMediaInlineImages : getMediaFeatureFlag('mediaInline', mediaFeatureFlags);
       var mediaSingleOption = {
         withCaption: allowCaptions,
@@ -226,16 +196,16 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
     pmPlugins: function pmPlugins() {
       var pmPlugins = [{
         name: 'media',
-        plugin: function plugin(_ref7) {
-          var schema = _ref7.schema,
-            dispatch = _ref7.dispatch,
-            getIntl = _ref7.getIntl,
-            eventDispatcher = _ref7.eventDispatcher,
-            providerFactory = _ref7.providerFactory,
-            errorReporter = _ref7.errorReporter,
-            portalProviderAPI = _ref7.portalProviderAPI,
-            dispatchAnalyticsEvent = _ref7.dispatchAnalyticsEvent,
-            nodeViewPortalProviderAPI = _ref7.nodeViewPortalProviderAPI;
+        plugin: function plugin(_ref6) {
+          var schema = _ref6.schema,
+            dispatch = _ref6.dispatch,
+            getIntl = _ref6.getIntl,
+            eventDispatcher = _ref6.eventDispatcher,
+            providerFactory = _ref6.providerFactory,
+            errorReporter = _ref6.errorReporter,
+            portalProviderAPI = _ref6.portalProviderAPI,
+            dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent,
+            nodeViewPortalProviderAPI = _ref6.nodeViewPortalProviderAPI;
           return createPlugin(schema, {
             providerFactory: providerFactory,
             nodeViews: {
@@ -254,17 +224,17 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
         }
       }, {
         name: 'mediaKeymap',
-        plugin: function plugin(_ref8) {
+        plugin: function plugin(_ref7) {
           var _api$analytics3, _api$selection;
-          var getIntl = _ref8.getIntl;
+          var getIntl = _ref7.getIntl;
           return keymapPlugin(options, api === null || api === void 0 || (_api$analytics3 = api.analytics) === null || _api$analytics3 === void 0 ? void 0 : _api$analytics3.actions, api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.actions, api === null || api === void 0 ? void 0 : api.width, getIntl);
         }
       }];
       if (options && options.allowMediaSingle) {
         pmPlugins.push({
           name: 'mediaSingleKeymap',
-          plugin: function plugin(_ref9) {
-            var schema = _ref9.schema;
+          plugin: function plugin(_ref8) {
+            var schema = _ref8.schema;
             return keymapMediaSinglePlugin(schema);
           }
         });
@@ -276,9 +246,9 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
         });
         pmPlugins.push({
           name: 'mediaAltTextKeymap',
-          plugin: function plugin(_ref0) {
+          plugin: function plugin(_ref9) {
             var _api$analytics4;
-            var schema = _ref0.schema;
+            var schema = _ref9.schema;
             return keymapMediaAltTextPlugin(schema, api === null || api === void 0 || (_api$analytics4 = api.analytics) === null || _api$analytics4 === void 0 ? void 0 : _api$analytics4.actions);
           }
         });
@@ -286,15 +256,15 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
       if (options && options.allowLinking) {
         pmPlugins.push({
           name: 'mediaLinking',
-          plugin: function plugin(_ref1) {
-            var dispatch = _ref1.dispatch;
+          plugin: function plugin(_ref0) {
+            var dispatch = _ref0.dispatch;
             return linkingPlugin(dispatch);
           }
         });
         pmPlugins.push({
           name: 'mediaLinkingKeymap',
-          plugin: function plugin(_ref10) {
-            var schema = _ref10.schema;
+          plugin: function plugin(_ref1) {
+            var schema = _ref1.schema;
             return keymapLinkingPlugin(schema);
           }
         });
@@ -336,16 +306,13 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
       });
       return pmPlugins;
     },
-    contentComponent: function contentComponent(_ref11) {
-      var editorView = _ref11.editorView,
-        appearance = _ref11.appearance;
+    contentComponent: function contentComponent(_ref10) {
+      var editorView = _ref10.editorView,
+        appearance = _ref10.appearance;
       if (!editorView) {
         return null;
       }
-      return /*#__PURE__*/React.createElement(React.Fragment, null, (options === null || options === void 0 ? void 0 : options.allowImageEditing) && expValEquals('platform_editor_add_image_editing', 'isEnabled', true) && /*#__PURE__*/React.createElement(ImageEditorFunctionalComponent, {
-        api: api,
-        editorView: editorView
-      }), /*#__PURE__*/React.createElement(MediaViewerFunctionalComponent, {
+      return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(MediaViewerFunctionalComponent, {
         api: api,
         editorView: editorView
       }), /*#__PURE__*/React.createElement(MediaPickerFunctionalComponent, {
@@ -354,8 +321,8 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
         api: api
       }));
     },
-    secondaryToolbarComponent: function secondaryToolbarComponent(_ref12) {
-      var disabled = _ref12.disabled;
+    secondaryToolbarComponent: function secondaryToolbarComponent(_ref11) {
+      var disabled = _ref11.disabled;
       return /*#__PURE__*/React.createElement(ToolbarMedia, {
         isDisabled: disabled,
         isReducedSpacing: true,
@@ -377,7 +344,7 @@ export var mediaPlugin = function mediaPlugin(_ref4) {
           allowLinking: options && options.allowLinking,
           allowAdvancedToolBarOptions: options && options.allowAdvancedToolBarOptions,
           allowAltTextOnImages: options && options.allowAltTextOnImages,
-          allowImageEditing: options && options.allowImageEditing,
+          allowImageEditing: !!(api !== null && api !== void 0 && api.mediaEditing) && options && options.allowImageEditing,
           allowImagePreview: options && options.allowImagePreview,
           altTextValidator: options && options.altTextValidator,
           fullWidthEnabled: options && options.fullWidthEnabled,

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

@@ -31,26 +31,4 @@ export var trackMediaPaste = function trackMediaPaste(attrs) {
     });
     return tr;
   };
-};
-export var showImageEditor = function showImageEditor(media) {
-  return function (_ref4) {
-    var tr = _ref4.tr;
-    tr.setMeta(stateKey, {
-      type: ACTIONS.SHOW_IMAGE_EDITOR,
-      imageEditorSelectedMedia: media,
-      isImageEditorVisible: true
-    });
-    tr.setMeta('addToHistory', false);
-    return tr;
-  };
-};
-export var hideImageEditor = function hideImageEditor(_ref5) {
-  var tr = _ref5.tr;
-  tr.setMeta(stateKey, {
-    type: ACTIONS.HIDE_IMAGE_EDITOR,
-    imageEditorSelectedMedia: null,
-    isImageEditorVisible: false
-  });
-  tr.setMeta('addToHistory', false);
-  return tr;
 };

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

@@ -82,7 +82,6 @@ export var MediaPluginStateImplementation = /*#__PURE__*/function () {
     _defineProperty(this, "allowInlineImages", false);
     _defineProperty(this, "uploadInProgressSubscriptions", []);
     _defineProperty(this, "uploadInProgressSubscriptionsNotified", false);
-    _defineProperty(this, "isImageEditorVisible", false);
     // this is only a temporary variable, which gets cleared after the last inserted node has been selected
     _defineProperty(this, "lastAddedMediaSingleFileIds", []);
     _defineProperty(this, "destroyed", false);
@@ -630,11 +629,6 @@ export var MediaPluginStateImplementation = /*#__PURE__*/function () {
     value: function setResizingWidth(width) {
       this.resizingWidth = width;
     }
-  }, {
-    key: "setImageEditorVisibility",
-    value: function setImageEditorVisibility(isVisible) {
-      this.isImageEditorVisible = isVisible;
-    }
   }, {
     key: "updateElement",
     value: function updateElement() {
@@ -876,16 +870,6 @@ export var createPlugin = function createPlugin(_schema, options, getIntl, plugi
               nextPluginState = pluginState.clone();
             }
             break;
-          case ACTIONS.SHOW_IMAGE_EDITOR:
-            pluginState.imageEditorSelectedMedia = meta.imageEditorSelectedMedia;
-            pluginState.isImageEditorVisible = meta.isImageEditorVisible;
-            nextPluginState = nextPluginState.clone();
-            break;
-          case ACTIONS.HIDE_IMAGE_EDITOR:
-            pluginState.imageEditorSelectedMedia = undefined;
-            pluginState.isImageEditorVisible = meta.isImageEditorVisible;
-            nextPluginState = nextPluginState.clone();
-            break;
         }
 
         // NOTE: We're not calling passing new state to the Editor, because we depend on the view.state reference

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

@@ -114,13 +114,14 @@ export var handleShowMediaViewer = function handleShowMediaViewer(_ref) {
   api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.media.commands.showMediaViewer(selectedNodeAttrs));
 };
 export var handleShowImageEditor = function handleShowImageEditor(_ref2) {
+  var _api$mediaEditing;
   var api = _ref2.api,
     mediaPluginState = _ref2.mediaPluginState;
   var selectedNodeAttrs = getSelectedNearestMediaContainerNodeAttrs(mediaPluginState);
   if (!selectedNodeAttrs) {
     return false;
   }
-  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 ? void 0 : api.media.commands.showImageEditor(selectedNodeAttrs));
+  api === null || api === void 0 || api.core.actions.execute(api === null || api === void 0 || (_api$mediaEditing = api.mediaEditing) === null || _api$mediaEditing === void 0 ? void 0 : _api$mediaEditing.commands.showImageEditor(selectedNodeAttrs));
 };
 var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, editorAnalyticsAPI, forceFocusSelector, isViewOnly) {
   var _pluginInjectionApi$c;
@@ -554,7 +555,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
         });
       }
       // Image Editing Support
-      if (allowImageEditing && expValEquals('platform_editor_add_image_editing', 'isEnabled', true)) {
+      if (!!(pluginInjectionApi !== null && pluginInjectionApi !== void 0 && pluginInjectionApi.mediaEditing) && allowImageEditing && expValEquals('platform_editor_add_image_editing', 'isEnabled', true)) {
         var _mediaNode$attrs;
         var _selectedMediaSingleNode = getSelectedMediaSingle(state);
         var mediaNode = _selectedMediaSingleNode === null || _selectedMediaSingleNode === void 0 ? void 0 : _selectedMediaSingleNode.node.content.firstChild;

package/dist/types/mediaPluginType.d.ts

@@ -14,6 +14,7 @@ import type { FocusPlugin } from '@atlaskit/editor-plugin-focus';
 import type { GridPlugin } from '@atlaskit/editor-plugin-grid';
 import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
 import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
+import type { MediaEditingPlugin } from '@atlaskit/editor-plugin-media-editing';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
@@ -38,7 +39,8 @@ export type MediaPluginDependencies = [
     OptionalPlugin<FeatureFlagsPlugin>,
     OptionalPlugin<ConnectivityPlugin>,
     OptionalPlugin<InteractionPlugin>,
-    OptionalPlugin<ToolbarPlugin>
+    OptionalPlugin<ToolbarPlugin>,
+    OptionalPlugin<MediaEditingPlugin>
 ];
 export type MediaNextEditorPluginType = NextEditorPlugin<'media', {
     actions: {
@@ -59,9 +61,7 @@ export type MediaNextEditorPluginType = NextEditorPlugin<'media', {
         setProvider: (provider: Promise<MediaProvider>) => boolean;
     };
     commands: {
-        hideImageEditor: EditorCommand;
         hideMediaViewer: EditorCommand;
-        showImageEditor: (media: MediaADFAttrs) => EditorCommand;
         showMediaViewer: (media: MediaADFAttrs) => EditorCommand;
         trackMediaPaste: (attrs: MediaADFAttrs) => EditorCommand;
     };

package/dist/types/pm-plugins/commands.d.ts

@@ -3,5 +3,3 @@ import type { EditorCommand } from '@atlaskit/editor-common/types';
 export declare const showMediaViewer: (media: MediaADFAttrs) => EditorCommand;
 export declare const hideMediaViewer: EditorCommand;
 export declare const trackMediaPaste: (attrs: MediaADFAttrs) => EditorCommand;
-export declare const showImageEditor: (media: MediaADFAttrs) => EditorCommand;
-export declare const hideImageEditor: EditorCommand;

package/dist/types/pm-plugins/main.d.ts

@@ -1,5 +1,5 @@
 import type { IntlShape } from 'react-intl-next';
-import type { MediaADFAttrs, RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
+import type { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
 import type { InsertMediaVia } from '@atlaskit/editor-common/analytics';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
@@ -41,8 +41,6 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
         (isUploading: boolean): void;
     }[];
     uploadInProgressSubscriptionsNotified: boolean;
-    isImageEditorVisible?: boolean;
-    imageEditorSelectedMedia?: MediaADFAttrs;
     lastAddedMediaSingleFileIds: {
         id: string;
         selectionPosition: number;
@@ -74,7 +72,6 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
     getMediaOptions: () => MediaPluginOptions;
     setIsResizing(isResizing: boolean): void;
     setResizingWidth(width: number): void;
-    setImageEditorVisibility(isVisible: boolean): void;
     updateElement(): void;
     private isMediaSchemaNode;
     private getDomElement;

package/dist/types/pm-plugins/types.d.ts

@@ -32,11 +32,9 @@ export interface MediaPluginState {
     handleMediaNodeRemoval: (node: PMNode | undefined, getPos: ProsemirrorGetPosHandler) => void;
     handleMediaNodeUnmount: (oldNode: PMNode) => void;
     ignoreLinks: boolean;
-    imageEditorSelectedMedia?: MediaADFAttrs;
     insertFile: (mediaState: MediaState, onMediaStateChanged: MediaStateEventSubscriber, pickerType?: string, insertMediaVia?: InsertMediaVia) => void;
     isFullscreen: boolean;
     isIdentifierInEditorScope: (identifier: Identifier) => boolean;
-    isImageEditorVisible?: boolean;
     isMediaViewerVisible?: boolean;
     isResizing: boolean;
     lastAddedMediaSingleFileIds: {
@@ -58,7 +56,6 @@ export interface MediaPluginState {
     resizingWidth: number;
     selectedMediaContainerNode: () => PMNode | undefined;
     setBrowseFn: (browseFn: () => void) => void;
-    setImageEditorVisibility: (isVisible: boolean) => void;
     setIsResizing(isResizing: boolean): void;
     setMediaProvider: (mediaProvider?: Promise<MediaProvider>) => Promise<void>;
     setResizingWidth(width: number): void;

package/dist/types-ts4.5/mediaPluginType.d.ts

@@ -14,6 +14,7 @@ import type { FocusPlugin } from '@atlaskit/editor-plugin-focus';
 import type { GridPlugin } from '@atlaskit/editor-plugin-grid';
 import type { GuidelinePlugin } from '@atlaskit/editor-plugin-guideline';
 import type { InteractionPlugin } from '@atlaskit/editor-plugin-interaction';
+import type { MediaEditingPlugin } from '@atlaskit/editor-plugin-media-editing';
 import type { SelectionPlugin } from '@atlaskit/editor-plugin-selection';
 import type { ToolbarPlugin } from '@atlaskit/editor-plugin-toolbar';
 import type { WidthPlugin } from '@atlaskit/editor-plugin-width';
@@ -38,7 +39,8 @@ export type MediaPluginDependencies = [
     OptionalPlugin<FeatureFlagsPlugin>,
     OptionalPlugin<ConnectivityPlugin>,
     OptionalPlugin<InteractionPlugin>,
-    OptionalPlugin<ToolbarPlugin>
+    OptionalPlugin<ToolbarPlugin>,
+    OptionalPlugin<MediaEditingPlugin>
 ];
 export type MediaNextEditorPluginType = NextEditorPlugin<'media', {
     actions: {
@@ -59,9 +61,7 @@ export type MediaNextEditorPluginType = NextEditorPlugin<'media', {
         setProvider: (provider: Promise<MediaProvider>) => boolean;
     };
     commands: {
-        hideImageEditor: EditorCommand;
         hideMediaViewer: EditorCommand;
-        showImageEditor: (media: MediaADFAttrs) => EditorCommand;
         showMediaViewer: (media: MediaADFAttrs) => EditorCommand;
         trackMediaPaste: (attrs: MediaADFAttrs) => EditorCommand;
     };

package/dist/types-ts4.5/pm-plugins/commands.d.ts

@@ -3,5 +3,3 @@ import type { EditorCommand } from '@atlaskit/editor-common/types';
 export declare const showMediaViewer: (media: MediaADFAttrs) => EditorCommand;
 export declare const hideMediaViewer: EditorCommand;
 export declare const trackMediaPaste: (attrs: MediaADFAttrs) => EditorCommand;
-export declare const showImageEditor: (media: MediaADFAttrs) => EditorCommand;
-export declare const hideImageEditor: EditorCommand;

package/dist/types-ts4.5/pm-plugins/main.d.ts

@@ -1,5 +1,5 @@
 import type { IntlShape } from 'react-intl-next';
-import type { MediaADFAttrs, RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
+import type { RichMediaLayout as MediaSingleLayout } from '@atlaskit/adf-schema';
 import type { InsertMediaVia } from '@atlaskit/editor-common/analytics';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
@@ -41,8 +41,6 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
         (isUploading: boolean): void;
     }[];
     uploadInProgressSubscriptionsNotified: boolean;
-    isImageEditorVisible?: boolean;
-    imageEditorSelectedMedia?: MediaADFAttrs;
     lastAddedMediaSingleFileIds: {
         id: string;
         selectionPosition: number;
@@ -74,7 +72,6 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
     getMediaOptions: () => MediaPluginOptions;
     setIsResizing(isResizing: boolean): void;
     setResizingWidth(width: number): void;
-    setImageEditorVisibility(isVisible: boolean): void;
     updateElement(): void;
     private isMediaSchemaNode;
     private getDomElement;

package/dist/types-ts4.5/pm-plugins/types.d.ts

@@ -32,11 +32,9 @@ export interface MediaPluginState {
     handleMediaNodeRemoval: (node: PMNode | undefined, getPos: ProsemirrorGetPosHandler) => void;
     handleMediaNodeUnmount: (oldNode: PMNode) => void;
     ignoreLinks: boolean;
-    imageEditorSelectedMedia?: MediaADFAttrs;
     insertFile: (mediaState: MediaState, onMediaStateChanged: MediaStateEventSubscriber, pickerType?: string, insertMediaVia?: InsertMediaVia) => void;
     isFullscreen: boolean;
     isIdentifierInEditorScope: (identifier: Identifier) => boolean;
-    isImageEditorVisible?: boolean;
     isMediaViewerVisible?: boolean;
     isResizing: boolean;
     lastAddedMediaSingleFileIds: {
@@ -58,7 +56,6 @@ export interface MediaPluginState {
     resizingWidth: number;
     selectedMediaContainerNode: () => PMNode | undefined;
     setBrowseFn: (browseFn: () => void) => void;
-    setImageEditorVisibility: (isVisible: boolean) => void;
     setIsResizing(isResizing: boolean): void;
     setMediaProvider: (mediaProvider?: Promise<MediaProvider>) => Promise<void>;
     setResizingWidth(width: number): void;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "8.9.0",
+	"version": "8.10.0",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -62,12 +62,11 @@
 		"@atlaskit/media-picker": "^70.1.0",
 		"@atlaskit/media-ui": "^28.7.0",
 		"@atlaskit/media-viewer": "^52.5.0",
-		"@atlaskit/modal-dialog": "^14.9.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
 		"@atlaskit/primitives": "^17.0.0",
 		"@atlaskit/textfield": "^8.2.0",
 		"@atlaskit/theme": "^21.0.0",
-		"@atlaskit/tmp-editor-statsig": "^16.1.0",
+		"@atlaskit/tmp-editor-statsig": "^16.3.0",
 		"@atlaskit/tokens": "^9.0.0",
 		"@atlaskit/tooltip": "^20.11.0",
 		"@babel/runtime": "^7.0.0",
@@ -79,7 +78,7 @@
 		"uuid": "^3.1.0"
 	},
 	"peerDependencies": {
-		"@atlaskit/editor-common": "^110.48.0",
+		"@atlaskit/editor-common": "^110.50.0",
 		"@atlaskit/media-core": "^37.0.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0",

package/dist/cjs/ui/ImageEditor/ModalWrapper.js

@@ -1,69 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RenderImageEditor = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _mediaClient = require("@atlaskit/media-client");
-var _utils = require("../toolbar/utils");
-var _index = require("./index");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-var RenderImageEditor = exports.RenderImageEditor = function RenderImageEditor(_ref) {
-  var mediaClientConfig = _ref.mediaClientConfig,
-    onClose = _ref.onClose,
-    selectedNodeAttrs = _ref.selectedNodeAttrs,
-    errorReporter = _ref.errorReporter,
-    onSave = _ref.onSave;
-  var _useState = (0, _react.useState)(''),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    imageUrl = _useState2[0],
-    setImageUrl = _useState2[1];
-  (0, _react.useEffect)(function () {
-    var getImageUrl = function getImageUrl() {
-      if ((0, _utils.isExternalMedia)(selectedNodeAttrs)) {
-        // External image - use the URL directly
-        setImageUrl(selectedNodeAttrs.url || '');
-      } else {
-        // File media - use MediaClient to get the image URL
-        var id = selectedNodeAttrs.id,
-          _selectedNodeAttrs$co = selectedNodeAttrs.collection,
-          collection = _selectedNodeAttrs$co === void 0 ? '' : _selectedNodeAttrs$co;
-        try {
-          var mediaClient = new _mediaClient.MediaClient(mediaClientConfig);
-
-          // Subscribe to file state to get file information
-          var subscription = mediaClient.file.getFileState(id, {
-            collectionName: collection
-          }).subscribe(function (fileState) {
-            if (fileState.status === 'processed' || fileState.status === 'processing') {
-              // Get the image URL from the processed file
-              mediaClient.file.getFileBinaryURL(id, collection).then(function (url) {
-                setImageUrl(url);
-              });
-            }
-          });
-
-          // Cleanup subscription on unmount
-          return function () {
-            return subscription.unsubscribe();
-          };
-        } catch (error) {
-          if (errorReporter) {
-            errorReporter.captureException(error instanceof Error ? error : new Error(String(error)));
-          }
-          setImageUrl('');
-        }
-      }
-    };
-    getImageUrl();
-  }, [selectedNodeAttrs, mediaClientConfig, errorReporter]);
-  return /*#__PURE__*/_react.default.createElement(_index.ImageEditor, {
-    isOpen: true,
-    onClose: onClose,
-    imageUrl: imageUrl
-  });
-};

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

@@ -1,62 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-var _typeof = require("@babel/runtime/helpers/typeof");
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ImageEditor = void 0;
-var _react = require("@emotion/react");
-var _reactIntlNext = require("react-intl-next");
-var _new = _interopRequireDefault(require("@atlaskit/button/new"));
-var _modalDialog = _interopRequireWildcard(require("@atlaskit/modal-dialog"));
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
-/**
- * @jsxRuntime classic
- * @jsx jsx
- */
-
-// eslint-disable-next-line @atlaskit/ui-styling-standard/use-compiled -- Ignored via go/DSP-18766
-
-var imageWrapper = (0, _react.css)({
-  maxHeight: 'calc(100vh - 250px)',
-  width: '100%',
-  overflow: 'hidden',
-  display: 'flex',
-  justifyContent: 'center',
-  alignItems: 'center'
-});
-var imageStyle = (0, _react.css)({
-  maxWidth: '100%',
-  maxHeight: 'calc(100vh - 250px)',
-  width: 'auto',
-  height: 'auto',
-  objectFit: 'contain'
-});
-var ImageEditor = exports.ImageEditor = function ImageEditor(_ref) {
-  var isOpen = _ref.isOpen,
-    onClose = _ref.onClose,
-    imageUrl = _ref.imageUrl;
-  return (0, _react.jsx)(_modalDialog.ModalTransition, null, isOpen && (0, _react.jsx)(_modalDialog.default, {
-    onClose: onClose,
-    width: 1800
-  }, (0, _react.jsx)("br", null), (0, _react.jsx)(_modalDialog.ModalBody, null, (0, _react.jsx)("div", {
-    css: imageWrapper
-  }, imageUrl && (0, _react.jsx)("img", {
-    src: imageUrl,
-    alt: "Edit preview",
-    css: imageStyle
-  }))), (0, _react.jsx)(_modalDialog.ModalFooter, null, (0, _react.jsx)(_new.default, {
-    appearance: "subtle",
-    onClick: onClose
-  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, {
-    id: "editor.imageEditor.cancel",
-    defaultMessage: "Cancel"
-  })), (0, _react.jsx)(_new.default, {
-    appearance: "primary",
-    onClick: onClose
-  }, (0, _react.jsx)(_reactIntlNext.FormattedMessage, {
-    id: "editor.imageEditor.done",
-    defaultMessage: "Done"
-  })))));
-};