Overflowing popper

[kouroshezzati]

I'm using @popperjs/core version 2.5.3 to open my component under a dropdown. it works fine but when user opens the popper in small monitors the bottom of the popper will be cut off, so with detectOverflow() you can see the bottom of rect has a positive digit.
I want to open the popper in the middle of the screen so that the user can see the whole popper, I've spent a lot of time to figure out how to change the coordinate of the popper's rect to show it in the middle of the viewport but it seems there is no way to apply a computed coordinate base on the viewport to the popper that's just been opened. could you guide me a solution to address this issue?
thanks in advance.