React DatePicker2

A simple and reusable Datepicker component for React (with persian jalali calendar support) Demo.

This package uses react-persian-datepicker project under the hood.

Installation

The package can be installed via NPM:

npm install react-datepicker2 --save

At this point you can import react-datepicker2 and its styles in your application as follows:

import DatePicker from 'react-datepicker2';

Below is a simple example on how to use the Datepicker in a React view.

import React from 'react'
import moment from 'moment-jalaali'
import DatePicker from 'react-datepicker2';
 
export default class ReactClass extends React.Component {
  constructor(props) {
    super(props);
    this.state = { value: moment() };
  }
  render() {
    return <DatePicker
      onChange={value => this.setState({ value })}
      value={this.state.value}
    />
  }
}

Configuration

The most basic use of the DatePicker can be described with:

<DatePicker onChange={value => this.setState({ value })} value={this.state.value} />

Local Development

The master branch contains the latest version of the Datepicker2 component. To start your example app, you can run npm install then npm start. This starts a simple webserver on http://localhost:8080.

Todo

Built With

moment-jalaali - A Jalaali (Jalali, Persian, Khorshidi, Shamsi) calendar system plugin for moment.js.

Thanks

Special thanks to @mohebifar for his open-source project which this component is based on.

Contributing

Contributions are welcome and will be fully credited. I'd be happy to accept PRs for that.

License

Contributors ✨

Thanks goes to these wonderful people (emoji key):

_{mohammadreza berneti} 💻 🤔 📖 🐛 🎨 💡 🚧 📦 💬 👀 📆	_{Mohamad Mohebifar} 🤔 📖 💻	_{Ali Akbar Azizi} 🚧 📦 💻 🐛 💬	_{Ali Najafi} 🚧 💻	_{Mehrdad Mehralian} 💻 🎨	_{mojtaba Shayegh} 🐛 💻	_{mory rezaee} 🚧 💻
_{Mathieu Saubin} 🚧 💻	_{alireza molaee} 🚧 💻	_{Ali MoghaddasZadeh} 🐛	_{amir zamani} 🚧 📦 💻 🐛 💬	_{Afsane Fadaei} 🚧 💬	_{Hossein Aghatabar} 🐛	_Mahdi 💻
_{Hosein BehkamaL} 💻