@core-graphics/rect/dist/from-window-15834863.cjs.dev.js

JS utilities for managing rects

'use strict';

var createForOfIteratorHelper = require('./createForOfIteratorHelper-af5b9acb.cjs.dev.js');
var lite_dist_coreGraphicsRectLite = require('./lite-6b05303c.cjs.dev.js');
var fromPoints = require('./from-points-553fce0b.cjs.dev.js');

/**
 * Get computed style of an element
 */
var cache = new WeakMap();
function getStyle(el) {
  if (!el) return {};
  var style = cache.get(el);

  if (!style) {
    var win = (el === null || el === void 0 ? void 0 : el.ownerDocument.defaultView) || window;
    style = win.getComputedStyle(el);
    cache.set(el, style);
  }

  return style;
}

/* -----------------------------------------------------------------------------
 * Creating a Rectangle
 * -----------------------------------------------------------------------------*/
/**
 * Creates a rectangle from an HTML element
 */

function fromElement(el) {
  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
  return new lite_dist_coreGraphicsRectLite.Rect(getElementRect(el, opts));
}

/**
 * Get the rect of an element with the option to exclude the scrollbar or borders
 */
function getElementRect(el) {
  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
  var _opts$excludeScrollba = opts.excludeScrollbar,
      excludeScrollbar = _opts$excludeScrollba === void 0 ? false : _opts$excludeScrollba,
      _opts$excludeBorders = opts.excludeBorders,
      excludeBorders = _opts$excludeBorders === void 0 ? false : _opts$excludeBorders;

  var _el$getBoundingClient = el.getBoundingClientRect(),
      left = _el$getBoundingClient.left,
      top = _el$getBoundingClient.top,
      width = _el$getBoundingClient.width,
      height = _el$getBoundingClient.height;

  var rect = {
    x: left,
    y: top,
    width: width,
    height: height
  };
  var style = getStyle(el);
  var borderLeftWidth = style.borderLeftWidth,
      borderTopWidth = style.borderTopWidth,
      borderRightWidth = style.borderRightWidth,
      borderBottomWidth = style.borderBottomWidth;
  var borderXWidth = sum(borderLeftWidth, borderRightWidth);
  var borderYWidth = sum(borderTopWidth, borderBottomWidth);

  if (excludeBorders) {
    rect.width -= borderXWidth;
    rect.height -= borderYWidth;
    rect.x += px(borderLeftWidth);
    rect.y += px(borderTopWidth);
  }

  if (excludeScrollbar) {
    var scrollbarWidth = el.offsetWidth - el.clientWidth - borderXWidth;
    var scrollbarHeight = el.offsetHeight - el.clientHeight - borderYWidth;
    rect.width -= scrollbarWidth;
    rect.height -= scrollbarHeight;
  }

  return rect;
}

var px = function px(v) {
  return parseFloat(v.replace("px", ""));
};

var sum = function sum() {
  for (var _len = arguments.length, vals = new Array(_len), _key = 0; _key < _len; _key++) {
    vals[_key] = arguments[_key];
  }

  return vals.reduce(function (sum, v) {
    return sum + (v ? px(v) : 0);
  }, 0);
};

/**
 * Returns a new Rect that represents the union between multiple Rects
 */
function union() {
  for (var _len = arguments.length, rs = new Array(_len), _key = 0; _key < _len; _key++) {
    rs[_key] = arguments[_key];
  }

  var pMin = {
    x: Math.min.apply(Math, fromPoints._toConsumableArray(rs.map(function (r) {
      return r.minX;
    }))),
    y: Math.min.apply(Math, fromPoints._toConsumableArray(rs.map(function (r) {
      return r.minY;
    })))
  };
  var pMax = {
    x: Math.max.apply(Math, fromPoints._toConsumableArray(rs.map(function (r) {
      return r.maxX;
    }))),
    y: Math.max.apply(Math, fromPoints._toConsumableArray(rs.map(function (r) {
      return r.maxY;
    })))
  };
  return fromPoints.fromPoints(pMin, pMax);
}

/**
 * Creates a Rect from a DOM range. To learn more about ranges (text selection)
 * @see MDN https://developer.mozilla.org/en-US/docs/Web/API/Range
 * @see QuirksMode https://www.quirksmode.org/dom/range_intro.html
 */

function fromRange(range) {
  var rects = [];
  var clientRects = Array.from(range.getClientRects());

  if (clientRects.length) {
    var _iterator = createForOfIteratorHelper._createForOfIteratorHelper(clientRects),
        _step;

    try {
      for (_iterator.s(); !(_step = _iterator.n()).done;) {
        var rect = _step.value;
        rects.push(new lite_dist_coreGraphicsRectLite.Rect(rect));
      }
    } catch (err) {
      _iterator.e(err);
    } finally {
      _iterator.f();
    }
  } else {
    var start = range.startContainer;

    if (start.nodeType === Node.TEXT_NODE) {
      start = start.parentNode;
    }

    if (start instanceof HTMLElement) {
      var _rect = fromElement(start);

      _rect.set({
        x: _rect.maxX,
        width: 0
      });

      rects.push(_rect);
    }
  }

  return union.apply(void 0, rects);
}

/**
 * Creates a rectange from window object
 */
function fromWindow(win) {
  var opts = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
  return new lite_dist_coreGraphicsRectLite.Rect(getWindowRect(win, opts));
}
/**
 * Get the rect of the window with the option to exclude the scrollbar
 */

function getWindowRect(win, opts) {
  var _opts$excludeScrollba = opts.excludeScrollbar,
      excludeScrollbar = _opts$excludeScrollba === void 0 ? false : _opts$excludeScrollba;
  var innerWidth = win.innerWidth,
      innerHeight = win.innerHeight,
      doc = win.document,
      visualViewport = win.visualViewport;
  var width = visualViewport.width || innerWidth;
  var height = visualViewport.height || innerHeight;
  var rect = {
    x: 0,
    y: 0,
    width: width,
    height: height
  };

  if (excludeScrollbar) {
    var scrollBarWidth = innerWidth - doc.documentElement.clientWidth;
    var scrollBarHeight = innerHeight - doc.documentElement.clientHeight;
    rect.width -= scrollBarWidth;
    rect.height -= scrollBarHeight;
  }

  return rect;
}

exports.fromElement = fromElement;
exports.fromRange = fromRange;
exports.fromWindow = fromWindow;
exports.getElementRect = getElementRect;
exports.getWindowRect = getWindowRect;
exports.union = union;