Support customized reference rectangle in preventOverflow modifier

Feature description

preventOverflow modifier gets reference rectangle directly. Maybe it could use the reference rectangle from state.

Why should this feature be part of the Popper’s core?

I tried to use plugin inlinePositioning for Tippy together with preventOverflow modifier The plugin customizes the way how reference rectangle is evaluated, but when preventOverflow modifier is used, it places the content incorrectly

I tracked it down to this line where detectOverflow gets the reference rectangle directly:

https://github.com/popperjs/popper-core/blob/671f71e2b6990765e5ca780daaea7d1f7175beb6/src/utils/detectOverflow.js#L66

By examining popperOffsets it looks like it uses state.rects.reference, so I am wondering whether the preventOverflow modifier could use the same.

https://github.com/popperjs/popper-core/blob/671f71e2b6990765e5ca780daaea7d1f7175beb6/src/modifiers/popperOffsets.js#L11

Not sure if feature or bug, don’t know the internals enough to tell whether the problem is in how Tippy plugin is written or in Popper modifier, neither have enough knowledge to be able to reproduce it on a clean CodePen for just Popper.

Please advise

[FezVrasta]

We could make boundary and altBoundary accept a function with state as argument so one can compute the parent they like the most. I’d accept a PR to add this functionality.

[atomiks]

Hi, we’re closing all feature requests related to Popper as it is entering low maintenance mode. All feature requests should now relate to the new package, Floating UI!

(This is now supported in Floating UI as it reads from the rect, but you’d probably use a Virtual Element)