@elliemae/ds-controlled-form 2.4.2-rc.3 → 2.4.3-rc.0

package/cjs/combobox/utils/listHelper.js

@@ -9,7 +9,6 @@ require('core-js/modules/esnext.async-iterator.some.js');
 require('core-js/modules/esnext.iterator.some.js');
 require('core-js/modules/esnext.async-iterator.find.js');
 require('core-js/modules/esnext.iterator.find.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 constants = require('../constants.js');
@@ -21,11 +20,11 @@ const isSelectedValueMultiple = value => Array.isArray(value);
 const isSelected = (value, activeOption) => {
   if (isSelectedValueMultiple(value)) {
     const multiValue = value;
-    return multiValue.some(item => (item === null || item === void 0 ? void 0 : item.value) === (activeOption === null || activeOption === void 0 ? void 0 : activeOption.value));
+    return multiValue.some(item => item?.value === activeOption?.value);
   }
 
   const singleValue = value;
-  return (singleValue === null || singleValue === void 0 ? void 0 : singleValue.value) === activeOption.value;
+  return singleValue?.value === activeOption.value;
 };
 const findInCircularList = function (list, from, criteria) {
   let step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
@@ -75,8 +74,6 @@ const getSuggestedValueOnChange = (selectedOption, selectedValues) => {
 };
 const filterOptions = (inputValue, options) => options.filter(option => option.type === constants.MENU_OPTION_TYPES.OPTION && option.label.toLowerCase().includes(inputValue.toLowerCase()));
 const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
-  var _items2;
-
   const items = [];
   if (optionsToParse) optionsToParse.forEach(option => {
     // const isSelectedValue = multiSelectedValue.find((item) => item?.dsId === option.dsId);
@@ -85,9 +82,7 @@ const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
     }
 
     if (option.type === constants.MENU_OPTION_TYPES.SECTION) {
-      var _items;
-
-      if (((_items = items[items.length - 1]) === null || _items === void 0 ? void 0 : _items.type) === constants.MENU_OPTION_TYPES.SECTION) {
+      if (items[items.length - 1]?.type === constants.MENU_OPTION_TYPES.SECTION) {
         items[items.length - 1] = option;
       } else {
         items.push(option);
@@ -95,13 +90,22 @@ const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
     }
   });
 
-  if (((_items2 = items[items.length - 1]) === null || _items2 === void 0 ? void 0 : _items2.type) === constants.MENU_OPTION_TYPES.SECTION) {
+  if (items[items.length - 1]?.type === constants.MENU_OPTION_TYPES.SECTION) {
     items.pop();
   }
 
   return items;
 };
 const getFilteredOptionsSelected = (filteredOption, selectedValues) => filteredOption.filter(option => option.type === constants.MENU_OPTION_TYPES.OPTION && isSelected(selectedValues, option));
+const scrollIfNeeded = function (elem) {
+  let options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
+    behavior: 'smooth',
+    block: 'end',
+    inline: 'nearest'
+  };
+  const bounding = elem.getBoundingClientRect();
+  if (!(bounding.top >= 0 && bounding.left >= 0 && bounding.bottom <= (window.innerHeight || document.documentElement.clientHeight) && bounding.right <= (window.innerWidth || document.documentElement.clientWidth))) elem.scrollIntoView(options);
+};
 
 exports.filterOptions = filterOptions;
 exports.findInCircularList = findInCircularList;
@@ -114,4 +118,5 @@ exports.getSuggestedValueOnChange = getSuggestedValueOnChange;
 exports.isSelected = isSelected;
 exports.isSelectedValueEmpty = isSelectedValueEmpty;
 exports.isSelectedValueMultiple = isSelectedValueMultiple;
+exports.scrollIfNeeded = scrollIfNeeded;
 exports.selectedValuesWithSections = selectedValuesWithSections;

package/cjs/date-range-picker/config/useRangePickerLogic.js

@@ -2,18 +2,16 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var _defineProperty = require('@babel/runtime/helpers/defineProperty');
-require('core-js/modules/web.dom-collections.iterator.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 _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var React = require('react');
 require('../../date-time-picker/ControlledDateTimePicker.js');
 require('core-js/modules/esnext.async-iterator.map.js');
 require('core-js/modules/esnext.iterator.map.js');
-require('core-js/modules/es.string.replace.js');
 var dateHelpers = require('../../date-time-picker/utils/dateHelpers.js');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -54,7 +52,7 @@ const useRangePickerLogic = _ref => {
     const dateToString = calendarChangeIsFrom ? toDate : changedDay;
     const dateTo = dateHelpers.getDayFromDateString(dateToString); // we force the "from" to ALWAYS be before the "to" date
 
-    const isToBeforeFrom = (dateTo === null || dateTo === void 0 ? void 0 : dateTo.getTime()) < (dateFrom === null || dateFrom === void 0 ? void 0 : dateFrom.getTime());
+    const isToBeforeFrom = dateTo?.getTime() < dateFrom?.getTime();
     const newDateFromString = isToBeforeFrom ? dateToString : dateFromString;
     const forcingFromDatePick = isToBeforeFrom ? !calendarChangeIsFrom : false;
     const newDateToString = isToBeforeFrom ? dateFromString : dateToString;
@@ -129,19 +127,17 @@ const useRangePickerLogic = _ref => {
   }, [getChangedDayStringValues, onFromDateChange, onToDateChange]);
   const getIsStartRangeDay = React.useCallback(dayString => dayString === fromDate, [fromDate]);
   const getIsDayInRange = React.useCallback(dayString => {
-    var _getDayFromDateString;
-
     const dayFrom = dateHelpers.getDayFromDateString(fromDate);
     const dayTo = dateHelpers.getDayFromDateString(toDate);
     if (!dayFrom || !dayTo || !dayString) return false;
-    const newDayTime = (_getDayFromDateString = dateHelpers.getDayFromDateString(dayString)) === null || _getDayFromDateString === void 0 ? void 0 : _getDayFromDateString.getTime();
+    const newDayTime = dateHelpers.getDayFromDateString(dayString)?.getTime();
     return newDayTime <= dayTo.getTime() && newDayTime >= dayFrom.getTime();
   }, [fromDate, toDate]);
   const getIsEndRangeDay = React.useCallback(dayString => dayString === toDate, [toDate]);
   const getIsToBeforeFrom = React.useCallback((fromString, toString) => {
     const dateFrom = dateHelpers.getDayFromDateString(fromString);
     const dateTo = dateHelpers.getDayFromDateString(toString);
-    return (dateTo === null || dateTo === void 0 ? void 0 : dateTo.getTime()) < (dateFrom === null || dateFrom === void 0 ? void 0 : dateFrom.getTime());
+    return dateTo?.getTime() < dateFrom?.getTime();
   }, []);
   const handleFromDateChange = React.useCallback((newVal, metaInfo) => {
     const isIncorrectOrder = getIsToBeforeFrom(newVal, toDate);

package/cjs/date-range-picker/parts/ControlledDateRangeCalendar.js

@@ -8,8 +8,6 @@ var ControlledDateTimePicker = require('../../date-time-picker/ControlledDateTim
 var ControlledDateTimePickerTypes = require('../../date-time-picker/ControlledDateTimePickerTypes.js');
 require('core-js/modules/esnext.async-iterator.map.js');
 require('core-js/modules/esnext.iterator.map.js');
-require('core-js/modules/web.dom-collections.iterator.js');
-require('core-js/modules/es.string.replace.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');

package/cjs/date-range-picker/parts/ControlledDateRangeFromDate.js

@@ -9,8 +9,6 @@ var ControlledDateTimePicker = require('../../date-time-picker/ControlledDateTim
 var ControlledDateTimePickerTypes = require('../../date-time-picker/ControlledDateTimePickerTypes.js');
 require('core-js/modules/esnext.async-iterator.map.js');
 require('core-js/modules/esnext.iterator.map.js');
-require('core-js/modules/web.dom-collections.iterator.js');
-require('core-js/modules/es.string.replace.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');

package/cjs/date-range-picker/parts/ControlledDateRangeToDate.js

@@ -9,8 +9,6 @@ var ControlledDateTimePicker = require('../../date-time-picker/ControlledDateTim
 var ControlledDateTimePickerTypes = require('../../date-time-picker/ControlledDateTimePickerTypes.js');
 require('core-js/modules/esnext.async-iterator.map.js');
 require('core-js/modules/esnext.iterator.map.js');
-require('core-js/modules/web.dom-collections.iterator.js');
-require('core-js/modules/es.string.replace.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');

package/cjs/date-time-picker/config/useChangeHandlers.js

@@ -89,7 +89,7 @@ const useChangeHandlers = _ref => {
     appOnTimeChange(appTimeString, metaInfo); // don't do this on useEffect to avoid complete chaos
 
     setTimeString(newTimeString);
-    const newDateTimeString = "".concat(newDateString, " ").concat(newTimeString);
+    const newDateTimeString = `${newDateString} ${newTimeString}`;
 
     const newMetaInfo = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaInfo), getTimeMetaInfo(newTimeString, metaInfo)), getDateMetaInfo(newDateString, metaInfo)), {}, {
       newDateString,
@@ -106,7 +106,7 @@ const useChangeHandlers = _ref => {
     appOnDateChange(appDateString, metaInfo); // don't do this on useEffect to avoid complete chaos
 
     setTempDateString(newDateString);
-    const newDateTimeString = "".concat(newDateString, " ").concat(tempTimeString);
+    const newDateTimeString = `${newDateString} ${tempTimeString}`;
 
     const newMetaInfo = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaInfo), getTimeMetaInfo(tempTimeString, metaInfo)), getDateMetaInfo(newDateString, metaInfo)), {}, {
       newDateString,
@@ -122,7 +122,7 @@ const useChangeHandlers = _ref => {
     appOnTimeChange(appTimeString, metaInfo); // don't do this on useEffect to avoid complete chaos
 
     setTimeString(newTimeString);
-    const newDateTimeString = "".concat(tempDateString, " ").concat(newTimeString);
+    const newDateTimeString = `${tempDateString} ${newTimeString}`;
 
     const newMetaInfo = _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, metaInfo), getTimeMetaInfo(newTimeString, metaInfo)), getDateMetaInfo(tempDateString, metaInfo)), {}, {
       newDateTimeString,

package/cjs/date-time-picker/config/useControlledDateTimePicker.js

@@ -68,7 +68,7 @@ const useControlledDateTimePicker = props => {
     isDateTimeSelector,
     isWithTimeInputs
   } = flags;
-  const ariaCurrentValueForInputs = "current values: ".concat(isWithDateInputs ? "".concat(announcedDateValues) : '').concat(isDateTimeSelector ? ', ' : '').concat(isWithTimeInputs ? "".concat(announcedTimeValues) : '');
+  const ariaCurrentValueForInputs = `current values: ${isWithDateInputs ? `${announcedDateValues}` : ''}${isDateTimeSelector ? ', ' : ''}${isWithTimeInputs ? `${announcedTimeValues}` : ''}`;
   const ctx = React__default["default"].useMemo(() => _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
     props: propsWithDefaults,
     ariaCurrentValueForInputs,

package/cjs/date-time-picker/config/useFocusTracker.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
 
+/* eslint-disable max-lines */
 const useFocusTracker = _ref => {
   let {
     DOMRefs,

package/cjs/date-time-picker/config/useGetDestructuredValues.js

@@ -42,8 +42,8 @@ const useGetDestructuredDateValues = _ref => {
   const yearNum = numberHelpers.convertToPositiveNumberIfPossible(year);
   const announcedMonth = monthNum !== -1 ? constants.monthNames[monthNum - 1] : 'empty month';
   const announcedDay = dayNum !== -1 ? constants.announcableCardinalDays[dayNum] : 'empty day';
-  const announcedYear = yearNum !== -1 ? stringHelpers.fillStringWithPlaceHolders("".concat(yearNum), 4, '0') : 'empty year';
-  const announcedDateValues = "".concat(announcedMonth, ", ").concat(announcedDay, ", ").concat(announcedYear);
+  const announcedYear = yearNum !== -1 ? stringHelpers.fillStringWithPlaceHolders(`${yearNum}`, 4, '0') : 'empty year';
+  const announcedDateValues = `${announcedMonth}, ${announcedDay}, ${announcedYear}`;
   return React.useMemo(() => ({
     month,
     day,
@@ -77,12 +77,12 @@ const useGetDestructuredTimeValues = _ref2 => {
   const hoursNum = numberHelpers.convertToPositiveNumberIfPossible(hours);
   const minutesNum = numberHelpers.convertToPositiveNumberIfPossible(minutes); // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...
 
-  const announcedHours = hoursNum !== -1 ? "".concat(hoursNum) : 'empty hours'; // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...
+  const announcedHours = hoursNum !== -1 ? `${hoursNum}` : 'empty hours'; // 01 -> 1 ~ 09 -> 9 || 1_ -> 1 ~ 9_ -> 9 || empty...
 
-  const announcedMinutes = minutesNum !== -1 ? "".concat(minutesNum) : 'empty minutes';
+  const announcedMinutes = minutesNum !== -1 ? `${minutesNum}` : 'empty minutes';
   const announcedMeridiem = // eslint-disable-next-line no-nested-ternary
-  meridiem === 'PM' ? "post meridiem" : meridiem === 'AM' ? 'ante meridiem' : 'empty meriediem';
-  const announcedTimeValues = "".concat(announcedHours, ", ").concat(announcedMinutes, ", ").concat(announcedMeridiem);
+  meridiem === 'PM' ? `post meridiem` : meridiem === 'AM' ? 'ante meridiem' : 'empty meriediem';
+  const announcedTimeValues = `${announcedHours}, ${announcedMinutes}, ${announcedMeridiem}`;
   return React.useMemo(() => ({
     hours,
     minutes,

package/cjs/date-time-picker/config/useGetPropsBasedOnType.js

@@ -27,7 +27,7 @@ const useGetPropsBasedOnType = propsWithDefaults => {
   const appOnMonthChange = (isDateTime || isDate) && propsWithDefaults.onMonthChange ? propsWithDefaults.onMonthChange : noop;
   const appOnDayChange = (isDateTime || isDate) && propsWithDefaults.onDayChange ? propsWithDefaults.onDayChange : noop;
   const appOnYearChange = (isDateTime || isDate) && propsWithDefaults.onYearChange ? propsWithDefaults.onYearChange : noop;
-  const emptyPickerStartingMonthDefault = "".concat(new Date().getMonth() + 1, "/__/").concat(new Date().getFullYear());
+  const emptyPickerStartingMonthDefault = `${new Date().getMonth() + 1}/__/${new Date().getFullYear()}`;
   const emptyPickerStartingMonth = (isDateTime || isDate) && propsWithDefaults.emptyPickerStartingMonth ? propsWithDefaults.emptyPickerStartingMonth : emptyPickerStartingMonthDefault;
   const onCalendarOpenFocusedDay = (isDateTime || isDate) && propsWithDefaults.onCalendarOpenFocusedDay ? propsWithDefaults.onCalendarOpenFocusedDay : undefined;
   /* -------------------------- -------------- --------------------------*/

package/cjs/date-time-picker/config/useGetReferences.js

@@ -2,9 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
 
+/* eslint-disable complexity */
 const useGetReferences = _ref => {
   let {
     isWithDateInputs,

package/cjs/date-time-picker/config/useRelevantValueFromProps.js

@@ -2,11 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
 var typeGuards = require('../utils/typeGuards.js');
 var stringHelpers = require('../utils/stringHelpers.js');
 
+/* eslint-disable complexity */
 const useRelevantValueFromProps = props => {
   const dateStringFromProps = React.useMemo(() => {
     if (typeGuards.getIsDateTime(props)) return props.dateTime !== '' ? stringHelpers.dateTimeToDate(props.dateTime) : '__/__/____';

package/cjs/date-time-picker/config/useValidateProps.js

@@ -2,46 +2,77 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/es.error.cause.js');
 var stringHelpers = require('../utils/stringHelpers.js');
 var numberHelpers = require('../utils/numberHelpers.js');
 var typeGuards = require('../utils/typeGuards.js');
 
-/* eslint-disable max-statements */
-const PREPEND = "ControlledDateTimePicker:\n  Invalid configuration detected::\n  \n    ";
+const PREPEND = `ControlledDateTimePicker:
+  Invalid configuration detected::
+  
+    `;
 const NOT_A_DEFECT = ''; // '\n\n\t\tThis is not a defect, please check\n\n\t\thttps://qa.dimsum.rd.elliemae.io/?path=/story/components-desktop-components-d-controlledform-date-time-picker--basic\n\n\t\tfor instructions on how to use the component correctly\n\n';
 
-const INLINE_RECEIVED_PREPEND = "\n\n    Received:";
+const INLINE_RECEIVED_PREPEND = `
+
+    Received:`;
 
 const throwInvalidDateTimeError = invalidValue => {
-  throw new Error("".concat(PREPEND, "the \"dateTime\" you are providing is not respecting the format it must respect.").concat(INLINE_RECEIVED_PREPEND).concat(invalidValue, "(").concat(typeof invalidValue, ")").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}the "dateTime" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
 };
 
 const throwInvalidDaterror = invalidValue => {
-  throw new Error("".concat(PREPEND, "the \"date\" you are providing is not respecting the format it must respect.").concat(INLINE_RECEIVED_PREPEND).concat(invalidValue, "(").concat(typeof invalidValue, ")").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}the "date" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
 };
 
 const throwInvalidTimerror = invalidValue => {
-  throw new Error("".concat(PREPEND, "the \"time\" you are providing is not respecting the format it must respect.").concat(INLINE_RECEIVED_PREPEND).concat(invalidValue, "(").concat(typeof invalidValue, ")").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}the "time" you are providing is not respecting the format it must respect.${INLINE_RECEIVED_PREPEND}${invalidValue}(${typeof invalidValue})${NOT_A_DEFECT}`);
 };
 
 const throwUncontrolledDateError = (date, onDateChange) => {
-  throw new Error("".concat(PREPEND, "you are trying to use a date selector while providing a non-string \"date\" or providing a non-function to \"onDateChange\"\n  the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations\n\n  Received:\n    date: ").concat(date, "(").concat(typeof date, ")\n    onDateChange: (").concat(typeof onDateChange, ")\n  ").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}you are trying to use a date selector while providing a non-string "date" or providing a non-function to "onDateChange"
+  the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations
+
+  Received:
+    date: ${date}(${typeof date})
+    onDateChange: (${typeof onDateChange})
+  ${NOT_A_DEFECT}`);
 };
 
 const throwUncontrolledTimeError = (time, onTimeChange) => {
-  throw new Error("".concat(PREPEND, "you are trying to use a time selector while providing a non-string \"time\" or providing a non-function to \"onTimeChange\"\n  the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations\n\n  Received:\n    time: ").concat(time, "(").concat(typeof time, ")\n    onTimeChange: (").concat(typeof onTimeChange, ")\n  ").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}you are trying to use a time selector while providing a non-string "time" or providing a non-function to "onTimeChange"
+  the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations
+
+  Received:
+    time: ${time}(${typeof time})
+    onTimeChange: (${typeof onTimeChange})
+  ${NOT_A_DEFECT}`);
 };
 
 const throwUncontrolledDateTimeError = (dateTime, onDateTimeChange) => {
-  throw new Error("".concat(PREPEND, "you are trying to use a date-time selector while providing a non-string \"dateTime\" or providing a non-function to \"onDateTimeChange\"\n  the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations\n\n  Received:\n    dateTime: ").concat(dateTime, "(").concat(typeof dateTime, ")\n    onDateTimeChange: (").concat(typeof onDateTimeChange, ")\n  ").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}you are trying to use a date-time selector while providing a non-string "dateTime" or providing a non-function to "onDateTimeChange"
+  the full-controlled pattern must be used\n\tcheck https://reactjs.org/docs/forms.html#controlled-components for more informations
+
+  Received:
+    dateTime: ${dateTime}(${typeof dateTime})
+    onDateTimeChange: (${typeof onDateTimeChange})
+  ${NOT_A_DEFECT}`);
 };
 
 const throwInvalidEmptyPickerStartingMonthError = emptyPickerStartingMonth => {
-  throw new Error("".concat(PREPEND, "the provided emptyPickerStartingMonth props is invalid. please provide a string with the format mm/__/yyyy, (mm 01~12, yyyy 0001~9999) \n\n  Received:\n    ").concat(emptyPickerStartingMonth, "(").concat(typeof emptyPickerStartingMonth, ")\n  ").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}the provided emptyPickerStartingMonth props is invalid. please provide a string with the format mm/__/yyyy, (mm 01~12, yyyy 0001~9999) 
+
+  Received:
+    ${emptyPickerStartingMonth}(${typeof emptyPickerStartingMonth})
+  ${NOT_A_DEFECT}`);
 };
 
 const throwInvalidOnCalendarOpenFocusedDayError = onCalendarOpenFocusedDay => {
-  throw new Error("".concat(PREPEND, "the provided onCalendarOpenFocusedDay props is invalid. please provide a string with the format mm/dd/yyyy, (mm 01~12, dd 01~31, yyyy 0001~9999) \n\n  Received:\n    ").concat(onCalendarOpenFocusedDay, "(").concat(typeof onCalendarOpenFocusedDay, ")\n  ").concat(NOT_A_DEFECT));
+  throw new Error(`${PREPEND}the provided onCalendarOpenFocusedDay props is invalid. please provide a string with the format mm/dd/yyyy, (mm 01~12, dd 01~31, yyyy 0001~9999) 
+
+  Received:
+    ${onCalendarOpenFocusedDay}(${typeof onCalendarOpenFocusedDay})
+  ${NOT_A_DEFECT}`);
 };
 
 const useValidateProps = props => {

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

@@ -47,10 +47,8 @@ const ClearButton = () => {
     size: DSButton.BUTTON_SIZES.M,
     "data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.CLEAR_BUTTON,
     innerRef: DomElem => {
-      var _DomElem$focus;
-
       clearButtonRef.current = DomElem;
-      if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem === null || DomElem === void 0 ? void 0 : (_DomElem$focus = DomElem.focus) === null || _DomElem$focus === void 0 ? void 0 : _DomElem$focus.call(DomElem);
+      if (latestInteractionRegion === 'clear-btn' && currFocusDescriber === 'clear-btn') DomElem?.focus?.();
     },
     onClick: onClearClick,
     onKeyDown: onClearButtonKeyDown

package/cjs/date-time-picker/parts/DateInputs/DDInput.js

@@ -33,9 +33,7 @@ const DDInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     isFocused
   } = _ref;
   const validateOnChange = React.useCallback(e => {
-    var _e$target;
-
-    if (isInvalidDay(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
+    if (isInvalidDay(e?.target?.value)) {
       e.preventDefault();
       return;
     }
@@ -49,13 +47,11 @@ const DDInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     onKeyDown: onKeyDown,
     value: value,
     ref: DomElem => {
-      var _DomElem$focus;
-
       contextRef.current = DomElem;
-      if (isFocused) DomElem === null || DomElem === void 0 ? void 0 : (_DomElem$focus = DomElem.focus) === null || _DomElem$focus === void 0 ? void 0 : _DomElem$focus.call(DomElem);
+      if (isFocused) DomElem?.focus?.();
     },
     placeholder: placeholder,
-    "aria-label": "day input field, ".concat(ariaCurrentValueForInputs),
+    "aria-label": `day input field, ${ariaCurrentValueForInputs}`,
     "data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.DAY,
     disabled: disabled,
     "aria-disabled": disabled

package/cjs/date-time-picker/parts/DateInputs/MMInput.js

@@ -34,9 +34,7 @@ const MMInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     isFocused
   } = _ref;
   const validateOnChange = React.useCallback(e => {
-    var _e$target;
-
-    if (isInvalidMonth(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
+    if (isInvalidMonth(e?.target?.value)) {
       e.preventDefault();
       return;
     }
@@ -51,13 +49,11 @@ const MMInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     onKeyDown: onKeyDown,
     value: value,
     ref: DomElem => {
-      var _DomElem$focus;
-
       contextRef.current = DomElem;
-      if (isFocused) DomElem === null || DomElem === void 0 ? void 0 : (_DomElem$focus = DomElem.focus) === null || _DomElem$focus === void 0 ? void 0 : _DomElem$focus.call(DomElem);
+      if (isFocused) DomElem?.focus?.();
     },
     placeholder: placeholder,
-    "aria-label": "month input field, ".concat(ariaCurrentValueForInputs),
+    "aria-label": `month input field, ${ariaCurrentValueForInputs}`,
     "data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.MONTH,
     disabled: disabled,
     "aria-disabled": disabled

package/cjs/date-time-picker/parts/DateInputs/YYYYInput.js

@@ -33,9 +33,7 @@ const YYYYInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     isFocused
   } = _ref;
   const validateOnChange = React.useCallback(e => {
-    var _e$target;
-
-    if (isInvalidYear(e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value)) {
+    if (isInvalidYear(e?.target?.value)) {
       e.preventDefault();
       return;
     }
@@ -49,13 +47,11 @@ const YYYYInput = /*#__PURE__*/React__default["default"].memo(_ref => {
     onKeyDown: onKeyDown,
     value: value,
     ref: DomElem => {
-      var _DomElem$focus;
-
       contextRef.current = DomElem;
-      if (isFocused) DomElem === null || DomElem === void 0 ? void 0 : (_DomElem$focus = DomElem.focus) === null || _DomElem$focus === void 0 ? void 0 : _DomElem$focus.call(DomElem);
+      if (isFocused) DomElem?.focus?.();
     },
     placeholder: placeholder,
-    "aria-label": "year input field, ".concat(ariaCurrentValueForInputs),
+    "aria-label": `year input field, ${ariaCurrentValueForInputs}`,
     "data-testid": ControlledDateTimePickerDatatestid.ControlledDateTimePickerDatatestid.DATE_INPUTS.YEAR,
     disabled: disabled,
     "aria-disabled": disabled

package/cjs/date-time-picker/parts/DateInputs/useDateInputs.js

@@ -75,9 +75,7 @@ const useDateInputs = () => {
     trackFocusMonthInput();
   }, [trackFocusMonthInput]);
   const onMonthChange = React.useCallback(e => {
-    var _e$target;
-
-    let newMonth = e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value; // converts months 2~9 to 02~09
+    let newMonth = e?.target?.value; // converts months 2~9 to 02~09
 
     if (Number.parseInt(newMonth, 10) > 1) newMonth = stringHelpers.prependStringWithPlaceHolders(newMonth, 2);
     handleChangeMonth(newMonth, e); // auto-advance functionality:
@@ -100,12 +98,12 @@ const useDateInputs = () => {
       const monthInteger = Number.isNaN(monthStringConvertedToInteger) ? 0 : monthStringConvertedToInteger;
       let newMonth;
       if (key === 'ArrowUp') newMonth = monthInteger + 1 <= 12 ? monthInteger + 1 : monthInteger;else newMonth = monthInteger - 1 > 0 ? monthInteger - 1 : 1;
-      newMonth = stringHelpers.prependStringWithPlaceHolders("".concat(newMonth), 2);
+      newMonth = stringHelpers.prependStringWithPlaceHolders(`${newMonth}`, 2);
       handleChangeMonth(newMonth, e);
     }
 
     if (!Number.isNaN(monthStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\')) {
-      const newMonth = stringHelpers.prependStringWithPlaceHolders("".concat(monthStringConvertedToInteger), 2);
+      const newMonth = stringHelpers.prependStringWithPlaceHolders(`${monthStringConvertedToInteger}`, 2);
       handleChangeMonth(newMonth, e); // auto-advance functionality:
 
       if (newMonth.length === 2) trackFocusDayInput();
@@ -115,9 +113,7 @@ const useDateInputs = () => {
     if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();
   }, [month, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, trackFocusDayInput, handleChangeMonth]);
   const onMonthBlur = React.useCallback(e => {
-    var _e$target2;
-
-    const newMonth = e === null || e === void 0 ? void 0 : (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value;
+    const newMonth = e?.target?.value;
     if (newMonth === '0') handleChangeMonth('01', e, {
       isAutomaticFillTrigger: true
     });else if (newMonth.length > 0 && newMonth.length < 2) handleChangeMonth(stringHelpers.prependStringWithPlaceHolders(newMonth, 2), e, {
@@ -143,9 +139,7 @@ const useDateInputs = () => {
     trackFocusDayInput();
   }, [trackFocusDayInput]);
   const onDayChange = React.useCallback(e => {
-    var _e$target3;
-
-    let newDay = e === null || e === void 0 ? void 0 : (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value; // converts days 4~9 to 04~09
+    let newDay = e?.target?.value; // converts days 4~9 to 04~09
 
     if (Number.parseInt(newDay, 10) > 3) newDay = stringHelpers.prependStringWithPlaceHolders(newDay, 2);
     handleChangeDay(newDay, e); // auto-advance functionality:
@@ -168,19 +162,19 @@ const useDateInputs = () => {
       const dayInteger = Number.isNaN(dayStringConvertedToInteger) ? 0 : dayStringConvertedToInteger;
       let newDay;
       if (key === 'ArrowUp') newDay = dayInteger + 1 <= 31 ? dayInteger + 1 : dayInteger;else newDay = dayInteger - 1 > 0 ? dayInteger - 1 : 1;
-      newDay = stringHelpers.prependStringWithPlaceHolders("".concat(newDay), 2);
+      newDay = stringHelpers.prependStringWithPlaceHolders(`${newDay}`, 2);
       handleChangeDay(newDay, e);
     }
 
     if (!Number.isNaN(dayStringConvertedToInteger) && (key === '-' || key === '/' || key === '\\')) {
-      const newDay = stringHelpers.prependStringWithPlaceHolders("".concat(dayStringConvertedToInteger), 2);
+      const newDay = stringHelpers.prependStringWithPlaceHolders(`${dayStringConvertedToInteger}`, 2);
       handleChangeDay(newDay, e); // auto-advance functionality:
 
       if (newDay.length === 2) trackFocusYearInput();
     } // regressive backspace functionality
 
 
-    if (key === 'Backspace' && (day === null || day === void 0 ? void 0 : day.length) === 0) {
+    if (key === 'Backspace' && day?.length === 0) {
       trackFocusMonthInput();
     } // focus last fragment on fill with now
 
@@ -188,9 +182,7 @@ const useDateInputs = () => {
     if ((ctrlKey || metaKey) && key === ';') trackFocusLastSegment();
   }, [day, onHomeKeyDown, onEndKeyDown, trackFocusLastSegment, handleChangeDay, trackFocusYearInput, trackFocusMonthInput]);
   const onDayBlur = React.useCallback(e => {
-    var _e$target4;
-
-    const newDay = e === null || e === void 0 ? void 0 : (_e$target4 = e.target) === null || _e$target4 === void 0 ? void 0 : _e$target4.value;
+    const newDay = e?.target?.value;
     if (newDay === '0') handleChangeDay('01', e, {
       isAutomaticFillTrigger: true
     });else if (newDay.length > 0 && newDay.length < 2) handleChangeDay(stringHelpers.prependStringWithPlaceHolders(newDay, 2), e, {
@@ -216,9 +208,7 @@ const useDateInputs = () => {
     trackFocusYearInput();
   }, [trackFocusYearInput]);
   const onYearChange = React.useCallback(e => {
-    var _e$target5;
-
-    const newYear = e === null || e === void 0 ? void 0 : (_e$target5 = e.target) === null || _e$target5 === void 0 ? void 0 : _e$target5.value;
+    const newYear = e?.target?.value;
     handleChangeYear(newYear, e); // auto-advance functionality:
 
     if (newYear.length === 4) {
@@ -237,12 +227,12 @@ const useDateInputs = () => {
 
     const yearStringConvertedToInteger = Number.parseInt(year, 10);
     const yearInteger = Number.isNaN(yearStringConvertedToInteger) ? 0 : yearStringConvertedToInteger;
-    let newYear = yearInteger !== 0 ? stringHelpers.fillStringWithPlaceHolders("".concat(yearInteger), 4, '0') : '';
+    let newYear = yearInteger !== 0 ? stringHelpers.fillStringWithPlaceHolders(`${yearInteger}`, 4, '0') : '';
 
     if (key === 'ArrowUp' || key === 'ArrowDown') {
       let newYearInteger;
       if (key === 'ArrowUp') newYearInteger = yearInteger + 1 <= 9999 ? yearInteger + 1 : yearInteger;else newYearInteger = yearInteger - 1 > 0 ? yearInteger - 1 : 1;
-      newYear = stringHelpers.prependStringWithPlaceHolders("".concat(newYearInteger), 4);
+      newYear = stringHelpers.prependStringWithPlaceHolders(`${newYearInteger}`, 4);
     }
 
     const isAutomaticFillTrigger = newYear !== year && ['Tab', ' '].includes(key);
@@ -275,7 +265,7 @@ const useDateInputs = () => {
     /* ********** regressive backspace logic ********** */
 
 
-    if (key === 'Backspace' && (year === null || year === void 0 ? void 0 : year.length) === 0) {
+    if (key === 'Backspace' && year?.length === 0) {
       trackFocusDayInput();
     } // focus last fragment on fill with now
 

package/cjs/date-time-picker/parts/Pickers/Calendar/CalendarDaysList.js

@@ -28,7 +28,7 @@ const CalendarDaysList = /*#__PURE__*/React__default["default"].memo(_ref => {
     children: [invisibleFirstDay ? /*#__PURE__*/_jsx__default["default"](Day.Day, {
       metaDay: invisibleFirstDay,
       isInvisible: true
-    }, "ds-calendar-".concat(invisibleFirstDay.day.toString())) : null, daysMatrixByWeekday.map((week, i) => /*#__PURE__*/_jsx__default["default"](Styleds.StyledWeekDaysListWrapper, {
+    }, `ds-calendar-${invisibleFirstDay.day.toString()}`) : null, daysMatrixByWeekday.map((week, i) => /*#__PURE__*/_jsx__default["default"](Styleds.StyledWeekDaysListWrapper, {
       role: "row",
       "aria-rowindex": i + 1,
       cols: ['32px', '32px', '32px', '32px', '32px', '32px', '32px'],
@@ -37,13 +37,13 @@ const CalendarDaysList = /*#__PURE__*/React__default["default"].memo(_ref => {
       px: "2px",
       justifyContent: "space-between",
       alignItems: "center"
-    }, "ds-calendar-week-".concat(week[0].day.toString(), "-").concat(week[6].day.toString()), week.map((metaDay, z) => /*#__PURE__*/_jsx__default["default"](Day.Day, {
+    }, `ds-calendar-week-${week[0].day.toString()}-${week[6].day.toString()}`, week.map((metaDay, z) => /*#__PURE__*/_jsx__default["default"](Day.Day, {
       metaDay: metaDay,
       colIndex: z + 1
-    }, "ds-calendar-".concat(metaDay.day.toString()))))), invisibleLastDay ? /*#__PURE__*/_jsx__default["default"](Day.Day, {
+    }, `ds-calendar-${metaDay.day.toString()}`)))), invisibleLastDay ? /*#__PURE__*/_jsx__default["default"](Day.Day, {
       metaDay: invisibleLastDay,
       isInvisible: true
-    }, "ds-calendar-".concat(invisibleLastDay.day.toString())) : null]
+    }, `ds-calendar-${invisibleLastDay.day.toString()}`) : null]
   });
 });