NavGroup

Zestaw NavItem z tytułem, który można zwinąć. Użyj go, gdy panel boczny ma więcej niż około ośmiu linków; ustaw isCollapsible na false dla zwykłego nagłówka.

NavGroup

PodglądLink do sekcji Podgląd

Na żywo we wszystkich trzech motywach. Wszystko tutaj jest interaktywne.

Dzień, podgląd: NavGroup

Noc, podgląd: NavGroup

Wysoki kontrast, podgląd: NavGroup

UżycieLink do sekcji Użycie

tsx

import { NavGroup } from '@skribly/ui/shell'

tsx

<NavGroup label="Boards" currentLabel="contains the open page" defaultExpanded>
  <NavItem href="/boards/web">Website relaunch</NavItem>
</NavGroup>

Każda etykieta jest propem, więc aplikacja przekazuje własne słowa we własnym języku. Zobacz zasadę brak wbudowanego tekstu.

DostępnośćLink do sekcji Dostępność

Nagłówek jest przyciskiem z aria-expanded, przełączanym klawiszem Enter lub Spacją.
Gdy otwarta strona jest w środku, nagłówek przyjmuje kolor akcentu i kropkę, a currentLabel jest odczytywane po jego nazwie, więc zwinięta grupa nadal mówi, gdzie jesteś.
Otwiera się sama, gdy otwarta strona przechodzi do niej.

Ten przykład przechodzi przez axe we wszystkich trzech motywach przy każdym uruchomieniu testów. Zobacz, co sprawdzają testy.