@atlaskit/editor-plugin-mentions/dist/cjs/nodeviews/profileCardRenderer.js

Mentions plugin for @atlaskit/editor-core

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.profileCardRenderer = void 0;
var _react = _interopRequireDefault(require("react"));
var _bindEventListener = require("bind-event-listener");
var _v = _interopRequireDefault(require("uuid/v4"));
var _state = require("@atlaskit/editor-prosemirror/state");
var _ProfileCardComponent = require("../ui/ProfileCardComponent");
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead

var profileCardRenderer = exports.profileCardRenderer = function profileCardRenderer(_ref) {
  var dom = _ref.dom,
    options = _ref.options,
    portalProviderAPI = _ref.portalProviderAPI,
    node = _ref.node,
    api = _ref.api;
  var renderingProfileCard = false;
  // eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
  var key = (0, _v.default)();
  var cleanupSelection;
  var removeProfileCard = function removeProfileCard() {
    var _cleanupSelection;
    if (dom instanceof HTMLElement) {
      dom.setAttribute('aria-expanded', 'false');
    }
    portalProviderAPI.remove(key);
    renderingProfileCard = false;
    (_cleanupSelection = cleanupSelection) === null || _cleanupSelection === void 0 || _cleanupSelection();
  };
  var listenerCleanup = (0, _bindEventListener.bind)(dom, {
    type: 'click',
    listener: function listener() {
      if (dom instanceof HTMLElement && options !== null && options !== void 0 && options.profilecardProvider && !renderingProfileCard) {
        var _api$selection;
        dom.setAttribute('aria-expanded', 'true');
        renderingProfileCard = true;
        portalProviderAPI.render(function () {
          return /*#__PURE__*/_react.default.createElement(_ProfileCardComponent.ProfileCardComponent, {
            activeMention: node,
            profilecardProvider: options === null || options === void 0 ? void 0 : options.profilecardProvider,
            dom: dom,
            closeComponent: removeProfileCard
          });
        }, dom, key);
        // If we change the selection we should also remove the profile card. The "deselectNode"
        // should usually catch this, but it's possible (ie. on triple click) for this not to be called
        // which means the profile card gets stuck open until you click + change selection
        cleanupSelection = api === null || api === void 0 || (_api$selection = api.selection) === null || _api$selection === void 0 ? void 0 : _api$selection.sharedState.onChange(function (_ref2) {
          var nextSharedState = _ref2.nextSharedState;
          var selection = nextSharedState === null || nextSharedState === void 0 ? void 0 : nextSharedState.selection;
          if (selection instanceof _state.NodeSelection ? selection.node === node : false) {
            return;
          }
          removeProfileCard === null || removeProfileCard === void 0 || removeProfileCard();
        });
      }
    }
  });
  return {
    destroyProfileCard: function destroyProfileCard() {
      listenerCleanup();
      removeProfileCard === null || removeProfileCard === void 0 || removeProfileCard();
    },
    removeProfileCard: removeProfileCard
  };
};