bright-components 9.32.0 → 10.1.0

package/dist/components/Time/DurationPicker/DurationOverlay/index.js

@@ -19,59 +19,57 @@ var _OverlayBase = _interopRequireDefault(require("../../OverlayBase"));
 
 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 ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 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 DurationOverlay = (0, _react.forwardRef)(function (_ref, ref) {
-  var value = _ref.value,
-      onHide = _ref.onHide,
-      onChange = _ref.onChange,
-      min = _ref.min,
-      max = _ref.max,
-      hourIncrements = _ref.hourIncrements,
-      minuteIncrements = _ref.minuteIncrements,
-      GA = _ref.GA;
-
-  var sanitizeValue = function sanitizeValue(unsanitizedValue) {
-    return (0, _getBoundedValue.default)(unsanitizedValue, min ? (0, _durationToMilliseconds.default)(min) : 0, max && (0, _durationToMilliseconds.default)(max));
-  };
+const DurationOverlay = (0, _react.forwardRef)((_ref, ref) => {
+  let {
+    value,
+    onHide,
+    onChange,
+    min,
+    max,
+    hourIncrements,
+    minuteIncrements,
+    GA
+  } = _ref;
+
+  const sanitizeValue = unsanitizedValue => (0, _getBoundedValue.default)(unsanitizedValue, min ? (0, _durationToMilliseconds.default)(min) : 0, max && (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, shouldApply) {
-    var currentValue = new _Duration.default(internalValue);
+  const setHandler = (unitValue, unit, shouldApply) => {
+    const currentValue = new _Duration.default(internalValue);
 
-    var proposedDuration = _objectSpread({}, currentValue.getDuration());
+    const proposedDuration = _objectSpread({}, currentValue.getDuration());
 
     proposedDuration[unit] = unit === 'minutes' ? (0, _roundTo.default)(minuteIncrements)((0, _getBoundedValue.default)(unitValue, 0, 59)) : (0, _roundTo.default)(hourIncrements)(unitValue);
-    var proposedValue = (0, _durationToMilliseconds.default)(proposedDuration);
-    var appliedValue = sanitizeValue(proposedValue);
+    const proposedValue = (0, _durationToMilliseconds.default)(proposedDuration);
+    const appliedValue = sanitizeValue(proposedValue);
     setInternalValue(appliedValue);
 
     if (shouldApply) {
-      var _getDuration = new _Duration.default(appliedValue).getDuration(),
-          _hours = _getDuration.hours,
-          _minutes = _getDuration.minutes;
-
+      const {
+        hours,
+        minutes
+      } = new _Duration.default(appliedValue).getDuration();
       onChange({
-        hours: _hours,
-        minutes: _minutes
+        hours,
+        minutes
       });
       onHide();
     }
   };
 
-  var incrementHandler = function incrementHandler(increment, unit) {
-    var proposedDuration = new _Duration.default(internalValue); // eslint-disable-next-line default-case
+  const incrementHandler = (increment, unit) => {
+    const proposedDuration = new _Duration.default(internalValue); // eslint-disable-next-line default-case
 
     switch (unit) {
       case 'hours':
@@ -83,20 +81,20 @@ var DurationOverlay = (0, _react.forwardRef)(function (_ref, ref) {
         break;
     }
 
-    var appliedValue = sanitizeValue(proposedDuration.milliseconds);
+    const appliedValue = sanitizeValue(proposedDuration.milliseconds);
     setInternalValue(appliedValue);
   };
 
-  var _getDuration2 = new _Duration.default(internalValue).getDuration(),
-      hours = _getDuration2.hours,
-      minutes = _getDuration2.minutes;
-
+  const {
+    hours,
+    minutes
+  } = new _Duration.default(internalValue).getDuration();
   return _react.default.createElement(_OverlayBase.default, {
     onChange: setHandler,
     onIncrement: incrementHandler,
     value: {
-      hours: hours,
-      minutes: minutes
+      hours,
+      minutes
     },
     onHide: onHide,
     hourIncrements: hourIncrements,
@@ -106,7 +104,7 @@ var DurationOverlay = (0, _react.forwardRef)(function (_ref, ref) {
     ref: ref
   });
 });
-var duration = (0, _propTypes.shape)({
+const duration = (0, _propTypes.shape)({
   hours: _propTypes.number,
   minutes: _propTypes.number
 });
@@ -124,7 +122,7 @@ DurationOverlay.propTypes = {
   })
 };
 DurationOverlay.defaultProps = {
-  onHide: function onHide() {},
+  onHide: () => {},
   min: undefined,
   max: undefined,
   minuteIncrements: 1,

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

@@ -25,80 +25,68 @@ var _DurationOverlay = _interopRequireDefault(require("./DurationOverlay"));
 
 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\twidth: 100% !important;\n\t@media (min-width: ", ") {\n\t\twidth: 170px !important;\n\t}\n\n\t", "\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n\tposition: relative;\n"]);
+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; }
 
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  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 buildDisplayValue = function buildDisplayValue(units, _ref) {
-  var minutes = _ref.minutes,
-      hours = _ref.hours;
-  var text = [];
+const buildDisplayValue = (units, _ref) => {
+  let {
+    minutes,
+    hours
+  } = _ref;
+  const text = [];
 
   if (units.includes('hours')) {
-    text.push(hours + " " + (0, _pluralize.default)('hr', hours));
+    text.push(`${hours} ${(0, _pluralize.default)('hr', hours)}`);
   }
 
   if (units.includes('minutes')) {
-    text.push(minutes + " " + (0, _pluralize.default)('min', minutes));
+    text.push(`${minutes} ${(0, _pluralize.default)('min', minutes)}`);
   }
 
   return text.join(' ');
 };
 
-var Container = _styledComponents.default.div(_templateObject());
-
+const Container = _styledComponents.default.div`
+	position: relative;
+`;
 Container.displayName = 'Container';
-var FlexibleInput = (0, _styledComponents.default)(_Input.default)(_templateObject2(), _breakpoints.default.tablet, function (props) {
-  return props.hasFocus && "\n\t\tborder-color: " + _colors.default.borderFocus + " !important;\n\t\tbox-shadow: " + _vars.default.boxShadow + ";\n\t";
-});
+const FlexibleInput = (0, _styledComponents.default)(_Input.default)`
+	width: 100% !important;
+	@media (min-width: ${_breakpoints.default.tablet}) {
+		width: 170px !important;
+	}
+
+	${props => props.hasFocus && `
+		border-color: ${_colors.default.borderFocus} !important;
+		box-shadow: ${_vars.default.boxShadow};
+	`}
+`;
 FlexibleInput.displayName = 'FlexibleInput';
 
-var DurationPicker = function DurationPicker(_ref2) {
-  var onChange = _ref2.onChange,
-      units = _ref2.units,
-      value = _ref2.value,
-      min = _ref2.min,
-      max = _ref2.max,
-      minuteIncrements = _ref2.minuteIncrements,
-      hourIncrements = _ref2.hourIncrements,
-      GA = _ref2.GA,
-      rest = _objectWithoutPropertiesLoose(_ref2, ["onChange", "units", "value", "min", "max", "minuteIncrements", "hourIncrements", "GA"]);
-
-  var _useState = (0, _react.useState)(false),
-      focus = _useState[0],
-      setFocus = _useState[1];
-
-  var myRef = (0, _react.useRef)();
-  var nodeRef = (0, _useClickOutside.default)(function () {
-    return setFocus(false);
-  });
-  (0, _react.useEffect)(function () {
+const DurationPicker = _ref2 => {
+  let {
+    onChange,
+    units,
+    value,
+    min,
+    max,
+    minuteIncrements,
+    hourIncrements,
+    GA
+  } = _ref2,
+      rest = _objectWithoutProperties(_ref2, ["onChange", "units", "value", "min", "max", "minuteIncrements", "hourIncrements", "GA"]);
+
+  const [focus, setFocus] = (0, _react.useState)(false);
+  const myRef = (0, _react.useRef)();
+  const nodeRef = (0, _useClickOutside.default)(() => setFocus(false));
+  (0, _react.useEffect)(() => {
     if (myRef.current) myRef.current.scrollIntoView({
       behavior: 'smooth',
       block: 'nearest'
@@ -109,16 +97,12 @@ var DurationPicker = function DurationPicker(_ref2) {
   }, _react.default.createElement(FlexibleInput, _extends({
     readOnly: true,
     value: buildDisplayValue(units, value),
-    onFocus: function onFocus() {
-      return setFocus(true);
-    },
+    onFocus: () => setFocus(true),
     hasFocus: focus
   }, rest)), focus && _react.default.createElement(_DurationOverlay.default, {
     units: units,
     value: value,
-    onHide: function onHide() {
-      return setFocus(false);
-    },
+    onHide: () => setFocus(false),
     onChange: onChange,
     min: min,
     max: max,
@@ -129,7 +113,7 @@ var DurationPicker = function DurationPicker(_ref2) {
   }));
 };
 
-var duration = (0, _propTypes.shape)({
+const duration = (0, _propTypes.shape)({
   hours: _propTypes.number,
   minutes: _propTypes.number
 });

package/dist/components/Time/OverlayBase/UnitInput/index.js

@@ -27,68 +27,55 @@ var _ChevronDoubleDown = _interopRequireDefault(require("../../../Icons/ChevronD
 
 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 _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n\tposition: relative;\n\ttop: 4px;\n"]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n\tposition: relative;\n\ttop: -4px;\n"]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n\tdisplay: flex;\n\tjustify-content: center;\n\tuser-select: none;\n\n\tsvg {\n\t\tcursor: pointer;\n\t}\n\n\tsvg:nth-child(2) {\n\t\tmargin-left: ", ";\n\t}\n"]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n\tborder: 2px solid ", ";\n\tborder-radius: ", ";\n\toutline: none;\n\twidth: 60px;\n\ttext-align: center;\n\tmargin: ", " 0;\n\tpadding: ", " 0;\n\n\t@media (min-width: ", ") {\n\t\twidth: 100px;\n\t\tfont-size: ", ";\n\t\tpadding: ", " 0;\n\t}\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
-
-var TimePartInput = _styledComponents.default.input(_templateObject(), _colors.default.borderColor, _vars.default.borderRadius, _spacing.default.s1, _spacing.default.s1, _breakpoints.default.tablet, _spacing.default.s3, _spacing.default.s2);
-
+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 TimePartInput = _styledComponents.default.input`
+	border: 2px solid ${_colors.default.borderColor};
+	border-radius: ${_vars.default.borderRadius};
+	outline: none;
+	width: 60px;
+	text-align: center;
+	margin: ${_spacing.default.s1} 0;
+	padding: ${_spacing.default.s1} 0;
+
+	@media (min-width: ${_breakpoints.default.tablet}) {
+		width: 100px;
+		font-size: ${_spacing.default.s3};
+		padding: ${_spacing.default.s2} 0;
+	}
+`;
 TimePartInput.displayName = 'TimePartInput';
-
-var IncrementButtons = _styledComponents.default.div(_templateObject2(), _spacing.default.s2);
-
+const IncrementButtons = _styledComponents.default.div`
+	display: flex;
+	justify-content: center;
+	user-select: none;
+
+	svg {
+		cursor: pointer;
+	}
+
+	svg:nth-child(2) {
+		margin-left: ${_spacing.default.s2};
+	}
+`;
 IncrementButtons.displayName = 'IncrementButtons';
-var StyledChevronDoubleUpIcon = (0, _styledComponents.default)(_ChevronDoubleUp.default)(_templateObject3());
+const StyledChevronDoubleUpIcon = (0, _styledComponents.default)(_ChevronDoubleUp.default)`
+	position: relative;
+	top: -4px;
+`;
 StyledChevronDoubleUpIcon.displayName = 'StyledChevronDoubleUpIcon';
-var StyledChevronDoubleDownIcon = (0, _styledComponents.default)(_ChevronDoubleDown.default)(_templateObject4());
+const StyledChevronDoubleDownIcon = (0, _styledComponents.default)(_ChevronDoubleDown.default)`
+	position: relative;
+	top: 4px;
+`;
 StyledChevronDoubleDownIcon.displayName = 'StyledChevronDoubleDownIcon';
 
-var parseIncrements = function parseIncrements(increment) {
+const parseIncrements = increment => {
   if (Array.isArray(increment)) return increment; // only small increment specified, auto for large
 
-  var largeIncrement = function largeIncrement() {
+  const largeIncrement = () => {
     if (increment < 2) {
       return 10;
     }
@@ -103,39 +90,29 @@ var parseIncrements = function parseIncrements(increment) {
   return [increment, largeIncrement()];
 };
 
-var UnitInput = function UnitInput(_ref) {
-  var value = _ref.value,
-      unit = _ref.unit,
-      onChange = _ref.onChange,
-      onIncrement = _ref.onIncrement,
-      showLargeIncrements = _ref.showLargeIncrements,
-      increment = _ref.increment;
-  var formatNumber = (0, _react.useCallback)(function (v) {
-    return unit === 'minutes' ? v.toString().padStart(2, '0') : v;
-  }, [unit]);
-
-  var _useState = (0, _react.useState)(formatNumber(value)),
-      rawValue = _useState[0],
-      setRawValue = _useState[1];
-
-  var _useState2 = (0, _react.useState)(false),
-      hasFocus = _useState2[0],
-      setFocus = _useState2[1];
-
-  (0, _react.useEffect)(function () {
+const UnitInput = _ref => {
+  let {
+    value,
+    unit,
+    onChange,
+    onIncrement,
+    showLargeIncrements,
+    increment
+  } = _ref;
+  const formatNumber = (0, _react.useCallback)(v => unit === 'minutes' ? v.toString().padStart(2, '0') : v, [unit]);
+  const [rawValue, setRawValue] = (0, _react.useState)(formatNumber(value));
+  const [hasFocus, setFocus] = (0, _react.useState)(false);
+  (0, _react.useEffect)(() => {
     setRawValue(formatNumber(value));
   }, [value, formatNumber]);
+  const [smallIncrement, largeIncrement] = parseIncrements(increment);
 
-  var _parseIncrements = parseIncrements(increment),
-      smallIncrement = _parseIncrements[0],
-      largeIncrement = _parseIncrements[1];
-
-  var updateHandler = function updateHandler(newRawValue, shouldAccept) {
+  const updateHandler = function (newRawValue, shouldAccept) {
     if (shouldAccept === void 0) {
       shouldAccept = false;
     }
 
-    var newValue = parseInt(newRawValue, 10);
+    const newValue = parseInt(newRawValue, 10);
 
     if (!Number.isNaN(newValue) && Number.isFinite(newValue)) {
       onChange(newValue, shouldAccept);
@@ -149,36 +126,28 @@ var UnitInput = function UnitInput(_ref) {
     role: "spinbutton",
     size: 16,
     color: _colors.default.primary,
-    onClick: function onClick() {
-      return onIncrement(largeIncrement);
-    }
+    onClick: () => onIncrement(largeIncrement)
   }), _react.default.createElement(_ChevronUp.default, {
     role: "spinbutton",
     size: 16,
     color: _colors.default.primary,
-    onClick: function onClick() {
-      return onIncrement(smallIncrement);
-    }
+    onClick: () => onIncrement(smallIncrement)
   })), _react.default.createElement(TimePartInput, {
     name: unit,
     value: hasFocus ? rawValue : formatNumber(value),
-    onChange: function onChange(e) {
-      return setRawValue(e.target.value);
-    },
-    onFocus: function onFocus() {
-      return setFocus(true);
-    },
-    onBlur: function onBlur(e) {
+    onChange: e => setRawValue(e.target.value),
+    onFocus: () => setFocus(true),
+    onBlur: e => {
       setFocus(false);
       updateHandler(e.target.value);
     },
-    onKeyDown: function onKeyDown(v) {
+    onKeyDown: v => {
       if (v.keyCode === 13) {
         v.preventDefault();
         updateHandler(rawValue, true);
       }
 
-      var amount = showLargeIncrements && v.shiftKey ? largeIncrement : smallIncrement;
+      const amount = showLargeIncrements && v.shiftKey ? largeIncrement : smallIncrement;
 
       if (v.keyCode === 38) {
         // up arrow
@@ -190,21 +159,17 @@ var UnitInput = function UnitInput(_ref) {
       }
     },
     maxLength: unit === 'minutes' ? 2 : 4,
-    "data-e2e": "time-" + unit
+    "data-e2e": `time-${unit}`
   }), _react.default.createElement(IncrementButtons, null, showLargeIncrements && _react.default.createElement(StyledChevronDoubleDownIcon, {
     role: "spinbutton",
     size: 16,
     color: _colors.default.primary,
-    onClick: function onClick() {
-      return onIncrement(-largeIncrement);
-    }
+    onClick: () => onIncrement(-largeIncrement)
   }), _react.default.createElement(_ChevronDown.default, {
     role: "spinbutton",
     size: 16,
     color: _colors.default.primary,
-    onClick: function onClick() {
-      return onIncrement(-smallIncrement);
-    }
+    onClick: () => onIncrement(-smallIncrement)
   })));
 };