react-day-picker is a flexible date picker component for React.

  • no external dependencies
  • select days, ranges, whatever using CSS modifiers
  • ready for localization, even with moment.js
  • customizable style
  • navigable via keyboard, ARIA support

As with every other well-written React component you can easily include this in your own code to – for example – create a DateInput which combines an <input /> and a react-day-picker.

Here’s a screenshot of an example component I created at work, based upon this example:

That’s a <DayPicker /> contained in a <Popover position="bottom" align="left" /> next to an <input type="text" /> contained in a <StreamSettingsForm /> contained in a <Modal /> you see there 😉


Published by Bramus!

Bramus is a frontend web developer from Belgium, working as a Chrome Developer Relations Engineer at Google. From the moment he discovered view-source at the age of 14 (way back in 1997), he fell in love with the web and has been tinkering with it ever since (more …)

Join the Conversation

1 Comment

Leave a comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.