react-time-picker - npm Package Compare versions

Comparing version 4.0.1 to 4.1.0

dist/Divider.js

@@ -16,3 +16,3 @@ "use strict";
   var children = _ref.children;
-  return _react["default"].createElement("span", {
+  return /*#__PURE__*/_react["default"].createElement("span", {
     className: "react-time-picker__inputGroup__divider"
@@ -19,0 +19,0 @@ }, children);

dist/shared/utils.js

@@ -9,38 +9,25 @@ "use strict";
 exports.safeMax = safeMax;
-exports.callIfDefined = void 0;
 
 var _dateFormatter = require("./dateFormatter");
 
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
 
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
 
-/**
- * Calls a function, if it's defined, with specified arguments
- * @param {Function} fn
- * @param {Object} args
- */
-var callIfDefined = function callIfDefined(fn) {
-  if (fn && typeof fn === 'function') {
-    for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
-      args[_key - 1] = arguments[_key];
-    }
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
-    fn.apply(void 0, args);
-  }
-};
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
-exports.callIfDefined = callIfDefined;
 var nines = ['9', '٩'];
@@ -90,4 +77,4 @@ var ninesRegExp = new RegExp("[".concat(nines.join(''), "]"));
 function safeMin() {
-  for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
-    args[_key2] = arguments[_key2];
+  for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+    args[_key] = arguments[_key];
   }
@@ -99,4 +86,4 @@
 function safeMax() {
-  for (var _len3 = arguments.length, args = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
-    args[_key3] = arguments[_key3];
+  for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+    args[_key2] = arguments[_key2];
   }
@@ -103,0 +90,0 @@

dist/TimeInput.js

@@ -44,7 +44,7 @@ "use strict";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
@@ -61,22 +61,30 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
 function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
-function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _nonIterableSpread(); }
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
-function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance"); }
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArray(iter) { if (Symbol.iterator in Object(iter) || Object.prototype.toString.call(iter) === "[object Arguments]") return Array.from(iter); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
-function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = new Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } }
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
 
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
 var allViews = ['hour', 'minute', 'second'];
@@ -116,3 +124,5 @@
   return placeholder.split(pattern).reduce(function (arr, element, index) {
-    var divider = element && // eslint-disable-next-line react/no-array-index-key
+    var divider = element &&
+    /*#__PURE__*/
+    // eslint-disable-next-line react/no-array-index-key
     _react["default"].createElement(_Divider["default"], {
@@ -145,5 +155,5 @@ key: "separator_".concat(index)
 
+  var _super = _createSuper(TimeInput);
+
   function TimeInput() {
-    var _getPrototypeOf2;
-
     var _this;
@@ -157,3 +167,3 @@
 
-    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(TimeInput)).call.apply(_getPrototypeOf2, [this].concat(args)));
+    _this = _super.call.apply(_super, [this].concat(args));
 
@@ -337,3 +347,3 @@ _defineProperty(_assertThisInitialized(_this), "state", {
       var showLeadingZeros = currentMatch && currentMatch.length === 2;
-      return _react["default"].createElement(_Hour12Input["default"], _extends({
+      return /*#__PURE__*/_react["default"].createElement(_Hour12Input["default"], _extends({
         key: "hour12"
@@ -362,3 +372,3 @@ }, _this.commonInputProps, {
       var showLeadingZeros = currentMatch && currentMatch.length === 2;
-      return _react["default"].createElement(_Hour24Input["default"], _extends({
+      return /*#__PURE__*/_react["default"].createElement(_Hour24Input["default"], _extends({
         key: "hour24"
@@ -388,3 +398,3 @@ }, _this.commonInputProps, {
       var showLeadingZeros = currentMatch && currentMatch.length === 2;
-      return _react["default"].createElement(_MinuteInput["default"], _extends({
+      return /*#__PURE__*/_react["default"].createElement(_MinuteInput["default"], _extends({
         key: "minute"
@@ -416,3 +426,3 @@ }, _this.commonInputProps, {
       var showLeadingZeros = currentMatch ? currentMatch.length === 2 : true;
-      return _react["default"].createElement(_SecondInput["default"], _extends({
+      return /*#__PURE__*/_react["default"].createElement(_SecondInput["default"], _extends({
         key: "second"
@@ -436,3 +446,3 @@ }, _this.commonInputProps, {
       var amPm = _this.state.amPm;
-      return _react["default"].createElement(_AmPm["default"], _extends({
+      return /*#__PURE__*/_react["default"].createElement(_AmPm["default"], _extends({
         key: "ampm"
@@ -506,3 +516,3 @@ }, _this.commonInputProps, {
           value = _this$props6.value;
-      return _react["default"].createElement(_NativeInput["default"], {
+      return /*#__PURE__*/_react["default"].createElement(_NativeInput["default"], {
         key: "time",
@@ -528,3 +538,3 @@ ariaLabel: nativeInputAriaLabel,
 
-      return _react["default"].createElement("div", {
+      return /*#__PURE__*/_react["default"].createElement("div", {
         className: className,
@@ -531,0 +541,0 @@ onClick: this.onClick

dist/TimeInput/AmPm.js

@@ -24,8 +24,12 @@ "use strict";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
@@ -53,3 +57,3 @@
 
-  return _react["default"].createElement("select", {
+  return /*#__PURE__*/_react["default"].createElement("select", {
     "aria-label": ariaLabel,
@@ -67,8 +71,8 @@ className: (0, _mergeClassNames["default"])("".concat(className, "__input"), "".concat(className, "__").concat(name)),
     value: value !== null ? value : ''
-  }, !value && _react["default"].createElement("option", {
+  }, !value && /*#__PURE__*/_react["default"].createElement("option", {
     value: ""
-  }, "--"), _react["default"].createElement("option", {
+  }, "--"), /*#__PURE__*/_react["default"].createElement("option", {
     disabled: amDisabled,
     value: "am"
-  }, amLabel), _react["default"].createElement("option", {
+  }, amLabel), /*#__PURE__*/_react["default"].createElement("option", {
     disabled: pmDisabled,
@@ -75,0 +79,0 @@ value: "pm"

dist/TimeInput/Hour12Input.js

@@ -26,8 +26,12 @@ "use strict";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
@@ -75,3 +79,3 @@
   var value12 = value !== null ? (0, _dates.convert24to12)(value)[0] : null;
-  return _react["default"].createElement(_Input["default"], _extends({
+  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({
     max: maxHour,
@@ -78,0 +82,0 @@ min: minHour,

dist/TimeInput/Hour24Input.js

@@ -36,3 +36,3 @@ "use strict";
   var minHour = (0, _utils.safeMax)(0, minTime && (0, _dateUtils.getHours)(minTime));
-  return _react["default"].createElement(_Input["default"], _extends({
+  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({
     max: maxHour,
@@ -39,0 +39,0 @@ min: minHour,

dist/TimeInput/Input.js

@@ -25,7 +25,14 @@ "use strict";
 /* eslint-disable jsx-a11y/no-autofocus */
+var isEdgeLegacy = navigator.userAgent.match(/ Edge\/1/);
+
 function onFocus(event) {
   var target = event.target;
-  requestAnimationFrame(function () {
-    return target.select();
-  });
+
+  if (isEdgeLegacy) {
+    requestAnimationFrame(function () {
+      return target.select();
+    });
+  } else {
+    target.select();
+  }
 }
@@ -65,10 +72,11 @@
 
-var numberRegExp = /[0-9]/;
-
 function makeOnKeyPress(maxLength) {
   return function onKeyPress(event) {
+    var key = event.key,
+        input = event.target;
+    var value = input.value;
+    var isNumberKey = !isNaN(parseInt(key, 10));
     var selection = getSelectionString();
-    var value = event.target.value;
 
-    if (numberRegExp.test(event.key) && (selection || value.length < maxLength)) {
+    if (isNumberKey && (selection || value.length < maxLength)) {
       return;
@@ -102,6 +110,6 @@ }
   var maxLength = max.toString().length;
-  return [hasLeadingZero && _react["default"].createElement("span", {
+  return [hasLeadingZero && /*#__PURE__*/_react["default"].createElement("span", {
     key: "leadingZero",
     className: "".concat(className, "__leadingZero")
-  }, "0"), _react["default"].createElement("input", {
+  }, "0"), /*#__PURE__*/_react["default"].createElement("input", {
     key: "input",
@@ -112,3 +120,5 @@ "aria-label": ariaLabel,
     className: (0, _mergeClassNames["default"])("".concat(className, "__input"), "".concat(className, "__").concat(nameForClass || name), hasLeadingZero && "".concat(className, "__input--hasLeadingZero")),
+    "data-input": "true",
     disabled: disabled,
+    inputMode: "numeric",
     max: max,
@@ -148,2 +158,3 @@ min: min,
   ariaLabel: _propTypes["default"].string,
+  autoFocus: _propTypes["default"].bool,
   className: _propTypes["default"].string.isRequired,
@@ -154,4 +165,8 @@ disabled: _propTypes["default"].bool,
   min: _propTypes["default"].number,
+  name: _propTypes["default"].string,
+  nameForClass: _propTypes["default"].string,
   onChange: _propTypes["default"].func,
   onKeyDown: _propTypes["default"].func,
+  onKeyUp: _propTypes["default"].func,
+  placeholder: _propTypes["default"].string,
   required: _propTypes["default"].bool,
@@ -158,0 +173,0 @@ showLeadingZeros: _propTypes["default"].bool,

dist/TimeInput/MinuteInput.js

@@ -42,3 +42,3 @@ "use strict";
   var minMinute = (0, _utils.safeMax)(0, isSameHour(minTime) && (0, _dateUtils.getMinutes)(minTime));
-  return _react["default"].createElement(_Input["default"], _extends({
+  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({
     max: maxMinute,
@@ -45,0 +45,0 @@ min: minMinute,

dist/TimeInput/NativeInput.js

@@ -67,3 +67,3 @@ "use strict";
 
-  return _react["default"].createElement("input", {
+  return /*#__PURE__*/_react["default"].createElement("input", {
     "aria-label": ariaLabel,
@@ -81,4 +81,3 @@ disabled: disabled,
       position: 'absolute',
-      top: '-9999px',
-      left: '-9999px'
+      zIndex: '-999'
     },
@@ -85,0 +84,0 @@ type: "time",

dist/TimeInput/SecondInput.js

@@ -43,3 +43,3 @@ "use strict";
   var minSecond = (0, _utils.safeMax)(0, isSameMinute(minTime) && (0, _dateUtils.getSeconds)(minTime));
-  return _react["default"].createElement(_Input["default"], _extends({
+  return /*#__PURE__*/_react["default"].createElement(_Input["default"], _extends({
     max: maxSecond,
@@ -46,0 +46,0 @@ min: minSecond,

dist/TimePicker.js

@@ -18,3 +18,3 @@ "use strict";
 
-var _entry = _interopRequireDefault(require("react-clock/dist/entry.nostyle"));
+var _reactClock = _interopRequireDefault(require("react-clock"));
 
@@ -25,4 +25,2 @@ var _TimeInput = _interopRequireDefault(require("./TimeInput"));
 
-var _utils = require("./shared/utils");
-
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -42,8 +40,12 @@
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
 
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
@@ -57,11 +59,15 @@
 
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+
 function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
 
-function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
-
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
 
-function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
 
@@ -77,5 +83,5 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
+  var _super = _createSuper(TimePicker);
+
   function TimePicker() {
-    var _getPrototypeOf2;
-
     var _this;
@@ -89,3 +95,3 @@
 
-    _this = _possibleConstructorReturn(this, (_getPrototypeOf2 = _getPrototypeOf(TimePicker)).call.apply(_getPrototypeOf2, [this].concat(args)));
+    _this = _super.call.apply(_super, [this].concat(args));
 
@@ -182,3 +188,4 @@ _defineProperty(_assertThisInitialized(_this), "state", {});
         this.handleOutsideActionListeners();
-        (0, _utils.callIfDefined)(isOpen ? onClockOpen : onClockClose);
+        var callback = isOpen ? onClockOpen : onClockClose;
+        if (callback) callback();
       }
@@ -248,5 +255,5 @@ }
       };
-      return _react["default"].createElement("div", {
+      return /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(baseClassName, "__wrapper")
-      }, _react["default"].createElement(_TimeInput["default"], _extends({}, ariaLabelProps, placeholderProps, {
+      }, /*#__PURE__*/_react["default"].createElement(_TimeInput["default"], _extends({}, ariaLabelProps, placeholderProps, {
         autoFocus: autoFocus,
@@ -266,3 +273,3 @@ className: "".concat(baseClassName, "__inputGroup"),
         value: valueFrom
-      })), clearIcon !== null && _react["default"].createElement("button", {
+      })), clearIcon !== null && /*#__PURE__*/_react["default"].createElement("button", {
         "aria-label": clearAriaLabel,
@@ -274,3 +281,3 @@ className: "".concat(baseClassName, "__clear-button ").concat(baseClassName, "__button"),
         type: "button"
-      }, clearIcon), clockIcon !== null && !disableClock && _react["default"].createElement("button", {
+      }, clearIcon), clockIcon !== null && !disableClock && /*#__PURE__*/_react["default"].createElement("button", {
         "aria-label": clockAriaLabel,
@@ -310,5 +317,5 @@ className: "".concat(baseClassName, "__clock-button ").concat(baseClassName, "__button"),
       var maxDetailIndex = allViews.indexOf(maxDetail);
-      return _react["default"].createElement(_reactFit["default"], null, _react["default"].createElement("div", {
+      return /*#__PURE__*/_react["default"].createElement(_reactFit["default"], null, /*#__PURE__*/_react["default"].createElement("div", {
         className: (0, _mergeClassNames["default"])(className, "".concat(className, "--").concat(isOpen ? 'open' : 'closed'))
-      }, _react["default"].createElement(_entry["default"], _extends({
+      }, /*#__PURE__*/_react["default"].createElement(_reactClock["default"], _extends({
         className: clockClassName,
@@ -329,3 +336,3 @@ renderMinuteHand: maxDetailIndex > 0,
       var isOpen = this.state.isOpen;
-      return _react["default"].createElement("div", _extends({
+      return /*#__PURE__*/_react["default"].createElement("div", _extends({
         className: (0, _mergeClassNames["default"])(baseClassName, "".concat(baseClassName, "--").concat(isOpen ? 'open' : 'closed'), "".concat(baseClassName, "--").concat(disabled ? 'disabled' : 'enabled'), className)
@@ -375,16 +382,16 @@ }, this.eventProps, {
 
-var ClockIcon = _react["default"].createElement("svg", _extends({}, iconProps, {
+var ClockIcon = /*#__PURE__*/_react["default"].createElement("svg", _extends({}, iconProps, {
   className: "".concat(baseClassName, "__clock-button__icon ").concat(baseClassName, "__button__icon"),
   fill: "none"
-}), _react["default"].createElement("circle", {
+}), /*#__PURE__*/_react["default"].createElement("circle", {
   cx: "9.5",
   cy: "9.5",
   r: "7.5"
-}), _react["default"].createElement("path", {
+}), /*#__PURE__*/_react["default"].createElement("path", {
   d: "M9.5 4.5 v5 h4"
 }));
 
-var ClearIcon = _react["default"].createElement("svg", _extends({}, iconProps, {
+var ClearIcon = /*#__PURE__*/_react["default"].createElement("svg", _extends({}, iconProps, {
   className: "".concat(baseClassName, "__clear-button__icon ").concat(baseClassName, "__button__icon")
-}), _react["default"].createElement("line", {
+}), /*#__PURE__*/_react["default"].createElement("line", {
   x1: "4",
@@ -394,3 +401,3 @@ x2: "15",
   y2: "15"
-}), _react["default"].createElement("line", {
+}), /*#__PURE__*/_react["default"].createElement("line", {
   x1: "15",
@@ -397,0 +404,0 @@ x2: "4",

package.json

 {
   "name": "react-time-picker",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "A time picker for your React app.",
@@ -9,3 +9,3 @@ "main": "dist/entry.js",
     "build": "yarn build-js && yarn copy-styles && yarn build-styles",
-    "build-js": "babel src -d dist --ignore **/*.spec.js,**/*.spec.jsx",
+    "build-js": "babel src -d dist --ignore \"**/*.spec.js,**/*.spec.jsx\"",
     "build-styles": "lessc ./dist/TimePicker.less ./dist/TimePicker.css",
@@ -17,3 +17,3 @@ "clean": "rimraf dist",
     "lint": "eslint sample/ src/ test/ --ext .jsx,.js",
-    "prepublishOnly": "yarn clean && yarn build",
+    "prepack": "yarn clean && yarn build",
     "test": "yarn lint && yarn jest"
@@ -50,3 +50,3 @@ },
     "prop-types": "^15.6.0",
-    "react-clock": "^2.3.0",
+    "react-clock": "^3.0.0",
     "react-fit": "^1.0.3",
@@ -56,21 +56,16 @@ "update-input-width": "^1.1.1"
   "devDependencies": {
-    "@babel/cli": "^7.5.5",
-    "@babel/core": "^7.5.5",
-    "@babel/plugin-proposal-class-properties": "^7.5.5",
-    "@babel/preset-env": "^7.5.5",
-    "@babel/preset-react": "^7.0.0",
+    "@babel/cli": "^7.8.0",
+    "@babel/core": "^7.9.0",
+    "@babel/plugin-proposal-class-properties": "^7.8.0",
+    "@babel/preset-env": "^7.9.0",
+    "@babel/preset-react": "^7.9.0",
+    "@wojtekmaj/enzyme-adapter-react-17": "^0.3.1",
     "babel-eslint": "^10.0.0",
-    "babel-jest": "^25.1.0",
     "enzyme": "^3.10.0",
-    "enzyme-adapter-react-16": "^1.14.0",
-    "eslint": "^6.1.0",
-    "eslint-config-airbnb": "^18.0.0",
-    "eslint-plugin-import": "^2.18.2",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-react": "^7.14.3",
-    "eslint-plugin-react-hooks": "^1.7.0",
-    "jest": "^25.1.0",
+    "eslint": "^7.12.0",
+    "eslint-config-wojtekmaj": "^0.5.0",
+    "jest": "^26.0.0",
     "less": "^3.8.1",
-    "react": "^16.7.0",
-    "react-dom": "^16.7.0",
+    "react": "^17.0.0",
+    "react-dom": "^17.0.0",
     "react-test-renderer": "^16.7.0",
@@ -80,4 +75,4 @@ "rimraf": "^3.0.0"
   "peerDependencies": {
-    "react": ">=16.3",
-    "react-dom": ">=16.3"
+    "react": "^16.3.0 || ^17.0.0-0",
+    "react-dom": "^16.3.0 || ^17.0.0-0"
   },
@@ -93,3 +88,4 @@ "files": [
     "url": "https://github.com/wojtekmaj/react-time-picker.git"
-  }
-}
+  },
+  "funding": "https://github.com/wojtekmaj/react-time-picker?sponsor=1"
+}

README.md

@@ -1,2 +0,2 @@
-[![npm](https://img.shields.io/npm/v/react-time-picker.svg)](https://www.npmjs.com/package/react-time-picker) ![downloads](https://img.shields.io/npm/dt/react-time-picker.svg) ![build](https://img.shields.io/travis/wojtekmaj/react-time-picker/master.svg) ![dependencies](https://img.shields.io/david/wojtekmaj/react-time-picker.svg
+[![npm](https://img.shields.io/npm/v/react-time-picker.svg)](https://www.npmjs.com/package/react-time-picker) ![downloads](https://img.shields.io/npm/dt/react-time-picker.svg) [![CI](https://github.com/wojtekmaj/react-time-picker/workflows/CI/badge.svg)](https://github.com/wojtekmaj/react-time-picker/actions) ![dependencies](https://img.shields.io/david/wojtekmaj/react-time-picker.svg
 ) ![dev dependencies](https://img.shields.io/david/dev/wojtekmaj/react-time-picker.svg
@@ -19,3 +19,3 @@ ) [![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://github.com/facebook/jest)
 
-Minimal demo page is included in sample directory.
+A minimal demo page can be found in `sample` directory.
 
@@ -32,8 +32,8 @@ [Online demo](http://projects.wojtekmaj.pl/react-time-picker/) is also available!
 
-Your project needs to use React 16 or later. If you use older version of React, please refer to the table below to find suitable React-Time-Picker version.
+Your project needs to use React 16.3 or later. If you use an older version of React, please refer to the table below to find a suitable React-Time-Picker version.
 
-|React version|Newest available React-Time-Picker|
-|----|----|
-|>16.0|latest|
-|>15.0|2.1.1|
+| React version | Newest compatible React-Time-Picker version |
+|-------|--------|
+| ≥16.3 | latest |
+| ≥16.0 | 3.x    |
 
@@ -53,22 +53,16 @@ #### Legacy browsers
 ```js
-import React, { Component } from 'react';
+import React, { useState } from 'react';
 import TimePicker from 'react-time-picker';
 
-class MyApp extends Component {
-  state = {
-    time: '10:00',
-  }
+function MyApp() {
+  const [value, onChange] = useState('10:00');
 
-  onChange = time => this.setState({ time })
-
-  render() {
-    return (
-      <div>
-        <TimePicker
-          onChange={this.onChange}
-          value={this.state.time}
-        />
-      </div>
-    );
-  }
+  return (
+    <div>
+      <TimePicker
+        onChange={onChange}
+        value={value}
+      />
+    </div>
+  );
 }
@@ -79,4 +73,6 @@ ```
 
-If you don't want to use default React-Time-Picker styling to build upon it, you can import React-Time-Picker by using `import TimePicker from 'react-time-picker/dist/entry.nostyle';` instead.
+If you don't want to use default React-Time-Picker and React-Clock styles, you can import React-Time-Picker without them by using `import TimePicker from 'react-time-picker/dist/entry.nostyle';` instead.
 
+Styles loaded by the default entry file are `react-time-picker/dist/TimePicker.css` and `react-clock/dist/Clock.css`. You can copy them to your project to build your own upon them.
+
 ## User guide
@@ -83,0 +79,0 @@

src/shared/dates.spec.js

@@ -33,4 +33,7 @@ import {
     ${11}  | ${'pm'} | ${23}
-  `('returns $hour24 for $hour12 $amPm',
-  ({ hour12, amPm, hour24 }) => {
+  `('returns $hour24 for $hour12 $amPm', ({
+    hour12,
+    amPm,
+    hour24,
+  }) => {
     expect(convert12to24(hour12, amPm)).toBe(hour24);
@@ -67,6 +70,9 @@ });
     ${23}  | ${11}  | ${'pm'}
-  `('returns $hour12 $amPm for $hour24',
-  ({ hour12, amPm, hour24 }) => {
+  `('returns $hour12 $amPm for $hour24', ({
+    hour24,
+    hour12,
+    amPm,
+  }) => {
     expect(convert24to12(hour24)).toEqual([hour12, amPm]);
   });
 });

src/shared/utils.js

 import { getFormatter } from './dateFormatter';
 
-/**
- * Calls a function, if it's defined, with specified arguments
- * @param {Function} fn
- * @param {Object} args
- */
-export const callIfDefined = (fn, ...args) => {
-  if (fn && typeof fn === 'function') {
-    fn(...args);
-  }
-};
-
 const nines = ['9', '٩'];
@@ -28,7 +17,7 @@ const ninesRegExp = new RegExp(`[${nines.join('')}]`);
     if (am1 !== pm1) {
-      return [am1, pm1].map(el => el.trim());
+      return [am1, pm1].map((el) => el.trim());
     }
 
     if (am2 !== pm2) {
-      return [am2, pm2].map(el => el.trim());
+      return [am2, pm2].map((el) => el.trim());
     }
@@ -35,0 +24,0 @@ }

src/shared/utils.spec.js

 import {
-  callIfDefined,
   safeMin,
@@ -7,14 +6,2 @@ safeMax,
 
-describe('callIfDefined', () => {
-  it('calls given function if defined', () => {
-    const fn = jest.fn();
-    const arg1 = 'hi';
-    const arg2 = 'hello';
-
-    callIfDefined(fn, arg1, arg2);
-
-    expect(fn).toHaveBeenCalledWith(arg1, arg2);
-  });
-});
-
 describe('safeMin', () => {
@@ -21,0 +8,0 @@ it('returns Infinity given no values', () => {

src/TimeInput.jsx

@@ -55,3 +55,3 @@ import React, { PureComponent } from 'react';
   const pattern = new RegExp(
-    Object.keys(elementFunctions).map(el => `${el}+`).join('|'), 'g',
+    Object.keys(elementFunctions).map((el) => `${el}+`).join('|'), 'g',
   );
@@ -76,3 +76,3 @@ const matches = placeholder.match(pattern);
             Object.keys(elementFunctions)
-              .find(elementFunction => currentMatch.match(elementFunction))
+              .find((elementFunction) => currentMatch.match(elementFunction))
           ]
@@ -300,3 +300,3 @@ );
         this.setState(
-          prevState => ({
+          (prevState) => ({
             hour: value ? convert12to24(parseInt(value, 10), prevState.amPm) : null,
@@ -381,6 +381,6 @@ }),
 
-    if (formElementsWithoutSelect.every(formElement => !formElement.value)) {
+    if (formElementsWithoutSelect.every((formElement) => !formElement.value)) {
       onChange(null, false);
     } else if (
-      formElements.every(formElement => formElement.value && formElement.validity.valid)
+      formElements.every((formElement) => formElement.value && formElement.validity.valid)
     ) {
@@ -391,3 +391,3 @@ const hour = parseInt(values.hour24 || convert12to24(values.hour12, values.amPm) || 0, 10);
 
-      const padStart = num => `0${num}`.slice(-2);
+      const padStart = (num) => `0${num}`.slice(-2);
       const proposedValue = `${padStart(hour)}:${padStart(minute)}:${padStart(second)}`;
@@ -394,0 +394,0 @@ const processedValue = this.getProcessedValue(proposedValue);

src/TimeInput.spec.jsx

@@ -32,3 +32,3 @@ import React from 'react';
 
-const getKey = key => ({
+const getKey = (key) => ({
   keyCode: keyCodes[key],
@@ -63,3 +63,3 @@ which: keyCodes[key],
     const nativeInput = component.find('input[type="time"]');
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -78,3 +78,3 @@ expect(nativeInput).toHaveLength(1);
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const secondInput = customInputs.find('input[name="second"]');
@@ -98,3 +98,3 @@ const minuteInput = customInputs.find('input[name="minute"]');
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const secondInput = customInputs.find('input[name="second"]');
@@ -122,3 +122,3 @@ const minuteInput = customInputs.find('input[name="minute"]');
     const nativeInput = component.find('input[type="time"]');
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -144,3 +144,3 @@ expect(nativeInput.prop('value')).toBe(date);
     const nativeInput = component.find('input[type="time"]');
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -163,3 +163,3 @@ expect(nativeInput.prop('value')).toBe(date);
     const nativeInput = component.find('input[type="time"]');
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -186,3 +186,3 @@ expect(nativeInput.prop('value')).toBeFalsy();
     const nativeInput = component.find('input[type="time"]');
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -203,3 +203,3 @@ expect(nativeInput.prop('value')).toBeFalsy();
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -220,3 +220,3 @@ expect(customInputs.at(0).prop('name')).toBe('hour12');
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -277,3 +277,3 @@ expect(customInputs.at(0).prop('name')).toBe('hour24');
       const componentInput = component.find('Hour12Input');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -293,3 +293,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('Hour12Input');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -325,3 +325,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('Hour24Input');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -341,3 +341,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('Hour24Input');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -373,3 +373,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('MinuteInput');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -389,3 +389,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('MinuteInput');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -421,3 +421,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('SecondInput');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -437,3 +437,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('SecondInput');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -469,3 +469,3 @@ expect(componentInput).toHaveLength(1);
       const componentInput = component.find('AmPm');
-      const customInputs = component.find('input[type="number"]');
+      const customInputs = component.find('input[data-input]');
 
@@ -499,3 +499,3 @@ expect(componentInput).toHaveLength(1);
     const separators = component.find('.react-time-picker__inputGroup__divider');
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const ampm = component.find('select');
@@ -515,3 +515,3 @@
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -538,3 +538,3 @@ const minuteInput = customInputs.at(1);
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -583,3 +583,3 @@ const minuteInput = customInputs.at(1);
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -606,3 +606,3 @@ const minuteInput = customInputs.at(1);
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -625,3 +625,3 @@
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -644,3 +644,3 @@ const minuteInput = customInputs.at(1);
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -663,3 +663,3 @@ const minuteInput = customInputs.at(1);
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -688,3 +688,3 @@
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -711,3 +711,3 @@ customInputs.at(0).getDOMNode().value = '20';
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
 
@@ -714,0 +714,0 @@ customInputs.forEach((customInput) => {

src/TimeInput/Input.jsx

@@ -8,6 +8,12 @@ import React from 'react';
 
+const isEdgeLegacy = navigator.userAgent.match(/ Edge\/1/);
+
 function onFocus(event) {
   const { target } = event;
 
-  requestAnimationFrame(() => target.select());
+  if (isEdgeLegacy) {
+    requestAnimationFrame(() => target.select());
+  } else {
+    target.select();
+  }
 }
@@ -47,10 +53,11 @@
 
-const numberRegExp = /[0-9]/;
-
 function makeOnKeyPress(maxLength) {
   return function onKeyPress(event) {
+    const { key, target: input } = event;
+    const { value } = input;
+
+    const isNumberKey = !isNaN(parseInt(key, 10));
     const selection = getSelectionString();
-    const { value } = event.target;
 
-    if (numberRegExp.test(event.key) && (selection || value.length < maxLength)) {
+    if (isNumberKey && (selection || value.length < maxLength)) {
       return;
@@ -97,3 +104,5 @@ }
       )}
+      data-input="true"
       disabled={disabled}
+      inputMode="numeric"
       max={max}
@@ -134,2 +143,3 @@ min={min}
   ariaLabel: PropTypes.string,
+  autoFocus: PropTypes.bool,
   className: PropTypes.string.isRequired,
@@ -140,4 +150,8 @@ disabled: PropTypes.bool,
   min: PropTypes.number,
+  name: PropTypes.string,
+  nameForClass: PropTypes.string,
   onChange: PropTypes.func,
   onKeyDown: PropTypes.func,
+  onKeyUp: PropTypes.func,
+  placeholder: PropTypes.string,
   required: PropTypes.bool,
@@ -144,0 +158,0 @@ showLeadingZeros: PropTypes.bool,

src/TimeInput/NativeInput.jsx

@@ -25,3 +25,3 @@ import React from 'react';
       case 'hour':
-        return receivedValue => `${getHours(receivedValue)}:00`;
+        return (receivedValue) => `${getHours(receivedValue)}:00`;
       case 'minute':
@@ -67,4 +67,3 @@ return getHoursMinutes;
         position: 'absolute',
-        top: '-9999px',
-        left: '-9999px',
+        zIndex: '-999',
       }}
@@ -71,0 +70,0 @@ type="time"

src/TimeInput/NativeInput.spec.jsx

@@ -54,3 +54,2 @@ import React from 'react';
 
-  /* eslint-disable indent */
   it.each`
@@ -61,4 +60,6 @@ valueType   | parsedValue
     ${'hour'}   | ${'22:00'}
-  `('displays given value properly if valueType is $valueType',
-  ({ valueType, parsedValue }) => {
+  `('displays given value properly if valueType is $valueType', ({
+    valueType,
+    parsedValue
+  }) => {
     const value = '22:17:41';
@@ -141,4 +142,6 @@
     ${'hour'}   | ${'22:00'}
-  `('has proper min for minTime which is a full hour if valueType is $valueType',
-  ({ valueType, parsedMin }) => {
+  `('has proper min for minTime which is a full hour if valueType is $valueType', ({
+    valueType,
+    parsedMin,
+  }) => {
     const component = shallow(
@@ -162,4 +165,6 @@ <NativeInput
     ${'hour'}   | ${'22:00'}
-  `('has proper min for minTime which is not a full hour if valueType is $valueType',
-  ({ valueType, parsedMin }) => {
+  `('has proper min for minTime which is not a full hour if valueType is $valueType', ({
+    valueType,
+    parsedMin,
+  }) => {
     const component = shallow(
@@ -193,4 +198,6 @@ <NativeInput
     ${'hour'}   | ${'22:00'}
-  `('has proper max for maxTime which is a full hour if valueType is $valueType',
-  ({ valueType, parsedMax }) => {
+  `('has proper max for maxTime which is a full hour if valueType is $valueType', ({
+    valueType,
+    parsedMax,
+  }) => {
     const component = shallow(
@@ -214,4 +221,6 @@ <NativeInput
     ${'hour'}   | ${'22:00'}
-  `('has proper max for maxTime which is not a full hour if valueType is $valueType',
-  ({ valueType, parsedMax }) => {
+  `('has proper max for maxTime which is not a full hour if valueType is $valueType', ({
+    valueType,
+    parsedMax,
+  }) => {
     const component = shallow(
@@ -218,0 +227,0 @@ <NativeInput

src/TimePicker.jsx

@@ -7,3 +7,3 @@ import React, { PureComponent } from 'react';
 
-import Clock from 'react-clock/dist/entry.nostyle';
+import Clock from 'react-clock';
 
@@ -13,3 +13,2 @@ import TimeInput from './TimeInput';
 import { isTime } from './shared/propTypes';
-import { callIfDefined } from './shared/utils';
 
@@ -44,3 +43,4 @@ const allViews = ['hour', 'minute', 'second'];
       this.handleOutsideActionListeners();
-      callIfDefined(isOpen ? onClockOpen : onClockClose);
+      const callback = isOpen ? onClockOpen : onClockClose;
+      if (callback) callback();
     }
@@ -106,6 +106,6 @@ }
   toggleClock = () => {
-    this.setState(prevState => ({ isOpen: !prevState.isOpen }));
+    this.setState((prevState) => ({ isOpen: !prevState.isOpen }));
   }
 
-  stopPropagation = event => event.stopPropagation();
+  stopPropagation = (event) => event.stopPropagation();
 
@@ -119,3 +119,3 @@ clear = () => this.onChange(null);
     const fnName = shouldListenWithFallback ? 'addEventListener' : 'removeEventListener';
-    outsideActionEvents.forEach(eventName => document[fnName](eventName, this.onOutsideAction));
+    outsideActionEvents.forEach((eventName) => document[fnName](eventName, this.onOutsideAction));
   }
@@ -122,0 +122,0 @@

src/TimePicker.spec.jsx

@@ -327,3 +327,3 @@ import React from 'react';
 
-    const customInputs = component.find('input[type="number"]');
+    const customInputs = component.find('input[data-input]');
     const hourInput = customInputs.at(0);
@@ -330,0 +330,0 @@ const minuteInput = customInputs.at(1);

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

203295

increased by2.57%

Dev dependency count

16

decreased by-23.81%

Lines of code

5228

increased by0.58%

Worsened metrics

Number of lines in readme file

137

decreased by-2.84%

Dependency changes

• + Addedreact@17.0.2(transitive)

• + Addedreact-clock@3.1.0(transitive)

• + Addedreact-dom@17.0.2(transitive)

• + Addedscheduler@0.20.2(transitive)

• - Removedreact@18.3.1(transitive)

• - Removedreact-clock@2.4.0(transitive)

• - Removedreact-dom@18.3.1(transitive)

• - Removedscheduler@0.23.2(transitive)

• Updatedreact-clock@^3.0.0