The Haven Hotel
A Classic Urban Escape
AccommodationDatePicker
The <cb-accommodation-date-picker> is a web component that provides a "Book Now" button for a specific room type or unit. When clicked, it opens a calendar modal that lets guests select check-in and check-out dates. Upon confirmation, the guest is redirected to the Booking Engine with the selected dates and room pre-selected.
[Single] PropertyDatePicker - Horizontal
The <cb-property-date-picker> is a web component that provides a date selection bar for your property. It shows the check-in and check-out fields, a calendar popover, and a search button. When the guest selects dates and clicks Search, they are redirected to the Booking Engine with those dates, where they can choose a room and complete the booking.
[Single] PropertyDatePicker - Vertical
The <cb-property-date-picker> is a web component that provides a date selection bar for your property. It shows the check-in and check-out fields, a calendar popover, and a search button. When the guest selects dates and clicks Search, they are redirected to the Booking Engine with those dates, where they can choose a room and complete the booking.
MultiPropertyDatePicker - Horizontal
The <cb-multi-property-date-picker> is a web component for multiple properties within an association. You pass a required sub-domain attribute. It shows a property selector dropdown, date picker fields, and a search button. The guest picks a property, selects check-in and check-out dates, then clicks search and is redirected to the Booking Engine (or your custom URL) for that property.
MultiPropertyDatePicker - Vertical
The <cb-multi-property-date-picker> is a web component for multiple properties within an association. You pass a required sub-domain attribute. It shows a property selector dropdown, date picker fields, and a search button. The guest picks a property, selects check-in and check-out dates, then clicks search and is redirected to the Booking Engine (or your custom URL) for that property.