Mark an element for navigation.

This automatically applies the tabindex attribute and all keyboard and mouse listeners needed to enable NavController functionality.

  • Mark an element for 1 dimensional navigation.

    Returns DirectiveResult

    import {nav} from 'device-navigation';

    html`
    <div ${nav()}></div>
    `;
  • Mark an element for 2 dimensional navigation.

    Parameters

    • xCoord: number
    • yCoord: number

    Returns DirectiveResult

    import {nav} from 'device-navigation';

    html`
    <div ${nav(0, 1)}></div>
    `;
  • Mark an element as a nav group, which can't receive focus but can define a section of navigable elements.

    Parameters

    • isGroup: "group"

    Returns DirectiveResult

    import {group, nav} from 'device-navigation';

    const myTemplate = html`
    <div ${nav(group)}></div>
    `;