The Search component displays a menu of as-you-type results from a variety of sources.

The search box will be 'activated' if the app's search state's getInitialSearch() value is a truthy value. If this is the case, an 'x' button will be shown next to the search field, and clicking it will clear the search.


  • state: SearchState instance.

Type Parameters




attrs: T

The attributes passed into the component.


element: Element

The root DOM element for the component.

hasFocus: boolean = false

Whether or not the search input has focus.

index: number = 0

The index of the currently-selected

  • in the results list. This can be a unique string (to account for the fact that an item's position may jump around as new results load), but otherwise it will be numeric (the sequential position within the list).

  • loadingSources: number = 0

    The number of sources that are still loading results.

    searchState: SearchState

    The instance of SearchState for this component.

    searchTimeout?: number
    sources?: SearchSource[]

    An array of SearchSources.

    updateMaxHeightHandler?: (() => void)

    Type declaration

      • (): void
      • Returns void

    MIN_SEARCH_LEN: number = 3

    The minimum query length before sources are searched.


    • get state(): SearchState
    • The instance of SearchState for this component.


      Replace withthis.searchState instead.

      Returns SearchState

    • set state(state: SearchState): void
    • Class component state that is persisted between redraws.

      Updating this will not automatically trigger a redraw, unlike other frameworks.

      This is different to Vnode state, which is always an instance of your class component.

      This is undefined by default.


      Returns void


    • Returns a jQuery object for this component's element. If you pass in a selector string, this method will return a jQuery object, using the current element as its buffer.

      For example, calling component.$('li') will return a jQuery object containing all of the li elements inside the DOM element of this component.


      the jQuery object for the DOM node



      • Optional selector: string

        a jQuery-compatible selector string

      Returns JQuery<HTMLElement>

    • Get the position of the currently selected search result item. Returns zero if not found.

      Returns number

    • Get the

    • in the search results with the given index (numeric or named).


    Returns JQuery<HTMLElement>

    Generated using TypeDoc v0.23.24