Hopp til innhold

use­List­Navigation

Håndterer tastaturnavigasjon i popovers med lister, som Select og Combobox.

Kom i gang

Se oversikten for hvordan installere pakken.

Bruk

Hooken forventer en ref til et element med rollen listbox, som må ha en liste med fokuserbare elementer med rollen option.

const listRef = useRef(null);

useListNavigation({ ref: listRef });



return (

  <div ref={listRef} role="listbox" tabIndex={-1}>

    <button type="button" role="option" value="r">

      Rød

    </button>

    <button type="button" role="option" value="g">

      Grønn

    </button>

    <button type="button" role="option" value="b">

      Blå

    </button>

    <button type="button" role="option" value="c">

      Cyan

    </button>

    <button type="button" role="option" value="m">

      Magenta

    </button>

    <button type="button" role="option" value="y">

      Gul

    </button>

    <button type="button" role="option" value="k">

      Sort

    </button>

  </div>

);

React API

Her finner du en oversikt over props på komponentene i pakken.