@elliemae/ds-time-picker 2.0.0-alpha.1 → 2.0.0-alpha.13

package/cjs/TimePickerMenu.js

@@ -2,25 +2,31 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
+var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/esnext.async-iterator.map.js');
+require('core-js/modules/esnext.iterator.map.js');
+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 React = require('react');
-var utils$1 = require('@elliemae/ds-utilities/utils');
 var dsClassnames = require('@elliemae/ds-classnames');
 var moment = require('moment');
-var timeUtils = require('@elliemae/ds-utilities/timeUtils');
+var dsUtilities = require('@elliemae/ds-utilities');
 var utils = require('./utils.js');
 var PickerPanel = require('./PickerPanel.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
 
 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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(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 = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const blockName = 'time-picker-menu';
 const TimePickerContainer = dsClassnames.aggregatedClasses('div')(blockName);
 const TimePickerHeader = dsClassnames.aggregatedClasses('div')(blockName, 'header');
@@ -35,15 +41,15 @@ class TimePickerMenu extends React.Component {
   constructor(props) {
     super(props);
 
-    _defineProperty__default['default'](this, "renderHeader", () => {
+    this.renderHeader = () => {
       const {
         time
       } = this.state;
-      return /*#__PURE__*/_jsx__default['default'](TimePickerHeader, {}, void 0, time.format('hh:mma'));
-    });
+      return /*#__PURE__*/_jsx__default["default"](TimePickerHeader, {}, void 0, time.format('hh:mma'));
+    };
 
     this.state = {
-      time: moment__default['default'](props.time || '', props.format) || moment__default['default']()
+      time: moment__default["default"](props.time || '', props.format) || moment__default["default"]()
     };
     this.handleHoursChange = this.handleHoursChange.bind(this);
     this.handleMinuteChange = this.handleMinuteChange.bind(this);
@@ -54,7 +60,7 @@ class TimePickerMenu extends React.Component {
   static getDerivedStateFromProps(props, state) {
     if (props.time) {
       return _objectSpread(_objectSpread({}, state), {}, {
-        time: moment__default['default'](props.time)
+        time: moment__default["default"](props.time)
       });
     }
 
@@ -158,9 +164,9 @@ class TimePickerMenu extends React.Component {
 
     const meridiem = hour >= 12 ? 'PM' : 'AM';
     const withLeadingZeros = format.indexOf('hh') > -1;
-    const rangeHours = use12Hours ? utils$1.range(1, 13) : utils$1.range(24);
-    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && timeUtils.addLeadingZeros(2)));
-    return /*#__PURE__*/_jsx__default['default'](PickerPanel, {
+    const rangeHours = use12Hours ? dsUtilities.range(1, 13) : dsUtilities.range(24);
+    const hoursOptions = rangeHours.map(generateOption(withLeadingZeros && dsUtilities.addLeadingZeros(2)));
+    return /*#__PURE__*/_jsx__default["default"](PickerPanel, {
       type: "hour",
       time: time,
       meridiem: meridiem,
@@ -186,7 +192,7 @@ class TimePickerMenu extends React.Component {
     } = this.props;
     if (!showMinutes) return null;
     const withLeadingZeros = format.indexOf('mm') > -1;
-    const rangeMinutes = utils$1.range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && timeUtils.addLeadingZeros(2)));
+    const rangeMinutes = dsUtilities.range(0, 60, minutesInterval).map(generateOption(withLeadingZeros && dsUtilities.addLeadingZeros(2)));
     let selectedMinute = time.minute();
     const selectedHour = time.hour();
 
@@ -207,7 +213,7 @@ class TimePickerMenu extends React.Component {
       }
     }
 
-    return /*#__PURE__*/_jsx__default['default'](PickerPanel, {
+    return /*#__PURE__*/_jsx__default["default"](PickerPanel, {
       type: "minutes",
       time: time,
       hasHeader: hasHeader,
@@ -230,8 +236,8 @@ class TimePickerMenu extends React.Component {
     } = this.props;
     if (!showSeconds) return null;
     const withLeadingZeros = format.indexOf('ss') > -1;
-    const rangeSeconds = utils$1.range(60).map(generateOption(withLeadingZeros && timeUtils.addLeadingZeros(2)));
-    return /*#__PURE__*/_jsx__default['default'](PickerPanel, {
+    const rangeSeconds = dsUtilities.range(60).map(generateOption(withLeadingZeros && dsUtilities.addLeadingZeros(2)));
+    return /*#__PURE__*/_jsx__default["default"](PickerPanel, {
       type: "seconds",
       hasHeader: hasHeader,
       header: "S",
@@ -265,7 +271,7 @@ class TimePickerMenu extends React.Component {
       }
     }
 
-    return /*#__PURE__*/_jsx__default['default'](PickerPanel, {
+    return /*#__PURE__*/_jsx__default["default"](PickerPanel, {
       type: "meridiem",
       hasHeader: hasHeader,
       header: "",
@@ -286,13 +292,13 @@ class TimePickerMenu extends React.Component {
     const {
       hasHeaderDisplay
     } = this.props;
-    return /*#__PURE__*/_jsx__default['default'](TimePickerContainer, {}, void 0, hasHeaderDisplay && this.renderHeader(), /*#__PURE__*/_jsx__default['default'](TimePickerPanelContainer, {}, void 0, this.renderHoursPanel(), this.renderMinutesPanel(), this.renderSecondsPanel(), this.renderAMPMPanel()));
+    return /*#__PURE__*/_jsx__default["default"](TimePickerContainer, {}, void 0, hasHeaderDisplay && this.renderHeader(), /*#__PURE__*/_jsx__default["default"](TimePickerPanelContainer, {}, void 0, this.renderHoursPanel(), this.renderMinutesPanel(), this.renderSecondsPanel(), this.renderAMPMPanel()));
   }
 
 }
 
 TimePickerMenu.defaultProps = {
-  time: moment__default['default'](),
+  time: moment__default["default"](),
   hasHeader: false,
   use12Hours: true,
   showSeconds: true,
@@ -303,4 +309,4 @@ TimePickerMenu.defaultProps = {
 };
 
 exports.TimePickerMenu = TimePickerMenu;
-exports['default'] = TimePickerMenu;
+exports["default"] = TimePickerMenu;

package/cjs/index.js

@@ -11,7 +11,7 @@ var utils = require('./utils.js');
 
 exports.DSTimePicker = DSTimePicker.DSTimePicker;
 exports.DSTimePickerWithSchema = DSTimePicker.DSTimePickerWithSchema;
-exports.default = DSTimePicker.DSTimePicker;
+exports["default"] = DSTimePicker.DSTimePicker;
 exports.TimePickerMenu = TimePickerMenu.TimePickerMenu;
 exports.DSTimePickerMenu = DSTimePickerMenu.DSTimePickerMenu;
 exports.convertTimeString = utils.convertTimeString;

package/cjs/moveElementOnScroll.js

@@ -2,15 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-function MoveElementOnScroll(element, {
-  container,
-  min = 0,
-  max = element.offsetHeight,
-  speed = 1,
-  smooth = 2,
-  onUpdate = () => null,
-  onEndScroll = () => null
-}) {
+function MoveElementOnScroll(element, _ref) {
+  let {
+    container,
+    min = 0,
+    max = element.offsetHeight,
+    speed = 1,
+    smooth = 2,
+    onUpdate = () => null,
+    onEndScroll = () => null
+  } = _ref;
   let moving = false;
   let pos = min;
   let lastPos = pos; // todo: move this to utils if we finally need it
@@ -71,4 +72,4 @@ function MoveElementOnScroll(element, {
 }
 
 exports.MoveElementOnScroll = MoveElementOnScroll;
-exports['default'] = MoveElementOnScroll;
+exports["default"] = MoveElementOnScroll;

package/cjs/utils.js

@@ -7,7 +7,8 @@ const validateIndex = (index, options) => {
   if (index >= options.length) return options.length - 1;
   return index;
 };
-const getOptionIndex = (options, selectedOption, valueProperty = 'value') => {
+const getOptionIndex = function (options, selectedOption) {
+  let valueProperty = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'value';
   const index = options.findIndex(option => option[valueProperty] === selectedOption);
   return validateIndex(index, options);
 };

package/esm/DSTimePicker.js

@@ -4,45 +4,48 @@ import moment from 'moment';
 import TimePickerImpl from './TimePickerImpl.js';
 import { jsx } from 'react/jsx-runtime';
 
-const DSTimePicker = ({
-  containerProps = {},
-  innerRef,
-  className = '',
-  disabled = false,
-  value = '',
-  format,
-  style = {},
-  onChange = () => null,
-  onOpen = () => null,
-  isOpen = undefined,
-  clearable = false,
-  hasHeader = true,
-  hasHeaderDisplay = false,
-  'aria-label': ariaLabel,
-  zIndex = 'auto',
-  placement = 'bottom',
-  disabledTimes,
-  minutesInterval = 1
-}) => /*#__PURE__*/jsx(TimePickerImpl, {
-  ref: innerRef,
-  "aria-label": ariaLabel,
-  className: className,
-  clearable: clearable,
-  containerProps: containerProps,
-  disabled: disabled,
-  format: format,
-  hasHeader: hasHeader,
-  hasHeaderDisplay: hasHeaderDisplay,
-  isOpen: isOpen,
-  onChange: onChange,
-  onOpen: onOpen,
-  placement: placement,
-  style: style,
-  value: value,
-  zIndex: zIndex,
-  minutesInterval: minutesInterval,
-  disabledTimes: disabledTimes
-});
+const DSTimePicker = _ref => {
+  let {
+    containerProps = {},
+    innerRef,
+    className = '',
+    disabled = false,
+    value = '',
+    format,
+    style = {},
+    onChange = () => null,
+    onOpen = () => null,
+    isOpen = undefined,
+    clearable = false,
+    hasHeader = true,
+    hasHeaderDisplay = false,
+    'aria-label': ariaLabel,
+    zIndex = 'auto',
+    placement = 'bottom',
+    disabledTimes,
+    minutesInterval = 1
+  } = _ref;
+  return /*#__PURE__*/jsx(TimePickerImpl, {
+    ref: innerRef,
+    "aria-label": ariaLabel,
+    className: className,
+    clearable: clearable,
+    containerProps: containerProps,
+    disabled: disabled,
+    format: format,
+    hasHeader: hasHeader,
+    hasHeaderDisplay: hasHeaderDisplay,
+    isOpen: isOpen,
+    onChange: onChange,
+    onOpen: onOpen,
+    placement: placement,
+    style: style,
+    value: value,
+    zIndex: zIndex,
+    minutesInterval: minutesInterval,
+    disabledTimes: disabledTimes
+  });
+};
 
 DSTimePicker.defaultProps = {
   format: 'hh:mm:ss A'

package/esm/DSTimePickerMenu.js

@@ -1,3 +1,8 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import 'react';

package/esm/PickerPanel.js

@@ -1,11 +1,20 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/web.dom-collections.iterator.js';
+import 'core-js/modules/esnext.async-iterator.find.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.find.js';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
 import React, { Component } from 'react';
 import { findIndex } from 'lodash';
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 import memoizeOne from 'memoize-one';
-import ChevronSmallUp from '@elliemae/ds-icons/ChevronSmallUp';
-import ChevronSmallDown from '@elliemae/ds-icons/ChevronSmallDown';
+import { ChevronSmallUp, ChevronSmallDown } from '@elliemae/ds-icons';
 import DSButton from '@elliemae/ds-button';
 import { MoveElementOnScroll } from './moveElementOnScroll.js';
 import { validateIndex } from './utils.js';
@@ -17,27 +26,34 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const blockName = 'time-picker-panel';
-const Container = aggregatedClasses('div')(blockName, null, ({
-  scrolling
-}) => ({
-  scrolling
-}));
+const Container = aggregatedClasses('div')(blockName, null, _ref => {
+  let {
+    scrolling
+  } = _ref;
+  return {
+    scrolling
+  };
+});
 const Wrapper = aggregatedClasses('div')(blockName, 'wrapper');
 const PickerItemListContainer = aggregatedClasses('div')(blockName, 'item-list-container');
 const PickerItemList = aggregatedClasses('div')(blockName, 'item-list');
 const PickerHeader = aggregatedClasses('div')(blockName, 'header');
-const PickerItemContainer = aggregatedClasses('div')(blockName, 'item', ({
-  selected,
-  disabled
-}) => ({
-  selected,
-  disabled
-}));
+const PickerItemContainer = aggregatedClasses('div')(blockName, 'item', _ref2 => {
+  let {
+    selected,
+    disabled
+  } = _ref2;
+  return {
+    selected,
+    disabled
+  };
+});
 const PickerSelectedOptionSelected = aggregatedClasses('div')(blockName, 'selected-container');
 const SelectedCircle = aggregatedClasses('div')(blockName, 'selected-circle');
 const ArrowButtonContainer = aggregatedClasses('div')(blockName, 'arrow-container');
 
-const getOptionIndex = (options, selectedOption, valueProperty = 'value') => {
+const getOptionIndex = function (options, selectedOption) {
+  let valueProperty = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 'value';
   const index = options.findIndex(option => option[valueProperty] === selectedOption);
   return validateIndex(index, options);
 };
@@ -51,8 +67,7 @@ const arrowProps = {
 class PickerPanel extends Component {
   constructor(props) {
     super(props);
-
-    _defineProperty(this, "computeContainerTranslation", memoizeOne(index => {
+    this.computeContainerTranslation = memoizeOne(index => {
       const {
         options,
         valueProperty
@@ -65,14 +80,14 @@ class PickerPanel extends Component {
       const listYPosition = this.minYListPosition - selectedOptionIndex * this.optionHeight;
       if (this.scrollHandler && !scrolling) this.scrollHandler.updatePosition(listYPosition);
       return listYPosition;
-    }));
+    });
 
-    _defineProperty(this, "renderHeader", () => {
+    this.renderHeader = () => {
       const {
         header
       } = this.props;
       return /*#__PURE__*/_jsx(PickerHeader, {}, void 0, header);
-    });
+    };
 
     this.pickerListContainerRef = /*#__PURE__*/React.createRef();
     this.pickerListRef = /*#__PURE__*/React.createRef();
@@ -117,9 +132,10 @@ class PickerPanel extends Component {
     this.scrollHandler.unsubscribe();
   }
 
-  static getDerivedStateFromProps(nextProps, {
-    prevProps
-  }) {
+  static getDerivedStateFromProps(nextProps, _ref3) {
+    let {
+      prevProps
+    } = _ref3;
     const {
       selected,
       valueProperty,
@@ -296,7 +312,7 @@ class PickerPanel extends Component {
       innerRef: this.selectedOptionRef
     }, void 0, _SelectedCircle || (_SelectedCircle = /*#__PURE__*/_jsx(SelectedCircle, {}))), /*#__PURE__*/_jsx(ArrowButtonContainer, {}, void 0, /*#__PURE__*/jsx(DSButton, _objectSpread(_objectSpread({}, arrowProps), {}, {
       "aria-label": "Chevron Up",
-      "data-testid": `${type}-chevron-up`,
+      "data-testid": "".concat(type, "-chevron-up"),
       disabled: activeIndex <= 0,
       icon: _ChevronSmallUp || (_ChevronSmallUp = /*#__PURE__*/_jsx(ChevronSmallUp, {})),
       onClick: this.handleStepMoveUp,
@@ -307,10 +323,10 @@ class PickerPanel extends Component {
         height: this.listHeight
       }
     }, void 0, /*#__PURE__*/_jsx(PickerItemList, {
-      "data-testid": `${type}-list`,
+      "data-testid": "".concat(type, "-list"),
       innerRef: this.pickerListRef,
       style: {
-        transform: `translateY(${listYPosition}px)`
+        transform: "translateY(".concat(listYPosition, "px)")
       }
     }, void 0, options.map((option, index) => {
       const value = this.getOptionValue(option);
@@ -355,7 +371,7 @@ class PickerPanel extends Component {
       }, value, label);
     }))), /*#__PURE__*/_jsx(ArrowButtonContainer, {}, void 0, /*#__PURE__*/jsx(DSButton, _objectSpread(_objectSpread({}, arrowProps), {}, {
       "aria-label": "Chevron Down",
-      "data-testid": `${type}-chevron-down`,
+      "data-testid": "".concat(type, "-chevron-down"),
       disabled: activeIndex >= options.length - 1,
       icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx(ChevronSmallDown, {})),
       onClick: this.handleStepMoveDown,

package/esm/TimePickerDropdown.js

@@ -1,42 +1,45 @@
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
-import RecentDocuments from '@elliemae/ds-icons/RecentDocuments';
+import { RecentDocuments } from '@elliemae/ds-icons';
 import DSButton from '@elliemae/ds-button';
 import DSPopper from '@elliemae/ds-popper';
 
 var _RecentDocuments;
 
-const TimePickerDropdown = ({
-  disabled = false,
-  onClick,
-  onOpen,
-  isOpen,
-  menu,
-  zIndex,
-  blockName,
-  placement
-}) => /*#__PURE__*/_jsx(DSPopper, {
-  blockName: blockName,
-  placement: placement,
-  contentComponent: menu,
-  isOpen: isOpen,
-  onOpen: onOpen,
-  modifiers: {
-    preventOverflow: {
-      enabled: true,
-      padding: 0,
-      boundariesElement: 'window'
-    }
-  },
-  showArrow: false,
-  triggerComponent: /*#__PURE__*/_jsx(DSButton, {
-    buttonType: "secondary",
-    disabled: disabled,
-    icon: _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx(RecentDocuments, {})),
-    iconSize: "s",
-    onClick: onClick
-  }),
-  zIndex: zIndex
-});
+const TimePickerDropdown = _ref => {
+  let {
+    disabled = false,
+    onClick,
+    onOpen,
+    isOpen,
+    menu,
+    zIndex,
+    blockName,
+    placement
+  } = _ref;
+  return /*#__PURE__*/_jsx(DSPopper, {
+    blockName: blockName,
+    placement: placement,
+    contentComponent: menu,
+    isOpen: isOpen,
+    onOpen: onOpen,
+    modifiers: {
+      preventOverflow: {
+        enabled: true,
+        padding: 0,
+        boundariesElement: 'window'
+      }
+    },
+    showArrow: false,
+    triggerComponent: /*#__PURE__*/_jsx(DSButton, {
+      buttonType: "secondary",
+      disabled: disabled,
+      icon: _RecentDocuments || (_RecentDocuments = /*#__PURE__*/_jsx(RecentDocuments, {})),
+      iconSize: "s",
+      onClick: onClick
+    }),
+    zIndex: zIndex
+  });
+};
 
 export { TimePickerDropdown as default };

package/esm/TimePickerImpl.js

@@ -1,14 +1,18 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useRef, useEffect } from 'react';
 import moment from 'moment';
 import memoizeOne from 'memoize-one';
-import { getVisibleTimeByFormat } from '@elliemae/ds-utilities/timeUtils';
+import { getVisibleTimeByFormat } from '@elliemae/ds-utilities';
 import { aggregatedClasses, convertPropToCssClassName } from '@elliemae/ds-classnames';
-import DSInputGroup from '@elliemae/ds-form/InputGroup';
-import { TimeInputImpl } from '@elliemae/ds-form/TimeInput';
-import DSInput from '@elliemae/ds-form/Input';
+import { DSInputGroup, DSInput, TimeInputImpl } from '@elliemae/ds-form';
 import { TimePickerMenu } from './TimePickerMenu.js';
 import TimePickerDropdown from './TimePickerDropdown.js';
 import { convertTimeString } from './utils.js';
@@ -20,27 +24,31 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const blockName = 'time-picker';
-const TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, ({
-  isMenuOpened
-}) => ({
-  isMenuOpened
-}));
+const TimePickerContainer = aggregatedClasses(DSInputGroup)(blockName, null, _ref => {
+  let {
+    isMenuOpened
+  } = _ref;
+  return {
+    isMenuOpened
+  };
+});
 
-const TimePickerImpl = ({
-  value,
-  onChange,
-  onOpen,
-  format,
-  disabled,
-  hasHeader,
-  hasHeaderDisplay,
-  className,
-  containerProps,
-  placement,
-  zIndex,
-  disabledTimes,
-  minutesInterval
-}) => {
+const TimePickerImpl = _ref2 => {
+  let {
+    value,
+    onChange,
+    onOpen,
+    format,
+    disabled,
+    hasHeader,
+    hasHeaderDisplay,
+    className,
+    containerProps,
+    placement,
+    zIndex,
+    disabledTimes,
+    minutesInterval
+  } = _ref2;
   const [time, setTime] = useState();
   const [isMenuOpened, setIsMenuOpened] = useState(false);
   const [focusedColumn, setFocusedColumn] = useState(null);
@@ -105,7 +113,7 @@ const TimePickerImpl = ({
     to: convertTimeString(disabledTimes.to)
   };
   return /*#__PURE__*/_jsx(TimePickerContainer, {
-    className: `${className} variant-${!disabled ? 'default' : 'disabled'}`,
+    className: "".concat(className, " variant-").concat(!disabled ? 'default' : 'disabled'),
     containerProps: containerProps,
     disabled: disabled,
     rightAddon: /*#__PURE__*/_jsx(TimePickerDropdown, {
@@ -134,11 +142,11 @@ const TimePickerImpl = ({
       })
     })
   }, void 0, /*#__PURE__*/_jsx(DSInput, {
-    customInputType: _ref => {
+    customInputType: _ref3 => {
       let {
         onChange: handleChange
-      } = _ref,
-          restInputProps = _objectWithoutProperties(_ref, _excluded);
+      } = _ref3,
+          restInputProps = _objectWithoutProperties(_ref3, _excluded);
 
       return /*#__PURE__*/jsx(TimeInputImpl, _objectSpread({
         clearable: true,

package/esm/TimePickerMenu.js

@@ -1,10 +1,16 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import 'core-js/modules/esnext.async-iterator.map.js';
+import 'core-js/modules/esnext.iterator.map.js';
 import { Component } from 'react';
-import { range } from '@elliemae/ds-utilities/utils';
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 import moment from 'moment';
-import { addLeadingZeros } from '@elliemae/ds-utilities/timeUtils';
+import { range, addLeadingZeros } from '@elliemae/ds-utilities';
 import { isAM } from './utils.js';
 import PickerPanel from './PickerPanel.js';
 
@@ -25,12 +31,12 @@ class TimePickerMenu extends Component {
   constructor(props) {
     super(props);
 
-    _defineProperty(this, "renderHeader", () => {
+    this.renderHeader = () => {
       const {
         time
       } = this.state;
       return /*#__PURE__*/_jsx(TimePickerHeader, {}, void 0, time.format('hh:mma'));
-    });
+    };
 
     this.state = {
       time: moment(props.time || '', props.format) || moment()