@atlaskit/editor-plugin-media 1.41.0 → 1.42.0

package/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @atlaskit/editor-plugin-media
 
+## 1.42.0
+
+### Minor Changes
+
+- [#164938](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/164938)
+  [`c41c3a71e1f68`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c41c3a71e1f68) -
+  Replaced ReactDOM.render with nodeViewPortalProviderAPI.render
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 1.41.0
 
 ### Minor Changes

package/dist/cjs/plugin.js

@@ -177,7 +177,8 @@ var mediaPlugin = exports.mediaPlugin = function mediaPlugin(_ref3) {
             providerFactory = _ref6.providerFactory,
             errorReporter = _ref6.errorReporter,
             portalProviderAPI = _ref6.portalProviderAPI,
-            dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent;
+            dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent,
+            nodeViewPortalProviderAPI = _ref6.nodeViewPortalProviderAPI;
           return (0, _main.createPlugin)(schema, {
             providerFactory: providerFactory,
             nodeViews: {
@@ -192,7 +193,7 @@ var mediaPlugin = exports.mediaPlugin = function mediaPlugin(_ref3) {
             customDropzoneContainer: options && options.customDropzoneContainer,
             customMediaPicker: options && options.customMediaPicker,
             allowResizing: !!(options && options.allowResizing)
-          }, getIntl, api, dispatch, options);
+          }, getIntl, api, nodeViewPortalProviderAPI, dispatch, options);
         }
       }, {
         name: 'mediaKeymap',

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

@@ -21,6 +21,7 @@ var _assert = _interopRequireDefault(require("assert"));
 var _react = _interopRequireDefault(require("react"));
 var _reactDom = _interopRequireDefault(require("react-dom"));
 var _reactIntlNext = require("react-intl-next");
+var _uuid = _interopRequireDefault(require("uuid"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _mediaInline = require("@atlaskit/editor-common/media-inline");
 var _mediaSingle = require("@atlaskit/editor-common/media-single");
@@ -55,25 +56,45 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 var MEDIA_CONTENT_WRAP_CLASS_NAME = exports.MEDIA_CONTENT_WRAP_CLASS_NAME = 'media-content-wrap';
 var MEDIA_PLUGIN_IS_RESIZING_KEY = exports.MEDIA_PLUGIN_IS_RESIZING_KEY = 'mediaSinglePlugin.isResizing';
 var MEDIA_PLUGIN_RESIZING_WIDTH_KEY = exports.MEDIA_PLUGIN_RESIZING_WIDTH_KEY = 'mediaSinglePlugin.resizing-width';
-var createDropPlaceholder = function createDropPlaceholder(intl, allowDropLine) {
+var createDropPlaceholder = function createDropPlaceholder(intl, nodeViewPortalProviderAPI, dropPlaceholderKey, allowDropLine) {
   var dropPlaceholder = document.createElement('div');
   var createElement = _react.default.createElement;
-  if (allowDropLine) {
-    _reactDom.default.render(createElement(_reactIntlNext.RawIntlProvider, {
-      value: intl
-    }, createElement(_DropPlaceholder.default, {
-      type: 'single'
-    })), dropPlaceholder);
+  if ((0, _platformFeatureFlags.fg)('platform_editor_react18_plugin_portalprovider')) {
+    if (allowDropLine) {
+      nodeViewPortalProviderAPI.render(function () {
+        return createElement(_reactIntlNext.RawIntlProvider, {
+          value: intl
+        }, createElement(_DropPlaceholder.default, {
+          type: 'single'
+        }));
+      }, dropPlaceholder, dropPlaceholderKey);
+    } else {
+      nodeViewPortalProviderAPI.render(function () {
+        return createElement(_reactIntlNext.RawIntlProvider, {
+          value: intl
+        }, createElement(_DropPlaceholder.default));
+      }, dropPlaceholder, dropPlaceholderKey);
+    }
   } else {
-    _reactDom.default.render(createElement(_reactIntlNext.RawIntlProvider, {
-      value: intl
-    }, createElement(_DropPlaceholder.default)), dropPlaceholder);
+    if (allowDropLine) {
+      //eslint-disable-next-line react/no-deprecated
+      _reactDom.default.render(createElement(_reactIntlNext.RawIntlProvider, {
+        value: intl
+      }, createElement(_DropPlaceholder.default, {
+        type: 'single'
+      })), dropPlaceholder);
+    } else {
+      //eslint-disable-next-line react/no-deprecated
+      _reactDom.default.render(createElement(_reactIntlNext.RawIntlProvider, {
+        value: intl
+      }, createElement(_DropPlaceholder.default)), dropPlaceholder);
+    }
   }
   return dropPlaceholder;
 };
 var MEDIA_RESOLVED_STATES = ['ready', 'error', 'cancelled'];
 var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*#__PURE__*/function () {
-  function MediaPluginStateImplementation(_state, options, mediaOptions, newInsertionBehaviour, _dispatch, pluginInjectionApi) {
+  function MediaPluginStateImplementation(_state, options, mediaOptions, _dispatch, pluginInjectionApi) {
     var _this = this,
       _this$mediaOptions2,
       _this$mediaOptions3;
@@ -738,12 +759,12 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
 var getMediaPluginState = exports.getMediaPluginState = function getMediaPluginState(state) {
   return _pluginKey.stateKey.getState(state);
 };
-var createPlugin = exports.createPlugin = function createPlugin(_schema, options, getIntl, pluginInjectionApi, dispatch, mediaOptions, newInsertionBehaviour) {
+var createPlugin = exports.createPlugin = function createPlugin(_schema, options, getIntl, pluginInjectionApi, nodeViewPortalProviderAPI, dispatch, mediaOptions) {
   var intl = getIntl();
   return new _safePlugin.SafePlugin({
     state: {
       init: function init(_config, state) {
-        return new MediaPluginStateImplementation(state, options, mediaOptions, newInsertionBehaviour, dispatch, pluginInjectionApi);
+        return new MediaPluginStateImplementation(state, options, mediaOptions, dispatch, pluginInjectionApi);
       },
       apply: function apply(tr, pluginState) {
         var _tr$getMeta;
@@ -881,13 +902,19 @@ var createPlugin = exports.createPlugin = function createPlugin(_schema, options
         if (pos === null || pos === undefined) {
           return _view2.DecorationSet.create(state.doc, mediaNodes);
         }
+        var dropPlaceholderKey = (0, _uuid.default)();
         var dropPlaceholders = [_view2.Decoration.widget(pos, function () {
-          return createDropPlaceholder(intl, mediaOptions && mediaOptions.allowDropzoneDropLine);
+          return createDropPlaceholder(intl, nodeViewPortalProviderAPI, dropPlaceholderKey, mediaOptions && mediaOptions.allowDropzoneDropLine);
         }, {
           key: 'drop-placeholder',
           destroy: function destroy(elem) {
             if (elem instanceof HTMLElement) {
-              _reactDom.default.unmountComponentAtNode(elem);
+              if ((0, _platformFeatureFlags.fg)('platform_editor_react18_plugin_portalprovider')) {
+                nodeViewPortalProviderAPI.remove(dropPlaceholderKey);
+              } else {
+                //eslint-disable-next-line react/no-deprecated
+                _reactDom.default.unmountComponentAtNode(elem);
+              }
             }
           }
         })].concat(mediaNodes);

package/dist/es2019/plugin.js

@@ -169,7 +169,8 @@ export const mediaPlugin = ({
           providerFactory,
           errorReporter,
           portalProviderAPI,
-          dispatchAnalyticsEvent
+          dispatchAnalyticsEvent,
+          nodeViewPortalProviderAPI
         }) => {
           return createPlugin(schema, {
             providerFactory,
@@ -185,7 +186,7 @@ export const mediaPlugin = ({
             customDropzoneContainer: options && options.customDropzoneContainer,
             customMediaPicker: options && options.customMediaPicker,
             allowResizing: !!(options && options.allowResizing)
-          }, getIntl, api, dispatch, options);
+          }, getIntl, api, nodeViewPortalProviderAPI, dispatch, options);
         }
       }, {
         name: 'mediaKeymap',

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

@@ -3,6 +3,7 @@ import assert from 'assert';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { RawIntlProvider } from 'react-intl-next';
+import uuid from 'uuid';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { mediaInlineImagesEnabled } from '@atlaskit/editor-common/media-inline';
@@ -32,25 +33,41 @@ export { stateKey } from './plugin-key';
 export const MEDIA_CONTENT_WRAP_CLASS_NAME = 'media-content-wrap';
 export const MEDIA_PLUGIN_IS_RESIZING_KEY = 'mediaSinglePlugin.isResizing';
 export const MEDIA_PLUGIN_RESIZING_WIDTH_KEY = 'mediaSinglePlugin.resizing-width';
-const createDropPlaceholder = (intl, allowDropLine) => {
+const createDropPlaceholder = (intl, nodeViewPortalProviderAPI, dropPlaceholderKey, allowDropLine) => {
   const dropPlaceholder = document.createElement('div');
   const createElement = React.createElement;
-  if (allowDropLine) {
-    ReactDOM.render(createElement(RawIntlProvider, {
-      value: intl
-    }, createElement(DropPlaceholder, {
-      type: 'single'
-    })), dropPlaceholder);
+  if (fg('platform_editor_react18_plugin_portalprovider')) {
+    if (allowDropLine) {
+      nodeViewPortalProviderAPI.render(() => createElement(RawIntlProvider, {
+        value: intl
+      }, createElement(DropPlaceholder, {
+        type: 'single'
+      })), dropPlaceholder, dropPlaceholderKey);
+    } else {
+      nodeViewPortalProviderAPI.render(() => createElement(RawIntlProvider, {
+        value: intl
+      }, createElement(DropPlaceholder)), dropPlaceholder, dropPlaceholderKey);
+    }
   } else {
-    ReactDOM.render(createElement(RawIntlProvider, {
-      value: intl
-    }, createElement(DropPlaceholder)), dropPlaceholder);
+    if (allowDropLine) {
+      //eslint-disable-next-line react/no-deprecated
+      ReactDOM.render(createElement(RawIntlProvider, {
+        value: intl
+      }, createElement(DropPlaceholder, {
+        type: 'single'
+      })), dropPlaceholder);
+    } else {
+      //eslint-disable-next-line react/no-deprecated
+      ReactDOM.render(createElement(RawIntlProvider, {
+        value: intl
+      }, createElement(DropPlaceholder)), dropPlaceholder);
+    }
   }
   return dropPlaceholder;
 };
 const MEDIA_RESOLVED_STATES = ['ready', 'error', 'cancelled'];
 export class MediaPluginStateImplementation {
-  constructor(_state, options, mediaOptions, newInsertionBehaviour, _dispatch, pluginInjectionApi) {
+  constructor(_state, options, mediaOptions, _dispatch, pluginInjectionApi) {
     var _this$mediaOptions2, _this$mediaOptions3;
     _defineProperty(this, "allowsUploads", false);
     _defineProperty(this, "ignoreLinks", false);
@@ -624,12 +641,12 @@ export class MediaPluginStateImplementation {
   }
 }
 export const getMediaPluginState = state => stateKey.getState(state);
-export const createPlugin = (_schema, options, getIntl, pluginInjectionApi, dispatch, mediaOptions, newInsertionBehaviour) => {
+export const createPlugin = (_schema, options, getIntl, pluginInjectionApi, nodeViewPortalProviderAPI, dispatch, mediaOptions) => {
   const intl = getIntl();
   return new SafePlugin({
     state: {
       init(_config, state) {
-        return new MediaPluginStateImplementation(state, options, mediaOptions, newInsertionBehaviour, dispatch, pluginInjectionApi);
+        return new MediaPluginStateImplementation(state, options, mediaOptions, dispatch, pluginInjectionApi);
       },
       apply(tr, pluginState) {
         var _tr$getMeta;
@@ -764,13 +781,19 @@ export const createPlugin = (_schema, options, getIntl, pluginInjectionApi, disp
         if (pos === null || pos === undefined) {
           return DecorationSet.create(state.doc, mediaNodes);
         }
+        const dropPlaceholderKey = uuid();
         const dropPlaceholders = [Decoration.widget(pos, () => {
-          return createDropPlaceholder(intl, mediaOptions && mediaOptions.allowDropzoneDropLine);
+          return createDropPlaceholder(intl, nodeViewPortalProviderAPI, dropPlaceholderKey, mediaOptions && mediaOptions.allowDropzoneDropLine);
         }, {
           key: 'drop-placeholder',
           destroy: elem => {
             if (elem instanceof HTMLElement) {
-              ReactDOM.unmountComponentAtNode(elem);
+              if (fg('platform_editor_react18_plugin_portalprovider')) {
+                nodeViewPortalProviderAPI.remove(dropPlaceholderKey);
+              } else {
+                //eslint-disable-next-line react/no-deprecated
+                ReactDOM.unmountComponentAtNode(elem);
+              }
             }
           }
         }), ...mediaNodes];

package/dist/esm/plugin.js

@@ -167,7 +167,8 @@ export var mediaPlugin = function mediaPlugin(_ref3) {
             providerFactory = _ref6.providerFactory,
             errorReporter = _ref6.errorReporter,
             portalProviderAPI = _ref6.portalProviderAPI,
-            dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent;
+            dispatchAnalyticsEvent = _ref6.dispatchAnalyticsEvent,
+            nodeViewPortalProviderAPI = _ref6.nodeViewPortalProviderAPI;
           return createPlugin(schema, {
             providerFactory: providerFactory,
             nodeViews: {
@@ -182,7 +183,7 @@ export var mediaPlugin = function mediaPlugin(_ref3) {
             customDropzoneContainer: options && options.customDropzoneContainer,
             customMediaPicker: options && options.customMediaPicker,
             allowResizing: !!(options && options.allowResizing)
-          }, getIntl, api, dispatch, options);
+          }, getIntl, api, nodeViewPortalProviderAPI, dispatch, options);
         }
       }, {
         name: 'mediaKeymap',

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

@@ -12,6 +12,7 @@ import assert from 'assert';
 import React from 'react';
 import ReactDOM from 'react-dom';
 import { RawIntlProvider } from 'react-intl-next';
+import uuid from 'uuid';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { mediaInlineImagesEnabled } from '@atlaskit/editor-common/media-inline';
@@ -41,25 +42,45 @@ export { stateKey } from './plugin-key';
 export var MEDIA_CONTENT_WRAP_CLASS_NAME = 'media-content-wrap';
 export var MEDIA_PLUGIN_IS_RESIZING_KEY = 'mediaSinglePlugin.isResizing';
 export var MEDIA_PLUGIN_RESIZING_WIDTH_KEY = 'mediaSinglePlugin.resizing-width';
-var createDropPlaceholder = function createDropPlaceholder(intl, allowDropLine) {
+var createDropPlaceholder = function createDropPlaceholder(intl, nodeViewPortalProviderAPI, dropPlaceholderKey, allowDropLine) {
   var dropPlaceholder = document.createElement('div');
   var createElement = React.createElement;
-  if (allowDropLine) {
-    ReactDOM.render(createElement(RawIntlProvider, {
-      value: intl
-    }, createElement(DropPlaceholder, {
-      type: 'single'
-    })), dropPlaceholder);
+  if (fg('platform_editor_react18_plugin_portalprovider')) {
+    if (allowDropLine) {
+      nodeViewPortalProviderAPI.render(function () {
+        return createElement(RawIntlProvider, {
+          value: intl
+        }, createElement(DropPlaceholder, {
+          type: 'single'
+        }));
+      }, dropPlaceholder, dropPlaceholderKey);
+    } else {
+      nodeViewPortalProviderAPI.render(function () {
+        return createElement(RawIntlProvider, {
+          value: intl
+        }, createElement(DropPlaceholder));
+      }, dropPlaceholder, dropPlaceholderKey);
+    }
   } else {
-    ReactDOM.render(createElement(RawIntlProvider, {
-      value: intl
-    }, createElement(DropPlaceholder)), dropPlaceholder);
+    if (allowDropLine) {
+      //eslint-disable-next-line react/no-deprecated
+      ReactDOM.render(createElement(RawIntlProvider, {
+        value: intl
+      }, createElement(DropPlaceholder, {
+        type: 'single'
+      })), dropPlaceholder);
+    } else {
+      //eslint-disable-next-line react/no-deprecated
+      ReactDOM.render(createElement(RawIntlProvider, {
+        value: intl
+      }, createElement(DropPlaceholder)), dropPlaceholder);
+    }
   }
   return dropPlaceholder;
 };
 var MEDIA_RESOLVED_STATES = ['ready', 'error', 'cancelled'];
 export var MediaPluginStateImplementation = /*#__PURE__*/function () {
-  function MediaPluginStateImplementation(_state, options, mediaOptions, newInsertionBehaviour, _dispatch, pluginInjectionApi) {
+  function MediaPluginStateImplementation(_state, options, mediaOptions, _dispatch, pluginInjectionApi) {
     var _this = this,
       _this$mediaOptions2,
       _this$mediaOptions3;
@@ -724,12 +745,12 @@ export var MediaPluginStateImplementation = /*#__PURE__*/function () {
 export var getMediaPluginState = function getMediaPluginState(state) {
   return stateKey.getState(state);
 };
-export var createPlugin = function createPlugin(_schema, options, getIntl, pluginInjectionApi, dispatch, mediaOptions, newInsertionBehaviour) {
+export var createPlugin = function createPlugin(_schema, options, getIntl, pluginInjectionApi, nodeViewPortalProviderAPI, dispatch, mediaOptions) {
   var intl = getIntl();
   return new SafePlugin({
     state: {
       init: function init(_config, state) {
-        return new MediaPluginStateImplementation(state, options, mediaOptions, newInsertionBehaviour, dispatch, pluginInjectionApi);
+        return new MediaPluginStateImplementation(state, options, mediaOptions, dispatch, pluginInjectionApi);
       },
       apply: function apply(tr, pluginState) {
         var _tr$getMeta;
@@ -867,13 +888,19 @@ export var createPlugin = function createPlugin(_schema, options, getIntl, plugi
         if (pos === null || pos === undefined) {
           return DecorationSet.create(state.doc, mediaNodes);
         }
+        var dropPlaceholderKey = uuid();
         var dropPlaceholders = [Decoration.widget(pos, function () {
-          return createDropPlaceholder(intl, mediaOptions && mediaOptions.allowDropzoneDropLine);
+          return createDropPlaceholder(intl, nodeViewPortalProviderAPI, dropPlaceholderKey, mediaOptions && mediaOptions.allowDropzoneDropLine);
         }, {
           key: 'drop-placeholder',
           destroy: function destroy(elem) {
             if (elem instanceof HTMLElement) {
-              ReactDOM.unmountComponentAtNode(elem);
+              if (fg('platform_editor_react18_plugin_portalprovider')) {
+                nodeViewPortalProviderAPI.remove(dropPlaceholderKey);
+              } else {
+                //eslint-disable-next-line react/no-deprecated
+                ReactDOM.unmountComponentAtNode(elem);
+              }
             }
           }
         })].concat(mediaNodes);

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

@@ -4,6 +4,7 @@ import type { InsertMediaVia } from '@atlaskit/editor-common/analytics';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { type PortalProviderAPI } from '@atlaskit/editor-common/src/portal';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
@@ -62,7 +63,7 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
     dispatch?: Dispatch;
     pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined;
     singletonCreatedAt: number;
-    constructor(state: EditorState, options: MediaPluginOptions, mediaOptions: MediaOptions | undefined, newInsertionBehaviour: boolean | undefined, dispatch: Dispatch | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined);
+    constructor(state: EditorState, options: MediaPluginOptions, mediaOptions: MediaOptions | undefined, dispatch: Dispatch | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined);
     clone(): this;
     subscribeToUploadInProgressState(fn: (isUploading: boolean) => void): void;
     unsubscribeFromUploadInProgressState(fn: (isUploading: boolean) => void): void;
@@ -129,4 +130,4 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
     updateAndDispatch(props: Partial<Pick<this, 'allowsUploads' | 'allUploadsFinished' | 'isFullscreen'>>): void;
 }
 export declare const getMediaPluginState: (state: EditorState) => MediaPluginState;
-export declare const createPlugin: (_schema: Schema, options: MediaPluginOptions, getIntl: () => IntlShape, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, dispatch?: Dispatch, mediaOptions?: MediaOptions, newInsertionBehaviour?: boolean) => SafePlugin<MediaPluginState>;
+export declare const createPlugin: (_schema: Schema, options: MediaPluginOptions, getIntl: () => IntlShape, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI, dispatch?: Dispatch, mediaOptions?: MediaOptions) => SafePlugin<MediaPluginState>;

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

@@ -4,6 +4,7 @@ import type { InsertMediaVia } from '@atlaskit/editor-common/analytics';
 import type { Dispatch } from '@atlaskit/editor-common/event-dispatcher';
 import type { MediaProvider } from '@atlaskit/editor-common/provider-factory';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
+import { type PortalProviderAPI } from '@atlaskit/editor-common/src/portal';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { Node as PMNode, Schema } from '@atlaskit/editor-prosemirror/model';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
@@ -62,7 +63,7 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
     dispatch?: Dispatch;
     pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined;
     singletonCreatedAt: number;
-    constructor(state: EditorState, options: MediaPluginOptions, mediaOptions: MediaOptions | undefined, newInsertionBehaviour: boolean | undefined, dispatch: Dispatch | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined);
+    constructor(state: EditorState, options: MediaPluginOptions, mediaOptions: MediaOptions | undefined, dispatch: Dispatch | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined);
     clone(): this;
     subscribeToUploadInProgressState(fn: (isUploading: boolean) => void): void;
     unsubscribeFromUploadInProgressState(fn: (isUploading: boolean) => void): void;
@@ -129,4 +130,4 @@ export declare class MediaPluginStateImplementation implements MediaPluginState
     updateAndDispatch(props: Partial<Pick<this, 'allowsUploads' | 'allUploadsFinished' | 'isFullscreen'>>): void;
 }
 export declare const getMediaPluginState: (state: EditorState) => MediaPluginState;
-export declare const createPlugin: (_schema: Schema, options: MediaPluginOptions, getIntl: () => IntlShape, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, dispatch?: Dispatch, mediaOptions?: MediaOptions, newInsertionBehaviour?: boolean) => SafePlugin<MediaPluginState>;
+export declare const createPlugin: (_schema: Schema, options: MediaPluginOptions, getIntl: () => IntlShape, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, nodeViewPortalProviderAPI: PortalProviderAPI, dispatch?: Dispatch, mediaOptions?: MediaOptions) => SafePlugin<MediaPluginState>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "1.41.0",
+	"version": "1.42.0",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -36,7 +36,7 @@
 		"@atlaskit/analytics-namespaced-context": "^6.12.0",
 		"@atlaskit/analytics-next": "^10.1.0",
 		"@atlaskit/button": "^20.3.0",
-		"@atlaskit/editor-common": "^94.21.0",
+		"@atlaskit/editor-common": "^94.23.0",
 		"@atlaskit/editor-palette": "1.6.3",
 		"@atlaskit/editor-plugin-analytics": "^1.10.0",
 		"@atlaskit/editor-plugin-annotation": "1.24.0",
@@ -66,7 +66,7 @@
 		"@atlaskit/primitives": "^13.2.0",
 		"@atlaskit/textfield": "^6.5.0",
 		"@atlaskit/theme": "^14.0.0",
-		"@atlaskit/tmp-editor-statsig": "^2.16.0",
+		"@atlaskit/tmp-editor-statsig": "^2.18.0",
 		"@atlaskit/tokens": "^2.2.0",
 		"@atlaskit/tooltip": "^18.9.0",
 		"@babel/runtime": "^7.0.0",
@@ -152,6 +152,9 @@
 		},
 		"confluence_frontend_media_scroll_fix": {
 			"type": "boolean"
+		},
+		"platform_editor_react18_plugin_portalprovider": {
+			"type": "boolean"
 		}
 	},
 	"stricter": {