diff --git a/.changeset/friendly-icons-flow.md b/.changeset/friendly-icons-flow.md new file mode 100644 index 0000000000..148f7940ec --- /dev/null +++ b/.changeset/friendly-icons-flow.md @@ -0,0 +1,5 @@ +--- +'react-select': patch +--- + +Fix view height used for menu positioning to be the scroll parent instead of the window diff --git a/packages/react-select/src/components/Menu.tsx b/packages/react-select/src/components/Menu.tsx index f6846774ec..0a6c9db3d2 100644 --- a/packages/react-select/src/components/Menu.tsx +++ b/packages/react-select/src/components/Menu.tsx @@ -12,9 +12,10 @@ import { createPortal } from 'react-dom'; import { animatedScrollTo, getBoundingClientObj, - RectType, getScrollParent, getScrollTop, + normalizedHeight, + RectType, scrollTo, } from '../utils'; import { @@ -75,7 +76,9 @@ export function getMenuPlacement({ } = menuEl.getBoundingClientRect(); const { top: containerTop } = menuEl.offsetParent.getBoundingClientRect(); - const viewHeight = window.innerHeight; + const viewHeight = isFixedPosition + ? window.innerHeight + : normalizedHeight(scrollParent); const scrollTop = getScrollTop(scrollParent); const marginBottom = parseInt(getComputedStyle(menuEl).marginBottom, 10);