react-elegant-ui/lib/scroll-locker/StandartScrollLocker.js

Elegant UI components, made by BEM best practices for react

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.lock = lock;
exports.unlock = unlock;
var _utils = require("./utils");
var locksRegistry = new Map();
function getLockState(node) {
  return locksRegistry.get(node);
}
function setLockState(node, state) {
  locksRegistry.set(node, state);
}
function clearLockState(node) {
  locksRegistry.delete(node);
}
function hasStaticVerticalScroll(node) {
  var overflowY = getComputedStyle(node).overflowY;
  return /scroll/.test(overflowY);
}
function getScrollbarSize(node) {
  var hasScrollbarRoot = (0, _utils.isRootHTMLElement)(node) && window.innerWidth - document.documentElement.clientWidth > 0;
  var hasScrollbarNode = node.scrollHeight > node.clientHeight;
  if (hasScrollbarRoot || hasScrollbarNode || hasStaticVerticalScroll(node)) {
    return (0, _utils.getScrollBarGap)();
  }
  return 0;
}
/**
 * Lock will add padding to container instead of scroll to avoid blinking
 */
function lock(container) {
  var state = getLockState(container);
  if (state) {
    state.count++;
    return;
  }
  var scrollBarSize = getScrollbarSize(container);
  var computedPaddingRight = parseInt(getComputedStyle(container).getPropertyValue('padding-right'), 10);
  // NOTE: styles may be broken in future while unlocking if it will changed while locking
  // so probably we should observe changes and rewrite it to return actual values by unlocking
  var initialStyle = (0, _utils.setStyle)(container, {
    paddingRight: "".concat(computedPaddingRight + scrollBarSize, "px"),
    overflow: 'hidden',
    overflowX: 'hidden',
    overflowY: 'hidden'
  });
  setLockState(container, {
    initialStyle: initialStyle,
    count: 1
  });
}
function unlock(container) {
  var state = getLockState(container);
  if (!state) {
    return;
  }
  state.count--;
  if (state.count === 0) {
    (0, _utils.setStyle)(container, state.initialStyle);
    clearLockState(container);
  }
}