@commercetools-uikit/select-utils 16.0.0 → 16.1.1

package/dist/commercetools-uikit-select-utils.cjs.dev.js

@@ -51,28 +51,25 @@ var messages$1 = reactIntl.defineMessages({
 });
 
 const _excluded = ["ref", "onMouseDown"];
-
 function ownKeys$6(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$6(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$6(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$6(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
-
 const ClearIndicator = props => {
   const intl = reactIntl.useIntl();
-
   const getStyles = props.getStyles,
-        _props$innerProps = props.innerProps,
-        ref = _props$innerProps.ref,
-        onMouseDown = _props$innerProps.onMouseDown,
-        restInnerProps = _objectWithoutProperties(_props$innerProps, _excluded);
-
+    _props$innerProps = props.innerProps,
+    ref = _props$innerProps.ref,
+    onMouseDown = _props$innerProps.onMouseDown,
+    restInnerProps = _objectWithoutProperties(_props$innerProps, _excluded);
   return jsxRuntime.jsx("button", _objectSpread$6(_objectSpread$6({}, restInnerProps), {}, {
     ref: ref,
     css: /*#__PURE__*/react.css("border:none;cursor:pointer;background:none;box-sizing:border-box;text-decoration:none;fill:", designSystem.designTokens.fontColorForClearInputIcon, ";:hover svg *{fill:", designSystem.designTokens.fontColorForClearInputIconWhenHovered, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:ClearIndicator;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNsZWFyLWluZGljYXRvci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBMEJjIiwiZmlsZSI6ImNsZWFyLWluZGljYXRvci50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgdHlwZSB7IENTU1Byb3BlcnRpZXMsIExlZ2FjeVJlZiB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB0eXBlIHsgQ2xlYXJJbmRpY2F0b3JQcm9wcyB9IGZyb20gJ3JlYWN0LXNlbGVjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyB1c2VJbnRsIH0gZnJvbSAncmVhY3QtaW50bCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7IENsb3NlSWNvbiB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L2ljb25zJztcbmltcG9ydCBtZXNzYWdlcyBmcm9tICcuL21lc3NhZ2VzJztcblxudHlwZSBUSW5uZXJQcm9wcyA9IHtcbiAgcmVmOiBMZWdhY3lSZWY8SFRNTEJ1dHRvbkVsZW1lbnQ+O1xufSAmIEpTWC5JbnRyaW5zaWNFbGVtZW50c1snYnV0dG9uJ107XG5cbmV4cG9ydCB0eXBlIFRDbGVhckluZGljYXRvclByb3BzID0ge1xuICBpbm5lclByb3BzOiBUSW5uZXJQcm9wcztcbn0gJiBDbGVhckluZGljYXRvclByb3BzO1xuXG5jb25zdCBDbGVhckluZGljYXRvciA9IChwcm9wczogVENsZWFySW5kaWNhdG9yUHJvcHMpID0+IHtcbiAgY29uc3QgaW50bCA9IHVzZUludGwoKTtcbiAgY29uc3Qge1xuICAgIGdldFN0eWxlcyxcbiAgICBpbm5lclByb3BzOiB7IHJlZiwgb25Nb3VzZURvd24sIC4uLnJlc3RJbm5lclByb3BzIH0sXG4gIH0gPSBwcm9wcztcbiAgcmV0dXJuIChcbiAgICA8YnV0dG9uXG4gICAgICB7Li4ucmVzdElubmVyUHJvcHN9XG4gICAgICByZWY9e3JlZn1cbiAgICAgIGNzcz17Y3NzYFxuICAgICAgICBib3JkZXI6IG5vbmU7XG4gICAgICAgIGN1cnNvcjogcG9pbnRlcjtcbiAgICAgICAgYmFja2dyb3VuZDogbm9uZTtcbiAgICAgICAgYm94LXNpemluZzogYm9yZGVyLWJveDtcbiAgICAgICAgdGV4dC1kZWNvcmF0aW9uOiBub25lO1xuICAgICAgICBmaWxsOiAke2Rlc2lnblRva2Vucy5mb250Q29sb3JGb3JDbGVhcklucHV0SWNvbn07XG4gICAgICAgIDpob3ZlciBzdmcgKiB7XG4gICAgICAgICAgZmlsbDogJHtkZXNpZ25Ub2tlbnMuZm9udENvbG9yRm9yQ2xlYXJJbnB1dEljb25XaGVuSG92ZXJlZH07XG4gICAgICAgIH1cbiAgICAgIGB9XG4gICAgICBzdHlsZT17Z2V0U3R5bGVzKCdjbGVhckluZGljYXRvcicsIHByb3BzKSBhcyBDU1NQcm9wZXJ0aWVzfVxuICAgICAgdGl0bGU9e2ludGwuZm9ybWF0TWVzc2FnZShtZXNzYWdlcy5jbGVhckJ1dHRvbkxhYmVsKX1cbiAgICAgIGFyaWEtbGFiZWw9e2ludGwuZm9ybWF0TWVzc2FnZShtZXNzYWdlcy5jbGVhckJ1dHRvbkxhYmVsKX1cbiAgICAgIC8vIG92ZXJyaWRpbmcgdGhlIGRlZmF1bHQgYGFyaWEtaGlkZGVuYCBwcm9wIHZhbHVlIHRvIG1ha2UgdGhlIGNvbXBvbmVudCBhY2Nlc3NpYmxlIGJ5IGtleWJvYXJkIC0gaHR0cHM6Ly9naXRodWIuY29tL0plZFdhdHNvbi9yZWFjdC1zZWxlY3QvaXNzdWVzLzQ3OTNcbiAgICAgIGFyaWEtaGlkZGVuPXtmYWxzZX1cbiAgICAgIC8vIG9ubHkgb25Nb3VzZURvd24gYW5kIG9uVG91Y2hFbmQgZXZlbnQgaGFuZGxlcnMgYXJlIHBhc3NlZCBieSBgcmVhY3Qtc2VsZWN0YCB0byB0aGUgY29tcG9uZW50IGJ5IGRlZmF1bHQsIHdoaWNoIG1ha2VzIGl0IG5vdCBhY2Nlc3NpYmxlIGJ5IGtleWJvYXJkXG4gICAgICBvbkNsaWNrPXtvbk1vdXNlRG93bn1cbiAgICA+XG4gICAgICA8Q2xvc2VJY29uIHNpemU9XCJtZWRpdW1cIiAvPlxuICAgIDwvYnV0dG9uPlxuICApO1xufTtcblxuQ2xlYXJJbmRpY2F0b3IuZGlzcGxheU5hbWUgPSAnQ2xlYXJJbmRpY2F0b3InO1xuXG5leHBvcnQgZGVmYXVsdCBDbGVhckluZGljYXRvcjtcbiJdfQ== */"),
     style: getStyles('clearIndicator', props),
     title: intl.formatMessage(messages$1.clearButtonLabel),
-    "aria-label": intl.formatMessage(messages$1.clearButtonLabel) // overriding the default `aria-hidden` prop value to make the component accessible by keyboard - https://github.com/JedWatson/react-select/issues/4793
+    "aria-label": intl.formatMessage(messages$1.clearButtonLabel)
+    // overriding the default `aria-hidden` prop value to make the component accessible by keyboard - https://github.com/JedWatson/react-select/issues/4793
     ,
-    "aria-hidden": false // only onMouseDown and onTouchEnd event handlers are passed by `react-select` to the component by default, which makes it not accessible by keyboard
+    "aria-hidden": false
+    // only onMouseDown and onTouchEnd event handlers are passed by `react-select` to the component by default, which makes it not accessible by keyboard
     ,
     onClick: onMouseDown,
     children: jsxRuntime.jsx(icons.CloseIcon, {
@@ -80,20 +77,17 @@ const ClearIndicator = props => {
     })
   }));
 };
-
 ClearIndicator.displayName = 'ClearIndicator';
 var ClearIndicator$1 = ClearIndicator;
 
 function ownKeys$5(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$5(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$5(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$5(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
 // see https://github.com/JedWatson/react-select/blob/44e9fb29b230e49a754a2f0d6f30c2250aa45009/src/components/MultiValue.js
 const removeProps = ['onClick', 'onTouchEnd', 'onMouseDown'];
-
 const TagRemove = props => {
-  const isDisabled = Boolean(props.selectProps.isDisabled || props.selectProps.isReadOnly); // when the select input is disabled,
+  const isDisabled = Boolean(props.selectProps.isDisabled || props.selectProps.isReadOnly);
+  // when the select input is disabled,
   // we don't want to spread the removeProp event handlers
-
   const innerProps = isDisabled ? omit__default["default"](props.innerProps, removeProps) : props.innerProps;
   return jsxRuntime.jsx(AccessibleButton__default["default"], _objectSpread$5(_objectSpread$5({
     label: "Remove"
@@ -104,28 +98,22 @@ const TagRemove = props => {
     })
   }));
 };
-
 TagRemove.displayName = 'TagRemove';
 var TagRemove$1 = TagRemove;
 
 function ownKeys$4(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$4(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$4(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$4(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
-
 const DropdownIndicator = props => jsxRuntime.jsx(reactSelect.components.DropdownIndicator, _objectSpread$4(_objectSpread$4({}, props), {}, {
   children: jsxRuntime.jsx(icons.CaretDownIcon, {
     color: props.isDisabled ? 'neutral60' : undefined,
     size: "small"
   })
 }));
-
 DropdownIndicator.displayName = 'DropdownIndicator';
 var DropdownIndicator$1 = DropdownIndicator;
 
 function ownKeys$3(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$3(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$3(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$3(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
-
 const SearchIconDropdownIndicator = props => {
   return jsxRuntime.jsx(reactSelect.components.DropdownIndicator, _objectSpread$3(_objectSpread$3({}, props), {}, {
     children: jsxRuntime.jsx(icons.SearchIcon, {
@@ -134,27 +122,21 @@ const SearchIconDropdownIndicator = props => {
     })
   }));
 };
-
 SearchIconDropdownIndicator.displayName = 'SearchIconDropdownIndicator';
 var SearchIconDropdownIndicator$1 = SearchIconDropdownIndicator;
 
 function ownKeys$2(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$2(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
-
 const getDefaultComponent = type => {
   if (type === 'singleValue') return reactSelect.components.SingleValue;
   if (type === 'placeholder') return reactSelect.components.Placeholder;
   return null;
 };
-
 const WrapperWithIcon = props => {
   const DefaultComponent = getDefaultComponent(props.type);
-
   if (!DefaultComponent) {
     return null;
   }
-
   return jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [props.selectProps.iconLeft && /*#__PURE__*/react$1.cloneElement(props.selectProps.iconLeft, {
       size: 'big'
@@ -167,7 +149,6 @@ const WrapperWithIcon = props => {
     })]
   });
 };
-
 WrapperWithIcon.displayName = 'WrapperWithIcon';
 var WrapperWithIcon$1 = WrapperWithIcon;
 const customComponents = {
@@ -187,7 +168,6 @@ const SELECT_DROPDOWN_OPTION_TYPES = {
 };
 
 function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread$1(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), !0)).call(_context, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context2 = ownKeys$1(Object(source))).call(_context2, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
 const MultiplePropertiesSelectInputOption = props => {
   const data = props.data;
@@ -225,20 +205,16 @@ const DoublePropertySelectInputOption = props => {
 DoublePropertySelectInputOption.displayName = 'DoublePropertySelectInputOption';
 const CustomSelectInputOption = props => {
   var _props$optionInnerPro;
-
   const noValueFallback = props.noValueFallback || NO_VALUE_FALLBACK;
-
   switch (props.optionType) {
     case SELECT_DROPDOWN_OPTION_TYPES.MULTIPLE_PROPERTIES:
       return jsxRuntime.jsx(MultiplePropertiesSelectInputOption, _objectSpread$1(_objectSpread$1({}, props.optionInnerProps), {}, {
         noValueFallback: noValueFallback
       }));
-
     case SELECT_DROPDOWN_OPTION_TYPES.DOUBLE_PROPERTY:
       return jsxRuntime.jsx(DoublePropertySelectInputOption, _objectSpread$1(_objectSpread$1({}, props.optionInnerProps), {}, {
         noValueFallback: noValueFallback
       }));
-
     default:
       return jsxRuntime.jsx(reactSelect.components.Option, _objectSpread$1(_objectSpread$1({}, props.optionInnerProps), {}, {
         children: jsxRuntime.jsx(Text__default["default"].Detail, {
@@ -278,32 +254,24 @@ var messages = reactIntl.defineMessages({
 });
 
 function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); enumerableOnly && (symbols = _filterInstanceProperty__default["default"](symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor__default["default"](object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context9, _context10; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(source), !0)).call(_context9, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys(Object(source))).call(_context10, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
-
 const getControlBorderColor = (props, defaultColor) => {
   if (props.isDisabled) {
     return designSystem.designTokens.borderColorForInputWhenDisabled;
   }
-
   if (props.isReadOnly) {
     return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
   }
-
   if (props.hasError) {
     return designSystem.designTokens.borderColorForInputWhenError;
   }
-
   if (props.hasWarning) {
     return designSystem.designTokens.borderColorForInputWhenWarning;
   }
-
   return defaultColor;
 };
-
 const controlStyles = props => (base, state) => {
   var _context;
-
   return _objectSpread(_objectSpread({}, base), {}, {
     fontSize: designSystem.designTokens.fontSizeForInput,
     backgroundColor: (() => {
@@ -337,7 +305,6 @@ const controlStyles = props => (base, state) => {
     '&:focus-within': {
       boxShadow: (() => {
         var _context2;
-
         if (!props.isDisabled && !props.isReadOnly) return _concatInstanceProperty__default["default"](_context2 = "".concat(designSystem.designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designSystem.designTokens.borderColorForInputWhenFocused);
         return null;
       })(),
@@ -357,7 +324,6 @@ const controlStyles = props => (base, state) => {
     color: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : base.fontColorForInput
   });
 };
-
 const menuStyles = props => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     border: "1px solid ".concat(designSystem.designTokens.borderColorForSelectInputMenu),
@@ -374,7 +340,6 @@ const menuStyles = props => base => {
     })()
   });
 };
-
 const indicatorSeparatorStyles = () => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     display: 'none',
@@ -383,7 +348,6 @@ const indicatorSeparatorStyles = () => base => {
     marginLeft: designSystem.designTokens.spacing10
   });
 };
-
 const dropdownIndicatorStyles = props => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     color: designSystem.designTokens.fontColorForInput,
@@ -398,13 +362,11 @@ const dropdownIndicatorStyles = props => base => {
     })()
   });
 };
-
 const clearIndicatorStyles = () => base => _objectSpread(_objectSpread({}, base), {}, {
   display: 'flex',
   padding: 0,
   marginLeft: designSystem.designTokens.marginForSelectInputIcon
 });
-
 const menuListStyles = () => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     padding: designSystem.designTokens.paddingForSelectInputMenu,
@@ -412,10 +374,8 @@ const menuListStyles = () => base => {
     backgroundColor: designSystem.designTokens.backgroundColorForInput
   });
 };
-
 const optionStyles = () => (base, state) => {
   var _context3, _context4;
-
   return _objectSpread(_objectSpread({}, base), {}, {
     transition: _concatInstanceProperty__default["default"](_context3 = _concatInstanceProperty__default["default"](_context4 = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n      background-color ")).call(_context4, designSystem.designTokens.transitionStandard, ",\n      color ")).call(_context3, designSystem.designTokens.transitionStandard),
     paddingLeft: designSystem.designTokens.paddingLeftForSelectInputOptions,
@@ -442,7 +402,6 @@ const optionStyles = () => (base, state) => {
     }
   });
 };
-
 const placeholderStyles = props => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     color: (() => {
@@ -455,8 +414,8 @@ const placeholderStyles = props => base => {
     fill: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : base.fontColorForInput
   });
 };
-
 const valueContainerStyles = props => base => {
+  var _props$controlShouldR;
   return _objectSpread(_objectSpread({}, base), {}, {
     padding: '0',
     backgroundColor: 'none',
@@ -464,29 +423,25 @@ const valueContainerStyles = props => base => {
     // Display property should be grid when isMulti and has no value so the Placeholder component is positioned correctly with the Input
     // Display property should be Flex when there is an iconLeft, also when the input has some values when isMulti.
     // See PR from react select for more insight https://github.com/JedWatson/react-select/pull/4833
-    display: props.iconLeft && !props.isMulti || props.isMulti && props.hasValue && props.controlShouldRenderValue ? 'flex' : 'grid',
+    display: props.iconLeft && !props.isMulti || props.isMulti && props.hasValue && ((_props$controlShouldR = props.controlShouldRenderValue) !== null && _props$controlShouldR !== void 0 ? _props$controlShouldR : true) ? 'flex' : 'grid',
     fill: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : designSystem.designTokens.fontColorForSelectInputIcon
   });
 };
-
 const singleValueStyles = props => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     color: (() => {
       if (props.isDisabled) {
         return designSystem.designTokens.fontColorForInputWhenDisabled;
       }
-
       if (props.isReadOnly) {
         return designSystem.designTokens.fontColorForInputWhenReadonly;
       }
-
       if (props.hasError) return designSystem.designTokens.fontColorForSelectInputWhenError;
       if (props.hasWarning) return designSystem.designTokens.fontColorForSelectInputWhenWarning;
       return designSystem.designTokens.fontColorForInput;
     })()
   });
 };
-
 const groupStyles = props => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     padding: 0,
@@ -495,10 +450,8 @@ const groupStyles = props => base => {
     }
   });
 };
-
 const groupHeadingStyles = () => base => {
   var _context5;
-
   return _objectSpread(_objectSpread({}, base), {}, {
     color: designSystem.designTokens.fontColorForInputWhenReadonly,
     fontSize: designSystem.designTokens.fontSizeSmall,
@@ -510,7 +463,6 @@ const groupHeadingStyles = () => base => {
     }
   });
 };
-
 const containerStyles = () => (base, state) => {
   return _objectSpread(_objectSpread({}, base), {}, {
     fontFamily: 'inherit',
@@ -520,17 +472,14 @@ const containerStyles = () => (base, state) => {
     boxShadow: state.isFocused ? 'none' : base.boxShadow
   });
 };
-
 const indicatorsContainerStyles = () => () => ({
   background: 'none',
   display: 'flex',
   alignItems: 'center'
 });
-
 const menuPortalStyles = props => base => _objectSpread(_objectSpread({}, base), {}, {
   zIndex: props.menuPortalZIndex
 });
-
 const multiValueStyles = () => base => {
   return _objectSpread(_objectSpread({}, base), {}, {
     display: 'flex',
@@ -541,10 +490,8 @@ const multiValueStyles = () => base => {
     border: designSystem.designTokens.borderForSelectInputTag
   });
 };
-
 const multiValueLabelStyles = props => base => {
   var _context6, _context7;
-
   return _objectSpread(_objectSpread({}, base), {}, {
     fontSize: designSystem.designTokens.fontSizeForSelectInputTag,
     color: (() => {
@@ -554,7 +501,7 @@ const multiValueLabelStyles = props => base => {
     })(),
     padding: _concatInstanceProperty__default["default"](_context6 = "".concat(designSystem.designTokens.spacing10, " ")).call(_context6, designSystem.designTokens.spacing20),
     borderRadius: _concatInstanceProperty__default["default"](_context7 = "".concat(designSystem.designTokens.borderRadiusForTag, " 0 0 ")).call(_context7, designSystem.designTokens.borderRadiusForTag),
-    border: props.isNewTheme ? 'none' : "1px ".concat(designSystem.designTokens.borderColorForTag, " solid"),
+    border: 'none',
     borderWidth: '1px 0 1px 1px',
     '&:last-child': {
       borderRadius: designSystem.designTokens.borderRadiusForTag,
@@ -562,16 +509,14 @@ const multiValueLabelStyles = props => base => {
     }
   });
 };
-
 const multiValueRemoveStyles = props => (base, state) => {
   var _context8;
-
   return _objectSpread(_objectSpread({}, base), {}, {
     borderColor: designSystem.designTokens.borderColorForTag,
     padding: "0 ".concat(designSystem.designTokens.spacing10),
     borderRadius: _concatInstanceProperty__default["default"](_context8 = "0 ".concat(designSystem.designTokens.borderRadiusForTag, " ")).call(_context8, designSystem.designTokens.borderRadiusForTag, " 0"),
-    borderStyle: !props.isNewTheme ? 'solid' : 'none',
-    borderWidth: !props.isNewTheme ? designSystem.designTokens.borderWidth1 : '0',
+    borderStyle: 'none',
+    borderWidth: '0',
     pointerEvents: state.isDisabled || props.isReadOnly ? 'none' : base.pointerEvents,
     backgroundColor: designSystem.designTokens.backgroundColorForTag,
     'svg *': {
@@ -586,7 +531,6 @@ const multiValueRemoveStyles = props => (base, state) => {
     }
   });
 };
-
 function createSelectStyles(props) {
   return {
     control: controlStyles(props),
@@ -611,7 +555,6 @@ function createSelectStyles(props) {
 }
 
 const getMessage = componentName => "".concat(componentName, ": use `menuPortalZIndex` in conjunction with `menuPortalTarget`");
-
 const warnIfMenuPortalPropsAreMissing = props => {
   if (typeof props.menuPortalZIndex !== 'undefined' && props.menuPortalZIndex !== 1 // 1 is the value passed in default props
   ) {
@@ -620,7 +563,7 @@ const warnIfMenuPortalPropsAreMissing = props => {
 };
 
 // NOTE: This string will be replaced on build time with the package version.
-var version = "16.0.0";
+var version = "16.1.1";
 
 exports.ClearIndicator = ClearIndicator$1;
 exports.CustomSelectInputOption = CustomSelectInputOption;