NavBar: osnove

1. Pregled in namen

Stanje: [Live]. Gradi na istem navigacijskem načelu kot tree() (povezave, brez stanja izbire na strani odjemalca).

2. Predpogoji

Nobenih onkraj obstoječe pogodbe helper-API.

3. Pojmi

Ravne skupine namesto rekurzije: skupine NavBar so ravne (vnosi nimajo lastnih otrok) — za razliko od vozlišč tree(), ki jih je mogoče rekurzivno gnezditi. Osnovna tehnika (združevanje brez JavaScripta prek <details>) je enaka odsekom propertyGrid() in vozliščem tree() z otroki — en sam ponavljajoč se vzorec v celotni knjižnici.

4. Prvi koraki

echo $widgets->navBar([
    [
        'label' => 'Priljubljeno',
        'items' => [
            ['label' => 'Naloge', 'href' => wl($ID, ['ns' => 'naloge']), 'icon' => $iconStar],
            ['label' => 'Ekipa',  'href' => wl($ID, ['ns' => 'ekipa'])],
        ],
    ],
], ['persistKey' => 'sidebar:navbar']);

5. Uporaba

Na skupinah temelječa vrsta vsebine stranske vrstice (glej predstavitveni pregled) — alternativa tree() za vsebino stranske vrstice brez naravne hierarhije.

6. API referenca

navBar(array $groups, array $opts = []): string v helper_plugin_wkfluentui_widgets. Prazen niz pri praznem $groups.

7. Parametri, možnosti in stanja

Raven	Ključ	Tip	Pomen
Skupina	`label`	string	naslov skupine (polkrepko, enak videz fieldset-legende kot pri odsekih propertyGrid())
Skupina	`items`	array	seznam vnosov skupine
Skupina	`collapsed`	bool	začetno strnjeno (analogno obstojnosti strnitve odseka pri `propertyGrid()`)
Vnos	`label`	string	besedilo povezave
Vnos	`href`	string	ciljni URL
Vnos	`icon`	string	izbirni zaupanja vreden HTML ikone
Vnos	`badge`	int/string	izbirna oznaka števca/stanja — izriše se prek `countBadge()` (en sam vir značk v knjižnici)
Vnos	`badgeLabel`	string	besedilo za bralnik zaslona ob znački (npr. „3 neprebrano„) — golo število bi se sicer izgovorilo kot del besedila povezave
Vnos	`active`	bool	označi trenutni vnos (razred `–active` + `aria-current="page"`)
$opts	`persistKey`	string	odprto stanje skupin preživi ponovna nalaganja (splošna obstojnost details v `scripts/propertygrid.js`-u, `localStorage` pod `wk-details:<persistKey>`)

Generiran izris: <nav class="wk-navbar"> → na skupino en odsek <details open> (strnitev brez JavaScripta), vnosi kot <ul><li><a> znotraj skupine; vsaka povezava nosi aria-label in title s svojim label (preživi strnitev ikone stranske vrstice).

8. Popolni primeri

echo $widgets->navBar([
    [
        'label' => 'Priljubljeno',
        'items' => [
            ['label' => 'Naloge', 'href' => wl($ID, ['ns' => 'naloge']), 'icon' => $iconStar],
            ['label' => 'Ekipa',  'href' => wl($ID, ['ns' => 'ekipa'])],
        ],
    ],
    [
        'label' => 'Moduli',
        'items' => [
            ['label' => 'Wiki', 'href' => wl($ID, ['ns' => 'wiki']), 'badge' => 3],
            ['label' => 'Blog', 'href' => wl($ID, ['ns' => 'blog'])],
        ],
    ],
], ['persistKey' => 'sidebar:navbar']);

9. Omejitve in robni primeri

Brez rekurzije (odsek 3) — vnosi z lastnimi otroki namesto tega spadajo v TreeView.

10. Dostopnost in združljivost

Celoten pregled: Accessibility.

11. Odpravljanje težav

Se ne uporablja.

12. Sorodne teme

predstavitveni pregled — vsaka kategorija
TreeView: osnove — sorodna, a hierarhična alternativa
Vertical Grid: osnove — vzor tehnike strnitve skupin