@atlaskit/editor-nodeview-data-provider/dist/esm/index.js

NodeView data provider for @atlaskit/editor-core plugins

import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
// re exported to avoid type issues
// this type is only used in jsdoc comments in this file.

/**
 * This is the base class for creating a node view data provider for an editor plugin.
 *
 * ## Usage
 *
 * ### Create a provider
 *
 * @example
 * ```ts
 * class EmojiNodeViewDataProvider extends NodeViewDataProvider<
 *  { attrs: EmojiAttributes },
 * { resolvedData: string }
 * > {
 *   constructor({ existingCache }?: { existingCache: Record<string, { resolvedData: string }> }) {
 *     super({ existingCache, nodeName: 'emoji' });
 *   }
 *   nodeToKey(node: { attrs: EmojiAttributes }): string {
 *     return `${node.attrs.shortName}-${node.attrs.text}-${node.attrs.id}`;
 *   }
 *   resolve(node: { attrs: EmojiAttributes }, _?: { signal: AbortSignal }) {
 *     return Promise.resolve({ resolvedData: 'resolved' });
 *   }
 * }
 * ```
 *
 * ### Use the provider
 *
 * @example
 * ```ts
 * const emojiNodeViewDataProvider = new EmojiNodeViewDataProvider();
 * ```
 *
 * ### Caching
 *
 * @see {@link buildCaches} for more information on building caches.
 *
 * #### Load an existing provider with a cache
 *
 * @example
 * ```
 * await buildCaches({
 *  adf: docFromSomewhere,
 *  nodeViewDataProviders: [emojiNodeViewDataProvider],
 *  signal: AbortSignal.timeout(5000),
 * });
 * emojiNodeViewDataProvider // { 'key': 'value' }
 * ```
 *
 * ### Load an new provider with an existing cache
 *
 * @example
 * ```
 * const provider1 = new ExampleNodeViewDataProvider();
 * await buildCaches({adf, nodeViewDataProviders: [provider1]})
 * provider1.cache // { 'key': 'value' }
 *
 * const provider2 = new ExampleNodeViewDataProvider({existingCache: provider1.cache});
 * ```
 */
export var NodeViewDataProvider = /*#__PURE__*/function () {
  /**
   * This takes a node and returns a key that can be used to cache the result of the resolve function.
   */

  /**
   * This returns the information required to render a node.
   *
   * If unresolvable, this method will throw an error.
   *
   * If signal is aborted, this method will return undefined.
   */

  function NodeViewDataProvider(_ref) {
    var _ref$existingCache = _ref.existingCache,
      existingCache = _ref$existingCache === void 0 ? {} : _ref$existingCache,
      nodeName = _ref.nodeName,
      nodeToKey = _ref.nodeToKey,
      resolve = _ref.resolve;
    _classCallCheck(this, NodeViewDataProvider);
    /**
     * This is added to ease building types
     */
    // @ts-ignore
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    _defineProperty(this, "__node", {});
    this.__cache = existingCache;
    this.nodeName = nodeName;
    this.nodeToKey = nodeToKey;
    this.resolve = resolve;
  }
  _createClass(NodeViewDataProvider, [{
    key: "cache",
    get:
    /**
     * This is the cache for the provider.
     */
    function get() {
      return this.__cache;
    },
    set: function set(cache) {
      this.__cache = cache;
    }
  }, {
    key: "get",
    value: function get(node, _) {
      var cached = this.cache[this.nodeToKey(node)];
      if (cached) {
        return cached;
      }
      var resolving = this.resolve(node, {
        signal: _ === null || _ === void 0 ? void 0 : _.signal
      });
      return resolving;
    }
  }]);
  return NodeViewDataProvider;
}();

// The purpose of this type is to ensure that either a DocNode or a PMNode is passed in
// to the provider.
// It is not opinionated about which nodes are used, so `any` is used here to allow
// compatibility with both DocNodes and PMNodes.