@atlaskit/editor-plugin-mentions 2.10.9 → 2.11.1

package/CHANGELOG.md

@@ -1,5 +1,30 @@
 # @atlaskit/editor-plugin-mentions
 
+## 2.11.1
+
+### Patch Changes
+
+- [#97984](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/97984)
+  [`8ffeab9aaf1ab`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/8ffeab9aaf1ab) -
+  [ux] [ED-23573] Added new actions (resolveMarks and registerMarks) to basePlugin. Callbacks added
+  to mentions, card, emoji and base plugins to handle conversion to inline code. Deprecated code
+  removed from editor-common.
+- Updated dependencies
+
+## 2.11.0
+
+### Minor Changes
+
+- [#99344](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/pull-requests/99344)
+  [`fbeb84f180cd2`](https://stash.atlassian.com/projects/CONFCLOUD/repos/confluence-frontend/commits/fbeb84f180cd2) -
+  Added optional `isEligibleXProductUserInvite` and `inviteXProductUser` props which will be used in
+  CCEDITIONS-4746 (x-product-user-invite experiment). Project poster link -
+  https://hello.atlassian.net/wiki/spaces/CV1/pages/3685626022/Project+poster+-+Cross+Product+User+Search+Invites
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.10.9
 
 ### Patch Changes

package/dist/cjs/mentionsPlugin.js

@@ -1,27 +1,89 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.mentionsPlugin = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _react = _interopRequireDefault(require("react"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntlNext = require("react-intl-next");
 var _uuid = _interopRequireDefault(require("uuid"));
 var _adfSchema = require("@atlaskit/adf-schema");
 var _analytics = require("@atlaskit/editor-common/analytics");
 var _messages = require("@atlaskit/editor-common/messages");
+var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _quickInsert = require("@atlaskit/editor-common/quick-insert");
+var _resource = require("@atlaskit/mention/resource");
+var _types = require("@atlaskit/mention/types");
+var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
 var _key = require("./pm-plugins/key");
 var _main = require("./pm-plugins/main");
 var _SecondaryToolbarComponent = require("./ui/SecondaryToolbarComponent");
 var _typeAhead = require("./ui/type-ahead");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 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 mentionsPlugin = exports.mentionsPlugin = function mentionsPlugin(_ref) {
-  var options = _ref.config,
+var processName = function processName(name, intl) {
+  var unknownLabel = intl.formatMessage(_messages.mentionMessages.unknownLabel);
+  if (name.status === _types.MentionNameStatus.OK) {
+    return "@".concat(name.name || unknownLabel);
+  } else {
+    return "@".concat(unknownLabel);
+  }
+};
+
+/**
+ * We will need to clean this up once mentionProvider is
+ * put inside mention plugin.
+ * See: https://product-fabric.atlassian.net/browse/ED-26011
+ */
+function Component(_ref) {
+  var mentionProvider = _ref.mentionProvider,
     api = _ref.api;
+  var mentionProviderMemo = (0, _react.useMemo)(function () {
+    return mentionProvider;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  var intl = (0, _reactIntlNext.useIntl)();
+  (0, _react.useEffect)(function () {
+    mentionProviderMemo === null || mentionProviderMemo === void 0 || mentionProviderMemo.then(function (mentionProviderSync) {
+      var _api$base;
+      api === null || api === void 0 || (_api$base = api.base) === null || _api$base === void 0 || (_api$base = _api$base.actions) === null || _api$base === void 0 || _api$base.registerMarks(function (_ref2) {
+        var tr = _ref2.tr,
+          node = _ref2.node,
+          pos = _ref2.pos;
+        var doc = tr.doc;
+        var schema = doc.type.schema;
+        var mentionNodeType = schema.nodes.mention;
+        var id = node.attrs.id;
+        if (node.type === mentionNodeType) {
+          if ((0, _resource.isResolvingMentionProvider)(mentionProviderSync)) {
+            var nameDetail = mentionProviderSync === null || mentionProviderSync === void 0 ? void 0 : mentionProviderSync.resolveMentionName(id);
+            var newText;
+            if ((0, _types.isPromise)(nameDetail)) {
+              newText = "@".concat(intl.formatMessage(_messages.mentionMessages.unknownLabel));
+            } else {
+              newText = processName(nameDetail, intl);
+            }
+            var currentPos = tr.mapping.map(pos);
+            tr.replaceWith(currentPos, currentPos + node.nodeSize, schema.text(newText, node.marks));
+          }
+        }
+      });
+    });
+  }, [mentionProviderMemo, api, intl]);
+  return null;
+}
+var mentionsPlugin = exports.mentionsPlugin = function mentionsPlugin(_ref3) {
+  var options = _ref3.config,
+    api = _ref3.api;
   var sessionId = (0, _uuid.default)();
+  var previousMediaProvider;
   var fireEvent = function fireEvent(payload, channel) {
     var _api$analytics;
     var fireAnalyticsEvent = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 || (_api$analytics = _api$analytics.actions) === null || _api$analytics === void 0 ? void 0 : _api$analytics.fireAnalyticsEvent;
@@ -53,13 +115,32 @@ var mentionsPlugin = exports.mentionsPlugin = function mentionsPlugin(_ref) {
       return [{
         name: 'mention',
         plugin: function plugin(pmPluginFactoryParams) {
-          return (0, _main.createMentionPlugin)(pmPluginFactoryParams, fireEvent, options);
+          return (0, _main.createMentionPlugin)({
+            pmPluginFactoryParams: pmPluginFactoryParams,
+            fireEvent: fireEvent,
+            options: options,
+            api: api
+          });
         }
       }];
     },
-    secondaryToolbarComponent: function secondaryToolbarComponent(_ref2) {
-      var editorView = _ref2.editorView,
-        disabled = _ref2.disabled;
+    contentComponent: function contentComponent(_ref4) {
+      var providerFactory = _ref4.providerFactory;
+      return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
+        providers: ['mentionProvider'],
+        providerFactory: providerFactory,
+        renderNode: function renderNode(_ref5) {
+          var mentionProvider = _ref5.mentionProvider;
+          return /*#__PURE__*/_react.default.createElement(Component, {
+            mentionProvider: mentionProvider,
+            api: api
+          });
+        }
+      });
+    },
+    secondaryToolbarComponent: function secondaryToolbarComponent(_ref6) {
+      var editorView = _ref6.editorView,
+        disabled = _ref6.disabled;
       return /*#__PURE__*/_react.default.createElement(_SecondaryToolbarComponent.SecondaryToolbarComponent, {
         editorView: editorView,
         api: api,
@@ -79,7 +160,51 @@ var mentionsPlugin = exports.mentionsPlugin = function mentionsPlugin(_ref) {
         if (options !== null && options !== void 0 && options.handleMentionsChanged) {
           options.handleMentionsChanged(mentionChanges);
         }
-      }
+      },
+      setProvider: function () {
+        var _setProvider = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(providerPromise) {
+          var _api$core$actions$exe;
+          var provider;
+          return _regenerator.default.wrap(function _callee$(_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                if ((0, _platformFeatureFlags.fg)('platform_editor_mention_provider_via_plugin_config')) {
+                  _context.next = 2;
+                  break;
+                }
+                return _context.abrupt("return", false);
+              case 2:
+                _context.next = 4;
+                return providerPromise;
+              case 4:
+                provider = _context.sent;
+                if (!(previousMediaProvider === provider)) {
+                  _context.next = 7;
+                  break;
+                }
+                return _context.abrupt("return", false);
+              case 7:
+                previousMediaProvider = provider;
+                return _context.abrupt("return", (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(function (_ref7) {
+                  var tr = _ref7.tr;
+                  return tr.setMeta(_key.mentionPluginKey, {
+                    action: _main.ACTIONS.SET_PROVIDER,
+                    params: {
+                      provider: provider
+                    }
+                  });
+                })) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false);
+              case 9:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        function setProvider(_x) {
+          return _setProvider.apply(this, arguments);
+        }
+        return setProvider;
+      }()
     },
     getSharedState: function getSharedState(editorState) {
       if (!editorState) {
@@ -91,8 +216,8 @@ var mentionsPlugin = exports.mentionsPlugin = function mentionsPlugin(_ref) {
       });
     },
     pluginsOptions: {
-      quickInsert: function quickInsert(_ref3) {
-        var formatMessage = _ref3.formatMessage;
+      quickInsert: function quickInsert(_ref8) {
+        var formatMessage = _ref8.formatMessage;
         return [{
           id: 'mention',
           title: formatMessage(_messages.toolbarInsertBlockMessages.mention),

package/dist/cjs/nodeviews/mention.js

@@ -6,25 +6,29 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.MentionNodeView = void 0;
 var _react = _interopRequireDefault(require("react"));
+var _hooks = require("@atlaskit/editor-common/hooks");
 var _providerFactory = require("@atlaskit/editor-common/provider-factory");
 var _Mention = require("../ui/Mention");
 var MentionNodeView = exports.MentionNodeView = function MentionNodeView(props) {
-  var providerFactory = props.providerFactory;
+  var providerFactory = props.providerFactory,
+    pluginInjectionApi = props.pluginInjectionApi;
   var _props$node$attrs = props.node.attrs,
     id = _props$node$attrs.id,
     text = _props$node$attrs.text,
     accessLevel = _props$node$attrs.accessLevel,
     localId = _props$node$attrs.localId;
+  var _useSharedPluginState = (0, _hooks.useSharedPluginState)(pluginInjectionApi, ['mention']),
+    mentionState = _useSharedPluginState.mentionState;
+  var mentionProvider = mentionState === null || mentionState === void 0 ? void 0 : mentionState.mentionProvider;
   var renderAssistiveTextWithProviders = function renderAssistiveTextWithProviders(providers) {
     var _props$options;
-    var _ref = providers,
-      mentionProvider = _ref.mentionProvider;
+    var mentionProviderPromise = mentionProvider ? Promise.resolve(mentionProvider) : providers.mentionProvider;
     var profilecardProvider = (_props$options = props.options) === null || _props$options === void 0 ? void 0 : _props$options.profilecardProvider;
     return /*#__PURE__*/_react.default.createElement(_Mention.Mention, {
       id: id,
       text: text,
       accessLevel: accessLevel,
-      mentionProvider: mentionProvider,
+      mentionProvider: mentionProviderPromise,
       profilecardProvider: profilecardProvider,
       localId: localId
     });

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

@@ -4,6 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+exports.ACTIONS = void 0;
 exports.createMentionPlugin = createMentionPlugin;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _analytics = require("@atlaskit/editor-common/analytics");
@@ -19,11 +20,11 @@ var _key = require("./key");
 var _utils2 = require("./utils");
 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 ACTIONS = {
+var ACTIONS = exports.ACTIONS = {
   SET_PROVIDER: 'SET_PROVIDER'
 };
 var PACKAGE_NAME = "@atlaskit/editor-plugin-mentions";
-var PACKAGE_VERSION = "2.10.9";
+var PACKAGE_VERSION = "2.11.1";
 var setProvider = function setProvider(provider) {
   return function (state, dispatch) {
     if (dispatch) {
@@ -37,7 +38,11 @@ var setProvider = function setProvider(provider) {
     return true;
   };
 };
-function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
+function createMentionPlugin(_ref) {
+  var pmPluginFactoryParams = _ref.pmPluginFactoryParams,
+    fireEvent = _ref.fireEvent,
+    options = _ref.options,
+    api = _ref.api;
   var mentionProvider;
   var sendAnalytics = function sendAnalytics(event, actionSubject, action, attributes
   // Ignored via go/ees005
@@ -68,12 +73,12 @@ function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
       // Ignored via go/ees005
       // eslint-disable-next-line @typescript-eslint/max-params
       apply: function apply(tr, pluginState, oldState, newState) {
-        var _ref = tr.getMeta(_key.mentionPluginKey) || {
+        var _ref2 = tr.getMeta(_key.mentionPluginKey) || {
             action: null,
             params: null
           },
-          action = _ref.action,
-          params = _ref.params;
+          action = _ref2.action,
+          params = _ref2.params;
         var hasNewPluginState = false;
         var newPluginState = pluginState;
         var hasPositionChanged = oldState.selection.from !== newState.selection.from || oldState.selection.to !== newState.selection.to;
@@ -104,6 +109,7 @@ function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
           Component: _mention.MentionNodeView,
           extraComponentProps: {
             providerFactory: pmPluginFactoryParams.providerFactory,
+            pluginInjectionApi: api,
             options: options
           }
         })
@@ -148,7 +154,12 @@ function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
         }
         return;
       };
-      pmPluginFactoryParams.providerFactory.subscribe('mentionProvider', providerHandler);
+      var providerViaConfig = (0, _platformFeatureFlags.fg)('platform_editor_mention_provider_via_plugin_config');
+      if (providerViaConfig && options !== null && options !== void 0 && options.mentionProvider) {
+        providerHandler('mentionProvider', options === null || options === void 0 ? void 0 : options.mentionProvider);
+      } else {
+        pmPluginFactoryParams.providerFactory.subscribe('mentionProvider', providerHandler);
+      }
       return {
         destroy: function destroy() {
           if (pmPluginFactoryParams.providerFactory) {
@@ -163,16 +174,16 @@ function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
           if (options !== null && options !== void 0 && options.handleMentionsChanged && (0, _platformFeatureFlags.fg)('confluence_updated_mentions_livepages')) {
             var mentionSchema = newState.schema.nodes.mention;
             var mentionNodesBefore = (0, _utils.findChildrenByType)(prevState.doc, mentionSchema);
-            var mentionLocalIdsAfter = new Set((0, _utils.findChildrenByType)(newState.doc, mentionSchema).map(function (_ref2) {
-              var node = _ref2.node;
+            var mentionLocalIdsAfter = new Set((0, _utils.findChildrenByType)(newState.doc, mentionSchema).map(function (_ref3) {
+              var node = _ref3.node;
               return node.attrs.localId;
             }));
             if (mentionNodesBefore.length > mentionLocalIdsAfter.size) {
-              var deletedMentions = mentionNodesBefore.filter(function (_ref3) {
-                var node = _ref3.node;
-                return !mentionLocalIdsAfter.has(node.attrs.localId);
-              }).map(function (_ref4) {
+              var deletedMentions = mentionNodesBefore.filter(function (_ref4) {
                 var node = _ref4.node;
+                return !mentionLocalIdsAfter.has(node.attrs.localId);
+              }).map(function (_ref5) {
+                var node = _ref5.node;
                 return {
                   type: 'deleted',
                   id: node.attrs.id,

package/dist/cjs/ui/type-ahead/index.js

@@ -167,6 +167,7 @@ var buildNodesForTeamMention = function buildNodesForTeamMention(schema, selecte
   // build team link
   var defaultTeamLink = "".concat(window.location.origin, "/people/team/").concat(teamId);
   var teamLink = context && context.teamLink ? context.teamLink : defaultTeamLink;
+  // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
   var teamLinkNode = (0, _platformFeatureFlags.fg)('team-mention-inline-smartlink') ? schema.nodes.inlineCard.create({
     url: teamLink
   }) :
@@ -238,7 +239,7 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
       var mentionProvider = pluginState.mentionProvider;
       var _ref8 = (_api$contextIdentifie = api === null || api === void 0 || (_api$contextIdentifie2 = api.contextIdentifier) === null || _api$contextIdentifie2 === void 0 ? void 0 : _api$contextIdentifie2.sharedState.currentState()) !== null && _api$contextIdentifie !== void 0 ? _api$contextIdentifie : {},
         contextIdentifierProvider = _ref8.contextIdentifierProvider;
-      return new Promise(function (resolve) {
+      return new Promise(function (resolve, reject) {
         var key = "loadingMentionsForTypeAhead_".concat((0, _uuid.default)());
         var mentionsSubscribeCallback = function mentionsSubscribeCallback(mentions) {
           var resultQuery = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
@@ -274,7 +275,13 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
           }
         };
         subscriptionKeys.add(key);
-        mentionProvider.subscribe(key, mentionsSubscribeCallback);
+        mentionProvider.subscribe(key, mentionsSubscribeCallback, function () {
+          if ((0, _platformFeatureFlags.fg)('platform_editor_offline_editing_ga')) {
+            mentionProvider.unsubscribe(key);
+            subscriptionKeys.delete(key);
+            reject('FETCH_ERROR');
+          }
+        });
         mentionProvider.filter(query || '', _objectSpread(_objectSpread({}, contextIdentifierProvider), {}, {
           sessionId: sessionId
         }));
@@ -299,7 +306,8 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
         name = _item$mention.name,
         nickname = _item$mention.nickname,
         accessLevel = _item$mention.accessLevel,
-        userType = _item$mention.userType;
+        userType = _item$mention.userType,
+        isXProductUser = _item$mention.isXProductUser;
       var trimmedNickname = nickname && nickname.startsWith('@') ? nickname.slice(1) : nickname;
       var renderName = mentionInsertDisplayName || !trimmedNickname ? name : trimmedNickname;
       var _ref10 = (_api$contextIdentifie3 = api === null || api === void 0 || (_api$contextIdentifie4 = api.contextIdentifier) === null || _api$contextIdentifie4 === void 0 ? void 0 : _api$contextIdentifie4.sharedState.currentState()) !== null && _api$contextIdentifie3 !== void 0 ? _api$contextIdentifie3 : {},
@@ -356,6 +364,9 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
       if (mentionProvider && (0, _utils4.isTeamType)(userType)) {
         return insert(buildNodesForTeamMention(schema, item.mention, mentionProvider, sanitizePrivateContent));
       }
+      if (isXProductUser && mentionProvider && mentionProvider.inviteXProductUser) {
+        mentionProvider.inviteXProductUser(id);
+      }
 
       // Don't insert into document if document data is sanitized.
       var text = sanitizePrivateContent ? '' : "@".concat(renderName);
@@ -363,15 +374,21 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
         // Cache (locally) for later rendering
         mentionProvider.cacheMentionName(id, renderName);
       }
-      var annotationMarksForPos = (0, _platformFeatureFlags.fg)('editor_inline_comments_paste_insert_nodes') ? (0, _utils.getAnnotationMarksForPos)(state.tr.selection.$head) : undefined;
+      var annotationMarksForPos = (0, _platformFeatureFlags.fg)(
+      // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+      'editor_inline_comments_paste_insert_nodes') ? (0, _utils.getAnnotationMarksForPos)(state.tr.selection.$head) : undefined;
       var mentionNode = schema.nodes.mention.createChecked({
         text: text,
         id: id,
         accessLevel: accessLevel,
         userType: userType === 'DEFAULT' ? null : userType,
         localId: mentionLocalId
-      }, null, (0, _platformFeatureFlags.fg)('editor_inline_comments_paste_insert_nodes') ? annotationMarksForPos : undefined);
-      var space = schema.text(' ', (0, _platformFeatureFlags.fg)('editor_inline_comments_paste_insert_nodes') ? annotationMarksForPos : undefined);
+      }, null,
+      // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+      (0, _platformFeatureFlags.fg)('editor_inline_comments_paste_insert_nodes') ? annotationMarksForPos : undefined);
+      var space = schema.text(' ',
+      // eslint-disable-next-line @atlaskit/platform/ensure-feature-flag-prefix
+      (0, _platformFeatureFlags.fg)('editor_inline_comments_paste_insert_nodes') ? annotationMarksForPos : undefined);
       return insert(_model.Fragment.from([mentionNode, space]));
     },
     dismiss: function dismiss(_ref11) {

package/dist/es2019/mentionsPlugin.js

@@ -1,18 +1,85 @@
-import React from 'react';
+import React, { useEffect, useMemo } from 'react';
+import { useIntl } from 'react-intl-next';
 import uuid from 'uuid';
 import { mention } from '@atlaskit/adf-schema';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
-import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { toolbarInsertBlockMessages as messages, mentionMessages } from '@atlaskit/editor-common/messages';
+import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { IconMention } from '@atlaskit/editor-common/quick-insert';
+import { isResolvingMentionProvider } from '@atlaskit/mention/resource';
+import { MentionNameStatus, isPromise } from '@atlaskit/mention/types';
+import { fg } from '@atlaskit/platform-feature-flags';
 import { mentionPluginKey } from './pm-plugins/key';
-import { createMentionPlugin } from './pm-plugins/main';
+import { ACTIONS, createMentionPlugin } from './pm-plugins/main';
 import { SecondaryToolbarComponent } from './ui/SecondaryToolbarComponent';
 import { createTypeAheadConfig } from './ui/type-ahead';
+const processName = (name, intl) => {
+  const unknownLabel = intl.formatMessage(mentionMessages.unknownLabel);
+  if (name.status === MentionNameStatus.OK) {
+    return `@${name.name || unknownLabel}`;
+  } else {
+    return `@${unknownLabel}`;
+  }
+};
+
+/**
+ * We will need to clean this up once mentionProvider is
+ * put inside mention plugin.
+ * See: https://product-fabric.atlassian.net/browse/ED-26011
+ */
+function Component({
+  mentionProvider,
+  api
+}) {
+  const mentionProviderMemo = useMemo(() => {
+    return mentionProvider;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  const intl = useIntl();
+  useEffect(() => {
+    mentionProviderMemo === null || mentionProviderMemo === void 0 ? void 0 : mentionProviderMemo.then(mentionProviderSync => {
+      var _api$base, _api$base$actions;
+      api === null || api === void 0 ? void 0 : (_api$base = api.base) === null || _api$base === void 0 ? void 0 : (_api$base$actions = _api$base.actions) === null || _api$base$actions === void 0 ? void 0 : _api$base$actions.registerMarks(({
+        tr,
+        node,
+        pos
+      }) => {
+        const {
+          doc
+        } = tr;
+        const {
+          schema
+        } = doc.type;
+        const {
+          mention: mentionNodeType
+        } = schema.nodes;
+        const {
+          id
+        } = node.attrs;
+        if (node.type === mentionNodeType) {
+          if (isResolvingMentionProvider(mentionProviderSync)) {
+            const nameDetail = mentionProviderSync === null || mentionProviderSync === void 0 ? void 0 : mentionProviderSync.resolveMentionName(id);
+            let newText;
+            if (isPromise(nameDetail)) {
+              newText = `@${intl.formatMessage(mentionMessages.unknownLabel)}`;
+            } else {
+              newText = processName(nameDetail, intl);
+            }
+            const currentPos = tr.mapping.map(pos);
+            tr.replaceWith(currentPos, currentPos + node.nodeSize, schema.text(newText, node.marks));
+          }
+        }
+      });
+    });
+  }, [mentionProviderMemo, api, intl]);
+  return null;
+}
 const mentionsPlugin = ({
   config: options,
   api
 }) => {
   const sessionId = uuid();
+  let previousMediaProvider;
   const fireEvent = (payload, channel) => {
     var _api$analytics, _api$analytics$action;
     const fireAnalyticsEvent = api === null || api === void 0 ? void 0 : (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : (_api$analytics$action = _api$analytics.actions) === null || _api$analytics$action === void 0 ? void 0 : _api$analytics$action.fireAnalyticsEvent;
@@ -43,9 +110,30 @@ const mentionsPlugin = ({
     pmPlugins() {
       return [{
         name: 'mention',
-        plugin: pmPluginFactoryParams => createMentionPlugin(pmPluginFactoryParams, fireEvent, options)
+        plugin: pmPluginFactoryParams => createMentionPlugin({
+          pmPluginFactoryParams,
+          fireEvent,
+          options,
+          api
+        })
       }];
     },
+    contentComponent({
+      providerFactory
+    }) {
+      return /*#__PURE__*/React.createElement(WithProviders, {
+        providers: ['mentionProvider'],
+        providerFactory: providerFactory,
+        renderNode: ({
+          mentionProvider
+        }) => {
+          return /*#__PURE__*/React.createElement(Component, {
+            mentionProvider: mentionProvider,
+            api: api
+          });
+        }
+      });
+    },
     secondaryToolbarComponent({
       editorView,
       disabled
@@ -69,6 +157,26 @@ const mentionsPlugin = ({
         if (options !== null && options !== void 0 && options.handleMentionsChanged) {
           options.handleMentionsChanged(mentionChanges);
         }
+      },
+      setProvider: async providerPromise => {
+        var _api$core$actions$exe;
+        if (!fg('platform_editor_mention_provider_via_plugin_config')) {
+          return false;
+        }
+        const provider = await providerPromise;
+        // Prevent someone trying to set the exact same provider twice for performance reasons
+        if (previousMediaProvider === provider) {
+          return false;
+        }
+        previousMediaProvider = provider;
+        return (_api$core$actions$exe = api === null || api === void 0 ? void 0 : api.core.actions.execute(({
+          tr
+        }) => tr.setMeta(mentionPluginKey, {
+          action: ACTIONS.SET_PROVIDER,
+          params: {
+            provider
+          }
+        }))) !== null && _api$core$actions$exe !== void 0 ? _api$core$actions$exe : false;
       }
     },
     getSharedState(editorState) {

package/dist/es2019/nodeviews/mention.js

@@ -1,9 +1,11 @@
 import React from 'react';
+import { useSharedPluginState } from '@atlaskit/editor-common/hooks';
 import { WithProviders } from '@atlaskit/editor-common/provider-factory';
 import { Mention } from '../ui/Mention';
 export const MentionNodeView = props => {
   const {
-    providerFactory
+    providerFactory,
+    pluginInjectionApi
   } = props;
   const {
     id,
@@ -11,17 +13,19 @@ export const MentionNodeView = props => {
     accessLevel,
     localId
   } = props.node.attrs;
+  const {
+    mentionState
+  } = useSharedPluginState(pluginInjectionApi, ['mention']);
+  const mentionProvider = mentionState === null || mentionState === void 0 ? void 0 : mentionState.mentionProvider;
   const renderAssistiveTextWithProviders = providers => {
     var _props$options;
-    const {
-      mentionProvider
-    } = providers;
+    const mentionProviderPromise = mentionProvider ? Promise.resolve(mentionProvider) : providers.mentionProvider;
     const profilecardProvider = (_props$options = props.options) === null || _props$options === void 0 ? void 0 : _props$options.profilecardProvider;
     return /*#__PURE__*/React.createElement(Mention, {
       id: id,
       text: text,
       accessLevel: accessLevel,
-      mentionProvider: mentionProvider,
+      mentionProvider: mentionProviderPromise,
       profilecardProvider: profilecardProvider,
       localId: localId
     });

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

@@ -9,11 +9,11 @@ import { MentionNodeView } from '../nodeviews/mention';
 import { MENTION_PROVIDER_REJECTED, MENTION_PROVIDER_UNDEFINED } from '../types';
 import { mentionPluginKey } from './key';
 import { canMentionBeCreatedInRange } from './utils';
-const ACTIONS = {
+export const ACTIONS = {
   SET_PROVIDER: 'SET_PROVIDER'
 };
 const PACKAGE_NAME = "@atlaskit/editor-plugin-mentions";
-const PACKAGE_VERSION = "2.10.9";
+const PACKAGE_VERSION = "2.11.1";
 const setProvider = provider => (state, dispatch) => {
   if (dispatch) {
     dispatch(state.tr.setMeta(mentionPluginKey, {
@@ -25,7 +25,12 @@ const setProvider = provider => (state, dispatch) => {
   }
   return true;
 };
-export function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
+export function createMentionPlugin({
+  pmPluginFactoryParams,
+  fireEvent,
+  options,
+  api
+}) {
   let mentionProvider;
   const sendAnalytics = (event, actionSubject, action, attributes
   // Ignored via go/ees005
@@ -96,6 +101,7 @@ export function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
           Component: MentionNodeView,
           extraComponentProps: {
             providerFactory: pmPluginFactoryParams.providerFactory,
+            pluginInjectionApi: api,
             options
           }
         })
@@ -140,7 +146,12 @@ export function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
         }
         return;
       };
-      pmPluginFactoryParams.providerFactory.subscribe('mentionProvider', providerHandler);
+      const providerViaConfig = fg('platform_editor_mention_provider_via_plugin_config');
+      if (providerViaConfig && options !== null && options !== void 0 && options.mentionProvider) {
+        providerHandler('mentionProvider', options === null || options === void 0 ? void 0 : options.mentionProvider);
+      } else {
+        pmPluginFactoryParams.providerFactory.subscribe('mentionProvider', providerHandler);
+      }
       return {
         destroy() {
           if (pmPluginFactoryParams.providerFactory) {