@atlaskit/editor-plugin-media 0.11.2 → 0.11.4

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/editor-plugin-media
 
+## 0.11.4
+
+### Patch Changes
+
+- [#67238](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67238) [`40533849b2ec`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/40533849b2ec) - [ED-21835] Change EditorAPI type to always union with undefined
+
+## 0.11.3
+
+### Patch Changes
+
+- [#66631](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/66631) [`c1d10d6c2013`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/c1d10d6c2013) - Updated alt text analytics to log additional attributes
+- [#67194](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/67194) [`37379761475c`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/37379761475c) - [ED-21806] Skip changes from NCS and tinted transactions.
+
 ## 0.11.2
 
 ### Patch Changes

package/dist/cjs/commands/helpers.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.updateMediaSingleNodeAttrs = exports.updateCurrentMediaNodeAttrs = exports.updateAllMediaSingleNodesAttrs = exports.replaceExternalMedia = exports.isMediaNode = exports.findMediaSingleNode = exports.findAllMediaSingleNodes = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _steps = require("@atlaskit/adf-schema/steps");
+var _collab = require("@atlaskit/editor-common/collab");
 var _pluginKey = require("../pm-plugins/plugin-key");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
@@ -65,6 +66,7 @@ var updateAllMediaSingleNodesAttrs = exports.updateAllMediaSingleNodesAttrs = fu
       return tr.step(new _steps.SetAttrsStep(pos, attrs));
     });
     tr.setMeta('addToHistory', false);
+    (0, _collab.tintDirtyTransaction)(tr);
     if (dispatch) {
       dispatch(tr);
     }

package/dist/cjs/nodeviews/mediaSingle.js

@@ -372,7 +372,7 @@ var MediaSingleNode = exports.default = /*#__PURE__*/function (_Component) {
         height = _mediaSingle.DEFAULT_IMAGE_HEIGHT;
       }
       var isSelected = selected();
-      var currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth : undefined;
+      var currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 || (_pluginInjectionApi$m = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth : undefined;
       var contentWidthForLegacyExperience = (0, _mediaSingle.getMaxWidthForNestedNode)(view, getPos()) || lineLength;
       var contentWidth = currentMaxWidth || lineLength;
       var mediaSingleProps = {

package/dist/cjs/plugin.js

@@ -146,9 +146,9 @@ var mediaPlugin = exports.mediaPlugin = function mediaPlugin(_ref2) {
       }, {
         name: 'mediaKeymap',
         plugin: function plugin(_ref5) {
-          var _api$analytics2;
+          var _api$analytics2, _api$selection;
           var getIntl = _ref5.getIntl;
-          return (0, _keymap2.default)(options, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, api === null || api === void 0 ? void 0 : api.selection.actions, api === null || api === void 0 ? void 0 : api.width, getIntl);
+          return (0, _keymap2.default)(options, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.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) {

package/dist/cjs/pm-plugins/alt-text/commands.js

@@ -9,17 +9,26 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _editorAnalytics = require("@atlaskit/editor-common/editor-analytics");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _commands = require("../../toolbar/commands");
 var _mediaCommon = require("../../utils/media-common");
 var _index = require("./index");
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var createCommandWithAnalytics = function createCommandWithAnalytics(actionType, action, transform) {
   return function (editorAnalyticsAPI) {
-    return (0, _editorAnalytics.withAnalytics)(editorAnalyticsAPI, {
-      action: actionType,
-      actionSubject: _analytics.ACTION_SUBJECT.MEDIA,
-      actionSubjectId: _analytics.ACTION_SUBJECT_ID.ALT_TEXT,
-      eventType: _analytics.EVENT_TYPE.TRACK
+    return (0, _editorAnalytics.withAnalytics)(editorAnalyticsAPI, function (state) {
+      var mediaNode = (0, _mediaCommon.getMediaSingleOrInlineNodeFromSelection)(state);
+      var type = (0, _commands.getNodeType)(state);
+      return {
+        action: actionType,
+        actionSubject: _analytics.ACTION_SUBJECT.MEDIA,
+        actionSubjectId: _analytics.ACTION_SUBJECT_ID.ALT_TEXT,
+        eventType: _analytics.EVENT_TYPE.TRACK,
+        attributes: {
+          type: type,
+          mediaType: mediaNode.attrs.type
+        }
+      };
     })((0, _index.createCommand)(action, transform));
   };
 };

package/dist/cjs/pm-plugins/alt-text/ui/AltTextEdit.js

@@ -114,13 +114,13 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       this.fireAnalytics(_analytics.ACTION.CLOSED);
-      if (!this.prevValue && this.props.value) {
+      if (!this.prevValue && this.state.lastValue) {
         this.fireAnalytics(_analytics.ACTION.ADDED);
       }
-      if (this.prevValue && !this.props.value) {
+      if (this.prevValue && !this.state.lastValue) {
         this.fireAnalytics(_analytics.ACTION.CLEARED);
       }
-      if (this.prevValue && this.prevValue !== this.props.value) {
+      if (this.prevValue && this.prevValue !== this.state.lastValue) {
         this.fireAnalytics(_analytics.ACTION.EDITED);
       }
     }
@@ -202,14 +202,21 @@ var AltTextEditComponent = exports.AltTextEditComponent = /*#__PURE__*/function
   }, {
     key: "fireAnalytics",
     value: function fireAnalytics(actionType) {
-      var createAnalyticsEvent = this.props.createAnalyticsEvent;
+      var _this$props2 = this.props,
+        createAnalyticsEvent = _this$props2.createAnalyticsEvent,
+        nodeType = _this$props2.nodeType,
+        mediaType = _this$props2.mediaType;
       if (createAnalyticsEvent && this.fireCustomAnalytics) {
         this.fireCustomAnalytics({
           payload: {
             action: actionType,
             actionSubject: _analytics.ACTION_SUBJECT.MEDIA,
             actionSubjectId: _analytics.ACTION_SUBJECT_ID.ALT_TEXT,
-            eventType: _analytics.EVENT_TYPE.TRACK
+            eventType: _analytics.EVENT_TYPE.TRACK,
+            attributes: {
+              type: nodeType,
+              mediaType: mediaType
+            }
           }
         });
       }

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

@@ -248,7 +248,7 @@ var MediaPluginStateImplementation = exports.MediaPluginStateImplementation = /*
           break;
         case 'block':
           // read width state right before inserting to get up-to-date and define values
-          var widthPluginState = (_this$pluginInjection2 = _this.pluginInjectionApi) === null || _this$pluginInjection2 === void 0 ? void 0 : _this$pluginInjection2.width.sharedState.currentState();
+          var widthPluginState = (_this$pluginInjection2 = _this.pluginInjectionApi) === null || _this$pluginInjection2 === void 0 || (_this$pluginInjection2 = _this$pluginInjection2.width) === null || _this$pluginInjection2 === void 0 ? void 0 : _this$pluginInjection2.sharedState.currentState();
           (0, _mediaSingle2.insertMediaSingleNode)(_this.view, mediaStateWithContext, _this.getInputMethod(pickerType), collection, _this.mediaOptions && _this.mediaOptions.alignLeftOnInsert, _this.newInsertionBehaviour, widthPluginState, editorAnalyticsAPI);
           break;
         case 'group':

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

@@ -14,6 +14,7 @@ var _commands = require("../pm-plugins/alt-text/commands");
 var _messages = require("../pm-plugins/alt-text/messages");
 var _AltTextEdit = _interopRequireWildcard(require("../pm-plugins/alt-text/ui/AltTextEdit"));
 var _mediaCommon = require("../utils/media-common");
+var _commands2 = require("./commands");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
@@ -62,9 +63,12 @@ var altTextEditComponent = exports.altTextEditComponent = function altTextEditCo
           dispatch(newTr);
         }
       };
+      var type = (0, _commands2.getNodeType)(state);
       return /*#__PURE__*/_react.default.createElement(_AltTextEdit.default, {
         view: view,
         key: idx,
+        nodeType: type,
+        mediaType: mediaNode.attrs.type,
         value: mediaNode.attrs.alt,
         altTextValidator: options && options.altTextValidator,
         onEscape: handleEsc

package/dist/cjs/toolbar/commands.js

@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.updateMediaSingleWidth = exports.toggleBorderMark = exports.setBorderMark = exports.removeInlineCard = exports.changeMediaSingleToMediaInline = exports.changeMediaInlineToMediaSingle = exports.changeMediaCardToInline = exports.changeInlineToMediaCard = exports.DEFAULT_BORDER_SIZE = exports.DEFAULT_BORDER_COLOR = void 0;
+exports.updateMediaSingleWidth = exports.toggleBorderMark = exports.setBorderMark = exports.removeInlineCard = exports.getNodeType = exports.changeMediaSingleToMediaInline = exports.changeMediaInlineToMediaSingle = exports.changeMediaCardToInline = exports.changeInlineToMediaCard = exports.DEFAULT_BORDER_SIZE = exports.DEFAULT_BORDER_COLOR = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _model = require("@atlaskit/editor-prosemirror/model");
@@ -20,7 +20,7 @@ function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbol
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 var DEFAULT_BORDER_COLOR = exports.DEFAULT_BORDER_COLOR = '#091e4224';
 var DEFAULT_BORDER_SIZE = exports.DEFAULT_BORDER_SIZE = 2;
-var getNodeType = function getNodeType(state) {
+var getNodeType = exports.getNodeType = function getNodeType(state) {
   var _state$schema$nodes = state.schema.nodes,
     mediaSingle = _state$schema$nodes.mediaSingle,
     mediaInline = _state$schema$nodes.mediaInline;

package/dist/cjs/toolbar/index.js

@@ -166,7 +166,7 @@ var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar
   return items;
 };
 var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToolbar(state, intl, options, pluginState, mediaLinkingState, pluginInjectionApi, getEditorFeatureFlags) {
-  var _pluginInjectionApi$d;
+  var _pluginInjectionApi$d, _pluginInjectionApi$d2;
   var mediaSingle = state.schema.nodes.mediaSingle;
   var allowResizing = options.allowResizing,
     allowLinking = options.allowLinking,
@@ -174,7 +174,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     allowResizingInTables = options.allowResizingInTables,
     allowAltTextOnImages = options.allowAltTextOnImages;
   var toolbarButtons = [];
-  var _ref = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.decorations.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
+  var _ref = (_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 = _ref.hoverDecoration;
   if ((0, _imageBorder.shouldShowImageBorder)(state)) {
     toolbarButtons.push({
@@ -326,7 +326,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
           var _selectedMediaNode$at = selectedMediaNode.attrs,
             mediaWidth = _selectedMediaNode$at.width,
             mediaHeight = _selectedMediaNode$at.height;
-          var maxWidthForNestedNode = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth;
+          var maxWidthForNestedNode = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 || (_pluginInjectionApi$m = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth;
           var maxWidth = maxWidthForNestedNode || _editorSharedStyles.akEditorFullWidthLayoutWidth;
           var isVideoFile = (0, _mediaSingle2.isVideo)(selectedMediaNode.attrs.__fileMimeType);
           var minWidth = (0, _mediaSingle.calcMinWidth)(isVideoFile, maxWidthForNestedNode || contentWidth);
@@ -482,7 +482,7 @@ var getMediaTypeMessage = function getMediaTypeMessage(selectedNodeTypeSingle) {
   return mediaType ? mediaTypeMessages[mediaType] : _mediaUi.messages.file_unknown_is_selected;
 };
 var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state, intl) {
-  var _pluginInjectionApi$d2;
+  var _pluginInjectionApi$d3, _pluginInjectionApi$d4;
   var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   var pluginInjectionApi = arguments.length > 3 ? arguments[3] : undefined;
   var _state$schema$nodes = state.schema.nodes,
@@ -499,7 +499,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
     getEditorFeatureFlags = options.getEditorFeatureFlags;
   var mediaPluginState = _pluginKey.stateKey.getState(state);
   var mediaLinkingState = (0, _linking2.getMediaLinkingState)(state);
-  var _ref3 = (_pluginInjectionApi$d2 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.decorations.actions) !== null && _pluginInjectionApi$d2 !== void 0 ? _pluginInjectionApi$d2 : {},
+  var _ref3 = (_pluginInjectionApi$d3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d4 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d4 === void 0 ? void 0 : _pluginInjectionApi$d4.actions) !== null && _pluginInjectionApi$d3 !== void 0 ? _pluginInjectionApi$d3 : {},
     hoverDecoration = _ref3.hoverDecoration;
   if (!mediaPluginState) {
     return;
@@ -524,7 +524,7 @@ var floatingToolbar = exports.floatingToolbar = function floatingToolbar(state,
       var _pluginInjectionApi$f;
       return (0, _altText2.getAltTextToolbar)(baseToolbar, {
         altTextValidator: altTextValidator,
-        forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
+        forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
       });
     }
   }

package/dist/cjs/toolbar/linking.js

@@ -78,7 +78,7 @@ var getLinkingToolbar = exports.getLinkingToolbar = function getLinkingToolbar(t
                  */
                 var tr = view.state.tr,
                   dispatch = view.dispatch;
-                pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 || _pluginInjectionApi$f.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
+                pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 || _pluginInjectionApi$f.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
                 dispatch(tr);
               },
               onSubmit: function onSubmit(href, meta) {

package/dist/es2019/commands/helpers.js

@@ -1,4 +1,5 @@
 import { SetAttrsStep } from '@atlaskit/adf-schema/steps';
+import { tintDirtyTransaction } from '@atlaskit/editor-common/collab';
 import { stateKey as mediaPluginKey } from '../pm-plugins/plugin-key';
 /**
  * Note that Media Inline is inserted like a media single node into the media plugin state.
@@ -57,6 +58,7 @@ export const updateAllMediaSingleNodesAttrs = (id, attrs) => (state, dispatch) =
   const tr = state.tr;
   validMediaNodePositions.forEach(pos => tr.step(new SetAttrsStep(pos, attrs)));
   tr.setMeta('addToHistory', false);
+  tintDirtyTransaction(tr);
   if (dispatch) {
     dispatch(tr);
   }

package/dist/es2019/nodeviews/mediaSingle.js

@@ -225,7 +225,7 @@ export default class MediaSingleNode extends Component {
     });
   }
   render() {
-    var _pluginInjectionApi$m;
+    var _pluginInjectionApi$m, _pluginInjectionApi$m2;
     const {
       selected,
       getPos,
@@ -282,7 +282,7 @@ export default class MediaSingleNode extends Component {
       height = DEFAULT_IMAGE_HEIGHT;
     }
     const isSelected = selected();
-    const currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$m = pluginInjectionApi.media.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth : undefined;
+    const currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 ? void 0 : (_pluginInjectionApi$m2 = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m2 === void 0 ? void 0 : _pluginInjectionApi$m2.currentMaxWidth : undefined;
     const contentWidthForLegacyExperience = getMaxWidthForNestedNode(view, getPos()) || lineLength;
     const contentWidth = currentMaxWidth || lineLength;
     const mediaSingleProps = {

package/dist/es2019/plugin.js

@@ -139,8 +139,8 @@ export const mediaPlugin = ({
         plugin: ({
           getIntl
         }) => {
-          var _api$analytics2;
-          return keymapPlugin(options, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, api === null || api === void 0 ? void 0 : api.selection.actions, api === null || api === void 0 ? void 0 : api.width, getIntl);
+          var _api$analytics2, _api$selection;
+          return keymapPlugin(options, api === null || api === void 0 ? void 0 : (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, api === null || api === void 0 ? 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) {

package/dist/es2019/pm-plugins/alt-text/commands.js

@@ -1,15 +1,26 @@
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { getNodeType } from '../../toolbar/commands';
 import { getMediaSingleOrInlineNodeFromSelection, isMediaSingleOrInlineNodeSelected } from '../../utils/media-common';
 import { createCommand } from './index';
 const createCommandWithAnalytics = (actionType, action, transform) => {
-  return editorAnalyticsAPI => withAnalytics(editorAnalyticsAPI, {
-    action: actionType,
-    actionSubject: ACTION_SUBJECT.MEDIA,
-    actionSubjectId: ACTION_SUBJECT_ID.ALT_TEXT,
-    eventType: EVENT_TYPE.TRACK
-  })(createCommand(action, transform));
+  return editorAnalyticsAPI => {
+    return withAnalytics(editorAnalyticsAPI, state => {
+      const mediaNode = getMediaSingleOrInlineNodeFromSelection(state);
+      const type = getNodeType(state);
+      return {
+        action: actionType,
+        actionSubject: ACTION_SUBJECT.MEDIA,
+        actionSubjectId: ACTION_SUBJECT_ID.ALT_TEXT,
+        eventType: EVENT_TYPE.TRACK,
+        attributes: {
+          type,
+          mediaType: mediaNode.attrs.type
+        }
+      };
+    })(createCommand(action, transform));
+  };
 };
 
 // pass in undefined to close the alt text menu without saving

package/dist/es2019/pm-plugins/alt-text/ui/AltTextEdit.js

@@ -124,13 +124,13 @@ export class AltTextEditComponent extends React.Component {
   }
   componentWillUnmount() {
     this.fireAnalytics(ACTION.CLOSED);
-    if (!this.prevValue && this.props.value) {
+    if (!this.prevValue && this.state.lastValue) {
       this.fireAnalytics(ACTION.ADDED);
     }
-    if (this.prevValue && !this.props.value) {
+    if (this.prevValue && !this.state.lastValue) {
       this.fireAnalytics(ACTION.CLEARED);
     }
-    if (this.prevValue && this.prevValue !== this.props.value) {
+    if (this.prevValue && this.prevValue !== this.state.lastValue) {
       this.fireAnalytics(ACTION.EDITED);
     }
   }
@@ -215,7 +215,9 @@ export class AltTextEditComponent extends React.Component {
   }
   fireAnalytics(actionType) {
     const {
-      createAnalyticsEvent
+      createAnalyticsEvent,
+      nodeType,
+      mediaType
     } = this.props;
     if (createAnalyticsEvent && this.fireCustomAnalytics) {
       this.fireCustomAnalytics({
@@ -223,7 +225,11 @@ export class AltTextEditComponent extends React.Component {
           action: actionType,
           actionSubject: ACTION_SUBJECT.MEDIA,
           actionSubjectId: ACTION_SUBJECT_ID.ALT_TEXT,
-          eventType: EVENT_TYPE.TRACK
+          eventType: EVENT_TYPE.TRACK,
+          attributes: {
+            type: nodeType,
+            mediaType
+          }
         }
       });
     }

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

@@ -153,7 +153,7 @@ export class MediaPluginStateImplementation {
      * called when we insert a new file via the picker (connected via pickerfacade)
      */
     _defineProperty(this, "insertFile", (mediaState, onMediaStateChanged, pickerType) => {
-      var _this$pluginInjection, _this$pluginInjection2, _mediaState$collectio, _this$mediaOptions2, _this$pluginInjection3;
+      var _this$pluginInjection, _this$pluginInjection2, _mediaState$collectio, _this$mediaOptions2, _this$pluginInjection3, _this$pluginInjection4;
       const {
         state
       } = this.view;
@@ -179,7 +179,7 @@ export class MediaPluginStateImplementation {
           break;
         case 'block':
           // read width state right before inserting to get up-to-date and define values
-          const widthPluginState = (_this$pluginInjection3 = this.pluginInjectionApi) === null || _this$pluginInjection3 === void 0 ? void 0 : _this$pluginInjection3.width.sharedState.currentState();
+          const widthPluginState = (_this$pluginInjection3 = this.pluginInjectionApi) === null || _this$pluginInjection3 === void 0 ? void 0 : (_this$pluginInjection4 = _this$pluginInjection3.width) === null || _this$pluginInjection4 === void 0 ? void 0 : _this$pluginInjection4.sharedState.currentState();
           insertMediaSingleNode(this.view, mediaStateWithContext, this.getInputMethod(pickerType), collection, this.mediaOptions && this.mediaOptions.alignLeftOnInsert, this.newInsertionBehaviour, widthPluginState, editorAnalyticsAPI);
           break;
         case 'group':

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

@@ -5,6 +5,7 @@ import { openMediaAltTextMenu } from '../pm-plugins/alt-text/commands';
 import { messages } from '../pm-plugins/alt-text/messages';
 import AltTextEdit, { CONTAINER_WIDTH_IN_PX } from '../pm-plugins/alt-text/ui/AltTextEdit';
 import { getMediaSingleOrInlineNodeFromSelection } from '../utils/media-common';
+import { getNodeType } from './commands';
 const testId = 'alt-text-edit-button';
 export const altTextButton = (intl, state, editorAnalyticsAPI) => {
   const mediaNode = getMediaSingleOrInlineNodeFromSelection(state);
@@ -53,9 +54,12 @@ export const altTextEditComponent = options => {
           dispatch(newTr);
         }
       };
+      const type = getNodeType(state);
       return /*#__PURE__*/React.createElement(AltTextEdit, {
         view: view,
         key: idx,
+        nodeType: type,
+        mediaType: mediaNode.attrs.type,
         value: mediaNode.attrs.alt,
         altTextValidator: options && options.altTextValidator,
         onEscape: handleEsc

package/dist/es2019/toolbar/commands.js

@@ -10,7 +10,7 @@ import { changeFromMediaInlineToMediaSingleNode } from '../utils/media-single';
 import { getSelectedMediaSingle, removeMediaGroupNode } from './utils';
 export const DEFAULT_BORDER_COLOR = '#091e4224';
 export const DEFAULT_BORDER_SIZE = 2;
-const getNodeType = state => {
+export const getNodeType = state => {
   const {
     mediaSingle,
     mediaInline

package/dist/es2019/toolbar/index.js

@@ -152,7 +152,7 @@ const generateMediaCardFloatingToolbar = (state, intl, mediaPluginState, hoverDe
   return items;
 };
 const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, mediaLinkingState, pluginInjectionApi, getEditorFeatureFlags) => {
-  var _pluginInjectionApi$d;
+  var _pluginInjectionApi$d, _pluginInjectionApi$d2;
   const {
     mediaSingle
   } = state.schema.nodes;
@@ -166,7 +166,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
   let toolbarButtons = [];
   const {
     hoverDecoration
-  } = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.decorations.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {};
+  } = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d2 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d2 === void 0 ? void 0 : _pluginInjectionApi$d2.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {};
   if (shouldShowImageBorder(state)) {
     toolbarButtons.push({
       type: 'custom',
@@ -299,7 +299,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
         type: 'custom',
         fallback: [],
         render: editorView => {
-          var _widthPlugin$sharedSt2, _pluginInjectionApi$m;
+          var _widthPlugin$sharedSt2, _pluginInjectionApi$m, _pluginInjectionApi$m2;
           if (!editorView || !selectedMediaSingleNode) {
             return null;
           }
@@ -321,7 +321,7 @@ const generateMediaSingleFloatingToolbar = (state, intl, options, pluginState, m
             width: mediaWidth,
             height: mediaHeight
           } = selectedMediaNode.attrs;
-          const maxWidthForNestedNode = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$m = pluginInjectionApi.media.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth;
+          const maxWidthForNestedNode = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 ? void 0 : (_pluginInjectionApi$m2 = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m2 === void 0 ? void 0 : _pluginInjectionApi$m2.currentMaxWidth;
           const maxWidth = maxWidthForNestedNode || akEditorFullWidthLayoutWidth;
           const isVideoFile = isVideo(selectedMediaNode.attrs.__fileMimeType);
           const minWidth = calcMinWidth(isVideoFile, maxWidthForNestedNode || contentWidth);
@@ -483,7 +483,7 @@ const getMediaTypeMessage = selectedNodeTypeSingle => {
   return mediaType ? mediaTypeMessages[mediaType] : messages.file_unknown_is_selected;
 };
 export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) => {
-  var _pluginInjectionApi$d2;
+  var _pluginInjectionApi$d3, _pluginInjectionApi$d4;
   const {
     media,
     mediaInline,
@@ -503,7 +503,7 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
   const mediaLinkingState = getMediaLinkingState(state);
   const {
     hoverDecoration
-  } = (_pluginInjectionApi$d2 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.decorations.actions) !== null && _pluginInjectionApi$d2 !== void 0 ? _pluginInjectionApi$d2 : {};
+  } = (_pluginInjectionApi$d3 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$d4 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d4 === void 0 ? void 0 : _pluginInjectionApi$d4.actions) !== null && _pluginInjectionApi$d3 !== void 0 ? _pluginInjectionApi$d3 : {};
   if (!mediaPluginState) {
     return;
   }
@@ -522,10 +522,10 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
   if (allowAltTextOnImages) {
     const mediaAltTextPluginState = getMediaAltTextPluginState(state);
     if (mediaAltTextPluginState.isAltTextEditorOpen) {
-      var _pluginInjectionApi$f;
+      var _pluginInjectionApi$f, _pluginInjectionApi$f2;
       return getAltTextToolbar(baseToolbar, {
         altTextValidator,
-        forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
+        forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 ? void 0 : (_pluginInjectionApi$f2 = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector
       });
     }
   }
@@ -536,14 +536,14 @@ export const floatingToolbar = (state, intl, options = {}, pluginInjectionApi) =
     selectedNodeType = state.selection.node.type;
   }
   if (allowMediaInline && (parentMediaGroupNode === null || parentMediaGroupNode === void 0 ? void 0 : parentMediaGroupNode.node.type) === mediaGroup) {
-    var _pluginInjectionApi$a8, _pluginInjectionApi$f2, _pluginInjectionApi$f3;
+    var _pluginInjectionApi$a8, _pluginInjectionApi$f3, _pluginInjectionApi$f4;
     const mediaOffset = state.selection.$from.parentOffset + 1;
     baseToolbar.getDomRef = () => {
       var _mediaPluginState$ele;
       const selector = mediaFilmstripItemDOMSelector(mediaOffset);
       return (_mediaPluginState$ele = mediaPluginState.element) === null || _mediaPluginState$ele === void 0 ? void 0 : _mediaPluginState$ele.querySelector(selector);
     };
-    items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, 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$f2 = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : (_pluginInjectionApi$f3 = _pluginInjectionApi$f2.actions) === null || _pluginInjectionApi$f3 === void 0 ? void 0 : _pluginInjectionApi$f3.forceFocusSelector);
+    items = generateMediaCardFloatingToolbar(state, intl, mediaPluginState, hoverDecoration, 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);
   } else if (allowMediaInline && selectedNodeType && selectedNodeType === mediaInline) {
     baseToolbar.getDomRef = () => {
       var _mediaPluginState$ele2;

package/dist/es2019/toolbar/linking.js

@@ -68,7 +68,7 @@ export const getLinkingToolbar = (toolbarBaseConfig, mediaLinkingState, state, i
                 hideLinkingToolbar(view.state, view.dispatch, view);
               },
               onCancel: () => {
-                var _pluginInjectionApi$f;
+                var _pluginInjectionApi$f, _pluginInjectionApi$f2;
                 hideLinkingToolbar(view.state, view.dispatch, view, true);
                 /** Focus should move to the 'Add link' button when the toolbar closes
                  * and not close the floating toolbar.
@@ -79,7 +79,7 @@ export const getLinkingToolbar = (toolbarBaseConfig, mediaLinkingState, state, i
                   },
                   dispatch
                 } = view;
-                pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
+                pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 ? void 0 : (_pluginInjectionApi$f2 = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f2 === void 0 ? void 0 : _pluginInjectionApi$f2.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
                 dispatch(tr);
               },
               onSubmit: (href, meta) => {

package/dist/esm/commands/helpers.js

@@ -2,6 +2,7 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 import { SetAttrsStep } from '@atlaskit/adf-schema/steps';
+import { tintDirtyTransaction } from '@atlaskit/editor-common/collab';
 import { stateKey as mediaPluginKey } from '../pm-plugins/plugin-key';
 /**
  * Note that Media Inline is inserted like a media single node into the media plugin state.
@@ -58,6 +59,7 @@ export var updateAllMediaSingleNodesAttrs = function updateAllMediaSingleNodesAt
       return tr.step(new SetAttrsStep(pos, attrs));
     });
     tr.setMeta('addToHistory', false);
+    tintDirtyTransaction(tr);
     if (dispatch) {
       dispatch(tr);
     }

package/dist/esm/nodeviews/mediaSingle.js

@@ -364,7 +364,7 @@ var MediaSingleNode = /*#__PURE__*/function (_Component) {
         height = DEFAULT_IMAGE_HEIGHT;
       }
       var isSelected = selected();
-      var currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth : undefined;
+      var currentMaxWidth = isSelected ? pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 || (_pluginInjectionApi$m = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth : undefined;
       var contentWidthForLegacyExperience = getMaxWidthForNestedNode(view, getPos()) || lineLength;
       var contentWidth = currentMaxWidth || lineLength;
       var mediaSingleProps = {

package/dist/esm/plugin.js

@@ -135,9 +135,9 @@ export var mediaPlugin = function mediaPlugin(_ref2) {
       }, {
         name: 'mediaKeymap',
         plugin: function plugin(_ref5) {
-          var _api$analytics2;
+          var _api$analytics2, _api$selection;
           var getIntl = _ref5.getIntl;
-          return keymapPlugin(options, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.actions, api === null || api === void 0 ? void 0 : api.selection.actions, api === null || api === void 0 ? void 0 : api.width, getIntl);
+          return keymapPlugin(options, api === null || api === void 0 || (_api$analytics2 = api.analytics) === null || _api$analytics2 === void 0 ? void 0 : _api$analytics2.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) {

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

@@ -4,15 +4,24 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
 import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE } from '@atlaskit/editor-common/analytics';
 import { withAnalytics } from '@atlaskit/editor-common/editor-analytics';
 import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
+import { getNodeType } from '../../toolbar/commands';
 import { getMediaSingleOrInlineNodeFromSelection, isMediaSingleOrInlineNodeSelected } from '../../utils/media-common';
 import { createCommand } from './index';
 var createCommandWithAnalytics = function createCommandWithAnalytics(actionType, action, transform) {
   return function (editorAnalyticsAPI) {
-    return withAnalytics(editorAnalyticsAPI, {
-      action: actionType,
-      actionSubject: ACTION_SUBJECT.MEDIA,
-      actionSubjectId: ACTION_SUBJECT_ID.ALT_TEXT,
-      eventType: EVENT_TYPE.TRACK
+    return withAnalytics(editorAnalyticsAPI, function (state) {
+      var mediaNode = getMediaSingleOrInlineNodeFromSelection(state);
+      var type = getNodeType(state);
+      return {
+        action: actionType,
+        actionSubject: ACTION_SUBJECT.MEDIA,
+        actionSubjectId: ACTION_SUBJECT_ID.ALT_TEXT,
+        eventType: EVENT_TYPE.TRACK,
+        attributes: {
+          type: type,
+          mediaType: mediaNode.attrs.type
+        }
+      };
     })(createCommand(action, transform));
   };
 };

package/dist/esm/pm-plugins/alt-text/ui/AltTextEdit.js

@@ -108,13 +108,13 @@ export var AltTextEditComponent = /*#__PURE__*/function (_React$Component) {
     key: "componentWillUnmount",
     value: function componentWillUnmount() {
       this.fireAnalytics(ACTION.CLOSED);
-      if (!this.prevValue && this.props.value) {
+      if (!this.prevValue && this.state.lastValue) {
         this.fireAnalytics(ACTION.ADDED);
       }
-      if (this.prevValue && !this.props.value) {
+      if (this.prevValue && !this.state.lastValue) {
         this.fireAnalytics(ACTION.CLEARED);
       }
-      if (this.prevValue && this.prevValue !== this.props.value) {
+      if (this.prevValue && this.prevValue !== this.state.lastValue) {
         this.fireAnalytics(ACTION.EDITED);
       }
     }
@@ -196,14 +196,21 @@ export var AltTextEditComponent = /*#__PURE__*/function (_React$Component) {
   }, {
     key: "fireAnalytics",
     value: function fireAnalytics(actionType) {
-      var createAnalyticsEvent = this.props.createAnalyticsEvent;
+      var _this$props2 = this.props,
+        createAnalyticsEvent = _this$props2.createAnalyticsEvent,
+        nodeType = _this$props2.nodeType,
+        mediaType = _this$props2.mediaType;
       if (createAnalyticsEvent && this.fireCustomAnalytics) {
         this.fireCustomAnalytics({
           payload: {
             action: actionType,
             actionSubject: ACTION_SUBJECT.MEDIA,
             actionSubjectId: ACTION_SUBJECT_ID.ALT_TEXT,
-            eventType: EVENT_TYPE.TRACK
+            eventType: EVENT_TYPE.TRACK,
+            attributes: {
+              type: nodeType,
+              mediaType: mediaType
+            }
           }
         });
       }

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

@@ -233,7 +233,7 @@ export var MediaPluginStateImplementation = /*#__PURE__*/function () {
           break;
         case 'block':
           // read width state right before inserting to get up-to-date and define values
-          var widthPluginState = (_this$pluginInjection2 = _this.pluginInjectionApi) === null || _this$pluginInjection2 === void 0 ? void 0 : _this$pluginInjection2.width.sharedState.currentState();
+          var widthPluginState = (_this$pluginInjection2 = _this.pluginInjectionApi) === null || _this$pluginInjection2 === void 0 || (_this$pluginInjection2 = _this$pluginInjection2.width) === null || _this$pluginInjection2 === void 0 ? void 0 : _this$pluginInjection2.sharedState.currentState();
           insertMediaSingleNode(_this.view, mediaStateWithContext, _this.getInputMethod(pickerType), collection, _this.mediaOptions && _this.mediaOptions.alignLeftOnInsert, _this.newInsertionBehaviour, widthPluginState, editorAnalyticsAPI);
           break;
         case 'group':

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

@@ -8,6 +8,7 @@ import { openMediaAltTextMenu } from '../pm-plugins/alt-text/commands';
 import { messages } from '../pm-plugins/alt-text/messages';
 import AltTextEdit, { CONTAINER_WIDTH_IN_PX } from '../pm-plugins/alt-text/ui/AltTextEdit';
 import { getMediaSingleOrInlineNodeFromSelection } from '../utils/media-common';
+import { getNodeType } from './commands';
 var testId = 'alt-text-edit-button';
 export var altTextButton = function altTextButton(intl, state, editorAnalyticsAPI) {
   var mediaNode = getMediaSingleOrInlineNodeFromSelection(state);
@@ -52,9 +53,12 @@ export var altTextEditComponent = function altTextEditComponent(options) {
           dispatch(newTr);
         }
       };
+      var type = getNodeType(state);
       return /*#__PURE__*/React.createElement(AltTextEdit, {
         view: view,
         key: idx,
+        nodeType: type,
+        mediaType: mediaNode.attrs.type,
         value: mediaNode.attrs.alt,
         altTextValidator: options && options.altTextValidator,
         onEscape: handleEsc

package/dist/esm/toolbar/commands.js

@@ -13,7 +13,7 @@ import { changeFromMediaInlineToMediaSingleNode } from '../utils/media-single';
 import { getSelectedMediaSingle, removeMediaGroupNode } from './utils';
 export var DEFAULT_BORDER_COLOR = '#091e4224';
 export var DEFAULT_BORDER_SIZE = 2;
-var getNodeType = function getNodeType(state) {
+export var getNodeType = function getNodeType(state) {
   var _state$schema$nodes = state.schema.nodes,
     mediaSingle = _state$schema$nodes.mediaSingle,
     mediaInline = _state$schema$nodes.mediaInline;

package/dist/esm/toolbar/index.js

@@ -156,7 +156,7 @@ var generateMediaCardFloatingToolbar = function generateMediaCardFloatingToolbar
   return items;
 };
 var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToolbar(state, intl, options, pluginState, mediaLinkingState, pluginInjectionApi, getEditorFeatureFlags) {
-  var _pluginInjectionApi$d;
+  var _pluginInjectionApi$d, _pluginInjectionApi$d2;
   var mediaSingle = state.schema.nodes.mediaSingle;
   var allowResizing = options.allowResizing,
     allowLinking = options.allowLinking,
@@ -164,7 +164,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
     allowResizingInTables = options.allowResizingInTables,
     allowAltTextOnImages = options.allowAltTextOnImages;
   var toolbarButtons = [];
-  var _ref = (_pluginInjectionApi$d = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.decorations.actions) !== null && _pluginInjectionApi$d !== void 0 ? _pluginInjectionApi$d : {},
+  var _ref = (_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 = _ref.hoverDecoration;
   if (shouldShowImageBorder(state)) {
     toolbarButtons.push({
@@ -316,7 +316,7 @@ var generateMediaSingleFloatingToolbar = function generateMediaSingleFloatingToo
           var _selectedMediaNode$at = selectedMediaNode.attrs,
             mediaWidth = _selectedMediaNode$at.width,
             mediaHeight = _selectedMediaNode$at.height;
-          var maxWidthForNestedNode = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth;
+          var maxWidthForNestedNode = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$m = pluginInjectionApi.media) === null || _pluginInjectionApi$m === void 0 || (_pluginInjectionApi$m = _pluginInjectionApi$m.sharedState.currentState()) === null || _pluginInjectionApi$m === void 0 ? void 0 : _pluginInjectionApi$m.currentMaxWidth;
           var maxWidth = maxWidthForNestedNode || akEditorFullWidthLayoutWidth;
           var isVideoFile = isVideo(selectedMediaNode.attrs.__fileMimeType);
           var minWidth = calcMinWidth(isVideoFile, maxWidthForNestedNode || contentWidth);
@@ -472,7 +472,7 @@ var getMediaTypeMessage = function getMediaTypeMessage(selectedNodeTypeSingle) {
   return mediaType ? mediaTypeMessages[mediaType] : messages.file_unknown_is_selected;
 };
 export var floatingToolbar = function floatingToolbar(state, intl) {
-  var _pluginInjectionApi$d2;
+  var _pluginInjectionApi$d3, _pluginInjectionApi$d4;
   var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {};
   var pluginInjectionApi = arguments.length > 3 ? arguments[3] : undefined;
   var _state$schema$nodes = state.schema.nodes,
@@ -489,7 +489,7 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
     getEditorFeatureFlags = options.getEditorFeatureFlags;
   var mediaPluginState = stateKey.getState(state);
   var mediaLinkingState = getMediaLinkingState(state);
-  var _ref3 = (_pluginInjectionApi$d2 = pluginInjectionApi === null || pluginInjectionApi === void 0 ? void 0 : pluginInjectionApi.decorations.actions) !== null && _pluginInjectionApi$d2 !== void 0 ? _pluginInjectionApi$d2 : {},
+  var _ref3 = (_pluginInjectionApi$d3 = pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$d4 = pluginInjectionApi.decorations) === null || _pluginInjectionApi$d4 === void 0 ? void 0 : _pluginInjectionApi$d4.actions) !== null && _pluginInjectionApi$d3 !== void 0 ? _pluginInjectionApi$d3 : {},
     hoverDecoration = _ref3.hoverDecoration;
   if (!mediaPluginState) {
     return;
@@ -514,7 +514,7 @@ export var floatingToolbar = function floatingToolbar(state, intl) {
       var _pluginInjectionApi$f;
       return getAltTextToolbar(baseToolbar, {
         altTextValidator: altTextValidator,
-        forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
+        forceFocusSelector: pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 ? void 0 : _pluginInjectionApi$f.forceFocusSelector
       });
     }
   }

package/dist/esm/toolbar/linking.js

@@ -70,7 +70,7 @@ export var getLinkingToolbar = function getLinkingToolbar(toolbarBaseConfig, med
                  */
                 var tr = view.state.tr,
                   dispatch = view.dispatch;
-                pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar.actions) === null || _pluginInjectionApi$f === void 0 || _pluginInjectionApi$f.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
+                pluginInjectionApi === null || pluginInjectionApi === void 0 || (_pluginInjectionApi$f = pluginInjectionApi.floatingToolbar) === null || _pluginInjectionApi$f === void 0 || (_pluginInjectionApi$f = _pluginInjectionApi$f.actions) === null || _pluginInjectionApi$f === void 0 || _pluginInjectionApi$f.forceFocusSelector(FORCE_FOCUS_SELECTOR)(tr);
                 dispatch(tr);
               },
               onSubmit: function onSubmit(href, meta) {

package/dist/types/pm-plugins/alt-text/ui/AltTextEdit.d.ts

@@ -7,6 +7,8 @@ export declare const CONTAINER_WIDTH_IN_PX = 420;
 export declare const MAX_ALT_TEXT_LENGTH = 510;
 type Props = {
     view: EditorView;
+    nodeType: 'mediaSingle' | 'mediaInline';
+    mediaType: 'file' | 'image' | 'external';
     value?: string;
     altTextValidator?: (value: string) => string[];
     onEscape?: () => void;

package/dist/types/toolbar/commands.d.ts

@@ -3,10 +3,12 @@ import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command } from '@atlaskit/editor-common/types';
 import type { ForceFocusSelector } from '@atlaskit/editor-plugin-floating-toolbar';
 import type { WidthPluginState } from '@atlaskit/editor-plugin-width';
+import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 import type { EventInput } from '../pm-plugins/types';
 import type { PixelEntryValidation } from '../ui/PixelEntry/types';
 export declare const DEFAULT_BORDER_COLOR = "#091e4224";
 export declare const DEFAULT_BORDER_SIZE = 2;
+export declare const getNodeType: (state: EditorState) => "mediaInline" | "mediaSingle";
 export declare const changeInlineToMediaCard: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined, forceFocusSelector: ForceFocusSelector | undefined) => Command;
 export declare const changeMediaCardToInline: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined, forceFocusSelector: ForceFocusSelector | undefined) => Command;
 export declare const changeMediaInlineToMediaSingle: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined, widthPluginState: WidthPluginState | undefined) => Command;

package/dist/types-ts4.5/pm-plugins/alt-text/ui/AltTextEdit.d.ts

@@ -7,6 +7,8 @@ export declare const CONTAINER_WIDTH_IN_PX = 420;
 export declare const MAX_ALT_TEXT_LENGTH = 510;
 type Props = {
     view: EditorView;
+    nodeType: 'mediaSingle' | 'mediaInline';
+    mediaType: 'file' | 'image' | 'external';
     value?: string;
     altTextValidator?: (value: string) => string[];
     onEscape?: () => void;

package/dist/types-ts4.5/toolbar/commands.d.ts

@@ -3,10 +3,12 @@ import type { EditorAnalyticsAPI } from '@atlaskit/editor-common/analytics';
 import type { Command } from '@atlaskit/editor-common/types';
 import type { ForceFocusSelector } from '@atlaskit/editor-plugin-floating-toolbar';
 import type { WidthPluginState } from '@atlaskit/editor-plugin-width';
+import type { EditorState } from '@atlaskit/editor-prosemirror/state';
 import type { EventInput } from '../pm-plugins/types';
 import type { PixelEntryValidation } from '../ui/PixelEntry/types';
 export declare const DEFAULT_BORDER_COLOR = "#091e4224";
 export declare const DEFAULT_BORDER_SIZE = 2;
+export declare const getNodeType: (state: EditorState) => "mediaInline" | "mediaSingle";
 export declare const changeInlineToMediaCard: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined, forceFocusSelector: ForceFocusSelector | undefined) => Command;
 export declare const changeMediaCardToInline: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined, forceFocusSelector: ForceFocusSelector | undefined) => Command;
 export declare const changeMediaInlineToMediaSingle: (editorAnalyticsAPI: EditorAnalyticsAPI | undefined, widthPluginState: WidthPluginState | undefined) => Command;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-plugin-media",
-  "version": "0.11.2",
+  "version": "0.11.4",
   "description": "Media plugin for @atlaskit/editor-core",
   "author": "Atlassian Pty Ltd",
   "license": "Apache-2.0",
@@ -13,7 +13,7 @@
     "singleton": true,
     "runReact18": false
   },
-  "repository": "https://bitbucket.org/atlassian/atlassian-frontend",
+  "repository": "https://bitbucket.org/atlassian/atlassian-frontend-mirror",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
   "module:es2019": "dist/es2019/index.js",