@dhis2-ui/select 8.2.0 → 8.2.1

package/build/cjs/multi-select-option/multi-select-option.js

@@ -26,37 +26,40 @@ const {
 } = {
   styles: /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "2013783366"
-  }, [`.jsx-2013783366{padding:${_uiConstants.spacers.dp8} ${_uiConstants.spacers.dp12};}`]),
+  }, [".jsx-2013783366{padding:".concat(_uiConstants.spacers.dp8, " ").concat(_uiConstants.spacers.dp12, ";}")]),
   className: "jsx-2013783366"
 };
 
-const MultiSelectOption = ({
-  label,
-  active,
-  disabled,
-  onClick,
-  className,
-  dataTest,
-  value
-}) => /*#__PURE__*/_react.default.createElement("div", {
-  "data-test": dataTest,
-  "data-value": value,
-  "data-label": label,
-  className: _style.default.dynamic([["3813980210", [_uiConstants.colors.grey200]]]) + " " + ((0, _classnames.default)(className, {
-    disabled
-  }) || "")
-}, /*#__PURE__*/_react.default.createElement(_checkbox.Checkbox, {
-  name: label,
-  className: checkboxClassname,
-  checked: active,
-  label: label,
-  onChange: onClick,
-  disabled: disabled,
-  dense: true
-}), styles, /*#__PURE__*/_react.default.createElement(_style.default, {
-  id: "3813980210",
-  dynamic: [_uiConstants.colors.grey200]
-}, [`div.__jsx-style-dynamic-selector:hover{background-color:${_uiConstants.colors.grey200};}`, "div.disabled.__jsx-style-dynamic-selector:hover{background-color:initial;}"]));
+const MultiSelectOption = _ref => {
+  let {
+    label,
+    active,
+    disabled,
+    onClick,
+    className,
+    dataTest,
+    value
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    "data-test": dataTest,
+    "data-value": value,
+    "data-label": label,
+    className: _style.default.dynamic([["3813980210", [_uiConstants.colors.grey200]]]) + " " + ((0, _classnames.default)(className, {
+      disabled
+    }) || "")
+  }, /*#__PURE__*/_react.default.createElement(_checkbox.Checkbox, {
+    name: label,
+    className: checkboxClassname,
+    checked: active,
+    label: label,
+    onChange: onClick,
+    disabled: disabled,
+    dense: true
+  }), styles, /*#__PURE__*/_react.default.createElement(_style.default, {
+    id: "3813980210",
+    dynamic: [_uiConstants.colors.grey200]
+  }, ["div.__jsx-style-dynamic-selector:hover{background-color:".concat(_uiConstants.colors.grey200, ";}"), "div.disabled.__jsx-style-dynamic-selector:hover{background-color:initial;}"]));
+};
 
 exports.MultiSelectOption = MultiSelectOption;
 MultiSelectOption.defaultProps = {

package/build/cjs/select/debounce/debounce.js

@@ -5,6 +5,8 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.debounce = void 0;
 
+var _this = void 0;
+
 /**
  * Returns a function, that, as long as it continues to be invoked, will not be triggered. The
  * function will be called after it stops being called for N milliseconds. If `immediate` is
@@ -12,8 +14,12 @@ exports.debounce = void 0;
  */
 const debounce = (func, wait, immediate) => {
   let timeout;
-  return (...args) => {
-    const context = void 0;
+  return function () {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    const context = _this;
 
     const later = () => {
       timeout = null;

package/build/cjs/select/empty.js

@@ -15,17 +15,20 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const Empty = ({
-  message,
-  className,
-  dataTest
-}) => /*#__PURE__*/_react.default.createElement("div", {
-  "data-test": dataTest,
-  className: _style.default.dynamic([["849993029", [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]]) + " " + (className || "")
-}, message, /*#__PURE__*/_react.default.createElement(_style.default, {
-  id: "849993029",
-  dynamic: [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]
-}, [`div.__jsx-style-dynamic-selector{color:${_uiConstants.colors.grey700};font-family:${_uiConstants.theme.fonts};font-size:13px;line-height:16px;padding:${_uiConstants.spacers.dp8} ${_uiConstants.spacers.dp24};text-align:center;}`]));
+const Empty = _ref => {
+  let {
+    message,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    "data-test": dataTest,
+    className: _style.default.dynamic([["849993029", [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]]) + " " + (className || "")
+  }, message, /*#__PURE__*/_react.default.createElement(_style.default, {
+    id: "849993029",
+    dynamic: [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(_uiConstants.colors.grey700, ";font-family:").concat(_uiConstants.theme.fonts, ";font-size:13px;line-height:16px;padding:").concat(_uiConstants.spacers.dp8, " ").concat(_uiConstants.spacers.dp24, ";text-align:center;}")]));
+};
 
 exports.Empty = Empty;
 Empty.propTypes = {

package/build/cjs/select/filter-input.js

@@ -17,27 +17,30 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const FilterInput = ({
-  value,
-  onChange,
-  placeholder,
-  className,
-  dataTest
-}) => /*#__PURE__*/_react.default.createElement("div", {
-  className: _style.default.dynamic([["1544004171", [_uiConstants.colors.white, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, _uiConstants.spacers.dp8]]]) + " " + (className || "")
-}, /*#__PURE__*/_react.default.createElement(_input.Input, {
-  dense: true,
-  dataTest: dataTest,
-  value: value,
-  onChange: onChange,
-  type: "text",
-  name: "filter",
-  placeholder: placeholder,
-  initialFocus: true
-}), /*#__PURE__*/_react.default.createElement(_style.default, {
-  id: "1544004171",
-  dynamic: [_uiConstants.colors.white, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, _uiConstants.spacers.dp8]
-}, [`div.__jsx-style-dynamic-selector{position:-webkit-sticky;position:sticky;top:0;background:${_uiConstants.colors.white};padding:${_uiConstants.spacers.dp8} ${_uiConstants.spacers.dp8} ${_uiConstants.spacers.dp4} ${_uiConstants.spacers.dp8};z-index:1;}`]));
+const FilterInput = _ref => {
+  let {
+    value,
+    onChange,
+    placeholder,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.dynamic([["1544004171", [_uiConstants.colors.white, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, _uiConstants.spacers.dp8]]]) + " " + (className || "")
+  }, /*#__PURE__*/_react.default.createElement(_input.Input, {
+    dense: true,
+    dataTest: dataTest,
+    value: value,
+    onChange: onChange,
+    type: "text",
+    name: "filter",
+    placeholder: placeholder,
+    initialFocus: true
+  }), /*#__PURE__*/_react.default.createElement(_style.default, {
+    id: "1544004171",
+    dynamic: [_uiConstants.colors.white, _uiConstants.spacers.dp8, _uiConstants.spacers.dp8, _uiConstants.spacers.dp4, _uiConstants.spacers.dp8]
+  }, ["div.__jsx-style-dynamic-selector{position:-webkit-sticky;position:sticky;top:0;background:".concat(_uiConstants.colors.white, ";padding:").concat(_uiConstants.spacers.dp8, " ").concat(_uiConstants.spacers.dp8, " ").concat(_uiConstants.spacers.dp4, " ").concat(_uiConstants.spacers.dp8, ";z-index:1;}")]));
+};
 
 exports.FilterInput = FilterInput;
 FilterInput.propTypes = {

package/build/cjs/select/filterable-menu.js

@@ -26,16 +26,17 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 class FilterableMenu extends _react.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
     _defineProperty(this, "state", {
       filter: ''
     });
 
-    _defineProperty(this, "onFilterChange", ({
-      value
-    }) => {
+    _defineProperty(this, "onFilterChange", _ref => {
+      let {
+        value
+      } = _ref;
       this.setState({
         filter: value
       });
@@ -70,7 +71,7 @@ class FilterableMenu extends _react.Component {
 
     if (_react.default.Children.count(renderedOptions) === 0 || !filter) {
       return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_filterInput.FilterInput, {
-        dataTest: `${dataTest}-filterinput`,
+        dataTest: "".concat(dataTest, "-filterinput"),
         placeholder: placeholder,
         value: filter,
         onChange: this.onFilterChange
@@ -96,7 +97,7 @@ class FilterableMenu extends _react.Component {
 
     const hasMatch = _react.default.Children.count(filtered) > 0;
     return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_filterInput.FilterInput, {
-      dataTest: `${dataTest}-filterinput`,
+      dataTest: "".concat(dataTest, "-filterinput"),
       placeholder: placeholder,
       value: filter,
       onChange: this.onFilterChange

package/build/cjs/select/index.js

@@ -3,76 +3,76 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-Object.defineProperty(exports, "Select", {
+Object.defineProperty(exports, "Empty", {
   enumerable: true,
   get: function () {
-    return _select.Select;
+    return _empty.Empty;
   }
 });
-Object.defineProperty(exports, "Loading", {
+Object.defineProperty(exports, "FilterableMenu", {
   enumerable: true,
   get: function () {
-    return _loading.Loading;
+    return _filterableMenu.FilterableMenu;
   }
 });
-Object.defineProperty(exports, "FilterableMenu", {
+Object.defineProperty(exports, "InputClearButton", {
   enumerable: true,
   get: function () {
-    return _filterableMenu.FilterableMenu;
+    return _inputClearButton.InputClearButton;
   }
 });
-Object.defineProperty(exports, "Empty", {
+Object.defineProperty(exports, "InputPlaceholder", {
   enumerable: true,
   get: function () {
-    return _empty.Empty;
+    return _inputPlaceholder.InputPlaceholder;
   }
 });
-Object.defineProperty(exports, "checkIfValidOption", {
+Object.defineProperty(exports, "InputPrefix", {
   enumerable: true,
   get: function () {
-    return _optionHelpers.checkIfValidOption;
+    return _inputPrefix.InputPrefix;
   }
 });
-Object.defineProperty(exports, "filterIgnored", {
+Object.defineProperty(exports, "Loading", {
   enumerable: true,
   get: function () {
-    return _optionHelpers.filterIgnored;
+    return _loading.Loading;
   }
 });
-Object.defineProperty(exports, "findOptionChild", {
+Object.defineProperty(exports, "Select", {
   enumerable: true,
   get: function () {
-    return _optionHelpers.findOptionChild;
+    return _select.Select;
   }
 });
-Object.defineProperty(exports, "findOption", {
+Object.defineProperty(exports, "checkIfValidOption", {
   enumerable: true,
   get: function () {
-    return _optionHelpers.findOption;
+    return _optionHelpers.checkIfValidOption;
   }
 });
-Object.defineProperty(exports, "removeOption", {
+Object.defineProperty(exports, "filterIgnored", {
   enumerable: true,
   get: function () {
-    return _optionHelpers.removeOption;
+    return _optionHelpers.filterIgnored;
   }
 });
-Object.defineProperty(exports, "InputClearButton", {
+Object.defineProperty(exports, "findOption", {
   enumerable: true,
   get: function () {
-    return _inputClearButton.InputClearButton;
+    return _optionHelpers.findOption;
   }
 });
-Object.defineProperty(exports, "InputPlaceholder", {
+Object.defineProperty(exports, "findOptionChild", {
   enumerable: true,
   get: function () {
-    return _inputPlaceholder.InputPlaceholder;
+    return _optionHelpers.findOptionChild;
   }
 });
-Object.defineProperty(exports, "InputPrefix", {
+Object.defineProperty(exports, "removeOption", {
   enumerable: true,
   get: function () {
-    return _inputPrefix.InputPrefix;
+    return _optionHelpers.removeOption;
   }
 });
 

package/build/cjs/select/input-clear-button.js

@@ -13,19 +13,22 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const InputClearButton = ({
-  onClear,
-  clearText,
-  className,
-  dataTest
-}) => /*#__PURE__*/_react.default.createElement(_button.Button, {
-  small: true,
-  secondary: true,
-  dataTest: dataTest,
-  onClick: onClear,
-  type: "button",
-  className: className
-}, clearText);
+const InputClearButton = _ref => {
+  let {
+    onClear,
+    clearText,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement(_button.Button, {
+    small: true,
+    secondary: true,
+    dataTest: dataTest,
+    onClick: onClear,
+    type: "button",
+    className: className
+  }, clearText);
+};
 
 exports.InputClearButton = InputClearButton;
 InputClearButton.propTypes = {

package/build/cjs/select/input-placeholder.js

@@ -15,11 +15,13 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const InputPlaceholder = ({
-  placeholder,
-  className,
-  dataTest
-}) => {
+const InputPlaceholder = _ref => {
+  let {
+    placeholder,
+    className,
+    dataTest
+  } = _ref;
+
   if (!placeholder) {
     return null;
   }
@@ -30,7 +32,7 @@ const InputPlaceholder = ({
   }, placeholder, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "1027033961",
     dynamic: [_uiConstants.colors.grey600]
-  }, [`div.__jsx-style-dynamic-selector{color:${_uiConstants.colors.grey600};-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`]));
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(_uiConstants.colors.grey600, ";-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")]));
 };
 
 exports.InputPlaceholder = InputPlaceholder;

package/build/cjs/select/input-prefix.js

@@ -15,11 +15,13 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const InputPrefix = ({
-  prefix,
-  className,
-  dataTest
-}) => {
+const InputPrefix = _ref => {
+  let {
+    prefix,
+    className,
+    dataTest
+  } = _ref;
+
   if (!prefix) {
     return null;
   }
@@ -30,7 +32,7 @@ const InputPrefix = ({
   }, prefix, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "153011991",
     dynamic: [_uiConstants.colors.grey600, _uiConstants.spacers.dp4]
-  }, [`div.__jsx-style-dynamic-selector{color:${_uiConstants.colors.grey600};padding-right:${_uiConstants.spacers.dp4};font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}`]));
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(_uiConstants.colors.grey600, ";padding-right:").concat(_uiConstants.spacers.dp4, ";font-size:14px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}")]));
 };
 
 exports.InputPrefix = InputPrefix;

package/build/cjs/select/input-wrapper.js

@@ -19,19 +19,20 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const InputWrapper = ({
-  dataTest,
-  onToggle,
-  children,
-  tabIndex,
-  error,
-  warning,
-  valid,
-  disabled,
-  dense,
-  className,
-  inputRef
-}) => {
+const InputWrapper = _ref => {
+  let {
+    dataTest,
+    onToggle,
+    children,
+    tabIndex,
+    error,
+    warning,
+    valid,
+    disabled,
+    dense,
+    className,
+    inputRef
+  } = _ref;
   const classNames = (0, _classnames.default)(className, 'root', {
     error,
     warning,
@@ -52,7 +53,7 @@ const InputWrapper = ({
   }, /*#__PURE__*/_react.default.createElement(_uiIcons.IconChevronDown16, null)), /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "248041060",
     dynamic: [_uiConstants.colors.grey500, _uiConstants.theme.focus, _uiConstants.theme.focus, _uiConstants.theme.valid, _uiConstants.theme.warning, _uiConstants.theme.error, _uiConstants.colors.grey100, _uiConstants.colors.grey500, _uiConstants.theme.disabled]
-  }, [`.root.__jsx-style-dynamic-selector{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:white;border-radius:3px;border:1px solid ${_uiConstants.colors.grey500};box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-height:40px;padding:6px 12px;box-shadow:inset 0 1px 2px 0 rgba(48,54,60,0.1);}`, `.root.__jsx-style-dynamic-selector:not(.disabled):focus,.root.__jsx-style-dynamic-selector:not(.disabled):active{outline:none;box-shadow:inset 0 0 0 2px ${_uiConstants.theme.focus};border-color:${_uiConstants.theme.focus};}`, `.root.valid.__jsx-style-dynamic-selector{border-color:${_uiConstants.theme.valid};}`, `.root.warning.__jsx-style-dynamic-selector{border-color:${_uiConstants.theme.warning};}`, `.root.error.__jsx-style-dynamic-selector{border-color:${_uiConstants.theme.error};}`, `.root.disabled.__jsx-style-dynamic-selector{background-color:${_uiConstants.colors.grey100};border-color:${_uiConstants.colors.grey500};color:${_uiConstants.theme.disabled};cursor:not-allowed;}`, ".root.dense.__jsx-style-dynamic-selector{padding:4px 8px;min-height:32px;}", ".root-children.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".root-right.__jsx-style-dynamic-selector{margin:4px 0px 0px 8px;}"]));
+  }, [".root.__jsx-style-dynamic-selector{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:white;border-radius:3px;border:1px solid ".concat(_uiConstants.colors.grey500, ";box-sizing:border-box;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;min-height:40px;padding:6px 12px;box-shadow:inset 0 1px 2px 0 rgba(48,54,60,0.1);}"), ".root.__jsx-style-dynamic-selector:not(.disabled):focus,.root.__jsx-style-dynamic-selector:not(.disabled):active{outline:none;box-shadow:inset 0 0 0 2px ".concat(_uiConstants.theme.focus, ";border-color:").concat(_uiConstants.theme.focus, ";}"), ".root.valid.__jsx-style-dynamic-selector{border-color:".concat(_uiConstants.theme.valid, ";}"), ".root.warning.__jsx-style-dynamic-selector{border-color:".concat(_uiConstants.theme.warning, ";}"), ".root.error.__jsx-style-dynamic-selector{border-color:".concat(_uiConstants.theme.error, ";}"), ".root.disabled.__jsx-style-dynamic-selector{background-color:".concat(_uiConstants.colors.grey100, ";border-color:").concat(_uiConstants.colors.grey500, ";color:").concat(_uiConstants.theme.disabled, ";cursor:not-allowed;}"), ".root.dense.__jsx-style-dynamic-selector{padding:4px 8px;min-height:32px;}", ".root-children.__jsx-style-dynamic-selector{-webkit-box-flex:1;-webkit-flex-grow:1;-ms-flex-positive:1;flex-grow:1;}", ".root-right.__jsx-style-dynamic-selector{margin:4px 0px 0px 8px;}"]));
 };
 
 exports.InputWrapper = InputWrapper;

package/build/cjs/select/loading.js

@@ -19,21 +19,24 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const Loading = ({
-  message,
-  className,
-  dataTest
-}) => /*#__PURE__*/_react.default.createElement("div", {
-  "data-test": dataTest,
-  className: _style.default.dynamic([["1068210086", [_uiConstants.spacers.dp16, _uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]]) + " " + ((0, _classnames.default)(className, 'container') || "")
-}, /*#__PURE__*/_react.default.createElement("div", {
-  className: _style.default.dynamic([["1068210086", [_uiConstants.spacers.dp16, _uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]])
-}, /*#__PURE__*/_react.default.createElement(_loader.CircularLoader, {
-  small: true
-})), message, /*#__PURE__*/_react.default.createElement(_style.default, {
-  id: "1068210086",
-  dynamic: [_uiConstants.spacers.dp16, _uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]
-}, [`.container.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:${_uiConstants.spacers.dp16};-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:${_uiConstants.colors.grey700};font-family:${_uiConstants.theme.fonts};font-size:13px;padding:${_uiConstants.spacers.dp8} ${_uiConstants.spacers.dp24};}`]));
+const Loading = _ref => {
+  let {
+    message,
+    className,
+    dataTest
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    "data-test": dataTest,
+    className: _style.default.dynamic([["1068210086", [_uiConstants.spacers.dp16, _uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]]) + " " + ((0, _classnames.default)(className, 'container') || "")
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.dynamic([["1068210086", [_uiConstants.spacers.dp16, _uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]])
+  }, /*#__PURE__*/_react.default.createElement(_loader.CircularLoader, {
+    small: true
+  })), message, /*#__PURE__*/_react.default.createElement(_style.default, {
+    id: "1068210086",
+    dynamic: [_uiConstants.spacers.dp16, _uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]
+  }, [".container.__jsx-style-dynamic-selector{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;gap:".concat(_uiConstants.spacers.dp16, ";-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:").concat(_uiConstants.colors.grey700, ";font-family:").concat(_uiConstants.theme.fonts, ";font-size:13px;padding:").concat(_uiConstants.spacers.dp8, " ").concat(_uiConstants.spacers.dp24, ";}")]));
+};
 
 exports.Loading = Loading;
 Loading.propTypes = {

package/build/cjs/select/menu-wrapper.js

@@ -19,14 +19,15 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const MenuWrapper = ({
-  children,
-  dataTest,
-  maxHeight,
-  menuWidth,
-  onClick,
-  selectRef
-}) => {
+const MenuWrapper = _ref => {
+  let {
+    children,
+    dataTest,
+    maxHeight,
+    menuWidth,
+    onClick,
+    selectRef
+  } = _ref;
   return /*#__PURE__*/_react.default.createElement(_layer.Layer, {
     onClick: onClick,
     transparent: true
@@ -35,12 +36,12 @@ const MenuWrapper = ({
     placement: "bottom-start",
     observeReferenceResize: true
   }, /*#__PURE__*/_react.default.createElement("div", {
-    "data-test": `${dataTest}-menuwrapper`,
+    "data-test": "".concat(dataTest, "-menuwrapper"),
     className: _style.default.dynamic([["1363246346", [menuWidth, maxHeight, _uiConstants.colors.white, _uiConstants.colors.grey200, _uiConstants.elevations.e300]]])
   }, children, /*#__PURE__*/_react.default.createElement(_style.default, {
     id: "1363246346",
     dynamic: [menuWidth, maxHeight, _uiConstants.colors.white, _uiConstants.colors.grey200, _uiConstants.elevations.e300]
-  }, [`div.__jsx-style-dynamic-selector{width:${menuWidth};height:auto;max-height:${maxHeight};overflow:auto;background:${_uiConstants.colors.white};border:1px solid ${_uiConstants.colors.grey200};border-radius:3px;box-shadow:${_uiConstants.elevations.e300};}`]))));
+  }, ["div.__jsx-style-dynamic-selector{width:".concat(menuWidth, ";height:auto;max-height:").concat(maxHeight, ";overflow:auto;background:").concat(_uiConstants.colors.white, ";border:1px solid ").concat(_uiConstants.colors.grey200, ";border-radius:3px;box-shadow:").concat(_uiConstants.elevations.e300, ";}")]))));
 };
 
 exports.MenuWrapper = MenuWrapper;

package/build/cjs/select/no-match.js

@@ -15,15 +15,18 @@ var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const NoMatch = ({
-  message,
-  className
-}) => /*#__PURE__*/_react.default.createElement("div", {
-  className: _style.default.dynamic([["849993029", [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]]) + " " + (className || "")
-}, message, /*#__PURE__*/_react.default.createElement(_style.default, {
-  id: "849993029",
-  dynamic: [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]
-}, [`div.__jsx-style-dynamic-selector{color:${_uiConstants.colors.grey700};font-family:${_uiConstants.theme.fonts};font-size:13px;line-height:16px;padding:${_uiConstants.spacers.dp8} ${_uiConstants.spacers.dp24};text-align:center;}`]));
+const NoMatch = _ref => {
+  let {
+    message,
+    className
+  } = _ref;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _style.default.dynamic([["849993029", [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]]]) + " " + (className || "")
+  }, message, /*#__PURE__*/_react.default.createElement(_style.default, {
+    id: "849993029",
+    dynamic: [_uiConstants.colors.grey700, _uiConstants.theme.fonts, _uiConstants.spacers.dp8, _uiConstants.spacers.dp24]
+  }, ["div.__jsx-style-dynamic-selector{color:".concat(_uiConstants.colors.grey700, ";font-family:").concat(_uiConstants.theme.fonts, ";font-size:13px;line-height:16px;padding:").concat(_uiConstants.spacers.dp8, " ").concat(_uiConstants.spacers.dp24, ";text-align:center;}")]));
+};
 
 exports.NoMatch = NoMatch;
 NoMatch.propTypes = {

package/build/cjs/select/option-helpers.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.removeOption = exports.findOption = exports.findOptionChild = exports.filterIgnored = exports.checkIfValidOption = void 0;
+exports.removeOption = exports.findOptionChild = exports.findOption = exports.filterIgnored = exports.checkIfValidOption = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 

package/build/cjs/select/select.js

@@ -32,8 +32,8 @@ const UP_KEY = 38;
 const DOWN_KEY = 40;
 
 class Select extends _react.Component {
-  constructor(...args) {
-    super(...args);
+  constructor() {
+    super(...arguments);
 
     _defineProperty(this, "state", {
       open: false,
@@ -174,8 +174,8 @@ class Select extends _react.Component {
       menuWidth
     } = this.state;
 
-    if (offsetWidth && `${offsetWidth}px` !== menuWidth) {
-      return `${offsetWidth}px`;
+    if (offsetWidth && "".concat(offsetWidth, "px") !== menuWidth) {
+      return "".concat(offsetWidth, "px");
     }
 
     return menuWidth;
@@ -236,13 +236,13 @@ class Select extends _react.Component {
       valid: valid,
       disabled: disabled,
       dense: dense,
-      dataTest: `${dataTest}-input`
+      dataTest: "".concat(dataTest, "-input")
     }, input), open && /*#__PURE__*/_react.default.createElement(_menuWrapper.MenuWrapper, {
       onClick: this.onOutsideClick,
       maxHeight: maxHeight,
       selectRef: this.selectRef,
       menuWidth: menuWidth,
-      dataTest: `${dataTest}-menu`
+      dataTest: "".concat(dataTest, "-menu")
     }, menu));
   }