@atlaskit/editor-plugin-media 3.0.0 → 3.0.2

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @atlaskit/editor-plugin-media
 
+## 3.0.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 3.0.1
+
+### Patch Changes
+
+- [#150219](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/150219)
+  [`8f6e3a7613db0`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/8f6e3a7613db0) -
+  Fixes invalid css comments in template literal styles
+- [#150731](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/pull-requests/150731)
+  [`e21eb5fc3b241`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/e21eb5fc3b241) -
+  ED-27860 Fix media deleted events and update inputMethod to floatingToolbar for expands
+- Updated dependencies
+
 ## 3.0.0
 
 ### Patch Changes

package/dist/cjs/mediaPlugin.js

@@ -366,7 +366,8 @@ var mediaPlugin = exports.mediaPlugin = function mediaPlugin(_ref3) {
           fullWidthEnabled: options && options.fullWidthEnabled,
           allowMediaInlineImages: options && options.allowMediaInlineImages,
           isViewOnly: (api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'view',
-          allowPixelResizing: options === null || options === void 0 ? void 0 : options.allowPixelResizing
+          allowPixelResizing: options === null || options === void 0 ? void 0 : options.allowPixelResizing,
+          onCommentButtonMount: options === null || options === void 0 ? void 0 : options.onCommentButtonMount
         }, api);
       }
     }

package/dist/cjs/pm-plugins/pixel-resizing/ui/styles.js

@@ -11,7 +11,7 @@ var _templateObject; // eslint-disable-next-line @atlaskit/ui-styling-standard/u
 var PIXEL_SIZING_WRAPPER_MINIMUM_WIDTH = 120;
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-var pixelSizingWrapper = exports.pixelSizingWrapper = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tdisplay: grid;\n\tgrid-template-columns: 1fr 1em 1fr 0;\n\tgrid-template-rows: auto;\n\tgrid-template-areas: 'widthinput label heightinput submit';\n\twidth: ", "px;\n\ttext-align: center;\n\theight: ", ";\n\n\t// Atlaskit fieldset does not allow style override\n\t& > * {\n\t\tmargin-top: 0 !important;\n\t}\n"])), PIXEL_SIZING_WRAPPER_MINIMUM_WIDTH, "var(--ds-space-300, 24px)");
+var pixelSizingWrapper = exports.pixelSizingWrapper = (0, _react.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n\tdisplay: grid;\n\tgrid-template-columns: 1fr 1em 1fr 0;\n\tgrid-template-rows: auto;\n\tgrid-template-areas: 'widthinput label heightinput submit';\n\twidth: ", "px;\n\ttext-align: center;\n\theight: ", ";\n\n\t/* Atlaskit fieldset does not allow style override */\n\t& > * {\n\t\tmargin-top: 0 !important;\n\t}\n"])), PIXEL_SIZING_WRAPPER_MINIMUM_WIDTH, "var(--ds-space-300, 24px)");
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 var pixelEntryForm = exports.pixelEntryForm = (0, _react.css)({

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

@@ -15,7 +15,7 @@ var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _experiments = require("@atlaskit/tmp-editor-statsig/experiments");
 var _commentWithDotIcon = require("./assets/commentWithDotIcon");
 var _utils = require("./utils");
-var commentButton = exports.commentButton = function commentButton(intl, state, api) {
+var commentButton = exports.commentButton = function commentButton(intl, state, api, onCommentButtonMount) {
   var _getSelectedMediaSing, _api$annotation, _api$connectivity;
   var selectMediaNode = (_getSelectedMediaSing = (0, _utils.getSelectedMediaSingle)(state)) === null || _getSelectedMediaSing === void 0 ? void 0 : _getSelectedMediaSing.node.firstChild;
   var hasActiveComments = false;
@@ -54,6 +54,11 @@ var commentButton = exports.commentButton = function commentButton(intl, state,
       description: title
     }),
     supportsViewMode: true,
-    disabled: (api === null || api === void 0 || (_api$connectivity = api.connectivity) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.sharedState) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.currentState()) === null || _api$connectivity === void 0 ? void 0 : _api$connectivity.mode) === 'offline'
+    disabled: (api === null || api === void 0 || (_api$connectivity = api.connectivity) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.sharedState) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.currentState()) === null || _api$connectivity === void 0 ? void 0 : _api$connectivity.mode) === 'offline',
+    onMount: function onMount() {
+      if ((0, _platformFeatureFlags.fg)('confluence_frontend_preload_inline_comment_editor')) {
+        onCommentButtonMount && onCommentButtonMount();
+      }
+    }
   };
 };

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

@@ -63,10 +63,26 @@ var mediaTypeMessages = {
   archive: _mediaUi.messages.file_archive_is_selected,
   unknown: _mediaUi.messages.file_unknown_is_selected
 };
-var removeWithAnalytics = function removeWithAnalytics(editorAnalyticsApi) {
+var getMediaActionSubject = function getMediaActionSubject(nodeType) {
+  switch (nodeType.name) {
+    case 'mediaSingle':
+      return _analytics.ACTION_SUBJECT.MEDIA_SINGLE;
+    case 'mediaInline':
+      return _analytics.ACTION_SUBJECT.MEDIA_INLINE;
+    case 'mediaGroup':
+      return _analytics.ACTION_SUBJECT.MEDIA_GROUP;
+    default:
+      return _analytics.ACTION_SUBJECT.MEDIA;
+  }
+};
+var removeWithAnalytics = function removeWithAnalytics(editorAnalyticsApi, nodeType) {
+  if (!nodeType) {
+    return remove;
+  }
+  var mediaType = getMediaActionSubject(nodeType);
   return (0, _editorAnalytics.withAnalytics)(editorAnalyticsApi, {
     action: _analytics.ACTION.DELETED,
-    actionSubject: _analytics.ACTION_SUBJECT.MEDIA_SINGLE,
+    actionSubject: mediaType,
     attributes: {
       inputMethod: _analytics.INPUT_METHOD.FLOATING_TB
     },
@@ -263,7 +279,8 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     allowMediaInlineImages = options.allowMediaInlineImages,
     allowImagePreview = options.allowImagePreview,
     isViewOnly = options.isViewOnly,
-    allowPixelResizing = options.allowPixelResizing;
+    allowPixelResizing = options.allowPixelResizing,
+    onCommentButtonMount = options.onCommentButtonMount;
   var toolbarButtons = [];
   var _ref2 = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
     hoverDecoration = _ref2.hoverDecoration;
@@ -533,7 +550,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     }
     if (!isEditorControlsEnabled) {
       if (allowCommentsOnMedia) {
-        toolbarButtons.push((0, _comments.commentButton)(intl, state, pluginInjectionApi), {
+        toolbarButtons.push((0, _comments.commentButton)(intl, state, pluginInjectionApi, onCommentButtonMount), {
           type: 'separator',
           supportsViewMode: true
         });
@@ -720,7 +737,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     });
     if (allowAdvancedToolBarOptions && allowCommentsOnMedia) {
       (0, _utils2.updateToFullHeightSeparator)(toolbarButtons);
-      toolbarButtons.push((0, _comments.commentButton)(intl, state, pluginInjectionApi));
+      toolbarButtons.push((0, _comments.commentButton)(intl, state, pluginInjectionApi, onCommentButtonMount));
     }
     return toolbarButtons;
   }
@@ -862,7 +879,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
         })
       }, hoverDecorationProps(nodeType, _editorSharedStyles.akEditorSelectedNodeClassName)), _objectSpread({
         title: intl === null || intl === void 0 ? void 0 : intl.formatMessage(_messages.default.delete),
-        onClick: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_analytics_2') ? removeWithAnalytics(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a12 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a12 === void 0 ? void 0 : _pluginInjectionApi$a12.actions) : remove,
+        onClick: (0, _platformFeatureFlags.fg)('platform_editor_controls_patch_analytics_2') ? removeWithAnalytics(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a12 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a12 === void 0 ? void 0 : _pluginInjectionApi$a12.actions, selectedNodeType) : remove,
         icon: /*#__PURE__*/_react.default.createElement(_delete.default, {
           label: ""
         })

package/dist/es2019/mediaPlugin.js

@@ -361,7 +361,8 @@ export const mediaPlugin = ({
           fullWidthEnabled: options && options.fullWidthEnabled,
           allowMediaInlineImages: options && options.allowMediaInlineImages,
           isViewOnly: (api === null || api === void 0 ? void 0 : (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 ? void 0 : (_api$editorViewMode$s = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode$s === void 0 ? void 0 : _api$editorViewMode$s.mode) === 'view',
-          allowPixelResizing: options === null || options === void 0 ? void 0 : options.allowPixelResizing
+          allowPixelResizing: options === null || options === void 0 ? void 0 : options.allowPixelResizing,
+          onCommentButtonMount: options === null || options === void 0 ? void 0 : options.onCommentButtonMount
         }, api);
       }
     }

package/dist/es2019/pm-plugins/pixel-resizing/ui/styles.js

@@ -12,7 +12,7 @@ export const pixelSizingWrapper = css`
 	text-align: center;
 	height: ${"var(--ds-space-300, 24px)"};
 
-	// Atlaskit fieldset does not allow style override
+	/* Atlaskit fieldset does not allow style override */
 	& > * {
 		margin-top: 0 !important;
 	}

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

@@ -8,7 +8,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { CommentWithDotIcon } from './assets/commentWithDotIcon';
 import { getSelectedMediaSingle } from './utils';
-export const commentButton = (intl, state, api) => {
+export const commentButton = (intl, state, api, onCommentButtonMount) => {
   var _getSelectedMediaSing, _api$annotation, _api$annotation$share, _api$connectivity, _api$connectivity$sha, _api$connectivity$sha2;
   const selectMediaNode = (_getSelectedMediaSing = getSelectedMediaSingle(state)) === null || _getSelectedMediaSing === void 0 ? void 0 : _getSelectedMediaSing.node.firstChild;
   let hasActiveComments = false;
@@ -46,6 +46,11 @@ export const commentButton = (intl, state, api) => {
       description: title
     }),
     supportsViewMode: true,
-    disabled: (api === null || api === void 0 ? void 0 : (_api$connectivity = api.connectivity) === null || _api$connectivity === void 0 ? void 0 : (_api$connectivity$sha = _api$connectivity.sharedState) === null || _api$connectivity$sha === void 0 ? void 0 : (_api$connectivity$sha2 = _api$connectivity$sha.currentState()) === null || _api$connectivity$sha2 === void 0 ? void 0 : _api$connectivity$sha2.mode) === 'offline'
+    disabled: (api === null || api === void 0 ? void 0 : (_api$connectivity = api.connectivity) === null || _api$connectivity === void 0 ? void 0 : (_api$connectivity$sha = _api$connectivity.sharedState) === null || _api$connectivity$sha === void 0 ? void 0 : (_api$connectivity$sha2 = _api$connectivity$sha.currentState()) === null || _api$connectivity$sha2 === void 0 ? void 0 : _api$connectivity$sha2.mode) === 'offline',
+    onMount: () => {
+      if (fg('confluence_frontend_preload_inline_comment_editor')) {
+        onCommentButtonMount && onCommentButtonMount();
+      }
+    }
   };
 };

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

@@ -49,10 +49,26 @@ const mediaTypeMessages = {
   archive: messages.file_archive_is_selected,
   unknown: messages.file_unknown_is_selected
 };
-const removeWithAnalytics = editorAnalyticsApi => {
+const getMediaActionSubject = nodeType => {
+  switch (nodeType.name) {
+    case 'mediaSingle':
+      return ACTION_SUBJECT.MEDIA_SINGLE;
+    case 'mediaInline':
+      return ACTION_SUBJECT.MEDIA_INLINE;
+    case 'mediaGroup':
+      return ACTION_SUBJECT.MEDIA_GROUP;
+    default:
+      return ACTION_SUBJECT.MEDIA;
+  }
+};
+const removeWithAnalytics = (editorAnalyticsApi, nodeType) => {
+  if (!nodeType) {
+    return remove;
+  }
+  const mediaType = getMediaActionSubject(nodeType);
   return withAnalytics(editorAnalyticsApi, {
     action: ACTION.DELETED,
-    actionSubject: ACTION_SUBJECT.MEDIA_SINGLE,
+    actionSubject: mediaType,
     attributes: {
       inputMethod: INPUT_METHOD.FLOATING_TB
     },
@@ -250,7 +266,8 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
     allowMediaInlineImages,
     allowImagePreview,
     isViewOnly,
-    allowPixelResizing
+    allowPixelResizing,
+    onCommentButtonMount
   } = options;
   let toolbarButtons = [];
   const {
@@ -522,7 +539,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
     }
     if (!isEditorControlsEnabled) {
       if (allowCommentsOnMedia) {
-        toolbarButtons.push(commentButton(intl, state, pluginInjectionApi), {
+        toolbarButtons.push(commentButton(intl, state, pluginInjectionApi, onCommentButtonMount), {
           type: 'separator',
           supportsViewMode: true
         });
@@ -715,7 +732,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
     });
     if (allowAdvancedToolBarOptions && allowCommentsOnMedia) {
       updateToFullHeightSeparator(toolbarButtons);
-      toolbarButtons.push(commentButton(intl, state, pluginInjectionApi));
+      toolbarButtons.push(commentButton(intl, state, pluginInjectionApi, onCommentButtonMount));
     }
     return toolbarButtons;
   }
@@ -860,7 +877,7 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
         ...hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)
       }, {
         title: intl === null || intl === void 0 ? void 0 : intl.formatMessage(commonMessages.delete),
-        onClick: fg('platform_editor_controls_patch_analytics_2') ? removeWithAnalytics(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a12 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a12 === void 0 ? void 0 : _pluginInjectionApi$a12.actions) : remove,
+        onClick: fg('platform_editor_controls_patch_analytics_2') ? removeWithAnalytics(pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$a12 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a12 === void 0 ? void 0 : _pluginInjectionApi$a12.actions, selectedNodeType) : remove,
         icon: /*#__PURE__*/React.createElement(DeleteIcon, {
           label: ""
         }),

package/dist/esm/mediaPlugin.js

@@ -356,7 +356,8 @@ export var mediaPlugin = function mediaPlugin(_ref3) {
           fullWidthEnabled: options && options.fullWidthEnabled,
           allowMediaInlineImages: options && options.allowMediaInlineImages,
           isViewOnly: (api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 || (_api$editorViewMode = _api$editorViewMode.sharedState.currentState()) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.mode) === 'view',
-          allowPixelResizing: options === null || options === void 0 ? void 0 : options.allowPixelResizing
+          allowPixelResizing: options === null || options === void 0 ? void 0 : options.allowPixelResizing,
+          onCommentButtonMount: options === null || options === void 0 ? void 0 : options.onCommentButtonMount
         }, api);
       }
     }

package/dist/esm/pm-plugins/pixel-resizing/ui/styles.js

@@ -5,7 +5,7 @@ import { css } from '@emotion/react';
 var PIXEL_SIZING_WRAPPER_MINIMUM_WIDTH = 120;
 
 // eslint-disable-next-line @atlaskit/design-system/no-css-tagged-template-expression, @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
-export var pixelSizingWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tdisplay: grid;\n\tgrid-template-columns: 1fr 1em 1fr 0;\n\tgrid-template-rows: auto;\n\tgrid-template-areas: 'widthinput label heightinput submit';\n\twidth: ", "px;\n\ttext-align: center;\n\theight: ", ";\n\n\t// Atlaskit fieldset does not allow style override\n\t& > * {\n\t\tmargin-top: 0 !important;\n\t}\n"])), PIXEL_SIZING_WRAPPER_MINIMUM_WIDTH, "var(--ds-space-300, 24px)");
+export var pixelSizingWrapper = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n\tdisplay: grid;\n\tgrid-template-columns: 1fr 1em 1fr 0;\n\tgrid-template-rows: auto;\n\tgrid-template-areas: 'widthinput label heightinput submit';\n\twidth: ", "px;\n\ttext-align: center;\n\theight: ", ";\n\n\t/* Atlaskit fieldset does not allow style override */\n\t& > * {\n\t\tmargin-top: 0 !important;\n\t}\n"])), PIXEL_SIZING_WRAPPER_MINIMUM_WIDTH, "var(--ds-space-300, 24px)");
 
 // eslint-disable-next-line @atlaskit/ui-styling-standard/no-exported-styles -- Ignored via go/DSP-18766
 export var pixelEntryForm = css({

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

@@ -8,7 +8,7 @@ import { fg } from '@atlaskit/platform-feature-flags';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { CommentWithDotIcon } from './assets/commentWithDotIcon';
 import { getSelectedMediaSingle } from './utils';
-export var commentButton = function commentButton(intl, state, api) {
+export var commentButton = function commentButton(intl, state, api, onCommentButtonMount) {
   var _getSelectedMediaSing, _api$annotation, _api$connectivity;
   var selectMediaNode = (_getSelectedMediaSing = getSelectedMediaSingle(state)) === null || _getSelectedMediaSing === void 0 ? void 0 : _getSelectedMediaSing.node.firstChild;
   var hasActiveComments = false;
@@ -47,6 +47,11 @@ export var commentButton = function commentButton(intl, state, api) {
       description: title
     }),
     supportsViewMode: true,
-    disabled: (api === null || api === void 0 || (_api$connectivity = api.connectivity) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.sharedState) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.currentState()) === null || _api$connectivity === void 0 ? void 0 : _api$connectivity.mode) === 'offline'
+    disabled: (api === null || api === void 0 || (_api$connectivity = api.connectivity) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.sharedState) === null || _api$connectivity === void 0 || (_api$connectivity = _api$connectivity.currentState()) === null || _api$connectivity === void 0 ? void 0 : _api$connectivity.mode) === 'offline',
+    onMount: function onMount() {
+      if (fg('confluence_frontend_preload_inline_comment_editor')) {
+        onCommentButtonMount && onCommentButtonMount();
+      }
+    }
   };
 };

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

@@ -53,10 +53,26 @@ var mediaTypeMessages = {
   archive: messages.file_archive_is_selected,
   unknown: messages.file_unknown_is_selected
 };
-var removeWithAnalytics = function removeWithAnalytics(editorAnalyticsApi) {
+var getMediaActionSubject = function getMediaActionSubject(nodeType) {
+  switch (nodeType.name) {
+    case 'mediaSingle':
+      return ACTION_SUBJECT.MEDIA_SINGLE;
+    case 'mediaInline':
+      return ACTION_SUBJECT.MEDIA_INLINE;
+    case 'mediaGroup':
+      return ACTION_SUBJECT.MEDIA_GROUP;
+    default:
+      return ACTION_SUBJECT.MEDIA;
+  }
+};
+var removeWithAnalytics = function removeWithAnalytics(editorAnalyticsApi, nodeType) {
+  if (!nodeType) {
+    return remove;
+  }
+  var mediaType = getMediaActionSubject(nodeType);
   return withAnalytics(editorAnalyticsApi, {
     action: ACTION.DELETED,
-    actionSubject: ACTION_SUBJECT.MEDIA_SINGLE,
+    actionSubject: mediaType,
     attributes: {
       inputMethod: INPUT_METHOD.FLOATING_TB
     },
@@ -253,7 +269,8 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     allowMediaInlineImages = options.allowMediaInlineImages,
     allowImagePreview = options.allowImagePreview,
     isViewOnly = options.isViewOnly,
-    allowPixelResizing = options.allowPixelResizing;
+    allowPixelResizing = options.allowPixelResizing,
+    onCommentButtonMount = options.onCommentButtonMount;
   var toolbarButtons = [];
   var _ref2 = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
     hoverDecoration = _ref2.hoverDecoration;
@@ -523,7 +540,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     }
     if (!isEditorControlsEnabled) {
       if (allowCommentsOnMedia) {
-        toolbarButtons.push(commentButton(intl, state, pluginInjectionApi), {
+        toolbarButtons.push(commentButton(intl, state, pluginInjectionApi, onCommentButtonMount), {
           type: 'separator',
           supportsViewMode: true
         });
@@ -710,7 +727,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     });
     if (allowAdvancedToolBarOptions && allowCommentsOnMedia) {
       updateToFullHeightSeparator(toolbarButtons);
-      toolbarButtons.push(commentButton(intl, state, pluginInjectionApi));
+      toolbarButtons.push(commentButton(intl, state, pluginInjectionApi, onCommentButtonMount));
     }
     return toolbarButtons;
   }
@@ -852,7 +869,7 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
         })
       }, hoverDecorationProps(nodeType, akEditorSelectedNodeClassName)), _objectSpread({
         title: intl === null || intl === void 0 ? void 0 : intl.formatMessage(commonMessages.delete),
-        onClick: fg('platform_editor_controls_patch_analytics_2') ? removeWithAnalytics(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a12 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a12 === void 0 ? void 0 : _pluginInjectionApi$a12.actions) : remove,
+        onClick: fg('platform_editor_controls_patch_analytics_2') ? removeWithAnalytics(pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$a12 = pluginInjectionApi.analytics) === null || _pluginInjectionApi$a12 === void 0 ? void 0 : _pluginInjectionApi$a12.actions, selectedNodeType) : remove,
         icon: /*#__PURE__*/React.createElement(DeleteIcon, {
           label: ""
         })

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

@@ -74,6 +74,7 @@ export interface MediaPluginOptions {
      * ```
      */
     isExternalMediaUploadDisabled?: boolean;
+    onCommentButtonMount?: () => void;
 }
 /**
  * @private
@@ -145,6 +146,7 @@ export type MediaFloatingToolbarOptions = {
     allowCommentsOnMedia?: boolean;
     isViewOnly?: boolean;
     allowPixelResizing?: boolean;
+    onCommentButtonMount?: () => void;
 };
 export type MediaDecorationSpec = {
     type: 'media';

package/dist/types/ui/toolbar/comments.d.ts

@@ -2,4 +2,4 @@ import type { IntlShape } from 'react-intl-next';
 import type { Command, ExtractInjectionAPI, FloatingToolbarButton } from '@atlaskit/editor-common/types';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 import type { MediaNextEditorPluginType } from '../../mediaPluginType';
-export declare const commentButton: (intl: IntlShape, state: EditorState, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => FloatingToolbarButton<Command>;
+export declare const commentButton: (intl: IntlShape, state: EditorState, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, onCommentButtonMount?: () => void) => FloatingToolbarButton<Command>;

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

@@ -74,6 +74,7 @@ export interface MediaPluginOptions {
      * ```
      */
     isExternalMediaUploadDisabled?: boolean;
+    onCommentButtonMount?: () => void;
 }
 /**
  * @private
@@ -145,6 +146,7 @@ export type MediaFloatingToolbarOptions = {
     allowCommentsOnMedia?: boolean;
     isViewOnly?: boolean;
     allowPixelResizing?: boolean;
+    onCommentButtonMount?: () => void;
 };
 export type MediaDecorationSpec = {
     type: 'media';

package/dist/types-ts4.5/ui/toolbar/comments.d.ts

@@ -2,4 +2,4 @@ import type { IntlShape } from 'react-intl-next';
 import type { Command, ExtractInjectionAPI, FloatingToolbarButton } from '@atlaskit/editor-common/types';
 import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 import type { MediaNextEditorPluginType } from '../../mediaPluginType';
-export declare const commentButton: (intl: IntlShape, state: EditorState, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined) => FloatingToolbarButton<Command>;
+export declare const commentButton: (intl: IntlShape, state: EditorState, api: ExtractInjectionAPI<MediaNextEditorPluginType> | undefined, onCommentButtonMount?: () => void) => FloatingToolbarButton<Command>;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-media",
-	"version": "3.0.0",
+	"version": "3.0.2",
 	"description": "Media plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -38,7 +38,7 @@
 		"@atlaskit/analytics-namespaced-context": "^7.0.0",
 		"@atlaskit/analytics-next": "^11.0.0",
 		"@atlaskit/button": "^23.0.0",
-		"@atlaskit/editor-common": "^104.0.0",
+		"@atlaskit/editor-common": "^104.1.0",
 		"@atlaskit/editor-palette": "^2.1.0",
 		"@atlaskit/editor-plugin-analytics": "^2.2.0",
 		"@atlaskit/editor-plugin-annotation": "^2.7.0",
@@ -57,7 +57,7 @@
 		"@atlaskit/editor-shared-styles": "^3.4.0",
 		"@atlaskit/editor-tables": "^2.9.0",
 		"@atlaskit/form": "^12.0.0",
-		"@atlaskit/icon": "^25.6.0",
+		"@atlaskit/icon": "^26.0.0",
 		"@atlaskit/media-card": "^79.2.0",
 		"@atlaskit/media-client": "^33.0.0",
 		"@atlaskit/media-client-react": "^4.0.0",
@@ -70,7 +70,7 @@
 		"@atlaskit/primitives": "^14.7.0",
 		"@atlaskit/textfield": "^8.0.0",
 		"@atlaskit/theme": "^18.0.0",
-		"@atlaskit/tmp-editor-statsig": "^4.16.0",
+		"@atlaskit/tmp-editor-statsig": "^4.19.0",
 		"@atlaskit/tokens": "^4.8.0",
 		"@atlaskit/tooltip": "^20.0.0",
 		"@babel/runtime": "^7.0.0",
@@ -195,6 +195,9 @@
 		},
 		"platform_editor_controls_patch_analytics_2": {
 			"type": "boolean"
+		},
+		"confluence_frontend_preload_inline_comment_editor": {
+			"type": "boolean"
 		}
 	},
 	"stricter": {