Interface AutocompleteConfig<State>

interface AutocompleteConfig<State> {
    dropdownSelector: Selector | (input: HTMLInputElement) => Selector;
    fetch: SearchQuery | (input: string) => PromiseLike<State>;
    googleAnalytics?: boolean | GoogleAnalyticsConfig;
    historyEnabled?: boolean;
    historySize?: number;
    hitDecorators?: HitDecorator[];
    inputSelector: Selector;
    minQueryLength?: number;
    nostoAnalytics?: boolean;
    render: (container: HTMLElement, state: State) => void | PromiseLike<void>;
    submit?: (
        query: string,
        config: AutocompleteConfig<State>,
        options?: SearchAutocompleteOptions,
    ) => void;
}

Type Parameters

  • State

Properties

dropdownSelector fetch googleAnalytics? historyEnabled? historySize? hitDecorators? inputSelector minQueryLength? nostoAnalytics? render submit?

Properties

dropdownSelector

dropdownSelector: Selector | (input: HTMLInputElement) => Selector

The dropdown element to attach the autocomplete to

fetch

fetch: SearchQuery | (input: string) => PromiseLike<State>

The function to use to fetch the search state

OptionalgoogleAnalytics

googleAnalytics?: boolean | GoogleAnalyticsConfig

Google Analytics configuration. Set to false to disable.

OptionalhistoryEnabled

historyEnabled?: boolean

Enable history

OptionalhistorySize

historySize?: number

Max number of history items to show

OptionalhitDecorators

hitDecorators?: HitDecorator[]

Decorate each search hit before rendering

Example

import { priceDecorator } from "@nosto/autocomplete"

autocomplete({
  hitDecorators: [
    priceDecorator({ defaultCurrency: "USD" })
  ]
})

inputSelector

inputSelector: Selector

The input element to attach the autocomplete to

OptionalminQueryLength

minQueryLength?: number

Minimum length of the query before searching

OptionalnostoAnalytics

nostoAnalytics?: boolean

Enable Nosto Analytics

render

render: (container: HTMLElement, state: State) => void | PromiseLike<void>

The function to use to render the dropdown

Optionalsubmit

submit?: (
    query: string,
    config: AutocompleteConfig<State>,
    options?: SearchAutocompleteOptions,
) => void

The function to use to submit the search

Settings

Member Visibility

On This Page

Properties