InputDate provides a text input and calendar to select a single date, which can be used as a form input or filter.
Value & Default Value
InputDate can be initialized with a default selected date.
InputDate accepts a single event callback:
Selected:Jul 27, 2020
If you handle form validation externally (such as treating this date field as required),
InputDate accepts the
validationType prop to render an error state.
InputDate has built-in validation to verify that users enter a valid date string when manually typing into the provided textarea. If you wish to build into this validation, you can pass an
onValidationFail callback which will fire on blur if the text value does not match expected localized format.
INSTRUCTIONS: Try typing an invalid date string (ex: 'not/a/valid/date') and clicking or tabbing away to trigger blur event.
InputDate acccepts two different props for use in localizing calendar output. The first is
dateStringLocale accepts a country code and is used to format the rendered date string in the input box (i.e.
06/04/2020). The second is
localization, which is used to translate the calendar format and naming.
localization prop can be used to provide translation strings for the names of the months, the days of the week, and what day the week starts on (usually