@elliemae/ds-controlled-form 2.0.0-next.9 → 2.0.0-rc.12

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/Styleds.js

@@ -2,111 +2,232 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
 var styled = require('styled-components');
+var dsSystem = require('@elliemae/ds-system');
 var dsGrid = require('@elliemae/ds-grid');
-var dsButton = require('@elliemae/ds-button');
+var DSButton = require('@elliemae/ds-button');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
+var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-/* eslint-disable max-lines */
-const StyledIconTriggerButton = /*#__PURE__*/styled__default["default"](dsButton.DSButtonV2).withConfig({
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
+const focusBorder = dsSystem.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n  &:after {\n    position: absolute;\n    content: '';\n    top: -2px;\n    left: -2px;\n    width: calc(100% + 4px);\n    height: calc(100% + 4px);\n    border-radius: 50%;\n    border: 2px solid ", ";\n  }\n"])), _ref => {
+  let {
+    theme,
+    isDisabled
+  } = _ref;
+  return isDisabled ? theme.colors.danger[900] : theme.colors.brand[700];
+});
+const diagonalLine = dsSystem.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n  &:before {\n    position: absolute;\n    content: '';\n    top: 48%;\n    left: -1px;\n    height: 1px;\n    width: calc(100% + 2px);\n    transform: rotate(45deg);\n    background-color: ", ";\n  }\n"])), _ref2 => {
+  let {
+    theme,
+    isCurrentListItem,
+    selected
+  } = _ref2;
+  if (selected) return theme.colors.neutral['000'];
+  if (isCurrentListItem) return theme.colors.danger[900];
+  return theme.colors.neutral[500];
+});
+const fontColorPerStatus = dsSystem.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default["default"](["\n  ", ";\n"])), _ref3 => {
+  let {
+    theme,
+    isDisabled,
+    isCurrentListItem,
+    selected
+  } = _ref3;
+  if (selected) return theme.colors.neutral['000'];
+  if (isDisabled && isCurrentListItem) return theme.colors.danger[900];
+  if (isDisabled) return theme.colors.neutral[500];
+  if (isCurrentListItem) return theme.colors.brand[600];
+  return theme.colors.neutral[800];
+});
+const hoverBgPerStatus = dsSystem.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral__default["default"](["\n  ", "\n"])), _ref4 => {
+  let {
+    theme,
+    selected,
+    isDisabled
+  } = _ref4;
+  if (isDisabled && selected) return theme.colors.danger[900];
+  if (selected) return theme.colors.brand[700];
+  return theme.colors.neutral['000'];
+});
+const StyledIconTriggerButton = /*#__PURE__*/styled__default["default"](DSButton.DSButtonV2).withConfig({
   componentId: "sc-1nsw31l-0"
-})(["color:", ";width:26px;height:26px;"], ({
-  theme
-}) => theme.colors.brand['600']);
+})(["color:", ";width:26px;height:26px;"], _ref5 => {
+  let {
+    theme
+  } = _ref5;
+  return theme.colors.brand['600'];
+});
 const StyledWheelList = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1nsw31l-1"
-})(["width:100%;height:100%;margin:auto;padding:0;position:relative;display:flex;flex-direction:column;align-items:center;&:focus-within{&:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;border-radius:2px;border:2px solid ", ";box-shadow:0 0 2px ", ";}}"], ({
-  theme
-}) => theme.colors.brand[700], ({
-  theme
-}) => theme.colors.brand[700]);
+})(["width:100%;height:100%;margin:auto;padding:0;position:relative;display:flex;flex-direction:column;align-items:center;&:focus-within{&:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;border-radius:2px;border:2px solid ", ";box-shadow:0 0 2px ", ";}}"], _ref6 => {
+  let {
+    theme
+  } = _ref6;
+  return theme.colors.brand[700];
+}, _ref7 => {
+  let {
+    theme
+  } = _ref7;
+  return theme.colors.brand[700];
+});
 const StyledTimePickerContainer = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1nsw31l-2"
-})(["display:grid;position:relative;grid-template-columns:192px;grid-template-rows:36px 30px auto;grid-template-areas:'TimePickerHead' 'TimePickerWheelsLegend' 'VerticalWheelWrapper';", ""], ({
-  showShadow,
-  isControllerOnly
-}) => showShadow && !isControllerOnly ? "\n  box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);\n  " : '');
+})(["display:grid;position:relative;grid-template-columns:192px;grid-template-rows:36px 30px auto;grid-template-areas:'TimePickerHead' 'TimePickerWheelsLegend' 'VerticalWheelWrapper';", ""], _ref8 => {
+  let {
+    showShadow,
+    isControllerOnly
+  } = _ref8;
+  return showShadow && !isControllerOnly ? "\n  box-shadow: 0 6px 20px 0 rgb(0 0 0 / 24%), 0 8px 17px 0 rgb(0 0 0 / 19%);\n  " : '';
+});
 const StyledTimePickerHead = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
   componentId: "sc-1nsw31l-3"
-})(["width:100%;grid-area:TimePickerHead;justify-content:center;align-items:center;background:", ";"], ({
-  theme
-}) => theme.colors.neutral['050']);
+})(["width:100%;grid-area:TimePickerHead;justify-content:center;align-items:center;background:", ";"], _ref9 => {
+  let {
+    theme
+  } = _ref9;
+  return theme.colors.neutral['050'];
+});
 const StyledTimePickerWheelsLegend = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1nsw31l-4"
-})(["width:100%;height:100;grid-area:TimePickerWheelsLegend;display:grid;grid-template-columns:", " ", " ", ";align-items:center;justify-content:center;text-align:center;background:", ";"], ({
-  theme
-}) => theme.space.xl, ({
-  theme
-}) => theme.space.xl, ({
-  theme
-}) => theme.space.xl, ({
-  theme
-}) => theme.colors.neutral['050']);
+})(["width:100%;height:100;grid-area:TimePickerWheelsLegend;display:grid;grid-template-columns:", " ", " ", ";align-items:center;justify-content:center;text-align:center;background:", ";"], _ref10 => {
+  let {
+    theme
+  } = _ref10;
+  return theme.space.xl;
+}, _ref11 => {
+  let {
+    theme
+  } = _ref11;
+  return theme.space.xl;
+}, _ref12 => {
+  let {
+    theme
+  } = _ref12;
+  return theme.space.xl;
+}, _ref13 => {
+  let {
+    theme
+  } = _ref13;
+  return theme.colors.neutral['050'];
+});
 const StyledTimePickerWheelWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1nsw31l-5"
-})(["width:100%;background:", ";grid-area:VerticalWheelWrapper;display:grid;grid-template-columns:", " ", " ", ";grid-template-rows:100%;& ul:not(:last-child){position:relative;&:after{content:'';position:absolute;left:100%;top:5%;height:90%;width:1px;background:", ";}}"], ({
-  theme
-}) => theme.colors.neutral['000'], ({
-  theme
-}) => theme.space.xl, ({
-  theme
-}) => theme.space.xl, ({
-  theme
-}) => theme.space.xl, ({
-  theme
-}) => theme.colors.neutral[200]);
-const StyledTimeBtn = /*#__PURE__*/styled__default["default"](dsButton.DSButtonV2).withConfig({
+})(["width:100%;background:", ";grid-area:VerticalWheelWrapper;display:grid;grid-template-columns:", " ", " ", ";grid-template-rows:100%;& ul:not(:last-child){position:relative;&:after{content:'';position:absolute;left:100%;top:5%;height:90%;width:1px;background:", ";}}"], _ref14 => {
+  let {
+    theme
+  } = _ref14;
+  return theme.colors.neutral['000'];
+}, _ref15 => {
+  let {
+    theme
+  } = _ref15;
+  return theme.space.xl;
+}, _ref16 => {
+  let {
+    theme
+  } = _ref16;
+  return theme.space.xl;
+}, _ref17 => {
+  let {
+    theme
+  } = _ref17;
+  return theme.space.xl;
+}, _ref18 => {
+  let {
+    theme
+  } = _ref18;
+  return theme.colors.neutral[200];
+});
+const StyledTimeBtn = /*#__PURE__*/styled__default["default"](DSButton.DSButtonV2).withConfig({
   componentId: "sc-1nsw31l-6"
-})(["position:relative;height:", ";width:", ";min-width:", ";padding:0;border-radius:50%;font-weight:", ";color:", ";&:focus:not([disabled]){&:after{border:none;}}", " ", ""], ({
-  theme
-}) => theme.space.s, ({
-  theme
-}) => theme.space.s, ({
-  theme
-}) => theme.space.s, ({
-  theme
-}) => theme.fontWeights.regular, ({
-  theme
-}) => theme.colors.neutral[800], ({
-  theme,
-  isDisabled,
-  selected
-}) => isDisabled ? "\n    color: ".concat(selected ? theme.colors.neutral['000'] : theme.colors.neutral[500], ";\n    cursor: not-allowed;\n    background-color:").concat(selected ? theme.colors.danger[900] : theme.colors.neutral['000'], ";\n    font-weight: ").concat(selected ? theme.fontWeights.semibold : '', ";\n\n    &:before {\n      cursor: not-allowed;\n      position: absolute;\n      content: '';\n      top: 47%;\n      left: 0;\n      width: 100%;\n      height: 1px;\n      background-color: ").concat(selected ? theme.colors.neutral['000'] : theme.colors.neutral[500], ";\n      transform: rotate(45deg);\n      pointer-events: none;\n    }\n    &:hover {\n      color:").concat(selected ? theme.colors.neutral['000'] : theme.colors.neutral[500], ";\n      background-color:").concat(selected ? theme.colors.danger[900] : theme.colors.neutral['000'], ";\n    }\n  ") : "\n      ".concat(selected ? "\n      color: ".concat(theme.colors.neutral['000'], ";\n      background-color:").concat(theme.colors.brand[700], ";\n      font-weight: ").concat(theme.fontWeights.semibold, ";\n      &:hover {\n        color:").concat(theme.colors.neutral['000'], ";\n        background-color:").concat(theme.colors.brand[700], ";\n      }\n      ") : "\n      color: ".concat(theme.colors.neutral[800], ";\n      background-color:").concat(theme.colors.neutral['000'], ";\n      "), "\n  "), ({
-  theme,
-  isCurrentListItem,
-  selected,
-  isDisabled
-}) => isCurrentListItem && !selected ? "\n        color: ".concat(isDisabled ? theme.colors.danger[900] : theme.colors.brand[700], ";\n        &:after {\n          position: absolute;\n          content: '';\n          border-radius: 50%;\n          top: -2px;\n          left: -2px;\n          width: calc(100% + 4px);\n          height: calc(100% + 4px);\n          border: 2px solid ").concat(isDisabled ? theme.colors.danger[900] : theme.colors.brand[700], ";\n          pointer-events: none;\n        }\n        ").concat(isDisabled ? "\n          color: ".concat(theme.colors.danger[900], ";\n          &:hover {\n            color:").concat(theme.colors.danger[900], ";\n          }          \n          &:before{\n            background-color: ").concat(theme.colors.danger[900], ";\n          }\n        ") : '', "\n        ") : '');
+})(["position:relative;height:", ";width:", ";border-radius:50%;&:hover{background-color:", ";}color:", ";", " ", " ", ";"], _ref19 => {
+  let {
+    theme
+  } = _ref19;
+  return theme.space.s;
+}, _ref20 => {
+  let {
+    theme
+  } = _ref20;
+  return theme.space.s;
+}, hoverBgPerStatus, fontColorPerStatus, _ref21 => {
+  let {
+    selected,
+    isCurrentListItem
+  } = _ref21;
+  return isCurrentListItem && !selected ? focusBorder : "";
+}, _ref22 => {
+  let {
+    isDisabled
+  } = _ref22;
+  return isDisabled ? dsSystem.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral__default["default"](["\n          cursor: not-allowed;\n          ", ";\n        "])), diagonalLine) : "";
+}, _ref23 => {
+  let {
+    theme,
+    selected,
+    isDisabled
+  } = _ref23;
+  return selected ? dsSystem.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral__default["default"](["\n    font-weight: ", ";\n    background-color ", ";\n    "])), theme.fontWeights.semibold, isDisabled ? theme.colors.danger[900] : theme.colors.brand[700]) : "";
+});
 const StyledWheelListItem = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-1nsw31l-7"
 })(["margin:auto;width:36px;height:36px;display:flex;align-items:center;justify-content:center;position:relative;"]);
-const StyledWheelChangeTimeBtn = /*#__PURE__*/styled__default["default"](dsButton.DSButtonV2).withConfig({
+const StyledWheelChangeTimeBtn = /*#__PURE__*/styled__default["default"](DSButton.DSButtonV2).withConfig({
   componentId: "sc-1nsw31l-8"
-})(["height:", ";width:", ";min-width:", ";border-radius:50%;"], ({
-  theme
-}) => theme.space.s, ({
-  theme
-}) => theme.space.s, ({
-  theme
-}) => theme.space.s);
+})(["height:", ";width:", ";min-width:", ";border-radius:50%;"], _ref24 => {
+  let {
+    theme
+  } = _ref24;
+  return theme.space.s;
+}, _ref25 => {
+  let {
+    theme
+  } = _ref25;
+  return theme.space.s;
+}, _ref26 => {
+  let {
+    theme
+  } = _ref26;
+  return theme.space.s;
+});
 const TimeWheelFooterMessage = /*#__PURE__*/styled__default["default"].footer.withConfig({
   componentId: "sc-1nsw31l-9"
-})(["border-top:solid 1px ", ";margin:0 ", ";padding:", " 0;color:", ";font-style:italic;font-weight:", ";font-size:", ";text-align:right;"], ({
-  theme
-}) => theme.colors.neutral[300], ({
-  theme
-}) => theme.space.xxs2, ({
-  theme
-}) => theme.space.xxs2, ({
-  theme
-}) => theme.colors.danger[900], ({
-  theme
-}) => theme.fontWeights.thin, ({
-  theme
-}) => theme.fontSizes.microText[200]);
+})(["border-top:solid 1px ", ";margin:0 ", ";padding:", " 0;color:", ";font-style:italic;font-weight:", ";font-size:", ";text-align:right;"], _ref27 => {
+  let {
+    theme
+  } = _ref27;
+  return theme.colors.neutral[300];
+}, _ref28 => {
+  let {
+    theme
+  } = _ref28;
+  return theme.space.xxs2;
+}, _ref29 => {
+  let {
+    theme
+  } = _ref29;
+  return theme.space.xxs2;
+}, _ref30 => {
+  let {
+    theme
+  } = _ref30;
+  return theme.colors.danger[900];
+}, _ref31 => {
+  let {
+    theme
+  } = _ref31;
+  return theme.fontWeights.thin;
+}, _ref32 => {
+  let {
+    theme
+  } = _ref32;
+  return theme.fontSizes.microText[200];
+});
 
 exports.StyledIconTriggerButton = StyledIconTriggerButton;
 exports.StyledTimeBtn = StyledTimeBtn;

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheel.js

@@ -16,9 +16,10 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
 var _TimeWheelIconTrigger, _TimeWheelWrapper;
 
-const WrappedTimeWheelContext = ({
-  children
-}) => {
+const WrappedTimeWheelContext = _ref => {
+  let {
+    children
+  } = _ref;
   const ctx = useConfigTimePickerCTX.useConfigTimePickerCTX();
   return /*#__PURE__*/_jsx__default["default"](TimeWheelContext.TimeWheelContext.Provider, {
     value: ctx

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContent.js

@@ -18,9 +18,10 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 var _StyledTimePickerWhee, _StyledTimePickerWhee2, _TimeWheelFooter;
-const TimeWheelContent = /*#__PURE__*/React__default["default"].memo(({
-  showShadow
-}) => {
+const TimeWheelContent = /*#__PURE__*/React__default["default"].memo(_ref => {
+  let {
+    showShadow
+  } = _ref;
   const {
     hours,
     minutes,

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContext.js

@@ -67,7 +67,8 @@ const defaultTimePickerContext = {
   prevMeridiemBtnRef: /*#__PURE__*/React.createRef(),
   currMeridiemBtnRef: /*#__PURE__*/React.createRef(),
   nextMeridiemBtnRef: /*#__PURE__*/React.createRef(),
-  getIsDisabledTime: () => false
+  getIsDisabledTime: () => false,
+  disabled: false
 };
 /** Context for cross component communication */
 

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js

@@ -4,17 +4,16 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');
-var dsIcon = require('@elliemae/ds-icon');
-var dsButton = require('@elliemae/ds-button');
-var RecentDocuments = require('@elliemae/ds-icons/RecentDocuments');
+var DSButton = require('@elliemae/ds-button');
+var dsIcons = require('@elliemae/ds-icons');
 var TimeWheelContext = require('./TimeWheelContext.js');
 var ControlledDateTimePickerDatatestid = require('../../../ControlledDateTimePickerDatatestid.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
-var RecentDocuments__default = /*#__PURE__*/_interopDefaultLegacy(RecentDocuments);
 
+var _RecentDocuments;
 // this is particularly useful due to how usePopper needs to check the references
 // since references are saved in a immutable way, we make sure to shortcircuit useless-re-renders
 
@@ -23,19 +22,19 @@ const TimeWheelIconTrigger = () => {
     handleSetTriggerRef,
     handleToggleTimePicker,
     handlePickerIconKeyDown,
-    ariaCurrentValueForInputs
+    ariaCurrentValueForInputs,
+    disabled
   } = React.useContext(TimeWheelContext.TimeWheelContext);
-  return React.useMemo(() => /*#__PURE__*/_jsx__default["default"](dsButton.DSButtonV2, {
+  return React.useMemo(() => /*#__PURE__*/_jsx__default["default"](DSButton.DSButtonV2, {
     "aria-label": "time picker context menu trigger, ".concat(ariaCurrentValueForInputs),
     buttonType: "icon",
-    size: dsButton.BUTTON_SIZES.M,
+    size: DSButton.BUTTON_SIZES.M,
     innerRef: handleSetTriggerRef,
     onClick: handleToggleTimePicker,
     onKeyDown: handlePickerIconKeyDown,
-    "data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.PICKER_ICONS.TIMEWHEEL
-  }, void 0, /*#__PURE__*/_jsx__default["default"](RecentDocuments__default["default"], {
-    color: dsIcon.DSIconColors.PRIMARY
-  })), [ariaCurrentValueForInputs, handlePickerIconKeyDown, handleSetTriggerRef, handleToggleTimePicker]);
+    "data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.PICKER_ICONS.TIMEWHEEL,
+    disabled: disabled
+  }, void 0, _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx__default["default"](dsIcons.RecentDocuments, {}))), [ariaCurrentValueForInputs, disabled, handlePickerIconKeyDown, handleSetTriggerRef, handleToggleTimePicker]);
 };
 
 exports.TimeWheelIconTrigger = TimeWheelIconTrigger;

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelWrapper.js

@@ -2,6 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var React = require('react');

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/useConfigTimePickerCTX.js

@@ -11,19 +11,12 @@ var useKeyboardHandlers = require('./useKeyboardHandlers.js');
 /* eslint-disable max-statements */
 const useConfigTimePickerCTX = () => {
   const {
-    pickerButtonRef,
     props: {
       minutesInterval,
       getIsDisabledTime,
-      onPickerClose,
-      onPickerOpen
+      disabled
     },
-    hideDate,
-    hideTime,
-    monthInputRef,
-    hourInputRef,
     tempTimeString,
-    prevMonthBtnRef,
     prevHourBtnRef,
     currHourBtnRef,
     nextHourBtnRef,
@@ -34,7 +27,6 @@ const useConfigTimePickerCTX = () => {
     currMeridiemBtnRef,
     nextMeridiemBtnRef,
     isControllerOnly,
-    isWithCalendarToo,
     autoFocusHourTimeWheel,
     ariaCurrentValueForInputs
   } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
@@ -51,12 +43,6 @@ const useConfigTimePickerCTX = () => {
     handlePrevMinute,
     handleNextMinute,
     handleTimeWheelBtnChangeMinutes,
-    // currSecondNum,
-    // seconds,
-    // visibleSeconds,
-    // handlePrevSecond,
-    // handleNextSecond,
-    // handleTimeWheelBtnChangeSeconds,
     meridiem,
     handleTimeWheelBtnChangeMeridiem
   } = useCurrentDisplayedWheelsLogic.useCurrentDisplayedWheelsLogic({
@@ -71,13 +57,7 @@ const useConfigTimePickerCTX = () => {
     handleToggleTimePicker,
     handleSetTriggerRef,
     handleMenuWrapperKeyDown
-  } = usePopperTriggerLogic.usePopperTriggerLogic({
-    pickerButtonRef,
-    currHourBtnRef,
-    onPickerClose,
-    onPickerOpen,
-    isWithCalendarToo
-  });
+  } = usePopperTriggerLogic.usePopperTriggerLogic();
   const {
     handlePrevHourBtnOnKeyDown,
     handleCurrHourOnKeyDown,
@@ -85,9 +65,6 @@ const useConfigTimePickerCTX = () => {
     handlePrevMinuteBtnOnKeyDown,
     handleCurrMinutesOnKeyDown,
     handleNextMinuteBtnOnKeyDown,
-    // handlePrevSecondBtnOnKeyDown,
-    // handleCurrSecondsOnKeyDown,
-    // handleNextSecondBtnOnKeyDown,
     handlePrevMeridiemBtnOnKeyDown,
     handleCurrMeridiemOnKeyDown,
     handleNextMeridiemBtnOnKeyDown,
@@ -97,28 +74,7 @@ const useConfigTimePickerCTX = () => {
     handleNextHour,
     handlePrevMinute,
     handleNextMinute,
-    // handlePrevSecond,
-    // handleNextSecond,
-    handleTimeWheelBtnChangeMeridiem,
-    prevMonthBtnRef,
-    prevHourBtnRef,
-    currHourBtnRef,
-    nextHourBtnRef,
-    prevMinutesBtnRef,
-    currMinutesBtnRef,
-    nextMinutesBtnRef,
-    // prevSecondsBtnRef,
-    // currSecondsBtnRef,
-    // nextSecondsBtnRef,
-    prevMeridiemBtnRef,
-    currMeridiemBtnRef,
-    nextMeridiemBtnRef,
-    hideDate,
-    hideTime,
-    monthInputRef,
-    hourInputRef,
-    isWithCalendarToo,
-    isControllerOnly
+    handleTimeWheelBtnChangeMeridiem
   });
   return React.useMemo(() => ({
     tempTimeString,
@@ -144,12 +100,6 @@ const useConfigTimePickerCTX = () => {
     handlePrevMinute,
     handleNextMinute,
     handleTimeWheelBtnChangeMinutes,
-    // currSecondNum,
-    // seconds,
-    // visibleSeconds,
-    // handlePrevSecond,
-    // handleNextSecond,
-    // handleTimeWheelBtnChangeSeconds,
     meridiem,
     handleTimeWheelBtnChangeMeridiem,
     handlePrevHourBtnOnKeyDown,
@@ -158,9 +108,6 @@ const useConfigTimePickerCTX = () => {
     handlePrevMinuteBtnOnKeyDown,
     handleCurrMinutesOnKeyDown,
     handleNextMinuteBtnOnKeyDown,
-    // handlePrevSecondBtnOnKeyDown,
-    // handleCurrSecondsOnKeyDown,
-    // handleNextSecondBtnOnKeyDown,
     handlePrevMeridiemBtnOnKeyDown,
     handleCurrMeridiemOnKeyDown,
     handleNextMeridiemBtnOnKeyDown,
@@ -171,15 +118,13 @@ const useConfigTimePickerCTX = () => {
     prevMinutesBtnRef,
     currMinutesBtnRef,
     nextMinutesBtnRef,
-    // prevSecondsBtnRef,
-    // currSecondsBtnRef,
-    // nextSecondsBtnRef,
     prevMeridiemBtnRef,
     currMeridiemBtnRef,
     nextMeridiemBtnRef,
     getIsDisabledTime,
-    ariaCurrentValueForInputs
-  }), [tempTimeString, isControllerOnly, autoFocusHourTimeWheel, showTimePicker, setShowTimePicker, setPopperElement, setArrowElement, usePopperHelpers, handleToggleTimePicker, handleSetTriggerRef, handleMenuWrapperKeyDown, currHourNum, hours, visibleHours, handlePrevHour, handleNextHour, handleTimeWheelBtnChangeHours, currMinuteNum, minutes, visibleMinutes, handlePrevMinute, handleNextMinute, handleTimeWheelBtnChangeMinutes, meridiem, handleTimeWheelBtnChangeMeridiem, handlePrevHourBtnOnKeyDown, handleCurrHourOnKeyDown, handleNextHourBtnOnKeyDown, handlePrevMinuteBtnOnKeyDown, handleCurrMinutesOnKeyDown, handleNextMinuteBtnOnKeyDown, handlePrevMeridiemBtnOnKeyDown, handleCurrMeridiemOnKeyDown, handleNextMeridiemBtnOnKeyDown, handlePickerIconKeyDown, prevHourBtnRef, currHourBtnRef, nextHourBtnRef, prevMinutesBtnRef, currMinutesBtnRef, nextMinutesBtnRef, prevMeridiemBtnRef, currMeridiemBtnRef, nextMeridiemBtnRef, getIsDisabledTime, ariaCurrentValueForInputs]);
+    ariaCurrentValueForInputs,
+    disabled
+  }), [tempTimeString, isControllerOnly, autoFocusHourTimeWheel, showTimePicker, setShowTimePicker, setPopperElement, setArrowElement, usePopperHelpers, handleToggleTimePicker, handleSetTriggerRef, handleMenuWrapperKeyDown, currHourNum, hours, visibleHours, handlePrevHour, handleNextHour, handleTimeWheelBtnChangeHours, currMinuteNum, minutes, visibleMinutes, handlePrevMinute, handleNextMinute, handleTimeWheelBtnChangeMinutes, meridiem, handleTimeWheelBtnChangeMeridiem, handlePrevHourBtnOnKeyDown, handleCurrHourOnKeyDown, handleNextHourBtnOnKeyDown, handlePrevMinuteBtnOnKeyDown, handleCurrMinutesOnKeyDown, handleNextMinuteBtnOnKeyDown, handlePrevMeridiemBtnOnKeyDown, handleCurrMeridiemOnKeyDown, handleNextMeridiemBtnOnKeyDown, handlePickerIconKeyDown, prevHourBtnRef, currHourBtnRef, nextHourBtnRef, prevMinutesBtnRef, currMinutesBtnRef, nextMinutesBtnRef, prevMeridiemBtnRef, currMeridiemBtnRef, nextMeridiemBtnRef, getIsDisabledTime, ariaCurrentValueForInputs, disabled]);
 };
 
 exports.useConfigTimePickerCTX = useConfigTimePickerCTX;

package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/useCurrentDisplayedWheelsLogic.js

@@ -2,25 +2,28 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
 var React = require('react');
 var useTimeInputs = require('../../TimeInputs/useTimeInputs.js');
 var numberHelpers = require('../../../utils/numberHelpers.js');
 var stringHelpers = require('../../../utils/stringHelpers.js');
 
-/* eslint-disable max-statements */
 const totalHoursList = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'];
 const hoursInterval = 1; // using this just to unify the logic between how hours and minutes are handled
 
 const hoursStartPositionOffset = 1; // if array start from 01, this is 1, if start from 02, it's 2 ...
 
-const getTotalMinuteListWithStep = (step = 1) => {
+const getTotalMinuteListWithStep = function () {
+  let step = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 1;
   const length = Math.ceil(60 / step);
   return new Array(length).fill('_').map((_v, i) => stringHelpers.prependStringWithPlaceHolders("".concat(i * step), 2));
 };
 
-const useCurrentDisplayedWheelsLogic = ({
-  minutesInterval
-}) => {
+const useCurrentDisplayedWheelsLogic = _ref => {
+  let {
+    minutesInterval
+  } = _ref;
   const {
     hours,
     minutes,