Komponen / Navigasi
NavList
Navigasi sidebar ala macOS untuk berpindah modul BizOps (Beranda, Sales & CRM, Order & pengadaan, Proyek, Finance). Gaya Symbol (ikon aksen) atau Tile (ubin berwarna ala System Settings) — sidebar produk memakai Tile.
Yang sudah ditangani
- Dirender sebagai <nav aria-label> berisi daftar <ul>/<li>; grup memakai <ul aria-labelledby> yang menunjuk judulnya.
- Item aktif memakai aria-current="page" sehingga pembaca layar menyebut "halaman saat ini".
- Item dengan subItems adalah <button aria-expanded aria-controls>; sub-daftar disembunyikan dengan hidden saat tertutup.
- Ikon dekoratif (aria-hidden); label teks selalu ada. Count ikut dibacakan sebagai bagian nama tautan.
- Fokus keyboard ditandai cincin fokus 3 px (shadow-focus).
Keyboard
| Tombol | Fungsi |
|---|---|
| TabShift+Tab | Pindah antar item |
| Enter | Membuka tautan |
| EnterSpasi | Membuka/menutup sub-item (item dengan subItems) |
Tanggung jawab Anda
- Beri label yang bermakna: teks label, atau aria-label untuk kontrol tanpa teks.
- Uji di mode gelap dan kontras tinggi (pilih lewat menu Tema di kanan atas, atau tombol Terang/Gelap di tiap contoh).
- Pastikan semua aksi bisa dijalankan dengan keyboard saja.