Date Picker menampilkan kalender interaktif yang memudahkan pengguna memilih dan menetapkan tanggal dengan cepat dan akurat.
Gunakan Date Picker untuk membantu pengguna memilih tanggal atau rentang tanggal tanpa harus mengetik manual. Komponen ini membuat proses input tanggal lebih cepat, akurat, dan konsisten di seluruh antarmuka. Date Picker mendukung dua mode: Single Date Picker untuk memilih satu tanggal dan Range Date Picker untuk memilih rentang tanggal (mulai–akhir).
Digunakan untuk memilih satu tanggal dalam satu bulan atau tahun.
Contoh penggunaan
Digunakan untuk memilih rentang waktu antara dua tanggal (tanggal mulai dan tanggal akhir).
Contoh penggunaan
Gunakan tampilan Default untuk menampilkan tanggal dalam bentuk kalender bulanan. Pengguna dapat langsung memilih satu atau dua tanggal dari grid yang tersedia.
Contoh: Menampilkan tanggal untuk pemilihan waktu kerja, jadwal kegiatan, atau input formulir umum.
Gunakan tampilan bulanan saat pengguna perlu memilih bulan tanpa menampilkan tanggal. Mode ini mempercepat navigasi antar bulan.
Contoh: Menentukan periode laporan atau memilih bulan tertentu tanpa detail tanggal.
Gunakan tampilan Year untuk memungkinkan pengguna memilih tahun dalam rentang tertentu. Biasanya menampilkan 6–10 tahun dalam satu tampilan grid.
Contoh: Memilih tahun kelahiran, tahun anggaran, atau periode pelaporan tahunan.
Gunakan Range Date Picker untuk memilih rentang waktu antara dua tanggal: tanggal mulai dan tanggal akhir.
Komponen ini membantu pengguna menentukan periode waktu dengan lebih efisien.
Contoh:
Selalu tampilkan placeholder yang membantu pengguna, misalnya: “Pilih tanggal.”
Pastikan kontras warna antara tanggal aktif dan nonaktif cukup jelas agar mudah dibedakan.
Tampilkan bulan atau tahun satu per satu.
Jangan tampilkan bulan dan tahun secara bersamaan (harus satu per satu).
Gunakan Date Picker di dalam form input ketika pengguna hanya perlu memilih satu tanggal tertentu.
Misalnya: tanggal lahir, tanggal transaksi, atau jadwal kegiatan.
Gunakan Date Picker sebagai filter untuk membantu pengguna memilih periode waktu tertentu.
Biasanya digunakan pada laporan, dashboard analitik, atau halaman transaksi yang memerlukan filter tanggal mulai dan tanggal akhir.
