Flexible date picker component for React with Radium
npm install react-day-picker-radium

react-day-picker is a flexible date picker component for React.
* no external dependencies
* select days, ranges, whatever using CSS modifiers
* simple localization, even with moment.js
* customizable style and CSS Modules support
* navigable via keyboard, ARIA support
Check out the examples to see its features.






Add the dependency to your project
``bash
npm install react-day-picker --save
Using unpkg
Include the component without installing:
`html
`See this jsfiddle as example.
Using bower
`html
bower install react-day-picker
`$3
`js
import React from 'react';
import DayPicker from "react-day-picker";import "react-day-picker/lib/style.css"
function sundays(day) {
return day.getDay() === 0;
}
function today() {
return new Date();
}
class MyComponent extends React.Component {
state = {
selectedDay: today(),
}
constructor(props) {
super(props);
this.handleDayClick = this.handleDayClick.bind(this);
}
handleDayClick(day, { disabled, selected }) {
if (disabled) {
return;
}
this.setState({
selectedDay: selected ? null : day
})
},
render() {
return (
initialMonth={ new Date(2017, 1) }
disabledDays={ sundays }
selectedDays={ this.state.selectedDay }
onDayClick={ this.handleDayClick }
/>);
}
}
`See Basic usage for a deeper explanation of the example above.
$3
* Examples With Code
* Documentation
* Basic Usage
* Use of Day Modifiers
* API
* Styling
* Use with CSS Modules
* Localization
* Utilities
* CHANGELOG
$3
* Tag with
react-day-picker` your questions on Stack Overflow* File bugs and feature requests in the issues page
* Check out the source code on Github
* Pull requests are welcome! If you are planning a pull request with lot of changes, please add an issue to discuss your idea first
* See how to start the project locally here