dcc redesign: DatePickerSingle and DatePickerRange

[KoolADE85]

At long last, here is a PR to modernize the date pickers.

You can play with them here:
https://dcc-redesign.plotly.app/datepickers-single
https://dcc-redesign.plotly.app/datepickers-range

Some improvements:

• Consistent with dcc.Dropdown's look and feel
• Keyboard accessible with focus carefully managed
• Support for mouse drag & wheel (and click of course)
• DatePickerRange supports selecting backwards as well as forwards
• A range of tests added for both new and existing features.

[AnnMarieW]

Wow! First look at this is amazing 🤩

I love how you can easily skip months and years - that's been a pain point in the old date pickers for a long time.

This is an incredible amount of work given that the Radix components does not have date pickers and you had to build all of this from scratch.

I see you are still using moment.js for the date formatting. Since they are no longer recommending moment.js to be used in new project, would you consider using one of their recommended alternatives? It might make it easier to add support for locale at some point https://momentjs.com/docs/#/-project-status/

[KoolADE85]

Thanks @AnnMarieW ! And wow, I did not realize moment was fading away like that! I will take a look at replacing moment - it shouldn't be too much effort there.

Wow! First look at this is amazing 🤩

I love how you can easily skip months and years - that's been a pain point in the old date pickers for a long time.

This is an incredible amount of work given that the Radix components does not have date pickers and you had to build all of this from scratch.

I see you are still using moment.js for the date formatting. Since they are no longer recommending moment.js to be used in new project, would you consider using one of their recommended alternatives? It might make it easier to add support for locale at some point https://momentjs.com/docs/#/-project-status/