@procore/core-react/dist/_hooks/OverflowObserver/OverflowObserver.js

React library of Procore Design Guidelines

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
import React from 'react';
// Browsers occasionally miscalculate scroll and client width/height by one pixel up or down
//  so we're use |x| > 1 instead of x > 0 assertion eliminating the issue at the cost of
//  a false-negative result if the content is overflowing by just 1 pixel
function isContentOverflowing(length, visibleLength) {
  return Math.abs(length - visibleLength) > 1;
}
function isContentOverflowingX(node) {
  return isContentOverflowing(node.scrollWidth, node.clientWidth);
}
function isContentOverflowingY(node) {
  return isContentOverflowing(node.scrollHeight, node.clientHeight);
}

/**
 * @deprecatedSince 11
 * @deprecated Never officially documented/supported
 */
export function useOverflowObserver() {
  var _React$useState = React.useState(false),
    _React$useState2 = _slicedToArray(_React$useState, 2),
    isOverflowingX = _React$useState2[0],
    setIsOverflowingX = _React$useState2[1];
  var _React$useState3 = React.useState(false),
    _React$useState4 = _slicedToArray(_React$useState3, 2),
    isOverflowingY = _React$useState4[0],
    setIsOverflowingY = _React$useState4[1];
  var ref = function ref(node) {
    if (!node) {
      return;
    }
    var newIsOverflowingX = isContentOverflowingX(node);
    if (newIsOverflowingX !== isOverflowingX) {
      setIsOverflowingX(newIsOverflowingX);
    }
    var newIsOverflowingY = isContentOverflowingY(node);
    if (newIsOverflowingY !== isOverflowingY) {
      setIsOverflowingY(newIsOverflowingY);
    }
  };
  return {
    ref: ref,
    isOverflowingX: isOverflowingX,
    isOverflowingY: isOverflowingY,
    isOverflowing: isOverflowingX || isOverflowingY
  };
}

/**
 * @deprecatedSince 11
 * @deprecated Never officially documented/supported
 */
export function OverflowObserver(_ref) {
  var children = _ref.children;
  var _useOverflowObserver = useOverflowObserver(),
    ref = _useOverflowObserver.ref,
    isOverflowing = _useOverflowObserver.isOverflowing,
    isOverflowingX = _useOverflowObserver.isOverflowingX,
    isOverflowingY = _useOverflowObserver.isOverflowingY;
  if (typeof children !== 'function') {
    console.warn("OverflowObserver: expected a function as \"children\" prop, received ".concat(_typeof(children)));
    return children;
  }
  return children({
    ref: ref,
    isOverflowing: isOverflowing,
    isOverflowingX: isOverflowingX,
    isOverflowingY: isOverflowingY
  });
}
//# sourceMappingURL=OverflowObserver.js.map