Select: auto-scroll selected option into view on open (align activeIndex to selected)

[codegen-sh]

Requested by: Jake Ruesink

Summary

• Implement auto-scroll of the selected option when opening the Select dropdown.
• Center the selected/active item in view for better UX.
• Prevent the subsequent activeIndex scroll from overriding the selected position by aligning activeIndex to the selected option on open.

Technical Changes

• packages/components/src/ui/select.tsx
  • On open, set activeIndex to the index of the currently selected value (fallback to 0 when none).
  • Scroll both selected and active items into view with block: 'center'.
  • Keep current behavior when no selection exists (list starts at top).

Why

• Fixes the UX issue shown in Storybook where opening a Select with a pre-selected value would display the top of the list instead of the selected option.

Notes

• No changes required in the Remix Hook Form wrapper; functionality is handled in the base UI Select.
• If desired, we can add props later to configure alignment (center/nearest) or behavior (smooth/auto).

---

💻 View my work • 👤 Initiated by Jake Ruesink • About Codegen
⛔ Remove Codegen from PR • 🚫 Ban action checks

[bolt-new-by-stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[github-actions]

📝 Storybook Preview: View Storybook

This preview will be updated automatically when you push new changes to this PR.

Note: The preview will be available after the workflow completes and the PR is approved for deployment.