@atlaskit/editor-plugin-code-block-advanced/dist/esm/nodeviews/extensions/prosemirrorDecorations.js

CodeBlockAdvanced plugin for @atlaskit/editor-core

import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
import _createClass from "@babel/runtime/helpers/createClass";
import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
import _inherits from "@babel/runtime/helpers/inherits";
function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
import { ViewPlugin, WidgetType, Decoration as CodeMirrorDecoration } from '@codemirror/view';
import { fg } from '@atlaskit/platform-feature-flags';
var PMWidget = /*#__PURE__*/function (_WidgetType) {
  function PMWidget(toDOMElement) {
    var _this;
    _classCallCheck(this, PMWidget);
    _this = _callSuper(this, PMWidget);
    _this.toDOMElement = toDOMElement;
    return _this;
  }
  _inherits(PMWidget, _WidgetType);
  return _createClass(PMWidget, [{
    key: "toDOM",
    value: function toDOM() {
      return this.toDOMElement;
    }
  }, {
    key: "ignoreEvent",
    value: function ignoreEvent() {
      return false;
    }
  }]);
}(WidgetType); // This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
// This type is not exposed publically by ProseMirror but we need it to map to CodeMirror
// See: https://github.com/ProseMirror/prosemirror-view/blob/master/src/decoration.ts
function isExtendedDecoration(decoration) {
  return decoration.inline !== undefined && decoration.widget !== undefined && decoration.type !== undefined;
}
var getHTMLElement = function getHTMLElement(toDOM, view, getPos) {
  if (toDOM instanceof Function) {
    var element = toDOM(view, getPos);
    return element instanceof HTMLElement ? element : undefined;
  } else if (toDOM instanceof HTMLElement) {
    return toDOM;
  }
};
var mapPMDecorationToCMDecoration = function mapPMDecorationToCMDecoration(decoration, view, getPos) {
  if (!isExtendedDecoration(decoration)) {
    return undefined;
  }
  if (decoration.inline) {
    var markDecoration = CodeMirrorDecoration.mark({
      attributes: decoration.type.attrs
    });
    return markDecoration.range(decoration.from, decoration.to);
  } else if (decoration.widget) {
    var _decoration$type;
    var toDOM = getHTMLElement(decoration === null || decoration === void 0 || (_decoration$type = decoration.type) === null || _decoration$type === void 0 ? void 0 : _decoration$type.toDOM, view, getPos);
    if (!toDOM) {
      return undefined;
    }
    var widgetDecoration = CodeMirrorDecoration.widget({
      widget: new PMWidget(toDOM),
      side: decoration.type.side
    });
    return widgetDecoration.range(decoration.from, decoration.to);
  }
};
function isDefined(value) {
  return value !== undefined;
}
export var sortDecorationsByPositionAndSide = function sortDecorationsByPositionAndSide(a, b) {
  return a.from - b.from || a.value.startSide - b.value.startSide;
};

/**
 * Creates CodeMirror versions of the decorations provided by ProseMirror.
 *
 * Inline ProseMirror decorations -> Mark CodeMirror decorations
 * Widget ProseMirror decorations -> Widget CodeMirror decorations
 *
 * This way any decorations applied in ProseMirror land should automatically be supported
 * by the CodeMirror editor
 *
 * @param updateDecorationsEffect Facet for the prosemirror decorations
 * @returns CodeMirror extension
 */
export var prosemirrorDecorationPlugin = function prosemirrorDecorationPlugin(updateDecorationsEffect, editorView, getPos) {
  return ViewPlugin.fromClass( /*#__PURE__*/function () {
    function _class(view) {
      _classCallCheck(this, _class);
      this.decorations = this.updateDecorations(view);
    }
    return _createClass(_class, [{
      key: "updateDecorations",
      value: function updateDecorations(view) {
        var _view$viewport = view.viewport,
          from = _view$viewport.from,
          to = _view$viewport.to;
        var innnerDecorations = view.state.facet(updateDecorationsEffect);
        var allDecorations = [];
        innnerDecorations === null || innnerDecorations === void 0 || innnerDecorations.map(function (source) {
          source === null || source === void 0 || source.forEachSet(function (set) {
            var decorations = set.find(from, to)
            // Do not render the code block line decorations
            .filter(function (dec) {
              return dec.spec.type !== 'decorationWidgetType';
            });
            allDecorations.push.apply(allDecorations, _toConsumableArray(decorations));
          });
        });
        var cmDecorations = allDecorations.sort(function (a, b) {
          return a.from < b.from ? -1 : 1;
        }).map(function (decoration) {
          return mapPMDecorationToCMDecoration(decoration, editorView, getPos);
        }).filter(isDefined);
        if (fg('platform_editor_fix_decoration_edge_case')) {
          return CodeMirrorDecoration.set(cmDecorations.sort(sortDecorationsByPositionAndSide));
        } else {
          return CodeMirrorDecoration.set(cmDecorations);
        }
      }
    }, {
      key: "update",
      value: function update(_update) {
        this.decorations = this.updateDecorations(_update.view);
      }
    }]);
  }(), {
    decorations: function decorations(v) {
      return v.decorations;
    }
  });
};