@atlaskit/editor-plugin-mentions 0.1.0

package/.eslintrc.js

@@ -0,0 +1,7 @@
+module.exports = {
+  rules: {
+    '@atlaskit/design-system/consistent-css-prop-usage': 'warn',
+    '@repo/internal/react/no-class-components': 'warn',
+    '@atlaskit/design-system/consistent-css-prop-usage': 'warn',
+  },
+};

package/CHANGELOG.md

@@ -0,0 +1 @@
+# @atlaskit/editor-plugin-mentions

package/LICENSE.md

@@ -0,0 +1,13 @@
+Copyright 2023 Atlassian Pty Ltd
+
+Licensed under the Apache License, Version 2.0 (the "License");
+you may not use this file except in compliance with the License.
+You may obtain a copy of the License at
+
+    http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing, software
+distributed under the License is distributed on an "AS IS" BASIS,
+WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+See the License for the specific language governing permissions and
+limitations under the License.

package/README.md

@@ -0,0 +1,9 @@
+# EditorPluginMentions
+
+Mentions plugin for @atlaskit/editor-core
+
+## Usage
+
+`import EditorPluginMentions from '@atlaskit/editor-plugin-mentions';`
+
+Detailed docs and example usage can be found [here](https://atlaskit.atlassian.com/packages/editor/editor-plugin-mentions).

package/dist/cjs/analytics.js

@@ -0,0 +1,157 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildTypeAheadRenderedPayload = exports.buildTypeAheadInviteItemViewedPayload = exports.buildTypeAheadInviteItemClickedPayload = exports.buildTypeAheadInviteExposurePayload = exports.buildTypeAheadInsertedPayload = exports.buildTypeAheadCancelPayload = exports.buildAnalyticsPayload = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _analyticsGasTypes = require("@atlaskit/analytics-gas-types");
+var _resource = require("@atlaskit/mention/resource");
+var _utils = 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 componentName = 'mention';
+var buildAnalyticsPayload = exports.buildAnalyticsPayload = function buildAnalyticsPayload(actionSubject, action, eventType, sessionId) {
+  var otherAttributes = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+  var tags = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : [];
+  return {
+    action: action,
+    actionSubject: actionSubject,
+    eventType: eventType,
+    attributes: _objectSpread({
+      componentName: componentName,
+      sessionId: sessionId
+    }, otherAttributes),
+    tags: tags
+  };
+};
+var emptyQueryResponse = {
+  queryLength: 0,
+  spaceInQuery: false
+};
+var extractAttributesFromQuery = function extractAttributesFromQuery(query) {
+  if (query) {
+    return {
+      queryLength: query.length,
+      spaceInQuery: query.indexOf(' ') !== -1
+    };
+  }
+  return emptyQueryResponse;
+};
+var buildTypeAheadCancelPayload = exports.buildTypeAheadCancelPayload = function buildTypeAheadCancelPayload(duration, upKeyCount, downKeyCount, sessionId, query) {
+  var _extractAttributesFro = extractAttributesFromQuery(query),
+    queryLength = _extractAttributesFro.queryLength,
+    spaceInQuery = _extractAttributesFro.spaceInQuery;
+  return buildAnalyticsPayload('mentionTypeahead', 'cancelled', _analyticsGasTypes.UI_EVENT_TYPE, sessionId, {
+    duration: duration,
+    downKeyCount: downKeyCount,
+    upKeyCount: upKeyCount,
+    queryLength: queryLength,
+    spaceInQuery: spaceInQuery
+  });
+};
+var getPosition = function getPosition(mentionList, selectedMention) {
+  if (mentionList) {
+    var index = mentionList.findIndex(function (mention) {
+      return mention.id === selectedMention.id;
+    });
+    return index === -1 ? undefined : index;
+  }
+  return;
+};
+var isClicked = function isClicked(insertType) {
+  return insertType === 'selected';
+};
+var buildTypeAheadInviteItemViewedPayload = exports.buildTypeAheadInviteItemViewedPayload = function buildTypeAheadInviteItemViewedPayload(sessionId, contextIdentifierProvider, userRole) {
+  var _ref = contextIdentifierProvider || {},
+    containerId = _ref.containerId,
+    objectId = _ref.objectId,
+    childObjectId = _ref.childObjectId;
+  return buildAnalyticsPayload('inviteItem', 'rendered', _analyticsGasTypes.UI_EVENT_TYPE, sessionId, {
+    containerId: containerId,
+    objectId: objectId,
+    childObjectId: childObjectId,
+    userRole: userRole
+  });
+};
+var buildTypeAheadInviteExposurePayload = exports.buildTypeAheadInviteExposurePayload = function buildTypeAheadInviteExposurePayload(sessionId, contextIdentifierProvider, inviteExperimentCohort, userRole) {
+  var _ref2 = contextIdentifierProvider || {},
+    containerId = _ref2.containerId,
+    objectId = _ref2.objectId,
+    childObjectId = _ref2.childObjectId;
+  return buildAnalyticsPayload('feature', 'exposed', _analyticsGasTypes.OPERATIONAL_EVENT_TYPE, sessionId, {
+    flagKey: 'confluence.frontend.invite.from.mention',
+    value: inviteExperimentCohort || 'not-enrolled',
+    containerId: containerId,
+    objectId: objectId,
+    childObjectId: childObjectId,
+    userRole: userRole
+  }, ['measurement', 'hasCustomAttributes']);
+};
+var buildTypeAheadInviteItemClickedPayload = exports.buildTypeAheadInviteItemClickedPayload = function buildTypeAheadInviteItemClickedPayload(duration, upKeyCount, downKeyCount, sessionId, insertType, query, contextIdentifierProvider, userRole) {
+  var _extractAttributesFro2 = extractAttributesFromQuery(query),
+    queryLength = _extractAttributesFro2.queryLength,
+    spaceInQuery = _extractAttributesFro2.spaceInQuery;
+  var _ref3 = contextIdentifierProvider || {},
+    containerId = _ref3.containerId,
+    objectId = _ref3.objectId,
+    childObjectId = _ref3.childObjectId;
+  return buildAnalyticsPayload('inviteItem', isClicked(insertType) ? 'clicked' : 'pressed', _analyticsGasTypes.UI_EVENT_TYPE, sessionId, {
+    duration: duration,
+    queryLength: queryLength,
+    spaceInQuery: spaceInQuery,
+    upKeyCount: upKeyCount,
+    downKeyCount: downKeyCount,
+    containerId: containerId,
+    objectId: objectId,
+    childObjectId: childObjectId,
+    userRole: userRole
+  });
+};
+var buildTypeAheadInsertedPayload = exports.buildTypeAheadInsertedPayload = function buildTypeAheadInsertedPayload(duration, upKeyCount, downKeyCount, sessionId, insertType, mention, mentionList, query, contextIdentifierProvider) {
+  var _extractAttributesFro3 = extractAttributesFromQuery(query),
+    queryLength = _extractAttributesFro3.queryLength,
+    spaceInQuery = _extractAttributesFro3.spaceInQuery;
+  var analyticsPayload = buildAnalyticsPayload('mentionTypeahead', isClicked(insertType) ? 'clicked' : 'pressed', _analyticsGasTypes.UI_EVENT_TYPE, sessionId, {
+    duration: duration,
+    position: getPosition(mentionList, mention),
+    keyboardKey: isClicked(insertType) ? undefined : insertType,
+    source: mention.source,
+    queryLength: queryLength,
+    spaceInQuery: spaceInQuery,
+    isSpecial: (0, _resource.isSpecialMention)(mention),
+    accessLevel: mention.accessLevel || '',
+    userType: mention.userType,
+    userId: mention.id,
+    upKeyCount: upKeyCount,
+    downKeyCount: downKeyCount,
+    memberCount: (0, _utils.isTeamType)(mention.userType) && mention.context ? mention.context.memberCount : null,
+    includesYou: (0, _utils.isTeamType)(mention.userType) && mention.context ? mention.context.includesYou : null
+  });
+  if (contextIdentifierProvider) {
+    analyticsPayload.containerId = contextIdentifierProvider.containerId || undefined;
+    analyticsPayload.objectId = contextIdentifierProvider.objectId || undefined;
+    analyticsPayload.childObjectId = contextIdentifierProvider.childObjectId || undefined;
+  }
+  return analyticsPayload;
+};
+var buildTypeAheadRenderedPayload = exports.buildTypeAheadRenderedPayload = function buildTypeAheadRenderedPayload(duration, userIds, query, teams) {
+  var _extractAttributesFro4 = extractAttributesFromQuery(query),
+    queryLength = _extractAttributesFro4.queryLength,
+    spaceInQuery = _extractAttributesFro4.spaceInQuery;
+  var actionSubject = userIds ? 'mentionTypeahead' : 'teamMentionTypeahead';
+  return {
+    action: 'rendered',
+    actionSubject: actionSubject,
+    eventType: _analyticsGasTypes.OPERATIONAL_EVENT_TYPE,
+    attributes: {
+      componentName: componentName,
+      duration: duration,
+      userIds: userIds,
+      teams: teams,
+      queryLength: queryLength,
+      spaceInQuery: spaceInQuery
+    }
+  };
+};

package/dist/cjs/index.js

@@ -0,0 +1,12 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "mentionsPlugin", {
+  enumerable: true,
+  get: function get() {
+    return _plugin.mentionsPlugin;
+  }
+});
+var _plugin = require("./plugin");

package/dist/cjs/messages.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.messages = void 0;
+var _reactIntlNext = require("react-intl-next");
+var messages = exports.messages = (0, _reactIntlNext.defineMessages)({
+  inviteItemTitle: {
+    id: 'fabric.editor.inviteItem.title',
+    defaultMessage: '{userRole, select, admin {Invite} trusted {Invite} other {Add}} teammate to {productName}',
+    description: 'Title of the invite teammate item in typeahead plugin'
+  },
+  mentionsAddLabel: {
+    id: 'fabric.editor.mentionsAddLabel',
+    defaultMessage: 'add-icon',
+    description: 'icon label to describe adding a new mention'
+  },
+  mentionsIconLabel: {
+    id: 'fabric.editor.mentionsIconLabel',
+    defaultMessage: 'Mention',
+    description: 'icon label to describe the mention icon'
+  },
+  mentionsNodeLabel: {
+    id: 'fabric.editor.mentionNode.label',
+    defaultMessage: 'Tagged user',
+    description: 'Label to indicate mention node to Screen reader users, that preceeds with user name ex: "Tagged user @XXX'
+  }
+});

package/dist/cjs/nodeviews/mention.js

@@ -0,0 +1,117 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime/helpers/typeof");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.MentionNodeView = void 0;
+var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
+var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactIntlNext = require("react-intl-next");
+var _providerFactory = require("@atlaskit/editor-common/provider-factory");
+var _mention = require("@atlaskit/mention");
+var _types = require("@atlaskit/mention/types");
+var _messages = require("../messages");
+var _Mention = _interopRequireDefault(require("../ui/Mention"));
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+var UNKNOWN_USER_ID = '_|unknown|_';
+var MentionAssistiveTextComponent = function MentionAssistiveTextComponent(_ref) {
+  var id = _ref.id,
+    text = _ref.text,
+    providers = _ref.providers,
+    accessLevel = _ref.accessLevel,
+    mentionProvider = _ref.mentionProvider;
+  var _useState = (0, _react.useState)(text),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    resolvedName = _useState2[0],
+    setResolvedName = _useState2[1];
+  var intl = (0, _reactIntlNext.useIntl)();
+  var processName = function processName(name) {
+    if (name.status === _mention.MentionNameStatus.OK) {
+      return "@".concat(name.name || '');
+    } else {
+      return "@".concat(UNKNOWN_USER_ID);
+    }
+  };
+  (0, _react.useEffect)(function () {
+    if (mentionProvider) {
+      mentionProvider.then( /*#__PURE__*/function () {
+        var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(provider) {
+          var nameDetail;
+          return _regenerator.default.wrap(function _callee$(_context) {
+            while (1) switch (_context.prev = _context.next) {
+              case 0:
+                if (!(!text && (0, _mention.isResolvingMentionProvider)(provider))) {
+                  _context.next = 13;
+                  break;
+                }
+                nameDetail = provider.resolveMentionName(id);
+                if (!(0, _types.isPromise)(nameDetail)) {
+                  _context.next = 10;
+                  break;
+                }
+                _context.t0 = processName;
+                _context.next = 6;
+                return nameDetail;
+              case 6:
+                _context.t1 = _context.sent;
+                return _context.abrupt("return", (0, _context.t0)(_context.t1));
+              case 10:
+                return _context.abrupt("return", processName(nameDetail));
+              case 11:
+                _context.next = 14;
+                break;
+              case 13:
+                return _context.abrupt("return", text);
+              case 14:
+              case "end":
+                return _context.stop();
+            }
+          }, _callee);
+        }));
+        return function (_x) {
+          return _ref2.apply(this, arguments);
+        };
+      }()).then(function (resolvedName) {
+        setResolvedName(resolvedName);
+      });
+    }
+  }, [id, text, mentionProvider]);
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("span", {
+    className: 'assistive'
+  }, "".concat(intl.formatMessage(_messages.messages.mentionsNodeLabel), " ").concat(resolvedName)), /*#__PURE__*/_react.default.createElement("span", {
+    "aria-hidden": "true"
+  }, /*#__PURE__*/_react.default.createElement(_Mention.default, {
+    id: id,
+    text: resolvedName,
+    accessLevel: accessLevel,
+    providers: providers
+  })));
+};
+var MentionNodeView = exports.MentionNodeView = function MentionNodeView(props) {
+  var providerFactory = props.providerFactory;
+  var _props$node$attrs = props.node.attrs,
+    id = _props$node$attrs.id,
+    text = _props$node$attrs.text,
+    accessLevel = _props$node$attrs.accessLevel;
+  var renderAssistiveTextWithProviders = function renderAssistiveTextWithProviders(providers) {
+    var _ref3 = providers,
+      mentionProvider = _ref3.mentionProvider;
+    return /*#__PURE__*/_react.default.createElement(MentionAssistiveTextComponent, {
+      mentionProvider: mentionProvider,
+      id: id,
+      text: text,
+      providers: providerFactory,
+      accessLevel: accessLevel
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement(_providerFactory.WithProviders, {
+    providers: ['mentionProvider', 'profilecardProvider'],
+    providerFactory: providerFactory,
+    renderNode: renderAssistiveTextWithProviders
+  });
+};

package/dist/cjs/plugin.js

@@ -0,0 +1,135 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mentionsPlugin = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _react = _interopRequireDefault(require("react"));
+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 _quickInsert = require("@atlaskit/editor-common/quick-insert");
+var _withPluginState = require("@atlaskit/editor-common/with-plugin-state");
+var _resource = require("@atlaskit/mention/resource");
+var _key = require("./pm-plugins/key");
+var _main = require("./pm-plugins/main");
+var _typeAhead = require("./type-ahead");
+var _ToolbarMention = _interopRequireDefault(require("./ui/ToolbarMention"));
+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,
+    api = _ref.api;
+  var sessionId = (0, _uuid.default)();
+  var fireEvent = function fireEvent(payload) {
+    var _api$analytics$shared, _api$analytics;
+    var _ref2 = (_api$analytics$shared = api === null || api === void 0 || (_api$analytics = api.analytics) === null || _api$analytics === void 0 ? void 0 : _api$analytics.sharedState.currentState()) !== null && _api$analytics$shared !== void 0 ? _api$analytics$shared : {},
+      createAnalyticsEvent = _ref2.createAnalyticsEvent;
+    if (!createAnalyticsEvent) {
+      return;
+    }
+    if (payload.attributes && !payload.attributes.sessionId) {
+      payload.attributes.sessionId = sessionId;
+    }
+    createAnalyticsEvent(payload).fire(_resource.ELEMENTS_CHANNEL);
+  };
+  var typeAhead = (0, _typeAhead.createTypeAheadConfig)({
+    sanitizePrivateContent: options === null || options === void 0 ? void 0 : options.sanitizePrivateContent,
+    mentionInsertDisplayName: options === null || options === void 0 ? void 0 : options.insertDisplayName,
+    HighlightComponent: options === null || options === void 0 ? void 0 : options.HighlightComponent,
+    fireEvent: fireEvent
+  });
+  return {
+    name: 'mention',
+    nodes: function nodes() {
+      return [{
+        name: 'mention',
+        node: _adfSchema.mention
+      }];
+    },
+    pmPlugins: function pmPlugins() {
+      return [{
+        name: 'mention',
+        plugin: function plugin(pmPluginFactoryParams) {
+          return (0, _main.createMentionPlugin)(pmPluginFactoryParams, fireEvent, options);
+        }
+      }];
+    },
+    secondaryToolbarComponent: function secondaryToolbarComponent(_ref3) {
+      var editorView = _ref3.editorView,
+        disabled = _ref3.disabled;
+      var openMentionTypeAhead = function openMentionTypeAhead() {
+        var _api$typeAhead;
+        api === null || api === void 0 || (_api$typeAhead = api.typeAhead) === null || _api$typeAhead === void 0 || (_api$typeAhead = _api$typeAhead.actions) === null || _api$typeAhead === void 0 || _api$typeAhead.open({
+          triggerHandler: typeAhead,
+          inputMethod: _analytics.INPUT_METHOD.INSERT_MENU
+        });
+      };
+      return /*#__PURE__*/_react.default.createElement(_withPluginState.WithPluginState, {
+        editorView: editorView,
+        plugins: {
+          mentionState: _key.mentionPluginKey
+        },
+        render: function render(_ref4) {
+          var _ref4$mentionState = _ref4.mentionState,
+            mentionState = _ref4$mentionState === void 0 ? {} : _ref4$mentionState;
+          return !mentionState.mentionProvider ? null : /*#__PURE__*/_react.default.createElement(_ToolbarMention.default, {
+            editorView: editorView,
+            onInsertMention: openMentionTypeAhead,
+            isDisabled: disabled || (api === null || api === void 0 ? void 0 : api.typeAhead.actions.isAllowed(editorView.state))
+          });
+        }
+      });
+    },
+    actions: {
+      openTypeAhead: function openTypeAhead(inputMethod) {
+        var _api$typeAhead2;
+        return Boolean(api === null || api === void 0 || (_api$typeAhead2 = api.typeAhead) === null || _api$typeAhead2 === void 0 || (_api$typeAhead2 = _api$typeAhead2.actions) === null || _api$typeAhead2 === void 0 ? void 0 : _api$typeAhead2.open({
+          triggerHandler: typeAhead,
+          inputMethod: inputMethod
+        }));
+      }
+    },
+    getSharedState: function getSharedState(editorState) {
+      if (!editorState) {
+        return undefined;
+      }
+      var mentionPluginState = _key.mentionPluginKey.getState(editorState);
+      return _objectSpread(_objectSpread({}, mentionPluginState), {}, {
+        typeAheadHandler: typeAhead
+      });
+    },
+    pluginsOptions: {
+      quickInsert: function quickInsert(_ref5) {
+        var formatMessage = _ref5.formatMessage;
+        return [{
+          id: 'mention',
+          title: formatMessage(_messages.toolbarInsertBlockMessages.mention),
+          description: formatMessage(_messages.toolbarInsertBlockMessages.mentionDescription),
+          keywords: ['team', 'user'],
+          priority: 400,
+          keyshortcut: '@',
+          icon: function icon() {
+            return /*#__PURE__*/_react.default.createElement(_quickInsert.IconMention, null);
+          },
+          action: function action(insert, state) {
+            var tr = insert(undefined);
+            var pluginState = _key.mentionPluginKey.getState(state);
+            if (pluginState && pluginState.canInsertMention === false) {
+              return false;
+            }
+            api === null || api === void 0 || api.typeAhead.actions.openAtTransaction({
+              triggerHandler: typeAhead,
+              inputMethod: _analytics.INPUT_METHOD.QUICK_INSERT
+            })(tr);
+            return tr;
+          }
+        }];
+      },
+      typeAhead: typeAhead
+    }
+  };
+};

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

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.mentionPluginKey = void 0;
+var _state = require("@atlaskit/editor-prosemirror/state");
+var mentionPluginKey = exports.mentionPluginKey = new _state.PluginKey('mentionPlugin');

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

@@ -0,0 +1,156 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.createMentionPlugin = createMentionPlugin;
+exports.setContext = void 0;
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+var _reactNodeView = require("@atlaskit/editor-common/react-node-view");
+var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
+var _resource = require("@atlaskit/mention/resource");
+var _mention = require("../nodeviews/mention");
+var _key = require("./key");
+var _utils = 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 = {
+  SET_PROVIDER: 'SET_PROVIDER',
+  SET_CONTEXT: 'SET_CONTEXT'
+};
+var setProvider = function setProvider(provider) {
+  return function (state, dispatch) {
+    if (dispatch) {
+      dispatch(state.tr.setMeta(_key.mentionPluginKey, {
+        action: ACTIONS.SET_PROVIDER,
+        params: {
+          provider: provider
+        }
+      }));
+    }
+    return true;
+  };
+};
+var setContext = exports.setContext = function setContext(context) {
+  return function (state, dispatch) {
+    if (dispatch) {
+      dispatch(state.tr.setMeta(_key.mentionPluginKey, {
+        action: ACTIONS.SET_CONTEXT,
+        params: {
+          context: context
+        }
+      }));
+    }
+    return true;
+  };
+};
+function createMentionPlugin(pmPluginFactoryParams, fireEvent, options) {
+  var mentionProvider;
+  var sendAnalytics = function sendAnalytics(event, actionSubject, action, attributes) {
+    if (event === _resource.SLI_EVENT_TYPE || event === _resource.SMART_EVENT_TYPE) {
+      fireEvent((0, _resource.buildSliPayload)(actionSubject, action, attributes));
+    }
+  };
+  return new _safePlugin.SafePlugin({
+    key: _key.mentionPluginKey,
+    state: {
+      init: function init(_, state) {
+        var canInsertMention = (0, _utils.canMentionBeCreatedInRange)(state.selection.from, state.selection.to)(state);
+        return {
+          canInsertMention: canInsertMention
+        };
+      },
+      apply: function apply(tr, pluginState, oldState, newState) {
+        var _ref = tr.getMeta(_key.mentionPluginKey) || {
+            action: null,
+            params: null
+          },
+          action = _ref.action,
+          params = _ref.params;
+        var hasNewPluginState = false;
+        var newPluginState = pluginState;
+        var hasPositionChanged = oldState.selection.from !== newState.selection.from || oldState.selection.to !== newState.selection.to;
+        if (tr.docChanged || tr.selectionSet && hasPositionChanged) {
+          newPluginState = _objectSpread(_objectSpread({}, pluginState), {}, {
+            canInsertMention: (0, _utils.canMentionBeCreatedInRange)(newState.selection.from, newState.selection.to)(newState)
+          });
+          hasNewPluginState = true;
+        }
+        switch (action) {
+          case ACTIONS.SET_PROVIDER:
+            newPluginState = _objectSpread(_objectSpread({}, newPluginState), {}, {
+              mentionProvider: params.provider
+            });
+            hasNewPluginState = true;
+            break;
+          case ACTIONS.SET_CONTEXT:
+            newPluginState = _objectSpread(_objectSpread({}, newPluginState), {}, {
+              contextIdentifierProvider: params.context
+            });
+            hasNewPluginState = true;
+            break;
+        }
+        if (hasNewPluginState) {
+          pmPluginFactoryParams.dispatch(_key.mentionPluginKey, newPluginState);
+        }
+        return newPluginState;
+      }
+    },
+    props: {
+      nodeViews: {
+        mention: (0, _reactNodeView.getInlineNodeViewProducer)({
+          pmPluginFactoryParams: pmPluginFactoryParams,
+          Component: _mention.MentionNodeView,
+          extraComponentProps: {
+            providerFactory: pmPluginFactoryParams.providerFactory,
+            options: options
+          }
+        })
+      }
+    },
+    view: function view(editorView) {
+      var providerHandler = function providerHandler(name, providerPromise) {
+        switch (name) {
+          case 'mentionProvider':
+            if (!providerPromise) {
+              return setProvider(undefined)(editorView.state, editorView.dispatch);
+            }
+            providerPromise.then(function (provider) {
+              if (mentionProvider) {
+                mentionProvider.unsubscribe('mentionPlugin');
+              }
+              mentionProvider = provider;
+              setProvider(provider)(editorView.state, editorView.dispatch);
+              provider.subscribe('mentionPlugin', undefined, undefined, undefined, undefined, sendAnalytics);
+            }).catch(function () {
+              return setProvider(undefined)(editorView.state, editorView.dispatch);
+            });
+            break;
+          case 'contextIdentifierProvider':
+            if (!providerPromise) {
+              return setContext(undefined)(editorView.state, editorView.dispatch);
+            }
+            providerPromise.then(function (provider) {
+              setContext(provider)(editorView.state, editorView.dispatch);
+            });
+            break;
+        }
+        return;
+      };
+      pmPluginFactoryParams.providerFactory.subscribe('mentionProvider', providerHandler);
+      pmPluginFactoryParams.providerFactory.subscribe('contextIdentifierProvider', providerHandler);
+      return {
+        destroy: function destroy() {
+          if (pmPluginFactoryParams.providerFactory) {
+            pmPluginFactoryParams.providerFactory.unsubscribe('mentionProvider', providerHandler);
+            pmPluginFactoryParams.providerFactory.unsubscribe('contextIdentifierProvider', providerHandler);
+          }
+          if (mentionProvider) {
+            mentionProvider.unsubscribe('mentionPlugin');
+          }
+        }
+      };
+    }
+  });
+}