Shadcn.io is not affiliated with official shadcn/ui
Calendar with Month and Year Selector in Dialog
A calendar dialog with dropdown month and year selectors for quick navigation to distant dates
Clicking through months to reach birthdates or historical data wastes time. This React calendar dialog replaces arrow navigation with dropdown selectors using shadcn/ui components. Built with Dialog, Calendar, and Select, users jump directly to any month and year. Perfect for birthdate pickers in registration forms, historical event scheduling, or any application where users frequently navigate to dates beyond recent months requiring efficient distant date access.
Calendar with Month and Year Selector in Dialog preview
Installation
Related Components
Month/Year Calendar Inline
Dropdown navigation without dialog
Range Calendar Dialog
Dual-month range selection
Standard Dialog
Basic modal dialog structure
Select Component
Dropdown selections
Date & Time Dialog
Date picker with time input
Date Picker Popover
Date selection in popover
FAQ
Was this page helpful?
Sign in to leave feedback.