getArrowNavigation

This function returns the Arrow Navigation instance, which you can use to control the navigation behavior. You can access the Arrow Navigation instance from any part of your application.

Syntax

import { getArrowNavigation } from '@arrow-navigation/core'

const navigationApi = getArrowNavigation()

Parameters

None

Returns

This function returns an object with the Arrow Navigation API. It provides the following methods and properties:

• getFocusedElement: Returns the currently focused element. Docs
• setFocusElement: Sets the focus on the specified element. Docs
• setInitialFocusElement: Sets the initial focus element. Docs
• registerGroup: Registers a group of elements for navigation. Docs
• updateGroup: Updates the configuration of a group. Docs
• registerElement: Registers an element inside a group. Docs
• updateElement: Updates the configuration of an element. Docs
• unregisterElement: Unregisters an element. Docs
• resetGroupState: Resets the state of a group. Docs
• destroy: Destroys the Arrow Navigation instance. Docs
• getCurrentGroups: Returns the currently registered groups. Docs
• getGroupElements: Returns the elements of a group. Docs
• getGroupConfig: Returns the configuration of a group. Docs
• getRegisteredElements: Returns the registered elements. Docs
• getFocusedGroup: Returns the currently focused group. Docs
• getNextElement: Returns the next element to focus. Docs
• getNextGroup: Returns the next group to focus. Docs
• handleDirectionPress: Handles the arrow key press. Docs
• on: Adds an event listener. Docs
• off: Removes an event listener. Docs

Example

import { getArrowNavigation } from '@arrow-navigation/core'

const navigationApi = getArrowNavigation()

navigationApi.setFocusElement('element-0-0')