Skip to content

RAC ListBox: consider exposing shouldFocusOnHover + keyboard navigation #7989

@jeffijoe

Description

@jeffijoe

Provide a general summary of the feature here

Expose shouldFocusOnHover for ListBox and similar components to allow users to enable it manually.

Similarly, allow the user to opt-in to keyboard navigation for focus management.

🤔 Expected Behavior?

shouldFocusOnHover should be exposed in the ListBox props; should be able to opt-in to keyboard navigation via props without having to host in a specific component like Select

😯 Current Behavior

shouldFocusOnHover is not exposed in the ListBox props, but it works when specified, so I put a // @ts-ignore comment above it; keyboard navigation doesn't work when not hosted in a parent component that allows it

💁 Possible Solution

No response

🔦 Context

I'm building a popover with an autocomplete + a list box for selecting options for a multi-select style field (similar to a combo box, but for multiple items and the input field is in a popover instead of inline).

However, since I'm using ListBox as the base (I want to reuse the listbox of options for a single select as well), the items do not focus on hover unless rendered inside a regular Select or another component that passes shouldFocusOnHover.

Keyboard navigation also doesn't work without hosting in a supported component such as Select or Autocomplete.

💻 Examples

No response

🧢 Your Company/Team

No response

🕷 Tracking Issue

No response

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions