@atlaskit/editor-plugin-mentions 17.0.0 → 17.1.0

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

@@ -30,6 +30,7 @@ var _utils2 = require("../../pm-plugins/utils");
 var _InviteItem = _interopRequireWildcard(require("../InviteItem"));
 var _InviteItemWithEmailDomain = _interopRequireDefault(require("../InviteItem/InviteItemWithEmailDomain"));
 var _analytics = require("./analytics");
+var _MentionItemWithProfileCard = require("./MentionItemWithProfileCard");
 var _utils3 = require("./utils");
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != _typeof(e) && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
 function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t.return || t.return(); } finally { if (u) throw o; } } }; }
@@ -37,14 +38,8 @@ function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r)
 function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return 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; } // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
-var isAgentUserType = function isAgentUserType(userType) {
-  return userType === 'APP' || userType === 'AGENT';
-};
-var isAgentMention = function isAgentMention(mention) {
-  return isAgentUserType(mention.userType) || mention.appType === 'agent';
-};
 var isAgentTypeAheadItem = function isAgentTypeAheadItem(item) {
-  return item.mention ? isAgentMention(item.mention) : false;
+  return item.mention ? (0, _utils3.isAgentMention)(item.mention) : false;
 };
 
 // A non-selectable loading placeholder injected by the provider (e.g.
@@ -109,16 +104,24 @@ var withInviteItem = function withInviteItem(_ref3) {
     inviteItem]);
   };
 };
-var makeMentionToTypeaheadItem = function makeMentionToTypeaheadItem(useRefreshedItemHeight) {
+var makeMentionToTypeaheadItem = function makeMentionToTypeaheadItem(_ref4) {
+  var useRefreshedItemHeight = _ref4.useRefreshedItemHeight,
+    profilecardProvider = _ref4.profilecardProvider;
   return function (mention) {
     var itemHeight = useRefreshedItemHeight ? _item.MENTION_ITEM_HEIGHT_REFRESHED : _item.MENTION_ITEM_HEIGHT;
     return {
       title: mention.id,
-      render: function render(_ref4) {
-        var isSelected = _ref4.isSelected,
-          onClick = _ref4.onClick,
-          onHover = _ref4.onHover;
-        return /*#__PURE__*/_react.default.createElement(_item.MentionItem, {
+      render: function render(_ref5) {
+        var isSelected = _ref5.isSelected,
+          onClick = _ref5.onClick,
+          onHover = _ref5.onHover;
+        return (0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false) && (0, _platformFeatureFlags.fg)('platform_editor_mention_typeahead_profilecard') ? /*#__PURE__*/_react.default.createElement(_MentionItemWithProfileCard.MentionItemWithProfileCard, {
+          mention: mention,
+          selected: isSelected,
+          onSelection: onClick,
+          height: itemHeight,
+          profilecardProvider: profilecardProvider
+        }) : /*#__PURE__*/_react.default.createElement(_item.MentionItem, {
           mention: mention,
           selected: isSelected,
           onMouseEnter: onHover,
@@ -134,7 +137,9 @@ var makeMentionToTypeaheadItem = function makeMentionToTypeaheadItem(useRefreshe
   };
 };
 var mentionToTypeaheadItem = exports.mentionToTypeaheadItem = function mentionToTypeaheadItem(mention) {
-  return makeMentionToTypeaheadItem((0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false))(mention);
+  return makeMentionToTypeaheadItem({
+    useRefreshedItemHeight: (0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false)
+  })(mention);
 };
 
 /**
@@ -163,12 +168,12 @@ function memoize(fn
   };
 }
 var buildAndSendElementsTypeAheadAnalytics = function buildAndSendElementsTypeAheadAnalytics(fireEvent) {
-  return function (_ref5) {
-    var query = _ref5.query,
-      mentions = _ref5.mentions,
-      stats = _ref5.stats,
-      mentionTypeaheadSessionId = _ref5.mentionTypeaheadSessionId,
-      agentAnalytics = _ref5.agentAnalytics;
+  return function (_ref6) {
+    var query = _ref6.query,
+      mentions = _ref6.mentions,
+      stats = _ref6.stats,
+      mentionTypeaheadSessionId = _ref6.mentionTypeaheadSessionId,
+      agentAnalytics = _ref6.agentAnalytics;
     var duration = 0;
     var userOrTeamIds = null;
     var teams = null;
@@ -270,19 +275,19 @@ var buildNodesForTeamMention = function buildNodesForTeamMention(schema, selecte
  * `createTypeAheadConfig` and intentionally mutated here as a
  * side-effect — preserves the existing single-shot semantics.
  */
-var makeTransformMentionsToTypeAheadItems = function makeTransformMentionsToTypeAheadItems(_ref6) {
-  var fireEvent = _ref6.fireEvent,
-    getFirstQueryWithoutResults = _ref6.getFirstQueryWithoutResults,
-    setFirstQueryWithoutResults = _ref6.setFirstQueryWithoutResults,
-    toItem = _ref6.toItem,
-    enableAgentSectioning = _ref6.enableAgentSectioning;
-  return function (_ref7) {
-    var mentions = _ref7.mentions,
-      query = _ref7.query,
-      stats = _ref7.stats,
-      mentionProvider = _ref7.mentionProvider,
-      contextIdentifierProvider = _ref7.contextIdentifierProvider,
-      sessionId = _ref7.sessionId;
+var makeTransformMentionsToTypeAheadItems = function makeTransformMentionsToTypeAheadItems(_ref7) {
+  var fireEvent = _ref7.fireEvent,
+    getFirstQueryWithoutResults = _ref7.getFirstQueryWithoutResults,
+    setFirstQueryWithoutResults = _ref7.setFirstQueryWithoutResults,
+    toItem = _ref7.toItem,
+    enableAgentSectioning = _ref7.enableAgentSectioning;
+  return function (_ref8) {
+    var mentions = _ref8.mentions,
+      query = _ref8.query,
+      stats = _ref8.stats,
+      mentionProvider = _ref8.mentionProvider,
+      contextIdentifierProvider = _ref8.contextIdentifierProvider,
+      sessionId = _ref8.sessionId;
     var mentionItems = mentions.map(function (mention) {
       return toItem(mention);
     });
@@ -292,7 +297,7 @@ var makeTransformMentionsToTypeAheadItems = function makeTransformMentionsToType
     var realMentions = mentions.filter(function (mention) {
       return !isLoadingPlaceholder(mention);
     });
-    var agentCount = realMentions.filter(isAgentMention).length;
+    var agentCount = realMentions.filter(_utils3.isAgentMention).length;
     var agentAnalytics = {
       agentCount: agentCount,
       agentSectioningEnabled: enableAgentSectioning
@@ -329,17 +334,18 @@ var makeTransformMentionsToTypeAheadItems = function makeTransformMentionsToType
     })(mentionItems);
   };
 };
-var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeAheadConfig(_ref8) {
-  var sanitizePrivateContent = _ref8.sanitizePrivateContent,
-    mentionInsertDisplayName = _ref8.mentionInsertDisplayName,
-    fireEvent = _ref8.fireEvent,
-    HighlightComponent = _ref8.HighlightComponent,
-    api = _ref8.api,
-    handleMentionsChanged = _ref8.handleMentionsChanged,
-    _ref8$enableAgentSect = _ref8.enableAgentSectioning,
-    enableAgentSectioning = _ref8$enableAgentSect === void 0 ? false : _ref8$enableAgentSect,
-    _ref8$showAgentMentio = _ref8.showAgentMentionsLabsLozenge,
-    showAgentMentionsLabsLozenge = _ref8$showAgentMentio === void 0 ? false : _ref8$showAgentMentio;
+var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeAheadConfig(_ref9) {
+  var sanitizePrivateContent = _ref9.sanitizePrivateContent,
+    mentionInsertDisplayName = _ref9.mentionInsertDisplayName,
+    fireEvent = _ref9.fireEvent,
+    HighlightComponent = _ref9.HighlightComponent,
+    api = _ref9.api,
+    handleMentionsChanged = _ref9.handleMentionsChanged,
+    _ref9$enableAgentSect = _ref9.enableAgentSectioning,
+    enableAgentSectioning = _ref9$enableAgentSect === void 0 ? false : _ref9$enableAgentSect,
+    _ref9$showAgentMentio = _ref9.showAgentMentionsLabsLozenge,
+    showAgentMentionsLabsLozenge = _ref9$showAgentMentio === void 0 ? false : _ref9$showAgentMentio,
+    profilecardProvider = _ref9.profilecardProvider;
   // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
   var sessionId = (0, _uuid.default)();
   var firstQueryWithoutResults = null;
@@ -353,7 +359,10 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
     setFirstQueryWithoutResults: function setFirstQueryWithoutResults(query) {
       firstQueryWithoutResults = query;
     },
-    toItem: memoize(makeMentionToTypeaheadItem(enableAgentSectioning)).call
+    toItem: memoize(makeMentionToTypeaheadItem({
+      useRefreshedItemHeight: enableAgentSectioning,
+      profilecardProvider: profilecardProvider
+    })).call
   });
   var typeAhead = {
     id: _typeAhead.TypeAheadAvailableNodes.MENTION,
@@ -368,17 +377,17 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
       }
       return null;
     },
-    getItems: function getItems(_ref9) {
+    getItems: function getItems(_ref0) {
       var _api$contextIdentifie, _api$contextIdentifie2;
-      var query = _ref9.query,
-        editorState = _ref9.editorState;
+      var query = _ref0.query,
+        editorState = _ref0.editorState;
       var pluginState = (0, _utils2.getMentionPluginState)(editorState);
       if (!(pluginState !== null && pluginState !== void 0 && pluginState.mentionProvider)) {
         return Promise.resolve([]);
       }
       var mentionProvider = pluginState.mentionProvider;
-      var _ref0 = (_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 = _ref0.contextIdentifierProvider;
+      var _ref1 = (_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 = _ref1.contextIdentifierProvider;
       return new Promise(function (resolve, reject) {
         // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
         var key = "loadingMentionsForTypeAhead_".concat((0, _uuid.default)());
@@ -413,8 +422,8 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
         }));
       });
     },
-    getSections: function getSections(_ref1) {
-      var intl = _ref1.intl;
+    getSections: function getSections(_ref10) {
+      var intl = _ref10.intl;
       if (!enableAgentSectioning) {
         return [];
       }
@@ -448,12 +457,12 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
     onOpen: function onOpen() {
       firstQueryWithoutResults = null;
     },
-    selectItem: function selectItem(state, item, insert, _ref10) {
+    selectItem: function selectItem(state, item, insert, _ref11) {
       var _api$contextIdentifie3, _api$contextIdentifie4;
-      var mode = _ref10.mode,
-        stats = _ref10.stats,
-        query = _ref10.query,
-        sourceListItem = _ref10.sourceListItem;
+      var mode = _ref11.mode,
+        stats = _ref11.stats,
+        query = _ref11.query,
+        sourceListItem = _ref11.sourceListItem;
       var schema = state.schema;
 
       // Placeholder isn't selectable. Return `false` (not a transaction) so
@@ -470,12 +479,12 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
         accessLevel = _item$mention.accessLevel,
         userType = _item$mention.userType,
         isXProductUser = _item$mention.isXProductUser;
-      var _ref11 = (_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 : {},
-        contextIdentifierProvider = _ref11.contextIdentifierProvider;
+      var _ref12 = (_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 : {},
+        contextIdentifierProvider = _ref12.contextIdentifierProvider;
       var mentionContext = _objectSpread(_objectSpread({}, contextIdentifierProvider), {}, {
         sessionId: sessionId
       });
-      var isAgentMentionSelection = isAgentMention(item.mention);
+      var isAgentMentionSelection = (0, _utils3.isAgentMention)(item.mention);
       var isAgentMentionInsertion = isAgentMentionSelection && (0, _expVal.expVal)('platform_editor_agent_mentions', 'isEnabled', false);
       // userType can be missing for provider-only agent mentions. Copy/paste cannot
       // see appType, so persist APP only when there is no explicit userType.
@@ -598,11 +607,11 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
       }
       return tr;
     },
-    dismiss: function dismiss(_ref12) {
-      var editorState = _ref12.editorState,
-        query = _ref12.query,
-        stats = _ref12.stats,
-        wasItemInserted = _ref12.wasItemInserted;
+    dismiss: function dismiss(_ref13) {
+      var editorState = _ref13.editorState,
+        query = _ref13.query,
+        stats = _ref13.stats,
+        wasItemInserted = _ref13.wasItemInserted;
       firstQueryWithoutResults = null;
       var pickerElapsedTime = stats.startedAt ? performance.now() - stats.startedAt : 0;
       if (!wasItemInserted) {
@@ -646,10 +655,10 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
    * so we only attach it when the gate is on — otherwise the proven
    * single-shot `getItems` path continues to drive every consumer.
    */
-  var subscribeToItemsUpdates = function subscribeToItemsUpdates(_ref13) {
+  var subscribeToItemsUpdates = function subscribeToItemsUpdates(_ref14) {
     var _api$contextIdentifie5, _api$contextIdentifie6;
-    var query = _ref13.query,
-      editorState = _ref13.editorState;
+    var query = _ref14.query,
+      editorState = _ref14.editorState;
     var pluginState = (0, _utils2.getMentionPluginState)(editorState);
     if (!(pluginState !== null && pluginState !== void 0 && pluginState.mentionProvider)) {
       return {
@@ -660,8 +669,8 @@ var createTypeAheadConfig = exports.createTypeAheadConfig = function createTypeA
       };
     }
     var mentionProvider = pluginState.mentionProvider;
-    var _ref14 = (_api$contextIdentifie5 = api === null || api === void 0 || (_api$contextIdentifie6 = api.contextIdentifier) === null || _api$contextIdentifie6 === void 0 ? void 0 : _api$contextIdentifie6.sharedState.currentState()) !== null && _api$contextIdentifie5 !== void 0 ? _api$contextIdentifie5 : {},
-      contextIdentifierProvider = _ref14.contextIdentifierProvider;
+    var _ref15 = (_api$contextIdentifie5 = api === null || api === void 0 || (_api$contextIdentifie6 = api.contextIdentifier) === null || _api$contextIdentifie6 === void 0 ? void 0 : _api$contextIdentifie6.sharedState.currentState()) !== null && _api$contextIdentifie5 !== void 0 ? _api$contextIdentifie5 : {},
+      contextIdentifierProvider = _ref15.contextIdentifierProvider;
 
     // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
     var key = "loadingMentionsForTypeAhead_".concat((0, _uuid.default)());

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.shouldKeepInviteItem = exports.isTeamType = exports.isTeamStats = exports.isInviteItem = void 0;
+exports.shouldKeepInviteItem = exports.isTeamType = exports.isTeamStats = exports.isInviteItem = exports.isAgentUserType = exports.isAgentMention = void 0;
 var _InviteItem = require("../InviteItem");
 // Ignored via go/ees005
 // eslint-disable-next-line require-unicode-regexp
@@ -23,6 +23,12 @@ var isTeamStats = exports.isTeamStats = function isTeamStats(stat) {
 var isInviteItem = exports.isInviteItem = function isInviteItem(mention) {
   return mention && mention.id === _InviteItem.INVITE_ITEM_DESCRIPTION.id;
 };
+var isAgentUserType = exports.isAgentUserType = function isAgentUserType(userType) {
+  return userType === 'APP' || userType === 'AGENT';
+};
+var isAgentMention = exports.isAgentMention = function isAgentMention(mention) {
+  return isAgentUserType(mention.userType) || mention.appType === 'agent';
+};
 
 /**
  * Actions

package/dist/cjs/ui/useFocusTrap.js

@@ -14,9 +14,11 @@ var _focusTrap = _interopRequireDefault(require("focus-trap"));
  */
 
 var useFocusTrap = exports.useFocusTrap = function useFocusTrap(_ref) {
-  var targetRef = _ref.targetRef;
+  var targetRef = _ref.targetRef,
+    _ref$enabled = _ref.enabled,
+    enabled = _ref$enabled === void 0 ? true : _ref$enabled;
   (0, _react.useEffect)(function () {
-    if (!targetRef) {
+    if (!targetRef || !enabled) {
       return;
     }
     var trapConfig = {
@@ -40,5 +42,5 @@ var useFocusTrap = exports.useFocusTrap = function useFocusTrap(_ref) {
       }
       focusTrap.deactivate();
     };
-  }, [targetRef]);
+  }, [targetRef, enabled]);
 };

package/dist/es2019/mentionsPlugin.js

@@ -5,11 +5,11 @@ import uuid from 'uuid';
 import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 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 { IconMention } from '@atlaskit/editor-common/assets';
 import { isResolvingMentionProvider } from '@atlaskit/mention/resource';
 import { MentionNameStatus, isPromise } from '@atlaskit/mention/types';
 import { isExperimentEnabled } from '@atlaskit/platform-feature-experiments/is-experiment-enabled';
-import { fg } from '@atlaskit/platform-feature-flags';
+import { fg } from '@atlaskit/platform-feature-flags/fg';
 import { editorExperiment } from '@atlaskit/tmp-editor-statsig/experiments';
 import { insertMention } from './editor-commands';
 import { mentionNodeSpec } from './nodeviews/mentionNodeSpec';
@@ -19,6 +19,7 @@ import { ACTIONS, createMentionPlugin } from './pm-plugins/main';
 import { InlineInvitePopupContainer } from './ui/InlineInvitePopupContainer';
 import { SecondaryToolbarComponent } from './ui/SecondaryToolbarComponent';
 import { createTypeAheadConfig } from './ui/type-ahead';
+import { getMentionQuickInsertComponents } from './ui/quick-insert/getMentionQuickInsertComponents';
 const processName = (name, intl) => {
   const unknownLabel = intl.formatMessage(mentionMessages.unknownLabel);
   if (name.status === MentionNameStatus.OK) {
@@ -106,9 +107,18 @@ const mentionsPlugin = ({
     handleMentionsChanged: options === null || options === void 0 ? void 0 : options.handleMentionsChanged,
     enableAgentSectioning: options === null || options === void 0 ? void 0 : options.enableAgentSectioning,
     showAgentMentionsLabsLozenge: options === null || options === void 0 ? void 0 : options.showAgentMentionsLabsLozenge,
+    profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
     fireEvent,
     api
   });
+  const isRegisteredSlashCommandEnabled = isExperimentEnabled('platform_editor_slash_command');
+  if (isRegisteredSlashCommandEnabled) {
+    var _api$uiControlRegistr;
+    api === null || api === void 0 ? void 0 : (_api$uiControlRegistr = api.uiControlRegistry) === null || _api$uiControlRegistr === void 0 ? void 0 : _api$uiControlRegistr.actions.register(getMentionQuickInsertComponents({
+      api,
+      typeAhead
+    }));
+  }
   return {
     name: 'mention',
     nodes() {
@@ -256,7 +266,7 @@ const mentionsPlugin = ({
       };
     },
     pluginsOptions: {
-      quickInsert: ({
+      quickInsert: isRegisteredSlashCommandEnabled ? undefined : ({
         formatMessage
       }) => [{
         id: 'mention',

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

@@ -51,7 +51,7 @@ const AI_STREAMING_TRANSFORMATION_META_KEY = 'isAIStreamingTransformation';
 const AGENT_MENTION_INACTIVITY_MS = 3000;
 const MAX_PENDING_TYPED_AGENT_MENTION_FOCUS_DEFERS = 20;
 const PACKAGE_NAME = "@atlaskit/editor-plugin-mentions";
-const PACKAGE_VERSION = "16.2.0";
+const PACKAGE_VERSION = "17.0.1";
 const setProvider = provider => (state, dispatch) => {
   if (dispatch) {
     dispatch(state.tr.setMeta(mentionPluginKey, {

package/dist/es2019/ui/AnchoredPopup.js

@@ -24,5 +24,10 @@ export function AnchoredPopup({
     placement: "bottom-start",
     content: renderContent,
     trigger: renderTrigger
+    // Drops this popup's own `overflow: auto`, which otherwise clips the role picker's
+    // menu — it renders as a normal DOM child here (not a body portal) so it stays inside
+    // this popup's focus trap.
+    ,
+    shouldRenderToParent: true
   });
 }

package/dist/es2019/ui/InlineInvitePopupContainer.js

@@ -90,7 +90,6 @@ export const InlineInvitePopupContainer = ({
     }
     const invitedUser = (_result$invited$ = result.invited[0]) !== null && _result$invited$ !== void 0 ? _result$invited$ : result.requested[0];
     if (!invitedUser || !(api !== null && api !== void 0 && (_api$core2 = api.core) !== null && _api$core2 !== void 0 && (_api$core2$actions = _api$core2.actions) !== null && _api$core2$actions !== void 0 && _api$core2$actions.execute) || !(api !== null && api !== void 0 && (_api$mention = api.mention) !== null && _api$mention !== void 0 && (_api$mention$commands = _api$mention.commands) !== null && _api$mention$commands !== void 0 && _api$mention$commands.insertMention)) {
-      removePendingMention();
       return;
     }
     const {
@@ -111,7 +110,7 @@ export const InlineInvitePopupContainer = ({
     }));
     pendingMentionRef.current = null;
     setAnchorElement(null);
-  }, [api, removePendingMention]);
+  }, [api]);
   const handleReady = useCallback(show => {
     if (!provider) {
       return;

package/dist/es2019/ui/PopperWrapper.js

@@ -1,6 +1,6 @@
 import React, { useRef, useLayoutEffect, useEffect, Suspense } from 'react';
 import { fg } from '@atlaskit/platform-feature-flags';
-import { Popper as ReactPopper } from '@atlaskit/popper';
+import { Popper as ReactPopper } from '@atlaskit/popper/main';
 import Portal from '@atlaskit/portal';
 import { layers } from '@atlaskit/theme/constants';
 import { expVal } from '@atlaskit/tmp-editor-statsig/expVal';
@@ -73,20 +73,22 @@ function useResizeAwarePopper({
  */
 export function Popup({
   referenceElement,
-  children
+  children,
+  placement = 'bottom-end',
+  offset = [0, 8],
+  disableFocusTrap = false
 }) {
   const [targetRef, setPopupRef] = React.useState(null);
   useFocusTrap({
-    targetRef: targetRef
+    targetRef: targetRef,
+    enabled: !disableFocusTrap
   });
   return /*#__PURE__*/React.createElement(Suspense, null, /*#__PURE__*/React.createElement(Portal, {
     zIndex: layers.modal()
   }, /*#__PURE__*/React.createElement(ReactPopper, {
-    referenceElement: referenceElement
-    // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
-    ,
-    offset: [0, 8],
-    placement: "bottom-end",
+    referenceElement: referenceElement,
+    offset: offset,
+    placement: placement,
     strategy: "fixed"
     // eslint-disable-next-line @atlassian/perf-linting/no-unstable-inline-props -- Ignored via go/ees017 (to be fixed)
     ,

package/dist/es2019/ui/ProfileCardComponent.js

@@ -84,7 +84,11 @@ export function ProfileCardComponent({
   activeMention,
   dom,
   closeComponent,
-  onAgentMentionChatClick
+  onAgentMentionChatClick,
+  placement,
+  offset,
+  disableFocusTrap,
+  hideActions
 }) {
   var _ref;
   const [provider, setProvider] = useState(undefined);
@@ -111,20 +115,28 @@ export function ProfileCardComponent({
   });
   if (!expVal('platform_editor_agent_mentions', 'isEnabled', false)) {
     return /*#__PURE__*/React.createElement(Popup, {
-      referenceElement: dom
+      referenceElement: dom,
+      placement: placement,
+      offset: offset,
+      disableFocusTrap: disableFocusTrap
     }, /*#__PURE__*/React.createElement(UserProfileCardContent, {
       accessLevel: accessLevel,
       id: id,
       provider: provider,
-      text: text
+      text: text,
+      hideActions: hideActions
     }));
   }
   const isAgentMention = isAgentMentionType(userType);
   return /*#__PURE__*/React.createElement(Popup, {
-    referenceElement: dom
+    referenceElement: dom,
+    placement: placement,
+    offset: offset,
+    disableFocusTrap: disableFocusTrap
   }, isAgentMention && provider && id ? /*#__PURE__*/React.createElement(AgentProfileCardContent, {
     accountId: id,
     provider: provider,
+    hideActions: hideActions,
     text: expVal('platform_editor_reduced_agent_profile_cards', 'isEnabled', false) ? text : undefined,
     onChatClick: onAgentMentionChatClick && fg('platform_editor_agent_mentions_drop_one_fixes') ? (event, agentStudioId) =>
     // agentMentionContext is already captured in the onAgentMentionChatClick
@@ -134,16 +146,18 @@ export function ProfileCardComponent({
     accessLevel: accessLevel,
     id: id,
     provider: provider,
-    text: text
+    text: text,
+    hideActions: hideActions
   }));
 }
 const UserProfileCardContent = ({
   accessLevel,
   id,
   provider,
-  text
+  text,
+  hideActions
 }) => {
-  const actions = useMemo(() => provider === null || provider === void 0 ? void 0 : provider.getActions(id, text !== null && text !== void 0 ? text : '', accessLevel), [accessLevel, id, provider, text]);
+  const actions = useMemo(() => hideActions ? [] : provider === null || provider === void 0 ? void 0 : provider.getActions(id, text !== null && text !== void 0 ? text : '', accessLevel), [hideActions, accessLevel, id, provider, text]);
   const {
     data,
     reportingLinesData,
@@ -186,7 +200,8 @@ const AgentProfileCardContent = ({
   accountId,
   provider,
   text,
-  onChatClick
+  onChatClick,
+  hideActions
 }) => {
   const agentName = (text !== null && text !== void 0 ? text : '').replace(LEADING_AT_SIGN_RE, '');
   return expVal('platform_editor_reduced_agent_profile_cards', 'isEnabled', false) ? /*#__PURE__*/React.createElement(AgentProfileCardResourcedLazy, {
@@ -194,11 +209,21 @@ const AgentProfileCardContent = ({
     cloudId: provider.cloudId,
     resourceClient: provider.resourceClient,
     agentName: agentName,
-    onChatClick: onChatClick
+    onChatClick: onChatClick,
+    hideAgentActions: hideActions,
+    hideConversationStarters: hideActions,
+    hideStarButton: hideActions,
+    hideAiDisclaimer: hideActions,
+    showCreatorNameWithoutLink: hideActions
   }) : /*#__PURE__*/React.createElement(AgentProfileCardResourcedLazy, {
     accountId: accountId,
     cloudId: provider.cloudId,
     resourceClient: provider.resourceClient,
-    onChatClick: onChatClick
+    onChatClick: onChatClick,
+    hideAgentActions: hideActions,
+    hideConversationStarters: hideActions,
+    hideStarButton: hideActions,
+    hideAiDisclaimer: hideActions,
+    showCreatorNameWithoutLink: hideActions
   });
 };

package/dist/es2019/ui/quick-insert/MentionQuickInsertMenuItem.js

@@ -0,0 +1,36 @@
+import React, { useCallback } from 'react';
+import { useIntl } from 'react-intl';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
+import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { IconMention } from '@atlaskit/editor-common/assets';
+import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
+import { mentionPluginKey } from '../../pm-plugins/key';
+export const MentionQuickInsertMenuItem = ({
+  api,
+  typeAhead
+}) => {
+  const {
+    formatMessage
+  } = useIntl();
+  const onSelect = useCallback(({
+    editorView,
+    insert
+  }) => {
+    var _mentionPluginKey$get, _api$typeAhead;
+    if (((_mentionPluginKey$get = mentionPluginKey.getState(editorView.state)) === null || _mentionPluginKey$get === void 0 ? void 0 : _mentionPluginKey$get.canInsertMention) === false) {
+      return false;
+    }
+    const tr = insert(undefined);
+    api === null || api === void 0 ? void 0 : (_api$typeAhead = api.typeAhead) === null || _api$typeAhead === void 0 ? void 0 : _api$typeAhead.actions.openAtTransaction({
+      triggerHandler: typeAhead,
+      inputMethod: INPUT_METHOD.QUICK_INSERT
+    })(tr);
+    return tr;
+  }, [api, typeAhead]);
+  return /*#__PURE__*/React.createElement(QuickInsertMenuItem, {
+    iconBefore: /*#__PURE__*/React.createElement(IconMention, null),
+    onSelect: onSelect,
+    shortcut: "@",
+    title: formatMessage(messages.mention)
+  });
+};

package/dist/es2019/ui/quick-insert/getMentionQuickInsertComponents.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages';
+import { createQuickInsertMatcher } from '@atlaskit/editor-common/quick-insert/create-quick-insert-matcher';
+import { MEDIA_SECTION, MENTION_MENU_ITEM } from '@atlaskit/editor-common/quick-insert/keys';
+import { MEDIA_SECTION_RANK } from '@atlaskit/editor-common/quick-insert/rank';
+import { MentionQuickInsertMenuItem } from './MentionQuickInsertMenuItem';
+export const getMentionQuickInsertComponents = ({
+  api,
+  typeAhead
+}) => [{
+  key: MENTION_MENU_ITEM.key,
+  type: MENTION_MENU_ITEM.type,
+  parents: [{
+    key: MEDIA_SECTION.key,
+    type: MEDIA_SECTION.type,
+    rank: MEDIA_SECTION_RANK[MENTION_MENU_ITEM.key]
+  }],
+  match: createQuickInsertMatcher(({
+    formatMessage
+  }) => ({
+    description: formatMessage(messages.mentionDescription),
+    keywords: ['team', 'user'],
+    shortcut: '@',
+    title: formatMessage(messages.mention)
+  })),
+  component: () => /*#__PURE__*/React.createElement(MentionQuickInsertMenuItem, {
+    api: api,
+    typeAhead: typeAhead
+  })
+}];