Function ArrowKeysNavigation

ArrowKeysNavigation(props): ReactNode

The component alternative of the useArrowKeysNavigation hook.

Enables arrow navigation inside an enclosing FocusScope.

Parameters

props: PropsWithChildren<ArrowKeysNavigationProps>

Returns ReactNode

Example

const containerRef = useRef(null);

<FocusScope containerRef={containerRef}>
  <ArrowKeysNavigation>
    <div ref={containerRef}>
      <input/>
    </div>
  </ArrowKeysNavigation>
</FocusScope>