New component request: Autocomplete

[abdullahtellioglu]

Describe your motivation

Autocomplete is a handy component and is required in many business applications. Vaadin does not have an official Autocomplete component; instead, users must create one by extending TextField or Combobox. It would be great to have an official one in the component library.

Describe the solution you'd like

I would like Autocomplete to have parts below supported

• Input: Input container in a Vaadin Text Field where the user enters the value
• Overlay: The list of suggestions
• Prefix slot: Same as Input prefix slot
• Suffix slot: Same as Input suffix slot

I imagine properties and events would be like:

• search event: Triggers on key stroke and allows users to update the items list based on value
• value-selected event: Dispatches when the user selects an item from the list
• key-down event: Dispatches on key stroke when the text field is focused (It would allow users to add new items to the list) - The difference between Search event and KeyDown event is that KeyDown event is dispatched when 'Enter' is pressed; on the other hand, Search is dispatched when a character is entered
• options/items: List of items displayed in the list
• value property: The value

Some useful properties should be there, such as show-overlay-on-focus, item-value-path, item-label-path, allow-clear

Describe alternatives you've considered

No response

Additional context

I have checked other libraries that have Autocomplete components. Antd autocomplete is clear, basic https://ant.design/components/auto-complete. Mui has one, which is a bit complex, but has many functionalities like grouping https://mui.com/material-ui/react-autocomplete/#grouped

[web-padawan]

Internal discussion with some context: https://vaadin.slack.com/archives/C3TGRP4HY/p1758809957038809

More inspiration:

• Elix AutoCompleteComboBox: https://component.kitchen/elix/AutoCompleteComboBox
• React Aria Autocomplete: https://react-spectrum.adobe.com/react-aria/Autocomplete.html