@elliemae/ds-controlled-form 2.4.1-rc.4 → 2.4.1-rc.8

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

@@ -33,9 +33,7 @@ const HHInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     autoFocusHourInput
   } = _ref;
   const validateOnChange = React.useCallback(e => {
-    var _e$target;
-
-    if (isInvalidHour(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
+    if (isInvalidHour(e.target.value)) {
       e.preventDefault();
       return;
     }

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

@@ -17,7 +17,7 @@ const validSecondDigits = ['m', 'M'];
 
 const isInvalidMeridiem = meridiem => {
   if (meridiem === '') return false;
-  const [firstDigit, secondDigit] = meridiem === null || meridiem === void 0 ? void 0 : meridiem.split('');
+  const [firstDigit, secondDigit] = meridiem.split('');
   const isValidFirstDigit = meridiem.length < 1 && !firstDigit || validFirstDigits.includes(firstDigit);
   const isValidSecondDigit = !secondDigit || validSecondDigits.includes(secondDigit);
   return meridiem.length > 2 || !isValidFirstDigit || !isValidSecondDigit;

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

@@ -20,30 +20,26 @@ var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 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
 
   const {
+    hours,
+    minutes,
+    meridiem,
     hourInputRef,
     minutesInputRef,
     meridiemInputRef,

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

@@ -11,7 +11,6 @@ var stringHelpers = require('../../utils/stringHelpers.js');
 const useTimeInputs = () => {
   const {
     props: {
-      minutesInterval,
       disabled
     },
     lastSegmentRef,
@@ -34,7 +33,8 @@ const useTimeInputs = () => {
     handleChangeHours,
     handleChangeMinutes,
     handleChangeMeridiem,
-    setLatestInteractionRegion
+    setLatestInteractionRegion,
+    minutesInterval
   } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
   const setLatestInteractionRegionTimeInputs = React.useCallback(() => {
     setLatestInteractionRegion('time-inputs');
@@ -229,9 +229,6 @@ const useTimeInputs = () => {
     });
   }, [handleChangeMeridiem]);
   return React.useMemo(() => ({
-    hours,
-    minutes,
-    meridiem,
     autoFocusHourInput,
     disabled,
     handleChangeHours,
@@ -249,7 +246,7 @@ const useTimeInputs = () => {
     onHoursKeyDown,
     onMinutesKeyDown,
     onMeridiemKeyDown
-  }), [hours, minutes, meridiem, autoFocusHourInput, disabled, handleChangeHours, onHoursFocus, onHoursChange, handleChangeMinutes, onMinutesFocus, onMinutesChange, handleChangeMeridiem, onMeridiemFocus, onMeridiemChange, onHoursBlur, onMinutesBlur, onMeridiemBlur, onHoursKeyDown, onMinutesKeyDown, onMeridiemKeyDown]);
+  }), [autoFocusHourInput, disabled, handleChangeHours, onHoursFocus, onHoursChange, handleChangeMinutes, onMinutesFocus, onMinutesChange, handleChangeMeridiem, onMeridiemFocus, onMeridiemChange, onHoursBlur, onMinutesBlur, onMeridiemBlur, onHoursKeyDown, onMinutesKeyDown, onMeridiemKeyDown]);
 };
 
 exports.useTimeInputs = useTimeInputs;

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

@@ -2,31 +2,64 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var reactDesc = require('react-desc');
+var dsPropsHelpers = require('@elliemae/ds-props-helpers');
 
+/* eslint-disable max-lines */
+
+const noop = () => {};
+
+const defaultReturnFalse = () => false;
+
+const defaultProps = {
+  type: 'full-date-time',
+  onDateChange: noop,
+  onMonthChange: noop,
+  onDayChange: noop,
+  onYearChange: noop,
+  onTimeChange: noop,
+  onHourChange: noop,
+  onMinuteChange: noop,
+  onMeridiemChange: noop,
+  onPickerOpen: noop,
+  onPickerClose: noop,
+  getIsDisabledDay: defaultReturnFalse,
+  getIsOutOfRangeDay: defaultReturnFalse,
+  getIsStartRangeDay: defaultReturnFalse,
+  getIsDayInRange: defaultReturnFalse,
+  getIsEndRangeDay: defaultReturnFalse,
+  getIsDisabledTime: defaultReturnFalse,
+  minutesInterval: 1,
+  isClearable: false,
+  disabled: false,
+  hasError: false,
+  autoFocus: false,
+  preventCloseOnSelection: false
+};
 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'),
-  dateTime: reactDesc.PropTypes.string.description('when using date-time types, this is the value of the controller'),
-  date: reactDesc.PropTypes.string.description('when using date types, this is the value of the controller'),
-  time: reactDesc.PropTypes.string.description('when using time types, this is the value of the controller'),
-  onDateChange: reactDesc.PropTypes.func.description('(newDateString, metaInformations) => void').defaultValue(''),
-  onTimeChange: reactDesc.PropTypes.func.description('(newTimeString, metaInformations) => void').defaultValue(''),
-  onDateTimeChange: reactDesc.PropTypes.func.description('(newDateTimeString, metaInformations) => void').defaultValue(''),
-  onMonthChange: reactDesc.PropTypes.func.description('(newMonthString, event, metaInformations) => void').defaultValue(''),
-  onDayChange: reactDesc.PropTypes.func.description('(newDayString, event, metaInformations) => void').defaultValue(''),
-  onYearChange: reactDesc.PropTypes.func.description('(newYearString, event, metaInformations) => void').defaultValue(''),
-  onHourChange: reactDesc.PropTypes.func.description('(newHourString, event, metaInformations) => void').defaultValue(''),
-  onMinuteChange: reactDesc.PropTypes.func.description('(newMinuteString, event, metaInformations) => void').defaultValue(''),
-  onMeridiemChange: reactDesc.PropTypes.func.description('(newMeridiemString, event, metaInformations) => void').defaultValue(''),
-  getIsDisabledDay: reactDesc.PropTypes.func.description('(dayAsString) => true for marking as disabled, false for marking as valid').defaultValue(''),
-  getIsOutOfRangeDay: reactDesc.PropTypes.func.description('(dayAsString) => true for marking as disabled, false for marking as valid').defaultValue(''),
-  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'),
-  'data-testid': reactDesc.PropTypes.string.description('Unique id for tests.').defaultValue('')
+  type: dsPropsHelpers.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: dsPropsHelpers.PropTypes.bool.description('wheter or not the input is disabled').defaultValue(false),
+  isClearable: dsPropsHelpers.PropTypes.bool.description('with or without clearable button').defaultValue(false),
+  dateTime: dsPropsHelpers.PropTypes.string.description('when using date-time types, this is the value of the controller'),
+  date: dsPropsHelpers.PropTypes.string.description('when using date types, this is the value of the controller'),
+  time: dsPropsHelpers.PropTypes.string.description('when using time types, this is the value of the controller'),
+  onDateChange: dsPropsHelpers.PropTypes.func.description('(newDateString, metaInformations) => void'),
+  onTimeChange: dsPropsHelpers.PropTypes.func.description('(newTimeString, metaInformations) => void'),
+  onDateTimeChange: dsPropsHelpers.PropTypes.func.description('(newDateTimeString, metaInformations) => void'),
+  onMonthChange: dsPropsHelpers.PropTypes.func.description('(newMonthString, event, metaInformations) => void'),
+  onDayChange: dsPropsHelpers.PropTypes.func.description('(newDayString, event, metaInformations) => void'),
+  onYearChange: dsPropsHelpers.PropTypes.func.description('(newYearString, event, metaInformations) => void'),
+  onHourChange: dsPropsHelpers.PropTypes.func.description('(newHourString, event, metaInformations) => void'),
+  onMinuteChange: dsPropsHelpers.PropTypes.func.description('(newMinuteString, event, metaInformations) => void'),
+  onMeridiemChange: dsPropsHelpers.PropTypes.func.description('(newMeridiemString, event, metaInformations) => void'),
+  getIsDisabledDay: dsPropsHelpers.PropTypes.func.description('(dayAsString) => true for marking as disabled, false for marking as valid'),
+  getIsOutOfRangeDay: dsPropsHelpers.PropTypes.func.description('(dayAsString) => true for marking as disabled, false for marking as valid'),
+  getIsDisabledTime: dsPropsHelpers.PropTypes.func.description('(timeAsString) => true for marking as disabled, false for marking as valid'),
+  emptyPickerStartingMonth: dsPropsHelpers.PropTypes.string.description('which month to start the calendar on open, when value is empty, string following the "MM/__/YYYY" pattern'),
+  onCalendarOpenFocusedDay: dsPropsHelpers.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 current month'),
+  onTimeWheelOpenStartingTime: dsPropsHelpers.PropTypes.string.description('which day to start the timewheel on picker open when value is empty, string following the HH:MM AA" pattern').defaultValue('01:00 AM'),
+  minutesInterval: dsPropsHelpers.PropTypes.number.description('increments/decrements of minutes in time related controllers interactions').defaultValue('1'),
+  'data-testid': dsPropsHelpers.PropTypes.string.description('Unique id for tests.').defaultValue('')
 };
 
+exports.defaultProps = defaultProps;
 exports.propTypes = propTypes;

package/cjs/date-time-picker/utils/dateHelpers.js

@@ -10,12 +10,68 @@ var constants = require('./constants.js');
 var stringHelpers = require('./stringHelpers.js');
 var numberHelpers = require('./numberHelpers.js');
 
+const getDateValuesFromDate = day => {
+  var _day$getMonth, _day$getDate, _day$getFullYear;
+
+  return {
+    month: day === null || day === void 0 ? void 0 : (_day$getMonth = day.getMonth) === null || _day$getMonth === void 0 ? void 0 : _day$getMonth.call(day),
+    day: day === null || day === void 0 ? void 0 : (_day$getDate = day.getDate) === null || _day$getDate === void 0 ? void 0 : _day$getDate.call(day),
+    year: day === null || day === void 0 ? void 0 : (_day$getFullYear = day.getFullYear) === null || _day$getFullYear === void 0 ? void 0 : _day$getFullYear.call(day)
+  };
+};
+const getDateStringFromDay = day => {
+  const monthFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(day.getMonth() + 1), 2); // months from 1-12
+
+  const dayFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(day.getDate()), 2);
+  const yearFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(day.getFullYear()), 4);
+  return "".concat(monthFromDay, "/").concat(dayFromDay, "/").concat(yearFromDay);
+};
+const getTimeStringFromDay = day => {
+  const hoursNum = day.getHours();
+  const meridiem = hoursNum > 12 ? 'PM' : 'AM';
+  const twelveHourFormat = hoursNum > 12 ? hoursNum - 12 : hoursNum;
+  const minutesNum = day.getMinutes();
+  const hoursFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(twelveHourFormat), 2);
+  const minutesFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(minutesNum), 2);
+  return "".concat(hoursFromDay, ":").concat(minutesFromDay, " ").concat(meridiem);
+};
+const getMonthNameByMonthNumber = monthNumber => constants.monthNames[monthNumber];
+const isSameDateMoment = (dateA, dateB) => {
+  var _dateA$getTime, _dateB$getTime;
+
+  return (dateA === null || dateA === void 0 ? void 0 : (_dateA$getTime = dateA.getTime) === null || _dateA$getTime === void 0 ? void 0 : _dateA$getTime.call(dateA)) === (dateB === null || dateB === void 0 ? void 0 : (_dateB$getTime = dateB.getTime) === null || _dateB$getTime === void 0 ? void 0 : _dateB$getTime.call(dateB));
+};
+const compareTwoDatesDayEquality = (dayA, dayB) => {
+  const {
+    day: currD,
+    month: currM,
+    year: currY
+  } = getDateValuesFromDate(dayA);
+  const {
+    day: focusD,
+    month: focusM,
+    year: focusY
+  } = getDateValuesFromDate(dayB);
+  return currD === focusD && currM === focusM && currY === focusY;
+};
 const getLastDayOfMonth = (month, year) => new Date(year, month + 1, 0);
 const isValidDayForTheMonth = (month, year, day) => {
   var _Date, _Date$getMonth;
 
   return ((_Date = new Date(year, month, day)) === null || _Date === void 0 ? void 0 : (_Date$getMonth = _Date.getMonth) === null || _Date$getMonth === void 0 ? void 0 : _Date$getMonth.call(_Date)) === month;
 };
+const getDayFromDateString = dateString => {
+  const {
+    month,
+    day,
+    year
+  } = stringHelpers.deconstructValuesFromDateString(dateString);
+  const monthNum = numberHelpers.convertToPositiveNumberIfPossible(month);
+  const dayNum = numberHelpers.convertToPositiveNumberIfPossible(day);
+  const yearNum = numberHelpers.convertToPositiveNumberIfPossible(year);
+  if (monthNum !== -1 && dayNum !== -1 && yearNum !== -1 && isValidDayForTheMonth(monthNum - 1, yearNum, dayNum)) return new Date(yearNum, monthNum - 1, dayNum);
+  return null;
+};
 const isValidDayForTheMonthDateString = dateString => {
   var _getDayFromDateString, _getDayFromDateString2;
 
@@ -186,62 +242,6 @@ const getFiveBySevenCurrentMonthDaysMatrix = (month, year) => {
   }));
   return [...previousMonthDaysToPrepend, ...currentMonthDays, ...nextMonthDaysToAppend];
 };
-const getDateValuesFromDate = day => {
-  var _day$getMonth, _day$getDate, _day$getFullYear;
-
-  return {
-    month: day === null || day === void 0 ? void 0 : (_day$getMonth = day.getMonth) === null || _day$getMonth === void 0 ? void 0 : _day$getMonth.call(day),
-    day: day === null || day === void 0 ? void 0 : (_day$getDate = day.getDate) === null || _day$getDate === void 0 ? void 0 : _day$getDate.call(day),
-    year: day === null || day === void 0 ? void 0 : (_day$getFullYear = day.getFullYear) === null || _day$getFullYear === void 0 ? void 0 : _day$getFullYear.call(day)
-  };
-};
-const getDateStringFromDay = day => {
-  const monthFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(day.getMonth() + 1), 2); // months from 1-12
-
-  const dayFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(day.getDate()), 2);
-  const yearFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(day.getFullYear()), 4);
-  return "".concat(monthFromDay, "/").concat(dayFromDay, "/").concat(yearFromDay);
-};
-const getTimeStringFromDay = day => {
-  const hoursNum = day.getHours();
-  const meridiem = hoursNum > 12 ? 'PM' : 'AM';
-  const twelveHourFormat = hoursNum > 12 ? hoursNum - 12 : hoursNum;
-  const minutesNum = day.getMinutes();
-  const hoursFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(twelveHourFormat), 2);
-  const minutesFromDay = stringHelpers.prependStringWithPlaceHolders("".concat(minutesNum), 2);
-  return "".concat(hoursFromDay, ":").concat(minutesFromDay, " ").concat(meridiem);
-};
-const getDayFromDateString = dateString => {
-  const {
-    month,
-    day,
-    year
-  } = stringHelpers.deconstructValuesFromDateString(dateString);
-  const monthNum = numberHelpers.convertToPositiveNumberIfPossible(month);
-  const dayNum = numberHelpers.convertToPositiveNumberIfPossible(day);
-  const yearNum = numberHelpers.convertToPositiveNumberIfPossible(year);
-  if (monthNum !== -1 && dayNum !== -1 && yearNum !== -1 && isValidDayForTheMonth(monthNum - 1, yearNum, dayNum)) return new Date(yearNum, monthNum - 1, dayNum);
-  return null;
-};
-const getMonthNameByMonthNumber = monthNumber => constants.monthNames[monthNumber];
-const isSameDateMoment = (dateA, dateB) => {
-  var _dateA$getTime, _dateB$getTime;
-
-  return (dateA === null || dateA === void 0 ? void 0 : (_dateA$getTime = dateA.getTime) === null || _dateA$getTime === void 0 ? void 0 : _dateA$getTime.call(dateA)) === (dateB === null || dateB === void 0 ? void 0 : (_dateB$getTime = dateB.getTime) === null || _dateB$getTime === void 0 ? void 0 : _dateB$getTime.call(dateB));
-};
-const compareTwoDatesDayEquality = (dayA, dayB) => {
-  const {
-    day: currD,
-    month: currM,
-    year: currY
-  } = getDateValuesFromDate(dayA);
-  const {
-    day: focusD,
-    month: focusM,
-    year: focusY
-  } = getDateValuesFromDate(dayB);
-  return currD === focusD && currM === focusM && currY === focusY;
-};
 
 exports.compareTwoDatesDayEquality = compareTwoDatesDayEquality;
 exports.dateAddMonths = dateAddMonths;

package/cjs/date-time-picker/utils/hooks/useGetMonthYearFromDateStringOrEmptyStartingMonth.js

@@ -9,12 +9,9 @@ var stringHelpers = require('../stringHelpers.js');
 const useGetMonthYearFromDateStringOrEmptyStartingMonth = () => {
   const {
     dateStringFromProps,
-    props: {
-      emptyPickerStartingMonth
-    }
+    emptyPickerStartingMonth
   } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
   return React.useMemo(() => {
-    const emptyPickerStartingMonthDefault = "".concat(new Date().getMonth() + 1, "/__/").concat(new Date().getFullYear());
     const {
       month: stringMonthVal,
       year: stringYearVal
@@ -22,7 +19,7 @@ const useGetMonthYearFromDateStringOrEmptyStartingMonth = () => {
     const {
       month: emptyStringSplitMonth,
       year: emptyStringSplitYear
-    } = stringHelpers.deconstructValuesFromDateString(emptyPickerStartingMonth || emptyPickerStartingMonthDefault);
+    } = stringHelpers.deconstructValuesFromDateString(emptyPickerStartingMonth);
     const userEmptyStringMonth = Number.parseInt(emptyStringSplitMonth, 10);
     const userEmptyStringYear = Number.parseInt(emptyStringSplitYear, 10);
     const month = stringMonthVal === '' || stringMonthVal.length !== 2 ? userEmptyStringMonth - 1 : Number.parseInt(stringMonthVal, 10) - 1; // month is 0~11 in javascript Date...

package/cjs/date-time-picker/utils/hooks/useGetStartingFocusedDay.js

@@ -2,6 +2,12 @@
 
 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 React = require('react');
 var ControlledDateTimePickerCTX = require('../../ControlledDateTimePickerCTX.js');
 var stringHelpers = require('../stringHelpers.js');
@@ -9,7 +15,13 @@ var numberHelpers = require('../numberHelpers.js');
 var dateHelpers = require('../dateHelpers.js');
 var useGetDayFromDateString = require('./useGetDayFromDateString.js');
 
-/* eslint-disable max-statements */
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 const empty = {
   startFocusedYear: null,
   startFocusedDay: null,
@@ -18,61 +30,52 @@ const empty = {
 };
 const useGetStartingFocusedDay = () => {
   const {
-    props: {
-      onCalendarOpenFocusedDay
-    }
+    onCalendarOpenFocusedDay
   } = React.useContext(ControlledDateTimePickerCTX.ControlledDateTimePickerContext);
   const dayFromInputValues = useGetDayFromDateString.useGetDayFromDateString();
   return React.useMemo(() => {
-    const {
-      month: inputValuesSplitMonth,
-      day: inputValuesSplitDay,
-      year: inputValuesDaySplitYear
-    } = dateHelpers.getDateValuesFromDate(dayFromInputValues);
-    let startFocusedMonth = null;
-    let startFocusedDay = null;
-    let startFocusedYear = null;
-    let startFocusedDate = null;
-    const isInputFilledAndValid = inputValuesSplitMonth && inputValuesSplitDay && inputValuesDaySplitYear && dateHelpers.isValidDayForTheMonth(inputValuesSplitMonth, inputValuesDaySplitYear, inputValuesSplitDay);
-    const isOnCalendarOpenFocusedDayEmpty = !onCalendarOpenFocusedDay;
-    const shouldFillWithOnCalendarOpenFocusedDay = !isInputFilledAndValid && !isOnCalendarOpenFocusedDayEmpty; // if input was filled start focus is the filled value (if it's valid day for the month)
+    const startingDay = _objectSpread({}, empty);
 
-    if (isInputFilledAndValid) {
-      startFocusedMonth = inputValuesSplitMonth;
-      startFocusedDay = inputValuesSplitDay;
-      startFocusedYear = inputValuesDaySplitYear;
-      startFocusedDate = dayFromInputValues; // if input was not filled (or filled invalid) and there is no onCalendarOpenFocusedDay start focus is not a day
-    } // if input was not filled and there is onCalendarOpenFocusedDay start focus is onCalendarOpenFocusedDay day
-
-
-    if (!isInputFilledAndValid && isOnCalendarOpenFocusedDayEmpty) return empty;
-
-    if (shouldFillWithOnCalendarOpenFocusedDay) {
+    if (dayFromInputValues) {
       const {
-        month: focusedDaySplitMonth,
-        day: focusedDaySplitDay,
-        year: focusedDaySplitYear
-      } = stringHelpers.deconstructValuesFromDateString(onCalendarOpenFocusedDay);
-      const monthAsInt = numberHelpers.convertToPositiveNumberIfPossible(focusedDaySplitMonth);
-      const dayAsInt = numberHelpers.convertToPositiveNumberIfPossible(focusedDaySplitDay);
-      const yearAsInt = numberHelpers.convertToPositiveNumberIfPossible(focusedDaySplitYear); // if this condition is false, return will be the same as return empty
-      // because startFocusedMonth/Day/Year/Date will be === null
-      // which is the expected result
+        month: inputValuesSplitMonth,
+        day: inputValuesSplitDay,
+        year: inputValuesDaySplitYear
+      } = dateHelpers.getDateValuesFromDate(dayFromInputValues);
+      const isInputFilledAndValid = inputValuesSplitMonth && inputValuesSplitDay && inputValuesDaySplitYear && dateHelpers.isValidDayForTheMonth(inputValuesSplitMonth, inputValuesDaySplitYear, inputValuesSplitDay);
+      const isOnCalendarOpenFocusedDayEmpty = !onCalendarOpenFocusedDay;
+      const shouldFillWithOnCalendarOpenFocusedDay = !isInputFilledAndValid && !isOnCalendarOpenFocusedDayEmpty; // if input was filled start focus is the filled value (if it's valid day for the month)
+
+      if (isInputFilledAndValid) {
+        startingDay.startFocusedMonth = inputValuesSplitMonth;
+        startingDay.startFocusedDay = inputValuesSplitDay;
+        startingDay.startFocusedYear = inputValuesDaySplitYear;
+        startingDay.startFocusedDate = dayFromInputValues; // if input was not filled (or filled invalid) and there is no onCalendarOpenFocusedDay start focus is not a day
+      } else if (isOnCalendarOpenFocusedDayEmpty) {
+        // if input was not filled and there is onCalendarOpenFocusedDay start focus is onCalendarOpenFocusedDay day
+        return empty;
+      } else if (shouldFillWithOnCalendarOpenFocusedDay) {
+        const {
+          month: focusedDaySplitMonth,
+          day: focusedDaySplitDay,
+          year: focusedDaySplitYear
+        } = stringHelpers.deconstructValuesFromDateString(onCalendarOpenFocusedDay);
+        const monthAsInt = numberHelpers.convertToPositiveNumberIfPossible(focusedDaySplitMonth);
+        const dayAsInt = numberHelpers.convertToPositiveNumberIfPossible(focusedDaySplitDay);
+        const yearAsInt = numberHelpers.convertToPositiveNumberIfPossible(focusedDaySplitYear); // if this condition is false, return will be the same as return empty
+        // because startFocusedMonth/Day/Year/Date will be === null
+        // which is the expected result
 
-      if (monthAsInt !== -1 && dayAsInt !== -1 && yearAsInt !== -1 && dateHelpers.isValidDayForTheMonth(monthAsInt - 1, yearAsInt, dayAsInt)) {
-        startFocusedMonth = monthAsInt;
-        startFocusedDay = dayAsInt;
-        startFocusedYear = yearAsInt;
-        startFocusedDate = new Date(yearAsInt, monthAsInt - 1, dayAsInt);
+        if (monthAsInt !== -1 && dayAsInt !== -1 && yearAsInt !== -1 && dateHelpers.isValidDayForTheMonth(monthAsInt - 1, yearAsInt, dayAsInt)) {
+          startingDay.startFocusedMonth = monthAsInt;
+          startingDay.startFocusedDay = dayAsInt;
+          startingDay.startFocusedYear = yearAsInt;
+          startingDay.startFocusedDate = new Date(yearAsInt, monthAsInt - 1, dayAsInt);
+        }
       }
     }
 
-    return {
-      startFocusedYear,
-      startFocusedDay,
-      startFocusedMonth,
-      startFocusedDate
-    };
+    return startingDay;
   }, [dayFromInputValues, onCalendarOpenFocusedDay]);
 };
 

package/cjs/date-time-picker/utils/hooks/useOnClickOutside.js

@@ -10,10 +10,9 @@ const useOnClickOutside = (ref, handler) => {
       var _ref$contains;
 
       // Do nothing if clicking ref's element or descendent elements
-      if (!ref || ref !== null && ref !== void 0 && (_ref$contains = ref.contains) !== null && _ref$contains !== void 0 && _ref$contains.call(ref, event.target)) {
+      if (event.target instanceof Element) if (!ref || ref !== null && ref !== void 0 && (_ref$contains = ref.contains) !== null && _ref$contains !== void 0 && _ref$contains.call(ref, event.target)) {
         return;
       }
-
       handler(event);
     };
 

package/cjs/date-time-picker/utils/stringHelpers.js

@@ -10,7 +10,6 @@ var constants = require('./constants.js');
 var numberHelpers = require('./numberHelpers.js');
 
 /* eslint-disable max-lines */
-
 const prependStringWithPlaceHolders = function (val, finalLength) {
   let placeholder = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '0';
   if (val.length === finalLength) return val;
@@ -40,7 +39,7 @@ const dateTimeToDate = dateTime => {
   return dateTime === null || dateTime === void 0 ? void 0 : (_dateTime$split = dateTime.split) === null || _dateTime$split === void 0 ? void 0 : (_dateTime$split$call = _dateTime$split.call(dateTime, ' ')) === null || _dateTime$split$call === void 0 ? void 0 : _dateTime$split$call[0];
 };
 const deconstructValuesFromDateString = dateString => {
-  const [dirtyMonth = '', dirtyDay = '', dirtyYear = ''] = dateString === null || dateString === void 0 ? void 0 : dateString.split('/');
+  const [dirtyMonth = '', dirtyDay = '', dirtyYear = ''] = dateString.split('/');
   const replaceAllRegexp = /_/g;
   return {
     month: (dirtyMonth || '').replace(replaceAllRegexp, ''),
@@ -49,8 +48,8 @@ const deconstructValuesFromDateString = dateString => {
   };
 };
 const deconstructValuesFromTimeString = timeString => {
-  const [dirtyHour = '', dirtyMintuesAndMeridiem = ''] = timeString === null || timeString === void 0 ? void 0 : timeString.split(':');
-  const [dirtyMinutes = '', dirtyMeridiem = ''] = dirtyMintuesAndMeridiem === null || dirtyMintuesAndMeridiem === void 0 ? void 0 : dirtyMintuesAndMeridiem.split(' ');
+  const [dirtyHour = '', dirtyMintuesAndMeridiem = ''] = timeString.split(':');
+  const [dirtyMinutes = '', dirtyMeridiem = ''] = dirtyMintuesAndMeridiem.split(' ');
   const replaceAllRegexp = /_/g;
   return {
     hours: (dirtyHour || '').replace(replaceAllRegexp, ''),
@@ -87,26 +86,21 @@ const getFormattedTimeString = _ref2 => {
   return "".concat(finalHour, ":").concat(finalMinutes, " ").concat(finalMeridiem);
 };
 const dateTimeToTime = dateTime => {
-  var _dateTime$split2;
-
-  const [// eslint-disable-next-line @typescript-eslint/no-unused-vars
-  _date, // timeNumbers = '__:__:__', // <-- seconds format
-  timeNumbers = '__:__', timeMeridiem = '__'] = dateTime === null || dateTime === void 0 ? void 0 : (_dateTime$split2 = dateTime.split) === null || _dateTime$split2 === void 0 ? void 0 : _dateTime$split2.call(dateTime, ' ');
+  const [// eslint-disable-next-line @typescript-eslint/no-unused-vars, no-unused-vars
+  date, // timeNumbers = '__:__:__', // <-- seconds format
+  timeNumbers = '__:__', timeMeridiem = '__'] = dateTime.split(' ');
   return "".concat(timeNumbers, " ").concat(timeMeridiem);
 };
 const deconstructTimeValues = timeString => {
-  var _timeString$split, _dirtyTimes$split;
-
-  const [dirtyTimes, dirtyMeridiem] = timeString === null || timeString === void 0 ? void 0 : (_timeString$split = timeString.split) === null || _timeString$split === void 0 ? void 0 : _timeString$split.call(timeString, ' '); // <--['__:__','__']
+  const [dirtyTimes = '', dirtyMeridiem] = timeString.split(' '); // <--['__:__','__']
 
-  const [dirtyHours, dirtyMinutes] = (_dirtyTimes$split = dirtyTimes.split) === null || _dirtyTimes$split === void 0 ? void 0 : _dirtyTimes$split.call(dirtyTimes, ':'); // <--['__','__']
+  const [dirtyHours, dirtyMinutes] = dirtyTimes.split(':'); // <--['__','__']
 
   const regex = /_/g; // Note the 'g' flag, which matches all occurrences of the expression
 
   const newValues = {
     hours: (dirtyHours || '').replace(regex, ''),
     minutes: (dirtyMinutes || '').replace(regex, ''),
-    // seconds: (dirtySeconds||"").replace(regex, ''),
     meridiem: (dirtyMeridiem || '').replace(regex, '')
   };
   return newValues;

package/cjs/date-time-picker/utils/typeGuards.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const dateTimeTypes = ['full-date-time', 'date-time-inputs', 'date-time-picker', 'date-time-picker-controller-only'];
+const dateTypes = ['full-date', 'date-inputs', 'date-picker', 'date-picker-controller-only'];
+const timeTypes = ['full-time', 'time-inputs', 'time-picker', 'time-picker-controller-only'];
+const getIsDateTime = props => dateTimeTypes.includes(props.type);
+const getIsDate = props => dateTypes.includes(props.type);
+const getIsTime = props => timeTypes.includes(props.type);
+
+exports.getIsDate = getIsDate;
+exports.getIsDateTime = getIsDateTime;
+exports.getIsTime = getIsTime;

package/cjs/index.js

@@ -18,7 +18,8 @@ var timeHelpers = require('./date-time-picker/utils/timeHelpers.js');
 var usePhoneMask = require('./mask-hook/hooks/usePhoneMask.js');
 var useNumberMask = require('./mask-hook/hooks/useNumberMask.js');
 var useSSNMask = require('./mask-hook/hooks/useSSNMask.js');
-var useZipCode = require('./mask-hook/hooks/useZipCode.js');
+var useRegExpMask = require('./mask-hook/hooks/useRegExpMask.js');
+var useZipCodeMask = require('./mask-hook/hooks/useZipCodeMask.js');
 var DSInputText = require('./text-input/DSInputText.js');
 var dataTestIds = require('./text-input/exported-related/data-test-ids.js');
 var theming = require('./text-input/exported-related/theming.js');
@@ -34,6 +35,7 @@ exports.DSAutocompleteWithSchema = Autocomplete.DSAutocompleteWithSchema;
 exports.DSControlledCheckbox = ControlledCheckbox.DSControlledCheckbox;
 exports.DSControlledCheckboxWithSchema = ControlledCheckbox.DSControlledCheckboxWithSchema;
 exports.DSComboBox = ComboBox.DSComboBox;
+exports.DSComboBoxV3 = ComboBox.DSComboBox;
 exports.DSComboBoxWithSchema = ComboBox.DSComboBoxWithSchema;
 exports.DSControlledDateRangePicker = ControlledDateRangePicker.DSControlledDateRangePicker;
 exports.DSControlledDateRangePickerWithSchema = ControlledDateRangePicker.DSControlledDateRangePickerWithSchema;
@@ -52,13 +54,20 @@ exports.getDayFromDateString = dateHelpers.getDayFromDateString;
 exports.getValidationDateStringMetaInfo = dateHelpers.getValidationDateStringMetaInfo;
 exports.getValidationTimeStringMetaInfo = timeHelpers.getValidationTimeStringMetaInfo;
 exports.UsePhoneMaskWithSchema = usePhoneMask.UsePhoneMaskWithSchema;
+exports.getPhoneMaskedValue = usePhoneMask.getPhoneMaskedValue;
 exports.usePhoneMask = usePhoneMask.usePhoneMask;
 exports.UseNumberMaskWithSchema = useNumberMask.UseNumberMaskWithSchema;
+exports.getNumberMaskedValue = useNumberMask.getNumberMaskedValue;
 exports.useNumberMask = useNumberMask.useNumberMask;
 exports.UseSSNMaskWithSchema = useSSNMask.UseSSNMaskWithSchema;
+exports.getSSNMaskedValue = useSSNMask.getSSNMaskedValue;
 exports.useSSNMask = useSSNMask.useSSNMask;
-exports.UseZipCodeMaskWithSchema = useZipCode.UseZipCodeMaskWithSchema;
-exports.useZipCode = useZipCode.useZipCode;
+exports.UseRegExpMaskWithSchema = useRegExpMask.UseRegExpMaskWithSchema;
+exports.isRegExp = useRegExpMask.isRegExp;
+exports.useRegExpMask = useRegExpMask.useRegExpMask;
+exports.UseZipCodeMaskWithSchema = useZipCodeMask.UseZipCodeMaskWithSchema;
+exports.getUseZipMaskedValue = useZipCodeMask.getUseZipMaskedValue;
+exports.useZipCodeMask = useZipCodeMask.useZipCodeMask;
 exports.DSInputText = DSInputText.DSInputText;
 exports.DSInputTextWithSchema = DSInputText.DSInputTextWithSchema;
 exports.DSInputTextDataTestIds = dataTestIds.DSInputTextDataTestIds;

package/cjs/mask-hook/hooks/index.js

@@ -5,15 +5,23 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var usePhoneMask = require('./usePhoneMask.js');
 var useNumberMask = require('./useNumberMask.js');
 var useSSNMask = require('./useSSNMask.js');
-var useZipCode = require('./useZipCode.js');
+var useRegExpMask = require('./useRegExpMask.js');
+var useZipCodeMask = require('./useZipCodeMask.js');
 
 
 
 exports.UsePhoneMaskWithSchema = usePhoneMask.UsePhoneMaskWithSchema;
+exports.getPhoneMaskedValue = usePhoneMask.getPhoneMaskedValue;
 exports.usePhoneMask = usePhoneMask.usePhoneMask;
 exports.UseNumberMaskWithSchema = useNumberMask.UseNumberMaskWithSchema;
+exports.getNumberMaskedValue = useNumberMask.getNumberMaskedValue;
 exports.useNumberMask = useNumberMask.useNumberMask;
 exports.UseSSNMaskWithSchema = useSSNMask.UseSSNMaskWithSchema;
+exports.getSSNMaskedValue = useSSNMask.getSSNMaskedValue;
 exports.useSSNMask = useSSNMask.useSSNMask;
-exports.UseZipCodeMaskWithSchema = useZipCode.UseZipCodeMaskWithSchema;
-exports.useZipCode = useZipCode.useZipCode;
+exports.UseRegExpMaskWithSchema = useRegExpMask.UseRegExpMaskWithSchema;
+exports.isRegExp = useRegExpMask.isRegExp;
+exports.useRegExpMask = useRegExpMask.useRegExpMask;
+exports.UseZipCodeMaskWithSchema = useZipCodeMask.UseZipCodeMaskWithSchema;
+exports.getUseZipMaskedValue = useZipCodeMask.getUseZipMaskedValue;
+exports.useZipCodeMask = useZipCodeMask.useZipCodeMask;