SearchBox (Insight Engine)

This is for:

Developer

The SearchBox headless controller offers a high-level interface for designing a common search box UI controller with highlighting for query suggestions.

Methods

clear

Clears the search box text and the suggestions.

selectSuggestion

Selects a suggestion and calls submit.

Parameters

  • value: string

    The string value of the suggestion to select

showSuggestions

Shows the suggestions for the current search box value.

submit

Deselects all facets and triggers a search query.

Parameters

  • analytics: LegacySearchAction

    The analytics action to log after submitting a query.

updateText

Updates the search box text value and shows the suggestions for that value.

Parameters

  • value: string

    The string value to update the search box with.

subscribe

Adds a callback that’s invoked on state change.

Parameters

  • listener: () => void

    A callback that’s invoked on state change.

Returns Unsubscribe: A function to remove the listener.

Attributes

state

The state of the SearchBox controller.

Properties

  • isLoading: boolean

    Determines if a search is in progress.

  • isLoadingSuggestions: boolean

    Determines if a query suggest request is in progress.

  • suggestions: Suggestion[]

    The query suggestions for the search box query.

  • value: string

    The current query in the search box.

Initialize

buildSearchBox

Creates an insight SearchBox controller instance.

Parameters

  • engine: InsightEngine

    The insight engine.

  • props: SearchBoxProps

    The configurable SearchBox properties.

Returns SearchBox

SearchBoxProps

The configurable SearchBox properties.

Properties

SearchBoxOptions

The SearchBox controller options.

Properties

  • clearFilters?: boolean

    Whether to clear all active query filters when the end user submits a new query from the search box. Setting this option to "false" is not recommended & can lead to an increasing number of queries returning no results.

  • enableQuerySyntax?: boolean

    Whether to interpret advanced Coveo Cloud query syntax in the query.

    Default: false

  • highlightOptions?: SuggestionHighlightingOptions

    Specifies delimiters to highlight parts of a query suggestion that e.g match, do not match the query.

  • id?: string

    A unique identifier for the controller. By default, a unique random identifier is generated.

  • numberOfSuggestions?: number

    The number of query suggestions to request from Coveo ML (for example, 3).

    Using the value 0 disables the query suggest feature.

    Default: 5

Delimiters

Properties

  • close: string

    Closing delimiter

  • open: string

    Opening delimiter

Suggestion

Properties

  • highlightedValue: string

    The suggestion after applying any highlightOptions.

  • rawValue: string

    The suggestion text.

SuggestionHighlightingOptions

Properties

  • correctionDelimiters?: Delimiters

    Delimiters for substrings that are correction of the input

  • exactMatchDelimiters?: Delimiters

    Delimiters for substrings that are exact match of the input

  • notMatchDelimiters?: Delimiters

    Delimiters for substrings that do not match the input

Unsubscribe

Call signatures

  • (): void