Options
All
  • Public
  • Public/Protected
  • All
Menu

Interface BaseKeyboardMovementOptions<D, CE, IE>

Type parameters

  • D = unknown

  • CE: HTMLElement = HTMLElement

  • IE: HTMLElement = HTMLElement

Hierarchy

Index

Properties

Methods

Properties

decrementKeys

decrementKeys: IncrementMovementKey[]

The keys that can trigger a move to the previous item. If the loopable config is enabled, this will loop to the last item if the first item is currently "focused".

Optional findMatchIndex

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

The function used to find a match index within the items list. You most likely won't want to change this.

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.

      internal

      Parameters

      • 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

Optional getItemValue

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

incrementKeys

incrementKeys: IncrementMovementKey[]

The keys that can trigger a move to the next item. If the loopable config is enabled, this will loop to the first item if the last item is currently "focused".

items

items: readonly D[]

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

jumpToFirstKeys

jumpToFirstKeys: JumpMovementKey[]

The keys that can trigger a move to the first item.

jumpToLastKeys

jumpToLastKeys: JumpMovementKey[]

The keys that can trigger a move to the last item.

Optional loopable

loopable: boolean

Boolean if the keyboard movement should be able to loop around once it has reached the start or end of all the items.

Optional onKeyDown

onKeyDown: KeyboardEventHandler<CE>

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

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

Optional resetTime

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.

Optional searchable

searchable: boolean

Boolean if the movement should also include printable characters search movement.

Optional stopPropagation

stopPropagation: boolean

Boolean if the event should trigger event.stopPropagation() when the custom keyboard movement is triggered. This should generally be kept as false or undefined by default, but enabled when creating more complex 2-dimensional movement cases such as grids.

Optional valueKey

valueKey: string

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

Methods

Optional onChange

  • 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.

    Parameters

    Returns void

Generated using TypeDoc