react-moment-datetime

React datetime picker powered by momentjs. See the demo here.

Usage

<DateTimeInput
  value={this.state.date}
  onChange={this.onChange}
  showTime={true}
/>

Available properties:

Property	Type	Content	Default Value
i18n	JSON	Entries to render i18n content	See below for an example
showTime	boolean	True to display a separate input field for the time	true
value	Date	The current value	undefined
isValid	function	A function that receives a date and returns true if the date is valid input. Can be used to set a maximum or minimum value in the calendar	(moment) => true
onChange	function	A function that will receive the value when the user introduces a valid date. Receives a JSON of name, value and strValue	undefined

The default value of i18n:

{
  Date: 'Date',
  Time: 'Time',
  Close: 'Close',
  Hours: 'Hours',
  Minutes: 'Minutes',

  // date format
  format: 'YYYY-MM-DD',

  // locale ISO
  locale: 'en'
}

Check app.js for a working example.

Development

Work on the code:

npm install
npm run build
npm run watch
xdg-open http://localhost:8080/example/

Work on the demo:

./publish.sh

License and acknowledgements

Licensed under the MIT license

react-moment-datetime is based on the great job by Wang Zuo, the author of input-moment

Design inspired in https://dribbble.com/shots/1439965-Due-Date-and-Time-Picker.