fix: Improve activeIndex initialization in Select component

- Split useEffect for filtered items and dropdown open state
- Ensure activeIndex is always reset to 0 when dropdown opens
- Improve test stability with longer wait time and additional checks

Author: codegen-sh[bot]

apps/docs/src/remix-hook-form/select.stories.tsx

@@ -381,8 +381,12 @@ export const KeyboardNavigation: Story = {
       const firstOption = within(listbox).getByRole('option', { name: 'Alabama' });
       expect(firstOption).toHaveAttribute('id', firstOptionId);
 
-      // Wait a bit for the component to fully initialize
-      await new Promise(resolve => setTimeout(resolve, 100));
+      // Wait a bit for the component to fully initialize and ensure it's stable
+      await new Promise(resolve => setTimeout(resolve, 200));
+      
+      // Check that the first option is still active (no unintended keyboard events)
+      const currentActiveOptionId = searchInput.getAttribute('aria-activedescendant');
+      expect(currentActiveOptionId).toBe(firstOptionId);
       expect(firstOption).toHaveAttribute('data-active', 'true');
     });
 

packages/components/src/ui/select.tsx

@@ -74,12 +74,17 @@ export function Select({
     [options, query],
   );
 
-  // Reset activeIndex when filtered items change or dropdown opens
+  // Reset activeIndex when filtered items change
   React.useEffect(() => {
-    if (filtered.length > 0) {
+    setActiveIndex(0);
+  }, [filtered]);
+
+  // Reset activeIndex when dropdown opens
+  React.useEffect(() => {
+    if (popoverState.isOpen) {
       setActiveIndex(0);
     }
-  }, [filtered, popoverState.isOpen]);
+  }, [popoverState.isOpen]);
 
   // Scroll active item into view when activeIndex changes
   React.useEffect(() => {