Date Picker Component

[muratcorlu]

Figma

TBD

[sinandinar]

Period selections can be defined. Daily, weekly, monthly and yearly.

The ability to switch from one to the other in the period selections in connection with the selected date. For example, when 16 august is selected in the daily selection, when I switch to the weekly, the week that includes 16 august must be selected.

Custom shortcuts can be defined. e.g. last 30 days, last 7 days, yesterday, today.

Free range selection can be defined.

[muratcorlu]

I wanted to note down some of my observations and ideas about this component:

1. Firstly we need to have a “calendar” component that will render monthly calendar view and can be used inside data picker component as well as any other place tho shouw a calendar that some events attached to it.
2. Day and Month names should be localized but this can be done automatically by native Intl API.
3. Other labels like “Month”, “Week”, “Last 7 days” etc should be done by localization support. So maybe we can prioritze Localization support #398 first.

There is also a good/fresh article about A11Y and I18N of a calendar UI, we can make use of: https://css-tricks.com/making-calendars-with-accessibility-and-internationalization-in-mind/