Calendar Dialog 3 component design & features
This example uses the shadcn Calendar component inside a Dialog triggered by a Button in single-date selection mode. A side panel lists available appointment times in a ScrollArea, with selectable time slots alongside the date picker.
Appointment picker layouts suit scheduling interfaces for clinics, salons, and consultation booking where users choose both a date and an available time slot.