@elliemae/ds-form 2.0.0-alpha.1 → 2.0.0-alpha.13

package/cjs/SearchBox/NavSearchBox.js

@@ -6,12 +6,9 @@ var _jsx = require('@babel/runtime/helpers/jsx');
 require('react');
 var styled = require('styled-components');
 var reactDesc = require('react-desc');
-var ChevronDown = require('@elliemae/ds-icons/ChevronDown');
-var SearchIcon = require('@elliemae/ds-icons/Search');
-var ChevronUp = require('@elliemae/ds-icons/ChevronUp');
+var dsIcons = require('@elliemae/ds-icons');
 var DSButton = require('@elliemae/ds-button');
 var DSTextBox = require('../TextBox/DSTextBox.js');
-var CloseXsmall = require('@elliemae/ds-icons/CloseXsmall');
 var props = require('./props.js');
 var defaultProps = require('./defaultProps.js');
 var jsxRuntime = require('react/jsx-runtime');
@@ -20,27 +17,26 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var ChevronDown__default = /*#__PURE__*/_interopDefaultLegacy(ChevronDown);
-var SearchIcon__default = /*#__PURE__*/_interopDefaultLegacy(SearchIcon);
-var ChevronUp__default = /*#__PURE__*/_interopDefaultLegacy(ChevronUp);
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
-var CloseXsmall__default = /*#__PURE__*/_interopDefaultLegacy(CloseXsmall);
 
 var _StyledVerticalSepara, _VerticalSeparator;
-const StyledResultTracker = /*#__PURE__*/styled__default['default'].div.withConfig({
+const StyledResultTracker = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-sbwvud-0"
 })(["padding:0 8px;color:#a2a9b6;white-space:nowrap;word-spacing:2px;"]);
-const StyledVerticalSeparator = /*#__PURE__*/styled__default['default'].div.withConfig({
+const StyledVerticalSeparator = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-sbwvud-1"
 })(["height:60%;border-right:1px solid #a2a9b6;"]);
-const StyledToolbarRightAddonsWrapper = /*#__PURE__*/styled__default['default'].div.withConfig({
+const StyledToolbarRightAddonsWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-sbwvud-2"
 })(["display:flex;align-items:center;justify-content:flex-end;"]);
-const NavBtn = /*#__PURE__*/styled__default['default'](DSButton__default['default']).withConfig({
+const NavBtn = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
   componentId: "sc-sbwvud-3"
-})(["height:calc(100% - 2px);border:none;border-radius:", ";"], ({
-  last
-}) => last ? '2px  2px 0px 0px' : '0px');
+})(["height:calc(100% - 2px);border:none;border-radius:", ";"], _ref => {
+  let {
+    last
+  } = _ref;
+  return last ? '2px  2px 0px 0px' : '0px';
+});
 
 const RightButtonsGroup = props => {
   const {
@@ -52,41 +48,41 @@ const RightButtonsGroup = props => {
   } = props;
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [!hideNavs && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
-      children: [/*#__PURE__*/_jsx__default['default'](NavBtn, {
+      children: [/*#__PURE__*/_jsx__default["default"](NavBtn, {
         buttonType: "text",
         containerProps: {
           'data-testid': 'ds-navsearchbox-next'
         },
-        icon: /*#__PURE__*/_jsx__default['default'](ChevronDown__default['default'], {
+        icon: /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronDown, {
           color: ['brand-primary', '800']
         }),
         onClick: onNext
-      }), /*#__PURE__*/_jsx__default['default'](NavBtn, {
+      }), /*#__PURE__*/_jsx__default["default"](NavBtn, {
         buttonType: "text",
         containerProps: {
           'data-testid': 'ds-navsearchbox-prev'
         },
-        icon: /*#__PURE__*/_jsx__default['default'](ChevronUp__default['default'], {
+        icon: /*#__PURE__*/_jsx__default["default"](dsIcons.ChevronUp, {
           color: ['brand-primary', '800']
         }),
         onClick: onPrevious
       })]
-    }), showClear ? /*#__PURE__*/_jsx__default['default'](NavBtn, {
+    }), showClear ? /*#__PURE__*/_jsx__default["default"](NavBtn, {
       containerProps: {
         'data-testid': 'ds-navsearchbox-clear'
       },
       buttonType: "text",
-      icon: /*#__PURE__*/_jsx__default['default'](CloseXsmall__default['default'], {
+      icon: /*#__PURE__*/_jsx__default["default"](dsIcons.CloseXsmall, {
         color: ['brand-primary', '800']
       }),
       onClick: onClear,
       last: true
-    }) : /*#__PURE__*/_jsx__default['default'](NavBtn, {
+    }) : /*#__PURE__*/_jsx__default["default"](NavBtn, {
       containerProps: {
         'data-testid': 'ds-navsearchbox-clear'
       },
       buttonType: "text",
-      icon: /*#__PURE__*/_jsx__default['default'](SearchIcon__default['default'], {
+      icon: /*#__PURE__*/_jsx__default["default"](dsIcons.Search, {
         color: ['brand-primary', '800']
       }),
       last: true
@@ -100,11 +96,11 @@ const ResultTracker = props => {
     totalResults
   } = props;
   if (currentResultIndex === -1 && !totalResults) return null;
-  if (currentResultIndex === -1 && totalResults) return /*#__PURE__*/_jsx__default['default'](StyledResultTracker, {}, void 0, totalResults);
-  return /*#__PURE__*/_jsx__default['default'](StyledResultTracker, {}, void 0, `${currentResultIndex + 1} / ${totalResults}`);
+  if (currentResultIndex === -1 && totalResults) return /*#__PURE__*/_jsx__default["default"](StyledResultTracker, {}, void 0, totalResults);
+  return /*#__PURE__*/_jsx__default["default"](StyledResultTracker, {}, void 0, "".concat(currentResultIndex + 1, " / ").concat(totalResults));
 };
 
-const VerticalSeparator = () => _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx__default['default'](StyledVerticalSeparator, {}));
+const VerticalSeparator = () => _StyledVerticalSepara || (_StyledVerticalSepara = /*#__PURE__*/_jsx__default["default"](StyledVerticalSeparator, {}));
 
 const ToolbarRightAddons = props => {
   const {
@@ -115,10 +111,10 @@ const ToolbarRightAddons = props => {
     totalResults,
     showClear
   } = props;
-  return /*#__PURE__*/_jsx__default['default'](StyledToolbarRightAddonsWrapper, {}, void 0, /*#__PURE__*/_jsx__default['default'](ResultTracker, {
+  return /*#__PURE__*/_jsx__default["default"](StyledToolbarRightAddonsWrapper, {}, void 0, /*#__PURE__*/_jsx__default["default"](ResultTracker, {
     currentResultIndex: currentResultIndex,
     totalResults: totalResults
-  }), currentResultIndex !== -1 || totalResults ? _VerticalSeparator || (_VerticalSeparator = /*#__PURE__*/_jsx__default['default'](VerticalSeparator, {})) : null, /*#__PURE__*/_jsx__default['default'](RightButtonsGroup, {
+  }), currentResultIndex !== -1 || totalResults ? _VerticalSeparator || (_VerticalSeparator = /*#__PURE__*/_jsx__default["default"](VerticalSeparator, {})) : null, /*#__PURE__*/_jsx__default["default"](RightButtonsGroup, {
     onNext: onNext,
     hideNavs: currentResultIndex === -1 && !totalResults,
     onPrevious: onPrevious,
@@ -159,7 +155,7 @@ const NavSearchBox = props => {
     }
   };
 
-  return /*#__PURE__*/_jsx__default['default'](DSTextBox['default'], {
+  return /*#__PURE__*/_jsx__default["default"](DSTextBox["default"], {
     onChange: handleChange,
     containerProps: {
       'data-testid': 'ds-nav-searchbox-input'
@@ -168,7 +164,7 @@ const NavSearchBox = props => {
     onKeyDown: handleKeyDown,
     placeholder: placeholder,
     value: value,
-    rightComponent: /*#__PURE__*/_jsx__default['default'](ToolbarRightAddons, {
+    rightComponent: /*#__PURE__*/_jsx__default["default"](ToolbarRightAddons, {
       showClear: !!value,
       onNext: onNext,
       onPrevious: onPrevious,

package/cjs/SearchBox/SButton.js

@@ -12,20 +12,23 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const Button = /*#__PURE__*/styled__default['default'].button.withConfig({
+const Button = /*#__PURE__*/styled__default["default"].button.withConfig({
   componentId: "sc-15udc15-0"
 })(["all:unset;position:absolute;height:calc(100% - 2px);width:28px;top:1px;right:1px;display:flex;justify-content:center;align-items:center;box-sizing:border-box;cursor:pointer;z-index:1;svg{fill:", ";}&:disabled{color:#5d6775;cursor:not-allowed;svg{fill:#5d6775;}}&:focus{", "}"], props => props.theme.colors.brand['600'], dsSystem.focus());
 
-const SButton = ({
-  icon,
-  disabled,
-  onClick,
-  dataTestid = "ds-searchbox-button"
-}) => /*#__PURE__*/_jsx__default['default'](Button, {
-  "data-testid": dataTestid,
-  onClick: onClick,
-  disabled: disabled,
-  type: "button"
-}, void 0, icon);
+const SButton = _ref => {
+  let {
+    icon,
+    disabled,
+    onClick,
+    dataTestid = "ds-searchbox-button"
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](Button, {
+    "data-testid": dataTestid,
+    onClick: onClick,
+    disabled: disabled,
+    type: "button"
+  }, void 0, icon);
+};
 
 exports.SButton = SButton;

package/cjs/SearchBox/SearchBoxToggle.js

@@ -3,9 +3,15 @@
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+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 React = require('react');
 var styled = require('styled-components');
-var SearchIcon = require('@elliemae/ds-icons/Search');
+var dsIcons = require('@elliemae/ds-icons');
 var DSButton = require('@elliemae/ds-button');
 var DSSearchBox = require('./DSSearchBox.js');
 var jsxRuntime = require('react/jsx-runtime');
@@ -16,56 +22,47 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-var SearchIcon__default = /*#__PURE__*/_interopDefaultLegacy(SearchIcon);
 var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
 
-var _SearchIcon;
+var _Search;
 
 const _excluded = ["onSearchButtonClick", "width"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const SEARCH_BUTTON_WIDTH = 26;
-const SearchWrap = /*#__PURE__*/styled__default['default'].div.withConfig({
+const SearchWrap = /*#__PURE__*/styled__default["default"].div.withConfig({
   componentId: "sc-xt33wm-0"
-})(["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
+})(["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
 
 const SearchBoxToggle = _ref => {
   let {
     onSearchButtonClick,
     width
   } = _ref,
-      rest = _objectWithoutProperties__default['default'](_ref, _excluded);
+      rest = _objectWithoutProperties__default["default"](_ref, _excluded);
 
   const [isOpen, setOpen] = React.useState(false);
   const [show, setShow] = React.useState(true);
-  const computedWidth = typeof width === 'number' ? `${width}px` : width;
+  const computedWidth = typeof width === 'number' ? "".concat(width, "px") : width;
 
-  const button = /*#__PURE__*/_jsx__default['default'](DSButton__default['default'], {
+  const button = /*#__PURE__*/_jsx__default["default"](DSButton__default["default"], {
     onClick: () => {
       setOpen(true);
     },
     buttonType: "text",
-    icon: _SearchIcon || (_SearchIcon = /*#__PURE__*/_jsx__default['default'](SearchIcon__default['default'], {}))
+    icon: _Search || (_Search = /*#__PURE__*/_jsx__default["default"](dsIcons.Search, {}))
   });
 
-  return /*#__PURE__*/_jsx__default['default']("div", {}, void 0, show && !isOpen && button, /*#__PURE__*/_jsx__default['default'](SearchWrap, {
+  return /*#__PURE__*/_jsx__default["default"]("div", {}, void 0, show && !isOpen && button, /*#__PURE__*/_jsx__default["default"](SearchWrap, {
     show: !show || isOpen,
     isOpen: isOpen,
     width: computedWidth,
     onTransitionEnd: () => {
       setShow(!isOpen);
     }
-  }, void 0, /*#__PURE__*/jsxRuntime.jsx(DSSearchBox['default'], _objectSpread(_objectSpread({}, rest), {}, {
+  }, void 0, /*#__PURE__*/jsxRuntime.jsx(DSSearchBox["default"], _objectSpread(_objectSpread({}, rest), {}, {
     onSearchButtonClick: () => {
       onSearchButtonClick();
       setOpen(false);

package/cjs/SearchBox/index.js

@@ -10,6 +10,6 @@ var NavSearchBox = require('./NavSearchBox.js');
 
 exports.SearchBoxToggle = SearchBoxToggle;
 exports.SearchBoxWithSchema = DSSearchBox.SearchBoxWithSchema;
-exports.default = DSSearchBox['default'];
+exports["default"] = DSSearchBox["default"];
 exports.DSNavSearchBox = NavSearchBox.NavSearchBox;
 exports.DSNavSearchBoxWithSchema = NavSearchBox.DSNavSearchBoxWithSchema;

package/cjs/SearchBox/styled.js

@@ -9,7 +9,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
 
-const SearchBoxTextBox = /*#__PURE__*/styled__default['default'](DSTextBox['default']).withConfig({
+const SearchBoxTextBox = /*#__PURE__*/styled__default["default"](DSTextBox["default"]).withConfig({
   componentId: "sc-44ofm-0"
 })(["padding-right:33px;"]);
 

package/cjs/SearchBox/useSearch.js

@@ -2,8 +2,9 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/web.dom-collections.iterator.js');
 var React = require('react');
-var utils = require('@elliemae/ds-utilities/utils');
+var dsUtilities = require('@elliemae/ds-utilities');
 
 function handleSearch(clearOnSearch, setValue, searchOnEnter, value, onSearch, property, clickTrigger, onSearchButtonClick) {
   if (clickTrigger) {
@@ -21,7 +22,8 @@ function handleSearch(clearOnSearch, setValue, searchOnEnter, value, onSearch, p
   });
 }
 
-function useSearch(params = {}) {
+function useSearch() {
+  let params = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   const {
     onKeyUp,
     onSearch,
@@ -33,7 +35,7 @@ function useSearch(params = {}) {
     onClearButtonClick
   } = params;
   const [value, setValue] = React.useState(params.value);
-  const debouncedSearch = React.useCallback(utils.debounce(handleSearch, 200), []); // update state if prop changes
+  const debouncedSearch = React.useCallback(dsUtilities.debounce(handleSearch, 200), []); // update state if prop changes
 
   React.useEffect(() => {
     if (value !== params.value) {
@@ -41,11 +43,15 @@ function useSearch(params = {}) {
     }
   }, [params.value]);
 
-  const searchWithParams = (clickedSearchButton = false) => handleSearch(clearOnSearch, setValue, searchOnEnter, value, onSearch, property, clickedSearchButton, onSearchButtonClick);
+  const searchWithParams = function () {
+    let clickedSearchButton = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
+    return handleSearch(clearOnSearch, setValue, searchOnEnter, value, onSearch, property, clickedSearchButton, onSearchButtonClick);
+  };
 
-  const handleChange = ({
-    target
-  }) => {
+  const handleChange = _ref => {
+    let {
+      target
+    } = _ref;
     onChange(target.value);
     setValue(target.value);
 

package/cjs/SearchBox/withSearchable.js

@@ -1,45 +1,50 @@
 'use strict';
 
-var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
+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 _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 var React = require('react');
-var utils = require('@elliemae/ds-utilities/utils');
+var dsUtilities = require('@elliemae/ds-utilities');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
-var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
+var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 
 const _excluded = ["containerProps"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 const withSearchable = WrappedComponent => {
   class Searchable extends React.Component {
     constructor(props) {
       super(props);
-
-      _defineProperty__default['default'](this, "debouncedSearch", utils.debounce(this.handleSearch, 200));
-
+      this.debouncedSearch = dsUtilities.debounce(this.handleSearch, 200);
       this.state = {
         value: props.value
       };
       this.handleSearch = this.handleSearch.bind(this);
       this.handleKeyUp = this.handleKeyUp.bind(this);
       this.handleChange = this.handleChange.bind(this);
-      this.buttonRef = /*#__PURE__*/React__default['default'].createRef();
+      this.buttonRef = /*#__PURE__*/React__default["default"].createRef();
       this.handleChange = this.handleChange.bind(this);
       this.handleKeyUp = this.handleKeyUp.bind(this);
       this.handleSearch = this.handleSearch.bind(this);
     }
 
-    static getDerivedStateFromProps(nextProps, {
-      prevPropValue
-    }) {
+    static getDerivedStateFromProps(nextProps, _ref) {
+      let {
+        prevPropValue
+      } = _ref;
+
       if (nextProps.value !== prevPropValue) {
         return {
           value: nextProps.value,
@@ -89,9 +94,10 @@ const withSearchable = WrappedComponent => {
       });
     }
 
-    handleChange({
-      target
-    }) {
+    handleChange(_ref2) {
+      let {
+        target
+      } = _ref2;
       const {
         value
       } = target;
@@ -116,7 +122,7 @@ const withSearchable = WrappedComponent => {
             {
         containerProps
       } = _this$props,
-            rest = _objectWithoutProperties__default['default'](_this$props, _excluded);
+            rest = _objectWithoutProperties__default["default"](_this$props, _excluded);
 
       return /*#__PURE__*/jsxRuntime.jsx(WrappedComponent, _objectSpread(_objectSpread({}, rest), {}, {
         buttonRef: this.buttonRef,

package/cjs/TextBox/DSTextBox.js

@@ -2,6 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
 require('react');
@@ -14,11 +19,11 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
 var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
 
-const _excluded = ["containerProps", "autoFocus", "disabled", "maxLength", "minLength", "fluidWidth", "placeholder", "value", "hasError", "readOnly", "innerRef", "type", "min", "max", "clearable", "leftComponent", "rightComponent", "required", "variant", "disableTooltip"];
+const _excluded = ["containerProps", "autoFocus", "disabled", "maxLength", "minLength", "fluidWidth", "placeholder", "value", "hasError", "readOnly", "innerRef", "type", "min", "max", "clearable", "leftComponent", "rightComponent", "required", "variant", "disableTooltip", "id"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
 const DSTextBox = _ref => {
   let {
@@ -41,12 +46,14 @@ const DSTextBox = _ref => {
     rightComponent = null,
     required = false,
     variant,
-    disableTooltip
+    disableTooltip,
+    id
   } = _ref,
-      otherProps = _objectWithoutProperties__default['default'](_ref, _excluded);
+      otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
 
-  return /*#__PURE__*/jsxRuntime.jsx(DSInput['default'], _objectSpread(_objectSpread({}, otherProps), {}, {
-    "aria-label": otherProps['aria-label'] || 'Text Box',
+  return /*#__PURE__*/jsxRuntime.jsx(DSInput["default"], _objectSpread(_objectSpread({}, otherProps), {}, {
+    "aria-label": !id ? otherProps['aria-label'] || 'Text Box' : undefined,
+    "aria-describedby": otherProps['aria-describedby'] || "".concat(id, "_feedback_message"),
     autoFocus: autoFocus,
     clearable: clearable,
     containerProps: containerProps,
@@ -67,7 +74,8 @@ const DSTextBox = _ref => {
     type: type,
     value: value,
     variant: variant,
-    disableTooltip: disableTooltip
+    disableTooltip: disableTooltip,
+    id: id
   }));
 };
 
@@ -169,4 +177,4 @@ const DSTextBoxWithSchema = reactDesc.describe(DSTextBox);
 DSTextBoxWithSchema.propTypes = props;
 
 exports.DSTextBoxWithSchema = DSTextBoxWithSchema;
-exports['default'] = DSTextBox;
+exports["default"] = DSTextBox;

package/cjs/TextBox/index.js

@@ -7,4 +7,4 @@ var DSTextBox = require('./DSTextBox.js');
 
 
 exports.DSTextBoxWithSchema = DSTextBox.DSTextBoxWithSchema;
-exports.default = DSTextBox['default'];
+exports["default"] = DSTextBox["default"];

package/cjs/TimeInput/DSTimeInput.js

@@ -2,6 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
@@ -21,45 +26,48 @@ const _excluded = ["onChange"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-const DSTimeInput = ({
-  containerProps = {},
-  innerRef,
-  className = '',
-  style = {},
-  onChange = () => null,
-  format,
-  value = '',
-  clearable = false,
-  disabled = false,
-  ariaLabel = 'Time input'
-}) => /*#__PURE__*/_jsx__default['default'](DSInput['default'], {
-  className: className,
-  clearable: clearable,
-  containerProps: containerProps,
-  customInputType: _ref => {
-    let {
-      onChange: inputOnChange
-    } = _ref,
-        restInputProps = _objectWithoutProperties__default['default'](_ref, _excluded);
-
-    return /*#__PURE__*/jsxRuntime.jsx(TimeInputImpl, _objectSpread(_objectSpread({
-      "aria-label": ariaLabel,
-      disabled: disabled,
-      format: format,
-      onChange: time => inputOnChange(time)
-    }, restInputProps), {}, {
-      style: style
-    }));
-  },
-  disabled: disabled,
-  innerRef: innerRef,
-  isShowElipsisActive: false,
-  onChange: onChange,
-  onClear: () => onChange(null),
-  value: value
-});
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
+const DSTimeInput = _ref => {
+  let {
+    containerProps = {},
+    innerRef,
+    className = '',
+    style = {},
+    onChange = () => null,
+    format,
+    value = '',
+    clearable = false,
+    disabled = false,
+    ariaLabel = 'Time input'
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](DSInput["default"], {
+    className: className,
+    clearable: clearable,
+    containerProps: containerProps,
+    customInputType: _ref2 => {
+      let {
+        onChange: inputOnChange
+      } = _ref2,
+          restInputProps = _objectWithoutProperties__default["default"](_ref2, _excluded);
+
+      return /*#__PURE__*/jsxRuntime.jsx(TimeInputImpl, _objectSpread(_objectSpread({
+        "aria-label": ariaLabel,
+        disabled: disabled,
+        format: format,
+        onChange: time => inputOnChange(time)
+      }, restInputProps), {}, {
+        style: style
+      }));
+    },
+    disabled: disabled,
+    innerRef: innerRef,
+    isShowElipsisActive: false,
+    onChange: onChange,
+    onClear: () => onChange(null),
+    value: value
+  });
+};
 
 DSTimeInput.defaultProps = {
   format: 'hh:mm:ss',
@@ -119,4 +127,4 @@ DSTimeInputWithSchema.propTypes = props;
 
 exports.TimeInputImpl = TimeInputImpl;
 exports.DSTimeInputWithSchema = DSTimeInputWithSchema;
-exports['default'] = DSTimeInput;
+exports["default"] = DSTimeInput;