@atlaskit/editor-common/dist/esm/lazy-node-view/node-view.js

A package that contains common classes and components for editor and renderer

import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _defineProperty from "@babel/runtime/helpers/defineProperty";
import memoize from 'lodash/memoize';
import { DOMSerializer } from '@atlaskit/editor-prosemirror/model';
var getEditorLineWidth = memoize(function (view) {
  var _view$dom;
  return (_view$dom = view.dom) === null || _view$dom === void 0 ? void 0 : _view$dom.clientWidth;
});

// Copied from ProseMirror NodeView
// https://github.com/ProseMirror/prosemirror-view/blob/cfa73eb969777f63bcb39972594fd4a9110f5a93/src/viewdesc.ts#L1095-L1099
function sameOuterDeco(a, b) {
  if (a.length !== b.length) {
    return false;
  }
  for (var i = 0; i < a.length; i++) {
    // @ts-expect-error type actually exist on decoration at runtime
    if (!a[i].type) {
      return false;
    }

    // @ts-expect-error type actually exist on decoration at runtime
    if (!a[i].type.eq(b[i].type)) {
      return false;
    }
  }
  return true;
}
export function makeNodePlaceholderId(nodeType, pos) {
  return "".concat(nodeType, ":").concat(pos);
}

/**
 * 🧱 Internal: Editor FE Platform
 *
 * A NodeView that serves as a placeholder until the actual NodeView is loaded.
 */
export var LazyNodeView = /*#__PURE__*/function () {
  // Ignored via go/ees005
  // eslint-disable-next-line @typescript-eslint/max-params
  function LazyNodeView(_node, view, _getPos, _outerDeco) {
    var _this = this,
      _node$type;
    _classCallCheck(this, LazyNodeView);
    _defineProperty(this, "update", function (node, outerDeco) {
      var prevNode = _this.node;
      _this.node = node;
      if (!sameOuterDeco(outerDeco, _this.outerDeco)) {
        return false;
      }

      // Copying some of the default NodeView update behaviour
      // https://github.com/ProseMirror/prosemirror-view/blob/cfa73eb969777f63bcb39972594fd4a9110f5a93/src/viewdesc.ts#L803
      return !_this.node.sameMarkup(prevNode);
    });
    this.node = _node;
    this.outerDeco = _outerDeco;
    if (typeof ((_node$type = _node.type) === null || _node$type === void 0 || (_node$type = _node$type.spec) === null || _node$type === void 0 ? void 0 : _node$type.toDOM) !== 'function') {
      this.dom = document.createElement('div');
      return;
    }
    var toDOMConfiguration = {
      editorLineWidth: getEditorLineWidth(view)
    };
    var fallback = DOMSerializer.renderSpec(document, _node.type.spec.toDOM(_node,
    // We are injecting a second parameter to be used by the toDOM lazy node view implementations
    // @ts-expect-error
    toDOMConfiguration));
    this.dom = fallback.dom;
    this.contentDOM = fallback.contentDOM;
    if (this.dom instanceof HTMLElement) {
      // This attribute is mostly used for debugging purposed
      // It will help us to found out when the node was replaced
      this.dom.setAttribute('data-lazy-node-view', _node.type.name);
      // This is used on Libra tests
      // We are using this to make sure all lazy noded were replaced
      // before the test started
      this.dom.setAttribute('data-lazy-node-view-fallback', 'true');

      // This is used by the UFO to identify the node
      this.dom.setAttribute('data-vc', "editor-lnv-fallback--".concat(_node.type.name));
      var pos = _getPos();
      if (pos !== undefined) {
        // Used for UFO to identify this as a placeholder
        this.dom.setAttribute('data-editor-lnv-placeholder', makeNodePlaceholderId(_node.type.name, pos));
      }
    }
  }
  return _createClass(LazyNodeView, [{
    key: "ignoreMutation",
    value: function ignoreMutation() {
      if (this.node.type.isTextblock) {
        return false;
      }
      return true;
    }
  }]);
}();