Business Use Cases
Appointment Booking
Use Date with Mode Date & time, set a minimum of today.
Date of Birth
Use Date Mode Date with a maximum of today.
Stay length
Use Duration when you need how long something lasts, not what time it starts.
Configuration & Usage
1
Pick the tile
Drag Date, Time, or Duration onto the Canvas.
2
Choose Mode
On Date / Time, open settings and set Mode (e.g. Date range, Date & time, Time range).
3
Bounds & appearance
Set Minimum / Maximum, size, variant, and time options (hour cycle, seconds) when the mode includes time.
Technical Configuration Schemas
- Date
- Time
- Duration
string
default:"date"
date · date_time · month · year · date_rangestring
default:"md"
sm · md · lgstring
default:"primary"
Visual shell variant.
string
Earliest allowed value (ISO-style string).
string
Latest allowed value.
string
default:"24"
Shown for Date & time:
12 or 24.string
default:"numeric"
numeric · short · longData Payload
Single modes store a string. Range modes store{ "start": "…", "end": "…" }.