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

package/cjs/components/DatePickerController/DatePickerController.js

@@ -1,7 +1,13 @@
 'use strict';
 
-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.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/web.dom-collections.iterator.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 lodash = require('lodash');
 var PropTypes = require('prop-types');
@@ -9,7 +15,7 @@ var moment = require('moment');
 require('react-dates/initialize');
 var reactDates = require('react-dates');
 var dsClassnames = require('@elliemae/ds-classnames');
-var ChevronLeft = require('@elliemae/ds-icons/ChevronLeft');
+var dsIcons = require('@elliemae/ds-icons');
 var defaultPhrases = require('../../defaultPhrases.js');
 var DatePickerRenderMonth = require('../DatePickerRenderMonth/DatePickerRenderMonth.js');
 var DatePickerNavigation = require('../DatePickerNavigation/DatePickerNavigation.js');
@@ -18,16 +24,15 @@ var jsxRuntime = require('react/jsx-runtime');
 
 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 React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
 var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
-var ChevronLeft__default = /*#__PURE__*/_interopDefaultLegacy(ChevronLeft);
 
 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 {
   classNameElement,
   classNameBlock
@@ -49,19 +54,19 @@ const focusElementOnOpen = lodash.debounce((datePickerDom, firstFocusableItemDom
     }
   }
 }, 100);
-class DSDatePickerController extends React__default['default'].Component {
+class DSDatePickerController extends React__default["default"].Component {
   // eslint-disable-next-line react/static-property-placement
   constructor(props) {
     super(props);
 
-    _defineProperty__default['default'](this, "handleMouseUp", () => {
+    this.handleMouseUp = () => {
       var _focusedElement$blur;
 
       const focusedElement = document.activeElement;
       focusedElement === null || focusedElement === void 0 ? void 0 : (_focusedElement$blur = focusedElement.blur) === null || _focusedElement$blur === void 0 ? void 0 : _focusedElement$blur.call(focusedElement);
-    });
+    };
 
-    _defineProperty__default['default'](this, "handleKeyDown", event => {
+    this.handleKeyDown = event => {
       const [firstDay, ...restOfDays] = document.getElementsByClassName('CalendarMonthGrid_month__horizontal')[1].getElementsByClassName('CalendarDay');
       const [lastDay] = restOfDays.slice(-1);
       const {
@@ -81,9 +86,9 @@ class DSDatePickerController extends React__default['default'].Component {
           onClickEscape();
           break;
       }
-    });
+    };
 
-    _defineProperty__default['default'](this, "getSafeValue", () => {
+    this.getSafeValue = () => {
       const {
         value,
         date,
@@ -92,22 +97,22 @@ class DSDatePickerController extends React__default['default'].Component {
       const {
         selectedDate
       } = this.state;
-      if (value) return moment__default['default'](value);
-      if (date) return moment__default['default'](date);
-      if (defaultValue) return moment__default['default'](defaultValue);
-      if (selectedDate) return moment__default['default'](selectedDate);
+      if (value) return moment__default["default"](value);
+      if (date) return moment__default["default"](date);
+      if (defaultValue) return moment__default["default"](defaultValue);
+      if (selectedDate) return moment__default["default"](selectedDate);
       return null;
-    });
+    };
 
-    _defineProperty__default['default'](this, "isControlled", () => {
+    this.isControlled = () => {
       const {
         value,
         date
       } = this.props;
       return Boolean(value) || Boolean(date);
-    });
+    };
 
-    _defineProperty__default['default'](this, "handleDateChange", date => {
+    this.handleDateChange = date => {
       const {
         readOnly,
         onDateChange,
@@ -124,22 +129,22 @@ class DSDatePickerController extends React__default['default'].Component {
         onDateChange(date);
         onChange(date);
       }
-    });
+    };
 
-    _defineProperty__default['default'](this, "handleChange", dataInput => {
+    this.handleChange = dataInput => {
       const {
         onDateChange,
         onChange
       } = this.props;
-      const momentvalue = moment__default['default'](dataInput.target.value);
+      const momentvalue = moment__default["default"](dataInput.target.value);
       this.setState({
         selectedDate: momentvalue
       });
       onDateChange(momentvalue);
       onChange(momentvalue);
-    });
+    };
 
-    _defineProperty__default['default'](this, "handleNavClick", (date, nav) => {
+    this.handleNavClick = (date, nav) => {
       const [prev, next] = document.getElementsByClassName('DayPickerNavigation_button');
       const {
         onPrevMonthClick,
@@ -157,9 +162,9 @@ class DSDatePickerController extends React__default['default'].Component {
         next === null || next === void 0 ? void 0 : (_next$focus = next.focus) === null || _next$focus === void 0 ? void 0 : _next$focus.call(next);
         onNextMonthClick(date);
       }
-    });
+    };
 
-    _defineProperty__default['default'](this, "insideBlur", event => {
+    this.insideBlur = event => {
       const {
         datePicker
       } = this.state;
@@ -167,12 +172,12 @@ class DSDatePickerController extends React__default['default'].Component {
       if (!datePicker.current.contains(event.currentTarget)) {
         this.props.onClose();
       }
-    });
+    };
 
     this.state = {
       selectedDate: null,
-      firstFocusableItem: /*#__PURE__*/React__default['default'].createRef(),
-      datePicker: /*#__PURE__*/React__default['default'].createRef()
+      firstFocusableItem: /*#__PURE__*/React__default["default"].createRef(),
+      datePicker: /*#__PURE__*/React__default["default"].createRef()
     };
   }
 
@@ -221,13 +226,13 @@ class DSDatePickerController extends React__default['default'].Component {
     } = this.state;
     const safedate = this.getSafeValue();
     const safeinitialMonth = safedate && safedate.isValid() ? () => safedate : () => initialVisibleMonth;
-    return /*#__PURE__*/_jsx__default['default']("div", {}, void 0, /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({
+    return /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({
       onBlur: this.insideBlur,
       ref: datePicker,
       className: classNameBlock('wrapper-day-picker-single-date-controller'),
       "data-testid": "calendar-wrapper"
     }, calendarProps), {}, {
-      children: /*#__PURE__*/_jsx__default['default'](reactDates.DayPickerSingleDateController, {
+      children: /*#__PURE__*/_jsx__default["default"](reactDates.DayPickerSingleDateController, {
         date: safedate,
         enableOutsideDays: enableOutsideDays,
         firstDayOfWeek: firstDayOfWeek,
@@ -238,12 +243,12 @@ class DSDatePickerController extends React__default['default'].Component {
         isDayHighlighted: isDayHighlighted,
         isOutsideRange: isOutsideRange,
         keepOpenOnDateSelect: keepOpenOnDateSelect,
-        navNext: /*#__PURE__*/_jsx__default['default'](DatePickerNavigation, {
+        navNext: /*#__PURE__*/_jsx__default["default"](DatePickerNavigation, {
           className: classNameElement('navigation-next')
         }),
-        navPrev: /*#__PURE__*/_jsx__default['default'](DatePickerNavigation, {
+        navPrev: /*#__PURE__*/_jsx__default["default"](DatePickerNavigation, {
           className: classNameElement('navigation-prev'),
-          icon: ChevronLeft__default['default'],
+          icon: dsIcons.ChevronLeft,
           innerRef: firstFocusableItem
         }),
         renderMonthElement: DatePickerRenderMonth.renderMonthElement,
@@ -258,7 +263,7 @@ class DSDatePickerController extends React__default['default'].Component {
           this.handleNavClick(e, 'prev');
         },
         phrases: phrases,
-        renderDayContents: date => /*#__PURE__*/_jsx__default['default'](DatePickerDay, {
+        renderDayContents: date => /*#__PURE__*/_jsx__default["default"](DatePickerDay, {
           className: classNameElement('day-contents'),
           date: date.format(displayFormatDay)
         }),
@@ -274,12 +279,11 @@ class DSDatePickerController extends React__default['default'].Component {
   }
 
 }
-
-_defineProperty__default['default'](DSDatePickerController, "defaultProps", {
+DSDatePickerController.defaultProps = {
   date: '',
   value: '',
   enableOutsideDays: false,
-  initialVisibleMonth: moment__default['default'](),
+  initialVisibleMonth: moment__default["default"](),
   firstDayOfWeek: 0,
   keepOpenOnDateSelect: true,
   hideKeyboardShortcutsPanel: true,
@@ -298,13 +302,12 @@ _defineProperty__default['default'](DSDatePickerController, "defaultProps", {
   isOutsideRange: () => false,
   isDayHighlighted: () => false,
   numberOfMonths: 1
-});
-
+};
 DSDatePickerController.defaultProps = {
   date: '',
   value: '',
   enableOutsideDays: false,
-  initialVisibleMonth: moment__default['default'](),
+  initialVisibleMonth: moment__default["default"](),
   firstDayOfWeek: 0,
   keepOpenOnDateSelect: true,
   hideKeyboardShortcutsPanel: true,
@@ -314,35 +317,35 @@ DSDatePickerController.defaultProps = {
   onClickEscape: () => null,
   onChange: () => null,
   onDateChange: () => null,
-  phrases: PropTypes__default['default'].shape({
-    calendarLabel: PropTypes__default['default'].string,
-    closeDatePicker: PropTypes__default['default'].string,
-    clearDates: PropTypes__default['default'].string,
-    focusStartDate: PropTypes__default['default'].string,
-    jumpToPrevMonth: PropTypes__default['default'].string,
-    jumpToNextMonth: PropTypes__default['default'].string,
-    keyboardShortcuts: PropTypes__default['default'].string,
-    showKeyboardShortcutsPanel: PropTypes__default['default'].string,
-    hideKeyboardShortcutsPanel: PropTypes__default['default'].string,
-    openThisPanel: PropTypes__default['default'].string,
-    enterKey: PropTypes__default['default'].string,
-    leftArrowRightArrow: PropTypes__default['default'].string,
-    upArrowDownArrow: PropTypes__default['default'].string,
-    pageUpPageDown: PropTypes__default['default'].string,
-    homeEnd: PropTypes__default['default'].string,
-    escape: PropTypes__default['default'].string,
-    questionMark: PropTypes__default['default'].string,
-    selectFocusedDate: PropTypes__default['default'].string,
-    moveFocusByOneDay: PropTypes__default['default'].string,
-    moveFocusByOneWeek: PropTypes__default['default'].string,
-    moveFocusByOneMonth: PropTypes__default['default'].string,
-    moveFocustoStartAndEndOfWeek: PropTypes__default['default'].string,
-    returnFocusToInput: PropTypes__default['default'].string,
-    keyboardNavigationInstructions: PropTypes__default['default'].string,
-    chooseAvailableStartDate: PropTypes__default['default'].func,
-    chooseAvailableEndDate: PropTypes__default['default'].func,
-    dateIsUnavailable: PropTypes__default['default'].func,
-    dateIsSelected: PropTypes__default['default'].func
+  phrases: PropTypes__default["default"].shape({
+    calendarLabel: PropTypes__default["default"].string,
+    closeDatePicker: PropTypes__default["default"].string,
+    clearDates: PropTypes__default["default"].string,
+    focusStartDate: PropTypes__default["default"].string,
+    jumpToPrevMonth: PropTypes__default["default"].string,
+    jumpToNextMonth: PropTypes__default["default"].string,
+    keyboardShortcuts: PropTypes__default["default"].string,
+    showKeyboardShortcutsPanel: PropTypes__default["default"].string,
+    hideKeyboardShortcutsPanel: PropTypes__default["default"].string,
+    openThisPanel: PropTypes__default["default"].string,
+    enterKey: PropTypes__default["default"].string,
+    leftArrowRightArrow: PropTypes__default["default"].string,
+    upArrowDownArrow: PropTypes__default["default"].string,
+    pageUpPageDown: PropTypes__default["default"].string,
+    homeEnd: PropTypes__default["default"].string,
+    escape: PropTypes__default["default"].string,
+    questionMark: PropTypes__default["default"].string,
+    selectFocusedDate: PropTypes__default["default"].string,
+    moveFocusByOneDay: PropTypes__default["default"].string,
+    moveFocusByOneWeek: PropTypes__default["default"].string,
+    moveFocusByOneMonth: PropTypes__default["default"].string,
+    moveFocustoStartAndEndOfWeek: PropTypes__default["default"].string,
+    returnFocusToInput: PropTypes__default["default"].string,
+    keyboardNavigationInstructions: PropTypes__default["default"].string,
+    chooseAvailableStartDate: PropTypes__default["default"].func,
+    chooseAvailableEndDate: PropTypes__default["default"].func,
+    dateIsUnavailable: PropTypes__default["default"].func,
+    dateIsSelected: PropTypes__default["default"].func
   }),
   // displayFormat: 'L',
   displayFormatDay: 'D',

package/cjs/components/DatePickerDay/DatePickerDay.js

@@ -7,15 +7,18 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
-const Day = ({
-  className = 'date-picker-content-day',
-  date = ''
-}) => /*#__PURE__*/_jsx__default['default']("div", {
-  className: className,
-  "data-testid": `datepicker-day-${date}`
-}, void 0, /*#__PURE__*/_jsx__default['default']("div", {
-  className: `${className}-half`,
-  "data-testid": "datepicker-day"
-}, void 0, date));
+const Day = _ref => {
+  let {
+    className = 'date-picker-content-day',
+    date = ''
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"]("div", {
+    className: className,
+    "data-testid": "datepicker-day-".concat(date)
+  }, void 0, /*#__PURE__*/_jsx__default["default"]("div", {
+    className: "".concat(className, "-half"),
+    "data-testid": "datepicker-day"
+  }, void 0, date));
+};
 
 module.exports = Day;

package/cjs/components/DatePickerDropdown.js

@@ -1,10 +1,15 @@
 'use strict';
 
+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 _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 require('react');
 var dsClassnames = require('@elliemae/ds-classnames');
-var DSPopper = require('@elliemae/ds-basic/Popper');
+var DSPopper = require('@elliemae/ds-popper');
 var DatePickerPicker = require('./DatePickerPicker/DatePickerPicker.js');
 var jsxRuntime = require('react/jsx-runtime');
 
@@ -16,24 +21,25 @@ var DSPopper__default = /*#__PURE__*/_interopDefaultLegacy(DSPopper);
 
 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 {
   classNameElement
 } = dsClassnames.convertPropToCssClassName('datepicker-range');
 
 const noop = () => null;
 
-function DatePickerDropdown({
-  disabled = false,
-  readOnly,
-  onClick = noop,
-  isOpen,
-  menu,
-  zIndex = 1,
-  pickerProps,
-  pickerRef
-}) {
-  return /*#__PURE__*/_jsx__default['default'](DSPopper__default['default'], {
+function DatePickerDropdown(_ref) {
+  let {
+    disabled = false,
+    readOnly,
+    onClick = noop,
+    isOpen,
+    menu,
+    zIndex = 1,
+    pickerProps,
+    pickerRef
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](DSPopper__default["default"], {
     contentComponent: menu,
     isOpen: isOpen,
     modifiers: {
@@ -44,7 +50,7 @@ function DatePickerDropdown({
       }
     },
     showArrow: false,
-    triggerComponent: /*#__PURE__*/_jsx__default['default']("div", {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DatePickerPicker.Picker, _objectSpread(_objectSpread({
+    triggerComponent: /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, /*#__PURE__*/jsxRuntime.jsx(DatePickerPicker.Picker, _objectSpread(_objectSpread({
       innerRef: pickerRef
     }, pickerProps), {}, {
       className: classNameElement('picker'),

package/cjs/components/DatePickerHeader/DatePickerHeader.js

@@ -1,18 +1,16 @@
 'use strict';
 
 var _jsx = require('@babel/runtime/helpers/jsx');
+require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
 var moment = require('moment');
-var DSDateInput = require('@elliemae/ds-basic/form/DateInputV2');
-var DSInputGroup = require('@elliemae/ds-basic/form/InputGroup');
+var dsForm = require('@elliemae/ds-form');
 var dsClassnames = require('@elliemae/ds-classnames');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var moment__default = /*#__PURE__*/_interopDefaultLegacy(moment);
-var DSDateInput__default = /*#__PURE__*/_interopDefaultLegacy(DSDateInput);
-var DSInputGroup__default = /*#__PURE__*/_interopDefaultLegacy(DSInputGroup);
 
 const DATE_FORMAT = 'MMDDYYYY';
 const blockname = 'date-picker-header';
@@ -20,11 +18,12 @@ const Header = dsClassnames.aggregatedClasses('div')(blockname);
 
 const isFn = variable => typeof variable === 'function';
 
-const DatePickerHeader = ({
-  onInputChange = () => null,
-  selectedDate,
-  updateKeyDate
-}) => {
+const DatePickerHeader = _ref => {
+  let {
+    onInputChange = () => null,
+    selectedDate,
+    updateKeyDate
+  } = _ref;
   const [value, setValue] = React.useState(isFn(selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.format) ? selectedDate.format(DATE_FORMAT) : '');
   React.useEffect(() => {
     if (isFn(selectedDate === null || selectedDate === void 0 ? void 0 : selectedDate.format)) {
@@ -38,13 +37,13 @@ const DatePickerHeader = ({
 
   const handleOnKeyDown = e => {
     if (e.key === 'Enter' && value.length === DATE_FORMAT.length) {
-      const momentValue = moment__default['default'](value, DATE_FORMAT);
+      const momentValue = moment__default["default"](value, DATE_FORMAT);
       onInputChange(momentValue);
       updateKeyDate(momentValue);
     }
   };
 
-  return /*#__PURE__*/_jsx__default['default'](Header, {}, void 0, /*#__PURE__*/_jsx__default['default'](DSInputGroup__default['default'], {}, void 0, /*#__PURE__*/_jsx__default['default'](DSDateInput__default['default'], {
+  return /*#__PURE__*/_jsx__default["default"](Header, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSInputGroup, {}, void 0, /*#__PURE__*/_jsx__default["default"](dsForm.DSDateInputV2, {
     onChange: handleOnChange,
     onKeyDown: handleOnKeyDown,
     value: value,

package/cjs/components/DatePickerNavigation/DatePickerNavigation.js

@@ -10,20 +10,23 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var ChevronRight__default = /*#__PURE__*/_interopDefaultLegacy(ChevronRight);
 
-const Navigation = ({
-  className = 'date-picker-navigation',
-  icon: Icon$1 = ChevronRight__default['default'],
-  color = Icon.DSIconColors.NEUTRAL,
-  size = Icon.DSIconSizes.S,
-  innerRef
-}) => /*#__PURE__*/_jsx__default['default']("div", {
-  tabIndex: 0,
-  "data-testid": "date-picker-nav"
-}, void 0, /*#__PURE__*/_jsx__default['default'](Icon$1, {
-  className: className,
-  color: color,
-  innerRef: innerRef,
-  size: size
-}));
+const Navigation = _ref => {
+  let {
+    className = 'date-picker-navigation',
+    icon: Icon$1 = ChevronRight__default["default"],
+    color = Icon.DSIconColors.NEUTRAL,
+    size = Icon.DSIconSizes.S,
+    innerRef
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"]("div", {
+    tabIndex: 0,
+    "data-testid": "date-picker-nav"
+  }, void 0, /*#__PURE__*/_jsx__default["default"](Icon$1, {
+    className: className,
+    color: color,
+    innerRef: innerRef,
+    size: size
+  }));
+};
 
 module.exports = Navigation;

package/cjs/components/DatePickerPicker/DatePickerPicker.js

@@ -8,7 +8,7 @@ require('react');
 var PropTypes = require('prop-types');
 var Icon = require('@elliemae/ds-basic/Icon');
 var DatePicker = require('@elliemae/ds-icons/DatePicker');
-var DSButton = require('@elliemae/ds-basic/Button');
+var DSButton = require('@elliemae/ds-button');
 var propTypes = require('@elliemae/ds-shared/prop-types');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -26,7 +26,7 @@ const Picker = _ref => {
   let {
     className = 'date-picker-icon',
     disabled = false,
-    icon = _DatePicker || (_DatePicker = /*#__PURE__*/_jsx__default['default'](DatePicker__default['default'], {})),
+    icon = _DatePicker || (_DatePicker = /*#__PURE__*/_jsx__default["default"](DatePicker__default["default"], {})),
     size = Icon.DSIconSizes.M,
     buttonActionType = 'secondary',
     onClick = () => null,
@@ -35,9 +35,9 @@ const Picker = _ref => {
     tabIndex = 0,
     innerRef
   } = _ref,
-      rest = _objectWithoutProperties__default['default'](_ref, _excluded);
+      rest = _objectWithoutProperties__default["default"](_ref, _excluded);
 
-  return /*#__PURE__*/_jsx__default['default'](DSButton__default['default'], {
+  return /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
     innerRef: innerRef,
     "aria-label": rest['aria-label'] || 'Date Picker Button',
     buttonType: buttonActionType,
@@ -54,21 +54,21 @@ const Picker = _ref => {
   });
 };
 const PickerPropsTypes = {
-  innerRef: PropTypes__default['default'].oneOfType([PropTypes__default['default'].func, PropTypes__default['default'].shape({
-    current: PropTypes__default['default'].any
+  innerRef: PropTypes__default["default"].oneOfType([PropTypes__default["default"].func, PropTypes__default["default"].shape({
+    current: PropTypes__default["default"].any
   })]),
-  className: PropTypes__default['default'].string,
-  disabled: PropTypes__default['default'].bool,
-  icon: PropTypes__default['default'].element,
-  size: PropTypes__default['default'].oneOf(propTypes.iconSizes),
-  buttonActionType: PropTypes__default['default'].oneOf(DSButton.buttonTypes),
-  onClick: PropTypes__default['default'].func,
-  onFocus: PropTypes__default['default'].func,
-  onBlur: PropTypes__default['default'].func,
-  readOnly: PropTypes__default['default'].bool,
-  tabIndex: PropTypes__default['default'].number
+  className: PropTypes__default["default"].string,
+  disabled: PropTypes__default["default"].bool,
+  icon: PropTypes__default["default"].element,
+  size: PropTypes__default["default"].oneOf(propTypes.iconSizes),
+  buttonActionType: PropTypes__default["default"].oneOf(DSButton.buttonTypes),
+  onClick: PropTypes__default["default"].func,
+  onFocus: PropTypes__default["default"].func,
+  onBlur: PropTypes__default["default"].func,
+  readOnly: PropTypes__default["default"].bool,
+  tabIndex: PropTypes__default["default"].number
 };
 
 exports.Picker = Picker;
 exports.PickerPropsTypes = PickerPropsTypes;
-exports['default'] = Picker;
+exports["default"] = Picker;