React-day-picker: Adopt date-fns to format and manipulate dates

[gpbl]

When I first wrote this component, moment.js was the only good library to work with Date objects – but being its size so big I preferred to keep this package without depending on it (one of the reasons I made this component was that the available date picker were always requiring moment.js). But working with Date objects in javascript is not easy at all, and maintaining my own Dates manipulation library requires some effort.

Now we have date-fns: it is modular like lodash so I expect it that adopting it would not increase so much the size of this module. Adopting date-fns would have many benefits:

• finally fix long standing issues with timezones for some edge cases (need https://github.com/date-fns/date-fns/issues/376 closed)
• we won't need to change the date to 12AM to workaround such issues (need https://github.com/date-fns/date-fns/issues/376 closed)
• react-day-picker would have built-in support for i18n (wait for date-fns v2)
• we can remove the required moment.js support from the input component
• we would push js community away from moment.js and adopt this better date library

Similar discussion: https://github.com/airbnb/react-dates/issues/208

[r-tock]

@gpbl can you make this time library agnositic, we migrated away from moment to js-joda.github.io and it has splendid support for all the date/time functions you will ever need. If somehow react-day-picker can be modular to support any time library, we would appreciate it.

[gpbl]

@r-tock thanks for your feedback.

date-fns seems modular enough so it shouldn't add much weight to the final bundle. I'll do my tests to see how it works first, but it seems i can just replace the original utils with some of theirs.

[gpbl]

So far there are two missing pieces from date-fns:

• the ability to parse a date from any format (https://github.com/date-fns/date-fns/issues/219). Not sure if the parse function in v2 will work with different locales as well.
• getting the first day of the week for different locales: this issue seems telling it's not possible yet, even in the upcoming v2.

[leshakoss]

@gpbl hello, thank you for trying date-fns :-)

• parse would work with different locales — as long as the locale is adjusted for parse and v2.
• locale-specific first day of the week will be possible in v2: https://github.com/date-fns/date-fns/blob/v2/src/startOfWeek/test.js#L20-L32

We will release an alpha very soon. Stable version will be released after all locales are converted for v2.

Is there something I can do to help your library adopt date-fns?

[gpbl]

@leshakoss thanks from dropping by and share the positive news. Eager to try the alpha version and see how it works with the component.

[gpbl]

Another thing is that we may want to support UTC and date-fns still doesn't work with them. So, the initial idea to fix timezone issues with date-fns may not be right until that issue is closed as well.

[evgenyrodionov]

Guys, your collaboration is pretty awesome 🔥

[marshallford]

I'd love to see this happen.

[pushred]

Luxon is working great with UTC! Browser support is a bit iffy, depending on your needs.

https://moment.github.io/luxon/

[gpbl]

An update. We are not going to use date-fns anymore, as the dependency from moment has been removed and users can adopt their own library to parse and format dates. Still I'd love to add an example to the docs :)