bright-components 9.32.0 → 10.1.0

package/dist/components/Time/TimePicker/TimeOverlay/index.js

@@ -35,135 +35,93 @@ var _UnitInput = _interopRequireDefault(require("./UnitInput"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function _templateObject7() {
-  var data = _taggedTemplateLiteralLoose(["\n\tfont-size: 12px;\n\tmargin: -6px 0 0 0;\n"]);
-
-  _templateObject7 = function _templateObject7() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject6() {
-  var data = _taggedTemplateLiteralLoose(["\n\tfont-family: ", ";\n\tfont-size: 16px;\n\tline-height: 22px;\n"]);
-
-  _templateObject6 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5() {
-  var data = _taggedTemplateLiteralLoose(["\n\tdisplay: block;\n\tflex: 1 0 100%;\n\tmargin: 0;\n\tpadding: 0;\n\ttext-align: center;\n"]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n\tflex: 1;\n\tdisplay: flex;\n\talign-content: center;\n\tflex-wrap: wrap;\n"]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tborder-top: 1px solid #0a223333;\n\tmargin: 0;\n\tpadding: ", ";\n\tjustify-content: space-between;\n\tflex-wrap: no-wrap;\n\tflex: 1 1 33%;\n"]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tflex-direction: row;\n\tbackground-color: white;\n\talign-items: center;\n\tjustify-content: center;\n\tpadding: ", " ", " ", " ", ";\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n\tposition: absolute;\n\ttop: 50px;\n\theight: 322px;\n\tz-index: ", ";\n\twidth: 320px;\n\tbox-shadow: ", ";\n\tborder: 2px solid ", ";\n\tborder-radius: ", ";\n\tbackground-color: #fafdff;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-var Overlay = _styledComponents.default.div(_templateObject(), _zIndex.default.OVERLAY, _vars.default.boxShadow, _colors.default.borderFocus, _vars.default.borderRadius);
-
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const Overlay = _styledComponents.default.div`
+	position: absolute;
+	top: 50px;
+	height: 322px;
+	z-index: ${_zIndex.default.OVERLAY};
+	width: 320px;
+	box-shadow: ${_vars.default.boxShadow};
+	border: 2px solid ${_colors.default.borderFocus};
+	border-radius: ${_vars.default.borderRadius};
+	background-color: #fafdff;
+`;
 Overlay.displayName = 'Overlay';
-
-var Content = _styledComponents.default.div(_templateObject2(), _spacing.default.s1, _spacing.default.s2, _spacing.default.s2, _spacing.default.s2);
-
+const Content = _styledComponents.default.div`
+	display: flex;
+	flex-direction: row;
+	background-color: white;
+	align-items: center;
+	justify-content: center;
+	padding: ${_spacing.default.s1} ${_spacing.default.s2} ${_spacing.default.s2} ${_spacing.default.s2};
+`;
 Content.displayName = 'Content';
-
-var DialogButtonGroup = _styledComponents.default.div(_templateObject3(), _spacing.default.s1);
-
+const DialogButtonGroup = _styledComponents.default.div`
+	display: flex;
+	border-top: 1px solid #0a223333;
+	margin: 0;
+	padding: ${_spacing.default.s1};
+	justify-content: space-between;
+	flex-wrap: no-wrap;
+	flex: 1 1 33%;
+`;
 DialogButtonGroup.displayName = 'DialogButtonGroup';
-
-var DisplayValue = _styledComponents.default.div(_templateObject4());
-
+const DisplayValue = _styledComponents.default.div`
+	flex: 1;
+	display: flex;
+	align-content: center;
+	flex-wrap: wrap;
+`;
 DisplayValue.displayName = 'DisplayValue';
-
-var TimeValue = _styledComponents.default.span(_templateObject5());
-
+const TimeValue = _styledComponents.default.span`
+	display: block;
+	flex: 1 0 100%;
+	margin: 0;
+	padding: 0;
+	text-align: center;
+`;
 TimeValue.displayName = 'TimeValue';
-var TwentyFourHourValue = (0, _styledComponents.default)(TimeValue)(_templateObject6(), _vars.default.fontStackBold);
+const TwentyFourHourValue = (0, _styledComponents.default)(TimeValue)`
+	font-family: ${_vars.default.fontStackBold};
+	font-size: 16px;
+	line-height: 22px;
+`;
 TwentyFourHourValue.displayName = 'TwentyFourHourValue';
-var TwelveHourValue = (0, _styledComponents.default)(TimeValue)(_templateObject7());
+const TwelveHourValue = (0, _styledComponents.default)(TimeValue)`
+	font-size: 12px;
+	margin: -6px 0 0 0;
+`;
 TwelveHourValue.displayName = 'TwelveHourValue';
 
-var formatTimePart = function formatTimePart(v) {
-  return v.toString().padStart(2, '0');
-};
+const formatTimePart = v => v.toString().padStart(2, '0');
 
-var convertHours = function convertHours(hour) {
+const convertHours = hour => {
   if (hour === 0) return 12;
   return hour > 12 ? hour - 12 : hour;
 };
 
-var TimeOverlay = (0, _react.forwardRef)(function (_ref, ref) {
-  var value = _ref.value,
-      onChange = _ref.onChange,
-      onHide = _ref.onHide,
-      hourIncrements = _ref.hourIncrements,
-      minuteIncrements = _ref.minuteIncrements,
-      min = _ref.min,
-      max = _ref.max,
-      GA = _ref.GA;
-
-  var sanitizeValue = function sanitizeValue(unsanitizedValue) {
-    return (0, _getBoundedValue.default)(unsanitizedValue, (0, _durationToMilliseconds.default)(min), (0, _durationToMilliseconds.default)(max));
-  };
+const TimeOverlay = (0, _react.forwardRef)((_ref, ref) => {
+  let {
+    value,
+    onChange,
+    onHide,
+    hourIncrements,
+    minuteIncrements,
+    min,
+    max,
+    GA
+  } = _ref;
+
+  const sanitizeValue = unsanitizedValue => (0, _getBoundedValue.default)(unsanitizedValue, (0, _durationToMilliseconds.default)(min), (0, _durationToMilliseconds.default)(max));
 
-  var _useState = (0, _react.useState)(sanitizeValue((0, _durationToMilliseconds.default)(value))),
-      internalValue = _useState[0],
-      setInternalValue = _useState[1];
+  const [internalValue, setInternalValue] = (0, _react.useState)(sanitizeValue((0, _durationToMilliseconds.default)(value)));
 
-  var setHandler = function setHandler(unitValue, unit) {
-    var proposedDate = new Date(internalValue);
+  const setHandler = (unitValue, unit) => {
+    const proposedDate = new Date(internalValue);
 
     if (unit === 'minutes') {
       proposedDate.setUTCMinutes((0, _roundTo.default)(minuteIncrements)((0, _getBoundedValue.default)(unitValue, 0, 59)));
@@ -173,67 +131,63 @@ var TimeOverlay = (0, _react.forwardRef)(function (_ref, ref) {
       proposedDate.setUTCHours((0, _roundTo.default)(hourIncrements)((0, _getBoundedValue.default)(unitValue, 0, 23)));
     }
 
-    var appliedValue = sanitizeValue(proposedDate.getTime());
+    const appliedValue = sanitizeValue(proposedDate.getTime());
     setInternalValue(appliedValue);
   };
 
-  var _millisecondsToDurati = (0, _millisecondsToDuration.default)(internalValue),
-      hours = _millisecondsToDurati.hours,
-      minutes = _millisecondsToDurati.minutes;
-
+  const {
+    hours,
+    minutes
+  } = (0, _millisecondsToDuration.default)(internalValue);
   return _react.default.createElement(Overlay, {
     ref: ref
   }, _react.default.createElement(Content, null, _react.default.createElement(_UnitInput.default, {
     unit: "hours",
     value: hours,
-    onChange: function onChange(i) {
-      return setHandler(i, 'hours');
-    },
+    onChange: i => setHandler(i, 'hours'),
     increment: hourIncrements,
     min: min.hours,
     max: max.hours
   }), _react.default.createElement(_UnitInput.default, {
     unit: "minutes",
     value: minutes,
-    onChange: function onChange(i) {
-      return setHandler(i, 'minutes');
-    },
+    onChange: i => setHandler(i, 'minutes'),
     increment: minuteIncrements,
     min: hours === min.hours ? min.minutes : 0,
     max: hours === max.hours ? max.minutes : 59
   })), _react.default.createElement(DialogButtonGroup, null, _react.default.createElement(_OutlineButton.default, {
     type: "button",
-    onClick: function onClick() {
+    onClick: () => {
       onHide();
 
       if (GA) {
         (0, _reactGa.event)({
           category: GA.category,
-          action: GA.action + " (Cancel)"
+          action: `${GA.action} (Cancel)`
         });
       }
     }
   }, "Cancel"), _react.default.createElement(DisplayValue, null, _react.default.createElement(TwentyFourHourValue, null, formatTimePart(hours), ":", formatTimePart(minutes)), _react.default.createElement(TwelveHourValue, null, convertHours(hours), ".", formatTimePart(minutes), hours > 11 ? 'pm' : 'am', ' ')), _react.default.createElement(_BrandButton.default, {
     type: "button",
-    onClick: function onClick() {
+    onClick: () => {
       onChange({
-        hours: hours,
-        minutes: minutes
+        hours,
+        minutes
       });
       onHide();
 
       if (GA) {
         (0, _reactGa.event)({
           category: GA.category,
-          action: GA.action + " (Apply)",
-          label: hours + " hrs " + minutes + " mins"
+          action: `${GA.action} (Apply)`,
+          label: `${hours} hrs ${minutes} mins`
         });
       }
     },
     "data-e2e": "time-apply"
   }, "Apply")));
 });
-var timeShape = (0, _propTypes.shape)({
+const timeShape = (0, _propTypes.shape)({
   hours: _propTypes.number,
   minutes: _propTypes.number
 });

package/dist/components/Time/TimePicker/index.js

@@ -35,106 +35,91 @@ var _TimeOverlay = _interopRequireDefault(require("./TimeOverlay"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n\t-webkit-appearance: none;\n\tbackground-color: white;\n\theight: 2.75rem;\n\tline-height: 2.75rem;\n\tpadding: 0 16px;\n\n\t@media (min-width: ", ") {\n\t\tdisplay: none;\n\t}\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n\tdisplay: none;\n\tposition: relative;\n\n\t@media (min-width: ", ") {\n\t\tdisplay: block;\n\t}\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 
-  return data;
-}
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-var Container = _styledComponents.default.div(_templateObject(), _breakpoints.default.tablet);
+const Container = _styledComponents.default.div`
+	display: none;
+	position: relative;
 
+	@media (min-width: ${_breakpoints.default.tablet}) {
+		display: block;
+	}
+`;
 Container.displayName = 'Container';
-var MobileTimePicker = (0, _styledComponents.default)(_InputBox.default)(_templateObject2(), _breakpoints.default.tablet);
+const MobileTimePicker = (0, _styledComponents.default)(_InputBox.default)`
+	-webkit-appearance: none;
+	background-color: white;
+	height: 2.75rem;
+	line-height: 2.75rem;
+	padding: 0 16px;
+
+	@media (min-width: ${_breakpoints.default.tablet}) {
+		display: none;
+	}
+`;
 MobileTimePicker.displayName = 'MobileTimePicker';
 
-var formatTimePart = function formatTimePart(v) {
-  return v.toString().padStart(2, '0');
-};
-
-var TimePicker = function TimePicker(_ref) {
-  var _onChange = _ref.onChange,
-      _onFocus = _ref.onFocus,
-      _onBlur = _ref.onBlur,
-      value = _ref.value,
-      minuteIncrements = _ref.minuteIncrements,
-      hourIncrements = _ref.hourIncrements,
-      min = _ref.min,
-      max = _ref.max,
-      GA = _ref.GA,
-      rest = _objectWithoutPropertiesLoose(_ref, ["onChange", "onFocus", "onBlur", "value", "minuteIncrements", "hourIncrements", "min", "max", "GA"]);
-
-  var _useState = (0, _react.useState)(false),
-      pickerVisible = _useState[0],
-      setPickerVisible = _useState[1];
-
-  var _useState2 = (0, _react.useState)(false),
-      hasFocus = _useState2[0],
-      setFocus = _useState2[1];
-
-  var nodeRef = (0, _useClickOutside.default)(function () {
-    return setPickerVisible(false);
-  });
-  var myRef = (0, _react.useRef)();
-
-  var _useState3 = (0, _react.useState)((0, _durationToTimeString.default)(value)),
-      internalValue = _useState3[0],
-      setInternalValue = _useState3[1];
-
-  (0, _react.useEffect)(function () {
+const formatTimePart = v => v.toString().padStart(2, '0');
+
+const TimePicker = _ref => {
+  let {
+    onChange,
+    onFocus,
+    onBlur,
+    value,
+    minuteIncrements,
+    hourIncrements,
+    min,
+    max,
+    GA
+  } = _ref,
+      rest = _objectWithoutProperties(_ref, ["onChange", "onFocus", "onBlur", "value", "minuteIncrements", "hourIncrements", "min", "max", "GA"]);
+
+  const [pickerVisible, setPickerVisible] = (0, _react.useState)(false);
+  const [hasFocus, setFocus] = (0, _react.useState)(false);
+  const nodeRef = (0, _useClickOutside.default)(() => setPickerVisible(false));
+  const myRef = (0, _react.useRef)();
+  const [internalValue, setInternalValue] = (0, _react.useState)((0, _durationToTimeString.default)(value));
+  (0, _react.useEffect)(() => {
     // keep internal value in sync with prop change
     setInternalValue((0, _durationToTimeString.default)(value));
   }, [value]);
-  (0, _react.useEffect)(function () {
+  (0, _react.useEffect)(() => {
     if (myRef.current) myRef.current.scrollIntoView({
       behavior: 'smooth',
       block: 'nearest'
     });
   }, [pickerVisible]);
 
-  var changeHandler = function changeHandler(_ref2) {
-    var newHours = _ref2.hours,
-        newMinutes = _ref2.minutes;
-    var proposedDate = new Date((0, _durationToMilliseconds.default)(value || {
+  const changeHandler = _ref2 => {
+    let {
+      hours: newHours,
+      minutes: newMinutes
+    } = _ref2;
+    const proposedDate = new Date((0, _durationToMilliseconds.default)(value || {
       hours: 0,
       minutes: 0
     }));
     proposedDate.setUTCHours((0, _roundTo.default)(hourIncrements)((0, _getBoundedValue.default)(newHours, 0, 23)));
     proposedDate.setUTCMinutes((0, _roundTo.default)(minuteIncrements)((0, _getBoundedValue.default)(newMinutes, 0, 59)));
-    var appliedValue = proposedDate.getTime();
-    var boundedValue = (0, _getBoundedValue.default)(appliedValue, (0, _durationToMilliseconds.default)(min), (0, _durationToMilliseconds.default)(max));
-
-    _onChange((0, _millisecondsToDuration.default)(boundedValue));
+    const appliedValue = proposedDate.getTime();
+    const boundedValue = (0, _getBoundedValue.default)(appliedValue, (0, _durationToMilliseconds.default)(min), (0, _durationToMilliseconds.default)(max));
+    onChange((0, _millisecondsToDuration.default)(boundedValue));
   };
 
-  var blurHandler = function blurHandler() {
+  const blurHandler = () => {
     // tries to apply current value, or the nearest valid number, even if it's incomplete
     if (internalValue.includes(':')) {
-      var timeParts = internalValue.split(':');
-      var latestValue = {
+      const timeParts = internalValue.split(':');
+      const latestValue = {
         hours: parseInt(timeParts[0], 10),
         minutes: parseInt(timeParts[1], 10)
       };
@@ -145,22 +130,22 @@ var TimePicker = function TimePicker(_ref) {
     }
   };
 
-  var valueAsString = (0, _durationToTimeString.default)(value);
+  const valueAsString = (0, _durationToTimeString.default)(value);
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(MobileTimePicker, {
     type: "time",
-    onChange: function onChange(e) {
-      var timeString = e.target.value;
+    onChange: e => {
+      const timeString = e.target.value;
 
       if (timeString.length === 5) {
-        var timeParts = e.target.value.split(':');
+        const timeParts = e.target.value.split(':');
         changeHandler({
           hours: parseInt(timeParts[0], 10),
           minutes: parseInt(timeParts[1], 10)
         });
       }
     },
-    min: formatTimePart(min.hours) + ":" + formatTimePart(min.minutes),
-    max: formatTimePart(max.hours) + ":" + formatTimePart(max.minutes),
+    min: `${formatTimePart(min.hours)}:${formatTimePart(min.minutes)}`,
+    max: `${formatTimePart(max.hours)}:${formatTimePart(max.minutes)}`,
     step: 60 * minuteIncrements,
     value: valueAsString
   }), _react.default.createElement(Container, {
@@ -170,27 +155,25 @@ var TimePicker = function TimePicker(_ref) {
     suffix: {
       icon: _Clock.default,
       color: _colors.default.primary,
-      onClick: function onClick() {
-        return setPickerVisible(!pickerVisible);
-      }
+      onClick: () => setPickerVisible(!pickerVisible)
     },
-    onChange: function onChange(e) {
-      var timeString = e.target.value;
+    onChange: e => {
+      const timeString = e.target.value;
       setInternalValue(timeString);
 
       if (!timeString.length) {
-        _onChange(null);
+        onChange(null);
       }
 
       if (timeString.length === 5) {
-        var timeParts = e.target.value.split(':');
+        const timeParts = e.target.value.split(':');
         changeHandler({
           hours: parseInt(timeParts[0], 10),
           minutes: parseInt(timeParts[1], 10)
         });
       }
     },
-    onFocus: function onFocus(e) {
+    onFocus: e => {
       // reset internal value
       if (internalValue !== (0, _durationToTimeString.default)(value)) {
         setInternalValue((0, _durationToTimeString.default)(value));
@@ -198,16 +181,16 @@ var TimePicker = function TimePicker(_ref) {
 
       setFocus(true);
 
-      if (_onFocus) {
-        _onFocus(e);
+      if (onFocus) {
+        onFocus(e);
       }
     },
-    onBlur: function onBlur(e) {
+    onBlur: e => {
       blurHandler();
       setFocus(false);
 
-      if (_onBlur) {
-        _onBlur(e);
+      if (onBlur) {
+        onBlur(e);
       }
     },
     value: hasFocus ? internalValue : valueAsString
@@ -217,9 +200,7 @@ var TimePicker = function TimePicker(_ref) {
       minutes: 0
     },
     onChange: changeHandler,
-    onHide: function onHide() {
-      return setPickerVisible(false);
-    },
+    onHide: () => setPickerVisible(false),
     hourIncrements: hourIncrements,
     minuteIncrements: minuteIncrements,
     min: min,
@@ -228,7 +209,7 @@ var TimePicker = function TimePicker(_ref) {
   })));
 };
 
-var duration = (0, _propTypes.shape)({
+const duration = (0, _propTypes.shape)({
   hours: _propTypes.number,
   minutes: _propTypes.number
 });

package/dist/components/TimeInput/index.js

@@ -11,7 +11,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-var TimeInput = function TimeInput(props) {
+const TimeInput = props => {
   return _react.default.createElement(_InputBox.default, _extends({
     width: "100px",
     mask: [/[0-2]/, /\d/, ':', /[0-5]/, /\d/]