Dropdown Menu (AppDropdownMenu)

Dropdown Menu vs. Select

Keduanya terlihat mirip (tombol yang membuka daftar mengambang) tapi tujuannya berbeda secara mendasar. Select (AppSelect) adalah input formulir: ia menyimpan satu nilai terpilih lewat modelValue dan menampilkan nilai itu di kotak input, dipakai saat pengguna memilih dari data (mis. kategori ujian, provinsi). Dropdown Menu adalah pemicu aksi: ia tidak menyimpan nilai apa pun, hanya memancarkan event @select untuk menjalankan sebuah fungsi (mis. "Lihat Riwayat", "Edit Akun", "Keluar").

Aturan praktis: kalau hasil pilihannya perlu ditampilkan kembali sebagai nilai terpilih setelah menu ditutup, itu kebutuhan Select. Kalau menutup menu langsung menjalankan sesuatu dan tidak ada "nilai terpilih" yang perlu diingat di UI, itu kebutuhan Dropdown Menu.

Urutan item

Tempatkan aksi yang paling sering dipakai di posisi teratas, dan pisahkan aksi destruktif dari aksi biasa dengan satu divider di atasnya — jangan letakkan "Keluar Akun" bersebelahan langsung dengan aksi rutin tanpa pembatas visual.

Dukungan Keyboard

Pembaca Layar & ARIA

Tombol pemicu adalah <button> asli. Namun implementasi saat ini adalah gap nyata: item menu dirender sebagai <button> di dalam <div> tanpa role="menu"/role="menuitem", tanpa aria-haspopup/aria-expanded pada pemicu, dan menu tidak menutup dengan tombol Esc atau memindahkan fokus dengan panah atas/bawah — pengguna keyboard/pembaca layar hanya bisa Tab berurutan melalui setiap item seperti tombol biasa, bukan mengalami ini sebagai satu menu kohesif. Karena gap ini nyata dan belum diperbaiki di AppDropdownMenu.vue, status halaman ini Needs Review, bukan Ready — pola dasarnya berfungsi untuk mouse/sentuh dan Tab manual, tapi belum memenuhi pola ARIA menu (APG) secara penuh.

Warna & Kontras

Mengikuti kebijakan umum di Foundations — Accessibility.

Target Sentuh (Mobile)

Item menu punya padding py-2 penuh lebar (≈36-40px tergantung ukuran font) — mendekati namun berpotensi sedikit di bawah 44px pada mobile; perbesar padding vertikal saat dipakai di layar sentuh produksi.