@atlaskit/editor-plugin-media 2.3.21 → 2.4.0

package/CHANGELOG.md

@@ -1,5 +1,31 @@
 # @atlaskit/editor-plugin-media
 
+## 2.4.0
+
+### Minor Changes
+
+- [#139139](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/139139)
+  [`7f6b665d778dd`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/7f6b665d778dd) -
+  [https://product-fabric.atlassian.net/browse/ED-27499](ED-27499) - the new
+  `@atlassian/confluence-presets` package with Confluence `full-page` preset is created
+
+### Patch Changes
+
+- Updated dependencies
+
+## 2.3.22
+
+### Patch Changes
+
+- [#137128](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/137128)
+  [`9717d76a633ca`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/9717d76a633ca) -
+  [ux] Fix media custom toolbar position issue
+- [#137153](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/137153)
+  [`105ebf2f4f54b`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/105ebf2f4f54b) -
+  [ED-27125] This change is adding a feature gate to use the functional components for media nodes
+  which will resolve the bug of attachment duplication when copying and pasting.
+- Updated dependencies
+
 ## 2.3.21
 
 ### Patch Changes

package/dist/cjs/nodeviews/mediaGroup.js

@@ -348,7 +348,7 @@ var MediaGroupNodeView = /*#__PURE__*/function (_ReactNodeView) {
             if (!mediaProvider) {
               return null;
             }
-            if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single')) {
+            if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single') || (0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single_jira')) {
               return /*#__PURE__*/_react.default.createElement(_mediaGroupNext.MediaGroupNext, {
                 node: _this3.node,
                 getPos: getPos,

package/dist/cjs/nodeviews/mediaSingle.js

@@ -565,7 +565,7 @@ var MediaSingleNodeWrapper = function MediaSingleNodeWrapper(_ref6) {
   var mediaProvider = (0, _react.useMemo)(function () {
     return mediaState !== null && mediaState !== void 0 && mediaState.mediaProvider ? Promise.resolve(mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider) : undefined;
   }, [mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider]);
-  if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single')) {
+  if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single') || (0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single_jira')) {
     return (0, _react2.jsx)(_mediaSingleNext.MediaSingleNodeNext, {
       width: (widthState === null || widthState === void 0 ? void 0 : widthState.width) || 0,
       lineLength: (widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || 0,

package/dist/cjs/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -1075,7 +1075,7 @@ var ResizableMediaSingleToggle = function ResizableMediaSingleToggle(_ref9) {
     viewMediaClientConfig = _ref9.viewMediaClientConfig,
     width = _ref9.width,
     forceHandlePositioning = _ref9.forceHandlePositioning;
-  if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single')) {
+  if ((0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single') || (0, _platformFeatureFlags.fg)('platform_editor_react18_phase2__media_single_jira')) {
     return (0, _react2.jsx)(ResizableMediaSingleNextFunctional, {
       allowBreakoutSnapPoints: allowBreakoutSnapPoints
       // eslint-disable-next-line react/no-children-prop

package/dist/cjs/ui/toolbar/alt-text.js

@@ -95,7 +95,8 @@ var getAltTextDropdownOption = exports.getAltTextDropdownOption = function getAl
       onClick: (0, _commands.openMediaAltTextMenu)(editorAnalyticsAPI),
       icon: /*#__PURE__*/_react.default.createElement(_text.default, {
         label: ""
-      })
+      }),
+      testId: 'media-alt-text-dropdown-option'
     }];
   }
   return [];

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

@@ -720,11 +720,14 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
     return;
   }
   var nodeType = allowMediaInline ? [mediaInline, mediaSingle, media] : [mediaSingle];
+  var isSelectedNodeMediaSingle = state.selection instanceof _state2.NodeSelection && state.selection.node.type === mediaSingle;
   var baseToolbar = {
     title: 'Media floating controls',
     nodeType: nodeType,
     getDomRef: function getDomRef() {
-      return mediaPluginState.element;
+      var _mediaPluginState$ele;
+      var element = isSelectedNodeMediaSingle && (0, _platformFeatureFlags.fg)('platform_editor_media_single_toolbar_target') ? ((_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(".".concat(_styles.MediaSingleNodeSelector))) || mediaPluginState.element : mediaPluginState.element;
+      return element;
     }
   };
   if (allowLinking && mediaLinkingState && mediaLinkingState.visible && (0, _linking3.shouldShowMediaLinkToolbar)(state)) {
@@ -767,21 +770,21 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
     var _pluginInjectionApi$a8, _pluginInjectionApi$f2;
     var mediaOffset = state.selection.$from.parentOffset + 1;
     baseToolbar.getDomRef = function () {
-      var _mediaPluginState$ele;
+      var _mediaPluginState$ele2;
       var selector = (0, _mediaFilmstrip.mediaFilmstripItemDOMSelector)(mediaOffset);
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      return (_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(selector);
+      return (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(selector);
     };
     items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector, isViewOnly);
   } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
     items = (0, _mediaInline2.generateMediaInlineFloatingToolbar)(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options);
   } else {
     baseToolbar.getDomRef = function () {
-      var _mediaPluginState$ele2;
+      var _mediaPluginState$ele3;
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      var element = (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(".".concat(_styles.MediaSingleNodeSelector));
+      var element = (_mediaPluginState$ele3 = mediaPluginState.element) === null || _mediaPluginState$ele3 === void 0 ? void 0 : _mediaPluginState$ele3.querySelector(".".concat(_styles.MediaSingleNodeSelector));
       return element || mediaPluginState.element;
     };
     items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);

package/dist/es2019/nodeviews/mediaGroup.js

@@ -296,7 +296,7 @@ class MediaGroupNodeView extends ReactNodeView {
           if (!mediaProvider) {
             return null;
           }
-          if (fg('platform_editor_react18_phase2__media_single')) {
+          if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
             return /*#__PURE__*/React.createElement(MediaGroupNext, {
               node: this.node,
               getPos: getPos,

package/dist/es2019/nodeviews/mediaSingle.js

@@ -480,7 +480,7 @@ const MediaSingleNodeWrapper = ({
     editorViewModeState
   } = useSharedPluginState(pluginInjectionApi, ['width', 'media', 'annotation', 'editorDisabled', 'editorViewMode']);
   const mediaProvider = useMemo(() => mediaState !== null && mediaState !== void 0 && mediaState.mediaProvider ? Promise.resolve(mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider) : undefined, [mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider]);
-  if (fg('platform_editor_react18_phase2__media_single')) {
+  if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
     return jsx(MediaSingleNodeNext, {
       width: (widthState === null || widthState === void 0 ? void 0 : widthState.width) || 0,
       lineLength: (widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || 0,

package/dist/es2019/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -983,7 +983,7 @@ const ResizableMediaSingleToggle = ({
   width,
   forceHandlePositioning
 }) => {
-  if (fg('platform_editor_react18_phase2__media_single')) {
+  if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
     return jsx(ResizableMediaSingleNextFunctional, {
       allowBreakoutSnapPoints: allowBreakoutSnapPoints
       // eslint-disable-next-line react/no-children-prop

package/dist/es2019/ui/toolbar/alt-text.js

@@ -91,7 +91,8 @@ export const getAltTextDropdownOption = (state, formatMessage, allowAltTextOnIma
       onClick: openMediaAltTextMenu(editorAnalyticsAPI),
       icon: /*#__PURE__*/React.createElement(TextIcon, {
         label: ""
-      })
+      }),
+      testId: 'media-alt-text-dropdown-option'
     }];
   }
   return [];

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

@@ -717,10 +717,15 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
     return;
   }
   const nodeType = allowMediaInline ? [mediaInline, mediaSingle, media] : [mediaSingle];
+  const isSelectedNodeMediaSingle = state.selection instanceof NodeSelection && state.selection.node.type === mediaSingle;
   const baseToolbar = {
     title: 'Media floating controls',
     nodeType,
-    getDomRef: () => mediaPluginState.element
+    getDomRef: () => {
+      var _mediaPluginState$ele;
+      const element = isSelectedNodeMediaSingle && fg('platform_editor_media_single_toolbar_target') ? ((_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(`.${MediaSingleNodeSelector}`)) || mediaPluginState.element : mediaPluginState.element;
+      return element;
+    }
   };
   if (allowLinking && mediaLinkingState && mediaLinkingState.visible && shouldShowMediaLinkToolbar(state)) {
     const linkingToolbar = getLinkingToolbar(baseToolbar, mediaLinkingState, state, intl, pluginInjectionApi, providerFactory);
@@ -764,21 +769,21 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
     var _pluginInjectionApi$a8, _pluginInjectionApi$f3, _pluginInjectionApi$f4;
     const mediaOffset = state.selection.$from.parentOffset + 1;
     baseToolbar.getDomRef = () => {
-      var _mediaPluginState$ele;
+      var _mediaPluginState$ele2;
       const selector = mediaFilmstripItemDOMSelector(mediaOffset);
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      return (_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(selector);
+      return (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(selector);
     };
     items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f3 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f3 === void 0 ? void 0 : (_pluginInjectionApi$f4 = _pluginInjectionApi$f3.actions) === null || _pluginInjectionApi$f4 === void 0 ? void 0 : _pluginInjectionApi$f4.forceFocusSelector, isViewOnly);
   } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
     items = generateMediaInlineFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options);
   } else {
     baseToolbar.getDomRef = () => {
-      var _mediaPluginState$ele2;
+      var _mediaPluginState$ele3;
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      const element = (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(`.${MediaSingleNodeSelector}`);
+      const element = (_mediaPluginState$ele3 = mediaPluginState.element) === null || _mediaPluginState$ele3 === void 0 ? void 0 : _mediaPluginState$ele3.querySelector(`.${MediaSingleNodeSelector}`);
       return element || mediaPluginState.element;
     };
     items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);

package/dist/esm/nodeviews/mediaGroup.js

@@ -341,7 +341,7 @@ var MediaGroupNodeView = /*#__PURE__*/function (_ReactNodeView) {
             if (!mediaProvider) {
               return null;
             }
-            if (fg('platform_editor_react18_phase2__media_single')) {
+            if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
               return /*#__PURE__*/React.createElement(MediaGroupNext, {
                 node: _this3.node,
                 getPos: getPos,

package/dist/esm/nodeviews/mediaSingle.js

@@ -560,7 +560,7 @@ var MediaSingleNodeWrapper = function MediaSingleNodeWrapper(_ref6) {
   var mediaProvider = useMemo(function () {
     return mediaState !== null && mediaState !== void 0 && mediaState.mediaProvider ? Promise.resolve(mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider) : undefined;
   }, [mediaState === null || mediaState === void 0 ? void 0 : mediaState.mediaProvider]);
-  if (fg('platform_editor_react18_phase2__media_single')) {
+  if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
     return jsx(MediaSingleNodeNext, {
       width: (widthState === null || widthState === void 0 ? void 0 : widthState.width) || 0,
       lineLength: (widthState === null || widthState === void 0 ? void 0 : widthState.lineLength) || 0,

package/dist/esm/ui/ResizableMediaSingle/ResizableMediaSingleNext.js

@@ -1068,7 +1068,7 @@ var ResizableMediaSingleToggle = function ResizableMediaSingleToggle(_ref9) {
     viewMediaClientConfig = _ref9.viewMediaClientConfig,
     width = _ref9.width,
     forceHandlePositioning = _ref9.forceHandlePositioning;
-  if (fg('platform_editor_react18_phase2__media_single')) {
+  if (fg('platform_editor_react18_phase2__media_single') || fg('platform_editor_react18_phase2__media_single_jira')) {
     return jsx(ResizableMediaSingleNextFunctional, {
       allowBreakoutSnapPoints: allowBreakoutSnapPoints
       // eslint-disable-next-line react/no-children-prop

package/dist/esm/ui/toolbar/alt-text.js

@@ -88,7 +88,8 @@ export var getAltTextDropdownOption = function getAltTextDropdownOption(state, f
       onClick: openMediaAltTextMenu(editorAnalyticsAPI),
       icon: /*#__PURE__*/React.createElement(TextIcon, {
         label: ""
-      })
+      }),
+      testId: 'media-alt-text-dropdown-option'
     }];
   }
   return [];

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

@@ -710,11 +710,14 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
     return;
   }
   var nodeType = allowMediaInline ? [mediaInline, mediaSingle, media] : [mediaSingle];
+  var isSelectedNodeMediaSingle = state.selection instanceof NodeSelection && state.selection.node.type === mediaSingle;
   var baseToolbar = {
     title: 'Media floating controls',
     nodeType: nodeType,
     getDomRef: function getDomRef() {
-      return mediaPluginState.element;
+      var _mediaPluginState$ele;
+      var element = isSelectedNodeMediaSingle && fg('platform_editor_media_single_toolbar_target') ? ((_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(".".concat(MediaSingleNodeSelector))) || mediaPluginState.element : mediaPluginState.element;
+      return element;
     }
   };
   if (allowLinking && mediaLinkingState && mediaLinkingState.visible && shouldShowMediaLinkToolbar(state)) {
@@ -757,21 +760,21 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
     var _pluginInjectionApi$a8, _pluginInjectionApi$f2;
     var mediaOffset = state.selection.$from.parentOffset + 1;
     baseToolbar.getDomRef = function () {
-      var _mediaPluginState$ele;
+      var _mediaPluginState$ele2;
       var selector = mediaFilmstripItemDOMSelector(mediaOffset);
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      return (_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(selector);
+      return (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(selector);
     };
     items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a8 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a8 === void 0 ? void 0 : _pluginInjectionApi$a8.actions, pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 || (_pluginInjectionApi$f2 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector, isViewOnly);
   } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
     items = generateMediaInlineFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, pluginInjectionApi, options);
   } else {
     baseToolbar.getDomRef = function () {
-      var _mediaPluginState$ele2;
+      var _mediaPluginState$ele3;
       // Ignored via go/ees005
       // eslint-disable-next-line @atlaskit/editor/no-as-casting
-      var element = (_mediaPluginState$ele2 = mediaPluginState.element) === null || _mediaPluginState$ele2 === void 0 ? void 0 : _mediaPluginState$ele2.querySelector(".".concat(MediaSingleNodeSelector));
+      var element = (_mediaPluginState$ele3 = mediaPluginState.element) === null || _mediaPluginState$ele3 === void 0 ? void 0 : _mediaPluginState$ele3.querySelector(".".concat(MediaSingleNodeSelector));
       return element || mediaPluginState.element;
     };
     items = generateMediaSingleFloatingToolbar(state, intl, options, mediaPluginState, mediaLinkingState, pluginInjectionApi);

package/dist/types/index.d.ts

@@ -1,2 +1,3 @@
 export type { MediaNextEditorPluginType as MediaPlugin } from './mediaPluginType';
+export type { MediaPluginOptions } from './types/index';
 export { mediaPlugin } from './mediaPlugin';

package/dist/types/nodeviews/lazy-media-group.d.ts

@@ -3,5 +3,4 @@ import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { MediaNextEditorPluginType } from '../mediaPluginType';
-import type { MediaOptions } from '../types';
-export declare const lazyMediaGroupView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: MediaOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
+export declare const lazyMediaGroupView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: import("../types").MediaPluginOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;

package/dist/types/nodeviews/lazy-media.d.ts

@@ -4,5 +4,4 @@ import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { MediaNextEditorPluginType } from '../mediaPluginType';
-import type { MediaOptions } from '../types';
-export declare const lazyMediaView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: MediaOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => NodeViewConstructor;
+export declare const lazyMediaView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: import("../types").MediaPluginOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => NodeViewConstructor;

package/dist/types/nodeviews/mediaGroup.d.ts

@@ -27,4 +27,4 @@ declare const IntlMediaGroup: React.FC<import("react-intl-next").WithIntlProps<M
     WrappedComponent: React.ComponentType<MediaGroupProps>;
 };
 export default IntlMediaGroup;
-export declare const ReactMediaGroupNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: MediaOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;
+export declare const ReactMediaGroupNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: import("../types").MediaPluginOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;

package/dist/types/nodeviews/mediaNodeView/index.d.ts

@@ -8,7 +8,7 @@ import type { ExtractInjectionAPI, EditorContainerWidth as WidthPluginState } fr
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { Decoration, EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { MediaNextEditorPluginType } from '../../mediaPluginType';
-import type { getPosHandler, MediaOptions } from '../../types';
+import type { getPosHandler } from '../../types';
 import type { MediaNodeViewProps } from '../types';
 interface MediaNodeWithPluginStateComponentProps {
     width?: WidthPluginState;
@@ -29,5 +29,5 @@ declare class MediaNodeView extends SelectionBasedNodeView<MediaNodeViewProps> {
     renderMediaNodeWithProviders: ({ contextIdentifierProvider }: Providers) => React.JSX.Element;
     render(): React.JSX.Element;
 }
-export declare const ReactMediaNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: MediaOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => MediaNodeView;
+export declare const ReactMediaNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: import("../../types").MediaPluginOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => MediaNodeView;
 export {};

package/dist/types/types/index.d.ts

@@ -15,7 +15,7 @@ interface PlaceholderTextOptions {
 export type MediaStateStatus = 'unknown' | 'ready' | 'cancelled' | 'preview' | 'error' | 'mobile-upload-end';
 export type MediaSingleWithType = 'pixel' | 'percentage';
 export type MediaCopyScope = 'editor' | 'context';
-export interface MediaOptions {
+export interface MediaPluginOptions {
     provider?: Providers['mediaProvider'];
     /**
      * @experimental
@@ -56,6 +56,12 @@ export interface MediaOptions {
     forceHandlePositioning?: HandlePositioning;
     mediaShallowCopyScope?: MediaCopyScope;
 }
+/**
+ * @private
+ * @deprecated Use {@link MediaPluginOptions} instead.
+ * @see https://product-fabric.atlassian.net/browse/ED-27496
+ */
+export type MediaOptions = MediaPluginOptions;
 export interface MediaSingleOptions {
     disableLayout?: boolean;
 }

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

@@ -1,2 +1,3 @@
 export type { MediaNextEditorPluginType as MediaPlugin } from './mediaPluginType';
+export type { MediaPluginOptions } from './types/index';
 export { mediaPlugin } from './mediaPlugin';

package/dist/types-ts4.5/nodeviews/lazy-media-group.d.ts

@@ -3,5 +3,4 @@ import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { MediaNextEditorPluginType } from '../mediaPluginType';
-import type { MediaOptions } from '../types';
-export declare const lazyMediaGroupView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: MediaOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;
+export declare const lazyMediaGroupView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: import("../types").MediaPluginOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => import("@atlaskit/editor-common/lazy-node-view").NodeViewConstructor;

package/dist/types-ts4.5/nodeviews/lazy-media.d.ts

@@ -4,5 +4,4 @@ import { type PortalProviderAPI } from '@atlaskit/editor-common/portal';
 import type { ProviderFactory } from '@atlaskit/editor-common/provider-factory';
 import type { ExtractInjectionAPI } from '@atlaskit/editor-common/types';
 import type { MediaNextEditorPluginType } from '../mediaPluginType';
-import type { MediaOptions } from '../types';
-export declare const lazyMediaView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: MediaOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => NodeViewConstructor;
+export declare const lazyMediaView: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, options: import("../types").MediaPluginOptions | undefined, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => NodeViewConstructor;

package/dist/types-ts4.5/nodeviews/mediaGroup.d.ts

@@ -27,4 +27,4 @@ declare const IntlMediaGroup: React.FC<import("react-intl-next").WithIntlProps<M
     WrappedComponent: React.ComponentType<MediaGroupProps>;
 };
 export default IntlMediaGroup;
-export declare const ReactMediaGroupNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: MediaOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;
+export declare const ReactMediaGroupNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: import("../types").MediaPluginOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => NodeView;

package/dist/types-ts4.5/nodeviews/mediaNodeView/index.d.ts

@@ -8,7 +8,7 @@ import type { ExtractInjectionAPI, EditorContainerWidth as WidthPluginState } fr
 import type { Node as PMNode } from '@atlaskit/editor-prosemirror/model';
 import type { Decoration, EditorView } from '@atlaskit/editor-prosemirror/view';
 import type { MediaNextEditorPluginType } from '../../mediaPluginType';
-import type { getPosHandler, MediaOptions } from '../../types';
+import type { getPosHandler } from '../../types';
 import type { MediaNodeViewProps } from '../types';
 interface MediaNodeWithPluginStateComponentProps {
     width?: WidthPluginState;
@@ -29,5 +29,5 @@ declare class MediaNodeView extends SelectionBasedNodeView<MediaNodeViewProps> {
     renderMediaNodeWithProviders: ({ contextIdentifierProvider }: Providers) => React.JSX.Element;
     render(): React.JSX.Element;
 }
-export declare const ReactMediaNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: MediaOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => MediaNodeView;
+export declare const ReactMediaNode: (portalProviderAPI: PortalProviderAPI, eventDispatcher: EventDispatcher, providerFactory: ProviderFactory, mediaOptions: import("../../types").MediaPluginOptions | undefined, pluginInjectionApi: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => (node: PMNode, view: EditorView, getPos: getPosHandler) => MediaNodeView;
 export {};

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

@@ -15,7 +15,7 @@ interface PlaceholderTextOptions {
 export type MediaStateStatus = 'unknown' | 'ready' | 'cancelled' | 'preview' | 'error' | 'mobile-upload-end';
 export type MediaSingleWithType = 'pixel' | 'percentage';
 export type MediaCopyScope = 'editor' | 'context';
-export interface MediaOptions {
+export interface MediaPluginOptions {
     provider?: Providers['mediaProvider'];
     /**
      * @experimental
@@ -56,6 +56,12 @@ export interface MediaOptions {
     forceHandlePositioning?: HandlePositioning;
     mediaShallowCopyScope?: MediaCopyScope;
 }
+/**
+ * @private
+ * @deprecated Use {@link MediaPluginOptions} instead.
+ * @see https://product-fabric.atlassian.net/browse/ED-27496
+ */
+export type MediaOptions = MediaPluginOptions;
 export interface MediaSingleOptions {
     disableLayout?: boolean;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "2.3.21",
+	"version": "2.4.0",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -38,15 +38,15 @@
 		"@atlaskit/analytics-namespaced-context": "^7.0.0",
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/button": "^23.0.0",
-		"@atlaskit/editor-common": "^103.0.0",
+		"@atlaskit/editor-common": "^103.4.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
-		"@atlaskit/editor-plugin-annotation": "^2.2.0",
+		"@atlaskit/editor-plugin-annotation": "^2.5.0",
 		"@atlaskit/editor-plugin-connectivity": "^2.0.0",
 		"@atlaskit/editor-plugin-decorations": "^2.0.0",
 		"@atlaskit/editor-plugin-editor-disabled": "^2.0.0",
-		"@atlaskit/editor-plugin-editor-viewmode": "^3.0.0",
-		"@atlaskit/editor-plugin-floating-toolbar": "^3.3.0",
+		"@atlaskit/editor-plugin-editor-viewmode": "^3.1.0",
+		"@atlaskit/editor-plugin-floating-toolbar": "^3.6.0",
 		"@atlaskit/editor-plugin-focus": "^1.5.0",
 		"@atlaskit/editor-plugin-grid": "^2.0.0",
 		"@atlaskit/editor-plugin-guideline": "^2.0.0",
@@ -66,7 +66,7 @@
 		"@atlaskit/media-ui": "^28.1.0",
 		"@atlaskit/media-viewer": "^52.0.0",
 		"@atlaskit/platform-feature-flags": "^1.1.0",
-		"@atlaskit/primitives": "^14.3.0",
+		"@atlaskit/primitives": "^14.4.0",
 		"@atlaskit/textfield": "^8.0.0",
 		"@atlaskit/theme": "^18.0.0",
 		"@atlaskit/tmp-editor-statsig": "^4.6.0",
@@ -129,6 +129,9 @@
 		"platform_editor_react18_phase2__media_single": {
 			"type": "boolean"
 		},
+		"platform_editor_react18_phase2__media_single_jira": {
+			"type": "boolean"
+		},
 		"platform_media_cross_client_copy": {
 			"type": "boolean"
 		},
@@ -176,6 +179,9 @@
 		},
 		"platform_editor_remove_media_inline_feature_flag": {
 			"type": "boolean"
+		},
+		"platform_editor_media_single_toolbar_target": {
+			"type": "boolean"
 		}
 	},
 	"stricter": {