# Types (/themes/sdk/reference/search/types)

```ts
import { … } from '@poltura/theme-sdk/search';
```

## `SearchState` [#searchstate]

The storefront search: the query, live results, suggestions and the actions that drive them.

<TypeTable type={{"query":{"description":"What the shopper typed.","type":"string","required":true},"setQuery":{"description":"Updates the query; results follow after a short pause.","type":"(query: string) => void","required":true},"debouncedQuery":{"description":"The query results are for, after the pause.","type":"string","required":true},"hasQuery":{"description":"Whether the query is long enough to search, two characters or more.","type":"boolean","required":true},"results":{"description":"The matching products.","type":"readonly ProductCard[]","required":true},"total":{"description":"How many products match, or null before the first answer.","type":"number | null","required":true},"isFetching":{"description":"Whether results are loading.","type":"boolean","required":true},"suggestions":{"description":"Popular searches and matching categories.","type":"readonly SearchSuggestion[]","required":true},"featured":{"description":"The merchant's featured products, in order.","type":"readonly ProductCard[]","required":true},"categories":{"description":"The categories whose name matches the query.","type":"readonly SearchSuggestion[]","required":true},"collections":{"description":"The collections whose name matches the query.","type":"readonly SearchSuggestion[]","required":true},"pages":{"description":"The store's pages whose title matches the query.","type":"readonly SearchSuggestion[]","required":true},"recent":{"description":"What the shopper searched for on this device, newest first.","type":"readonly SearchSuggestion[]","required":true},"resultsHref":{"description":"The full results page for the query.","type":"string","required":true},"submit":{"description":"Opens the full results page for the query.","type":"() => void","required":true},"clear":{"description":"Empties the query.","type":"() => void","required":true}}} />

## `SearchSuggestion` [#searchsuggestion]

A suggestion shown before or while the shopper types: a popular or recent search, or a matching category, collection or page.

<TypeTable type={{"kind":{"description":"Whether it is a popular or recent search, or a category, collection or page.","type":"'query' | 'recent' | 'category' | 'collection' | 'page'","required":true},"label":{"description":"The suggestion's text in the page language.","type":"string","required":true},"href":{"description":"Where choosing it goes.","type":"string","required":true},"icon":{"description":"A category's icon, drawn with `Icon`; null or absent otherwise.","type":"IconValue | null","required":false}}} />

## `SearchOptions` [#searchoptions]

Options of [`useSearch`](/themes/sdk/reference/search/hooks#usesearch).

<TypeTable type={{"limit":{"description":"Most products to load as results; defaults to 6.","type":"number","required":false},"popularSearches":{"description":"Popular searches offered before the shopper types, in order.","type":"readonly string[]","required":false},"featuredCollectionId":{"description":"The collection whose products are offered as featured before the shopper types.","type":"string","required":false}}} />

## `SearchInputProps` [#searchinputprops]

Props of [`SearchInput`](/themes/sdk/reference/search/parts#searchinput).

<TypeTable type={{"value":{"description":"What the field shows.","type":"string","required":true},"onChange":{"description":"Called with the new text as the shopper types.","type":"(value: string) => void","required":true},"onSubmit":{"description":"Called when the shopper presses Enter without a highlighted option.","type":"() => void","required":true},"placeholder":{"description":"Shown while the field is empty.","type":"string","required":false},"className":{"description":"Classes added to the field's form.","type":"string","required":false}}} />

## `SearchResultsProps` [#searchresultsprops]

Props of [`SearchResults`](/themes/sdk/reference/search/parts#searchresults).

<TypeTable type={{"state":{"description":"The search whose results to list.","type":"SearchState","required":true},"onNavigate":{"description":"Called when the shopper opens a result, such as to close a dialog.","type":"() => void","required":false},"className":{"description":"Classes added to the list.","type":"string","required":false}}} />

## `SearchSuggestionsProps` [#searchsuggestionsprops]

Props of [`SearchSuggestions`](/themes/sdk/reference/search/parts#searchsuggestions).

<TypeTable type={{"items":{"description":"Popular searches and categories to offer.","type":"readonly SearchSuggestion[]","required":true},"featured":{"description":"Featured products to offer below them.","type":"readonly ProductCard[]","required":true},"onPick":{"description":"Called when the shopper picks a suggestion; without it every suggestion is a link.","type":"(suggestion: SearchSuggestion) => void","required":false},"onNavigate":{"description":"Called when the shopper opens a featured product.","type":"() => void","required":false},"className":{"description":"Classes added to the list.","type":"string","required":false}}} />

## `SearchDialogProps` [#searchdialogprops]

Props of [`SearchDialog`](/themes/sdk/reference/search/parts#searchdialog).

<TypeTable type={{"label":{"description":"Names the dialog and its icon button for assistive technology.","type":"string","required":true},"open":{"description":"Whether the dialog is open; leave unset to let the button control it.","type":"boolean","required":false},"onOpenChange":{"description":"Called when the dialog opens or closes.","type":"(open: boolean) => void","required":false},"children":{"description":"What the dialog holds, usually the field and the results.","type":"ReactNode","required":true},"className":{"description":"Classes added to the dialog.","type":"string","required":false}}} />

## `SearchGroupKind` [#searchgroupkind]

A result group of the search dropdown, as the element type the merchant adds under a search block.

```ts
type SearchGroupKind = 'products' | 'categories' | 'collections' | 'pages' | 'popular' | 'recent' | 'view-all' | 'empty'
```

## `SearchGroup` [#searchgroup]

One result group of the search dropdown, in the order the dropdown lists it.

<TypeTable type={{"id":{"description":"The group's block id.","type":"string","required":true},"kind":{"description":"What the group lists.","type":"SearchGroupKind","required":true},"heading":{"description":"The group's heading; empty shows the platform heading.","type":"string","required":true},"limit":{"description":"Most items the group lists.","type":"number","required":true},"image":{"description":"Whether product rows show their image.","type":"boolean","required":true},"price":{"description":"Whether product rows show their price.","type":"boolean","required":true},"badge":{"description":"Whether product rows show the merchant's badge.","type":"boolean","required":true},"layout":{"description":"Rows under each other, or a grid.","type":"'list' | 'grid'","required":true},"columns":{"description":"The grid's columns.","type":"2 | 3","required":true},"text":{"description":"The text of a view-all link or a no-results note; empty shows the platform text.","type":"string","required":true},"suggestions":{"description":"Whether a no-results note offers the popular searches.","type":"boolean","required":true},"attrs":{"description":"The group block's attributes, spread on the group's root.","type":"ElementAttrs","required":false}}} />

## `SearchDropdown` [#searchdropdown]

How the search dropdown is drawn.

<TypeTable type={{"width":{"description":"As wide as the field, a wide panel, or the page's full width.","type":"'input' | 'wide' | 'full'","required":false},"scheme":{"description":"The colour scheme the dropdown draws in; unset keeps the page's.","type":"string","required":false},"radius":{"description":"Corner radius in pixels; unset keeps the theme's corners.","type":"number","required":false},"shadow":{"description":"The dropdown's shadow; unset draws the soft overlay shadow.","type":"'none' | 'soft' | 'strong'","required":false},"phone":{"description":"On phones, open under the field or as a sheet from the bottom of the screen.","type":"'anchored' | 'sheet'","required":false}}} />

## `SearchComboboxProps` [#searchcomboboxprops]

Props of [`SearchCombobox`](/themes/sdk/reference/search/parts#searchcombobox).

<TypeTable type={{"limit":{"description":"Most products to load as results; defaults to 6.","type":"number","required":false},"popularSearches":{"description":"Popular searches offered before the shopper types, in order.","type":"readonly string[]","required":false},"featuredCollectionId":{"description":"The collection whose products are offered as featured before the shopper types.","type":"string","required":false},"placeholder":{"description":"Shown while the field is empty.","type":"string","required":false},"floating":{"description":"The suggestions and results float in a popover under the field; otherwise they list below it.","type":"boolean","required":false},"onNavigate":{"description":"Called when the shopper opens a result or a featured product, such as to close a dialog.","type":"() => void","required":false},"groups":{"description":"The dropdown's result groups in order; unset lists popular searches, products and the no-results note.","type":"readonly SearchGroup[]","required":false},"dropdown":{"description":"The dropdown's width, colour scheme, corners, shadow and phone presentation.","type":"SearchDropdown","required":false},"preview":{"description":"Holds the dropdown open with sample results, as the editor shows a selected search block.","type":"boolean","required":false}}} />

## `HeaderSearchProps` [#headersearchprops]

Props of [`HeaderSearch`](/themes/sdk/reference/search/defaults#headersearch).

<TypeTable type={{"limit":{"description":"Most products to load as results; defaults to 6.","type":"number","required":false},"popularSearches":{"description":"Popular searches offered before the shopper types, in order.","type":"readonly string[]","required":false},"featuredCollectionId":{"description":"The collection whose products are offered as featured before the shopper types.","type":"string","required":false},"variant":{"description":"A field with its results in a popover under it, an icon that opens a popover, or an icon that opens a dialog.","type":"'inline' | 'popover' | 'dialog'","required":false},"placeholder":{"description":"Shown while the field is empty.","type":"string","required":false},"className":{"description":"Classes added to the field or the icon button.","type":"string","required":false},"attrs":{"description":"A block's attributes, spread on the search's root when it draws the block itself.","type":"ElementAttrs","required":false},"groups":{"description":"The dropdown's result groups in order; unset lists popular searches, products and the no-results note.","type":"readonly SearchGroup[]","required":false},"dropdown":{"description":"The dropdown's width, colour scheme, corners, shadow and phone presentation.","type":"SearchDropdown","required":false},"preview":{"description":"Holds the dropdown open with sample results, as the editor shows a selected search block.","type":"boolean","required":false}}} />