DateInput
Allows the user to enter dates manually or trigger date picker calendar.Prop | Required | Description | Type |
|---|---|---|---|
value | ✅ | The value of the selected date. | Date |
onChange | ✅ | Callback called when the user inputs a valid date in the input, or selects one from the DatePicker. | (value?: Date) => void |
fromYear | — | The year the year picker starts from. Defaults to 100 years ago. | number |
toYear | — | The year the year picker ends on. Defaults to the two years in the future of the current year. | number |
disabledDates | — | A list of dates that should be disabled. Can be a list of single dates or a DateRange. | Matcher[] |
onBlur | — | Callback called when the text input loses focus. Used to confirm the final input. If the input is invalid, the reason is supplied in validationError. | ({ inputDate, date, validationError }: DateValidation) => void |
initialDisplayDate | — | The initial month and year displayed on the calendar if no existing date is entered. Defaults to the current month. | Date |
size | — | Control the size of the input. Defaults to medium. | "small" | "medium" |
disabled | — | Disables the input. | boolean |
invalid | — | The current validity state of the input. | boolean |
Prop | Required | Description | Type |
|---|---|---|---|
value | ✅ | The value of the selected DateRange. | DateRange |
onChange | ✅ | Callback called when the user inputs a valid date in the input, or selects one from the DatePicker. | (value?: DateRange) => void |
fromYear | — | The year the year picker starts from. Defaults to 100 years ago. | number |
toYear | — | The year the year picker ends on. Defaults to the two years in the future of the current year. | number |
disabledDates | — | A list of dates that should be disabled. Can be a list of single dates or a DateRange. | Matcher[] |
onBlur | — | Callback called when one of the text inputs loses focus. Used to confirm the final input. If the input is invalid, the reason is supplied in validationError. | ({ inputDateRange, dateRange, validationError }: DateRangeValidation) => void |
initialDisplayDate | — | The initial month displayed on the calendar if no existing date range is entered. Defaults to the current month. | Date |
size | — | Control the size of the input. Defaults to medium. | "small" | "medium" |
disabled | — | Disables the input. | boolean |
invalid | — | The current validity state of the input. | boolean |