Skip to content

[autocomplete][docs] The Tailwind code demo doesn't include item focus styles #44483

@timbarclay

Description

@timbarclay

Related page

https://mui.com/base-ui/react-autocomplete/

Kind of issue

Missing information

Issue description

The Tailwind autocomplete demo has visible focus on selected items, i.e. if you hover an item or used the up/down keys, items are visibly focused.

However, if you copy the code from the code sample into a project, or if you open the linked codesandbox, those visible focus states don't work and there's no visible feedback about which item is focused.

From the devtools, it looks like there are some extra css rules applied to the in-page demo that aren't in the code sample.

Context

I'm trying to use the base-ui autocomplete component with Tailwind in the way demonstrated on the page.

Search keywords: tailwind focus autocomplete base-ui

Search keywords:

Metadata

Metadata

Assignees

No one assigned

    Labels

    docsImprovements or additions to the documentation.scope: autocompleteChanges related to the autocomplete. This includes ComboBox.type: bugIt doesn't behave as expected.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions