mui / mui/material-ui

[autocomplete] New API to control the highlighted option

Open
#20,852 29 comments 13 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

scope: autocomplete type: new feature
Dominant language
JavaScript
Stars
99.1k
Forks
32.5k
Avg merge
2d 17h
Merged PRs (30d)
106

Description

  • I have searched the issues of this repository and believe that this is not a duplicate.

Summary 💡

Typing into the auto-complete and pressing enter should select something, such as the suggested option. The suggested option to select should be highlighted.

Examples 🌈

For example type in Good into the playground and press enter, nothing gets selected.

Lets say I have a text matching score when searching for Good as following:
The Good, the Bad and the Ugly = 0.3
Goodfellas = 0.8

I would want Goodfellas to be highlighted and selected when enter is pressed.

Motivation 🔦

The current auto-complete logic makes suggesting an option difficult.

Passing in a highlightedValue/suggestedValue would make the above possible. Set the first value in the list to be highlighted if one is not provided.

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the Autocomplete playground linked in the issue and inspect the current autocomplete logic for how typing, highlighting, and Enter selection interact. The work is done when a suggested or explicitly controlled option can be highlighted and pressing Enter selects it, including the Goodfellas example.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Feature
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.