Changing the algorithm in Floating UI will probably require considerable effort/time to resolve in a way that works in most situations (for instance, the alignment chosen seems incorrect based on the preferred side).
For now this is a good enough default to use as other libraries use this.
Two workarounds exist to this prop:
--available-width can be used to ensure left/right side popups don't overflow on narrow screens while preserving the preferred side axis.
A manual JavaScript media query based on the viewport width can be used to conditionally pass in a different preferred side.
Based on https://github.com/mui/base-ui/pull/810, auto side axis-based flipping should be off by default.
Changing the algorithm in Floating UI will probably require considerable effort/time to resolve in a way that works in most situations (for instance, the alignment chosen seems incorrect based on the preferred side).
For now this is a good enough default to use as other libraries use this.
Two workarounds exist to this prop:
--available-width
can be used to ensureleft
/right
side popups don't overflow on narrow screens while preserving the preferred side axis.