Dropdown

Dropdown Menu menampilkan daftar opsi dalam tampilan yang ringkas dan mudah diakses. Komponen ini membantu pengguna memilih satu atau beberapa opsi tanpa membebani tampilan layar, sehingga antarmuka tetap efisien dan fleksibel.

Penggunaan

Gunakan Dropdown Menu untuk menampilkan daftar pilihan ketika terdapat banyak opsi dalam satu konteks. Komponen ini menjaga antarmuka tetap bersih dan mudah dipahami pengguna. Dropdown cocok digunakan pada formulir, filter, atau area dengan ruang terbatas agar pengguna dapat melihat dan memilih opsi tanpa meninggalkan halaman utama.

Anatomi

Cara Penggunaan yang Disarankan

✅ Disarankan

Gunakan label yang jelas, singkat, dan relevan dengan konteks pilihan.

❌ Dihindari

Hindari label yang terlalu panjang atau bertele-tele.

✅ Disarankan

Batasi jumlah item untuk menjaga keterbacaan.

❌ Dihindari

Jangan tampilkan dropdown terlalu panjang tanpa scroll, karena akan mengganggu tampilan.

✅ Disarankan

Pastikan lebar dropdown mengikuti trigger field agar tampilan tetap konsisten.

❌ Dihindari

Hindari perbedaan lebar antara field input dan menu dropdown.

Penerapan

Form Detail Penugasan

Dropdown digunakan untuk membantu pengguna memilih jenis penugasan dan tujuan yang relevan dengan konteks kerja.

Contohnya, pengguna dapat memilih Jenis Penugasan seperti “Dalam Instansi Pemerintah” atau “Luar Instansi Pemerintah” di dalam form, sehingga proses pengisian menjadi lebih efisien dan konsisten.