Focus on the first available (not disabled) option

[Mariam4324]

Provide a general summary of the feature here

We would like to have the ability for the component to automatically focus the first available (non-disabled) option.

🤔 Expected Behavior?

When the dropdown opens, focus should move to the first active (non-disabled) option.

😯 Current Behavior

When the dropdown opens, the focus is set on the first option even if it is disabled.

💁 Possible Solution

If the current focus target cannot receive focus (e.g., the first option is disabled), the component should automatically fall back to the first available (non-disabled) option.

🔦 Context

This behavior causes issues with keyboard navigation and reduces accessibility. Users are forced to manually navigate through disabled items, which goes against standard UX expectations for selectable lists. Fixing this would improve predictability and usability, especially for users relying on keyboard navigation or assistive technologies.

💻 Examples

See the example

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response