diff --git a/DateTime.js b/DateTime.js
index 4d1d9f67e..3863023b4 100644
--- a/DateTime.js
+++ b/DateTime.js
@@ -13,6 +13,7 @@ var Datetime = createClass({
 	propTypes: {
 		// value: TYPES.object | TYPES.string,
 		// defaultValue: TYPES.object | TYPES.string,
+		// defaultTime: TYPES.string,
 		onFocus: TYPES.func,
 		onBlur: TYPES.func,
 		onChange: TYPES.func,
@@ -37,6 +38,7 @@ var Datetime = createClass({
 		return {
 			className: '',
 			defaultValue: '',
+			defaultTime: '',
 			inputProps: {},
 			input: true,
 			onFocus: nof,
@@ -319,10 +321,21 @@ var Datetime = createClass({
 				.year( parseInt( target.getAttribute('data-value'), 10 ) );
 		}
 
-		date.hours( currentDate.hours() )
-			.minutes( currentDate.minutes() )
-			.seconds( currentDate.seconds() )
-			.milliseconds( currentDate.milliseconds() );
+		var hours = currentDate.hours();
+		var minutes = currentDate.minutes();
+		var seconds = currentDate.seconds();
+		var milliseconds = currentDate.milliseconds();
+		if (this.props.defaultTime && !this.state.selectedDate) {
+			var defaultTimeParts = this.props.defaultTime.split(':');
+			hours = defaultTimeParts[0] || hours;
+			minutes = defaultTimeParts[1] || minutes;
+			seconds = defaultTimeParts[2] || seconds;
+			milliseconds = defaultTimeParts[3] || milliseconds;
+		}
+		date.hours( hours )
+			.minutes( minutes )
+			.seconds( seconds )
+			.milliseconds( milliseconds );
 
 		if ( !this.props.value ) {
 			var open = !( this.props.closeOnSelect && close );
@@ -359,6 +372,10 @@ var Datetime = createClass({
 		});
 	},
 
+	handleClick: function() {
+		this.openCalendar();
+	},
+
 	handleClickOutside: function() {
 		if ( this.props.input && this.state.open && !this.props.open ) {
 			this.setState({ open: false }, function() {
@@ -405,8 +422,8 @@ var Datetime = createClass({
 		// TODO: Make a function or clean up this code,
 		// logic right now is really hard to follow
 		var className = 'rdt' + (this.props.className ?
-                  ( Array.isArray( this.props.className ) ?
-                  ' ' + this.props.className.join( ' ' ) : ' ' + this.props.className) : ''),
+									( Array.isArray( this.props.className ) ?
+									' ' + this.props.className.join( ' ' ) : ' ' + this.props.className) : ''),
 			children = [];
 
 		if ( this.props.input ) {
@@ -414,6 +431,7 @@ var Datetime = createClass({
 				key: 'i',
 				type: 'text',
 				className: 'form-control',
+				onClick: this.handleClick,
 				onFocus: this.openCalendar,
 				onChange: this.onInputChange,
 				onKeyDown: this.onInputKey,
diff --git a/example/index.html b/example/index.html
index e33fc02ad..7907b0c9a 100644
--- a/example/index.html
+++ b/example/index.html
@@ -8,7 +8,7 @@
  <div id="datetime">
  </div>
 
- <script src="http://localhost:8080/webpack-dev-server.js"></script>
+ <script src="http://localhost:8889/webpack-dev-server.js"></script>
  <script src="bundle.js"></script>
 </body>
 </html>
diff --git a/example/webpack.config.js b/example/webpack.config.js
index 00eabd58f..ed735181d 100644
--- a/example/webpack.config.js
+++ b/example/webpack.config.js
@@ -3,7 +3,7 @@ var path = require('path');
 module.exports = {
 	entry: [
 		'webpack/hot/dev-server',
-		'webpack-dev-server/client?http://localhost:8080',
+		'webpack-dev-server/client?http://localhost:8889',
 		path.resolve(__dirname, 'example.js')
 	],
 
diff --git a/package.json b/package.json
index 7128bc0b1..eaff3849a 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
-  "name": "react-datetime",
-  "version": "2.9.0",
+  "name": "@waltzlabs/react-datetime",
+  "version": "2.11.0",
   "description": "A lightweight but complete datetime picker React.js component.",
   "homepage": "https://github.com/YouCanBookMe/react-datetime",
   "repository": {
@@ -19,7 +19,7 @@
   "scripts": {
     "build:mac": "./node_modules/.bin/gulp",
     "build:win": "./node_modules/.bin/gulp.cmd",
-    "dev": "./node_modules/.bin/webpack-dev-server --config example/webpack.config.js --devtool eval --progress --colors --hot --content-base example",
+    "dev": "./node_modules/.bin/webpack-dev-server --config example/webpack.config.js --devtool eval --progress --colors --hot --content-base example --port 8889",
     "lint": "./node_modules/.bin/eslint src/ DateTime.js test/",
     "test": "./node_modules/.bin/jest",
     "test:typings": "./node_modules/.bin/tsc -p ./typings",
diff --git a/test/tests.spec.js b/test/tests.spec.js
index a59d8216f..d69226e24 100644
--- a/test/tests.spec.js
+++ b/test/tests.spec.js
@@ -196,6 +196,12 @@ describe('Datetime', () => {
 		expect(utils.isOpen(component)).toBeTruthy();
 	});
 
+	it('open picker on click', () => {
+		const component = utils.createDatetime();
+		component.find('.form-control').simulate('click');
+		expect(utils.isOpen(component)).toBeTruthy();
+	});
+
 	it('sets CSS class on selected item (day)', () => {
 		const component = utils.createDatetime({ viewMode: 'days' });
 		utils.openDatepicker(component);