Date-Time Picker API

Properties

Name	Type	Default	Description
value	string | { start: string, end: string }	—	Initial value. Use an ISO date string for single dates, or an object with start/end for ranges. Time zones are not handled.
type	"date" | "datetime" | "daterange" | "datetimerange"	"date"	Mode of the picker.
error	boolean	false	Shows the error state. Not set automatically for invalid input.
disabled	boolean	false	Disables the picker so it cannot be opened.
inline	boolean	false	Renders the component as inline-block.
min-date	string	—	Minimum selectable date in ISO format.
max-date	string	—	Maximum selectable date in ISO format.
clear-hidden	boolean	false	Hides the clear button.
today-hidden	boolean	false	Hides the 'Today' shortcut button below the calendar.
manual-apply	boolean	false	Adds confirm and cancel buttons to the panel footer.
start-disabled	boolean	false	Disables only the start date picker in a range.
end-disabled	boolean	false	Disables only the end date picker in a range.
presets-disabled	boolean	false	Disables all preset buttons.
placeholder	string	—	Placeholder text shown when no date is selected.
isReady	readonly boolean	—	Indicates whether the component is ready to open.

JavaScript API

Name	Kind	Description
open()	action	Opens the calendar popup.

Events

Event	Description		Returns
change	Fires on date selection. Value is a string (yyyy-mm-dd or yyyy-mm-dd hh:mm) for single types, or { start, end } for range types.		{ detail: { value } }
error	Fires on invalid date input. Value holds the last valid value; inputValue holds what the user typed. Empty input sends empty string; invalid input sends 'Invalid Date'.		{ detail: { value, inputValue } }
close	Fires when the picker closes.		{ type: 'close' }
open	Fires when the picker opens.		{ type: 'open' }
ready	Fires when the component is ready to open.		—