The State Object
Below is a list of all the valid state properties.
selected
| Type |
|---|
Date | null |
The date selected by the user.
Default value
const selected = null
highlighted
| Type |
|---|
Date |
The date highlighted while navigating around the picker.
Default value
const highlighted = initialState.view
view
| Type |
|---|
Date |
The date used to represent the currently visible month.
Default value
const view = new Date()
firstDayOfWeek
| Type |
|---|
0 | 1 | 2 | 3 | 4 | 5 | 6 |
The index of the first day of the week.
0 → Sunday
6 → Saturday
Default value
const firstDayOfWeek = 0
maximum
| Type |
|---|
Date | null |
The maximum date that can be selected.
Default value
const maximum = null
minimum
| Type |
|---|
Date | null |
The minimum date that can be selected.
Default value
const minimum = null
disabled
| Type |
|---|
Array<number | Date | [Date, Date]> |
The list of disabled dates.
For numbers: that particular day of the week is disabled.
For dates: that specific date is disabled.
For tuples of two dates: they're used as a range of "from" and "to" dates to disable.
Default value
const disabled = []
template
| Type |
|---|
string |
The template used to format the selected date value.
The formatting hooks listed below can be used in the template.
Default value
const template = 'D MMMM, YYYY @ h:mm a'
Formatting hooks
| Hook | Description | Result |
|---|---|---|
D | Date of the month | 1 - 31 |
DD | Date of the month with a leading zero | 01 - 31 |
DDD | Day of the week in short form | Sun - Sat |
DDDD | Day of the week in full form | Sunday - Saturday |
M | Month of the year | 1 - 12 |
MM | Month of the year with a leading zero | 01 - 12 |
MMM | Month name in short form | Jan - Dec |
MMMM | Month name in full form | January - December |
YYYY | The year | 2000 - 2999 |
H | Hours in 24-hour format | 0 - 23 |
HH | Hours in 24-hour format with a leading zero | 00 - 23 |
h | Hours in 12-hour format | 1 - 12 |
hh | Hours in 12-hour format with a leading zero | 01 - 12 |
m | Minutes in hour | 0 - 59 |
mm | Minutes in hour with a leading zero | 00 - 59 |
a | Day time period (meridiem) | a.m. / p.m. |
A | Day time period in uppercase (meridiem) | AM / PM |
s | Seconds in minute | 0 - 59 |
ss | Seconds in minute with a leading zero | 00 - 59 |
x | The unix time stamp | 587534400000 |
Escaping formatting hooks
In order to type out characters of formatting hooks literally, they can be escaped by surrounding them with square brackets ([]).
For example:
'Unescaped MMMM' // Output: 'Unescaped January'
In contrast to:
'Escaped [MMMM]' // Output: 'Escaped MMMM'
templateHookWords
| Type |
|---|
{ |
A mapping of hooks to words for the parser to use.
Default value
const templateHookWords = {
MMM : ['Jan', 'Feb', ..., 'Dec'],
MMMM : ['January', 'February', ..., 'December'],
DDD : ['Sun', 'Mon', ..., 'Sat'],
DDDD : ['Sunday', 'Monday', ..., 'Saturday'],
}