react-instantsearch

  • Version 7.21.0
  • Published
  • 5.11 MB
  • 4 dependencies
  • MIT license

Install

npm i react-instantsearch
yarn add react-instantsearch
pnpm add react-instantsearch

Overview

⚡ Lightning-fast search for React, by Algolia

Index

Functions

Breadcrumb: ({
attributes,
rootPath,
separator,
transformItems,
translations,
...props
}: BreadcrumbProps) => React.JSX.Element;
    Carousel: <TObject extends Record<string, unknown>>(
    props: CarouselProps<TObject>
    ) => React.JSX.Element;

      function Chat

      Chat: <TObject extends RecordWithObjectID, TUiMessage extends UIMessage>({
      tools: userTools,
      toggleButtonProps,
      headerProps,
      messagesProps,
      promptProps,
      itemComponent,
      toggleButtonComponent,
      toggleButtonIconComponent,
      headerComponent,
      headerTitleIconComponent,
      headerCloseIconComponent,
      headerMinimizeIconComponent,
      headerMaximizeIconComponent,
      messagesLoaderComponent,
      messagesErrorComponent,
      promptComponent,
      promptHeaderComponent,
      promptFooterComponent,
      assistantMessageLeadingComponent,
      assistantMessageFooterComponent,
      userMessageLeadingComponent,
      userMessageFooterComponent,
      actionsComponent,
      classNames,
      translations,
      title,
      getSearchPageURL,
      ...props
      }: ChatProps<TObject, TUiMessage>) => React.JSX.Element;

        function ClearRefinements

        ClearRefinements: ({
        includedAttributes,
        excludedAttributes,
        transformItems,
        translations,
        ...props
        }: ClearRefinementsProps) => React.JSX.Element;

          function createDefaultTools

          createDefaultTools: <TObject extends RecordWithObjectID>(
          itemComponent?: RecommendComponentProps<TObject>,
          getSearchPageURL?: (nextUiState: IndexUiState) => string
          ) => UserClientSideTools;

            function CurrentRefinements

            CurrentRefinements: ({
            includedAttributes,
            excludedAttributes,
            transformItems,
            ...props
            }: CurrentRefinementsProps) => React.JSX.Element;

              function EXPERIMENTAL_Autocomplete

              EXPERIMENTAL_Autocomplete: <TItem extends BaseHit = BaseHit>({
              indices,
              showSuggestions,
              showRecent,
              searchParameters: userSearchParameters,
              ...props
              }: AutocompleteProps<TItem>) => React.JSX.Element;

                function FrequentlyBoughtTogether

                FrequentlyBoughtTogether: <THit extends BaseHit = BaseHit>({
                objectIDs,
                limit,
                threshold,
                queryParameters,
                fallbackParameters,
                escapeHTML,
                transformItems,
                itemComponent,
                headerComponent,
                emptyComponent,
                layoutComponent,
                ...props
                }: FrequentlyBoughtTogetherProps<THit>) => React.JSX.Element;

                  function HierarchicalMenu

                  HierarchicalMenu: ({
                  attributes,
                  limit,
                  rootPath,
                  separator,
                  showMore,
                  showMoreLimit,
                  showParentLevel,
                  sortBy,
                  transformItems,
                  translations,
                  ...props
                  }: HierarchicalMenuProps) => React.JSX.Element;

                    function Highlight

                    Highlight: <THit extends Hit<BaseHit>>({
                    hit,
                    attribute,
                    highlightedTagName,
                    nonHighlightedTagName,
                    separator,
                    ...props
                    }: HighlightProps<THit>) => React.JSX.Element;

                      function Hits

                      Hits: <THit extends BaseHit = BaseHit>({
                      escapeHTML,
                      transformItems,
                      hitComponent: HitComponent,
                      bannerComponent: BannerComponent,
                      ...props
                      }: HitsProps<THit>) => React.JSX.Element;

                        function HitsPerPage

                        HitsPerPage: ({
                        items: userItems,
                        transformItems,
                        ...props
                        }: HitsPerPageProps) => React.JSX.Element;

                          function InfiniteHits

                          InfiniteHits: <THit extends BaseHit = BaseHit>({
                          showPrevious: shouldShowPrevious,
                          cache,
                          escapeHTML,
                          transformItems,
                          translations,
                          bannerComponent: BannerComponent,
                          ...props
                          }: InfiniteHitsProps<THit>) => React.JSX.Element;

                            function LookingSimilar

                            LookingSimilar: <THit extends BaseHit = BaseHit>({
                            objectIDs,
                            limit,
                            threshold,
                            queryParameters,
                            fallbackParameters,
                            escapeHTML,
                            transformItems,
                            itemComponent,
                            headerComponent,
                            emptyComponent,
                            layoutComponent,
                            ...props
                            }: LookingSimilarProps<THit>) => React.JSX.Element;
                              Menu: ({
                              attribute,
                              limit,
                              showMore,
                              showMoreLimit,
                              sortBy,
                              transformItems,
                              translations,
                              ...props
                              }: MenuProps) => React.JSX.Element;

                                function Pagination

                                Pagination: ({
                                showFirst,
                                showPrevious,
                                showNext,
                                showLast,
                                padding,
                                totalPages,
                                translations,
                                ...props
                                }: PaginationProps) => React.JSX.Element;

                                  function PoweredBy

                                  PoweredBy: (props: PoweredByProps) => React.JSX.Element;

                                    function RangeInput

                                    RangeInput: ({
                                    attribute,
                                    min,
                                    max,
                                    precision,
                                    translations,
                                    ...props
                                    }: RangeInputProps) => React.JSX.Element;

                                      function RefinementList

                                      RefinementList: ({
                                      searchable,
                                      searchablePlaceholder,
                                      searchableSelectOnSubmit,
                                      attribute,
                                      operator,
                                      limit,
                                      showMore,
                                      showMoreLimit,
                                      sortBy,
                                      escapeFacetValues,
                                      transformItems,
                                      translations,
                                      ...props
                                      }: RefinementListProps) => React.JSX.Element;

                                        function RelatedProducts

                                        RelatedProducts: <TItem extends BaseHit = BaseHit>({
                                        objectIDs,
                                        limit,
                                        threshold,
                                        fallbackParameters,
                                        queryParameters,
                                        escapeHTML,
                                        transformItems,
                                        itemComponent,
                                        headerComponent,
                                        emptyComponent,
                                        layoutComponent,
                                        ...props
                                        }: RelatedProductsProps<TItem>) => React.JSX.Element;

                                          function ReverseHighlight

                                          ReverseHighlight: <THit extends Hit<BaseHit>>({
                                          hit,
                                          attribute,
                                          highlightedTagName,
                                          nonHighlightedTagName,
                                          separator,
                                          ...props
                                          }: ReverseHighlightProps<THit>) => React.JSX.Element;
                                            SearchBox: ({
                                            queryHook,
                                            searchAsYouType,
                                            ignoreCompositionEvents,
                                            translations,
                                            ...props
                                            }: SearchBoxProps) => React.JSX.Element;

                                              function Snippet

                                              Snippet: <THit extends Hit<BaseHit>>({
                                              hit,
                                              attribute,
                                              highlightedTagName,
                                              nonHighlightedTagName,
                                              separator,
                                              ...props
                                              }: SnippetProps<THit>) => React.JSX.Element;

                                                function SortBy

                                                SortBy: ({ items, transformItems, ...props }: SortByProps) => React.JSX.Element;

                                                  function Stats

                                                  Stats: ({ translations, ...props }: StatsProps) => React.JSX.Element;

                                                    function ToggleRefinement

                                                    ToggleRefinement: ({
                                                    attribute,
                                                    on,
                                                    off,
                                                    ...props
                                                    }: ToggleRefinementProps) => React.JSX.Element;

                                                      function TrendingItems

                                                      TrendingItems: <TItem extends BaseHit = BaseHit>({
                                                      facetName,
                                                      facetValue,
                                                      limit,
                                                      threshold,
                                                      fallbackParameters,
                                                      queryParameters,
                                                      escapeHTML,
                                                      transformItems,
                                                      itemComponent,
                                                      headerComponent,
                                                      emptyComponent,
                                                      layoutComponent,
                                                      ...props
                                                      }: TrendingItemsProps<TItem>) => React.JSX.Element;

                                                        function useStickToBottom

                                                        useStickToBottom: (options?: any) => any;

                                                          Type Aliases

                                                          type AutocompleteProps

                                                          type AutocompleteProps<TItem extends BaseHit> = ComponentProps<'div'> & {
                                                          indices?: Array<IndexConfig<TItem>>;
                                                          showSuggestions?: Partial<
                                                          Pick<
                                                          IndexConfig<{
                                                          query: string;
                                                          }>,
                                                          | 'indexName'
                                                          | 'getURL'
                                                          | 'headerComponent'
                                                          | 'itemComponent'
                                                          | 'classNames'
                                                          >
                                                          >;
                                                          showRecent?:
                                                          | boolean
                                                          | {
                                                          /**
                                                          * Storage key to use in the local storage.
                                                          */
                                                          storageKey?: string;
                                                          /**
                                                          * Component to use for each recent search item.
                                                          */
                                                          itemComponent: AutocompleteIndexProps<{
                                                          query: string;
                                                          }>['ItemComponent'] & {
                                                          onRemoveRecentSearch: () => void;
                                                          };
                                                          };
                                                          getSearchPageURL?: (nextUiState: IndexUiState) => string;
                                                          onSelect?: AutocompleteIndexConfig<TItem>['onSelect'];
                                                          panelComponent?: (props: {
                                                          elements: PanelElements;
                                                          indices: ReturnType<typeof useAutocomplete>['indices'];
                                                          }) => React.JSX.Element;
                                                          searchParameters?: AutocompleteSearchParameters;
                                                          classNames?: Partial<AutocompleteClassNames>;
                                                          placeholder?: string;
                                                          };
                                                            type BreadcrumbProps = Omit<BreadcrumbUiProps, keyof UiProps> &
                                                            Omit<UseBreadcrumbProps, 'separator'> & {
                                                            translations?: Partial<UiProps['translations']>;
                                                            };

                                                              type CarouselProps

                                                              type CarouselProps<TObject extends Record<string, unknown>> = Omit<
                                                              CarouselUiProps<TObject>,
                                                              | 'listRef'
                                                              | 'nextButtonRef'
                                                              | 'previousButtonRef'
                                                              | 'carouselIdRef'
                                                              | 'canScrollLeft'
                                                              | 'canScrollRight'
                                                              | 'setCanScrollLeft'
                                                              | 'setCanScrollRight'
                                                              >;

                                                                type ChatProps

                                                                type ChatProps<TObject, TUiMessage extends UIMessage = UIMessage> = Omit<
                                                                ChatUiProps,
                                                                keyof UiProps
                                                                > &
                                                                UseChatProps<TUiMessage> & {
                                                                itemComponent?: ItemComponent<TObject>;
                                                                tools?: UserClientSideTools;
                                                                getSearchPageURL?: (nextUiState: IndexUiState) => string;
                                                                toggleButtonProps?: UserToggleButtonProps;
                                                                headerProps?: UserHeaderProps;
                                                                messagesProps?: UserMessagesProps;
                                                                promptProps?: UserPromptProps;
                                                                toggleButtonComponent?: ChatUiProps['toggleButtonComponent'];
                                                                toggleButtonIconComponent?: ChatUiProps['toggleButtonProps']['toggleIconComponent'];
                                                                headerComponent?: ChatUiProps['headerComponent'];
                                                                headerTitleIconComponent?: ChatUiProps['headerProps']['titleIconComponent'];
                                                                headerCloseIconComponent?: ChatUiProps['headerProps']['closeIconComponent'];
                                                                headerMinimizeIconComponent?: ChatUiProps['headerProps']['minimizeIconComponent'];
                                                                headerMaximizeIconComponent?: ChatUiProps['headerProps']['maximizeIconComponent'];
                                                                messagesLoaderComponent?: ChatUiProps['messagesProps']['loaderComponent'];
                                                                messagesErrorComponent?: ChatUiProps['messagesProps']['errorComponent'];
                                                                promptComponent?: ChatUiProps['promptComponent'];
                                                                promptHeaderComponent?: ChatUiProps['promptProps']['headerComponent'];
                                                                promptFooterComponent?: ChatUiProps['promptProps']['footerComponent'];
                                                                actionsComponent?: ChatUiProps['messagesProps']['actionsComponent'];
                                                                assistantMessageLeadingComponent?: ChatMessageProps['leadingComponent'];
                                                                assistantMessageFooterComponent?: ChatMessageProps['footerComponent'];
                                                                userMessageLeadingComponent?: ChatMessageProps['leadingComponent'];
                                                                userMessageFooterComponent?: ChatMessageProps['footerComponent'];
                                                                translations?: Partial<{
                                                                prompt: ChatUiProps['promptProps']['translations'];
                                                                header: ChatUiProps['headerProps']['translations'];
                                                                message: ChatUiProps['messagesProps']['messageTranslations'];
                                                                messages: ChatUiProps['messagesProps']['translations'];
                                                                }>;
                                                                };

                                                                  type ClearRefinementsProps

                                                                  type ClearRefinementsProps = Omit<ClearRefinementsUiComponentProps, keyof UiProps> &
                                                                  UseClearRefinementsProps & {
                                                                  translations?: Partial<UiProps['translations']>;
                                                                  };

                                                                    type CurrentRefinementsProps

                                                                    type CurrentRefinementsProps = Omit<
                                                                    CurrentRefinementsUiComponentProps,
                                                                    keyof UiProps
                                                                    > &
                                                                    UseCurrentRefinementsProps;

                                                                      type FrequentlyBoughtTogetherProps

                                                                      type FrequentlyBoughtTogetherProps<THit extends BaseHit> = Omit<
                                                                      FrequentlyBoughtTogetherPropsUiComponentProps<Hit<THit>>,
                                                                      keyof UiProps<THit>
                                                                      > &
                                                                      UseFrequentlyBoughtTogetherProps<THit> & {
                                                                      itemComponent?: FrequentlyBoughtTogetherPropsUiComponentProps<THit>['itemComponent'];
                                                                      headerComponent?: FrequentlyBoughtTogetherPropsUiComponentProps<THit>['headerComponent'];
                                                                      emptyComponent?: FrequentlyBoughtTogetherPropsUiComponentProps<THit>['emptyComponent'];
                                                                      layoutComponent?: FrequentlyBoughtTogetherPropsUiComponentProps<THit>['layout'];
                                                                      };

                                                                        type HierarchicalMenuProps

                                                                        type HierarchicalMenuProps = Omit<HierarchicalMenuUiComponentProps, keyof UiProps> &
                                                                        UseHierarchicalMenuProps & {
                                                                        translations?: Partial<UiProps['translations']>;
                                                                        };

                                                                          type HighlightProps

                                                                          type HighlightProps<THit extends Hit<BaseHit>> = {
                                                                          hit: THit;
                                                                          attribute: keyof THit | string[];
                                                                          } & PartialKeys<
                                                                          Omit<HighlightUiComponentProps, 'parts'>,
                                                                          'highlightedTagName' | 'nonHighlightedTagName' | 'separator'
                                                                          >;

                                                                            type HitsPerPageProps

                                                                            type HitsPerPageProps = Omit<HitsPerPageUiComponentProps, keyof UiProps> &
                                                                            UseHitsPerPageProps;

                                                                              type HitsProps

                                                                              type HitsProps<THit extends BaseHit> = Omit<
                                                                              HitsUiComponentProps<Hit<THit>>,
                                                                              keyof UiProps<THit>
                                                                              > & {
                                                                              hitComponent?: React.JSXElementConstructor<{
                                                                              hit: Hit<THit>;
                                                                              sendEvent: SendEventForHits;
                                                                              }>;
                                                                              } & {
                                                                              bannerComponent?:
                                                                              | React.JSXElementConstructor<{
                                                                              banner: Required<HitsUiComponentProps<Hit<THit>>>['banner'];
                                                                              className: string;
                                                                              }>
                                                                              | false;
                                                                              } & UseHitsProps<THit>;

                                                                                type InfiniteHitsProps

                                                                                type InfiniteHitsProps<THit extends BaseHit = BaseHit> = Omit<
                                                                                InfiniteHitsUiComponentProps<Hit<THit>>,
                                                                                keyof UiProps<THit>
                                                                                > & {
                                                                                bannerComponent?:
                                                                                | React.JSXElementConstructor<{
                                                                                banner: Required<InfiniteHitsUiComponentProps<Hit<THit>>>['banner'];
                                                                                className: string;
                                                                                }>
                                                                                | false;
                                                                                } & UseInfiniteHitsProps<THit> & {
                                                                                /**
                                                                                * Displays the "Show Previous" button when the UI is loaded from a page
                                                                                * beyond the first one.
                                                                                * @default true
                                                                                */
                                                                                showPrevious?: boolean;
                                                                                translations?: Partial<UiProps<THit>['translations']>;
                                                                                };

                                                                                  type LookingSimilarProps

                                                                                  type LookingSimilarProps<THit extends BaseHit> = Omit<
                                                                                  LookingSimilarPropsUiComponentProps<Hit<THit>>,
                                                                                  keyof UiProps<THit>
                                                                                  > &
                                                                                  UseLookingSimilarProps<THit> & {
                                                                                  itemComponent?: LookingSimilarPropsUiComponentProps<THit>['itemComponent'];
                                                                                  headerComponent?: LookingSimilarPropsUiComponentProps<THit>['headerComponent'];
                                                                                  emptyComponent?: LookingSimilarPropsUiComponentProps<THit>['emptyComponent'];
                                                                                  layoutComponent?: LookingSimilarPropsUiComponentProps<THit>['layout'];
                                                                                  };
                                                                                    type MenuProps = Omit<MenuUiComponentProps, keyof UiProps> &
                                                                                    UseMenuProps & {
                                                                                    translations?: Partial<UiProps['translations']>;
                                                                                    };

                                                                                      type PaginationProps

                                                                                      type PaginationProps = Omit<PaginationUiComponentProps, keyof UiProps> &
                                                                                      UsePaginationProps & {
                                                                                      translations?: Partial<UiProps['translations']>;
                                                                                      };

                                                                                        type PoweredByProps

                                                                                        type PoweredByProps = Omit<PoweredByUiComponentProps, keyof UiProps>;

                                                                                          type RangeInputProps

                                                                                          type RangeInputProps = Omit<RangeInputUiProps, keyof UiProps> &
                                                                                          UseRangeProps & {
                                                                                          translations?: Partial<UiProps['translations']>;
                                                                                          };

                                                                                            type RefinementListProps

                                                                                            type RefinementListProps = Omit<RefinementListUiComponentProps, keyof UiProps> &
                                                                                            UseRefinementListProps &
                                                                                            Pick<
                                                                                            RefinementListWidgetParams,
                                                                                            'searchable' | 'searchablePlaceholder' | 'searchableSelectOnSubmit'
                                                                                            > & {
                                                                                            translations?: Partial<
                                                                                            UiProps['translations'] &
                                                                                            SearchBoxTranslations & {
                                                                                            /**
                                                                                            * What to display when there are no results.
                                                                                            */
                                                                                            noResultsText: string;
                                                                                            }
                                                                                            >;
                                                                                            };

                                                                                              type RelatedProductsProps

                                                                                              type RelatedProductsProps<TItem extends BaseHit> = Omit<
                                                                                              RelatedProductsUiComponentProps<TItem>,
                                                                                              keyof UiProps<TItem>
                                                                                              > &
                                                                                              UseRelatedProductsProps & {
                                                                                              itemComponent?: RelatedProductsUiComponentProps<TItem>['itemComponent'];
                                                                                              headerComponent?: RelatedProductsUiComponentProps<TItem>['headerComponent'];
                                                                                              emptyComponent?: RelatedProductsUiComponentProps<TItem>['emptyComponent'];
                                                                                              layoutComponent?: RelatedProductsUiComponentProps<TItem>['layout'];
                                                                                              };

                                                                                                type ReverseHighlightProps

                                                                                                type ReverseHighlightProps<THit extends Hit<BaseHit>> = {
                                                                                                hit: THit;
                                                                                                attribute: keyof THit | string[];
                                                                                                } & PartialKeys<
                                                                                                Omit<ReverseHighlightUiComponentProps, 'parts'>,
                                                                                                'highlightedTagName' | 'nonHighlightedTagName' | 'separator'
                                                                                                >;

                                                                                                  type SearchBoxProps

                                                                                                  type SearchBoxProps = Omit<
                                                                                                  SearchBoxUiComponentProps,
                                                                                                  Exclude<keyof UiProps, 'onSubmit' | 'autoFocus'>
                                                                                                  > &
                                                                                                  UseSearchBoxProps & {
                                                                                                  /**
                                                                                                  * Whether to trigger the search only on submit.
                                                                                                  * @default true
                                                                                                  */
                                                                                                  searchAsYouType?: boolean;
                                                                                                  /**
                                                                                                  * Whether to update the search state in the middle of a
                                                                                                  * composition session.
                                                                                                  * @default false
                                                                                                  */
                                                                                                  ignoreCompositionEvents?: boolean;
                                                                                                  translations?: Partial<UiProps['translations']>;
                                                                                                  };

                                                                                                    type SnippetProps

                                                                                                    type SnippetProps<THit extends Hit<BaseHit>> = {
                                                                                                    hit: THit;
                                                                                                    attribute: keyof THit | string[];
                                                                                                    } & PartialKeys<
                                                                                                    Omit<SnippetUiComponentProps, 'parts'>,
                                                                                                    'highlightedTagName' | 'nonHighlightedTagName' | 'separator'
                                                                                                    >;

                                                                                                      type SortByProps

                                                                                                      type SortByProps = Omit<SortByUiComponentProps, keyof UiProps> & UseSortByProps;

                                                                                                        type StatsProps

                                                                                                        type StatsProps = Omit<StatsUiComponentProps, keyof UiProps> &
                                                                                                        UseStatsProps & {
                                                                                                        translations?: Partial<UiProps['translations']>;
                                                                                                        };

                                                                                                          type ToggleRefinementProps

                                                                                                          type ToggleRefinementProps = PartialKeys<
                                                                                                          Omit<ToggleRefinementUiComponentProps, keyof UiProps>,
                                                                                                          'label'
                                                                                                          > &
                                                                                                          UseToggleRefinementProps;

                                                                                                            type Tool

                                                                                                            type Tool = UserClientSideTool;

                                                                                                              type Tools

                                                                                                              type Tools = UserClientSideTools;

                                                                                                                type TrendingItemsProps

                                                                                                                type TrendingItemsProps<TItem extends BaseHit> = Omit<
                                                                                                                TrendingItemsUiComponentProps<TItem>,
                                                                                                                keyof UiProps<TItem>
                                                                                                                > &
                                                                                                                UseTrendingItemsProps & {
                                                                                                                itemComponent?: TrendingItemsUiComponentProps<TItem>['itemComponent'];
                                                                                                                headerComponent?: TrendingItemsUiComponentProps<TItem>['headerComponent'];
                                                                                                                emptyComponent?: TrendingItemsUiComponentProps<TItem>['emptyComponent'];
                                                                                                                layoutComponent?: TrendingItemsUiComponentProps<TItem>['layout'];
                                                                                                                };

                                                                                                                  Package Files (28)

                                                                                                                  Dependencies (4)

                                                                                                                  Dev Dependencies (0)

                                                                                                                  No dev dependencies.

                                                                                                                  Peer Dependencies (3)

                                                                                                                  Badge

                                                                                                                  To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                                                                                                  You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/react-instantsearch.

                                                                                                                  • Markdown
                                                                                                                    [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/react-instantsearch)
                                                                                                                  • HTML
                                                                                                                    <a href="https://www.jsdocs.io/package/react-instantsearch"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>