Autocomplete is an alternative for the default VTEX autocomplete. It includes:

• Top Searches.
• Search History.
• Product Suggestions.
• Term Suggestions.

You can read a detailed explanation of Autocomplete and it's features here.

Add autocomplete-result-list.v2 into the blocks of a search-bar. We also recommend to set openAutocompleteOnFocus as shown.

Prop name	Type	Description	Default value
maxTopSearches	Number	Maximum number of terms in the top searches list	10
maxHistory	Number	Maximum number of terms in the search history list	5
maxSuggestedProducts	Number	Maximum number of suggested products	3
maxSuggestedTerms	Number	Maximum number of suggested terms	3
autocompleteWidth	Number	Autocomplete width. Number between 0 and 100	-
productLayout	ProductLayoutEnum	Defines the product layout in the suggested products list	-
hideTitles	Boolean	If true, all the titles will be hidden	false
historyFirst	Boolean	If true, the history list will be prioritized	false
customBreakpoints	CustomBreakpointsProp	Defines a maximum number of suggested products by breakpoints	-
__unstableProductOriginVtex	Boolean	You can use this property as true if any of your product-summary props come with a null value. This is because some product information does not come by default in the Search.	false
simulationBehavior	"skip" or "default"	If you want faster searches and do not care about most up to date prices and promotions, use "skip" value.	default
customPage	string	Defines a custom page to the autocomplete links. Example: store.search.custom	store.search
orderBy	enum	Determines which order products must follow when displayed. The possible values are named after the sorting type: OrderByReleaseDateDESC, OrderByBestDiscountDESC, OrderByPriceDESC, OrderByPriceASC, OrderByNameASC, OrderByNameDESC, OrderByScoreDESC, or OrderByTopSaleDESC. ASC and DESC stand for ascending order and descending order, respectively. OrderByScoreDESC considers only relevance settings and is not related to the Score Catalog field, incompatible with VTEX Intelligent Search. The last option (OrderByTopSaleDESC) considers the number of sold units of the product in the past 90 days, taking into account only ecommerce orders (no physical stores orders) from order-placed events (e.g. without checking if the payment was approved). If the store has an app, it is possible to consider the events from the app as long as they are implemented on the store's side, they aren't implemented by default. In case the shopper has an ad-blocking extension or a browser restriction that disables sending events, their navigation will not be counted.	OrderByScoreDESC

ProductLayoutEnum

Enum name	Enum value
Horizontal	HORIZONTAL
Vertical	VERTICAL

CustomBreakpointsProp

Prop name	Type	Description	Default value
md	BreakpointProp	Defines the options for the md breakpoint	-
lg	BreakpointProp	Defines the options for the lg breakpoint	-
xlg	BreakpointProp	Defines the options for the xlg breakpoint	-

BreakpointProp

Prop name	Type	Description	Default value
width	Number	Minimum width for the breakpoint	-
maxSuggestedProducts	Number	Maximum number of suggested products for the breakpoint	-