Skip to main content
To get started with React InstantSearch, see What is InstantSearch?

Basics

InstantSearchThe root wrapper component for all widgets and Hooks.
useInstantSearchReact Hook to access the InstantSearch API.
IndexThe provider component for an Algolia index.
SearchBoxA widget to display a search box.
ConfigureA widget to forward search parameters to Algolia.
useAutocompleteReact Hook to use an Autocomplete connector.
useVoiceSearchReact Hook to use a voice search connector.
insightsA middleware to help set the user token for insights purposes, and send events from built-in and custom widgets.
middlewareWith the middleware API, you can inject logic into InstantSearch.js.
renderStateThe renderState provides access to all the data to render the widgets, including the methods to refine the search.
useConnectorReact Hook to use an InstantSearch connector.

Results

HitsA widget to display a list of search results.
InfiniteHitsA widget to display an infinite list of results.
HighlightHighlighting visually emphasizes matching terms in your search results to help them stand out.
SnippetA widget that displays attributes in your search results in a shorter form (a snippet).

Recommendations

FrequentlyBoughtTogetherA widget to display a list of frequently bought together items.
RelatedProductsA widget to display a list of related products and related content.
TrendingItemsA widget to display a list of trending items.
TrendingFacetsA widget to display a list of trending facets.
LookingSimilarA widget to display a list of visually similar products.

Refinements

RefinementListA widget to display multi-select facets.
ColorRefinementListA widget that filters results based on color facet values. It helps users quickly visualize the kind of color that products have.
DynamicWidgetsA widget to conditionally render other widgets based on the index settings.
HierarchicalMenuWidget that displays a hierarchical menu.
useRangeReact Hook to filter search results within a numeric range.
MenuA widget to display a menu to let users choose a single value.
CurrentRefinementsA widget to display the list of active refinements in the search.
RangeInputA widget to select a numerical range using minimum and maximum inputs.
MenuSelectA widget to use a menu select connector.
ToggleRefinementA widget to provide an on/off filter.
useNumericMenuReact Hook that shows a list of numeric filters that are pre-configured when creating the widget.
useRatingMenuReact Hook to use a rating menu connector.
ClearRefinementsA widget to reset the active refinements of the search.

Pagination

PaginationA widget to display a pagination to browse pages.
HitsPerPageA widget to display a menu of options to change the number of results per page.

Metadata

BreadcrumbA widget to display navigation links to see where the current page is in relation to the facet’s hierarchy.
StatsA widget that displays the total number of matching hits and the time it took to get them (time spent in the Algolia server).
PoweredByA widget to display the Algolia logo to redirect to the Algolia website.
StateResultsA widget for accessing the state and results of InstantSearch.
QueryRulesCustomDataA widget to display custom data from rules.
QueryRuleContextA widget to set Rule contexts without rendering anything.
useQueryRulesReact Hook to set custom Rule contexts and display custom data from Rules.

Sorting

SortByA widget to sort by specified indices.
useRelevantSortReact Hook to use a relevant sort connector.
useGeoSearchA React Hook that displays search results on a Google Map.

Routing

simpleA state mapping used by default routing.
historyA router used by default routing.
uiStateAn object that represents a search UI state.
createInstantSearchRouterNextThe function that creates a Next.js-compatible InstantSearch router.

Server

InstantSearchSSRProviderThe provider component that forwards the server state to InstantSearch.
getServerStateThe function that retrieves the server state to pass to InstantSearchSSRProvider.
I