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

package/esm/Input/InputAddonWrapper.js

@@ -1,12 +1,11 @@
-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/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
 import 'core-js/modules/esnext.async-iterator.map.js';
 import 'core-js/modules/esnext.iterator.map.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 React, { Component } from 'react';
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/esm/Input/InputImpl.js

@@ -1,11 +1,12 @@
+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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/esnext.async-iterator.for-each.js';
-import 'core-js/modules/esnext.iterator.for-each.js';
+import 'core-js/modules/es.error.cause.js';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { omit } from 'lodash';
@@ -295,7 +296,7 @@ class InputImpl extends Component {
       },
       children: !customInputType ? /*#__PURE__*/jsx(Input, _objectSpread(_objectSpread({}, omit(inputProps, ['disableTooltip'])), {}, {
         autoComplete: "off",
-        clearable: "".concat(clearable),
+        clearable: `${clearable}`,
         onChange: this.handleOnChange,
         onBlur: this.handleBlur,
         onFocus: this.handleFocus // using mouseOver instead of mouseEnter (doesn't trigger on disabled inputs)
@@ -398,7 +399,7 @@ InputImpl.defaultProps = {
   value(props, propName, componentName) {
     // eslint-disable-line consistent-return
     if (!!props.isShowElipsisActive && typeof props[propName] !== 'string') {
-      return new Error("Invalid prop `".concat(propName, "` of type `").concat(typeof props[propName], "` supplied to") + " `".concat(componentName, "`. Prop `value` should be of type `string` if prop `isShowElipsisActive` is set to `true`.") + ' Either set `isShowElipsisActive` to `false`, or properly format your `value` prop to `string`.');
+      return new Error(`Invalid prop \`${propName}\` of type \`${typeof props[propName]}\` supplied to` + ` \`${componentName}\`. Prop \`value\` should be of type \`string\` if prop \`isShowElipsisActive\` is set to \`true\`.` + ' Either set `isShowElipsisActive` to `false`, or properly format your `value` prop to `string`.');
     }
   }
 

package/esm/InputGroup/AddonWrapper.js

@@ -5,7 +5,6 @@ import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { Component } from 'react';
 import { aggregatedClasses } from '@elliemae/ds-classnames';
 import { jsxs } from 'react/jsx-runtime';
@@ -32,7 +31,7 @@ class AddonWrapper extends Component {
     } = this.props;
     const childType = inputComponent && inputComponent.type && inputComponent.type.name ? inputComponent.type.name.toLowerCase() : 'default';
     return /*#__PURE__*/jsxs(Container, _objectSpread(_objectSpread({
-      className: "".concat(className, " ").concat(blockName, "--").concat(childType)
+      className: `${className} ${blockName}--${childType}`
     }, containerProps), {}, {
       children: [leftAddon && /*#__PURE__*/_jsx(InputAddon, {}, void 0, leftAddon), inputComponent, rightAddon && /*#__PURE__*/_jsx(InputAddon, {}, void 0, rightAddon)]
     }));

package/esm/InputMask/DSInputMask.js

@@ -1,11 +1,10 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-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';
 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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import { useState, useEffect, useCallback } from 'react';
 import { describe } from 'react-desc';
 import { MASK_TYPES } from './MaskTypes.js';

package/esm/InputMask/DSInputMaskDeprecated.js

@@ -42,13 +42,11 @@ const getRawMask = function (mask) {
 
 
 const UNSAFEGetRawValue = (value, mask) => {
-  var _safeValue$split, _safeValue$split$filt;
-
   const safeValue = getValueFromEventOrString(value);
   if (!safeValue) return '';
   const rawMask = getRawMask(mask, value);
   const characterToStrip = rawMask.filter(char => typeof char === 'string');
-  return safeValue === null || safeValue === void 0 ? void 0 : (_safeValue$split = safeValue.split('')) === null || _safeValue$split === void 0 ? void 0 : (_safeValue$split$filt = _safeValue$split.filter(char => {
+  return safeValue?.split('')?.filter(char => {
     const indexCharToStrip = characterToStrip.findIndex(strip => strip === char);
 
     if (indexCharToStrip >= 0) {
@@ -57,20 +55,18 @@ const UNSAFEGetRawValue = (value, mask) => {
     }
 
     return true;
-  })) === null || _safeValue$split$filt === void 0 ? void 0 : _safeValue$split$filt.join('');
+  })?.join('');
 }; // this is not safe because we don't take in consideration a lot of cases
 // just a monkeypatch untill we get the v2 going,
 // this work with "internal" masks...
 
 
 const UNSAFEIsRawValue = (value, mask) => {
-  var _safeValue$split2;
-
   const safeValue = getValueFromEventOrString(value);
   if (!safeValue) return false;
   const rawMask = getRawMask(mask, safeValue);
   const characterToStrip = rawMask.filter(char => typeof char === 'string');
-  if (safeValue) safeValue === null || safeValue === void 0 ? void 0 : (_safeValue$split2 = safeValue.split('')) === null || _safeValue$split2 === void 0 ? void 0 : _safeValue$split2.forEach(char => {
+  if (safeValue) safeValue?.split('')?.forEach(char => {
     const indexCharToStrip = characterToStrip.findIndex(strip => strip === char);
 
     if (indexCharToStrip >= 0) {
@@ -206,9 +202,7 @@ class DSInputMaskDeprecated extends Component {
     };
 
     this.handleOnChange = e => {
-      var _e$target;
-
-      const rawValue = (e === null || e === void 0 ? void 0 : (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value) || '';
+      const rawValue = e?.target?.value || '';
       const {
         selectionEnd
       } = e.target;

package/esm/InputMask/addons/AutoCorrectedDatePipe.js

@@ -3,7 +3,6 @@ import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
 import 'core-js/modules/esnext.async-iterator.some.js';
 import 'core-js/modules/esnext.iterator.some.js';
-import 'core-js/modules/es.string.replace.js';
 
 const maxValueMonth = [31, 31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];
 const formatOrder = ['yyyy', 'yy', 'mm', 'dd', 'HH', 'MM', 'SS'];

package/esm/InputMask/mask_types/DateInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/DateTimeInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/DictionaryInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/NumberInputMask.js

@@ -1,12 +1,10 @@
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-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';
 import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useRef, useState, useCallback, useLayoutEffect } from 'react';
 import DSTextBox from '../../TextBox/DSTextBox.js';
 import setCaretPosition from '../utils/setCaretPosition.js';
@@ -21,8 +19,6 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 const addThousandsSeparator = (n, thousandsSeparatorSymbol) => n.replace(/\B(?=(\d{3})+(?!\d))/g, thousandsSeparatorSymbol);
 
 const conformValue = (prevRawValue, prevCursorPos, lastkeycode, _ref) => {
-  var _decimal;
-
   let {
     prefix,
     suffix,
@@ -67,7 +63,7 @@ const conformValue = (prevRawValue, prevCursorPos, lastkeycode, _ref) => {
   });
   if (requireDecimal) foundDecimalSymbol = true;
 
-  if (!requireDecimal && !((_decimal = decimal) !== null && _decimal !== void 0 && _decimal.length) && lastkeycode === 8) {
+  if (!requireDecimal && !decimal?.length && lastkeycode === 8) {
     foundDecimalSymbol = false;
   }
 
@@ -97,7 +93,7 @@ const conformValue = (prevRawValue, prevCursorPos, lastkeycode, _ref) => {
     maskedPos += prefix.length;
 
     if (isNegative) {
-      if (lastkeycode !== 8 || nextMaskedValue !== prefix) nextMaskedValue = "-".concat(nextMaskedValue);
+      if (lastkeycode !== 8 || nextMaskedValue !== prefix) nextMaskedValue = `-${nextMaskedValue}`;
       maskedPos += 1;
     }
 

package/esm/InputMask/mask_types/PhoneInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/PhoneInternationalInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/SsnInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/UsZipCodeInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/mask_types/ZipCodeSearchInputMask.js

@@ -3,7 +3,6 @@ import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutPr
 import 'core-js/modules/esnext.async-iterator.filter.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.filter.js';
-import 'core-js/modules/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 { useRef, useState, useCallback, useLayoutEffect } from 'react';

package/esm/InputMask/props.js

@@ -140,7 +140,8 @@ const inputProps = {
    * The placeholder character represents the fillable spot in the mask.
    * The default placeholder character is underscore, _
    */
-  placeholderChar: PropTypes.string.description("The placeholder character represents the fillable spot in the mask.\n The default placeholder character is underscore, _.").defaultValue('_')
+  placeholderChar: PropTypes.string.description(`The placeholder character represents the fillable spot in the mask.
+ The default placeholder character is underscore, _.`).defaultValue('_')
 };
 
 export { inputProps };

package/esm/InputMask/utils/setCaretPosition.js

@@ -1,14 +1,14 @@
 const setCaretPosition = (ctrl, pos) => {
   // Modern browsers
-  if (ctrl !== null && ctrl !== void 0 && ctrl.setSelectionRange) {
-    ctrl === null || ctrl === void 0 ? void 0 : ctrl.focus();
-    ctrl === null || ctrl === void 0 ? void 0 : ctrl.setSelectionRange(pos, pos); // IE8 and below
-  } else if (ctrl !== null && ctrl !== void 0 && ctrl.createTextRange) {
-    const range = ctrl === null || ctrl === void 0 ? void 0 : ctrl.createTextRange();
-    range === null || range === void 0 ? void 0 : range.collapse(true);
-    range === null || range === void 0 ? void 0 : range.moveEnd('character', pos);
-    range === null || range === void 0 ? void 0 : range.moveStart('character', pos);
-    range === null || range === void 0 ? void 0 : range.select();
+  if (ctrl?.setSelectionRange) {
+    ctrl?.focus();
+    ctrl?.setSelectionRange(pos, pos); // IE8 and below
+  } else if (ctrl?.createTextRange) {
+    const range = ctrl?.createTextRange();
+    range?.collapse(true);
+    range?.moveEnd('character', pos);
+    range?.moveStart('character', pos);
+    range?.select();
   }
 };
 

package/esm/InputProtected/DSInputProtected.js

@@ -1,12 +1,11 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-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';
 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 _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
 import { useState, useEffect, useCallback } from 'react';
 import { describe } from 'react-desc';
 import { LockUnlocked, LockLocked, VisibleView, InvisibleHide } from '@elliemae/ds-icons';
@@ -59,13 +58,13 @@ const DSInputProtected = _ref => {
   }, [inputHidden]);
   return /*#__PURE__*/_jsx("div", {}, void 0, /*#__PURE__*/_jsx(DSInputGroup, {
     leftAddon: left ? /*#__PURE__*/_jsx(DSButton, {
-      "aria-label": "".concat(inputLocked ? 'Allow' : 'Disallow', " Edition"),
+      "aria-label": `${inputLocked ? 'Allow' : 'Disallow'} Edition`,
       buttonType: "secondary",
       icon: ADDON_ICON_OPTIONS[inputLocked ? LEFT_ADDON_OPTIONS.LockLocked : LEFT_ADDON_OPTIONS.LockUnlocked],
       onClick: handleLeft
     }) : undefined,
     rightAddon: right ? /*#__PURE__*/_jsx(DSButton, {
-      "aria-label": "".concat(inputHidden ? 'Show' : 'Hide', " Characters"),
+      "aria-label": `${inputHidden ? 'Show' : 'Hide'} Characters`,
       buttonType: "secondary",
       icon: ADDON_ICON_OPTIONS[inputHidden ? RIGHT_ADDON_OPTIONS.InvisibleHide : RIGHT_ADDON_OPTIONS.VisibleView],
       onClick: handleRight,

package/esm/InputProtected/props.js

@@ -14,7 +14,8 @@ const inputProtectedProps = {
    * PlaceholderChar: The placeholder character represents the fillable spot in the mask.
    * The default placeholder character is underscore, _.
    */
-  placeholderChar: PropTypes.string.description("The placeholder character represents the fillable spot in the mask.\n  * The default placeholder character is underscore, _.")
+  placeholderChar: PropTypes.string.description(`The placeholder character represents the fillable spot in the mask.
+  * The default placeholder character is underscore, _.`)
 };
 
 export { inputProtectedProps };

package/esm/LargeInputText/DSLargeInputText.js

@@ -76,7 +76,7 @@ const DSLargeInputText = _ref2 => {
 
   return /*#__PURE__*/jsxs(Fragment, {
     children: [/*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, containerProps), {}, {
-      className: "".concat(cssClassName, " ").concat(className),
+      className: `${cssClassName} ${className}`,
       children: /*#__PURE__*/_jsx("div", {
         className: classNameBlock('wrapper')
       }, void 0, /*#__PURE__*/jsx("textarea", {
@@ -115,7 +115,7 @@ const DSLargeInputText = _ref2 => {
         limitError
       },
       "data-testid": "counter-area"
-    }, void 0, "".concat(limitError ? "".concat(errorLimit, " ").concat(characterLimitCounter, " characters.   ") : '').concat(String(value).length, " / ").concat(characterLimitCounter))]
+    }, void 0, `${limitError ? `${errorLimit} ${characterLimitCounter} characters.   ` : ''}${String(value).length} / ${characterLimitCounter}`)]
   });
 };
 

package/esm/MenuItem/components/SubmenuItem/index.js

@@ -5,7 +5,6 @@ import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useEffect, useRef, useCallback } from 'react';
 import { describe } from 'react-desc';
 import Grid from '@elliemae/ds-grid';
@@ -105,7 +104,7 @@ const SubmenuItem = props => {
     ref: innerRef,
     onMouseEnter: onMouseEnterHandler,
     onMouseLeave: onMouseLeaveHandler,
-    "aria-describedby": "dropdownmenu-submenu-".concat(dsId),
+    "aria-describedby": `dropdownmenu-submenu-${dsId}`,
     children: [render ? render(props) : /*#__PURE__*/_jsx(Grid, {
       cols: ['auto', 'min-content']
     }, void 0, /*#__PURE__*/_jsx(StyledItemLabel, {}, void 0, label), /*#__PURE__*/_jsx(DSButtonV2, {
@@ -115,7 +114,7 @@ const SubmenuItem = props => {
         onClick(e);
       }
     }, void 0, rightAddon === 'ellipsis' ? _Ellipsis || (_Ellipsis = /*#__PURE__*/_jsx(Ellipsis, {})) : _ChevronRight || (_ChevronRight = /*#__PURE__*/_jsx(ChevronRight, {})))), /*#__PURE__*/_jsx("span", {
-      id: "dropdownmenu-submenu-".concat(dsId),
+      id: `dropdownmenu-submenu-${dsId}`,
       style: {
         display: 'none'
       }

package/esm/RadioGroup/DSRadioGroup.js

@@ -22,7 +22,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 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(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 emClassPrefix = 'em-ds';
-const baseClass = "".concat(emClassPrefix, "-radio-group");
+const baseClass = `${emClassPrefix}-radio-group`;
 
 const RadioItem = props => /*#__PURE__*/_jsx(GroupItem, {
   render: context => /*#__PURE__*/jsx(DSRadio, _objectSpread(_objectSpread({}, props), {}, {
@@ -63,7 +63,7 @@ const DSRadioGroup = _ref => {
   }, void 0, /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({
     "data-testid": "ds-radiogroup"
   }, labelProps && labelProps.labelText ? {} : containerProps), {}, {
-    className: "".concat(baseClass, " ").concat(baseClass, "--").concat(orientation),
+    className: `${baseClass} ${baseClass}--${orientation}`,
     role: "group",
     children: React.Children.map(children, (child, index) => /*#__PURE__*/jsx(RadioItem, _objectSpread(_objectSpread({}, child.props), {}, {
       innerRef: t => {
@@ -75,7 +75,7 @@ const DSRadioGroup = _ref => {
 
   if (labelProps && labelProps.labelText) {
     return /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({
-      className: "".concat(baseClass, "-form-item-layout-wrapper")
+      className: `${baseClass}-form-item-layout-wrapper`
     }, containerProps), {}, {
       role: "group",
       children: /*#__PURE__*/jsx(DSFormItemLayout, _objectSpread(_objectSpread({}, labelProps), {}, {

package/esm/RequiredMark/RequiredMark.js

@@ -15,12 +15,12 @@ const RequiredMark = _ref => {
 
   if (required) {
     return /*#__PURE__*/_jsx("span", {
-      className: "".concat(cssClassName)
+      className: `${cssClassName}`
     }, void 0, "\u25CF");
   }
 
   return /*#__PURE__*/_jsx("span", {
-    className: "".concat(cssClassName, " optional-mark")
+    className: `${cssClassName} optional-mark`
   }, void 0, "\u26AC");
 };
 

package/esm/SearchBox/DSSearchBox.js

@@ -49,7 +49,7 @@ const DSSearchBox = _ref => {
     value,
     onClearButtonClick
   });
-  const shouldShowClearIcon = clearable && (searchValue === null || searchValue === void 0 ? void 0 : searchValue.length) > 0;
+  const shouldShowClearIcon = clearable && searchValue?.length > 0;
   const shouldShowSearchIcon = !shouldShowClearIcon && showIcon;
   const shouldShowAnyIcon = shouldShowClearIcon || shouldShowSearchIcon;
   const PureSearchboxIcon = React.useMemo(() => {

package/esm/SearchBox/NavSearchBox.js

@@ -87,7 +87,7 @@ const ResultTracker = props => {
   } = props;
   if (currentResultIndex === -1 && !totalResults) return null;
   if (currentResultIndex === -1 && totalResults) return /*#__PURE__*/_jsx(StyledResultTracker, {}, void 0, totalResults);
-  return /*#__PURE__*/_jsx(StyledResultTracker, {}, void 0, "".concat(currentResultIndex + 1, " / ").concat(totalResults));
+  return /*#__PURE__*/_jsx(StyledResultTracker, {}, void 0, `${currentResultIndex + 1} / ${totalResults}`);
 };
 
 const VerticalSeparator = () => _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx(StyledVerticalSeparator, {}));

package/esm/SearchBox/SearchBoxToggle.js

@@ -1,12 +1,11 @@
-import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
-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';
 import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
+import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
+import _jsx from '@babel/runtime/helpers/esm/jsx';
+import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
 import { useState } from 'react';
 import styled from 'styled-components';
 import { Search } from '@elliemae/ds-icons';
@@ -24,7 +23,15 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 const SEARCH_BUTTON_WIDTH = 26;
 const SearchWrap = /*#__PURE__*/styled.div.withConfig({
   componentId: "sc-xt33wm-0"
-})(["transition:width 200ms ease;width:", "px;height:0;", " ", ""], SEARCH_BUTTON_WIDTH, props => !props.show ? "\n        opacity:0;\n\n        & * {\n          width: ".concat(SEARCH_BUTTON_WIDTH, "px;\n          height: 0;\n          border: 0;\n        }\n      ") : '', props => props.isOpen ? "width: ".concat(props.width, ";opacity: 1;height: auto;") : ''); // eslint-disable-next-line react/prop-types
+})(["transition:width 200ms ease;width:", "px;height:0;", " ", ""], SEARCH_BUTTON_WIDTH, props => !props.show ? `
+        opacity:0;
+
+        & * {
+          width: ${SEARCH_BUTTON_WIDTH}px;
+          height: 0;
+          border: 0;
+        }
+      ` : '', props => props.isOpen ? `width: ${props.width};opacity: 1;height: auto;` : ''); // eslint-disable-next-line react/prop-types
 
 const SearchBoxToggle = _ref => {
   let {
@@ -35,7 +42,7 @@ const SearchBoxToggle = _ref => {
 
   const [isOpen, setOpen] = useState(false);
   const [show, setShow] = useState(true);
-  const computedWidth = typeof width === 'number' ? "".concat(width, "px") : width;
+  const computedWidth = typeof width === 'number' ? `${width}px` : width;
 
   const button = /*#__PURE__*/_jsx(DSButton, {
     onClick: () => {

package/esm/SearchBox/useSearch.js

@@ -1,4 +1,3 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
 import { useState, useCallback, useEffect } from 'react';
 import { debounce } from '@elliemae/ds-utilities';
 

package/esm/TextBox/DSTextBox.js

@@ -44,7 +44,7 @@ const DSTextBox = _ref => {
 
   return /*#__PURE__*/jsx(DSInput, _objectSpread(_objectSpread({}, otherProps), {}, {
     "aria-label": !id ? otherProps['aria-label'] || 'Text Box' : undefined,
-    "aria-describedby": otherProps['aria-describedby'] || "".concat(id, "_feedback_message"),
+    "aria-describedby": otherProps['aria-describedby'] || `${id}_feedback_message`,
     autoFocus: autoFocus,
     clearable: clearable,
     containerProps: containerProps,

package/esm/TimeInput/TimeInputs.js

@@ -4,7 +4,6 @@ import 'core-js/modules/esnext.async-iterator.for-each.js';
 import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'core-js/modules/web.dom-collections.iterator.js';
 import 'core-js/modules/esnext.async-iterator.some.js';
 import 'core-js/modules/esnext.iterator.constructor.js';
 import 'core-js/modules/esnext.iterator.some.js';

package/esm/Toggle/DSToggleImpl.js

@@ -261,7 +261,7 @@ class DSToggleImpl extends Component {
       hide
     } = this.state;
     const dragStyle = drag !== null || checked || this.props.checked ? {
-      left: "".concat(drag, "px")
+      left: `${drag}px`
     } : null;
     return /*#__PURE__*/jsx(DSToggleRender, _objectSpread(_objectSpread({}, this.props), {}, {
       defaultState: this.props.checked,

package/esm/Toggle/DSToggleRender.js

@@ -81,7 +81,7 @@ const DSToggleRender = _ref => {
     defaultValue: value
   }, onClickHandlerForNonInteractiveElements(allowChange ? null : onChange)), {}, {
     ref: containerRef,
-    className: "".concat(cssClassName, " ").concat(defaultState ? 'default-state-checked' : '').concat(hide ? ' ds-form-element-toggle-hide' : ''),
+    className: `${cssClassName} ${defaultState ? 'default-state-checked' : ''}${hide ? ' ds-form-element-toggle-hide' : ''}`,
     onBlur: onBlur,
     onFocus: onFocus // eslint-disable-next-line jsx-a11y/role-has-required-aria-props
     ,
@@ -94,7 +94,7 @@ const DSToggleRender = _ref => {
       ref: handRef,
       "aria-checked": checked,
       "aria-disabled": disabled,
-      className: "".concat(classNameElement('input'), " ").concat(defaultState ? 'default-state-checked' : ''),
+      className: `${classNameElement('input')} ${defaultState ? 'default-state-checked' : ''}`,
       onMouseDown: allowChange ? null : onMouseDown,
       onMouseEnter: allowChange ? null : onMouseEnter,
       onMouseLeave: allowChange ? null : onMouseLeave,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-form",
-  "version": "2.4.2-rc.11",
+  "version": "2.4.2-rc.14",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Form",
   "module": "./esm/index.js",
@@ -748,25 +748,25 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-button": "2.4.2-rc.11",
-    "@elliemae/ds-circular-progress-indicator": "2.4.2-rc.11",
-    "@elliemae/ds-classnames": "2.4.2-rc.11",
-    "@elliemae/ds-controlled-form": "2.4.2-rc.11",
-    "@elliemae/ds-dropdownmenu": "2.4.2-rc.11",
-    "@elliemae/ds-grid": "2.4.2-rc.11",
-    "@elliemae/ds-icon": "2.4.2-rc.11",
-    "@elliemae/ds-icons": "2.4.2-rc.11",
-    "@elliemae/ds-menu": "2.4.2-rc.11",
-    "@elliemae/ds-overlay": "2.4.2-rc.11",
-    "@elliemae/ds-popper": "2.4.2-rc.11",
-    "@elliemae/ds-props-helpers": "2.4.2-rc.11",
-    "@elliemae/ds-separator": "2.4.2-rc.11",
-    "@elliemae/ds-shared": "2.4.2-rc.11",
-    "@elliemae/ds-system": "2.4.2-rc.11",
-    "@elliemae/ds-text-wrapper": "2.4.2-rc.11",
-    "@elliemae/ds-tooltip": "2.4.2-rc.11",
-    "@elliemae/ds-truncated-tooltip-text": "2.4.2-rc.11",
-    "@elliemae/ds-utilities": "2.4.2-rc.11",
+    "@elliemae/ds-button": "2.4.2-rc.14",
+    "@elliemae/ds-circular-progress-indicator": "2.4.2-rc.14",
+    "@elliemae/ds-classnames": "2.4.2-rc.14",
+    "@elliemae/ds-controlled-form": "2.4.2-rc.14",
+    "@elliemae/ds-dropdownmenu": "2.4.2-rc.14",
+    "@elliemae/ds-grid": "2.4.2-rc.14",
+    "@elliemae/ds-icon": "2.4.2-rc.14",
+    "@elliemae/ds-icons": "2.4.2-rc.14",
+    "@elliemae/ds-menu": "2.4.2-rc.14",
+    "@elliemae/ds-overlay": "2.4.2-rc.14",
+    "@elliemae/ds-popper": "2.4.2-rc.14",
+    "@elliemae/ds-props-helpers": "2.4.2-rc.14",
+    "@elliemae/ds-separator": "2.4.2-rc.14",
+    "@elliemae/ds-shared": "2.4.2-rc.14",
+    "@elliemae/ds-system": "2.4.2-rc.14",
+    "@elliemae/ds-text-wrapper": "2.4.2-rc.14",
+    "@elliemae/ds-tooltip": "2.4.2-rc.14",
+    "@elliemae/ds-truncated-tooltip-text": "2.4.2-rc.14",
+    "@elliemae/ds-utilities": "2.4.2-rc.14",
     "@elliemae/react-popper": "1.0.2",
     "@xstyled/styled-components": "~3.1.1",
     "csstype": "~3.0.9",