@elliemae/ds-controlled-form 2.4.2-rc.11 → 2.4.2-rc.14

package/esm/combobox/parts/controls-input/useControlsInput.js

@@ -1,5 +1,3 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'core-js/modules/es.string.replace.js';
 import { useContext, useState, useRef, useEffect, useCallback, useMemo } from 'react';
 import { useMaskedOnChange } from './useMaskedOnChange.js';
 import { ComboBoxContext } from '../../ComboBoxCTX.js';
@@ -24,9 +22,7 @@ const useControlsInput = () => {
   const showPlaceholder = !inputValue && isSelectedValueEmpty(selectedValues) ? placeholder : null;
   const spanReferenceText = inputValue.replace(/\s/g, '\u00a0');
   useEffect(() => {
-    var _spanReference$curren;
-
-    setWidth((_spanReference$curren = spanReference.current) !== null && _spanReference$curren !== void 0 && _spanReference$curren.offsetWidth ? spanReference.current.offsetWidth + 2 : 1);
+    setWidth(spanReference.current?.offsetWidth ? spanReference.current.offsetWidth + 2 : 1);
   }, [inputValue]); // if we se an input mask we configure inside here the proper mask
   // or a stardard combobox onchange event
 

package/esm/combobox/parts/controls-input/useKeyboardNavigation.js

@@ -44,7 +44,7 @@ const useKeyboardNavigation = () => {
     // =============================================================================
     // CUSTOM KEYS
     // =============================================================================
-    if (onKeyDown && (currentItem === null || currentItem === void 0 ? void 0 : currentItem.type) === MENU_OPTION_TYPES.OPTION) onKeyDown(e, currentItem);
+    if (onKeyDown && currentItem?.type === MENU_OPTION_TYPES.OPTION) onKeyDown(e, currentItem);
 
     if ((['ArrowDown', 'ArrowUp', 'Enter', 'Spacebar'].includes(e.key) || e.keyCode >= 48 && e.keyCode <= 90) && !menuState) {
       setMenuState(true);
@@ -70,7 +70,7 @@ const useKeyboardNavigation = () => {
     // =============================================================================
 
 
-    if (e.key === 'Enter' && (currentItem === null || currentItem === void 0 ? void 0 : currentItem.type) === INTERNAL_MENU_OPTION_TYPES.CREATABLE && onCreate) {
+    if (e.key === 'Enter' && currentItem?.type === INTERNAL_MENU_OPTION_TYPES.CREATABLE && onCreate) {
       onCreate(inputValue); // blank active item to force search last one
 
       setFocusOptionIdx('');
@@ -86,7 +86,7 @@ const useKeyboardNavigation = () => {
       e.preventDefault();
       e.stopPropagation();
 
-      if (focusOptionIdx !== '' && (menuState || inline) && (currentItem === null || currentItem === void 0 ? void 0 : currentItem.type) === MENU_OPTION_TYPES.OPTION && !currentItem.disabled) {
+      if (focusOptionIdx !== '' && (menuState || inline) && currentItem?.type === MENU_OPTION_TYPES.OPTION && !currentItem.disabled) {
         if (onFilter) onFilter(allOptions, '');
         setInputValue('');
 
@@ -159,9 +159,7 @@ const useKeyboardNavigation = () => {
     }
 
     if (e.key === 'Tab' && !inline && menuState) {
-      var _selectAllCheckboxRef;
-
-      const element = (_selectAllCheckboxRef = selectAllCheckboxRef.current) !== null && _selectAllCheckboxRef !== void 0 ? _selectAllCheckboxRef : toggleSelectionButtonRef.current;
+      const element = selectAllCheckboxRef.current ?? toggleSelectionButtonRef.current;
 
       if (element) {
         e.preventDefault();

package/esm/combobox/parts/controls-input/useMaskedOnChange.js

@@ -33,7 +33,7 @@ const useMaskedOnChange = () => {
     valueSetter: setInputValue,
     onChange: handleOnChangeMask
   });
-  return (onChangeMask === null || onChangeMask === void 0 ? void 0 : onChangeMask.onChange) || handleOnChange;
+  return onChangeMask?.onChange || handleOnChange;
 };
 
 export { useMaskedOnChange };

package/esm/combobox/parts/header-list/HeaderList.js

@@ -51,7 +51,7 @@ const HeaderList = () => {
     size: BUTTON_SIZES.S,
     "data-testid": ComboboxDataTestid.MULTISELECT.SHOW_SELECTED_OPTIONS_TOGGLE,
     innerRef: toggleSelectionButtonRef
-  }, void 0, !showSelectedOptions ? "SHOW SELECTED [".concat(multiSelectedValues.length, "]") : 'SHOW ALL') : _StyledNoOptionsSelec || (_StyledNoOptionsSelec = /*#__PURE__*/_jsx(StyledNoOptionsSelected, {}, void 0, "0 SELECTED"))));
+  }, void 0, !showSelectedOptions ? `SHOW SELECTED [${multiSelectedValues.length}]` : 'SHOW ALL') : _StyledNoOptionsSelec || (_StyledNoOptionsSelec = /*#__PURE__*/_jsx(StyledNoOptionsSelected, {}, void 0, "0 SELECTED"))));
 };
 
 export { HeaderList };

package/esm/combobox/parts/header-list/styled.js

@@ -1,12 +1,45 @@
-import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
 import { styled } from '@elliemae/ds-system';
 import { DSButtonV2 } from '@elliemae/ds-button';
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-const StyledHeaderListWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  display: flex;\n  position: fixed;\n  top: 0;\n  z-index: 10;\n  justify-content: space-between;\n  padding: 0px 12px 0px 16px;\n  width: 100%;\n  height: 28px;\n  background-color: #fff;\n  box-shadow: 0 4px 2px -4px ", ";\n  overflow-x: hidden;\n\n  & button {\n    font-size: 13px;\n  }\n"])), props => props.theme.colors.neutral[700]);
-const StyledButtonSelection = styled(DSButtonV2)(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  border-radius: 0px;\n  padding: 0 ", ";\n  margin: 0;\n  align-items: center;\n  transition: unset;\n  &:hover:not([disabled]) {\n    background-color: transparent;\n    color: ", ";\n  }\n"])), props => props.theme.space.xxs, props => props.theme.colors.brand['700']);
-const StyledSelectedItems = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
-const StyledNoOptionsSelected = styled.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  padding: 0 ", ";\n"])), props => props.theme.space.xxs);
-const StyledSelectAllCheckbox = styled.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  display: flex;\n  align-items: center;\n"])));
+/* eslint-disable max-len */
+const StyledHeaderListWrapper = styled.div`
+  display: flex;
+  position: fixed;
+  top: 0;
+  z-index: 10;
+  justify-content: space-between;
+  padding: 0px 12px 0px 16px;
+  width: 100%;
+  height: 28px;
+  background-color: #fff;
+  box-shadow: 0 4px 2px -4px ${props => props.theme.colors.neutral[700]};
+  overflow-x: hidden;
+
+  & button {
+    font-size: 13px;
+  }
+`;
+const StyledButtonSelection = styled(DSButtonV2)`
+  border-radius: 0px;
+  padding: 0 ${props => props.theme.space.xxs};
+  margin: 0;
+  align-items: center;
+  transition: unset;
+  &:hover:not([disabled]) {
+    background-color: transparent;
+    color: ${props => props.theme.colors.brand['700']};
+  }
+`;
+const StyledSelectedItems = styled.div`
+  display: flex;
+  align-items: center;
+`;
+const StyledNoOptionsSelected = styled.div`
+  padding: 0 ${props => props.theme.space.xxs};
+`;
+const StyledSelectAllCheckbox = styled.div`
+  display: flex;
+  align-items: center;
+`;
 
 export { StyledButtonSelection, StyledHeaderListWrapper, StyledNoOptionsSelected, StyledSelectAllCheckbox, StyledSelectedItems };

package/esm/combobox/parts/header-list/useHeaderListHandlers.js

@@ -1,4 +1,3 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
@@ -25,7 +24,7 @@ const useHeaderListHandlers = () => {
       return true;
     }
 
-    if ((multiSelectedValues === null || multiSelectedValues === void 0 ? void 0 : multiSelectedValues.length) === 0) {
+    if (multiSelectedValues?.length === 0) {
       return false;
     }
 
@@ -55,27 +54,21 @@ const useHeaderListHandlers = () => {
 
   const handleKeyDown = useCallback(e => {
     if (e.key === 'Escape') {
-      var _innerRef$current;
-
       setMenuState(false, 'close', e);
-      (_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.focus();
+      innerRef.current?.focus();
     }
   }, [setMenuState, innerRef]); // when hitting tab on selected values button filter we target the input again
 
   const handleFilterSelectionBtnOnTab = useCallback(e => {
     if (e.key === 'Tab' && !e.shiftKey) {
-      var _innerRef$current2;
-
       e.preventDefault();
-      (_innerRef$current2 = innerRef.current) === null || _innerRef$current2 === void 0 ? void 0 : _innerRef$current2.focus();
+      innerRef.current?.focus();
     }
   }, [innerRef]);
   const handleCheckAllOnTab = useCallback(e => {
     if (e.key === 'Tab' && !e.shiftKey && multiSelectedValues.length === 0) {
-      var _innerRef$current3;
-
       e.preventDefault();
-      (_innerRef$current3 = innerRef.current) === null || _innerRef$current3 === void 0 ? void 0 : _innerRef$current3.focus();
+      innerRef.current?.focus();
     }
   }, [innerRef, multiSelectedValues]);
   useEffect(() => {

package/esm/combobox/parts/menu-list/MenuList.js

@@ -56,14 +56,14 @@ const MenuList = () => {
         role: "listbox",
         "data-testid": ComboboxDataTestid.LIST,
         style: {
-          height: virtualListHelpers === null || virtualListHelpers === void 0 ? void 0 : virtualListHelpers.totalSize,
+          height: virtualListHelpers?.totalSize,
           margin: inline ? '0px' : '8px 0px'
         }
       }, void 0, ItemRenderer)
     }) : _StyledNoResultsWrapp || (_StyledNoResultsWrapp = /*#__PURE__*/_jsx(StyledNoResultsWrapper, {
       role: "alert"
     }, void 0, noOptionsMessage))]
-  }, width), [wrapperListRef, inline, preventLoseInputFocus, width, menuMinWidth, withHeader, filteredOptions.length, onCreate, menuMaxHeight, listRef, virtualListHelpers === null || virtualListHelpers === void 0 ? void 0 : virtualListHelpers.totalSize, ItemRenderer, noOptionsMessage]);
+  }, width), [wrapperListRef, inline, preventLoseInputFocus, width, menuMinWidth, withHeader, filteredOptions.length, onCreate, menuMaxHeight, listRef, virtualListHelpers?.totalSize, ItemRenderer, noOptionsMessage]);
 };
 
 export { MenuList };

package/esm/combobox/parts/menu-list/styled.js

@@ -1,38 +1,58 @@
-import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
 import { styled } from '@elliemae/ds-system';
 
-var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
-const StyledListWrapper = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  min-width: ", ";\n  width: ", ";\n  background-color: #ffffff;\n  max-height: ", ";\n  z-index: 100;\n"])), _ref => {
+const StyledListWrapper = styled.div`
+  min-width: ${_ref => {
   let {
     inline,
     minWidth
   } = _ref;
-  return inline ? '100%' : "".concat(minWidth, "px");
-}, _ref2 => {
+  return inline ? '100%' : `${minWidth}px`;
+}};
+  width: ${_ref2 => {
   let {
     width
   } = _ref2;
-  return "".concat(width, "px");
-}, _ref3 => {
+  return `${width}px`;
+}};
+  background-color: #ffffff;
+  max-height: ${_ref3 => {
   let {
     maxHeight
   } = _ref3;
-  return "".concat(maxHeight, "px");
-});
-const StyledList = styled.ul(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n  position: relative;\n  padding: 0;\n  background-color: #ffffff;\n  overflow-x: hidden;\n"])));
-const StyledVirtualListWrapper = styled.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n  overflow-y: auto;\n  margin-top: ", ";\n  max-height: ", ";\n"])), _ref4 => {
+  return `${maxHeight}px`;
+}};
+  z-index: 100;
+`;
+const StyledList = styled.ul`
+  position: relative;
+  padding: 0;
+  background-color: #ffffff;
+  overflow-x: hidden;
+`;
+const StyledVirtualListWrapper = styled.div`
+  overflow-y: auto;
+  margin-top: ${_ref4 => {
   let {
     withHeader
   } = _ref4;
   return withHeader ? '28px' : '';
-}, _ref5 => {
+}};
+  max-height: ${_ref5 => {
   let {
     maxHeight
   } = _ref5;
-  return maxHeight ? "".concat(maxHeight, "px") : '300px';
-});
-const StyledCreatableLabel = styled.span(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n  font-weight: bold;\n  font-style: italic;\n"])));
-const StyledCreatableValue = styled.span(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n  word-break: break-all;\n"])));
-const StyledNoResultsWrapper = styled.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n  padding: 16px;\n"])));
+  return maxHeight ? `${maxHeight}px` : '300px';
+}};
+`;
+const StyledCreatableLabel = styled.span`
+  font-weight: bold;
+  font-style: italic;
+`;
+const StyledCreatableValue = styled.span`
+  word-break: break-all;
+`;
+const StyledNoResultsWrapper = styled.div`
+  padding: 16px;
+`;
 
 export { StyledCreatableLabel, StyledCreatableValue, StyledList, StyledListWrapper, StyledNoResultsWrapper, StyledVirtualListWrapper };

package/esm/combobox/parts/menu-list/useItemRenderer.js

@@ -82,9 +82,9 @@ const useItemRenderer = () => {
           top: 0,
           left: 0,
           width: '100%',
-          transform: "translateY(".concat(vItem.start, "px)")
+          transform: `translateY(${vItem.start}px)`
         },
-        key: "".concat(option.dsId),
+        key: `${option.dsId}`,
         innerRef: vItem.measureRef
       };
 
@@ -126,7 +126,7 @@ const useItemRenderer = () => {
               cols: ['min-content', 'auto'],
               gutter: "xxs",
               alignItems: "center"
-            }, void 0, _StyledCreatableLabel || (_StyledCreatableLabel = /*#__PURE__*/_jsx(StyledCreatableLabel, {}, void 0, "Add:")), /*#__PURE__*/_jsx(StyledCreatableValue, {}, void 0, "\"".concat(label, "\"")));
+            }, void 0, _StyledCreatableLabel || (_StyledCreatableLabel = /*#__PURE__*/_jsx(StyledCreatableLabel, {}, void 0, "Add:")), /*#__PURE__*/_jsx(StyledCreatableValue, {}, void 0, `"${label}"`));
           },
           label: option.label,
           onClick: handleOnCreateClick

package/esm/combobox/parts/multi-selected-values-container/MultiSelectedValuesContainer.js

@@ -31,7 +31,7 @@ const MultiSelectedValuesContainer = () => {
   }, pill.dsId)), multiSelectedValue.length > 0 && correctPillsToShow !== multiSelectedValue.length && /*#__PURE__*/_jsx(DSPillV2, {
     size: "s",
     labelTruncated: false,
-    label: "+".concat(multiSelectedValue.length - correctPillsToShow),
+    label: `+${multiSelectedValue.length - correctPillsToShow}`,
     type: "value",
     disabled: disabled
   }, "grouped"))), [pillGroupRef, multiSelectedValue, correctPillsToShow, disabled]);

package/esm/combobox/parts/multi-selected-values-container/RemovableSelectedValuePill.js

@@ -23,12 +23,10 @@ const RemovableSelectedValuePill = props => {
     type: disabled ? 'value' : 'removable',
     tabIndex: -1,
     onRemove: e => {
-      var _innerRef$current;
-
       // preventing the menu to be opened
       e.stopPropagation();
       onChange(getSuggestedValueOnChange(pill, selectedValues), pill, e);
-      (_innerRef$current = innerRef.current) === null || _innerRef$current === void 0 ? void 0 : _innerRef$current.focus();
+      innerRef.current?.focus();
     }
   }, pill.value);
 };

package/esm/combobox/parts/multi-selected-values-container/useGroupPills.js

@@ -1,4 +1,3 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.js';
 import 'core-js/modules/esnext.async-iterator.for-each.js';
@@ -49,7 +48,7 @@ const useGroupPills = () => {
       let currentWidth = 0;
       const referenceWidth = selectedOptionsRef.current.offsetWidth;
       const pills = [...pillGroupRef.current.querySelectorAll(disabled ? '.ds-pill-wrapper-value' : '.ds-pill-wrapper-removable')];
-      const pillsWidth = pills.map(pill => pill === null || pill === void 0 ? void 0 : pill.offsetWidth);
+      const pillsWidth = pills.map(pill => pill?.offsetWidth);
       pillsWidth.forEach((pillWidth, idx) => {
         currentWidth += pillWidth;
 

package/esm/combobox/parts/styled.js

@@ -1,7 +1,10 @@
-import _taggedTemplateLiteral from '@babel/runtime/helpers/esm/taggedTemplateLiteral';
 import { styled } from '@elliemae/ds-system';
 
-var _templateObject;
-const StyledA11ySelectedValues = styled.span(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 1px;\n  height: 1px;\n  position: absolute;\n  clip: rect(1px, 1px, 1px, 1px);\n"])));
+const StyledA11ySelectedValues = styled.span`
+  width: 1px;
+  height: 1px;
+  position: absolute;
+  clip: rect(1px, 1px, 1px, 1px);
+`;
 
 export { StyledA11ySelectedValues };

package/esm/combobox/sharedTypes.js

@@ -1,6 +1,6 @@
 import { MENU_OPTION_TYPES } from './constants.js';
 
-const isSeparator = el => (el === null || el === void 0 ? void 0 : el.type) === MENU_OPTION_TYPES.SEPARATOR;
-const isOption = el => (el === null || el === void 0 ? void 0 : el.type) === MENU_OPTION_TYPES.OPTION;
+const isSeparator = el => el?.type === MENU_OPTION_TYPES.SEPARATOR;
+const isOption = el => el?.type === MENU_OPTION_TYPES.OPTION;
 
 export { isOption, isSeparator };

package/esm/combobox/utils/listHelper.js

@@ -5,7 +5,6 @@ import 'core-js/modules/esnext.async-iterator.some.js';
 import 'core-js/modules/esnext.iterator.some.js';
 import 'core-js/modules/esnext.async-iterator.find.js';
 import 'core-js/modules/esnext.iterator.find.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
 import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
 import { MENU_OPTION_TYPES } from '../constants.js';
@@ -17,11 +16,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;
@@ -71,8 +70,6 @@ const getSuggestedValueOnChange = (selectedOption, selectedValues) => {
 };
 const filterOptions = (inputValue, options) => options.filter(option => option.type === 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);
@@ -81,9 +78,7 @@ const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
     }
 
     if (option.type === MENU_OPTION_TYPES.SECTION) {
-      var _items;
-
-      if (((_items = items[items.length - 1]) === null || _items === void 0 ? void 0 : _items.type) === MENU_OPTION_TYPES.SECTION) {
+      if (items[items.length - 1]?.type === MENU_OPTION_TYPES.SECTION) {
         items[items.length - 1] = option;
       } else {
         items.push(option);
@@ -91,7 +86,7 @@ const selectedValuesWithSections = (optionsToParse, multiSelectedValue) => {
     }
   });
 
-  if (((_items2 = items[items.length - 1]) === null || _items2 === void 0 ? void 0 : _items2.type) === MENU_OPTION_TYPES.SECTION) {
+  if (items[items.length - 1]?.type === MENU_OPTION_TYPES.SECTION) {
     items.pop();
   }
 

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

@@ -4,12 +4,10 @@ import 'core-js/modules/esnext.iterator.filter.js';
 import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useEffect, useCallback, useMemo } from 'react';
 import '../../date-time-picker/ControlledDateTimePicker.js';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/es.string.replace.js';
 import { getDayFromDateString } from '../../date-time-picker/utils/dateHelpers.js';
 
 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; }
@@ -46,7 +44,7 @@ const useRangePickerLogic = _ref => {
     const dateToString = calendarChangeIsFrom ? toDate : changedDay;
     const dateTo = 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;
@@ -121,19 +119,17 @@ const useRangePickerLogic = _ref => {
   }, [getChangedDayStringValues, onFromDateChange, onToDateChange]);
   const getIsStartRangeDay = useCallback(dayString => dayString === fromDate, [fromDate]);
   const getIsDayInRange = useCallback(dayString => {
-    var _getDayFromDateString;
-
     const dayFrom = getDayFromDateString(fromDate);
     const dayTo = getDayFromDateString(toDate);
     if (!dayFrom || !dayTo || !dayString) return false;
-    const newDayTime = (_getDayFromDateString = getDayFromDateString(dayString)) === null || _getDayFromDateString === void 0 ? void 0 : _getDayFromDateString.getTime();
+    const newDayTime = getDayFromDateString(dayString)?.getTime();
     return newDayTime <= dayTo.getTime() && newDayTime >= dayFrom.getTime();
   }, [fromDate, toDate]);
   const getIsEndRangeDay = useCallback(dayString => dayString === toDate, [toDate]);
   const getIsToBeforeFrom = useCallback((fromString, toString) => {
     const dateFrom = getDayFromDateString(fromString);
     const dateTo = 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 = useCallback((newVal, metaInfo) => {
     const isIncorrectOrder = getIsToBeforeFrom(newVal, toDate);

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

@@ -4,8 +4,6 @@ import { DSControlledDateTimePicker } from '../../date-time-picker/ControlledDat
 import { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../date-time-picker/ControlledDateTimePickerTypes.js';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'core-js/modules/es.string.replace.js';
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';

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

@@ -5,8 +5,6 @@ import { DSControlledDateTimePicker } from '../../date-time-picker/ControlledDat
 import { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../date-time-picker/ControlledDateTimePickerTypes.js';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'core-js/modules/es.string.replace.js';
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';

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

@@ -5,8 +5,6 @@ import { DSControlledDateTimePicker } from '../../date-time-picker/ControlledDat
 import { CONTROLLED_DATE_TIME_PICKER_TYPES } from '../../date-time-picker/ControlledDateTimePickerTypes.js';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
-import 'core-js/modules/es.string.replace.js';
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';

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

@@ -81,7 +81,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,
@@ -98,7 +98,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,
@@ -114,7 +114,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/esm/date-time-picker/config/useControlledDateTimePicker.js

@@ -59,7 +59,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.useMemo(() => _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({
     props: propsWithDefaults,
     ariaCurrentValueForInputs,

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

@@ -1,6 +1,6 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useCallback, useMemo } from 'react';
 
+/* eslint-disable max-lines */
 const useFocusTracker = _ref => {
   let {
     DOMRefs,

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

@@ -34,8 +34,8 @@ const useGetDestructuredDateValues = _ref => {
   const yearNum = convertToPositiveNumberIfPossible(year);
   const announcedMonth = monthNum !== -1 ? monthNames[monthNum - 1] : 'empty month';
   const announcedDay = dayNum !== -1 ? announcableCardinalDays[dayNum] : 'empty day';
-  const announcedYear = yearNum !== -1 ? fillStringWithPlaceHolders("".concat(yearNum), 4, '0') : 'empty year';
-  const announcedDateValues = "".concat(announcedMonth, ", ").concat(announcedDay, ", ").concat(announcedYear);
+  const announcedYear = yearNum !== -1 ? fillStringWithPlaceHolders(`${yearNum}`, 4, '0') : 'empty year';
+  const announcedDateValues = `${announcedMonth}, ${announcedDay}, ${announcedYear}`;
   return useMemo(() => ({
     month,
     day,
@@ -69,12 +69,12 @@ const useGetDestructuredTimeValues = _ref2 => {
   const hoursNum = convertToPositiveNumberIfPossible(hours);
   const minutesNum = 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 useMemo(() => ({
     hours,
     minutes,

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

@@ -23,7 +23,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/esm/date-time-picker/config/useGetReferences.js

@@ -1,6 +1,6 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useRef, useMemo } from 'react';
 
+/* eslint-disable complexity */
 const useGetReferences = _ref => {
   let {
     isWithDateInputs,

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

@@ -1,8 +1,8 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useMemo, useState } from 'react';
 import { getIsDateTime, getIsDate, getIsTime } from '../utils/typeGuards.js';
 import { dateTimeToDate, dateTimeToTime } from '../utils/stringHelpers.js';
 
+/* eslint-disable complexity */
 const useRelevantValueFromProps = props => {
   const dateStringFromProps = useMemo(() => {
     if (getIsDateTime(props)) return props.dateTime !== '' ? dateTimeToDate(props.dateTime) : '__/__/____';