Component: Date input

[Yolijn]

GOV.UK seems to believe an input-group is the way to go for exact dates without a calendar dropdown. They do not use the <input type="date"/> at all.

We need to investigate if a date input is a component we should offer or if it is a pattern including specific autocomplete and validation instead. (Birthday, issue-date of a credit-card, expiry of a passport, etc.)

Use when

Date Input is used when any date can be selected and a calendar should be shown to pick one

Don't use when

picking a date from a calendar with availability. Use the Date Picker #35 instead

Reference

• https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
• https://design-system.service.gov.uk/components/date-input/
• https://design-system.service.gov.uk/patterns/dates/

Naming

Most used seems to be Date Picker, https://www.uiguideline.com/components/date-picker, but we'll use that name for the one with availability. To keep in line with other input type="x" we will name this component DateInput