@atlaskit/editor-core 185.0.2 → 185.1.1

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @atlaskit/editor-core
 
+## 185.1.1
+
+### Patch Changes
+
+- [`63ef771aab9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/63ef771aab9) - [ux] Fix layout button. breakoutNode equals check should include position.
+
+## 185.1.0
+
+### Minor Changes
+
+- [`d9fe34b3f2b`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d9fe34b3f2b) - [ux] The ResizerNext component now supports a new property handleAlignmentMethod which defaults to "sticky". This means the resizer handles wil stick to the top/bottom bounds of the browser viewport if the component extends beyond and the user scrolls down. An alternative "center" value can be set which means the handles will just center to their content and not stick.
+
+### Patch Changes
+
+- [`bb442ced942`](https://bitbucket.org/atlassian/atlassian-frontend/commits/bb442ced942) - Remove newCardExperience feature flag
+- [`daee7ddddc2`](https://bitbucket.org/atlassian/atlassian-frontend/commits/daee7ddddc2) - [MEX-2405] Fixed the flickering error (inline) card issue
+- [`d7888f058a9`](https://bitbucket.org/atlassian/atlassian-frontend/commits/d7888f058a9) - converted to using new AnalyticsAPI in mentions plugin and wrote test for it
+- Updated dependencies
+
 ## 185.0.2
 
 ### Patch Changes

package/dist/cjs/plugins/breakout/index.js

@@ -106,7 +106,7 @@ var BreakoutView = /*#__PURE__*/function () {
 }();
 function shouldPluginStateUpdate(newBreakoutNode, currentBreakoutNode) {
   if (newBreakoutNode && currentBreakoutNode) {
-    return !newBreakoutNode.eq(currentBreakoutNode);
+    return newBreakoutNode !== currentBreakoutNode;
   }
   return newBreakoutNode || currentBreakoutNode ? true : false;
 }
@@ -121,10 +121,9 @@ function createPlugin(pluginInjectionApi, _ref2) {
       },
       apply: function apply(tr, pluginState) {
         var breakoutNode = (0, _findBreakoutNode.findSupportedNodeForBreakout)(tr.selection);
-        var node = breakoutNode ? breakoutNode.node : null;
-        if (shouldPluginStateUpdate(node, pluginState.breakoutNode)) {
+        if (shouldPluginStateUpdate(breakoutNode, pluginState.breakoutNode)) {
           var nextPluginState = _objectSpread(_objectSpread({}, pluginState), {}, {
-            breakoutNode: node
+            breakoutNode: breakoutNode
           });
           dispatch(_pluginKey.pluginKey, nextPluginState);
           return nextPluginState;
@@ -147,7 +146,7 @@ function createPlugin(pluginInjectionApi, _ref2) {
   });
 }
 var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
-  var _breakoutState$breako;
+  var _breakoutState$breako, _breakoutState$breako2;
   var api = _ref3.api,
     editorView = _ref3.editorView,
     boundariesElement = _ref3.boundariesElement,
@@ -161,7 +160,7 @@ var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
-    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : breakoutState.breakoutNode) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
+    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
   });
 };
 var breakoutPlugin = function breakoutPlugin(options, api) {

package/dist/cjs/plugins/breakout/ui/LayoutButton.js

@@ -64,7 +64,7 @@ function getBreakoutNodeElement(pluginState, selection, editorView) {
   if (selection instanceof _prosemirrorState.NodeSelection && (0, _isSupportedNode.isSupportedNodeForBreakout)(selection.node)) {
     return (0, _prosemirrorUtils.findDomRefAtPos)(selection.from, editorView.domAtPos.bind(editorView));
   }
-  return (0, _prosemirrorUtils.findParentDomRefOfType)(pluginState.breakoutNode.type, editorView.domAtPos.bind(editorView))(selection);
+  return (0, _prosemirrorUtils.findParentDomRefOfType)(pluginState.breakoutNode.node.type, editorView.domAtPos.bind(editorView))(selection);
 }
 var LayoutButton = /*#__PURE__*/function (_React$Component) {
   (0, _inherits2.default)(LayoutButton, _React$Component);

package/dist/cjs/plugins/media/nodeviews/mediaInline.js

@@ -49,60 +49,59 @@ var createMediaNodeUpdater = function createMediaNodeUpdater(props) {
  */
 exports.createMediaNodeUpdater = createMediaNodeUpdater;
 var updateMediaNodeAttributes = /*#__PURE__*/function () {
-  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(props) {
-    var mediaNodeUpdater, addPendingTask, node, contextId, hasDifferentContextId, copyNode;
+  var _ref = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(props, mediaNodeUpdater) {
+    var addPendingTask, node, contextId, hasDifferentContextId, copyNode;
     return _regenerator.default.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          mediaNodeUpdater = createMediaNodeUpdater(props);
           addPendingTask = props.mediaPluginState.addPendingTask;
           node = props.node;
           if (node) {
-            _context.next = 5;
+            _context.next = 4;
             break;
           }
           return _context.abrupt("return");
-        case 5:
+        case 4:
           contextId = mediaNodeUpdater.getNodeContextId();
           if (contextId) {
-            _context.next = 9;
+            _context.next = 8;
             break;
           }
-          _context.next = 9;
+          _context.next = 8;
           return mediaNodeUpdater.updateContextId();
-        case 9:
-          _context.next = 11;
+        case 8:
+          _context.next = 10;
           return mediaNodeUpdater.hasDifferentContextId();
-        case 11:
+        case 10:
           hasDifferentContextId = _context.sent;
           if (!hasDifferentContextId) {
-            _context.next = 23;
+            _context.next = 22;
             break;
           }
-          _context.prev = 13;
+          _context.prev = 12;
           copyNode = mediaNodeUpdater.copyNode({
             traceId: node.attrs.__mediaTraceId
           });
           addPendingTask(copyNode);
-          _context.next = 18;
+          _context.next = 17;
           return copyNode;
-        case 18:
-          _context.next = 23;
+        case 17:
+          _context.next = 22;
           break;
-        case 20:
-          _context.prev = 20;
-          _context.t0 = _context["catch"](13);
+        case 19:
+          _context.prev = 19;
+          _context.t0 = _context["catch"](12);
           return _context.abrupt("return");
-        case 23:
-          _context.next = 25;
+        case 22:
+          _context.next = 24;
           return mediaNodeUpdater.updateMediaSingleFileAttrs();
-        case 25:
+        case 24:
         case "end":
           return _context.stop();
       }
-    }, _callee, null, [[13, 20]]);
+    }, _callee, null, [[12, 19]]);
   }));
-  return function updateMediaNodeAttributes(_x) {
+  return function updateMediaNodeAttributes(_x, _x2) {
     return _ref.apply(this, arguments);
   };
 }();
@@ -121,9 +120,15 @@ var MediaInline = function MediaInline(props) {
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     viewMediaClientConfig = _useState2[0],
     setViewMediaClientConfig = _useState2[1];
+  var _useState3 = (0, _react.useState)(true),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    isContextIdUnsync = _useState4[0],
+    setIsContextIdUnsync = _useState4[1];
   (0, _react.useEffect)(function () {
+    var mediaNodeUpdater = createMediaNodeUpdater(props);
+    mediaNodeUpdater.hasDifferentContextId().then(setIsContextIdUnsync);
     handleNewNode(props);
-    updateMediaNodeAttributes(props);
+    updateMediaNodeAttributes(props, mediaNodeUpdater);
     updateViewMediaClientConfig(props);
     return function () {
       var mediaPluginState = props.mediaPluginState;
@@ -150,7 +155,7 @@ var MediaInline = function MediaInline(props) {
         }
       }, _callee2);
     }));
-    return function updateViewMediaClientConfig(_x2) {
+    return function updateViewMediaClientConfig(_x3) {
       return _ref2.apply(this, arguments);
     };
   }();
@@ -164,10 +169,13 @@ var MediaInline = function MediaInline(props) {
   };
 
   /*
-   * Only show the loading view if the media provider is not ready
-   * prevents calling the media API before the provider is ready
+   * Show the loading view if
+   * 1. The media provider is not ready
+   * 2. Context Id is not synced
+   * to prevent calling the media API (in mounting of `MediaInlineCard`)
+   * before the prerequisites meet
    */
-  if (!viewMediaClientConfig) {
+  if (!viewMediaClientConfig || isContextIdUnsync) {
     return /*#__PURE__*/_react.default.createElement(_mediaUi.MediaInlineCardLoadingView, {
       message: "",
       isSelected: false

package/dist/cjs/plugins/mentions/index.js

@@ -18,14 +18,14 @@ var _adfSchema = require("@atlaskit/adf-schema");
 var _WithPluginState = _interopRequireDefault(require("../../ui/WithPluginState"));
 var _utils = require("../type-ahead/utils");
 var _ToolbarMention = _interopRequireDefault(require("./ui/ToolbarMention"));
-var _analytics = require("../analytics");
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _assets = require("../quick-insert/assets");
 var _messages = require("../insert-block/ui/ToolbarInsertBlock/messages");
 var _openTypeaheadAtCursor = require("../type-ahead/transforms/open-typeahead-at-cursor");
 var _typeAhead = require("./type-ahead");
 var _key = require("./pm-plugins/key");
 var _main = require("./pm-plugins/main");
-var mentionsPlugin = function mentionsPlugin(options) {
+var mentionsPlugin = function mentionsPlugin(options, api) {
   var sessionId = (0, _uuid.default)();
   var fireEvent = function fireEvent(payload) {
     if (!(options !== null && options !== void 0 && options.createAnalyticsEvent)) {
@@ -91,12 +91,13 @@ var mentionsPlugin = function mentionsPlugin(options) {
             return /*#__PURE__*/_react.default.createElement(_assets.IconMention, null);
           },
           action: function action(insert, state) {
+            var _api$dependencies$ana;
             var tr = insert(undefined);
             (0, _openTypeaheadAtCursor.openTypeAheadAtCursor)({
               triggerHandler: typeAhead,
               inputMethod: _analytics.INPUT_METHOD.QUICK_INSERT
             })(tr);
-            return (0, _analytics.addAnalytics)(state, tr, {
+            api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions.attachAnalyticsEvent({
               action: _analytics.ACTION.INVOKED,
               actionSubject: _analytics.ACTION_SUBJECT.TYPEAHEAD,
               actionSubjectId: _analytics.ACTION_SUBJECT_ID.TYPEAHEAD_MENTION,
@@ -104,7 +105,8 @@ var mentionsPlugin = function mentionsPlugin(options) {
                 inputMethod: _analytics.INPUT_METHOD.QUICK_INSERT
               },
               eventType: _analytics.EVENT_TYPE.UI
-            });
+            })(tr);
+            return tr;
           }
         }];
       },

package/dist/cjs/version-wrapper.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.version = exports.nextMajorVersion = exports.name = void 0;
 var name = "@atlaskit/editor-core";
 exports.name = name;
-var version = "185.0.2";
+var version = "185.1.1";
 exports.version = version;
 var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.0.2",
+	"version": "185.1.1",
 	"sideEffects": false
 }

package/dist/es2019/plugins/breakout/index.js

@@ -94,7 +94,7 @@ class BreakoutView {
 }
 function shouldPluginStateUpdate(newBreakoutNode, currentBreakoutNode) {
   if (newBreakoutNode && currentBreakoutNode) {
-    return !newBreakoutNode.eq(currentBreakoutNode);
+    return newBreakoutNode !== currentBreakoutNode;
   }
   return newBreakoutNode || currentBreakoutNode ? true : false;
 }
@@ -110,11 +110,10 @@ function createPlugin(pluginInjectionApi, {
       },
       apply(tr, pluginState) {
         const breakoutNode = findSupportedNodeForBreakout(tr.selection);
-        const node = breakoutNode ? breakoutNode.node : null;
-        if (shouldPluginStateUpdate(node, pluginState.breakoutNode)) {
+        if (shouldPluginStateUpdate(breakoutNode, pluginState.breakoutNode)) {
           const nextPluginState = {
             ...pluginState,
-            breakoutNode: node
+            breakoutNode
           };
           dispatch(pluginKey, nextPluginState);
           return nextPluginState;
@@ -143,7 +142,7 @@ const LayoutButtonWrapper = ({
   scrollableElement,
   mountPoint
 }) => {
-  var _breakoutState$breako;
+  var _breakoutState$breako, _breakoutState$breako2;
   // Re-render with `width` (but don't use state) due to https://bitbucket.org/atlassian/%7Bc8e2f021-38d2-46d0-9b7a-b3f7b428f724%7D/pull-requests/24272
   const {
     breakoutState
@@ -153,7 +152,7 @@ const LayoutButtonWrapper = ({
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
-    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : breakoutState.breakoutNode) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
+    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
   });
 };
 const breakoutPlugin = (options, api) => ({

package/dist/es2019/plugins/breakout/ui/LayoutButton.js

@@ -56,7 +56,7 @@ function getBreakoutNodeElement(pluginState, selection, editorView) {
   if (selection instanceof NodeSelection && isSupportedNodeForBreakout(selection.node)) {
     return findDomRefAtPos(selection.from, editorView.domAtPos.bind(editorView));
   }
-  return findParentDomRefOfType(pluginState.breakoutNode.type, editorView.domAtPos.bind(editorView))(selection);
+  return findParentDomRefOfType(pluginState.breakoutNode.node.type, editorView.domAtPos.bind(editorView))(selection);
 }
 class LayoutButton extends React.Component {
   constructor(...args) {

package/dist/es2019/plugins/media/nodeviews/mediaInline.js

@@ -24,8 +24,7 @@ export const createMediaNodeUpdater = props => {
  * using the contextid
  *
  */
-export const updateMediaNodeAttributes = async props => {
-  const mediaNodeUpdater = createMediaNodeUpdater(props);
+export const updateMediaNodeAttributes = async (props, mediaNodeUpdater) => {
   const {
     addPendingTask
   } = props.mediaPluginState;
@@ -39,6 +38,7 @@ export const updateMediaNodeAttributes = async props => {
   }
   const hasDifferentContextId = await mediaNodeUpdater.hasDifferentContextId();
   if (hasDifferentContextId) {
+    // Copy paste flow (different pages)
     try {
       const copyNode = mediaNodeUpdater.copyNode({
         traceId: node.attrs.__mediaTraceId
@@ -61,9 +61,12 @@ export const handleNewNode = props => {
 };
 export const MediaInline = props => {
   const [viewMediaClientConfig, setViewMediaClientConfig] = useState();
+  const [isContextIdUnsync, setIsContextIdUnsync] = useState(true);
   useEffect(() => {
+    const mediaNodeUpdater = createMediaNodeUpdater(props);
+    mediaNodeUpdater.hasDifferentContextId().then(setIsContextIdUnsync);
     handleNewNode(props);
-    updateMediaNodeAttributes(props);
+    updateMediaNodeAttributes(props, mediaNodeUpdater);
     updateViewMediaClientConfig(props);
     return () => {
       const {
@@ -90,10 +93,13 @@ export const MediaInline = props => {
   };
 
   /*
-   * Only show the loading view if the media provider is not ready
-   * prevents calling the media API before the provider is ready
+   * Show the loading view if
+   * 1. The media provider is not ready
+   * 2. Context Id is not synced
+   * to prevent calling the media API (in mounting of `MediaInlineCard`)
+   * before the prerequisites meet
    */
-  if (!viewMediaClientConfig) {
+  if (!viewMediaClientConfig || isContextIdUnsync) {
     return /*#__PURE__*/React.createElement(MediaInlineCardLoadingView, {
       message: "",
       isSelected: false

package/dist/es2019/plugins/mentions/index.js

@@ -5,7 +5,7 @@ import { mention } from '@atlaskit/adf-schema';
 import WithPluginState from '../../ui/WithPluginState';
 import { isTypeAheadAllowed } from '../type-ahead/utils';
 import ToolbarMention from './ui/ToolbarMention';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { IconMention } from '../quick-insert/assets';
 import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 import { openTypeAheadAtCursor } from '../type-ahead/transforms/open-typeahead-at-cursor';
@@ -13,7 +13,7 @@ import { createTypeAheadConfig } from './type-ahead';
 import { mentionPluginKey } from './pm-plugins/key';
 import { createMentionPlugin } from './pm-plugins/main';
 export { mentionPluginKey };
-const mentionsPlugin = options => {
+const mentionsPlugin = (options, api) => {
   let sessionId = uuid();
   const fireEvent = payload => {
     if (!(options !== null && options !== void 0 && options.createAnalyticsEvent)) {
@@ -76,12 +76,13 @@ const mentionsPlugin = options => {
         keyshortcut: '@',
         icon: () => /*#__PURE__*/React.createElement(IconMention, null),
         action(insert, state) {
+          var _api$dependencies$ana;
           const tr = insert(undefined);
           openTypeAheadAtCursor({
             triggerHandler: typeAhead,
             inputMethod: INPUT_METHOD.QUICK_INSERT
           })(tr);
-          return addAnalytics(state, tr, {
+          api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions.attachAnalyticsEvent({
             action: ACTION.INVOKED,
             actionSubject: ACTION_SUBJECT.TYPEAHEAD,
             actionSubjectId: ACTION_SUBJECT_ID.TYPEAHEAD_MENTION,
@@ -89,7 +90,8 @@ const mentionsPlugin = options => {
               inputMethod: INPUT_METHOD.QUICK_INSERT
             },
             eventType: EVENT_TYPE.UI
-          });
+          })(tr);
+          return tr;
         }
       }],
       typeAhead

package/dist/es2019/version-wrapper.js

@@ -1,5 +1,5 @@
 export const name = "@atlaskit/editor-core";
-export const version = "185.0.2";
+export const version = "185.1.1";
 export const nextMajorVersion = () => {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.0.2",
+	"version": "185.1.1",
 	"sideEffects": false
 }

package/dist/esm/plugins/breakout/index.js

@@ -99,7 +99,7 @@ var BreakoutView = /*#__PURE__*/function () {
 }();
 function shouldPluginStateUpdate(newBreakoutNode, currentBreakoutNode) {
   if (newBreakoutNode && currentBreakoutNode) {
-    return !newBreakoutNode.eq(currentBreakoutNode);
+    return newBreakoutNode !== currentBreakoutNode;
   }
   return newBreakoutNode || currentBreakoutNode ? true : false;
 }
@@ -114,10 +114,9 @@ function createPlugin(pluginInjectionApi, _ref2) {
       },
       apply: function apply(tr, pluginState) {
         var breakoutNode = findSupportedNodeForBreakout(tr.selection);
-        var node = breakoutNode ? breakoutNode.node : null;
-        if (shouldPluginStateUpdate(node, pluginState.breakoutNode)) {
+        if (shouldPluginStateUpdate(breakoutNode, pluginState.breakoutNode)) {
           var nextPluginState = _objectSpread(_objectSpread({}, pluginState), {}, {
-            breakoutNode: node
+            breakoutNode: breakoutNode
           });
           dispatch(pluginKey, nextPluginState);
           return nextPluginState;
@@ -140,7 +139,7 @@ function createPlugin(pluginInjectionApi, _ref2) {
   });
 }
 var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
-  var _breakoutState$breako;
+  var _breakoutState$breako, _breakoutState$breako2;
   var api = _ref3.api,
     editorView = _ref3.editorView,
     boundariesElement = _ref3.boundariesElement,
@@ -154,7 +153,7 @@ var LayoutButtonWrapper = function LayoutButtonWrapper(_ref3) {
     mountPoint: mountPoint,
     boundariesElement: boundariesElement,
     scrollableElement: scrollableElement,
-    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : breakoutState.breakoutNode) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
+    node: (_breakoutState$breako = breakoutState === null || breakoutState === void 0 ? void 0 : (_breakoutState$breako2 = breakoutState.breakoutNode) === null || _breakoutState$breako2 === void 0 ? void 0 : _breakoutState$breako2.node) !== null && _breakoutState$breako !== void 0 ? _breakoutState$breako : null
   });
 };
 var breakoutPlugin = function breakoutPlugin(options, api) {

package/dist/esm/plugins/breakout/ui/LayoutButton.js

@@ -57,7 +57,7 @@ function getBreakoutNodeElement(pluginState, selection, editorView) {
   if (selection instanceof NodeSelection && isSupportedNodeForBreakout(selection.node)) {
     return findDomRefAtPos(selection.from, editorView.domAtPos.bind(editorView));
   }
-  return findParentDomRefOfType(pluginState.breakoutNode.type, editorView.domAtPos.bind(editorView))(selection);
+  return findParentDomRefOfType(pluginState.breakoutNode.node.type, editorView.domAtPos.bind(editorView))(selection);
 }
 var LayoutButton = /*#__PURE__*/function (_React$Component) {
   _inherits(LayoutButton, _React$Component);

package/dist/esm/plugins/media/nodeviews/mediaInline.js

@@ -38,60 +38,59 @@ export var createMediaNodeUpdater = function createMediaNodeUpdater(props) {
  *
  */
 export var updateMediaNodeAttributes = /*#__PURE__*/function () {
-  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(props) {
-    var mediaNodeUpdater, addPendingTask, node, contextId, hasDifferentContextId, copyNode;
+  var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(props, mediaNodeUpdater) {
+    var addPendingTask, node, contextId, hasDifferentContextId, copyNode;
     return _regeneratorRuntime.wrap(function _callee$(_context) {
       while (1) switch (_context.prev = _context.next) {
         case 0:
-          mediaNodeUpdater = createMediaNodeUpdater(props);
           addPendingTask = props.mediaPluginState.addPendingTask;
           node = props.node;
           if (node) {
-            _context.next = 5;
+            _context.next = 4;
             break;
           }
           return _context.abrupt("return");
-        case 5:
+        case 4:
           contextId = mediaNodeUpdater.getNodeContextId();
           if (contextId) {
-            _context.next = 9;
+            _context.next = 8;
             break;
           }
-          _context.next = 9;
+          _context.next = 8;
           return mediaNodeUpdater.updateContextId();
-        case 9:
-          _context.next = 11;
+        case 8:
+          _context.next = 10;
           return mediaNodeUpdater.hasDifferentContextId();
-        case 11:
+        case 10:
           hasDifferentContextId = _context.sent;
           if (!hasDifferentContextId) {
-            _context.next = 23;
+            _context.next = 22;
             break;
           }
-          _context.prev = 13;
+          _context.prev = 12;
           copyNode = mediaNodeUpdater.copyNode({
             traceId: node.attrs.__mediaTraceId
           });
           addPendingTask(copyNode);
-          _context.next = 18;
+          _context.next = 17;
           return copyNode;
-        case 18:
-          _context.next = 23;
+        case 17:
+          _context.next = 22;
           break;
-        case 20:
-          _context.prev = 20;
-          _context.t0 = _context["catch"](13);
+        case 19:
+          _context.prev = 19;
+          _context.t0 = _context["catch"](12);
           return _context.abrupt("return");
-        case 23:
-          _context.next = 25;
+        case 22:
+          _context.next = 24;
           return mediaNodeUpdater.updateMediaSingleFileAttrs();
-        case 25:
+        case 24:
         case "end":
           return _context.stop();
       }
-    }, _callee, null, [[13, 20]]);
+    }, _callee, null, [[12, 19]]);
   }));
-  return function updateMediaNodeAttributes(_x) {
+  return function updateMediaNodeAttributes(_x, _x2) {
     return _ref.apply(this, arguments);
   };
 }();
@@ -108,9 +107,15 @@ export var MediaInline = function MediaInline(props) {
     _useState2 = _slicedToArray(_useState, 2),
     viewMediaClientConfig = _useState2[0],
     setViewMediaClientConfig = _useState2[1];
+  var _useState3 = useState(true),
+    _useState4 = _slicedToArray(_useState3, 2),
+    isContextIdUnsync = _useState4[0],
+    setIsContextIdUnsync = _useState4[1];
   useEffect(function () {
+    var mediaNodeUpdater = createMediaNodeUpdater(props);
+    mediaNodeUpdater.hasDifferentContextId().then(setIsContextIdUnsync);
     handleNewNode(props);
-    updateMediaNodeAttributes(props);
+    updateMediaNodeAttributes(props, mediaNodeUpdater);
     updateViewMediaClientConfig(props);
     return function () {
       var mediaPluginState = props.mediaPluginState;
@@ -137,7 +142,7 @@ export var MediaInline = function MediaInline(props) {
         }
       }, _callee2);
     }));
-    return function updateViewMediaClientConfig(_x2) {
+    return function updateViewMediaClientConfig(_x3) {
       return _ref2.apply(this, arguments);
     };
   }();
@@ -151,10 +156,13 @@ export var MediaInline = function MediaInline(props) {
   };
 
   /*
-   * Only show the loading view if the media provider is not ready
-   * prevents calling the media API before the provider is ready
+   * Show the loading view if
+   * 1. The media provider is not ready
+   * 2. Context Id is not synced
+   * to prevent calling the media API (in mounting of `MediaInlineCard`)
+   * before the prerequisites meet
    */
-  if (!viewMediaClientConfig) {
+  if (!viewMediaClientConfig || isContextIdUnsync) {
     return /*#__PURE__*/React.createElement(MediaInlineCardLoadingView, {
       message: "",
       isSelected: false

package/dist/esm/plugins/mentions/index.js

@@ -5,7 +5,7 @@ import { mention } from '@atlaskit/adf-schema';
 import WithPluginState from '../../ui/WithPluginState';
 import { isTypeAheadAllowed } from '../type-ahead/utils';
 import ToolbarMention from './ui/ToolbarMention';
-import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, addAnalytics, EVENT_TYPE, INPUT_METHOD } from '../analytics';
+import { ACTION, ACTION_SUBJECT, ACTION_SUBJECT_ID, EVENT_TYPE, INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { IconMention } from '../quick-insert/assets';
 import { messages } from '../insert-block/ui/ToolbarInsertBlock/messages';
 import { openTypeAheadAtCursor } from '../type-ahead/transforms/open-typeahead-at-cursor';
@@ -13,7 +13,7 @@ import { createTypeAheadConfig } from './type-ahead';
 import { mentionPluginKey } from './pm-plugins/key';
 import { createMentionPlugin } from './pm-plugins/main';
 export { mentionPluginKey };
-var mentionsPlugin = function mentionsPlugin(options) {
+var mentionsPlugin = function mentionsPlugin(options, api) {
   var sessionId = uuid();
   var fireEvent = function fireEvent(payload) {
     if (!(options !== null && options !== void 0 && options.createAnalyticsEvent)) {
@@ -79,12 +79,13 @@ var mentionsPlugin = function mentionsPlugin(options) {
             return /*#__PURE__*/React.createElement(IconMention, null);
           },
           action: function action(insert, state) {
+            var _api$dependencies$ana;
             var tr = insert(undefined);
             openTypeAheadAtCursor({
               triggerHandler: typeAhead,
               inputMethod: INPUT_METHOD.QUICK_INSERT
             })(tr);
-            return addAnalytics(state, tr, {
+            api === null || api === void 0 ? void 0 : (_api$dependencies$ana = api.dependencies.analytics) === null || _api$dependencies$ana === void 0 ? void 0 : _api$dependencies$ana.actions.attachAnalyticsEvent({
               action: ACTION.INVOKED,
               actionSubject: ACTION_SUBJECT.TYPEAHEAD,
               actionSubjectId: ACTION_SUBJECT_ID.TYPEAHEAD_MENTION,
@@ -92,7 +93,8 @@ var mentionsPlugin = function mentionsPlugin(options) {
                 inputMethod: INPUT_METHOD.QUICK_INSERT
               },
               eventType: EVENT_TYPE.UI
-            });
+            })(tr);
+            return tr;
           }
         }];
       },

package/dist/esm/version-wrapper.js

@@ -1,5 +1,5 @@
 export var name = "@atlaskit/editor-core";
-export var version = "185.0.2";
+export var version = "185.1.1";
 export var nextMajorVersion = function nextMajorVersion() {
   return [Number(version.split('.')[0]) + 1, 0, 0].join('.');
 };

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/editor-core",
-	"version": "185.0.2",
+	"version": "185.1.1",
 	"sideEffects": false
 }

package/dist/types/plugins/breakout/types.d.ts

@@ -1,4 +1,4 @@
-import { Node as PMNode } from 'prosemirror-model';
+import { ContentNodeWithPos } from 'prosemirror-utils';
 export interface BreakoutPluginState {
-    breakoutNode: PMNode;
+    breakoutNode: ContentNodeWithPos;
 }

package/dist/types/plugins/media/nodeviews/mediaInline.d.ts

@@ -28,7 +28,7 @@ export declare const createMediaNodeUpdater: (props: MediaInlineProps) => MediaN
  * using the contextid
  *
  */
-export declare const updateMediaNodeAttributes: (props: MediaInlineProps) => Promise<void>;
+export declare const updateMediaNodeAttributes: (props: MediaInlineProps, mediaNodeUpdater: MediaNodeUpdater) => Promise<void>;
 export declare const handleNewNode: (props: MediaInlineProps) => void;
 export declare const MediaInline: React.FC<MediaInlineProps>;
 export interface MediaInlineNodeViewProps {

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

@@ -1,8 +1,10 @@
-import { NextEditorPlugin } from '@atlaskit/editor-common/types';
+import { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import { MentionPluginOptions } from './types';
 import { mentionPluginKey } from './pm-plugins/key';
+import type { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 export { mentionPluginKey };
 declare const mentionsPlugin: NextEditorPlugin<'mention', {
     pluginConfiguration: MentionPluginOptions | undefined;
+    dependencies: [OptionalPlugin<typeof analyticsPlugin>];
 }>;
 export default mentionsPlugin;

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

@@ -1,4 +1,4 @@
-import { Node as PMNode } from 'prosemirror-model';
+import { ContentNodeWithPos } from 'prosemirror-utils';
 export interface BreakoutPluginState {
-    breakoutNode: PMNode;
+    breakoutNode: ContentNodeWithPos;
 }

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

@@ -28,7 +28,7 @@ export declare const createMediaNodeUpdater: (props: MediaInlineProps) => MediaN
  * using the contextid
  *
  */
-export declare const updateMediaNodeAttributes: (props: MediaInlineProps) => Promise<void>;
+export declare const updateMediaNodeAttributes: (props: MediaInlineProps, mediaNodeUpdater: MediaNodeUpdater) => Promise<void>;
 export declare const handleNewNode: (props: MediaInlineProps) => void;
 export declare const MediaInline: React.FC<MediaInlineProps>;
 export interface MediaInlineNodeViewProps {

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

@@ -1,8 +1,12 @@
-import { NextEditorPlugin } from '@atlaskit/editor-common/types';
+import { NextEditorPlugin, OptionalPlugin } from '@atlaskit/editor-common/types';
 import { MentionPluginOptions } from './types';
 import { mentionPluginKey } from './pm-plugins/key';
+import type { analyticsPlugin } from '@atlaskit/editor-plugin-analytics';
 export { mentionPluginKey };
 declare const mentionsPlugin: NextEditorPlugin<'mention', {
     pluginConfiguration: MentionPluginOptions | undefined;
+    dependencies: [
+        OptionalPlugin<typeof analyticsPlugin>
+    ];
 }>;
 export default mentionsPlugin;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/editor-core",
-  "version": "185.0.2",
+  "version": "185.1.1",
   "description": "A package contains Atlassian editor core functionality",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -34,8 +34,8 @@
   },
   "dependencies": {
     "@atlaskit/activity-provider": "^2.4.0",
-    "@atlaskit/adf-schema": "^25.7.0",
-    "@atlaskit/adf-utils": "^18.2.0",
+    "@atlaskit/adf-schema": "^25.8.0",
+    "@atlaskit/adf-utils": "^18.3.0",
     "@atlaskit/analytics-gas-types": "^5.1.0",
     "@atlaskit/analytics-listeners": "^8.7.0",
     "@atlaskit/analytics-namespaced-context": "^6.7.0",
@@ -49,7 +49,7 @@
     "@atlaskit/code": "^14.6.0",
     "@atlaskit/date": "^0.10.0",
     "@atlaskit/datetime-picker": "^12.7.0",
-    "@atlaskit/editor-common": "^74.3.0",
+    "@atlaskit/editor-common": "^74.4.0",
     "@atlaskit/editor-json-transformer": "^8.9.0",
     "@atlaskit/editor-markdown-transformer": "^5.2.0",
     "@atlaskit/editor-palette": "1.4.2",
@@ -72,8 +72,8 @@
     "@atlaskit/locale": "^2.5.0",
     "@atlaskit/logo": "^13.14.0",
     "@atlaskit/media-card": "^76.0.0",
-    "@atlaskit/media-client": "^22.0.0",
-    "@atlaskit/media-common": "^5.0.0",
+    "@atlaskit/media-client": "^23.0.0",
+    "@atlaskit/media-common": "^6.0.0",
     "@atlaskit/media-filmstrip": "^47.0.0",
     "@atlaskit/media-picker": "^66.0.0",
     "@atlaskit/media-ui": "^23.0.0",
@@ -147,9 +147,9 @@
   "devDependencies": {
     "@af/integration-testing": "*",
     "@atlaskit/atlassian-navigation": "^2.6.0",
-    "@atlaskit/breadcrumbs": "11.10.3",
+    "@atlaskit/breadcrumbs": "11.10.4",
     "@atlaskit/code": "^14.6.0",
-    "@atlaskit/collab-provider": "9.0.1",
+    "@atlaskit/collab-provider": "9.1.0",
     "@atlaskit/docs": "*",
     "@atlaskit/drawer": "^7.5.0",
     "@atlaskit/dropdown-menu": "^11.9.0",
@@ -183,8 +183,8 @@
     "@atlaskit/visual-regression": "*",
     "@atlaskit/webdriver-runner": "*",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
-    "@atlassian/link-picker-atlassian-plugin": "^32.1.0",
-    "@atlassian/link-picker-plugins": "^22.1.0",
+    "@atlassian/link-picker-atlassian-plugin": "^33.0.0",
+    "@atlassian/link-picker-plugins": "^22.2.0",
     "@atlassian/search-provider": "2.4.4",
     "@atlassian/ufo": "^0.2.0",
     "@emotion/jest": "^11.8.0",