• Public
  • Public/Protected
  • All

Interface KeyboardSearchOptions<D, E>

Type parameters

  • D = unknown

  • E: HTMLElement = HTMLElement




findMatchIndex?: (value: string, values: readonly string[], startIndex: number, isSelfMatchable?: boolean) => number

Type declaration

    • (value: string, values: readonly string[], startIndex: number, isSelfMatchable?: boolean): number
    • A function that is used to find the next match index within a list of values by comparing the start values ignoring case.

      If a match can not be found from the search string, -1 will be returned. The search value is self-matchable by default, but it can be omitted by disabling the isSelfMatchable argument. This will make a self-match return -1.



      • value: string

        The current search value

      • values: readonly string[]

        A list of values to search within

      • startIndex: number

        The index within the values list to start the search from

      • isSelfMatchable: boolean = true

        Boolean if the current index can be included in the search

      Returns number

getItemValue?: GetItemValue<D>

A function that will get a string value from each item. The default implementation will:

  • return a number as a string
  • return a string as itself
  • return the result of item() if it is a function (this will also be used if the valueKey on an object is a function).
  • return item[valueKey] if it's an object (this uses typeof item === "object")
  • return the empty string for all other data types
items: readonly D[]

The list of items that should be searched whenever the user types a letter.

onChange: SearchChangeEvent<D, E>

A required change event handler that will be called whenever a user types a letter and it causes a new item to be "found". This should normally be something that either updates the aria-activedescendant id to the new found item's id or manually focus the item's DOM node.

onKeyDown?: KeyboardEventHandler<E>

An optional onKeyDown event handler that should be merged with the search functionality.

Note: This will be called before the search functionality is triggered.

resetTime?: number

The amount of time that a "search" value should be kept before resetting. The default value works for most cases, but it might be nice to configure it based on your use case.

searchIndex: number

The current index that should be "focused" due to a keyboard search. This should be updated whenever the onChange callback is fired.

valueKey?: string

The key to use to get a value string if the item is an object.

Generated using TypeDoc