Accessible date picker for CDS

[abby-lammers]

For entering or selecting a date, USWDS provides a three-box system:

For most date selection cases, the USWDS date picker component is sufficient. This is the most accessible option for entering a date. Calendar date pickers tend to be difficult, sometimes impossible, for keyboard-only users to navigate.

A calendar date picker may be needed in situations where restricting dates by availability is important. If a calendar date picker is needed, be sure to follow accessibility guidelines. Axesslab provides multiple good resources for learning about date picker accessibility.

[jdkunesh]

@alaeder16 @mario-duran @chrisjcalderon how does this look to folks? Seems to have a good WCAG2 AA pedigree and works with Bootstrap 4:

https://github.com/eureka2/ab-datepicker

[alaeder16]

You mean like no icon at all?

[jdkunesh]

No, let's go with the direction we chose yesterday. We can use this kind of visualization (and eventually component):

http://eureka2.github.io/ab-datepicker/

as an accessible Bootstrap component (https://github.com/eureka2/ab-datepicker) instead of the USWDS [mm] [dd] [yyyy] format we have today.

[alaeder16]

ok, great. I added it to Figma in components

[jdkunesh]

Will integrate this item as a submodule.

[mario-duran]

Added a quick example on the main kitchen sink home page and added a full set of examples in the Components Page