@atlaskit/editor-plugin-block-controls/dist/cjs/pm-plugins/utils/sparse-surfaces-view.js

Block controls plugin for @atlaskit/editor-core

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.createSparseSurfacesView = void 0;
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/toConsumableArray"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _surfaceKeys = require("@atlaskit/editor-common/block-controls/surface-keys");
var _nodeAnchor = require("@atlaskit/editor-common/node-anchor");
var _surfaceRenderer = require("@atlaskit/editor-ui-control-model/surface-renderer");
var _decorationsSurfaceAnchor = require("../decorations-surface-anchor");
var _main = require("../main");
var _sparseSurfaceCandidates = require("./sparse-surface-candidates");
var _surfaceViewport = require("./surface-viewport");
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { (0, _defineProperty2.default)(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var haveAnchorPositionsChanged = function haveAnchorPositionsChanged(positions, anchors) {
  return positions.length !== anchors.size || positions.some(function (position) {
    return !anchors.has(position);
  });
};
var createSparseSurfacesView = exports.createSparseSurfacesView = function createSparseSurfacesView(_ref) {
  var _api$uiControlRegistr3, _api$editorDisabled, _api$editorViewMode, _api$limitedMode2, _api$showDiff, _api$userIntent;
  var api = _ref.api,
    pluginKey = _ref.pluginKey,
    view = _ref.view;
  var win = view.dom.ownerDocument.defaultView;
  var frame;
  var visiblePositions = [];
  var registryChanged = true;
  var reconcile = function reconcile() {
    var _api$limitedMode;
    frame = undefined;
    var previous = pluginKey.getState(view.state);
    if (!previous || api !== null && api !== void 0 && (_api$limitedMode = api.limitedMode) !== null && _api$limitedMode !== void 0 && (_api$limitedMode = _api$limitedMode.sharedState.currentState()) !== null && _api$limitedMode !== void 0 && _api$limitedMode.enabled) {
      return;
    }
    var controls = _main.key.getState(view.state);
    var activeNode = controls === null || controls === void 0 ? void 0 : controls.activeNode;
    var activeNodesByPosition = new Map();
    var menu = controls !== null && controls !== void 0 && controls.isMenuOpen ? controls.menuTriggerByNode : undefined;
    if (menu && controls !== null && controls !== void 0 && controls.menuTriggerBy && view.state.doc.nodeAt(menu.pos)) {
      var _menu$rootPos;
      var menuNode = _objectSpread(_objectSpread({}, menu), {}, {
        anchorName: controls.menuTriggerBy
      });
      activeNodesByPosition.set(menu.pos, menuNode);
      activeNodesByPosition.set((_menu$rootPos = menu.rootPos) !== null && _menu$rootPos !== void 0 ? _menu$rootPos : menu.pos, menuNode);
    }
    var resolvedSurfaces = [_surfaceKeys.BLOCK_CONTROLS_LEFT_SURFACE, _surfaceKeys.BLOCK_CONTROLS_RIGHT_SURFACE].map(function (surface) {
      var _api$uiControlRegistr, _api$uiControlRegistr2;
      return (0, _surfaceRenderer.resolveSurface)((_api$uiControlRegistr = api === null || api === void 0 || (_api$uiControlRegistr2 = api.uiControlRegistry) === null || _api$uiControlRegistr2 === void 0 ? void 0 : _api$uiControlRegistr2.actions.getComponents(surface)) !== null && _api$uiControlRegistr !== void 0 ? _api$uiControlRegistr : [], surface);
    });
    var candidates = (0, _sparseSurfaceCandidates.reconcileSparseSurfaceCandidates)({
      activeNode: activeNode,
      activeNodesByPosition: activeNodesByPosition,
      newState: view.state,
      state: previous.candidates,
      visiblePositions: visiblePositions,
      protectedPositions: (0, _toConsumableArray2.default)(activeNodesByPosition.keys()),
      resolvedSurfaces: resolvedSurfaces,
      documentChanged: previous.documentChanged,
      invalidation: _objectSpread(_objectSpread({}, previous.invalidation), {}, {
        all: registryChanged
      })
    });
    var visibilityChanged = registryChanged;
    registryChanged = false;
    var anchorPositions = candidates.positions;
    if (!visibilityChanged && !haveAnchorPositionsChanged(anchorPositions, previous.anchors) && candidates === previous.candidates && !previous.documentChanged && !previous.invalidation) {
      return;
    }
    var nodeIdProvider = (0, _nodeAnchor.getNodeIdProvider)(view);
    var _createSurfaceAnchorD = (0, _decorationsSurfaceAnchor.createSurfaceAnchorDecorations)(view.state, anchorPositions, function (node, position, previousAnchorName) {
        if (previousAnchorName) {
          nodeIdProvider.setIdForNode(node, previousAnchorName);
          return previousAnchorName;
        }
        return nodeIdProvider.getOrGenerateId(node, position);
      }, previous.anchors),
      anchors = _createSurfaceAnchorD.anchors,
      decorations = _createSurfaceAnchorD.decorations;
    view.dispatch(view.state.tr.setMeta(pluginKey, {
      reconciliation: {
        activeNodesByPosition: activeNodesByPosition,
        anchors: anchors,
        candidates: candidates,
        decorations: decorations
      },
      type: 'commitReconciliation'
    }));
  };
  var schedule = function schedule() {
    if (frame === undefined && win) {
      frame = win.requestAnimationFrame(reconcile);
    }
  };
  var observer = (0, _surfaceViewport.observeSurfaceViewport)(view, function (positions) {
    visiblePositions = positions;
    schedule();
  });
  var invalidate = function invalidate() {
    registryChanged = true;
    schedule();
  };
  var unsubscribe = api === null || api === void 0 || (_api$uiControlRegistr3 = api.uiControlRegistry) === null || _api$uiControlRegistr3 === void 0 ? void 0 : _api$uiControlRegistr3.actions.subscribe(invalidate);
  var unsubscribers = [api === null || api === void 0 || (_api$editorDisabled = api.editorDisabled) === null || _api$editorDisabled === void 0 ? void 0 : _api$editorDisabled.sharedState.onChange(invalidate), api === null || api === void 0 || (_api$editorViewMode = api.editorViewMode) === null || _api$editorViewMode === void 0 ? void 0 : _api$editorViewMode.sharedState.onChange(invalidate), api === null || api === void 0 || (_api$limitedMode2 = api.limitedMode) === null || _api$limitedMode2 === void 0 ? void 0 : _api$limitedMode2.sharedState.onChange(invalidate), api === null || api === void 0 || (_api$showDiff = api.showDiff) === null || _api$showDiff === void 0 ? void 0 : _api$showDiff.sharedState.onChange(invalidate), api === null || api === void 0 || (_api$userIntent = api.userIntent) === null || _api$userIntent === void 0 ? void 0 : _api$userIntent.sharedState.onChange(invalidate)];
  return {
    update: function update(currentView, previousState) {
      observer.update();
      var sparse = pluginKey.getState(currentView.state);
      var controls = _main.key.getState(currentView.state);
      var previousControls = _main.key.getState(previousState);
      if ((controls === null || controls === void 0 ? void 0 : controls.isDragging) !== (previousControls === null || previousControls === void 0 ? void 0 : previousControls.isDragging) || (controls === null || controls === void 0 ? void 0 : controls.isResizerResizing) !== (previousControls === null || previousControls === void 0 ? void 0 : previousControls.isResizerResizing)) {
        invalidate();
      }
      if (sparse !== null && sparse !== void 0 && sparse.documentChanged || sparse !== null && sparse !== void 0 && sparse.invalidation || (controls === null || controls === void 0 ? void 0 : controls.activeNode) !== (previousControls === null || previousControls === void 0 ? void 0 : previousControls.activeNode) || (controls === null || controls === void 0 ? void 0 : controls.isMenuOpen) !== (previousControls === null || previousControls === void 0 ? void 0 : previousControls.isMenuOpen) || (controls === null || controls === void 0 ? void 0 : controls.menuTriggerByNode) !== (previousControls === null || previousControls === void 0 ? void 0 : previousControls.menuTriggerByNode)) {
        schedule();
      }
    },
    destroy: function destroy() {
      if (frame !== undefined) {
        win === null || win === void 0 || win.cancelAnimationFrame(frame);
      }
      observer.destroy();
      unsubscribe === null || unsubscribe === void 0 || unsubscribe();
      unsubscribers.forEach(function (unsubscribe) {
        return unsubscribe === null || unsubscribe === void 0 ? void 0 : unsubscribe();
      });
    }
  };
};