Class: KeyboardFocusManager

KeyboardFocusManager(componentnon-null, opt_selectoropt)

Listens to keyboard events and uses them to move focus between different elements from a component (via the arrow keys for example). By default `KeyboardFocusManager` will assume that all focusable elements in the component will have refs that follow the pattern in KeyboardFocusManager.REF_REGEX, which includes a position number. The arrow keys will then automatically move between elements by incrementing/decrementing this position. It's possible to fully customize this behavior by passing a function to `setFocusHandler`. For more details check this function's docs.

Constructor

new KeyboardFocusManager(componentnon-null, opt_selectoropt)

Constructor for `KeyboardFocusManager`.
Parameters:
Name Type Attributes Description
component Component
opt_selector string <optional>
Source:

Methods

(protected) buildRef_(prefix, position) → {string}

Builds a ref string for the given position.
Parameters:
Name Type Description
prefix string
position number | string
Source:
Returns:
Type
string

disposeInternal()

Source:

(protected) getNextFocusable_(prefix, position, increment) → {string}

Gets the next focusable element, that is, the next element that doesn't have the `data-unfocusable` attribute set to `true`.
Parameters:
Name Type Description
prefix string
position number
increment number
Source:
Returns:
Type
string

(protected) handleKey_(eventnon-null)

Handles a `keydown` event. Decides if a new element should be focused according to the key that was pressed.
Parameters:
Name Type Description
event Event
Source:

(protected) handleKeyDefault_(eventnon-null)

Handles a key press according to the default behavior. Assumes that all focusable elements in the component will have refs that follow the pattern in KeyboardFocusManager.REF_REGEX, which includes a position number. The arrow keys will then automatically move between elements by incrementing/decrementing the position.
Parameters:
Name Type Description
event Event
Source:

(protected) increment_(position, increment) → {number}

Increments the given position, making sure to follow circular rules if enabled.
Parameters:
Name Type Description
position number
increment number
Source:
Returns:
Type
number

(protected) isFocusable_(element) → {boolean}

Checks if the given element is focusable.
Parameters:
Name Type Description
element Element
Source:
Returns:
Type
boolean

setCircularLength(circularLengthnullable)

Sets the length of the focusable elements. If a number is passed, the default focusing behavior will follow a circular pattern, going from the last to the first element, and vice versa.
Parameters:
Name Type Attributes Description
circularLength number <nullable>
Source:

setFocusHandler(focusHandler)

Sets a handler function that will be called to decide which element should be focused according to the key that was pressed. It will receive the key event and should return one of the following: - `true`, if the default behavior should be triggered instead. - A string, representing a `ref` to the component element that should be focused. - The element itself that should be focused. - Anything else, if nothing should be focused (skipping default behavior too).
Parameters:
Name Type Description
focusHandler function
Source:

start()

Starts listening to keyboard events and handling element focus.
Source:

stop()

Stops listening to keyboard events and handling element focus.
Source: