results SearchResult | null Name results Description The shop's answer to the query; shown only while it answers the query in the field.
Type null | SearchResult Default loading boolean false Name loading Description Shows the loading rows while the shop's search runs.
Type boolean Default false suggestions SearchSuggestion[] [] Name suggestions Description Searches offered as tags before typing and when nothing is found.
Type SearchSuggestion[] Default [] collections SearchCollection[] [] Name collections Description Curated rows of products, such as staff picks, shown before typing and when nothing is found.
Type SearchCollection[] Default [] highlight string | string [] Name highlight Description What counts as a match in the names: the typed query when left out, or the terms the shop's search matched.
Type string | string [] Default presentation ' inline ' | ' overlay ' 'inline' Name presentation Description Inline floats the panel under the field; overlay shows a search button that opens it full screen on phones and near the top on wide screens.
Type ' inline ' | ' overlay ' Default 'inline' searchHref ( ( query : string ) => string ) Name searchHref Description The results page for a query; links the suggestion tags and the "See all" row. Without it, tags run in the panel.
Type ( query : string ) : string Default shortcut boolean false Name shortcut Description Lets "/" focus the field, or open the overlay, while focus is not in another field.
Type boolean Default false placeholder string 'Search' Name placeholder Description Shown in the empty field.
Type string Default 'Search' searchLabel string 'Search' Name searchLabel Description Screen-reader name of the field and of the overlay's search button.
Type string Default 'Search' productsLabel string 'Products' Name productsLabel Description The heading over the products.
Type string Default 'Products' categoriesLabel string 'Categories' Name categoriesLabel Description The heading over the categories.
Type string Default 'Categories' brandsLabel string 'Brands' Name brandsLabel Description The heading over the brands.
Type string Default 'Brands' popularLabel string 'Popular searches' Name popularLabel Description The heading over the suggested searches before typing.
Type string Default 'Popular searches' noResultsLabel ( ( query : string ) => string ) `No results for ' ${ query } '. Try one of these:` Name noResultsLabel Description Builds the line shown when a search finds nothing.
Type ( query : string ) : string Default `No results for ' ${ query } '. Try one of these:` seeAllLabel ( ( total : number ) => string ) `See all ${ total } results` Name seeAllLabel Description Builds the "See all" row from the total; it shows when the total is more than the products listed.
Type ( total : number ) : string Default `See all ${ total } results` resultsAnnouncement ( ( count : number ) => string ) count === 1 ? '1 result' : ` ${ count } results` Name resultsAnnouncement Description Builds what screen readers hear when results land.
Type ( count : number ) : string Default count === 1 ? '1 result' : ` ${ count } results` cancelLabel string 'Cancel' Name cancelLabel Description The overlay's Cancel button on phones.
Type string Default 'Cancel' locale string Name locale Description The products' price locale, e.g. de - DE
Type string Default class ClassValue — Name class Description Classes added to the part's own element, after its recipe classes.
Type null | string | false | Record < string , any > | ClassValue[] Default — query string '' Name query Description What the shopper typed; run the shop's search on every change.
Type string Default '' open boolean false Name open Description Whether the panel is open, or the overlay in that presentation.
Type boolean Default false