Unavailable dates

When a day or several days are unavailable within the calendar popover, each day should display a strikethrough to help the user understand that they cannot select it.

Disabled days use a distinct gray style to clearly differentiate them from unavailable days. When the calendar prevents selection of past dates, this visual treatment helps users distinguish disabled days from those marked as unavailable.

Why unavailable and disabled days are necessary

In a date selection system, users often need to distinguish between dates that cannot be selected and dates that are simply inactive. Supporting both states improves clarity and prevents errors.

Here's an example scenario: A potential guest is browsing a calendar to book a stay at a vacation rental.

• Unavailable dates: Days when the rental is already booked or blocked by the owner. These appear with a strikethrough, indicating they cannot be selected.
• Disabled dates: Past dates that are no longer valid for booking. These appear visually distinct (gray style) to show they are inactive.

Guests see unavailable dates marked clearly so they don't attempt to select them. Hosts or admins can view past dates as disabled and also mark future dates as unavailable when needed.

By supporting both behaviors, the system provides a clear, intuitive experience for different user roles and prevents confusion during date selection.