[Popup] Viewport Boundary Detection in a Scrollable Page or Container

[georgi-sla]

Describe the bug Currently, when there is a scrollbar on the page and the Popup is rendered in its rightmost section, the component seems to overlap with the scrollbar, and the viewport boundary detection is not correctly applied.

To Reproduce

1. Create a Popup component.
2. Set the overflow-y property of the page where the component is rendered so that it is scrollable.
3. Toggle the Popup.
4. Check the rightmost section of the component which is rendered beneath the scrollbar.

For further reference, please check out the following StackBlitz demo: https://stackblitz.com/edit/angular-mgcnum-mv5tsd

Second example - https://stackblitz.com/edit/angular-x4bk52?file=src%2Fapp%2Fapp.component.ts Just click the content inside the scrollable div.

Expected behavior The Popup should not overlap with the scrollbar of the page where it is rendered.

Screenshots