How to use the react-overlays/lib/utils/isOverflowing function in react-overlays

To help you get started, we’ve selected a few react-overlays examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github jquense / react-bootstrap-modal / src / Modal.js View on Github external
_getStyles() {
    if (!canUseDOM)
      return {}

    let node = findDOMNode(this.dialog)
      , doc = ownerDocument(node)
      , scrollHt = node.scrollHeight
      , bodyIsOverflowing = isOverflowing(this.props.container || doc.body)
      , modalIsOverflowing = scrollHt > doc.documentElement.clientHeight

    return {
      dialog: {
        zIndex: getZIndex('modal'),
        paddingRight: bodyIsOverflowing && !modalIsOverflowing ? scrollbarWidth() : void 0,
        paddingLeft:  !bodyIsOverflowing && modalIsOverflowing ? scrollbarWidth() : void 0
      },
      backdrop: {
        zIndex: getZIndex('backdrop')
      }
    }
  }
github react-bootstrap / react-bootstrap / src / Modal.js View on Github external
updateStyle() {
    if (!canUseDOM) {
      return;
    }

    const dialogNode = this._modal.getDialogElement();
    const dialogHeight = dialogNode.scrollHeight;

    const document = ownerDocument(dialogNode);
    const bodyIsOverflowing = isOverflowing(
      ReactDOM.findDOMNode(this.props.container || document.body)
    );
    const modalIsOverflowing =
      dialogHeight > document.documentElement.clientHeight;

    this.setState({
      style: {
        paddingRight:
          bodyIsOverflowing && !modalIsOverflowing
            ? getScrollbarSize()
            : undefined,
        paddingLeft:
          !bodyIsOverflowing && modalIsOverflowing
            ? getScrollbarSize()
            : undefined
      }
github zhbhun / WebpackStudyDemo / 7-advanced / 7.3-buil-performance / src / Modal.js View on Github external
_getStyles() {
    if (!canUseDOM) {
      return {};
    }

    let node = ReactDOM.findDOMNode(this._modal);
    let doc = ownerDocument(node);

    let scrollHt = node.scrollHeight;
    let bodyIsOverflowing = isOverflowing(ReactDOM.findDOMNode(this.props.container || doc.body));
    let modalIsOverflowing = scrollHt > doc.documentElement.clientHeight;

    return {
      modalStyles: {
        paddingRight: bodyIsOverflowing && !modalIsOverflowing ? getScrollbarSize() : void 0,
        paddingLeft: !bodyIsOverflowing && modalIsOverflowing ? getScrollbarSize() : void 0
      }
    };
  }
});
github forestturner / PokerHandRangeCalc / node_modules / react-bootstrap / es / Modal.js View on Github external
Modal.prototype.updateStyle = function updateStyle() {
    if (!canUseDOM) {
      return;
    }

    var dialogNode = this._modal.getDialogElement();
    var dialogHeight = dialogNode.scrollHeight;

    var document = ownerDocument(dialogNode);
    var bodyIsOverflowing = isOverflowing(ReactDOM.findDOMNode(this.props.container || document.body));
    var modalIsOverflowing = dialogHeight > document.documentElement.clientHeight;

    this.setState({
      style: {
        paddingRight: bodyIsOverflowing && !modalIsOverflowing ? getScrollbarSize() : undefined,
        paddingLeft: !bodyIsOverflowing && modalIsOverflowing ? getScrollbarSize() : undefined
      }
    });
  };