Anchor Select menus to their trigger instead of the selected option

[midego1]

Problem

SelectContent defaults to position="item-aligned". In that mode Radix places the list so the selected option sits on top of the trigger. That's fine when the first option is selected, but with a later option selected in a long list, the whole panel shifts upward over the content above the trigger, gets clipped, and shows a scroll-up button. Hit in practice by a site picker in an artifact (a Search Console board with eight properties).

Fix

packages/react/src/components/select.tsx, plus a patch changeset:

• Default SelectContent to position="popper", anchored to the trigger with sideOffset={4} and collisionPadding={8}. It opens below the trigger and flips above when there is no room.
• Render SelectPrimitive.Arrow in popper mode, so a small caret points at the trigger on whichever side the list opens.
• Overflow moves from the content to the viewport so the arrow is not clipped, and the popper viewport no longer pins its height to the trigger height.

Callers can still pass position="item-aligned" explicitly. This changes the default for every Select in the console as well as in artifacts, which is intended, since the same effect applies to any long Select. The two existing callers that already pass position="popper" (pages/policies.tsx, plugins/connection-owner.tsx) keep their placement and gain the caret.

Screenshots

Reproduced with placeholder data (site-N.example), rendering the real SelectContent from main and from this branch with the artifact shell stylesheet. No real account data.

	First option selected	Last option selected
Before (main)
After (this PR)

Top-right is the bug: the panel jumps above the trigger, covers the heading and clips with a scroll-up button. In the bottom row the panel stays anchored to the trigger with every option visible, and flips above with the caret on its bottom edge when the trigger sits low in the viewport.

Verification

• CI on this branch, including the cloud E2E suites that drive Selects (admin-users-console, connect-panel, health-check-rpc-ui).
• Radix reports the placement it chose: no data-side before (item-aligned), data-side="bottom" after, data-side="top" in the flip case.
• Running on a self-hosted instance: in the artifact above, with the last option selected, the list now opens below the trigger with all options visible.

🤖 Generated with Claude Code