[Popper] Expose fallbackAxisSideDirection prop for opposite axis placement on collision

[buckhalt]

Bug report

Note: There have been prior similar issues (#973) and discussions (#2134) about this bug. However, this issue explains and requests the specific solution of directly exposing the fallbackAxisSideDirection prop to fix it.

Current Behavior

When a Popover side is set and there are collisions on both the preferred side and the opposite side on the same axis, the Popover is rendered with collisions. There is no current ability to allow switching to the opposite axis if there are collisions on both sides of the preferred axis.

Expected behavior

Allow fallback to the opposite axis if no placements along the preferred placement axis fit. This is already implemented in floating-ui using the fallbackAxisSideDirection prop.

Reproducible example

https://codesandbox.io/p/sandbox/runtime-cloud-3wxgyr?workspaceId=a15b72ac-5a79-4491-92e9-225b36bd712d

Suggested solution

Expose a fallbackAxisSideDirection prop, and pass it with the detectOverflowOptions in the floating-ui flip middleware.

Your environment

Software	Name(s)	Version
Radix Package(s)	@radix-ui/react-popover	1.1.1
React	n/a	19.0.0-rc-e56f4ae3-20240830
Browser	Chrome	128.0.6613.113 (Official Build) (arm64)
Assistive tech	n/a
Node	n/a
npm/yarn
Operating System	macOS	14.7

[theo-staizen]

We are running into issues that exposing this configuration could solve, especially on mobile.
Currently our only option is to add media query or resize observers and pass different configuration for small screens.
Given that the floating-ui library already supports this, I don't see what is the problem with exposing this option.