Komponen / Form & input
MultiSelect
Memilih beberapa nilai dari daftar dengan pencarian — penanggung jawab tugas, tim proyek, reviewer BAST, tag. Nilai terpilih tampil sebagai Token di dalam field.
Yang sudah ditangani
- Input pencarian role="combobox" (aria-expanded, aria-controls, aria-activedescendant); panel role="listbox" aria-multiselectable="true" dengan role="option" aria-selected.
- Opsi terpilih ditandai checkbox tercentang + aria-selected; centang bukan satu-satunya penanda warna.
- Penambahan & penghapusan diumumkan lewat aria-live polite: "Rina Kartika ditambahkan. 3 dipilih."
- Setiap Token punya tombol hapus berlabel "Hapus <nama>"; Backspace/Delete saat tombol fokus juga menghapus.
- Pilihan tidak menutup panel, sehingga beberapa nilai bisa dipilih berturut-turut dengan keyboard.
Keyboard
| Tombol | Fungsi |
|---|---|
| Ketik | Menyaring opsi dan membuka daftar |
| ↓↑ | Membuka daftar / memindah opsi aktif (berputar) |
| HomeEnd | Saat daftar terbuka: ke opsi pertama/terakhir |
| Enter | Menambah atau melepas opsi aktif; panel tetap terbuka |
| Backspace | Di input kosong: menghapus Token terakhir |
| Esc | Menutup daftar; ditekan lagi mengosongkan teks pencarian |
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.