Contact 49 - Book a call with team picker

Pro

Book-a-call section where visitors pick who to meet from three photo cards, then a date and time from that person's own availability.

Shadcn Contact 49 block

Component data

ID
contact49
Access
pro
Created
Oct 30, 2026
Type
block
Libraries
Radix UI, Base UI, React Aria

Contact 49 block design & features

The block starts by asking who the visitor would like to meet. Three portrait cards show each person's name, role and next free day, and work as a radio group, with a ring and a check mark on the chosen card.

The booking card on the right follows the selection. Its header names the person and the call length, and the compact month calendar only highlights the weekdays that person takes calls, so switching people changes both the open dates and the list of times.

Choosing a time enables a Next button that leads to a short name and email form with a link back to change the time. Confirming shows the chosen person's photo with the date and time and a note that the invite is on its way.

On mobile the three cards stay side by side above the booking card, and the time slots sit in a three-column grid under the calendar.