Skip to content
CoastKey Showcase
Back to catalog

Product UI Kit

Product Date / Time / Range Controls

CoastKey ProductDatePicker, ProductDateRangePicker, ProductCalendar, ProductRangeControl, ProductCalendarDayCell, ProductProgress, and ProductQuantityStepper are source-backed Product UI Kit controls for date selection, calendar presentation, booking, availability quantities, and progress. ProductDatePicker active-open and range active-open use source-backed inline-reference presentation for deterministic reference capture; future B2B time-window selection stays Booking Settings / Rule Pack component scope unless a standalone time field is proven by runtime source.

Date picker

Choose an available date.

May 2026

Date range picker

Select an available range.

May 2026

Calendar

May 2026
May 2026
June 2026

Calendar day states

neutral
hover
today
selected
range-start
range-middle
range-end
disabled

Range control

Budget rangeEUR 200 – 760
EUR 0EUR 1,000
Focused range66%
QuietPeak
Disabled rangeUnavailable
MinMax

Progress

Value 2525%

Low

Value 6666%

Mid

Value 100100%

Complete

Disabled66%

Unavailable

Quantity stepper

Adults

Guest count

2

Children

Ages 4–12

1