@atlaskit/editor-plugin-mentions/dist/esm/ui/quick-insert/MentionQuickInsertMenuItem.js

Mentions plugin for @atlaskit/editor-core

import React, { useCallback, useMemo } from 'react';
import { useIntl } from 'react-intl';
import { INPUT_METHOD } from '@atlaskit/editor-common/analytics/types/enums';
import { toolbarInsertBlockMessages as messages } from '@atlaskit/editor-common/messages/insert-block';
import { QuickInsertMenuItem } from '@atlaskit/editor-common/quick-insert/menu-item';
import { messages as quickInsertMessages } from '@atlaskit/editor-common/quick-insert/messages';
import MentionIcon from '@atlaskit/icon/core/mention';
import { mentionPluginKey } from '../../pm-plugins/key';
export var MentionQuickInsertMenuItem = function MentionQuickInsertMenuItem(_ref) {
  var api = _ref.api,
    previewImageUrls = _ref.previewImageUrls,
    typeAhead = _ref.typeAhead;
  var _useIntl = useIntl(),
    formatMessage = _useIntl.formatMessage;
  var preview = useMemo(function () {
    return previewImageUrls ? {
      image: previewImageUrls,
      attribution: {
        name: formatMessage(quickInsertMessages.previewAttributionAtlassian)
      }
    } : undefined;
  }, [formatMessage, previewImageUrls]);
  var onSelect = useCallback(function (_ref2) {
    var _mentionPluginKey$get, _api$typeAhead;
    var editorView = _ref2.editorView,
      insert = _ref2.insert;
    if (((_mentionPluginKey$get = mentionPluginKey.getState(editorView.state)) === null || _mentionPluginKey$get === void 0 ? void 0 : _mentionPluginKey$get.canInsertMention) === false) {
      return false;
    }
    var tr = insert(undefined);
    var didOpen = api === null || api === 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);
    if (didOpen === false) {
      return false;
    }
    return tr;
  }, [api, typeAhead]);
  return /*#__PURE__*/React.createElement(QuickInsertMenuItem, {
    description: formatMessage(messages.mentionDescription),
    iconBefore: /*#__PURE__*/React.createElement(MentionIcon, {
      label: ""
    }),
    onSelect: onSelect,
    preview: preview,
    shortcut: "@",
    title: formatMessage(messages.mention)
  });
};