Web: Components: DropDown: Fixed position checking for non portal

This commit is contained in:
Ilya Oleshko 2022-02-25 15:30:30 +03:00
parent f2a8867a4c
commit 73dfb927cf

View File

@ -30,6 +30,7 @@ class DropDown extends React.PureComponent {
this.state = {
directionX: props.directionX,
directionY: props.directionY,
manualY: props.manualY,
};
this.dropDownRef = React.createRef();
@ -100,17 +101,24 @@ class DropDown extends React.PureComponent {
checkPosition = () => {
if (!this.dropDownRef.current) return;
const { smallSectionWidth } = this.props;
const { smallSectionWidth, forwardedRef } = this.props;
const { manualY } = this.state;
const rects = this.dropDownRef.current.getBoundingClientRect();
const container = { width: window.innerWidth, height: window.innerHeight };
const parentRects = forwardedRef?.current?.getBoundingClientRect();
const container = DomHelpers.getViewport();
const left = rects.left < 0 && rects.width < container.width;
const right =
rects.width &&
rects.left < (rects.width || 250) &&
rects.left > rects.width &&
rects.width < container.width;
const top = rects.bottom > container.height && rects.top > rects.height;
const top =
rects.bottom > (parentRects ? parentRects.top : container.height) &&
(parentRects ? parentRects.top : rects.top) > rects.height;
const bottom = rects.top < 0;
const x = left
? "left"
: right || smallSectionWidth
@ -118,9 +126,12 @@ class DropDown extends React.PureComponent {
: this.state.directionX;
const y = bottom ? "bottom" : top ? "top" : this.state.directionY;
const mY = top ? `${parentRects.height}px` : manualY;
this.setState({
directionX: x,
directionY: y,
manualY: mY,
width: this.dropDownRef ? this.dropDownRef.current.offsetWidth : 240,
});
};
@ -199,7 +210,7 @@ class DropDown extends React.PureComponent {
renderDropDown() {
const { maxHeight, children, showDisabledItems } = this.props;
const { directionX, directionY, width } = this.state;
const { directionX, directionY, width, manualY } = this.state;
let cleanChildren;
const rowHeights = React.Children.map(children, (child) =>
@ -221,6 +232,7 @@ class DropDown extends React.PureComponent {
{...this.props}
directionX={directionX}
directionY={directionY}
manualY={manualY}
{...dropDownMaxHeightProp}
>
{maxHeight ? (