How to force the tooltip to stay in the parent container with Popper.js

I’m trying to figure out how to make a tooltip with Popper.js to stay in the parent container of both the tooltip and the target when scrolling.

Here is an example: https://codesandbox.io/s/upbeat-hodgkin-ib2trf?file=/src/index.js

To reproduce the issue, we must set the height of the page small enough.
We can see that the tooltip, overflow in the content under the main container #container.

I would like the tooltip to stay in the #container when scrolling down.