react-datetime - npm Package Compare versions

Comparing version 2.1.0 to 2.2.0

CHANGELOG.md

 Changelog
 =========
+## 2.2.0
+* The picker can be used as a month or year picker just giving a format date without days/months
+* Updates test suite
 
@@ -4,0 +7,0 @@ ## 2.1.0

DateTime.js

@@ -46,3 +46,2 @@ 'use strict';
 			defaultValue: '',
-			viewMode: 'days',
 			inputProps: {},
@@ -65,3 +64,3 @@ input: true,
 
-		state.currentView = this.props.dateFormat ? this.props.viewMode : 'time';
+		state.currentView = this.props.dateFormat ? (this.props.viewMode || state.updateOn || 'days') : 'time';
 
@@ -74,3 +73,3 @@ return state;
 			date = props.value || props.defaultValue,
-			selectedDate, viewDate
+			selectedDate, viewDate, updateOn
 		;
@@ -91,3 +90,6 @@
 
+		updateOn = this.getUpdateOn(formats);
+
 		return {
+			updateOn: updateOn,
 			inputFormat: formats.datetime,
@@ -101,2 +103,16 @@ viewDate: viewDate,
 
+	getUpdateOn: function(formats){
+		if( formats.date.match(/[lLD]/) ){
+			return "days";
+		}
+		else if( formats.date.indexOf("M") != -1 ){
+			return "months";
+		}
+		else if( formats.date.indexOf("Y") != -1 ){
+			return "years";
+		}
+
+		return 'days';
+	},
+
 	getFormats: function( props ){
@@ -113,2 +129,6 @@ var formats = {
 		}
+		else if( this.getUpdateOn(formats) !== 'days' ){
+			formats.time = '';
+		}
+
 		if( formats.time === true ){
@@ -235,17 +255,29 @@ formats.time = locale.longDateFormat('LT');
 			date
-		;
+        ;
 
-		if(target.className.indexOf("rdtNew") != -1)
-			modifier = 1;
-		else if(target.className.indexOf("rdtOld") != -1)
-			modifier = -1;
+		if(target.className.indexOf("rdtDay") != -1){
+			if(target.className.indexOf("rdtNew") != -1)
+				modifier = 1;
+			else if(target.className.indexOf("rdtOld") != -1)
+				modifier = -1;
 
-		date = viewDate.clone()
-			.month( viewDate.month() + modifier )
-			.date( parseInt( target.getAttribute('data-value') ) )
-			.hours( currentDate.hours() )
+			date = viewDate.clone()
+				.month( viewDate.month() + modifier )
+				.date( parseInt( target.getAttribute('data-value') ) )
+			;
+		}else if(target.className.indexOf("rdtMonth") != -1){
+			date = viewDate.clone()
+				.month( parseInt( target.getAttribute('data-value') ) )
+				.date( currentDate.date() )
+		}else if(target.className.indexOf("rdtYear") != -1){
+			date = viewDate.clone()
+				.month( currentDate.month() )
+				.date( currentDate.date() )
+				.year( parseInt( target.getAttribute('data-value') ) )
+		}
+
+		date.hours( currentDate.hours() )
 			.minutes( currentDate.minutes() )
 			.seconds( currentDate.seconds() )
 			.milliseconds( currentDate.milliseconds() )
-		;
 
@@ -294,3 +326,3 @@ if( !this.props.value ){
 		fromProps: ['value', 'isValidDate', 'renderDay', 'renderMonth', 'renderYear'],
-		fromState: ['viewDate', 'selectedDate' ],
+		fromState: ['viewDate', 'selectedDate', 'updateOn'],
 		fromThis: ['setDate', 'setTime', 'showView', 'addTime', 'subtractTime', 'updateSelectedDate', 'localMoment']
@@ -297,0 +329,0 @@ },

dist/react-datetime.js

 /*
-react-datetime v2.0.3
+react-datetime v2.1.0
 https://github.com/arqex/react-datetime
@@ -62,3 +62,3 @@ MIT: https://github.com/arqex/react-datetime/raw/master/LICENSE
 
-	eval("'use strict';\n\nvar assign = __webpack_require__(1),\n\tReact = __webpack_require__(2),\n\tDaysView = __webpack_require__(3),\n\tMonthsView = __webpack_require__(5),\n\tYearsView = __webpack_require__(6),\n\tTimeView = __webpack_require__(7),\n\tmoment = __webpack_require__(4)\n;\n\nvar TYPES = React.PropTypes;\nvar Datetime = React.createClass({\n\tmixins: [\n\t\t__webpack_require__(8)\n\t],\n\tviewComponents: {\n\t\tdays: DaysView,\n\t\tmonths: MonthsView,\n\t\tyears: YearsView,\n\t\ttime: TimeView\n\t},\n\tpropTypes: {\n\t\t// value: TYPES.object | TYPES.string,\n\t\t// defaultValue: TYPES.object | TYPES.string,\n\t\tcloseOnSelect: TYPES.bool,\n\t\tonBlur: TYPES.func,\n\t\tonChange: TYPES.func,\n\t\tlocale: TYPES.string,\n\t\tinput: TYPES.bool,\n\t\t// dateFormat: TYPES.string | TYPES.bool,\n\t\t// timeFormat: TYPES.string | TYPES.bool,\n\t\tinputProps: TYPES.object,\n\t\tviewMode: TYPES.oneOf(['years', 'months', 'days', 'time']),\n\t\tisValidDate: TYPES.func,\n\t\topen: TYPES.bool,\n\t\tstrictParsing: TYPES.bool\n\t},\n\n\tgetDefaultProps: function() {\n\t\tvar nof = function(){};\n\t\treturn {\n\t\t\tclassName: '',\n\t\t\tdefaultValue: '',\n\t\t\tviewMode: 'days',\n\t\t\tinputProps: {},\n\t\t\tinput: true,\n\t\t\tonBlur: nof,\n\t\t\tonChange: nof,\n\t\t\ttimeFormat: true,\n\t\t\tdateFormat: true,\n\t\t\tstrictParsing: true\n\t\t};\n\t},\n\n\tgetInitialState: function() {\n\t\tvar state = this.getStateFromProps( this.props );\n\n\t\tif( state.open == undefined )\n\t\t\tstate.open = !this.props.input;\n\n\t\tstate.currentView = this.props.dateFormat ? this.props.viewMode : 'time';\n\n\t\treturn state;\n\t},\n\n\tgetStateFromProps: function( props ){\n\t\tvar formats = this.getFormats( props ),\n\t\t\tdate = props.value || props.defaultValue,\n\t\t\tselectedDate, viewDate\n\t\t;\n\n\t\tif( date && typeof date == 'string' )\n\t\t\tselectedDate = this.localMoment( date, formats.datetime );\n\t\telse if( date )\n\t\t\tselectedDate = this.localMoment( date );\n\n\t\tif( selectedDate && !selectedDate.isValid() )\n\t\t\tselectedDate = null;\n\n\t\tviewDate = selectedDate ?\n\t\t\tselectedDate.clone().startOf(\"month\") :\n\t\t\tthis.localMoment().startOf(\"month\")\n\t\t;\n\n\t\treturn {\n\t\t\tinputFormat: formats.datetime,\n\t\t\tviewDate: viewDate,\n\t\t\tselectedDate: selectedDate,\n\t\t\tinputValue: selectedDate ? selectedDate.format( formats.datetime ) : (date || ''),\n\t\t\topen: props.open != undefined ? props.open : this.state && this.state.open\n\t\t};\n\t},\n\n\tgetFormats: function( props ){\n\t\tvar formats = {\n\t\t\t\tdate: props.dateFormat || '',\n\t\t\t\ttime: props.timeFormat || ''\n\t\t\t},\n\t\t\tlocale = this.localMoment( props.date ).localeData()\n\t\t;\n\n\t\tif( formats.date === true ){\n\t\t\tformats.date = locale.longDateFormat('L');\n\t\t}\n\t\tif( formats.time === true ){\n\t\t\tformats.time = locale.longDateFormat('LT');\n\t\t}\n\n\t\tformats.datetime = formats.date && formats.time ?\n\t\t\tformats.date + ' ' + formats.time :\n\t\t\tformats.date || formats.time\n\t\t;\n\n\t\treturn formats;\n\t},\n\n\tcomponentWillReceiveProps: function(nextProps) {\n\t\tvar formats = this.getFormats( nextProps ),\n\t\t\tupdate = {}\n\t\t;\n\n\t\tif( nextProps.value != this.props.value ){\n\t\t\tupdate = this.getStateFromProps( nextProps );\n\t\t}\n\t\tif ( formats.datetime !== this.getFormats( this.props ).datetime ) {\n\t\t\tupdate.inputFormat = formats.datetime;\n\t\t}\n\n\t\tthis.setState( update );\n\t},\n\n\tonInputChange: function( e ) {\n\t\tvar value = e.target == null ? e : e.target.value,\n\t\t\tlocalMoment = this.localMoment( value, this.state.inputFormat ),\n\t\t\tupdate = { inputValue: value }\n\t\t;\n\n\t\tif ( localMoment.isValid() && !this.props.value ) {\n\t\t\tupdate.selectedDate = localMoment;\n\t\t\tupdate.viewDate = localMoment.clone().startOf(\"month\");\n\t\t}\n\t\telse {\n\t\t\tupdate.selectedDate = null;\n\t\t}\n\n\t\treturn this.setState( update, function() {\n\t\t\treturn this.props.onChange( localMoment.isValid() ? localMoment : this.state.inputValue );\n\t\t});\n\t},\n\n\tshowView: function( view ){\n\t\tvar me = this;\n\t\treturn function( e ){\n\t\t\tme.setState({ currentView: view });\n\t\t};\n\t},\n\n\tsetDate: function( type ){\n\t\tvar me = this,\n\t\t\tnextViews = {\n\t\t\t\tmonth: 'days',\n\t\t\t\tyear: 'months'\n\t\t\t}\n\t\t;\n\t\treturn function( e ){\n\t\t\tme.setState({\n\t\t\t\tviewDate: me.state.viewDate.clone()[ type ]( parseInt(e.target.getAttribute('data-value')) ).startOf( type ),\n\t\t\t\tcurrentView: nextViews[ type ]\n\t\t\t});\n\t\t};\n\t},\n\n\taddTime: function( amount, type, toSelected ){\n\t\treturn this.updateTime( 'add', amount, type, toSelected );\n\t},\n\n\tsubtractTime: function( amount, type, toSelected ){\n\t\treturn this.updateTime( 'subtract', amount, type, toSelected );\n\t},\n\n\tupdateTime: function( op, amount, type, toSelected ){\n\t\tvar me = this;\n\n\t\treturn function(){\n\t\t\tvar update = {},\n\t\t\t\tdate = toSelected ? 'selectedDate' : 'viewDate'\n\t\t\t;\n\n\t\t\tupdate[ date ] = me.state[ date ].clone()[ op ]( amount, type );\n\n\t\t\tme.setState( update );\n\t\t};\n\t},\n\n\tallowedSetTime: ['hours','minutes','seconds', 'milliseconds'],\n\tsetTime: function( type, value ){\n\t\tvar index = this.allowedSetTime.indexOf( type ) + 1,\n\t\t\tstate = this.state,\n\t\t\tdate = (state.selectedDate || state.viewDate).clone(),\n\t\t\tnextType\n\t\t;\n\n\t\t// It is needed to set all the time properties\n\t\t// to not to reset the time\n\t\tdate[ type ]( value );\n\t\tfor (; index < this.allowedSetTime.length; index++) {\n\t\t\tnextType = this.allowedSetTime[index];\n\t\t\tdate[ nextType ]( date[nextType]() );\n\t\t}\n\n\t\tif( !this.props.value ){\n\t\t\tthis.setState({\n\t\t\t\tselectedDate: date,\n\t\t\t\tinputValue: date.format( state.inputFormat )\n\t\t\t});\n\t\t}\n\t\tthis.props.onChange( date );\n\t},\n\n\tupdateSelectedDate: function( e, close ) {\n\t\tvar target = e.target,\n\t\t\tmodifier = 0,\n\t\t\tviewDate = this.state.viewDate,\n\t\t\tcurrentDate = this.state.selectedDate || viewDate,\n\t\t\tdate\n\t\t;\n\n\t\tif(target.className.indexOf(\"rdtNew\") != -1)\n\t\t\tmodifier = 1;\n\t\telse if(target.className.indexOf(\"rdtOld\") != -1)\n\t\t\tmodifier = -1;\n\n\t\tdate = viewDate.clone()\n\t\t\t.month( viewDate.month() + modifier )\n\t\t\t.date( parseInt( target.getAttribute('data-value') ) )\n\t\t\t.hours( currentDate.hours() )\n\t\t\t.minutes( currentDate.minutes() )\n\t\t\t.seconds( currentDate.seconds() )\n\t\t\t.milliseconds( currentDate.milliseconds() )\n\t\t;\n\n\t\tif( !this.props.value ){\n\t\t\tthis.setState({\n\t\t\t\tselectedDate: date,\n\t\t\t\tviewDate: date.clone().startOf('month'),\n\t\t\t\tinputValue: date.format( this.state.inputFormat )\n\t\t\t}, function () {\n\t\t\t\tif (this.props.closeOnSelect && close) {\n\t\t\t\t\tthis.closeCalendar();\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\n\t\tthis.props.onChange( date );\n\t},\n\n\topenCalendar: function() {\n\t\tthis.setState({ open: true });\n\t},\n\n\tcloseCalendar: function() {\n\t\tthis.setState({ open: false });\n\t},\n\n\thandleClickOutside: function(){\n\t\tif( this.props.input && this.state.open && !this.props.open ){\n\t\t\tthis.setState({ open: false });\n\t\t\tthis.props.onBlur( this.state.selectedDate || this.state.inputValue );\n\t\t}\n\t},\n\n\tlocalMoment: function( date, format ){\n\t\tvar m = moment( date, format, this.props.strictParsing );\n\t\tif( this.props.locale )\n\t\t\tm.locale( this.props.locale );\n\t\treturn m;\n\t},\n\n\tcomponentProps: {\n\t\tfromProps: ['value', 'isValidDate', 'renderDay', 'renderMonth', 'renderYear'],\n\t\tfromState: ['viewDate', 'selectedDate' ],\n\t\tfromThis: ['setDate', 'setTime', 'showView', 'addTime', 'subtractTime', 'updateSelectedDate', 'localMoment']\n\t},\n\n\tgetComponentProps: function(){\n\t\tvar me = this,\n\t\t\tformats = this.getFormats( this.props ),\n\t\t\tprops = {dateFormat: formats.date, timeFormat: formats.time}\n\t\t;\n\n\t\tthis.componentProps.fromProps.forEach( function( name ){\n\t\t\tprops[ name ] = me.props[ name ];\n\t\t});\n\t\tthis.componentProps.fromState.forEach( function( name ){\n\t\t\tprops[ name ] = me.state[ name ];\n\t\t});\n\t\tthis.componentProps.fromThis.forEach( function( name ){\n\t\t\tprops[ name ] = me[ name ];\n\t\t});\n\n\t\treturn props;\n\t},\n\n\trender: function() {\n\t\tvar Component = this.viewComponents[ this.state.currentView ],\n\t\t\tDOM = React.DOM,\n\t\t\tclassName = 'rdt ' + this.props.className,\n\t\t\tchildren = []\n\t\t;\n\n\t\tif( this.props.input ){\n\t\t\tchildren = [ DOM.input( assign({\n\t\t\t\tkey: 'i',\n\t\t\t\ttype:'text',\n\t\t\t\tclassName: 'form-control',\n\t\t\t\tonFocus: this.openCalendar,\n\t\t\t\tonChange: this.onInputChange,\n\t\t\t\tvalue: this.state.inputValue\n\t\t\t}, this.props.inputProps ))];\n\t\t}\n\t\telse {\n\t\t\tclassName += ' rdtStatic';\n\t\t}\n\n\t\tif( this.state.open )\n\t\t\tclassName += ' rdtOpen';\n\n\t\treturn DOM.div({className: className}, children.concat(\n\t\t\tDOM.div(\n\t\t\t\t{ key: 'dt', className: 'rdtPicker' },\n\t\t\t\tReact.createElement( Component, this.getComponentProps())\n\t\t\t)\n\t\t));\n\t}\n});\n\n// Make moment accessible through the Datetime class\nDatetime.moment = moment;\n\nmodule.exports = Datetime;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./Datetime.js\n ** module id = 0\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./Datetime.js?");
+	eval("'use strict';\n\nvar assign = __webpack_require__(1),\n\tReact = __webpack_require__(2),\n\tDaysView = __webpack_require__(3),\n\tMonthsView = __webpack_require__(5),\n\tYearsView = __webpack_require__(6),\n\tTimeView = __webpack_require__(7),\n\tmoment = __webpack_require__(4)\n;\n\nvar TYPES = React.PropTypes;\nvar Datetime = React.createClass({\n\tmixins: [\n\t\t__webpack_require__(8)\n\t],\n\tviewComponents: {\n\t\tdays: DaysView,\n\t\tmonths: MonthsView,\n\t\tyears: YearsView,\n\t\ttime: TimeView\n\t},\n\tpropTypes: {\n\t\t// value: TYPES.object | TYPES.string,\n\t\t// defaultValue: TYPES.object | TYPES.string,\n\t\tcloseOnSelect: TYPES.bool,\n\t\tonFocus: TYPES.func,\n\t\tonBlur: TYPES.func,\n\t\tonChange: TYPES.func,\n\t\tlocale: TYPES.string,\n\t\tinput: TYPES.bool,\n\t\t// dateFormat: TYPES.string | TYPES.bool,\n\t\t// timeFormat: TYPES.string | TYPES.bool,\n\t\tinputProps: TYPES.object,\n\t\tviewMode: TYPES.oneOf(['years', 'months', 'days', 'time']),\n\t\tisValidDate: TYPES.func,\n\t\topen: TYPES.bool,\n\t\tstrictParsing: TYPES.bool\n\t},\n\n\tgetDefaultProps: function() {\n\t\tvar nof = function(){};\n\t\treturn {\n\t\t\tclassName: '',\n\t\t\tdefaultValue: '',\n\t\t\tviewMode: 'days',\n\t\t\tinputProps: {},\n\t\t\tinput: true,\n\t\t\tonFocus: nof,\n\t\t\tonBlur: nof,\n\t\t\tonChange: nof,\n\t\t\ttimeFormat: true,\n\t\t\tdateFormat: true,\n\t\t\tstrictParsing: true\n\t\t};\n\t},\n\n\tgetInitialState: function() {\n\t\tvar state = this.getStateFromProps( this.props );\n\n\t\tif( state.open == undefined )\n\t\t\tstate.open = !this.props.input;\n\n\t\tstate.currentView = this.props.dateFormat ? this.props.viewMode : 'time';\n\n\t\treturn state;\n\t},\n\n\tgetStateFromProps: function( props ){\n\t\tvar formats = this.getFormats( props ),\n\t\t\tdate = props.value || props.defaultValue,\n\t\t\tselectedDate, viewDate, updateOn\n\t\t;\n\n\t\tif( date && typeof date == 'string' )\n\t\t\tselectedDate = this.localMoment( date, formats.datetime );\n\t\telse if( date )\n\t\t\tselectedDate = this.localMoment( date );\n\n\t\tif( selectedDate && !selectedDate.isValid() )\n\t\t\tselectedDate = null;\n\n\t\tviewDate = selectedDate ?\n\t\t\tselectedDate.clone().startOf(\"month\") :\n\t\t\tthis.localMoment().startOf(\"month\")\n\t\t;\n\n\t\tupdateOn = this.getUpdateOn(formats);\n\n\t\treturn {\n\t\t\tupdateOn: updateOn,\n\t\t\tinputFormat: formats.datetime,\n\t\t\tviewDate: viewDate,\n\t\t\tselectedDate: selectedDate,\n\t\t\tinputValue: selectedDate ? selectedDate.format( formats.datetime ) : (date || ''),\n\t\t\topen: props.open != undefined ? props.open : this.state && this.state.open\n\t\t};\n\t},\n\n\tgetUpdateOn: function(formats){\n\t\tif(formats.datetime.indexOf(\"D\") != -1){\n\t\t\treturn \"date\";\n\t\t}else if(formats.datetime.indexOf(\"M\") != -1){\n\t\t\treturn \"month\";\n\t\t}else if(formats.datetime.indexOf(\"Y\") != -1){\n\t\t\treturn \"year\";\n\t\t}\n\t},\n\n\tgetFormats: function( props ){\n\t\tvar formats = {\n\t\t\t\tdate: props.dateFormat || '',\n\t\t\t\ttime: props.timeFormat || ''\n\t\t\t},\n\t\t\tlocale = this.localMoment( props.date ).localeData()\n\t\t;\n\n\t\tif( formats.date === true ){\n\t\t\tformats.date = locale.longDateFormat('L');\n\t\t}\n\t\tif( formats.time === true ){\n\t\t\tformats.time = locale.longDateFormat('LT');\n\t\t}\n\n\t\tformats.datetime = formats.date && formats.time ?\n\t\t\tformats.date + ' ' + formats.time :\n\t\t\tformats.date || formats.time\n\t\t;\n\n\t\treturn formats;\n\t},\n\n\tcomponentWillReceiveProps: function(nextProps) {\n\t\tvar formats = this.getFormats( nextProps ),\n\t\t\tupdate = {}\n\t\t;\n\n\t\tif( nextProps.value != this.props.value ){\n\t\t\tupdate = this.getStateFromProps( nextProps );\n\t\t}\n\t\tif ( formats.datetime !== this.getFormats( this.props ).datetime ) {\n\t\t\tupdate.inputFormat = formats.datetime;\n\t\t}\n\n\t\tthis.setState( update );\n\t},\n\n\tonInputChange: function( e ) {\n\t\tvar value = e.target == null ? e : e.target.value,\n\t\t\tlocalMoment = this.localMoment( value, this.state.inputFormat ),\n\t\t\tupdate = { inputValue: value }\n\t\t;\n\n\t\tif ( localMoment.isValid() && !this.props.value ) {\n\t\t\tupdate.selectedDate = localMoment;\n\t\t\tupdate.viewDate = localMoment.clone().startOf(\"month\");\n\t\t}\n\t\telse {\n\t\t\tupdate.selectedDate = null;\n\t\t}\n\n\t\treturn this.setState( update, function() {\n\t\t\treturn this.props.onChange( localMoment.isValid() ? localMoment : this.state.inputValue );\n\t\t});\n\t},\n\n\tshowView: function( view ){\n\t\tvar me = this;\n\t\treturn function( e ){\n\t\t\tme.setState({ currentView: view });\n\t\t};\n\t},\n\n\tsetDate: function( type ){\n\t\tvar me = this,\n\t\t\tnextViews = {\n\t\t\t\tmonth: 'days',\n\t\t\t\tyear: 'months'\n\t\t\t}\n\t\t;\n\t\treturn function( e ){\n\t\t\tme.setState({\n\t\t\t\tviewDate: me.state.viewDate.clone()[ type ]( parseInt(e.target.getAttribute('data-value')) ).startOf( type ),\n\t\t\t\tcurrentView: nextViews[ type ]\n\t\t\t});\n\t\t};\n\t},\n\n\taddTime: function( amount, type, toSelected ){\n\t\treturn this.updateTime( 'add', amount, type, toSelected );\n\t},\n\n\tsubtractTime: function( amount, type, toSelected ){\n\t\treturn this.updateTime( 'subtract', amount, type, toSelected );\n\t},\n\n\tupdateTime: function( op, amount, type, toSelected ){\n\t\tvar me = this;\n\n\t\treturn function(){\n\t\t\tvar update = {},\n\t\t\t\tdate = toSelected ? 'selectedDate' : 'viewDate'\n\t\t\t;\n\n\t\t\tupdate[ date ] = me.state[ date ].clone()[ op ]( amount, type );\n\n\t\t\tme.setState( update );\n\t\t};\n\t},\n\n\tallowedSetTime: ['hours','minutes','seconds', 'milliseconds'],\n\tsetTime: function( type, value ){\n\t\tvar index = this.allowedSetTime.indexOf( type ) + 1,\n\t\t\tstate = this.state,\n\t\t\tdate = (state.selectedDate || state.viewDate).clone(),\n\t\t\tnextType\n\t\t;\n\n\t\t// It is needed to set all the time properties\n\t\t// to not to reset the time\n\t\tdate[ type ]( value );\n\t\tfor (; index < this.allowedSetTime.length; index++) {\n\t\t\tnextType = this.allowedSetTime[index];\n\t\t\tdate[ nextType ]( date[nextType]() );\n\t\t}\n\n\t\tif( !this.props.value ){\n\t\t\tthis.setState({\n\t\t\t\tselectedDate: date,\n\t\t\t\tinputValue: date.format( state.inputFormat )\n\t\t\t});\n\t\t}\n\t\tthis.props.onChange( date );\n\t},\n\n\tupdateSelectedDate: function( e, close ) {\n\t\tvar target = e.target,\n\t\t\tmodifier = 0,\n\t\t\tviewDate = this.state.viewDate,\n\t\t\tcurrentDate = this.state.selectedDate || viewDate,\n\t\t\tdate\n        ;\n\n\t\tif(target.className.indexOf(\"rdtDay\") != -1){\n\t\t\tif(target.className.indexOf(\"rdtNew\") != -1)\n\t\t\t\tmodifier = 1;\n\t\t\telse if(target.className.indexOf(\"rdtOld\") != -1)\n\t\t\t\tmodifier = -1;\n\n\t\t\tdate = viewDate.clone()\n\t\t\t\t.month( viewDate.month() + modifier )\n\t\t\t\t.date( parseInt( target.getAttribute('data-value') ) )\n\t\t\t;\n\t\t}else if(target.className.indexOf(\"rdtMonth\") != -1){\n\t\t\tdate = viewDate.clone()\n\t\t\t\t.month( parseInt( target.getAttribute('data-value') ) )\n\t\t\t\t.date( currentDate.date() )\n\t\t}else if(target.className.indexOf(\"rdtYear\") != -1){\n\t\t\tdate = viewDate.clone()\n\t\t\t\t.month( currentDate.month() )\n\t\t\t\t.date( currentDate.date() )\n\t\t\t\t.year( parseInt( target.getAttribute('data-value') ) )\n\t\t}\n\n\t\tdate.hours( currentDate.hours() )\n\t\t\t.minutes( currentDate.minutes() )\n\t\t\t.seconds( currentDate.seconds() )\n\t\t\t.milliseconds( currentDate.milliseconds() )\n\n\t\tif( !this.props.value ){\n\t\t\tthis.setState({\n\t\t\t\tselectedDate: date,\n\t\t\t\tviewDate: date.clone().startOf('month'),\n\t\t\t\tinputValue: date.format( this.state.inputFormat )\n\t\t\t}, function () {\n\t\t\t\tif (this.props.closeOnSelect && close) {\n\t\t\t\t\tthis.closeCalendar();\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\n\t\tthis.props.onChange( date );\n\t},\n\n\topenCalendar: function() {\n\t\tif (!this.state.open) {\n\t\t\tthis.props.onFocus();\n\t\t\tthis.setState({ open: true });\n\t\t}\n\t},\n\n\tcloseCalendar: function() {\n\t\tthis.setState({ open: false });\n\t},\n\n\thandleClickOutside: function(){\n\t\tif( this.props.input && this.state.open && !this.props.open ){\n\t\t\tthis.setState({ open: false });\n\t\t\tthis.props.onBlur( this.state.selectedDate || this.state.inputValue );\n\t\t}\n\t},\n\n\tlocalMoment: function( date, format ){\n\t\tvar m = moment( date, format, this.props.strictParsing );\n\t\tif( this.props.locale )\n\t\t\tm.locale( this.props.locale );\n\t\treturn m;\n\t},\n\n\tcomponentProps: {\n\t\tfromProps: ['value', 'isValidDate', 'renderDay', 'renderMonth', 'renderYear'],\n\t\tfromState: ['viewDate', 'selectedDate', 'updateOn'],\n\t\tfromThis: ['setDate', 'setTime', 'showView', 'addTime', 'subtractTime', 'updateSelectedDate', 'localMoment']\n\t},\n\n\tgetComponentProps: function(){\n\t\tvar me = this,\n\t\t\tformats = this.getFormats( this.props ),\n\t\t\tprops = {dateFormat: formats.date, timeFormat: formats.time}\n\t\t;\n\n\t\tthis.componentProps.fromProps.forEach( function( name ){\n\t\t\tprops[ name ] = me.props[ name ];\n\t\t});\n\t\tthis.componentProps.fromState.forEach( function( name ){\n\t\t\tprops[ name ] = me.state[ name ];\n\t\t});\n\t\tthis.componentProps.fromThis.forEach( function( name ){\n\t\t\tprops[ name ] = me[ name ];\n\t\t});\n\n\t\treturn props;\n\t},\n\n\trender: function() {\n\t\tvar Component = this.viewComponents[ this.state.currentView ],\n\t\t\tDOM = React.DOM,\n\t\t\tclassName = 'rdt ' + this.props.className,\n\t\t\tchildren = []\n\t\t;\n\n\t\tif( this.props.input ){\n\t\t\tchildren = [ DOM.input( assign({\n\t\t\t\tkey: 'i',\n\t\t\t\ttype:'text',\n\t\t\t\tclassName: 'form-control',\n\t\t\t\tonFocus: this.openCalendar,\n\t\t\t\tonChange: this.onInputChange,\n\t\t\t\tvalue: this.state.inputValue\n\t\t\t}, this.props.inputProps ))];\n\t\t}\n\t\telse {\n\t\t\tclassName += ' rdtStatic';\n\t\t}\n\n\t\tif( this.state.open )\n\t\t\tclassName += ' rdtOpen';\n\n\t\treturn DOM.div({className: className}, children.concat(\n\t\t\tDOM.div(\n\t\t\t\t{ key: 'dt', className: 'rdtPicker' },\n\t\t\t\tReact.createElement( Component, this.getComponentProps())\n\t\t\t)\n\t\t));\n\t}\n});\n\n// Make moment accessible through the Datetime class\nDatetime.moment = moment;\n\nmodule.exports = Datetime;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./Datetime.js\n ** module id = 0\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./Datetime.js?");
 
@@ -81,3 +81,3 @@ /***/ },
 
-	eval("var React = __webpack_require__(2),\n\tmoment = __webpack_require__(4)\n;\n\nvar DOM = React.DOM;\nvar DateTimePickerDays = React.createClass({\n\n\trender: function() {\n\t\tvar footer = this.renderFooter(),\n\t\t\tdate = this.props.viewDate,\n\t\t\tlocale = date.localeData(),\n\t\t\ttableChildren\n\t\t;\n\n\t\ttableChildren = [\n\t\t\tDOM.thead({ key: 'th'}, [\n\t\t\t\tDOM.tr({ key: 'h'},[\n\t\t\t\t\tDOM.th({ key: 'p', className: 'rdtPrev' }, DOM.button({onClick: this.props.subtractTime(1, 'months'), type: 'button' }, '‹')),\n\t\t\t\t\tDOM.th({ key: 's', className: 'rdtSwitch', onClick: this.props.showView('months'), colSpan: 5, 'data-value': this.props.viewDate.month() }, locale.months( date ) + ' ' + date.year() ),\n\t\t\t\t\tDOM.th({ key: 'n', className: 'rdtNext' }, DOM.button({onClick: this.props.addTime(1, 'months'), type: 'button' }, '›'))\n\t\t\t\t]),\n\t\t\t\tDOM.tr({ key: 'd'}, this.getDaysOfWeek( locale ).map( function( day, index ){ return DOM.th({ key: day + index, className: 'dow'}, day ); }) )\n\t\t\t]),\n\t\t\tDOM.tbody({key: 'tb'}, this.renderDays())\n\t\t];\n\n\t\tif( footer )\n\t\t\ttableChildren.push( footer );\n\n\t\treturn DOM.div({ className: 'rdtDays' },\n\t\t\tDOM.table({}, tableChildren )\n\t\t);\n\t},\n\n\t/**\n\t * Get a list of the days of the week\n\t * depending on the current locale\n\t * @return {array} A list with the shortname of the days\n\t */\n\tgetDaysOfWeek: function( locale ){\n\t\tvar days = locale._weekdaysMin,\n\t\t\tfirst = locale.firstDayOfWeek(),\n\t\t\tdow = [],\n\t\t\ti = 0\n\t\t;\n\n\t\tdays.forEach( function( day ){\n\t\t\tdow[ (7 + (i++) - first) % 7 ] = day;\n\t\t});\n\n\t\treturn dow;\n\t},\n\n\trenderDays: function() {\n\t\tvar date = this.props.viewDate,\n\t\t\tselected = this.props.selectedDate && this.props.selectedDate.clone(),\n\t\t\tprevMonth = date.clone().subtract( 1, 'months' ),\n\t\t\tcurrentYear = date.year(),\n\t\t\tcurrentMonth = date.month(),\n\t\t\tweeks = [],\n\t\t\tdays = [],\n\t\t\trenderer = this.props.renderDay || this.renderDay,\n\t\t\tisValid = this.props.isValidDate || this.isValidDate,\n\t\t\tclasses, disabled, dayProps, currentDate\n\t\t;\n\n\t\t// Go to the last week of the previous month\n\t\tprevMonth.date( prevMonth.daysInMonth() ).startOf('week');\n\t\tvar lastDay = prevMonth.clone().add(42, 'd');\n\n\t\twhile( prevMonth.isBefore( lastDay ) ){\n\t\t\tclasses = 'rdtDay';\n\t\t\tcurrentDate = prevMonth.clone();\n\n\t\t\tif( ( prevMonth.year() == currentYear && prevMonth.month() < currentMonth ) || ( prevMonth.year() < currentYear ) )\n\t\t\t\tclasses += ' rdtOld';\n\t\t\telse if( ( prevMonth.year() == currentYear && prevMonth.month() > currentMonth ) || ( prevMonth.year() > currentYear ) )\n\t\t\t\tclasses += ' rdtNew';\n\n\t\t\tif( selected && prevMonth.isSame( {y: selected.year(), M: selected.month(), d: selected.date()} ) )\n\t\t\t\tclasses += ' rdtActive';\n\n\t\t\tif (prevMonth.isSame(moment(), 'day') )\n\t\t\t\tclasses += ' rdtToday';\n\n\t\t\tdisabled = !isValid( currentDate, selected );\n\t\t\tif( disabled )\n\t\t\t\tclasses += ' rdtDisabled';\n\n\t\t\tdayProps = {\n\t\t\t\tkey: prevMonth.format('M_D'),\n\t\t\t\t'data-value': prevMonth.date(),\n\t\t\t\tclassName: classes\n\t\t\t};\n\t\t\tif( !disabled )\n\t\t\t\tdayProps.onClick = this.updateSelectedDate;\n\n\t\t\tdays.push( renderer( dayProps, currentDate, selected ) );\n\n\t\t\tif( days.length == 7 ){\n\t\t\t\tweeks.push( DOM.tr( {key: prevMonth.format('M_D')}, days ) );\n\t\t\t\tdays = [];\n\t\t\t}\n\n\t\t\tprevMonth.add( 1, 'd' );\n\t\t}\n\n\t\treturn weeks;\n\t},\n\n\tupdateSelectedDate: function( event ) {\n\t\tthis.props.updateSelectedDate(event, true);\n\t},\n\n\trenderDay: function( props, currentDate, selectedDate ){\n\t\treturn DOM.td( props, currentDate.date() );\n\t},\n\n\trenderFooter: function(){\n\t\tif( !this.props.timeFormat )\n\t\t\treturn '';\n\n\t\tvar date = this.props.selectedDate || this.props.viewDate;\n\t\treturn DOM.tfoot({ key: 'tf'},\n\t\t\tDOM.tr({},\n\t\t\t\tDOM.td({ onClick: this.props.showView('time'), colSpan: 7, className: 'rdtTimeToggle'}, date.format( this.props.timeFormat ))\n\t\t\t)\n\t\t);\n\t},\n\tisValidDate: function(){ return 1; }\n});\n\nmodule.exports = DateTimePickerDays;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/DaysView.js\n ** module id = 3\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/DaysView.js?");
+	eval("var React = __webpack_require__(2),\n\tmoment = __webpack_require__(4)\n;\n\nvar DOM = React.DOM;\nvar DateTimePickerDays = React.createClass({\n\n\trender: function() {\n\t\tvar footer = this.renderFooter(),\n\t\t\tdate = this.props.viewDate,\n\t\t\tlocale = date.localeData(),\n\t\t\ttableChildren\n\t\t;\n\n\t\ttableChildren = [\n\t\t\tDOM.thead({ key: 'th'}, [\n\t\t\t\tDOM.tr({ key: 'h'},[\n\t\t\t\t\tDOM.th({ key: 'p', className: 'rdtPrev' }, DOM.button({onClick: this.props.subtractTime(1, 'months'), type: 'button' }, '‹')),\n\t\t\t\t\tDOM.th({ key: 's', className: 'rdtSwitch', onClick: this.props.showView('months'), colSpan: 5, 'data-value': this.props.viewDate.month() }, locale.months( date ) + ' ' + date.year() ),\n\t\t\t\t\tDOM.th({ key: 'n', className: 'rdtNext' }, DOM.button({onClick: this.props.addTime(1, 'months'), type: 'button' }, '›'))\n\t\t\t\t]),\n\t\t\t\tDOM.tr({ key: 'd'}, this.getDaysOfWeek( locale ).map( function( day, index ){ return DOM.th({ key: day + index, className: 'dow'}, day ); }) )\n\t\t\t]),\n\t\t\tDOM.tbody({key: 'tb'}, this.renderDays())\n\t\t];\n\n\t\tif( footer )\n\t\t\ttableChildren.push( footer );\n\n\t\treturn DOM.div({ className: 'rdtDays' },\n\t\t\tDOM.table({}, tableChildren )\n\t\t);\n\t},\n\n\t/**\n\t * Get a list of the days of the week\n\t * depending on the current locale\n\t * @return {array} A list with the shortname of the days\n\t */\n\tgetDaysOfWeek: function( locale ){\n\t\tvar days = locale._weekdaysMin,\n\t\t\tfirst = locale.firstDayOfWeek(),\n\t\t\tdow = [],\n\t\t\ti = 0\n\t\t;\n\n\t\tdays.forEach( function( day ){\n\t\t\tdow[ (7 + (i++) - first) % 7 ] = day;\n\t\t});\n\n\t\treturn dow;\n\t},\n\n\trenderDays: function() {\n\t\tvar date = this.props.viewDate,\n\t\t\tselected = this.props.selectedDate && this.props.selectedDate.clone(),\n\t\t\tprevMonth = date.clone().subtract( 1, 'months' ),\n\t\t\tcurrentYear = date.year(),\n\t\t\tcurrentMonth = date.month(),\n\t\t\tweeks = [],\n\t\t\tdays = [],\n\t\t\trenderer = this.props.renderDay || this.renderDay,\n\t\t\tisValid = this.props.isValidDate || this.isValidDate,\n\t\t\tclasses, disabled, dayProps, currentDate\n\t\t;\n\n\t\t// Go to the last week of the previous month\n\t\tprevMonth.date( prevMonth.daysInMonth() ).startOf('week');\n\t\tvar lastDay = prevMonth.clone().add(42, 'd');\n\n\t\twhile( prevMonth.isBefore( lastDay ) ){\n\t\t\tclasses = 'rdtDay';\n\t\t\tcurrentDate = prevMonth.clone();\n\n\t\t\tif( ( prevMonth.year() == currentYear && prevMonth.month() < currentMonth ) || ( prevMonth.year() < currentYear ) )\n\t\t\t\tclasses += ' rdtOld';\n\t\t\telse if( ( prevMonth.year() == currentYear && prevMonth.month() > currentMonth ) || ( prevMonth.year() > currentYear ) )\n\t\t\t\tclasses += ' rdtNew';\n\n\t\t\tif( selected && prevMonth.isSame(selected, 'day') )\n\t\t\t\tclasses += ' rdtActive';\n\n\t\t\tif (prevMonth.isSame(moment(), 'day') )\n\t\t\t\tclasses += ' rdtToday';\n\n\t\t\tdisabled = !isValid( currentDate, selected );\n\t\t\tif( disabled )\n\t\t\t\tclasses += ' rdtDisabled';\n\n\t\t\tdayProps = {\n\t\t\t\tkey: prevMonth.format('M_D'),\n\t\t\t\t'data-value': prevMonth.date(),\n\t\t\t\tclassName: classes\n\t\t\t};\n\t\t\tif( !disabled )\n\t\t\t\tdayProps.onClick = this.updateSelectedDate;\n\n\t\t\tdays.push( renderer( dayProps, currentDate, selected ) );\n\n\t\t\tif( days.length == 7 ){\n\t\t\t\tweeks.push( DOM.tr( {key: prevMonth.format('M_D')}, days ) );\n\t\t\t\tdays = [];\n\t\t\t}\n\n\t\t\tprevMonth.add( 1, 'd' );\n\t\t}\n\n\t\treturn weeks;\n\t},\n\n\tupdateSelectedDate: function( event ) {\n\t\tthis.props.updateSelectedDate(event, true);\n\t},\n\n\trenderDay: function( props, currentDate, selectedDate ){\n\t\treturn DOM.td( props, currentDate.date() );\n\t},\n\n\trenderFooter: function(){\n\t\tif( !this.props.timeFormat )\n\t\t\treturn '';\n\n\t\tvar date = this.props.selectedDate || this.props.viewDate;\n\t\treturn DOM.tfoot({ key: 'tf'},\n\t\t\tDOM.tr({},\n\t\t\t\tDOM.td({ onClick: this.props.showView('time'), colSpan: 7, className: 'rdtTimeToggle'}, date.format( this.props.timeFormat ))\n\t\t\t)\n\t\t);\n\t},\n\tisValidDate: function(){ return 1; }\n});\n\nmodule.exports = DateTimePickerDays;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/DaysView.js\n ** module id = 3\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/DaysView.js?");
 
@@ -94,3 +94,3 @@ /***/ },
 
-	eval("'use strict';\n\nvar React = __webpack_require__(2),\nmoment = __webpack_require__(4)\n;\n\nvar DOM = React.DOM;\nvar DateTimePickerMonths = React.createClass({\n\trender: function() {\n\t\treturn DOM.div({ className: 'rdtMonths' },[\n\t\t\tDOM.table({ key: 'a'}, DOM.thead({}, DOM.tr({},[\n\t\t\t\tDOM.th({ key: 'prev', className: 'rdtPrev' }, DOM.button({onClick: this.props.subtractTime(1, 'years'), type: 'button' }, '‹')),\n\t\t\t\tDOM.th({ key: 'year', className: 'rdtSwitch', onClick: this.props.showView('years'), colSpan: 2, 'data-value': this.props.viewDate.year()}, this.props.viewDate.year() ),\n\t\t\t\tDOM.th({ key: 'next', className: 'rdtNext' }, DOM.button({onClick: this.props.addTime(1, 'years'), type: 'button' }, '›'))\n\t\t\t]))),\n\t\t\tDOM.table({ key: 'months'}, DOM.tbody({ key: 'b'}, this.renderMonths()))\n\t\t]);\n\t},\n\n\trenderMonths: function() {\n\t\tvar date = this.props.selectedDate,\n\t\t\tmonth = this.props.viewDate.month(),\n\t\t\tyear = this.props.viewDate.year(),\n\t\t\trows = [],\n\t\t\ti = 0,\n\t\t\tmonths = [],\n\t\t\trenderer = this.props.renderMonth || this.renderMonth,\n\t\t\tclasses, props\n\t\t;\n\n\t\twhile (i < 12) {\n\t\t\tclasses = \"rdtMonth\";\n\t\t\tif( date && i === month && year === date.year() )\n\t\t\t\tclasses += \" rdtActive\";\n\n\t\t\tprops = {\n\t\t\t\tkey: i,\n\t\t\t\t'data-value': i,\n\t\t\t\tclassName: classes,\n\t\t\t\tonClick: this.props.setDate('month')\n\t\t\t};\n\n\t\t\tmonths.push( renderer( props, i, year, date && date.clone() ));\n\n\t\t\tif( months.length == 4 ){\n\t\t\t\trows.push( DOM.tr({ key: month + '_' + rows.length }, months) );\n\t\t\t\tmonths = [];\n\t\t\t}\n\n\t\t\ti++;\n\t\t}\n\n\t\treturn rows;\n\t},\n\n\trenderMonth: function( props, month, year, selectedDate ) {\n\t\treturn DOM.td( props, this.props.viewDate.localeData()._monthsShort[ month ] );\n\t}\n});\n\nmodule.exports = DateTimePickerMonths;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/MonthsView.js\n ** module id = 5\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/MonthsView.js?");
+	eval("'use strict';\n\nvar React = __webpack_require__(2),\nmoment = __webpack_require__(4)\n;\n\nvar DOM = React.DOM;\nvar DateTimePickerMonths = React.createClass({\n\trender: function() {\n\t\treturn DOM.div({ className: 'rdtMonths' },[\n\t\t\tDOM.table({ key: 'a'}, DOM.thead({}, DOM.tr({},[\n\t\t\t\tDOM.th({ key: 'prev', className: 'rdtPrev' }, DOM.button({onClick: this.props.subtractTime(1, 'years'), type: 'button' }, '‹')),\n\t\t\t\tDOM.th({ key: 'year', className: 'rdtSwitch', onClick: this.props.showView('years'), colSpan: 2, 'data-value': this.props.viewDate.year()}, this.props.viewDate.year() ),\n\t\t\t\tDOM.th({ key: 'next', className: 'rdtNext' }, DOM.button({onClick: this.props.addTime(1, 'years'), type: 'button' }, '›'))\n\t\t\t]))),\n\t\t\tDOM.table({ key: 'months'}, DOM.tbody({ key: 'b'}, this.renderMonths()))\n\t\t]);\n\t},\n\n\trenderMonths: function() {\n\t\tvar date = this.props.selectedDate,\n\t\t\tmonth = this.props.viewDate.month(),\n\t\t\tyear = this.props.viewDate.year(),\n\t\t\trows = [],\n\t\t\ti = 0,\n\t\t\tmonths = [],\n\t\t\trenderer = this.props.renderMonth || this.renderMonth,\n\t\t\tclasses, props\n\t\t;\n\n\t\twhile (i < 12) {\n\t\t\tclasses = \"rdtMonth\";\n\t\t\tif( date && i === month && year === date.year() )\n\t\t\t\tclasses += \" rdtActive\";\n\n\t\t\tprops = {\n\t\t\t\tkey: i,\n\t\t\t\t'data-value': i,\n\t\t\t\tclassName: classes,\n\t\t\t\tonClick: this.props.updateOn==\"month\"?this.updateSelectedMonth:this.props.setDate('month')\n\t\t\t};\n\n\t\t\tmonths.push( renderer( props, i, year, date && date.clone() ));\n\n\t\t\tif( months.length == 4 ){\n\t\t\t\trows.push( DOM.tr({ key: month + '_' + rows.length }, months) );\n\t\t\t\tmonths = [];\n\t\t\t}\n\n\t\t\ti++;\n\t\t}\n\n\t\treturn rows;\n\t},\n\n\tupdateSelectedMonth: function( event ) {\n\t\tthis.props.updateSelectedDate(event, true);\n\t},\n\n\trenderMonth: function( props, month, year, selectedDate ) {\n\t\treturn DOM.td( props, this.props.viewDate.localeData()._monthsShort[ month ] );\n\t}\n});\n\nmodule.exports = DateTimePickerMonths;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/MonthsView.js\n ** module id = 5\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/MonthsView.js?");
 
@@ -101,3 +101,3 @@ /***/ },
 
-	eval("'use strict';\n\nvar React = __webpack_require__(2);\n\nvar DOM = React.DOM;\nvar DateTimePickerYears = React.createClass({\n\trender: function() {\n\t\tvar year = parseInt(this.props.viewDate.year() / 10, 10) * 10;\n\n\t\treturn DOM.div({ className: 'rdtYears' },[\n\t\t\tDOM.table({ key: 'a'}, DOM.thead({}, DOM.tr({},[\n\t\t\t\tDOM.th({ key: 'prev', className: 'rdtPrev' }, DOM.button({onClick: this.props.subtractTime(10, 'years'), type: 'button' }, '‹')),\n\t\t\t\tDOM.th({ key: 'year', className: 'rdtSwitch', onClick: this.props.showView('years'), colSpan: 2 }, year + '-' + (year + 9) ),\n\t\t\t\tDOM.th({ key: 'next', className: 'rdtNext'}, DOM.button({onClick: this.props.addTime(10, 'years'), type: 'button' }, '›'))\n\t\t\t\t]))),\n\t\t\tDOM.table({ key: 'years'}, DOM.tbody({}, this.renderYears( year )))\n\t\t]);\n\t},\n\n\trenderYears: function( year ) {\n\t\tvar years = [],\n\t\t\ti = -1,\n\t\t\trows = [],\n\t\t\trenderer = this.props.renderYear || this.renderYear,\n\t\t\tselectedDate = this.props.selectedDate,\n\t\t\tclasses, props\n\t\t;\n\n\t\tyear--;\n\t\twhile (i < 11) {\n\t\t\tclasses = 'rdtYear';\n\t\t\tif( i === -1 | i === 10 )\n\t\t\t\tclasses += ' rdtOld';\n\t\t\tif( selectedDate && selectedDate.year() === year )\n\t\t\t\tclasses += ' rdtActive';\n\n\t\t\tprops = {\n\t\t\t\tkey: year,\n\t\t\t\t'data-value': year,\n\t\t\t\tclassName: classes,\n\t\t\t\tonClick: this.props.setDate('year')\n\t\t\t};\n\n\t\t\tyears.push( renderer( props, year, selectedDate && selectedDate.clone() ));\n\n\t\t\tif( years.length == 4 ){\n\t\t\t\trows.push( DOM.tr({ key: i }, years ) );\n\t\t\t\tyears = [];\n\t\t\t}\n\n\t\t\tyear++;\n\t\t\ti++;\n\t\t}\n\n\t\treturn rows;\n\t},\n\n\trenderYear: function( props, year, selectedDate ){\n\t\treturn DOM.td( props, year );\n\t}\n});\n\nmodule.exports = DateTimePickerYears;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/YearsView.js\n ** module id = 6\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/YearsView.js?");
+	eval("'use strict';\n\nvar React = __webpack_require__(2);\n\nvar DOM = React.DOM;\nvar DateTimePickerYears = React.createClass({\n\trender: function() {\n\t\tvar year = parseInt(this.props.viewDate.year() / 10, 10) * 10;\n\n\t\treturn DOM.div({ className: 'rdtYears' },[\n\t\t\tDOM.table({ key: 'a'}, DOM.thead({}, DOM.tr({},[\n\t\t\t\tDOM.th({ key: 'prev', className: 'rdtPrev' }, DOM.button({onClick: this.props.subtractTime(10, 'years'), type: 'button' }, '‹')),\n\t\t\t\tDOM.th({ key: 'year', className: 'rdtSwitch', onClick: this.props.showView('years'), colSpan: 2 }, year + '-' + (year + 9) ),\n\t\t\t\tDOM.th({ key: 'next', className: 'rdtNext'}, DOM.button({onClick: this.props.addTime(10, 'years'), type: 'button' }, '›'))\n\t\t\t\t]))),\n\t\t\tDOM.table({ key: 'years'}, DOM.tbody({}, this.renderYears( year )))\n\t\t]);\n\t},\n\n\trenderYears: function( year ) {\n\t\tvar years = [],\n\t\t\ti = -1,\n\t\t\trows = [],\n\t\t\trenderer = this.props.renderYear || this.renderYear,\n\t\t\tselectedDate = this.props.selectedDate,\n\t\t\tclasses, props\n\t\t;\n\n\t\tyear--;\n\t\twhile (i < 11) {\n\t\t\tclasses = 'rdtYear';\n\t\t\tif( i === -1 | i === 10 )\n\t\t\t\tclasses += ' rdtOld';\n\t\t\tif( selectedDate && selectedDate.year() === year )\n\t\t\t\tclasses += ' rdtActive';\n\n\t\t\tprops = {\n\t\t\t\tkey: year,\n\t\t\t\t'data-value': year,\n\t\t\t\tclassName: classes,\n\t\t\t\tonClick: this.props.updateOn==\"year\"?this.updateSelectedYear:this.props.setDate('year')\n\t\t\t};\n\n\t\t\tyears.push( renderer( props, year, selectedDate && selectedDate.clone() ));\n\n\t\t\tif( years.length == 4 ){\n\t\t\t\trows.push( DOM.tr({ key: i }, years ) );\n\t\t\t\tyears = [];\n\t\t\t}\n\n\t\t\tyear++;\n\t\t\ti++;\n\t\t}\n\n\t\treturn rows;\n\t},\n\n\tupdateSelectedYear: function( event ) {\n\t\tthis.props.updateSelectedDate(event, true);\n\t},\n\n\trenderYear: function( props, year, selectedDate ){\n\t\treturn DOM.td( props, year );\n\t}\n});\n\nmodule.exports = DateTimePickerYears;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/YearsView.js\n ** module id = 6\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/YearsView.js?");
 
@@ -108,3 +108,3 @@ /***/ },
 
-	eval("'use strict';\n\nvar React = __webpack_require__(2);\n\nvar DOM = React.DOM;\nvar DateTimePickerTime = React.createClass({\n\tgetInitialState: function(){\n\t\treturn this.calculateState( this.props );\n\t},\n\tcalculateState: function( props ){\n\t\tvar date = props.selectedDate || props.viewDate,\n\t\t\tformat = props.timeFormat,\n\t\t\tcounters = []\n\t\t;\n\n\t\tif( format.indexOf('H') != -1 || format.indexOf('h') != -1 ){\n\t\t\tcounters.push('hours');\n\t\t\tif( format.indexOf('m') != -1 ){\n\t\t\t\tcounters.push('minutes');\n\t\t\t\tif( format.indexOf('s') != -1 ){\n\t\t\t\t\tcounters.push('seconds');\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn {\n\t\t\thours: date.format('H'),\n\t\t\tminutes: date.format('mm'),\n\t\t\tseconds: date.format('ss'),\n\t\t\tmilliseconds: date.format('SSS'),\n\t\t\tcounters: counters\n\t\t};\n\t},\n\trenderCounter: function( type ){\n\t\treturn DOM.div({ key: type, className: 'rdtCounter'}, [\n\t\t\tDOM.button({ key:'up', className: 'rdtBtn', onMouseDown: this.onStartClicking( 'increase', type ), type: 'button' }, '▲' ),\n\t\t\tDOM.div({ key:'c', className: 'rdtCount' }, this.state[ type ] ),\n\t\t\tDOM.button({ key:'do', className: 'rdtBtn', onMouseDown: this.onStartClicking( 'decrease', type ), type: 'button' }, '▼' )\n\t\t]);\n\t},\n\trender: function() {\n\t\tvar me = this,\n\t\t\tcounters = []\n\t\t;\n\n\t\tthis.state.counters.forEach( function(c){\n\t\t\tif( counters.length )\n\t\t\t\tcounters.push( DOM.div( {key: 'sep' + counters.length, className: 'rdtCounterSeparator' }, ':' ));\n\t\t\tcounters.push( me.renderCounter( c ) );\n\t\t});\n\n\t\tif( this.state.counters.length == 3 && this.props.timeFormat.indexOf('S') != -1 ){\n\t\t\tcounters.push( DOM.div( {className: 'rdtCounterSeparator', key: 'sep5' }, ':' ));\n\t\t\tcounters.push(\n\t\t\t\tDOM.div( {className: 'rdtCounter rdtMilli', key:'m'},\n\t\t\t\t\tDOM.input({ value: this.state.milliseconds, type: 'text', onChange: this.updateMilli })\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t}\n\n\t\treturn DOM.div( {className: 'rdtTime'},\n\t\t\tDOM.table( {}, [\n\t\t\t\tthis.renderHeader(),\n\t\t\t\tDOM.tbody({key: 'b'}, DOM.tr({}, DOM.td({},\n\t\t\t\t\tDOM.div({ className: 'rdtCounters' }, counters )\n\t\t\t\t)))\n\t\t\t])\n\t\t);\n\t},\n\tcomponentWillReceiveProps: function( nextProps, nextState ){\n\t\tthis.setState( this.calculateState( nextProps ) );\n\t},\n\tupdateMilli: function( e ){\n\t\tvar milli = parseInt( e.target.value );\n\t\tif( milli == e.target.value && milli >= 0 && milli < 1000 ){\n\t\t\tthis.props.setTime( 'milliseconds', milli );\n\t\t\tthis.setState({ milliseconds: milli });\n\t\t}\n\t},\n\trenderHeader: function(){\n\t\tif( !this.props.dateFormat )\n\t\t\treturn '';\n\n\t\tvar date = this.props.selectedDate || this.props.viewDate;\n\t\treturn DOM.thead({ key: 'h'}, DOM.tr({},\n\t\t\tDOM.th( {className: 'rdtSwitch', colSpan: 4, onClick: this.props.showView('days')}, date.format( this.props.dateFormat ) )\n\t\t));\n\t},\n\tonStartClicking: function( action, type ){\n\t\tvar me = this,\n\t\t\tupdate = {},\n\t\t\tvalue = this.state[ type ]\n\t\t;\n\n\n\t\treturn function(){\n\t\t\tvar update = {};\n\t\t\tupdate[ type ] = me[ action ]( type );\n\t\t\tme.setState( update );\n\n\t\t\tme.timer = setTimeout( function(){\n\t\t\t\tme.increaseTimer = setInterval( function(){\n\t\t\t\t\tupdate[ type ] = me[ action ]( type );\n\t\t\t\t\tme.setState( update );\n\t\t\t\t},70);\n\t\t\t}, 500);\n\n\t\t\tme.mouseUpListener = function(){\n\t\t\t\tclearTimeout( me.timer );\n\t\t\t\tclearInterval( me.increaseTimer );\n\t\t\t\tme.props.setTime( type, me.state[ type ] );\n\t\t\t\tdocument.body.removeEventListener('mouseup', me.mouseUpListener);\n\t\t\t};\n\n\t\t\tdocument.body.addEventListener('mouseup', me.mouseUpListener);\n\t\t};\n\t},\n\n\tmaxValues: {\n\t\thours: 23,\n\t\tminutes: 59,\n\t\tseconds: 59,\n\t\tmilliseconds: 999\n\t},\n\tpadValues: {\n\t\thours: 1,\n\t\tminutes: 2,\n\t\tseconds: 2,\n\t\tmilliseconds: 3\n\t},\n\tincrease: function( type ){\n\t\tvar value = parseInt(this.state[ type ]) + 1;\n\t\tif( value > this.maxValues[ type ] )\n\t\t\tvalue = 0;\n\t\treturn this.pad( type, value );\n\t},\n\tdecrease: function( type ){\n\t\tvar value = parseInt(this.state[ type ]) - 1;\n\t\tif( value < 0 )\n\t\t\tvalue = this.maxValues[ type ];\n\t\treturn this.pad( type, value );\n\t},\n\tpad: function( type, value ){\n\t\tvar str = value + '';\n\t\twhile( str.length < this.padValues[ type ] )\n\t\t\tstr = '0' + str;\n\t\treturn str;\n\t}\n});\n\nmodule.exports = DateTimePickerTime;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/TimeView.js\n ** module id = 7\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/TimeView.js?");
+	eval("'use strict';\n\nvar React = __webpack_require__(2);\n\nvar DOM = React.DOM;\nvar DateTimePickerTime = React.createClass({\n\tgetInitialState: function(){\n\t\treturn this.calculateState( this.props );\n\t},\n\tcalculateState: function( props ){\n\t\tvar date = props.selectedDate || props.viewDate,\n\t\t\tformat = props.timeFormat,\n\t\t\tcounters = []\n\t\t;\n\n\t\tif( format.indexOf('H') != -1 || format.indexOf('h') != -1 ){\n\t\t\tcounters.push('hours');\n\t\t\tif( format.indexOf('m') != -1 ){\n\t\t\t\tcounters.push('minutes');\n\t\t\t\tif( format.indexOf('s') != -1 ){\n\t\t\t\t\tcounters.push('seconds');\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\treturn {\n\t\t\thours: date.format('H'),\n\t\t\tminutes: date.format('mm'),\n\t\t\tseconds: date.format('ss'),\n\t\t\tmilliseconds: date.format('SSS'),\n\t\t\tcounters: counters\n\t\t};\n\t},\n\trenderCounter: function( type ){\n\t\treturn DOM.div({ key: type, className: 'rdtCounter'}, [\n\t\t\tDOM.button({ key:'up', className: 'rdtBtn', onMouseDown: this.onStartClicking( 'increase', type ), type: 'button' }, '▲' ),\n\t\t\tDOM.div({ key:'c', className: 'rdtCount' }, this.state[ type ] ),\n\t\t\tDOM.button({ key:'do', className: 'rdtBtn', onMouseDown: this.onStartClicking( 'decrease', type ), type: 'button' }, '▼' )\n\t\t]);\n\t},\n\trender: function() {\n\t\tvar me = this,\n\t\t\tcounters = []\n\t\t;\n\n\t\tthis.state.counters.forEach( function(c){\n\t\t\tif( counters.length )\n\t\t\t\tcounters.push( DOM.div( {key: 'sep' + counters.length, className: 'rdtCounterSeparator' }, ':' ));\n\t\t\tcounters.push( me.renderCounter( c ) );\n\t\t});\n\n\t\tif( this.state.counters.length == 3 && this.props.timeFormat.indexOf('S') != -1 ){\n\t\t\tcounters.push( DOM.div( {className: 'rdtCounterSeparator', key: 'sep5' }, ':' ));\n\t\t\tcounters.push(\n\t\t\t\tDOM.div( {className: 'rdtCounter rdtMilli', key:'m'},\n\t\t\t\t\tDOM.input({ value: this.state.milliseconds, type: 'text', onChange: this.updateMilli })\n\t\t\t\t\t)\n\t\t\t\t);\n\t\t}\n\n\t\treturn DOM.div( {className: 'rdtTime'},\n\t\t\tDOM.table( {}, [\n\t\t\t\tthis.renderHeader(),\n\t\t\t\tDOM.tbody({key: 'b'}, DOM.tr({}, DOM.td({},\n\t\t\t\t\tDOM.div({ className: 'rdtCounters' }, counters )\n\t\t\t\t)))\n\t\t\t])\n\t\t);\n\t},\n\tcomponentWillReceiveProps: function( nextProps, nextState ){\n\t\tthis.setState( this.calculateState( nextProps ) );\n\t},\n\tupdateMilli: function( e ){\n\t\tvar milli = parseInt( e.target.value );\n\t\tif( milli == e.target.value && milli >= 0 && milli < 1000 ){\n\t\t\tthis.props.setTime( 'milliseconds', milli );\n\t\t\tthis.setState({ milliseconds: milli });\n\t\t}\n\t},\n\trenderHeader: function(){\n\t\tif( !this.props.dateFormat )\n\t\t\treturn null;\n\n\t\tvar date = this.props.selectedDate || this.props.viewDate;\n\t\treturn DOM.thead({ key: 'h'}, DOM.tr({},\n\t\t\tDOM.th( {className: 'rdtSwitch', colSpan: 4, onClick: this.props.showView('days')}, date.format( this.props.dateFormat ) )\n\t\t));\n\t},\n\tonStartClicking: function( action, type ){\n\t\tvar me = this,\n\t\t\tupdate = {},\n\t\t\tvalue = this.state[ type ]\n\t\t;\n\n\n\t\treturn function(){\n\t\t\tvar update = {};\n\t\t\tupdate[ type ] = me[ action ]( type );\n\t\t\tme.setState( update );\n\n\t\t\tme.timer = setTimeout( function(){\n\t\t\t\tme.increaseTimer = setInterval( function(){\n\t\t\t\t\tupdate[ type ] = me[ action ]( type );\n\t\t\t\t\tme.setState( update );\n\t\t\t\t},70);\n\t\t\t}, 500);\n\n\t\t\tme.mouseUpListener = function(){\n\t\t\t\tclearTimeout( me.timer );\n\t\t\t\tclearInterval( me.increaseTimer );\n\t\t\t\tme.props.setTime( type, me.state[ type ] );\n\t\t\t\tdocument.body.removeEventListener('mouseup', me.mouseUpListener);\n\t\t\t};\n\n\t\t\tdocument.body.addEventListener('mouseup', me.mouseUpListener);\n\t\t};\n\t},\n\n\tmaxValues: {\n\t\thours: 23,\n\t\tminutes: 59,\n\t\tseconds: 59,\n\t\tmilliseconds: 999\n\t},\n\tpadValues: {\n\t\thours: 1,\n\t\tminutes: 2,\n\t\tseconds: 2,\n\t\tmilliseconds: 3\n\t},\n\tincrease: function( type ){\n\t\tvar value = parseInt(this.state[ type ]) + 1;\n\t\tif( value > this.maxValues[ type ] )\n\t\t\tvalue = 0;\n\t\treturn this.pad( type, value );\n\t},\n\tdecrease: function( type ){\n\t\tvar value = parseInt(this.state[ type ]) - 1;\n\t\tif( value < 0 )\n\t\t\tvalue = this.maxValues[ type ];\n\t\treturn this.pad( type, value );\n\t},\n\tpad: function( type, value ){\n\t\tvar str = value + '';\n\t\twhile( str.length < this.padValues[ type ] )\n\t\t\tstr = '0' + str;\n\t\treturn str;\n\t}\n});\n\nmodule.exports = DateTimePickerTime;\n\n\n/*****************\n ** WEBPACK FOOTER\n ** ./src/TimeView.js\n ** module id = 7\n ** module chunks = 0\n **/\n//# sourceURL=webpack:///./src/TimeView.js?");
 
@@ -111,0 +111,0 @@ /***/ },

dist/react-datetime.min.js

 /*
-react-datetime v2.0.3
+react-datetime v2.1.0
 https://github.com/arqex/react-datetime
 MIT: https://github.com/arqex/react-datetime/raw/master/LICENSE
 */
-!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React"),require("moment"),require("ReactDOM")):"function"==typeof define&&define.amd?define(["React","moment","ReactDOM"],e):"object"==typeof exports?exports.Datetime=e(require("React"),require("moment"),require("ReactDOM")):t.Datetime=e(t.React,t.moment,t.ReactDOM)}(this,function(t,e,s){return function(t){function e(r){if(s[r])return s[r].exports;var n=s[r]={exports:{},id:r,loaded:!1};return t[r].call(n.exports,n,n.exports,e),n.loaded=!0,n.exports}var s={};return e.m=t,e.c=s,e.p="",e(0)}([function(t,e,s){"use strict";var r=s(1),n=s(2),a=s(3),o=s(5),i=s(6),c=s(7),u=s(4),l=n.PropTypes,p=n.createClass({mixins:[s(8)],viewComponents:{days:a,months:o,years:i,time:c},propTypes:{closeOnSelect:l.bool,onBlur:l.func,onChange:l.func,locale:l.string,input:l.bool,inputProps:l.object,viewMode:l.oneOf(["years","months","days","time"]),isValidDate:l.func,open:l.bool,strictParsing:l.bool},getDefaultProps:function(){var t=function(){};return{className:"",defaultValue:"",viewMode:"days",inputProps:{},input:!0,onBlur:t,onChange:t,timeFormat:!0,dateFormat:!0,strictParsing:!0}},getInitialState:function(){var t=this.getStateFromProps(this.props);return void 0==t.open&&(t.open=!this.props.input),t.currentView=this.props.dateFormat?this.props.viewMode:"time",t},getStateFromProps:function(t){var e,s,r=this.getFormats(t),n=t.value||t.defaultValue;return n&&"string"==typeof n?e=this.localMoment(n,r.datetime):n&&(e=this.localMoment(n)),e&&!e.isValid()&&(e=null),s=e?e.clone().startOf("month"):this.localMoment().startOf("month"),{inputFormat:r.datetime,viewDate:s,selectedDate:e,inputValue:e?e.format(r.datetime):n||"",open:void 0!=t.open?t.open:this.state&&this.state.open}},getFormats:function(t){var e={date:t.dateFormat||"",time:t.timeFormat||""},s=this.localMoment(t.date).localeData();return e.date===!0&&(e.date=s.longDateFormat("L")),e.time===!0&&(e.time=s.longDateFormat("LT")),e.datetime=e.date&&e.time?e.date+" "+e.time:e.date||e.time,e},componentWillReceiveProps:function(t){var e=this.getFormats(t),s={};t.value!=this.props.value&&(s=this.getStateFromProps(t)),e.datetime!==this.getFormats(this.props).datetime&&(s.inputFormat=e.datetime),this.setState(s)},onInputChange:function(t){var e=null==t.target?t:t.target.value,s=this.localMoment(e,this.state.inputFormat),r={inputValue:e};return s.isValid()&&!this.props.value?(r.selectedDate=s,r.viewDate=s.clone().startOf("month")):r.selectedDate=null,this.setState(r,function(){return this.props.onChange(s.isValid()?s:this.state.inputValue)})},showView:function(t){var e=this;return function(s){e.setState({currentView:t})}},setDate:function(t){var e=this,s={month:"days",year:"months"};return function(r){e.setState({viewDate:e.state.viewDate.clone()[t](parseInt(r.target.getAttribute("data-value"))).startOf(t),currentView:s[t]})}},addTime:function(t,e,s){return this.updateTime("add",t,e,s)},subtractTime:function(t,e,s){return this.updateTime("subtract",t,e,s)},updateTime:function(t,e,s,r){var n=this;return function(){var a={},o=r?"selectedDate":"viewDate";a[o]=n.state[o].clone()[t](e,s),n.setState(a)}},allowedSetTime:["hours","minutes","seconds","milliseconds"],setTime:function(t,e){var s,r=this.allowedSetTime.indexOf(t)+1,n=this.state,a=(n.selectedDate||n.viewDate).clone();for(a[t](e);r<this.allowedSetTime.length;r++)s=this.allowedSetTime[r],a[s](a[s]());this.props.value||this.setState({selectedDate:a,inputValue:a.format(n.inputFormat)}),this.props.onChange(a)},updateSelectedDate:function(t,e){var s,r=t.target,n=0,a=this.state.viewDate,o=this.state.selectedDate||a;-1!=r.className.indexOf("rdtNew")?n=1:-1!=r.className.indexOf("rdtOld")&&(n=-1),s=a.clone().month(a.month()+n).date(parseInt(r.getAttribute("data-value"))).hours(o.hours()).minutes(o.minutes()).seconds(o.seconds()).milliseconds(o.milliseconds()),this.props.value||this.setState({selectedDate:s,viewDate:s.clone().startOf("month"),inputValue:s.format(this.state.inputFormat)},function(){this.props.closeOnSelect&&e&&this.closeCalendar()}),this.props.onChange(s)},openCalendar:function(){this.setState({open:!0})},closeCalendar:function(){this.setState({open:!1})},handleClickOutside:function(){this.props.input&&this.state.open&&!this.props.open&&(this.setState({open:!1}),this.props.onBlur(this.state.selectedDate||this.state.inputValue))},localMoment:function(t,e){var s=u(t,e,this.props.strictParsing);return this.props.locale&&s.locale(this.props.locale),s},componentProps:{fromProps:["value","isValidDate","renderDay","renderMonth","renderYear"],fromState:["viewDate","selectedDate"],fromThis:["setDate","setTime","showView","addTime","subtractTime","updateSelectedDate","localMoment"]},getComponentProps:function(){var t=this,e=this.getFormats(this.props),s={dateFormat:e.date,timeFormat:e.time};return this.componentProps.fromProps.forEach(function(e){s[e]=t.props[e]}),this.componentProps.fromState.forEach(function(e){s[e]=t.state[e]}),this.componentProps.fromThis.forEach(function(e){s[e]=t[e]}),s},render:function(){var t=this.viewComponents[this.state.currentView],e=n.DOM,s="rdt "+this.props.className,a=[];return this.props.input?a=[e.input(r({key:"i",type:"text",className:"form-control",onFocus:this.openCalendar,onChange:this.onInputChange,value:this.state.inputValue},this.props.inputProps))]:s+=" rdtStatic",this.state.open&&(s+=" rdtOpen"),e.div({className:s},a.concat(e.div({key:"dt",className:"rdtPicker"},n.createElement(t,this.getComponentProps()))))}});p.moment=u,t.exports=p},function(t,e){"use strict";function s(t){if(null==t)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(t)}function r(t){var e=Object.getOwnPropertyNames(t);return Object.getOwnPropertySymbols&&(e=e.concat(Object.getOwnPropertySymbols(t))),e.filter(function(e){return n.call(t,e)})}var n=Object.prototype.propertyIsEnumerable;t.exports=Object.assign||function(t,e){for(var n,a,o=s(t),i=1;i<arguments.length;i++){n=arguments[i],a=r(Object(n));for(var c=0;c<a.length;c++)o[a[c]]=n[a[c]]}return o}},function(e,s){e.exports=t},function(t,e,s){var r=s(2),n=s(4),a=r.DOM,o=r.createClass({render:function(){var t,e=this.renderFooter(),s=this.props.viewDate,r=s.localeData();return t=[a.thead({key:"th"},[a.tr({key:"h"},[a.th({key:"p",className:"rdtPrev"},a.button({onClick:this.props.subtractTime(1,"months"),type:"button"},"‹")),a.th({key:"s",className:"rdtSwitch",onClick:this.props.showView("months"),colSpan:5,"data-value":this.props.viewDate.month()},r.months(s)+" "+s.year()),a.th({key:"n",className:"rdtNext"},a.button({onClick:this.props.addTime(1,"months"),type:"button"},"›"))]),a.tr({key:"d"},this.getDaysOfWeek(r).map(function(t,e){return a.th({key:t+e,className:"dow"},t)}))]),a.tbody({key:"tb"},this.renderDays())],e&&t.push(e),a.div({className:"rdtDays"},a.table({},t))},getDaysOfWeek:function(t){var e=t._weekdaysMin,s=t.firstDayOfWeek(),r=[],n=0;return e.forEach(function(t){r[(7+n++-s)%7]=t}),r},renderDays:function(){var t,e,s,r,o=this.props.viewDate,i=this.props.selectedDate&&this.props.selectedDate.clone(),c=o.clone().subtract(1,"months"),u=o.year(),l=o.month(),p=[],d=[],h=this.props.renderDay||this.renderDay,m=this.props.isValidDate||this.isValidDate;c.date(c.daysInMonth()).startOf("week");for(var f=c.clone().add(42,"d");c.isBefore(f);)t="rdtDay",r=c.clone(),c.year()==u&&c.month()<l||c.year()<u?t+=" rdtOld":(c.year()==u&&c.month()>l||c.year()>u)&&(t+=" rdtNew"),i&&c.isSame({y:i.year(),M:i.month(),d:i.date()})&&(t+=" rdtActive"),c.isSame(n(),"day")&&(t+=" rdtToday"),e=!m(r,i),e&&(t+=" rdtDisabled"),s={key:c.format("M_D"),"data-value":c.date(),className:t},e||(s.onClick=this.updateSelectedDate),d.push(h(s,r,i)),7==d.length&&(p.push(a.tr({key:c.format("M_D")},d)),d=[]),c.add(1,"d");return p},updateSelectedDate:function(t){this.props.updateSelectedDate(t,!0)},renderDay:function(t,e,s){return a.td(t,e.date())},renderFooter:function(){if(!this.props.timeFormat)return"";var t=this.props.selectedDate||this.props.viewDate;return a.tfoot({key:"tf"},a.tr({},a.td({onClick:this.props.showView("time"),colSpan:7,className:"rdtTimeToggle"},t.format(this.props.timeFormat))))},isValidDate:function(){return 1}});t.exports=o},function(t,s){t.exports=e},function(t,e,s){"use strict";var r=s(2),n=(s(4),r.DOM),a=r.createClass({render:function(){return n.div({className:"rdtMonths"},[n.table({key:"a"},n.thead({},n.tr({},[n.th({key:"prev",className:"rdtPrev"},n.button({onClick:this.props.subtractTime(1,"years"),type:"button"},"‹")),n.th({key:"year",className:"rdtSwitch",onClick:this.props.showView("years"),colSpan:2,"data-value":this.props.viewDate.year()},this.props.viewDate.year()),n.th({key:"next",className:"rdtNext"},n.button({onClick:this.props.addTime(1,"years"),type:"button"},"›"))]))),n.table({key:"months"},n.tbody({key:"b"},this.renderMonths()))])},renderMonths:function(){for(var t,e,s=this.props.selectedDate,r=this.props.viewDate.month(),a=this.props.viewDate.year(),o=[],i=0,c=[],u=this.props.renderMonth||this.renderMonth;12>i;)t="rdtMonth",s&&i===r&&a===s.year()&&(t+=" rdtActive"),e={key:i,"data-value":i,className:t,onClick:this.props.setDate("month")},c.push(u(e,i,a,s&&s.clone())),4==c.length&&(o.push(n.tr({key:r+"_"+o.length},c)),c=[]),i++;return o},renderMonth:function(t,e,s,r){return n.td(t,this.props.viewDate.localeData()._monthsShort[e])}});t.exports=a},function(t,e,s){"use strict";var r=s(2),n=r.DOM,a=r.createClass({render:function(){var t=10*parseInt(this.props.viewDate.year()/10,10);return n.div({className:"rdtYears"},[n.table({key:"a"},n.thead({},n.tr({},[n.th({key:"prev",className:"rdtPrev"},n.button({onClick:this.props.subtractTime(10,"years"),type:"button"},"‹")),n.th({key:"year",className:"rdtSwitch",onClick:this.props.showView("years"),colSpan:2},t+"-"+(t+9)),n.th({key:"next",className:"rdtNext"},n.button({onClick:this.props.addTime(10,"years"),type:"button"},"›"))]))),n.table({key:"years"},n.tbody({},this.renderYears(t)))])},renderYears:function(t){var e,s,r=[],a=-1,o=[],i=this.props.renderYear||this.renderYear,c=this.props.selectedDate;for(t--;11>a;)e="rdtYear",-1===a|10===a&&(e+=" rdtOld"),c&&c.year()===t&&(e+=" rdtActive"),s={key:t,"data-value":t,className:e,onClick:this.props.setDate("year")},r.push(i(s,t,c&&c.clone())),4==r.length&&(o.push(n.tr({key:a},r)),r=[]),t++,a++;return o},renderYear:function(t,e,s){return n.td(t,e)}});t.exports=a},function(t,e,s){"use strict";var r=s(2),n=r.DOM,a=r.createClass({getInitialState:function(){return this.calculateState(this.props)},calculateState:function(t){var e=t.selectedDate||t.viewDate,s=t.timeFormat,r=[];return(-1!=s.indexOf("H")||-1!=s.indexOf("h"))&&(r.push("hours"),-1!=s.indexOf("m")&&(r.push("minutes"),-1!=s.indexOf("s")&&r.push("seconds"))),{hours:e.format("H"),minutes:e.format("mm"),seconds:e.format("ss"),milliseconds:e.format("SSS"),counters:r}},renderCounter:function(t){return n.div({key:t,className:"rdtCounter"},[n.button({key:"up",className:"rdtBtn",onMouseDown:this.onStartClicking("increase",t),type:"button"},"▲"),n.div({key:"c",className:"rdtCount"},this.state[t]),n.button({key:"do",className:"rdtBtn",onMouseDown:this.onStartClicking("decrease",t),type:"button"},"▼")])},render:function(){var t=this,e=[];return this.state.counters.forEach(function(s){e.length&&e.push(n.div({key:"sep"+e.length,className:"rdtCounterSeparator"},":")),e.push(t.renderCounter(s))}),3==this.state.counters.length&&-1!=this.props.timeFormat.indexOf("S")&&(e.push(n.div({className:"rdtCounterSeparator",key:"sep5"},":")),e.push(n.div({className:"rdtCounter rdtMilli",key:"m"},n.input({value:this.state.milliseconds,type:"text",onChange:this.updateMilli})))),n.div({className:"rdtTime"},n.table({},[this.renderHeader(),n.tbody({key:"b"},n.tr({},n.td({},n.div({className:"rdtCounters"},e))))]))},componentWillReceiveProps:function(t,e){this.setState(this.calculateState(t))},updateMilli:function(t){var e=parseInt(t.target.value);e==t.target.value&&e>=0&&1e3>e&&(this.props.setTime("milliseconds",e),this.setState({milliseconds:e}))},renderHeader:function(){if(!this.props.dateFormat)return"";var t=this.props.selectedDate||this.props.viewDate;return n.thead({key:"h"},n.tr({},n.th({className:"rdtSwitch",colSpan:4,onClick:this.props.showView("days")},t.format(this.props.dateFormat))))},onStartClicking:function(t,e){var s=this;this.state[e];return function(){var r={};r[e]=s[t](e),s.setState(r),s.timer=setTimeout(function(){s.increaseTimer=setInterval(function(){r[e]=s[t](e),s.setState(r)},70)},500),s.mouseUpListener=function(){clearTimeout(s.timer),clearInterval(s.increaseTimer),s.props.setTime(e,s.state[e]),document.body.removeEventListener("mouseup",s.mouseUpListener)},document.body.addEventListener("mouseup",s.mouseUpListener)}},maxValues:{hours:23,minutes:59,seconds:59,milliseconds:999},padValues:{hours:1,minutes:2,seconds:2,milliseconds:3},increase:function(t){var e=parseInt(this.state[t])+1;return e>this.maxValues[t]&&(e=0),this.pad(t,e)},decrease:function(t){var e=parseInt(this.state[t])-1;return 0>e&&(e=this.maxValues[t]),this.pad(t,e)},pad:function(t,e){for(var s=e+"";s.length<this.padValues[t];)s="0"+s;return s}});t.exports=a},function(t,e,s){var r=s(2),n=r.version&&r.version.split(".");n&&(n[0]>0||n[1]>13)&&(r=s(9));var a=[],o=[],i="ignore-react-onclickoutside",c=function(t,e){return t===e?!0:t.correspondingElement?t.correspondingElement.classList.contains(i):t.classList.contains(i)};t.exports={componentDidMount:function(){if("function"!=typeof this.handleClickOutside)throw new Error("Component lacks a handleClickOutside(event) function for processing outside click events.");var t=this.__outsideClickHandler=function(t,e){return function(s){s.stopPropagation();for(var r=s.target,n=!1;r.parentNode;){if(n=c(r,t))return;r=r.parentNode}e(s)}}(r.findDOMNode(this),this.handleClickOutside),e=a.length;a.push(this),o[e]=t,this.props.disableOnClickOutside||this.enableOnClickOutside()},componentWillUnmount:function(){this.disableOnClickOutside(),this.__outsideClickHandler=!1;var t=a.indexOf(this);t>-1&&o[t]&&(o.splice(t,1),a.splice(t,1))},enableOnClickOutside:function(){var t=this.__outsideClickHandler;document.addEventListener("mousedown",t),document.addEventListener("touchstart",t)},disableOnClickOutside:function(){var t=this.__outsideClickHandler;document.removeEventListener("mousedown",t),document.removeEventListener("touchstart",t)}}},function(t,e){t.exports=s}])});
+!function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("React"),require("moment"),require("ReactDOM")):"function"==typeof define&&define.amd?define(["React","moment","ReactDOM"],e):"object"==typeof exports?exports.Datetime=e(require("React"),require("moment"),require("ReactDOM")):t.Datetime=e(t.React,t.moment,t.ReactDOM)}(this,function(t,e,s){return function(t){function e(n){if(s[n])return s[n].exports;var r=s[n]={exports:{},id:n,loaded:!1};return t[n].call(r.exports,r,r.exports,e),r.loaded=!0,r.exports}var s={};return e.m=t,e.c=s,e.p="",e(0)}([function(t,e,s){"use strict";var n=s(1),r=s(2),a=s(3),o=s(5),i=s(6),c=s(7),u=s(4),d=r.PropTypes,p=r.createClass({mixins:[s(8)],viewComponents:{days:a,months:o,years:i,time:c},propTypes:{closeOnSelect:d.bool,onFocus:d.func,onBlur:d.func,onChange:d.func,locale:d.string,input:d.bool,inputProps:d.object,viewMode:d.oneOf(["years","months","days","time"]),isValidDate:d.func,open:d.bool,strictParsing:d.bool},getDefaultProps:function(){var t=function(){};return{className:"",defaultValue:"",viewMode:"days",inputProps:{},input:!0,onFocus:t,onBlur:t,onChange:t,timeFormat:!0,dateFormat:!0,strictParsing:!0}},getInitialState:function(){var t=this.getStateFromProps(this.props);return void 0==t.open&&(t.open=!this.props.input),t.currentView=this.props.dateFormat?this.props.viewMode:"time",t},getStateFromProps:function(t){var e,s,n,r=this.getFormats(t),a=t.value||t.defaultValue;return a&&"string"==typeof a?e=this.localMoment(a,r.datetime):a&&(e=this.localMoment(a)),e&&!e.isValid()&&(e=null),s=e?e.clone().startOf("month"):this.localMoment().startOf("month"),n=this.getUpdateOn(r),{updateOn:n,inputFormat:r.datetime,viewDate:s,selectedDate:e,inputValue:e?e.format(r.datetime):a||"",open:void 0!=t.open?t.open:this.state&&this.state.open}},getUpdateOn:function(t){return-1!=t.datetime.indexOf("D")?"date":-1!=t.datetime.indexOf("M")?"month":-1!=t.datetime.indexOf("Y")?"year":void 0},getFormats:function(t){var e={date:t.dateFormat||"",time:t.timeFormat||""},s=this.localMoment(t.date).localeData();return e.date===!0&&(e.date=s.longDateFormat("L")),e.time===!0&&(e.time=s.longDateFormat("LT")),e.datetime=e.date&&e.time?e.date+" "+e.time:e.date||e.time,e},componentWillReceiveProps:function(t){var e=this.getFormats(t),s={};t.value!=this.props.value&&(s=this.getStateFromProps(t)),e.datetime!==this.getFormats(this.props).datetime&&(s.inputFormat=e.datetime),this.setState(s)},onInputChange:function(t){var e=null==t.target?t:t.target.value,s=this.localMoment(e,this.state.inputFormat),n={inputValue:e};return s.isValid()&&!this.props.value?(n.selectedDate=s,n.viewDate=s.clone().startOf("month")):n.selectedDate=null,this.setState(n,function(){return this.props.onChange(s.isValid()?s:this.state.inputValue)})},showView:function(t){var e=this;return function(s){e.setState({currentView:t})}},setDate:function(t){var e=this,s={month:"days",year:"months"};return function(n){e.setState({viewDate:e.state.viewDate.clone()[t](parseInt(n.target.getAttribute("data-value"))).startOf(t),currentView:s[t]})}},addTime:function(t,e,s){return this.updateTime("add",t,e,s)},subtractTime:function(t,e,s){return this.updateTime("subtract",t,e,s)},updateTime:function(t,e,s,n){var r=this;return function(){var a={},o=n?"selectedDate":"viewDate";a[o]=r.state[o].clone()[t](e,s),r.setState(a)}},allowedSetTime:["hours","minutes","seconds","milliseconds"],setTime:function(t,e){var s,n=this.allowedSetTime.indexOf(t)+1,r=this.state,a=(r.selectedDate||r.viewDate).clone();for(a[t](e);n<this.allowedSetTime.length;n++)s=this.allowedSetTime[n],a[s](a[s]());this.props.value||this.setState({selectedDate:a,inputValue:a.format(r.inputFormat)}),this.props.onChange(a)},updateSelectedDate:function(t,e){var s,n=t.target,r=0,a=this.state.viewDate,o=this.state.selectedDate||a;-1!=n.className.indexOf("rdtDay")?(-1!=n.className.indexOf("rdtNew")?r=1:-1!=n.className.indexOf("rdtOld")&&(r=-1),s=a.clone().month(a.month()+r).date(parseInt(n.getAttribute("data-value")))):-1!=n.className.indexOf("rdtMonth")?s=a.clone().month(parseInt(n.getAttribute("data-value"))).date(o.date()):-1!=n.className.indexOf("rdtYear")&&(s=a.clone().month(o.month()).date(o.date()).year(parseInt(n.getAttribute("data-value")))),s.hours(o.hours()).minutes(o.minutes()).seconds(o.seconds()).milliseconds(o.milliseconds()),this.props.value||this.setState({selectedDate:s,viewDate:s.clone().startOf("month"),inputValue:s.format(this.state.inputFormat)},function(){this.props.closeOnSelect&&e&&this.closeCalendar()}),this.props.onChange(s)},openCalendar:function(){this.state.open||(this.props.onFocus(),this.setState({open:!0}))},closeCalendar:function(){this.setState({open:!1})},handleClickOutside:function(){this.props.input&&this.state.open&&!this.props.open&&(this.setState({open:!1}),this.props.onBlur(this.state.selectedDate||this.state.inputValue))},localMoment:function(t,e){var s=u(t,e,this.props.strictParsing);return this.props.locale&&s.locale(this.props.locale),s},componentProps:{fromProps:["value","isValidDate","renderDay","renderMonth","renderYear"],fromState:["viewDate","selectedDate","updateOn"],fromThis:["setDate","setTime","showView","addTime","subtractTime","updateSelectedDate","localMoment"]},getComponentProps:function(){var t=this,e=this.getFormats(this.props),s={dateFormat:e.date,timeFormat:e.time};return this.componentProps.fromProps.forEach(function(e){s[e]=t.props[e]}),this.componentProps.fromState.forEach(function(e){s[e]=t.state[e]}),this.componentProps.fromThis.forEach(function(e){s[e]=t[e]}),s},render:function(){var t=this.viewComponents[this.state.currentView],e=r.DOM,s="rdt "+this.props.className,a=[];return this.props.input?a=[e.input(n({key:"i",type:"text",className:"form-control",onFocus:this.openCalendar,onChange:this.onInputChange,value:this.state.inputValue},this.props.inputProps))]:s+=" rdtStatic",this.state.open&&(s+=" rdtOpen"),e.div({className:s},a.concat(e.div({key:"dt",className:"rdtPicker"},r.createElement(t,this.getComponentProps()))))}});p.moment=u,t.exports=p},function(t,e){"use strict";function s(t){if(null==t)throw new TypeError("Object.assign cannot be called with null or undefined");return Object(t)}function n(t){var e=Object.getOwnPropertyNames(t);return Object.getOwnPropertySymbols&&(e=e.concat(Object.getOwnPropertySymbols(t))),e.filter(function(e){return r.call(t,e)})}var r=Object.prototype.propertyIsEnumerable;t.exports=Object.assign||function(t,e){for(var r,a,o=s(t),i=1;i<arguments.length;i++){r=arguments[i],a=n(Object(r));for(var c=0;c<a.length;c++)o[a[c]]=r[a[c]]}return o}},function(e,s){e.exports=t},function(t,e,s){var n=s(2),r=s(4),a=n.DOM,o=n.createClass({render:function(){var t,e=this.renderFooter(),s=this.props.viewDate,n=s.localeData();return t=[a.thead({key:"th"},[a.tr({key:"h"},[a.th({key:"p",className:"rdtPrev"},a.button({onClick:this.props.subtractTime(1,"months"),type:"button"},"‹")),a.th({key:"s",className:"rdtSwitch",onClick:this.props.showView("months"),colSpan:5,"data-value":this.props.viewDate.month()},n.months(s)+" "+s.year()),a.th({key:"n",className:"rdtNext"},a.button({onClick:this.props.addTime(1,"months"),type:"button"},"›"))]),a.tr({key:"d"},this.getDaysOfWeek(n).map(function(t,e){return a.th({key:t+e,className:"dow"},t)}))]),a.tbody({key:"tb"},this.renderDays())],e&&t.push(e),a.div({className:"rdtDays"},a.table({},t))},getDaysOfWeek:function(t){var e=t._weekdaysMin,s=t.firstDayOfWeek(),n=[],r=0;return e.forEach(function(t){n[(7+r++-s)%7]=t}),n},renderDays:function(){var t,e,s,n,o=this.props.viewDate,i=this.props.selectedDate&&this.props.selectedDate.clone(),c=o.clone().subtract(1,"months"),u=o.year(),d=o.month(),p=[],l=[],h=this.props.renderDay||this.renderDay,m=this.props.isValidDate||this.isValidDate;c.date(c.daysInMonth()).startOf("week");for(var f=c.clone().add(42,"d");c.isBefore(f);)t="rdtDay",n=c.clone(),c.year()==u&&c.month()<d||c.year()<u?t+=" rdtOld":(c.year()==u&&c.month()>d||c.year()>u)&&(t+=" rdtNew"),i&&c.isSame(i,"day")&&(t+=" rdtActive"),c.isSame(r(),"day")&&(t+=" rdtToday"),e=!m(n,i),e&&(t+=" rdtDisabled"),s={key:c.format("M_D"),"data-value":c.date(),className:t},e||(s.onClick=this.updateSelectedDate),l.push(h(s,n,i)),7==l.length&&(p.push(a.tr({key:c.format("M_D")},l)),l=[]),c.add(1,"d");return p},updateSelectedDate:function(t){this.props.updateSelectedDate(t,!0)},renderDay:function(t,e,s){return a.td(t,e.date())},renderFooter:function(){if(!this.props.timeFormat)return"";var t=this.props.selectedDate||this.props.viewDate;return a.tfoot({key:"tf"},a.tr({},a.td({onClick:this.props.showView("time"),colSpan:7,className:"rdtTimeToggle"},t.format(this.props.timeFormat))))},isValidDate:function(){return 1}});t.exports=o},function(t,s){t.exports=e},function(t,e,s){"use strict";var n=s(2),r=(s(4),n.DOM),a=n.createClass({render:function(){return r.div({className:"rdtMonths"},[r.table({key:"a"},r.thead({},r.tr({},[r.th({key:"prev",className:"rdtPrev"},r.button({onClick:this.props.subtractTime(1,"years"),type:"button"},"‹")),r.th({key:"year",className:"rdtSwitch",onClick:this.props.showView("years"),colSpan:2,"data-value":this.props.viewDate.year()},this.props.viewDate.year()),r.th({key:"next",className:"rdtNext"},r.button({onClick:this.props.addTime(1,"years"),type:"button"},"›"))]))),r.table({key:"months"},r.tbody({key:"b"},this.renderMonths()))])},renderMonths:function(){for(var t,e,s=this.props.selectedDate,n=this.props.viewDate.month(),a=this.props.viewDate.year(),o=[],i=0,c=[],u=this.props.renderMonth||this.renderMonth;12>i;)t="rdtMonth",s&&i===n&&a===s.year()&&(t+=" rdtActive"),e={key:i,"data-value":i,className:t,onClick:"month"==this.props.updateOn?this.updateSelectedMonth:this.props.setDate("month")},c.push(u(e,i,a,s&&s.clone())),4==c.length&&(o.push(r.tr({key:n+"_"+o.length},c)),c=[]),i++;return o},updateSelectedMonth:function(t){this.props.updateSelectedDate(t,!0)},renderMonth:function(t,e,s,n){return r.td(t,this.props.viewDate.localeData()._monthsShort[e])}});t.exports=a},function(t,e,s){"use strict";var n=s(2),r=n.DOM,a=n.createClass({render:function(){var t=10*parseInt(this.props.viewDate.year()/10,10);return r.div({className:"rdtYears"},[r.table({key:"a"},r.thead({},r.tr({},[r.th({key:"prev",className:"rdtPrev"},r.button({onClick:this.props.subtractTime(10,"years"),type:"button"},"‹")),r.th({key:"year",className:"rdtSwitch",onClick:this.props.showView("years"),colSpan:2},t+"-"+(t+9)),r.th({key:"next",className:"rdtNext"},r.button({onClick:this.props.addTime(10,"years"),type:"button"},"›"))]))),r.table({key:"years"},r.tbody({},this.renderYears(t)))])},renderYears:function(t){var e,s,n=[],a=-1,o=[],i=this.props.renderYear||this.renderYear,c=this.props.selectedDate;for(t--;11>a;)e="rdtYear",-1===a|10===a&&(e+=" rdtOld"),c&&c.year()===t&&(e+=" rdtActive"),s={key:t,"data-value":t,className:e,onClick:"year"==this.props.updateOn?this.updateSelectedYear:this.props.setDate("year")},n.push(i(s,t,c&&c.clone())),4==n.length&&(o.push(r.tr({key:a},n)),n=[]),t++,a++;return o},updateSelectedYear:function(t){this.props.updateSelectedDate(t,!0)},renderYear:function(t,e,s){return r.td(t,e)}});t.exports=a},function(t,e,s){"use strict";var n=s(2),r=n.DOM,a=n.createClass({getInitialState:function(){return this.calculateState(this.props)},calculateState:function(t){var e=t.selectedDate||t.viewDate,s=t.timeFormat,n=[];return-1==s.indexOf("H")&&-1==s.indexOf("h")||(n.push("hours"),-1!=s.indexOf("m")&&(n.push("minutes"),-1!=s.indexOf("s")&&n.push("seconds"))),{hours:e.format("H"),minutes:e.format("mm"),seconds:e.format("ss"),milliseconds:e.format("SSS"),counters:n}},renderCounter:function(t){return r.div({key:t,className:"rdtCounter"},[r.button({key:"up",className:"rdtBtn",onMouseDown:this.onStartClicking("increase",t),type:"button"},"▲"),r.div({key:"c",className:"rdtCount"},this.state[t]),r.button({key:"do",className:"rdtBtn",onMouseDown:this.onStartClicking("decrease",t),type:"button"},"▼")])},render:function(){var t=this,e=[];return this.state.counters.forEach(function(s){e.length&&e.push(r.div({key:"sep"+e.length,className:"rdtCounterSeparator"},":")),e.push(t.renderCounter(s))}),3==this.state.counters.length&&-1!=this.props.timeFormat.indexOf("S")&&(e.push(r.div({className:"rdtCounterSeparator",key:"sep5"},":")),e.push(r.div({className:"rdtCounter rdtMilli",key:"m"},r.input({value:this.state.milliseconds,type:"text",onChange:this.updateMilli})))),r.div({className:"rdtTime"},r.table({},[this.renderHeader(),r.tbody({key:"b"},r.tr({},r.td({},r.div({className:"rdtCounters"},e))))]))},componentWillReceiveProps:function(t,e){this.setState(this.calculateState(t))},updateMilli:function(t){var e=parseInt(t.target.value);e==t.target.value&&e>=0&&1e3>e&&(this.props.setTime("milliseconds",e),this.setState({milliseconds:e}))},renderHeader:function(){if(!this.props.dateFormat)return null;var t=this.props.selectedDate||this.props.viewDate;return r.thead({key:"h"},r.tr({},r.th({className:"rdtSwitch",colSpan:4,onClick:this.props.showView("days")},t.format(this.props.dateFormat))))},onStartClicking:function(t,e){var s=this;this.state[e];return function(){var n={};n[e]=s[t](e),s.setState(n),s.timer=setTimeout(function(){s.increaseTimer=setInterval(function(){n[e]=s[t](e),s.setState(n)},70)},500),s.mouseUpListener=function(){clearTimeout(s.timer),clearInterval(s.increaseTimer),s.props.setTime(e,s.state[e]),document.body.removeEventListener("mouseup",s.mouseUpListener)},document.body.addEventListener("mouseup",s.mouseUpListener)}},maxValues:{hours:23,minutes:59,seconds:59,milliseconds:999},padValues:{hours:1,minutes:2,seconds:2,milliseconds:3},increase:function(t){var e=parseInt(this.state[t])+1;return e>this.maxValues[t]&&(e=0),this.pad(t,e)},decrease:function(t){var e=parseInt(this.state[t])-1;return 0>e&&(e=this.maxValues[t]),this.pad(t,e)},pad:function(t,e){for(var s=e+"";s.length<this.padValues[t];)s="0"+s;return s}});t.exports=a},function(t,e,s){var n=s(2),r=n.version&&n.version.split(".");r&&(r[0]>0||r[1]>13)&&(n=s(9));var a=[],o=[],i="ignore-react-onclickoutside",c=function(t,e){return t===e?!0:t.correspondingElement?t.correspondingElement.classList.contains(i):t.classList.contains(i)};t.exports={componentDidMount:function(){if("function"!=typeof this.handleClickOutside)throw new Error("Component lacks a handleClickOutside(event) function for processing outside click events.");var t=this.__outsideClickHandler=function(t,e){return function(s){s.stopPropagation();for(var n=s.target,r=!1;n.parentNode;){if(r=c(n,t))return;n=n.parentNode}e(s)}}(n.findDOMNode(this),this.handleClickOutside),e=a.length;a.push(this),o[e]=t,this.props.disableOnClickOutside||this.enableOnClickOutside()},componentWillUnmount:function(){this.disableOnClickOutside(),this.__outsideClickHandler=!1;var t=a.indexOf(this);t>-1&&o[t]&&(o.splice(t,1),a.splice(t,1))},enableOnClickOutside:function(){var t=this.__outsideClickHandler;document.addEventListener("mousedown",t),document.addEventListener("touchstart",t)},disableOnClickOutside:function(){var t=this.__outsideClickHandler;document.removeEventListener("mousedown",t),document.removeEventListener("touchstart",t)}}},function(t,e){t.exports=s}])});

example/example.js

@@ -0,0 +0,0 @@ var DateTime = require('../DateTime.js');

gulpfile.js

@@ -0,0 +0,0 @@ var gulp = require('gulp'),

package.json

 {
   "name": "react-datetime",
-  "version": "2.1.0",
+  "version": "2.2.0",
   "description": "A lightweight but complete datetime picker React.js component.",
@@ -39,2 +39,3 @@ "homepage": "https://github.com/arqex/react-datetime",
     "react": ">=0.13",
+    "react-addons-test-utils": ">=0.13",
     "react-tools": "^0.13.2",
@@ -41,0 +42,0 @@ "webpack": "^1.5.1",

README.md

@@ -5,3 +5,3 @@ react-datetime
 
-[![Build Status](https://secure.travis-ci.org/YouCanBookMe/react-datetime.svg)](https://travis-ci.org/arqex/react-datetime)
+[![Build Status](https://secure.travis-ci.org/YouCanBookMe/react-datetime.svg)](https://travis-ci.org/YouCanBookMe/react-datetime)
 [![npm version](https://badge.fury.io/js/react-datetime.svg)](http://badge.fury.io/js/react-datetime)
@@ -8,0 +8,0 @@

src/DaysView.js

@@ -124,2 +124,3 @@ var React = require('react'),
 		var date = this.props.selectedDate || this.props.viewDate;
+		
 		return DOM.tfoot({ key: 'tf'},
@@ -126,0 +127,0 @@ DOM.tr({},

src/MonthsView.js

@@ -40,3 +40,3 @@ 'use strict';
 				className: classes,
-				onClick: this.props.setDate('month')
+				onClick: this.props.updateOn=="months"? this.updateSelectedMonth : this.props.setDate('month')
 			};
@@ -57,2 +57,6 @@
 
+	updateSelectedMonth: function( event ) {
+		this.props.updateSelectedDate(event, true);
+	},
+
 	renderMonth: function( props, month, year, selectedDate ) {
@@ -59,0 +63,0 @@ return DOM.td( props, this.props.viewDate.localeData()._monthsShort[ month ] );

src/onClickOutside.js

@@ -0,0 +0,0 @@ // This is extracted from https://github.com/Pomax/react-onclickoutside

src/TimeView.js

@@ -0,0 +0,0 @@ 'use strict';

src/YearsView.js

@@ -41,3 +41,3 @@ 'use strict';
 				className: classes,
-				onClick: this.props.setDate('year')
+				onClick: this.props.updateOn=="years" ? this.updateSelectedYear : this.props.setDate('year')
 			};
@@ -59,2 +59,6 @@
 
+	updateSelectedYear: function( event ) {
+		this.props.updateSelectedDate(event, true);
+	},
+
 	renderYear: function( props, year, selectedDate ){
@@ -61,0 +65,0 @@ return DOM.td( props, year );

tests/datetime-spec.js

@@ -7,10 +7,9 @@ // Create the dom before requiring react
 // Needs to be global to work in Travis CI
-React = require('react/addons');
+React = require('react');
 ReactDOM = require('react-dom');
 
-var ReactAddons = require('react/addons'),
-	Utils = React.addons.TestUtils,
-	Datetime = require('../DateTime'),
+var Datetime = require('../DateTime'),
 	assert = require('assert'),
-	moment = require('moment')
+	moment = require('moment'),
+	TestUtils = require('react-addons-test-utils')
 ;
@@ -35,3 +34,3 @@
 
-var ev = React.addons.TestUtils.Simulate;
+var ev = TestUtils.Simulate;
 var dt = {
@@ -111,2 +110,3 @@ dt: function(){
 
+
 	it( 'Date value', function(){
@@ -172,3 +172,2 @@ var component = createDatetime({ value: date }),
 	});
-
 	it( 'timeFormat', function(){
@@ -565,3 +564,3 @@ var format = 'HH:mm:ss:SSS',
 		dt.input().value = strDate;
-		Utils.Simulate.change( dt.input() );
+		ev.change( dt.input() );
 	});
@@ -575,3 +574,3 @@
 		dt.input().value = '';
-		Utils.Simulate.change( dt.input() );
+		ev.change( dt.input() );
 	});
@@ -587,3 +586,3 @@
 		dt.input().value = invalidStrDate;
-		Utils.Simulate.change( dt.input() );
+		ev.change( dt.input() );
 	});
@@ -599,5 +598,4 @@
 		dt.input().value = invalidStrDate;
-		Utils.Simulate.change( dt.input() );
+		ev.change( dt.input() );
 	});
 });
-

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

110837

increased by1.09%

Lines of code

1860

increased by2.09%

Number of medium supply chain risk alerts

10

decreased by-9.09%

Worsened metrics

Dev dependency count

11

increased by10%

No dependency changes