react-datetime-picker - npm Package Compare versions

Comparing version 1.5.0 to 1.6.0

dist/DateTimeInput.js

@@ -364,10 +364,14 @@ 'use strict';
 
-      var minute = this.state.minute;
+      var _state2 = this.state,
+          hour = _state2.hour,
+          minute = _state2.minute;
 
 
       return _react2.default.createElement(_MinuteInput2.default, _extends({
-        key: 'minute',
+        key: 'minute'
+      }, this.commonInputProps, {
+        hour: hour,
         maxDetail: maxDetail,
         value: minute
-      }, this.commonInputProps));
+      }));
     }
@@ -385,3 +389,6 @@ }, {
 
-      var second = this.state.second;
+      var _state3 = this.state,
+          hour = _state3.hour,
+          minute = _state3.minute,
+          second = _state3.second;
 
@@ -392,3 +399,5 @@
       }, this.commonInputProps, {
+        hour: hour,
         maxDetail: maxDetail,
+        minute: minute,
         value: second
@@ -575,2 +584,46 @@ }));
   }, {
+    key: 'maxTime',
+    get: function get() {
+      var maxDate = this.props.maxDate;
+
+
+      if (!maxDate) {
+        return null;
+      }
+
+      var _state4 = this.state,
+          year = _state4.year,
+          month = _state4.month,
+          day = _state4.day;
+
+
+      if ((0, _dates.getYear)(maxDate) !== year || (0, _dates.getMonth)(maxDate) !== month || (0, _dates.getDay)(maxDate) !== day) {
+        return null;
+      }
+
+      return (0, _dates.getHoursMinutesSeconds)(maxDate);
+    }
+  }, {
+    key: 'minTime',
+    get: function get() {
+      var minDate = this.props.minDate;
+
+
+      if (!minDate) {
+        return null;
+      }
+
+      var _state5 = this.state,
+          year = _state5.year,
+          month = _state5.month,
+          day = _state5.day;
+
+
+      if ((0, _dates.getYear)(minDate) !== year || (0, _dates.getMonth)(minDate) !== month || (0, _dates.getDay)(minDate) !== day) {
+        return null;
+      }
+
+      return (0, _dates.getHoursMinutesSeconds)(minDate);
+    }
+  }, {
     key: 'commonInputProps',
@@ -580,2 +633,4 @@ get: function get() {
 
+      var maxTime = this.maxTime,
+          minTime = this.minTime;
       var _props4 = this.props,
@@ -593,3 +648,5 @@ disabled = _props4.disabled,
         maxDate: maxDate || defaultMaxDate,
+        maxTime: maxTime,
         minDate: minDate || defaultMinDate,
+        minTime: minTime,
         onChange: this.onChange,
@@ -596,0 +653,0 @@ onKeyDown: this.onKeyDown,

dist/DateTimeInput/NativeInput.js

@@ -29,4 +29,2 @@ 'use strict';
 
-var nativeValueParser = _dates.getISOLocalDateTime;
-
 var NativeInput = function (_PureComponent) {
@@ -54,3 +52,4 @@ _inherits(NativeInput, _PureComponent);
     value: function render() {
-      var step = this.step;
+      var nativeValueParser = this.nativeValueParser,
+          step = this.step;
       var _props = this.props,
@@ -86,2 +85,23 @@ disabled = _props.disabled,
   }, {
+    key: 'nativeValueParser',
+    get: function get() {
+      var valueType = this.props.valueType;
+
+
+      switch (valueType) {
+        case 'hour':
+          return function (value) {
+            return (0, _dates.getISOLocalDate)(value) + 'T' + (0, _dates.getHours)(value) + ':00';
+          };
+        case 'minute':
+          return function (value) {
+            return (0, _dates.getISOLocalDate)(value) + 'T' + (0, _dates.getHoursMinutes)(value);
+          };
+        case 'second':
+          return _dates.getISOLocalDateTime;
+        default:
+          throw new Error('Invalid valueType.');
+      }
+    }
+  }, {
     key: 'step',
@@ -88,0 +108,0 @@ get: function get() {

dist/DateTimePicker.js

@@ -277,6 +277,7 @@ 'use strict';
     value: function renderClock() {
+      var disableClock = this.props.disableClock;
       var isClockOpen = this.state.isClockOpen;
 
 
-      if (isClockOpen === null) {
+      if (isClockOpen === null || disableClock) {
         return null;
@@ -399,4 +400,4 @@ }
 DateTimePicker.defaultProps = {
+  calendarIcon: CalendarIcon,
   clearIcon: ClearIcon,
-  calendarIcon: CalendarIcon,
   isCalendarOpen: null,
@@ -409,11 +410,12 @@ isClockOpen: null,
   calendarClassName: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.arrayOf(_propTypes2.default.string)]),
-  clockClassName: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.arrayOf(_propTypes2.default.string)]),
   calendarIcon: _propTypes2.default.node,
   className: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.arrayOf(_propTypes2.default.string)]),
   clearIcon: _propTypes2.default.node,
+  clockClassName: _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.arrayOf(_propTypes2.default.string)]),
   disabled: _propTypes2.default.bool,
+  disableClock: _propTypes2.default.bool,
   isCalendarOpen: _propTypes2.default.bool,
   isClockOpen: _propTypes2.default.bool,
+  maxDate: _propTypes3.isMaxDate,
   maxDetail: _propTypes2.default.oneOf(allViews),
-  maxDate: _propTypes3.isMaxDate,
   minDate: _propTypes3.isMinDate,
@@ -420,0 +422,0 @@ name: _propTypes2.default.string,

dist/shared/dates.js

@@ -6,3 +6,3 @@ 'use strict';
 });
-exports.getISOLocalDateTime = exports.convert24to12 = exports.convert12to24 = exports.getSeconds = exports.getMinutes = exports.getHours = exports.getDay = exports.getMonth = exports.getYear = undefined;
+exports.getISOLocalDateTime = exports.getHoursMinutesSeconds = exports.getISOLocalDate = exports.convert24to12 = exports.convert12to24 = exports.getHoursMinutes = exports.getSeconds = exports.getMinutes = exports.getHours = exports.getDay = exports.getMonth = exports.getYear = undefined;
 
@@ -53,2 +53,8 @@ var _dates = require('react-calendar/dist/shared/dates');
 
+Object.defineProperty(exports, 'getHoursMinutes', {
+  enumerable: true,
+  get: function get() {
+    return _dates3.getHoursMinutes;
+  }
+});
 Object.defineProperty(exports, 'convert12to24', {
@@ -66,5 +72,7 @@ enumerable: true,
 });
+exports.getISOLocalDate = _dates.getISOLocalDate;
+exports.getHoursMinutesSeconds = _dates3.getHoursMinutesSeconds;
 
+// eslint-disable-next-line import/prefer-default-export
 
-// eslint-disable-next-line import/prefer-default-export
 var getISOLocalDateTime = exports.getISOLocalDateTime = function getISOLocalDateTime(value) {
@@ -71,0 +79,0 @@ if (!value) {

package.json

 {
   "name": "react-datetime-picker",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "A date range picker for your React app.",
@@ -11,4 +11,5 @@ "main": "dist/entry.js",
     "build-styles": "lessc ./dist/DateTimePicker.less ./dist/DateTimePicker.css",
+    "clean": "rimraf dist",
     "copy-styles": "node ./copy-styles.js",
-    "prepublishOnly": "yarn run build",
+    "prepublishOnly": "yarn run clean && yarn run build",
     "test": "yarn run test-eslint && yarn run test-jest",
@@ -53,3 +54,3 @@ "test-eslint": "eslint src/ test/ --ext .jsx,.js",
     "react-lifecycles-compat": "^3.0.4",
-    "react-time-picker": "^2.6.0"
+    "react-time-picker": "^2.7.0"
   },
@@ -62,6 +63,5 @@ "devDependencies": {
     "babel-plugin-transform-class-properties": "^6.24.1",
-    "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-preset-env": "^1.6.1",
     "babel-preset-react": "^6.24.1",
-    "babel-preset-stage-2": "^6.24.1",
     "enzyme": "^3.3.0",
@@ -79,3 +79,4 @@ "enzyme-adapter-react-16": "^1.1.1",
     "react-dom": "^16.4.0",
-    "react-test-renderer": "^16.4.1"
+    "react-test-renderer": "^16.4.1",
+    "rimraf": "^2.6.2"
   },
@@ -82,0 +83,0 @@ "peerDependencies": {

README.md

@@ -96,2 +96,3 @@ ![downloads](https://img.shields.io/npm/dt/react-datetime-picker.svg) ![build](https://img.shields.io/travis/wojtekmaj/react-datetime-picker/master.svg) ![dependencies](https://img.shields.io/david/wojtekmaj/react-datetime-picker.svg
 |disabled|Defines whether the date picker should be disabled. Defaults to false.|`true`|
+|disableClock|Defines whether the clock should be disabled. Defaults to false.|`true`|
 |isCalendarOpen|Defines whether the calendar should be opened. Defaults to false.|`true`|
@@ -98,0 +99,0 @@ |isClockOpen|Defines whether the clock should be opened. Defaults to false.|`true`|

src/__tests__/DateTimePicker.jsx

@@ -135,2 +135,14 @@ import React from 'react';
 
+  it('does not render Clock component when given disableClock & isClockOpen flags', () => {
+    const component = mount(
+      <DateTimePicker disableClock isClockOpen />
+    );
+
+    const dateTimeInput = component.find('DateTimeInput');
+    const clock = component.find('Clock');
+
+    expect(dateTimeInput).toHaveLength(1);
+    expect(clock).toHaveLength(0);
+  });
+
   it('opens Calendar component when given isCalendarOpen flag by changing props', () => {
@@ -137,0 +149,0 @@ const component = mount(

src/DateTimeInput.jsx

@@ -24,2 +24,3 @@ import React, { PureComponent } from 'react';
   getYear,
+  getHoursMinutesSeconds,
   convert12to24,
@@ -183,3 +184,44 @@ convert24to12,
 
+  get maxTime() {
+    const { maxDate } = this.props;
+
+    if (!maxDate) {
+      return null;
+    }
+
+    const { year, month, day } = this.state;
+
+    if (
+      getYear(maxDate) !== year
+      || getMonth(maxDate) !== month
+      || getDay(maxDate) !== day
+    ) {
+      return null;
+    }
+
+    return getHoursMinutesSeconds(maxDate);
+  }
+
+  get minTime() {
+    const { minDate } = this.props;
+
+    if (!minDate) {
+      return null;
+    }
+
+    const { year, month, day } = this.state;
+
+    if (
+      getYear(minDate) !== year
+      || getMonth(minDate) !== month
+      || getDay(minDate) !== day
+    ) {
+      return null;
+    }
+
+    return getHoursMinutesSeconds(minDate);
+  }
+
   get commonInputProps() {
+    const { maxTime, minTime } = this;
     const {
@@ -197,3 +239,5 @@ disabled,
       maxDate: maxDate || defaultMaxDate,
+      maxTime,
       minDate: minDate || defaultMinDate,
+      minTime,
       onChange: this.onChange,
@@ -444,3 +488,3 @@ onKeyDown: this.onKeyDown,
 
-    const { minute } = this.state;
+    const { hour, minute } = this.state;
 
@@ -450,5 +494,6 @@ return (
         key="minute"
+        {...this.commonInputProps}
+        hour={hour}
         maxDetail={maxDetail}
         value={minute}
-        {...this.commonInputProps}
       />
@@ -466,3 +511,3 @@ );
 
-    const { second } = this.state;
+    const { hour, minute, second } = this.state;
 
@@ -473,3 +518,5 @@ return (
         {...this.commonInputProps}
+        hour={hour}
         maxDetail={maxDetail}
+        minute={minute}
         value={second}
@@ -476,0 +523,0 @@ />

src/DateTimeInput/NativeInput.jsx

 import React, { PureComponent } from 'react';
 import PropTypes from 'prop-types';
 
-import { getISOLocalDateTime } from '../shared/dates';
+import {
+  getHours,
+  getHoursMinutes,
+  getISOLocalDate,
+  getISOLocalDateTime,
+} from '../shared/dates';
 import { isMaxDate, isMinDate, isValueType } from '../shared/propTypes';
 
-const nativeValueParser = getISOLocalDateTime;
+export default class NativeInput extends PureComponent {
+  get nativeValueParser() {
+    const { valueType } = this.props;
 
-export default class NativeInput extends PureComponent {
+    switch (valueType) {
+      case 'hour':
+        return value => `${getISOLocalDate(value)}T${getHours(value)}:00`;
+      case 'minute':
+        return value => `${getISOLocalDate(value)}T${getHoursMinutes(value)}`;
+      case 'second':
+        return getISOLocalDateTime;
+      default:
+        throw new Error('Invalid valueType.');
+    }
+  }
+
   get step() {
@@ -28,3 +46,3 @@ const { valueType } = this.props;
   render() {
-    const { step } = this;
+    const { nativeValueParser, step } = this;
     const {
@@ -31,0 +49,0 @@ disabled, maxDate, minDate, name, onChange, required, value,

src/DateTimePicker.jsx

@@ -251,5 +251,6 @@ import React, { PureComponent } from 'react';
   renderClock() {
+    const { disableClock } = this.props;
     const { isClockOpen } = this.state;
 
-    if (isClockOpen === null) {
+    if (isClockOpen === null || disableClock) {
       return null;
@@ -345,4 +346,4 @@ }
 DateTimePicker.defaultProps = {
+  calendarIcon: CalendarIcon,
   clearIcon: ClearIcon,
-  calendarIcon: CalendarIcon,
   isCalendarOpen: null,
@@ -360,17 +361,18 @@ isClockOpen: null,
   ]),
-  clockClassName: PropTypes.oneOfType([
+  calendarIcon: PropTypes.node,
+  className: PropTypes.oneOfType([
     PropTypes.string,
     PropTypes.arrayOf(PropTypes.string),
   ]),
-  calendarIcon: PropTypes.node,
-  className: PropTypes.oneOfType([
+  clearIcon: PropTypes.node,
+  clockClassName: PropTypes.oneOfType([
     PropTypes.string,
     PropTypes.arrayOf(PropTypes.string),
   ]),
-  clearIcon: PropTypes.node,
   disabled: PropTypes.bool,
+  disableClock: PropTypes.bool,
   isCalendarOpen: PropTypes.bool,
   isClockOpen: PropTypes.bool,
+  maxDate: isMaxDate,
   maxDetail: PropTypes.oneOf(allViews),
-  maxDate: isMaxDate,
   minDate: isMinDate,
@@ -377,0 +379,0 @@ name: PropTypes.string,

src/shared/dates.js

@@ -17,2 +17,3 @@ import { getISOLocalDate } from 'react-calendar/dist/shared/dates';
 export {
+  getHoursMinutes,
   convert12to24,
@@ -22,2 +23,7 @@ convert24to12,
 
+export {
+  getISOLocalDate,
+  getHoursMinutesSeconds,
+};
+
 // eslint-disable-next-line import/prefer-default-export
@@ -24,0 +30,0 @@ export const getISOLocalDateTime = (value) => {

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

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

Improved metrics

Total package byte prevSize

124799

increased by8.4%

Number of package files

31

increased by3.33%

Lines of code

3147

increased by11.16%

Number of lines in readme file

137

increased by0.74%

Dependency changes

• Updatedreact-time-picker@^2.7.0