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

Mentions plugin for @atlaskit/editor-core

import React from 'react';
import { bind } from 'bind-event-listener';
// eslint-disable-next-line @atlaskit/platform/prefer-crypto-random-uuid -- Use crypto.randomUUID instead
import uuid from 'uuid/v4';
import { NodeSelection } from '@atlaskit/editor-prosemirror/state';
import { ProfileCardComponent } from '../ui/ProfileCardComponent';
export var 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 = uuid();
  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 = 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.createElement(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 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
  };
};