@atlaskit/editor-core/dist/cjs/utils/getNodesVisibleInViewport.js

A package contains Atlassian editor core functionality

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.isNodeVisible = exports.getNodesVisibleInViewport = void 0;
/**
 * Check if a DOM element is visible within the viewport. We deem a node visible if the top left corner coordinate is within the viewport.
 * This may not look visible, and may include a node that looks below the fold – but it's more than 0 pixels within the viewport.
 */
var isNodeVisible = exports.isNodeVisible = function isNodeVisible(node) {
  var rect = node.getBoundingClientRect();
  var isVisible = rect.x >= 0 && rect.x < window.innerWidth && rect.y >= 0 && rect.y < window.innerHeight;
  return isVisible;
};

/**
 * Get visible nodes in viewport by looping through the first N nodes (MAX_NODES_TO_COUNT)
 * in the editor DOM and counting the node types that are visible.
 */
var getNodesVisibleInViewport = exports.getNodesVisibleInViewport = function getNodesVisibleInViewport(editorDom) {
  var MAX_NODES_TO_COUNT = 200;
  var pmNodesList = editorDom.querySelectorAll('[data-prosemirror-node-name]');
  var nodesTypeCounter = {};
  for (var i = 0; i < Math.min(MAX_NODES_TO_COUNT, pmNodesList.length); i++) {
    var node = pmNodesList[i];
    var type = node.getAttribute('data-prosemirror-node-name');

    // No valid prosemirrornode type, skip.
    if (!type) {
      continue;
    }
    var isVisible = isNodeVisible(node);

    // Not a visible node, end counting.
    if (!isVisible) {
      break;
    }
    nodesTypeCounter[type] = (nodesTypeCounter[type] || 0) + 1;
  }
  return nodesTypeCounter;
};