@elliemae/ds-controlled-form 1.61.0 → 2.0.0-alpha.12

package/cjs/controlled-date-time-picker/parts/TimeInputs/TimeInputs.js

@@ -2,58 +2,56 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
 var dsGrid = require('@elliemae/ds-grid');
-var controlledDateTimePicker_ControlledDateTimePickerCTX = require('../../ControlledDateTimePickerCTX.js');
-var controlledDateTimePicker_parts_TimeInputs_HHInput = require('./HHInput.js');
-var controlledDateTimePicker_parts_TimeInputs_MinutesInput = require('./MinutesInput.js');
-var controlledDateTimePicker_parts_TimeInputs_MeridiemInput = require('./MeridiemInput.js');
-var controlledDateTimePicker_parts_TimeInputs_useTimeInputs = require('./useTimeInputs.js');
-var controlledDateTimePicker_parts_config = require('../config.js');
-var controlledDateTimePicker_parts_Styleds = require('../Styleds.js');
-require('../../ControlledDateTimePickerTypes.js');
-require('../../ControlledDateTimePickerDatatestid.js');
-require('@babel/runtime/helpers/slicedToArray');
-require('../../utils/constants.js');
-require('../../utils/stringHelpers.js');
-require('../../utils/numberHelpers.js');
-require('styled-components');
-require('@elliemae/ds-button');
+var ControlledDateTimePickerCTX = require('../../ControlledDateTimePickerCTX.js');
+var HHInput = require('./HHInput.js');
+var MinutesInput = require('./MinutesInput.js');
+var MeridiemInput = require('./MeridiemInput.js');
+var useTimeInputs = require('./useTimeInputs.js');
+var config = require('../config.js');
+var Styleds = require('../Styleds.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
-var TimeInputs = function TimeInputs() {
-  var _useTimeInputs = controlledDateTimePicker_parts_TimeInputs_useTimeInputs.useTimeInputs(),
-      hours = _useTimeInputs.hours,
-      minutes = _useTimeInputs.minutes,
-      meridiem = _useTimeInputs.meridiem,
-      autoFocusHourInput = _useTimeInputs.autoFocusHourInput,
-      disabled = _useTimeInputs.disabled,
-      onHoursChange = _useTimeInputs.onHoursChange,
-      onMinutesChange = _useTimeInputs.onMinutesChange,
-      onMeridiemChange = _useTimeInputs.onMeridiemChange,
-      onHoursBlur = _useTimeInputs.onHoursBlur,
-      onMinutesBlur = _useTimeInputs.onMinutesBlur,
-      onMeridiemBlur = _useTimeInputs.onMeridiemBlur,
-      onHoursFocus = _useTimeInputs.onHoursFocus,
-      onMeridiemFocus = _useTimeInputs.onMeridiemFocus,
-      onMinutesFocus = _useTimeInputs.onMinutesFocus,
-      onHoursKeyDown = _useTimeInputs.onHoursKeyDown,
-      onMinutesKeyDown = _useTimeInputs.onMinutesKeyDown,
-      onMeridiemKeyDown = _useTimeInputs.onMeridiemKeyDown; // we do this here so HHInput,MinutesInput, MeridiemInput can be pure components memoized via React.memo
+var _StyledColonSeparator, _StyledSeparator;
+const TimeInputs = () => {
+  const {
+    hours,
+    minutes,
+    // seconds,
+    meridiem,
+    autoFocusHourInput,
+    disabled,
+    onHoursChange,
+    onMinutesChange,
+    // onSecondsChange,
+    onMeridiemChange,
+    onHoursBlur,
+    onMinutesBlur,
+    // onSecondsBlur,
+    onMeridiemBlur,
+    onHoursFocus,
+    onMeridiemFocus,
+    onMinutesFocus,
+    onHoursKeyDown,
+    onMinutesKeyDown,
+    // onSecondsKeyDown,
+    onMeridiemKeyDown
+  } = useTimeInputs.useTimeInputs(); // we do this here so HHInput,MinutesInput, MeridiemInput can be pure components memoized via React.memo
 
-
-  var _useContext = React.useContext(controlledDateTimePicker_ControlledDateTimePickerCTX.ControlledDateTimePickerContext),
-      hourInputRef = _useContext.hourInputRef,
-      minutesInputRef = _useContext.minutesInputRef,
-      meridiemInputRef = _useContext.meridiemInputRef,
-      ariaCurrentValueForInputs = _useContext.ariaCurrentValueForInputs;
-
-  return /*#__PURE__*/React__default['default'].createElement(dsGrid.Grid, {
-    cols: [controlledDateTimePicker_parts_config.fixedValues.smallInputWidth, controlledDateTimePicker_parts_config.fixedValues.separatorWidth, controlledDateTimePicker_parts_config.fixedValues.smallInputWidth, controlledDateTimePicker_parts_config.fixedValues.separatorWidth, controlledDateTimePicker_parts_config.fixedValues.smallInputWidth]
-  }, /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_Styleds.StyledFocusWithIn, null, /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_TimeInputs_HHInput.HHInput, {
+  const {
+    hourInputRef,
+    minutesInputRef,
+    meridiemInputRef,
+    ariaCurrentValueForInputs
+  } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
+  return /*#__PURE__*/_jsx__default["default"](dsGrid.Grid, {
+    cols: [config.fixedValues.smallInputWidth, config.fixedValues.separatorWidth, config.fixedValues.smallInputWidth, config.fixedValues.separatorWidth, config.fixedValues.smallInputWidth]
+  }, void 0, /*#__PURE__*/_jsx__default["default"](Styleds.StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx__default["default"](HHInput.HHInput, {
     value: hours,
     onChange: onHoursChange,
     onBlur: onHoursBlur,
@@ -64,9 +62,9 @@ var TimeInputs = function TimeInputs() {
     ariaCurrentValueForInputs: ariaCurrentValueForInputs,
     autoFocusHourInput: autoFocusHourInput,
     disabled: disabled
-  })), /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_Styleds.StyledColonSeparator, {
+  })), _StyledColonSeparator || (_StyledColonSeparator = /*#__PURE__*/_jsx__default["default"](Styleds.StyledColonSeparator, {
     alignItems: "center"
-  }, ":"), /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_Styleds.StyledFocusWithIn, null, /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_TimeInputs_MinutesInput.MinutesInput, {
+  }, void 0, ":")), /*#__PURE__*/_jsx__default["default"](Styleds.StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx__default["default"](MinutesInput.MinutesInput, {
     value: minutes,
     onChange: onMinutesChange,
     onBlur: onMinutesBlur,
@@ -76,7 +74,7 @@ var TimeInputs = function TimeInputs() {
     placeholder: "MM",
     ariaCurrentValueForInputs: ariaCurrentValueForInputs,
     disabled: disabled
-  })), /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_Styleds.StyledSeparator, null, " "), /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_Styleds.StyledFocusWithIn, null, /*#__PURE__*/React__default['default'].createElement(controlledDateTimePicker_parts_TimeInputs_MeridiemInput.MeridiemInput, {
+  })), _StyledSeparator || (_StyledSeparator = /*#__PURE__*/_jsx__default["default"](Styleds.StyledSeparator, {}, void 0, " ")), /*#__PURE__*/_jsx__default["default"](Styleds.StyledFocusWithIn, {}, void 0, /*#__PURE__*/_jsx__default["default"](MeridiemInput.MeridiemInput, {
     value: meridiem,
     onChange: onMeridiemChange,
     onBlur: onMeridiemBlur,
@@ -90,4 +88,3 @@ var TimeInputs = function TimeInputs() {
 };
 
 exports.TimeInputs = TimeInputs;
-//# sourceMappingURL=TimeInputs.js.map

package/cjs/controlled-date-time-picker/parts/TimeInputs/useTimeInputs.js

@@ -3,95 +3,94 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var React = require('react');
-var controlledDateTimePicker_ControlledDateTimePickerCTX = require('../../ControlledDateTimePickerCTX.js');
-var controlledDateTimePicker_utils_constants = require('../../utils/constants.js');
-var controlledDateTimePicker_utils_stringHelpers = require('../../utils/stringHelpers.js');
-require('../../ControlledDateTimePickerTypes.js');
-require('@babel/runtime/helpers/slicedToArray');
-require('../../utils/numberHelpers.js');
+var ControlledDateTimePickerCTX = require('../../ControlledDateTimePickerCTX.js');
+var constants = require('../../utils/constants.js');
+var stringHelpers = require('../../utils/stringHelpers.js');
 
 /* eslint-disable complexity */
-var useTimeInputs = function useTimeInputs() {
-  var _useContext = React.useContext(controlledDateTimePicker_ControlledDateTimePickerCTX.ControlledDateTimePickerContext),
-      _useContext$props = _useContext.props,
-      minutesInterval = _useContext$props.minutesInterval,
-      disabled = _useContext$props.disabled,
-      lastSegmentRef = _useContext.lastSegmentRef,
-      hours = _useContext.hours,
-      minutes = _useContext.minutes,
-      meridiem = _useContext.meridiem,
-      hideDate = _useContext.hideDate,
-      withAnyRightController = _useContext.withAnyRightController,
-      withAnyPicker = _useContext.withAnyPicker,
-      withClearBtn = _useContext.withClearBtn,
-      isWithDateInputs = _useContext.isWithDateInputs,
-      hourInputRef = _useContext.hourInputRef,
-      minutesInputRef = _useContext.minutesInputRef,
-      meridiemInputRef = _useContext.meridiemInputRef,
-      yearInputRef = _useContext.yearInputRef,
-      clearButtonRef = _useContext.clearButtonRef,
-      pickerButtonRef = _useContext.pickerButtonRef,
-      monthInputRef = _useContext.monthInputRef,
-      autoFocusHourInput = _useContext.autoFocusHourInput,
-      handleChangeHours = _useContext.handleChangeHours,
-      handleChangeMinutes = _useContext.handleChangeMinutes,
-      handleChangeMeridiem = _useContext.handleChangeMeridiem,
-      setLatestInteractionRegion = _useContext.setLatestInteractionRegion;
-
-  var setLatestInteractionRegionTimeInputs = React.useCallback(function () {
+const useTimeInputs = () => {
+  const {
+    props: {
+      minutesInterval,
+      disabled
+    },
+    lastSegmentRef,
+    hours,
+    minutes,
+    meridiem,
+    hideDate,
+    withAnyRightController,
+    withAnyPicker,
+    withClearBtn,
+    isWithDateInputs,
+    hourInputRef,
+    minutesInputRef,
+    meridiemInputRef,
+    yearInputRef,
+    clearButtonRef,
+    pickerButtonRef,
+    monthInputRef,
+    autoFocusHourInput,
+    handleChangeHours,
+    handleChangeMinutes,
+    handleChangeMeridiem,
+    setLatestInteractionRegion
+  } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
+  const setLatestInteractionRegionTimeInputs = React.useCallback(() => {
     setLatestInteractionRegion('time-inputs');
   }, [setLatestInteractionRegion]);
-  var onHomeKeyDown = React.useCallback(function () {
+  const onHomeKeyDown = React.useCallback(() => {
     var _monthInputRef$curren, _monthInputRef$curren2, _hourInputRef$current, _hourInputRef$current2;
 
     if (!hideDate) monthInputRef === null || monthInputRef === void 0 ? void 0 : (_monthInputRef$curren = monthInputRef.current) === null || _monthInputRef$curren === void 0 ? void 0 : (_monthInputRef$curren2 = _monthInputRef$curren.focus) === null || _monthInputRef$curren2 === void 0 ? void 0 : _monthInputRef$curren2.call(_monthInputRef$curren);else hourInputRef === null || hourInputRef === void 0 ? void 0 : (_hourInputRef$current = hourInputRef.current) === null || _hourInputRef$current === void 0 ? void 0 : (_hourInputRef$current2 = _hourInputRef$current.focus) === null || _hourInputRef$current2 === void 0 ? void 0 : _hourInputRef$current2.call(_hourInputRef$current);
   }, [hideDate, monthInputRef, hourInputRef]);
-  var onEndKeyDown = React.useCallback(function () {
+  const onEndKeyDown = React.useCallback(() => {
     var _pickerButtonRef$curr, _pickerButtonRef$curr2, _clearButtonRef$curre, _clearButtonRef$curre2, _meridiemInputRef$cur, _meridiemInputRef$cur2;
 
     if (withAnyPicker) pickerButtonRef === null || pickerButtonRef === void 0 ? void 0 : (_pickerButtonRef$curr = pickerButtonRef.current) === null || _pickerButtonRef$curr === void 0 ? void 0 : (_pickerButtonRef$curr2 = _pickerButtonRef$curr.focus) === null || _pickerButtonRef$curr2 === void 0 ? void 0 : _pickerButtonRef$curr2.call(_pickerButtonRef$curr);else if (withClearBtn) clearButtonRef === null || clearButtonRef === void 0 ? void 0 : (_clearButtonRef$curre = clearButtonRef.current) === null || _clearButtonRef$curre === void 0 ? void 0 : (_clearButtonRef$curre2 = _clearButtonRef$curre.focus) === null || _clearButtonRef$curre2 === void 0 ? void 0 : _clearButtonRef$curre2.call(_clearButtonRef$curre);else meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur = meridiemInputRef.current) === null || _meridiemInputRef$cur === void 0 ? void 0 : (_meridiemInputRef$cur2 = _meridiemInputRef$cur.focus) === null || _meridiemInputRef$cur2 === void 0 ? void 0 : _meridiemInputRef$cur2.call(_meridiemInputRef$cur);
   }, [withAnyPicker, pickerButtonRef, withClearBtn, clearButtonRef, meridiemInputRef]);
-  var onHoursFocus = React.useCallback(function () {
+  const onHoursFocus = React.useCallback(() => {
     setLatestInteractionRegionTimeInputs();
   }, [setLatestInteractionRegionTimeInputs]);
-  var onHoursChange = React.useCallback(function (e) {
+  const onHoursChange = React.useCallback(e => {
     var _e$target, _minutesInputRef$curr, _minutesInputRef$curr2;
 
-    var newHours = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value; // converts hours 2~9 to 07~09
+    let newHours = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value; // converts hours 2~9 to 07~09
 
-    if (Number.parseInt(newHours, 10) > 1) newHours = controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders(newHours, 2);
+    if (Number.parseInt(newHours, 10) > 1) newHours = stringHelpers.prependStringWithPlaceHolders(newHours, 2);
     handleChangeHours(newHours, e); // auto-advance functionality:
 
     if (newHours.length === 2) minutesInputRef === null || minutesInputRef === void 0 ? void 0 : (_minutesInputRef$curr = minutesInputRef.current) === null || _minutesInputRef$curr === void 0 ? void 0 : (_minutesInputRef$curr2 = _minutesInputRef$curr.focus) === null || _minutesInputRef$curr2 === void 0 ? void 0 : _minutesInputRef$curr2.call(_minutesInputRef$curr);
   }, [minutesInputRef, handleChangeHours]);
-  var onHoursKeyDown = React.useCallback(function (e) {
+  const onHoursKeyDown = React.useCallback(e => {
     var _lastSegmentRef$curre, _lastSegmentRef$curre2;
 
-    var key = e.key,
-        ctrlKey = e.ctrlKey,
-        metaKey = e.metaKey;
-    var hoursStringConvertedToInteger = Number.parseInt(hours, 10);
-    if (controlledDateTimePicker_utils_constants.homeEndArrowUpDownSemiKeys.includes(key)) e.preventDefault();
-    if (controlledDateTimePicker_utils_constants.homeEndArrowUpDownSemiKeys.includes(key)) e.stopPropagation();
+    const {
+      key,
+      ctrlKey,
+      metaKey
+    } = e;
+    const hoursStringConvertedToInteger = Number.parseInt(hours, 10);
+    if (constants.homeEndArrowUpDownSemiKeys.includes(key)) e.preventDefault();
+    if (constants.homeEndArrowUpDownSemiKeys.includes(key)) e.stopPropagation();
     if (key === 'Home') onHomeKeyDown();
     if (key === 'End') onEndKeyDown();
 
     if (key === 'ArrowUp' || key === 'ArrowDown') {
-      var hoursInteger = Number.isNaN(hoursStringConvertedToInteger) ? 0 : hoursStringConvertedToInteger;
-      var newHours;
+      const hoursInteger = Number.isNaN(hoursStringConvertedToInteger) ? 0 : hoursStringConvertedToInteger;
+      let newHours;
       if (key === 'ArrowUp') newHours = hoursInteger + 1 <= 12 ? hoursInteger + 1 : hoursInteger;else newHours = hoursInteger - 1 > 1 ? hoursInteger - 1 : 1;
-      newHours = controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders("".concat(newHours), 2);
+      newHours = stringHelpers.prependStringWithPlaceHolders("".concat(newHours), 2);
       handleChangeHours(newHours, e);
     }
 
     if (!Number.isNaN(hoursStringConvertedToInteger) && key === ':') {
       var _minutesInputRef$curr3, _minutesInputRef$curr4;
 
-      var _newHours = controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders("".concat(hoursStringConvertedToInteger), 2);
+      const newHours = stringHelpers.prependStringWithPlaceHolders("".concat(hoursStringConvertedToInteger), 2);
+      handleChangeHours(newHours, e); // auto-advance functionality:
 
-      handleChangeHours(_newHours, e); // auto-advance functionality:
-
-      if (_newHours.length === 2) minutesInputRef === null || minutesInputRef === void 0 ? void 0 : (_minutesInputRef$curr3 = minutesInputRef.current) === null || _minutesInputRef$curr3 === void 0 ? void 0 : (_minutesInputRef$curr4 = _minutesInputRef$curr3.focus) === null || _minutesInputRef$curr4 === void 0 ? void 0 : _minutesInputRef$curr4.call(_minutesInputRef$curr3);
+      if (newHours.length === 2) minutesInputRef === null || minutesInputRef === void 0 ? void 0 : (_minutesInputRef$curr3 = minutesInputRef.current) === null || _minutesInputRef$curr3 === void 0 ? void 0 : (_minutesInputRef$curr4 = _minutesInputRef$curr3.focus) === null || _minutesInputRef$curr4 === void 0 ? void 0 : _minutesInputRef$curr4.call(_minutesInputRef$curr3);
     } // regressive backspace functionality
 
 
@@ -104,59 +103,60 @@ var useTimeInputs = function useTimeInputs() {
 
     if ((ctrlKey || metaKey) && key === ';') lastSegmentRef === null || lastSegmentRef === void 0 ? void 0 : (_lastSegmentRef$curre = lastSegmentRef.current) === null || _lastSegmentRef$curre === void 0 ? void 0 : (_lastSegmentRef$curre2 = _lastSegmentRef$curre.focus) === null || _lastSegmentRef$curre2 === void 0 ? void 0 : _lastSegmentRef$curre2.call(_lastSegmentRef$curre);
   }, [hours, onHomeKeyDown, onEndKeyDown, isWithDateInputs, lastSegmentRef, handleChangeHours, minutesInputRef, yearInputRef]);
-  var onHoursBlur = React.useCallback(function (e) {
+  const onHoursBlur = React.useCallback(e => {
     var _e$target2;
 
-    var newHours = e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value;
+    const newHours = e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value;
     if (newHours === '0') handleChangeHours('01', e, {
       isAutomaticFillTrigger: true
-    });else if (newHours.length > 0 && newHours.length < 2) handleChangeHours(controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders(newHours, 2), e, {
+    });else if (newHours.length > 0 && newHours.length < 2) handleChangeHours(stringHelpers.prependStringWithPlaceHolders(newHours, 2), e, {
       isAutomaticFillTrigger: true
     });
   }, [handleChangeHours]);
-  var onMinutesFocus = React.useCallback(function () {
+  const onMinutesFocus = React.useCallback(() => {
     setLatestInteractionRegionTimeInputs();
   }, [setLatestInteractionRegionTimeInputs]);
-  var onMinutesChange = React.useCallback(function (e) {
+  const onMinutesChange = React.useCallback(e => {
     var _e$target3, _meridiemInputRef$cur3, _meridiemInputRef$cur4;
 
-    var newMinutes = e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value; // converts minutes 7~9 to 07~09
+    let newMinutes = e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value; // converts minutes 7~9 to 07~09
 
-    if (Number.parseInt(newMinutes, 10) > 6) newMinutes = controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders(newMinutes, 2);
+    if (Number.parseInt(newMinutes, 10) > 6) newMinutes = stringHelpers.prependStringWithPlaceHolders(newMinutes, 2);
     handleChangeMinutes(newMinutes, e); // auto-advance functionality:
     // if (newMinutes.length === 2) secondsInputRef?.current?.focus?.();
 
     if (newMinutes.length === 2) meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur3 = meridiemInputRef.current) === null || _meridiemInputRef$cur3 === void 0 ? void 0 : (_meridiemInputRef$cur4 = _meridiemInputRef$cur3.focus) === null || _meridiemInputRef$cur4 === void 0 ? void 0 : _meridiemInputRef$cur4.call(_meridiemInputRef$cur3);
   }, [meridiemInputRef, handleChangeMinutes]);
-  var onMinutesKeyDown = React.useCallback(function (e) {
+  const onMinutesKeyDown = React.useCallback(e => {
     var _lastSegmentRef$curre3, _lastSegmentRef$curre4;
 
-    var key = e.key,
-        ctrlKey = e.ctrlKey,
-        metaKey = e.metaKey;
-    var minutesStringConvertedToInteger = Number.parseInt(minutes, 10);
-    if (controlledDateTimePicker_utils_constants.homeEndArrowUpDownSpaceKeys.includes(key)) e.preventDefault();
-    if (controlledDateTimePicker_utils_constants.homeEndArrowUpDownSpaceKeys.includes(key)) e.stopPropagation();
+    const {
+      key,
+      ctrlKey,
+      metaKey
+    } = e;
+    const minutesStringConvertedToInteger = Number.parseInt(minutes, 10);
+    if (constants.homeEndArrowUpDownSpaceKeys.includes(key)) e.preventDefault();
+    if (constants.homeEndArrowUpDownSpaceKeys.includes(key)) e.stopPropagation();
     if (key === 'Home') onHomeKeyDown();
     if (key === 'End') onEndKeyDown();
 
     if (key === 'ArrowUp' || key === 'ArrowDown') {
-      var minutesInteger = Number.isNaN(minutesStringConvertedToInteger) ? 0 : minutesStringConvertedToInteger;
-      var newMinutes;
+      const minutesInteger = Number.isNaN(minutesStringConvertedToInteger) ? 0 : minutesStringConvertedToInteger;
+      let newMinutes;
       if (key === 'ArrowUp') newMinutes = minutesInteger + minutesInterval <= 59 ? minutesInteger + minutesInterval : minutesInteger;else newMinutes = minutesInteger - minutesInterval > 0 ? minutesInteger - minutesInterval : 0;
-      newMinutes = controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders("".concat(newMinutes), 2);
+      newMinutes = stringHelpers.prependStringWithPlaceHolders("".concat(newMinutes), 2);
       handleChangeMinutes(newMinutes, e);
     }
 
     if (!Number.isNaN(minutesStringConvertedToInteger) && key === ' ') {
       var _meridiemInputRef$cur5, _meridiemInputRef$cur6;
 
-      var _newMinutes = controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders("".concat(minutesStringConvertedToInteger), 2);
-
-      handleChangeMinutes(_newMinutes, e); // auto-advance functionality:
+      const newMinutes = stringHelpers.prependStringWithPlaceHolders("".concat(minutesStringConvertedToInteger), 2);
+      handleChangeMinutes(newMinutes, e); // auto-advance functionality:
       // if (newMinutes.length === 2) secondsInputRef?.current?.focus?.();
 
-      if (_newMinutes.length === 2) meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur5 = meridiemInputRef.current) === null || _meridiemInputRef$cur5 === void 0 ? void 0 : (_meridiemInputRef$cur6 = _meridiemInputRef$cur5.focus) === null || _meridiemInputRef$cur6 === void 0 ? void 0 : _meridiemInputRef$cur6.call(_meridiemInputRef$cur5);
+      if (newMinutes.length === 2) meridiemInputRef === null || meridiemInputRef === void 0 ? void 0 : (_meridiemInputRef$cur5 = meridiemInputRef.current) === null || _meridiemInputRef$cur5 === void 0 ? void 0 : (_meridiemInputRef$cur6 = _meridiemInputRef$cur5.focus) === null || _meridiemInputRef$cur6 === void 0 ? void 0 : _meridiemInputRef$cur6.call(_meridiemInputRef$cur5);
     } // regressive backspace functionality
 
 
@@ -169,21 +169,21 @@ var useTimeInputs = function useTimeInputs() {
 
     if ((ctrlKey || metaKey) && key === ';') lastSegmentRef === null || lastSegmentRef === void 0 ? void 0 : (_lastSegmentRef$curre3 = lastSegmentRef.current) === null || _lastSegmentRef$curre3 === void 0 ? void 0 : (_lastSegmentRef$curre4 = _lastSegmentRef$curre3.focus) === null || _lastSegmentRef$curre4 === void 0 ? void 0 : _lastSegmentRef$curre4.call(_lastSegmentRef$curre3);
   }, [minutes, onHomeKeyDown, onEndKeyDown, lastSegmentRef, minutesInterval, handleChangeMinutes, meridiemInputRef, hourInputRef]);
-  var onMinutesBlur = React.useCallback(function (e) {
+  const onMinutesBlur = React.useCallback(e => {
     var _e$target4;
 
-    var newMinutes = e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : _e$target4.value;
-    if (newMinutes.length > 0 && newMinutes.length < 2) handleChangeMinutes(controlledDateTimePicker_utils_stringHelpers.prependStringWithPlaceHolders(newMinutes, 2), e, {
+    const newMinutes = e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : _e$target4.value;
+    if (newMinutes.length > 0 && newMinutes.length < 2) handleChangeMinutes(stringHelpers.prependStringWithPlaceHolders(newMinutes, 2), e, {
       isAutomaticFillTrigger: true
     });
   }, [handleChangeMinutes]);
-  var onMeridiemFocus = React.useCallback(function () {
+  const onMeridiemFocus = React.useCallback(() => {
     setLatestInteractionRegionTimeInputs();
   }, [setLatestInteractionRegionTimeInputs]);
-  var onMeridiemChange = React.useCallback(function (e) {
+  const onMeridiemChange = React.useCallback(e => {
     var _e$target5, _e$target5$value, _e$target5$value$toUp;
 
-    var newMeridiem = e === null || e === void 0 ? void 0 : (_e$target5 = e.target) === null || _e$target5 === void 0 ? void 0 : (_e$target5$value = _e$target5.value) === null || _e$target5$value === void 0 ? void 0 : (_e$target5$value$toUp = _e$target5$value.toUpperCase) === null || _e$target5$value$toUp === void 0 ? void 0 : _e$target5$value$toUp.call(_e$target5$value); // if new value is length 1,
+    let newMeridiem = e === null || e === void 0 ? void 0 : (_e$target5 = e.target) === null || _e$target5 === void 0 ? void 0 : (_e$target5$value = _e$target5.value) === null || _e$target5$value === void 0 ? void 0 : (_e$target5$value$toUp = _e$target5$value.toUpperCase) === null || _e$target5$value$toUp === void 0 ? void 0 : _e$target5$value$toUp.call(_e$target5$value); // if new value is length 1,
     //   if previous value was empty, auto-complete
     //   if previous value was not empty, set to empty (regressive backspace)
 
@@ -196,14 +196,16 @@ var useTimeInputs = function useTimeInputs() {
       if (withClearBtn) (_clearButtonRef$curre3 = clearButtonRef.current) === null || _clearButtonRef$curre3 === void 0 ? void 0 : (_clearButtonRef$curre4 = _clearButtonRef$curre3.focus) === null || _clearButtonRef$curre4 === void 0 ? void 0 : _clearButtonRef$curre4.call(_clearButtonRef$curre3);else if (withAnyPicker) pickerButtonRef === null || pickerButtonRef === void 0 ? void 0 : (_pickerButtonRef$curr3 = pickerButtonRef.current) === null || _pickerButtonRef$curr3 === void 0 ? void 0 : (_pickerButtonRef$curr4 = _pickerButtonRef$curr3.focus) === null || _pickerButtonRef$curr4 === void 0 ? void 0 : _pickerButtonRef$curr4.call(_pickerButtonRef$curr3);
     }
   }, [meridiem, handleChangeMeridiem, withAnyRightController, withClearBtn, clearButtonRef, withAnyPicker, pickerButtonRef]);
-  var onMeridiemKeyDown = React.useCallback(function (e) {
+  const onMeridiemKeyDown = React.useCallback(e => {
     var _lastSegmentRef$curre5, _lastSegmentRef$curre6;
 
-    var key = e.key,
-        ctrlKey = e.ctrlKey,
-        metaKey = e.metaKey;
-    if (controlledDateTimePicker_utils_constants.homeEndArrowUpDownKeys.includes(key)) e.preventDefault();
-    if (controlledDateTimePicker_utils_constants.homeEndArrowUpDownKeys.includes(key)) e.stopPropagation();
+    const {
+      key,
+      ctrlKey,
+      metaKey
+    } = e;
+    if (constants.homeEndArrowUpDownKeys.includes(key)) e.preventDefault();
+    if (constants.homeEndArrowUpDownKeys.includes(key)) e.stopPropagation();
     if (key === 'Home') onHomeKeyDown();
     if (key === 'End') onEndKeyDown();
     if (key === 'ArrowUp' && meridiem !== 'AM') handleChangeMeridiem('AM', e);
@@ -218,39 +220,36 @@ var useTimeInputs = function useTimeInputs() {
 
     if ((ctrlKey || metaKey) && key === ';') lastSegmentRef === null || lastSegmentRef === void 0 ? void 0 : (_lastSegmentRef$curre5 = lastSegmentRef.current) === null || _lastSegmentRef$curre5 === void 0 ? void 0 : (_lastSegmentRef$curre6 = _lastSegmentRef$curre5.focus) === null || _lastSegmentRef$curre6 === void 0 ? void 0 : _lastSegmentRef$curre6.call(_lastSegmentRef$curre5);
   }, [onHomeKeyDown, onEndKeyDown, meridiem, handleChangeMeridiem, lastSegmentRef, minutesInputRef]);
-  var onMeridiemBlur = React.useCallback(function (e) {
+  const onMeridiemBlur = React.useCallback(e => {
     var _e$target6, _e$target6$value, _e$target6$value$toUp;
 
-    var newMeridiem = e === null || e === void 0 ? void 0 : (_e$target6 = e.target) === null || _e$target6 === void 0 ? void 0 : (_e$target6$value = _e$target6.value) === null || _e$target6$value === void 0 ? void 0 : (_e$target6$value$toUp = _e$target6$value.toUpperCase) === null || _e$target6$value$toUp === void 0 ? void 0 : _e$target6$value$toUp.call(_e$target6$value);
+    const newMeridiem = e === null || e === void 0 ? void 0 : (_e$target6 = e.target) === null || _e$target6 === void 0 ? void 0 : (_e$target6$value = _e$target6.value) === null || _e$target6$value === void 0 ? void 0 : (_e$target6$value$toUp = _e$target6$value.toUpperCase) === null || _e$target6$value$toUp === void 0 ? void 0 : _e$target6$value$toUp.call(_e$target6$value);
     if (newMeridiem.length === 1) handleChangeMeridiem("".concat(newMeridiem, "M"), e, {
       isAutomaticFillTrigger: true
     });
   }, [handleChangeMeridiem]);
-  return React.useMemo(function () {
-    return {
-      hours: hours,
-      minutes: minutes,
-      meridiem: meridiem,
-      autoFocusHourInput: autoFocusHourInput,
-      disabled: disabled,
-      handleChangeHours: handleChangeHours,
-      onHoursFocus: onHoursFocus,
-      onHoursChange: onHoursChange,
-      handleChangeMinutes: handleChangeMinutes,
-      onMinutesFocus: onMinutesFocus,
-      onMinutesChange: onMinutesChange,
-      handleChangeMeridiem: handleChangeMeridiem,
-      onMeridiemFocus: onMeridiemFocus,
-      onMeridiemChange: onMeridiemChange,
-      onHoursBlur: onHoursBlur,
-      onMinutesBlur: onMinutesBlur,
-      onMeridiemBlur: onMeridiemBlur,
-      onHoursKeyDown: onHoursKeyDown,
-      onMinutesKeyDown: onMinutesKeyDown,
-      onMeridiemKeyDown: onMeridiemKeyDown
-    };
-  }, [hours, minutes, meridiem, autoFocusHourInput, disabled, handleChangeHours, onHoursFocus, onHoursChange, handleChangeMinutes, onMinutesFocus, onMinutesChange, handleChangeMeridiem, onMeridiemFocus, onMeridiemChange, onHoursBlur, onMinutesBlur, onMeridiemBlur, onHoursKeyDown, onMinutesKeyDown, onMeridiemKeyDown]);
+  return React.useMemo(() => ({
+    hours,
+    minutes,
+    meridiem,
+    autoFocusHourInput,
+    disabled,
+    handleChangeHours,
+    onHoursFocus,
+    onHoursChange,
+    handleChangeMinutes,
+    onMinutesFocus,
+    onMinutesChange,
+    handleChangeMeridiem,
+    onMeridiemFocus,
+    onMeridiemChange,
+    onHoursBlur,
+    onMinutesBlur,
+    onMeridiemBlur,
+    onHoursKeyDown,
+    onMinutesKeyDown,
+    onMeridiemKeyDown
+  }), [hours, minutes, meridiem, autoFocusHourInput, disabled, handleChangeHours, onHoursFocus, onHoursChange, handleChangeMinutes, onMinutesFocus, onMinutesChange, handleChangeMeridiem, onMeridiemFocus, onMeridiemChange, onHoursBlur, onMinutesBlur, onMeridiemBlur, onHoursKeyDown, onMinutesKeyDown, onMeridiemKeyDown]);
 };
 
 exports.useTimeInputs = useTimeInputs;
-//# sourceMappingURL=useTimeInputs.js.map

package/cjs/controlled-date-time-picker/parts/config.js

@@ -2,11 +2,10 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var fixedValues = {
+const fixedValues = {
   smallInputWidth: '28px',
   largeInputWidth: '40px',
   separatorWidth: '7px'
 };
 
 exports.fixedValues = fixedValues;
-//# sourceMappingURL=config.js.map

package/cjs/controlled-date-time-picker/propTypes.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var reactDesc = require('react-desc');
 
-var propTypes = {
+const propTypes = {
   type: reactDesc.PropTypes.oneOf(['full-date-time', 'date-time-inputs', 'date-time-picker', 'date-time-picker-controller-only', 'full-date', 'date-inputs', 'date-picker', 'date-picker-controller-only', 'full-time', 'time-inputs', 'time-picker', 'time-picker-controller-only']).description('Type of time form control to use').defaultValue('full-date-time'),
   disabled: reactDesc.PropTypes.bool.description('wheter or not the input is disabled').defaultValue('false'),
   isClearable: reactDesc.PropTypes.bool.description('with or without clearable button').defaultValue('false'),
@@ -25,8 +25,8 @@ var propTypes = {
   getIsDisabledTime: reactDesc.PropTypes.func.description('(timeAsString) => true for marking as disabled, false for marking as valid').defaultValue(''),
   emptyPickerStartingMonth: reactDesc.PropTypes.string.description('which month to start the calendar on open, when value is empty, string following the "MM/__/YYYY" pattern'),
   onCalendarOpenFocusedDay: reactDesc.PropTypes.string.description('which day to focus on calendar open when value is empty, string following the "MM/DD/YYYY" pattern').defaultValue('if value is empty current month, else month corresponding the month'),
-  minutesInterval: reactDesc.PropTypes.number.description('increments/decrements of minutes in time related controllers interactions').defaultValue('1')
+  minutesInterval: reactDesc.PropTypes.number.description('increments/decrements of minutes in time related controllers interactions').defaultValue('1'),
+  'data-testid': reactDesc.PropTypes.string.description('Unique id for tests.').defaultValue('')
 };
 
 exports.propTypes = propTypes;
-//# sourceMappingURL=propTypes.js.map

package/cjs/controlled-date-time-picker/utils/constants.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var weekDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
-var monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
-var announcableCardinalDays = {
+const weekDays = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
+const monthNames = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
+const announcableCardinalDays = {
   1: 'first',
   2: 'second',
   3: 'third',
@@ -37,13 +37,13 @@ var announcableCardinalDays = {
   30: 'thirtieth',
   31: 'thirty first'
 };
-var homeEndAllArrowKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
-var homeEndKeys = ['Home', 'End'];
-var homeEndArrowUpDownDashSlashesKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\'];
-var homeEndArrowUpDownSpaceKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', ' '];
-var homeEndArrowUpDownSemiKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', ':'];
-var homeEndArrowUpDownKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown'];
-var defaultMetaInfo = {
+const homeEndAllArrowKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'];
+const homeEndKeys = ['Home', 'End'];
+const homeEndArrowUpDownDashSlashesKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', '-', '/', '\\'];
+const homeEndArrowUpDownSpaceKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', ' '];
+const homeEndArrowUpDownSemiKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown', ':'];
+const homeEndArrowUpDownKeys = ['Home', 'End', 'ArrowUp', 'ArrowDown'];
+const defaultMetaInfo = {
   isAutomaticFillTrigger: false
 };
 
@@ -57,4 +57,3 @@ exports.homeEndArrowUpDownSpaceKeys = homeEndArrowUpDownSpaceKeys;
 exports.homeEndKeys = homeEndKeys;
 exports.monthNames = monthNames;
 exports.weekDays = weekDays;
-//# sourceMappingURL=constants.js.map