@commercetools-uikit/select-utils 12.2.1 → 12.2.5

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

@@ -14,15 +14,15 @@ var _Object$defineProperty = require('@babel/runtime-corejs3/core-js-stable/obje
 var _defineProperty = require('@babel/runtime-corejs3/helpers/defineProperty');
 var _concatInstanceProperty = require('@babel/runtime-corejs3/core-js-stable/instance/concat');
 var designSystem = require('@commercetools-uikit/design-system');
-var _extends = require('@babel/runtime-corejs3/helpers/extends');
 var _objectWithoutProperties = require('@babel/runtime-corejs3/helpers/objectWithoutProperties');
-var React = require('react');
 var PropTypes = require('prop-types');
 var react = require('@emotion/react');
 var icons = require('@commercetools-uikit/icons');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
 var omit = require('lodash/omit');
 var AccessibleButton = require('@commercetools-uikit/accessible-button');
 var reactSelect = require('react-select');
+var react$1 = require('react');
 var _Object$values = require('@babel/runtime-corejs3/core-js-stable/object/values');
 var Spacings = require('@commercetools-uikit/spacings');
 var Text = require('@commercetools-uikit/text');
@@ -38,7 +38,6 @@ var _Object$getOwnPropertyDescriptors__default = /*#__PURE__*/_interopDefault(_O
 var _Object$defineProperties__default = /*#__PURE__*/_interopDefault(_Object$defineProperties);
 var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defineProperty);
 var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
-var React__default = /*#__PURE__*/_interopDefault(React);
 var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
 var omit__default = /*#__PURE__*/_interopDefault(omit);
 var AccessibleButton__default = /*#__PURE__*/_interopDefault(AccessibleButton);
@@ -46,7 +45,7 @@ var _Object$values__default = /*#__PURE__*/_interopDefault(_Object$values);
 var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
 var Text__default = /*#__PURE__*/_interopDefault(Text);
 
-var messages = reactIntl.defineMessages({
+var messages$1 = reactIntl.defineMessages({
   clearButtonLabel: {
     id: 'UIKit.ClearButton.clearButtonLabel',
     description: 'Label for the clear button',
@@ -54,7 +53,11 @@ var messages = reactIntl.defineMessages({
   }
 });
 
-var _excluded = ["ref"];
+var _excluded$1 = ["ref"];
+
+function ownKeys$6(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$6(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
 
 var ClearIndicator = function ClearIndicator(props) {
   var intl = reactIntl.useIntl();
@@ -62,112 +65,144 @@ var ClearIndicator = function ClearIndicator(props) {
   var getStyles = props.getStyles,
       _props$innerProps = props.innerProps,
       ref = _props$innerProps.ref,
-      restInnerProps = _objectWithoutProperties(_props$innerProps, _excluded);
+      restInnerProps = _objectWithoutProperties(_props$innerProps, _excluded$1);
 
-  return react.jsx("button", _extends({}, restInnerProps, {
+  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;:hover svg *{fill:", designSystem.customProperties.colorWarning, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:ClearIndicator;")),
+    css: /*#__PURE__*/react.css("border:none;cursor:pointer;background:none;box-sizing:border-box;text-decoration:none;:hover svg *{fill:", designSystem.customProperties.colorWarning, ";}" + (process.env.NODE_ENV === "production" ? "" : ";label:ClearIndicator;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbImNsZWFyLWluZGljYXRvci5qcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQmMiLCJmaWxlIjoiY2xlYXItaW5kaWNhdG9yLmpzIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IHVzZUludGwgfSBmcm9tICdyZWFjdC1pbnRsJztcbmltcG9ydCB7IGN1c3RvbVByb3BlcnRpZXMgYXMgdmFycyB9IGZyb20gJ0Bjb21tZXJjZXRvb2xzLXVpa2l0L2Rlc2lnbi1zeXN0ZW0nO1xuaW1wb3J0IHsgQ2xvc2VJY29uIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvaWNvbnMnO1xuaW1wb3J0IG1lc3NhZ2VzIGZyb20gJy4vbWVzc2FnZXMnO1xuXG5jb25zdCBDbGVhckluZGljYXRvciA9IChwcm9wcykgPT4ge1xuICBjb25zdCBpbnRsID0gdXNlSW50bCgpO1xuICBjb25zdCB7XG4gICAgZ2V0U3R5bGVzLFxuICAgIGlubmVyUHJvcHM6IHsgcmVmLCAuLi5yZXN0SW5uZXJQcm9wcyB9LFxuICB9ID0gcHJvcHM7XG4gIHJldHVybiAoXG4gICAgPGJ1dHRvblxuICAgICAgey4uLnJlc3RJbm5lclByb3BzfVxuICAgICAgcmVmPXtyZWZ9XG4gICAgICBjc3M9e2Nzc2BcbiAgICAgICAgYm9yZGVyOiBub25lO1xuICAgICAgICBjdXJzb3I6IHBvaW50ZXI7XG4gICAgICAgIGJhY2tncm91bmQ6IG5vbmU7XG4gICAgICAgIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG4gICAgICAgIHRleHQtZGVjb3JhdGlvbjogbm9uZTtcbiAgICAgICAgOmhvdmVyIHN2ZyAqIHtcbiAgICAgICAgICBmaWxsOiAke3ZhcnMuY29sb3JXYXJuaW5nfTtcbiAgICAgICAgfVxuICAgICAgYH1cbiAgICAgIHN0eWxlPXtnZXRTdHlsZXMoJ2NsZWFySW5kaWNhdG9yJywgcHJvcHMpfVxuICAgICAgdGl0bGU9e2ludGwuZm9ybWF0TWVzc2FnZShtZXNzYWdlcy5jbGVhckJ1dHRvbkxhYmVsKX1cbiAgICAgIGFyaWEtbGFiZWw9e2ludGwuZm9ybWF0TWVzc2FnZShtZXNzYWdlcy5jbGVhckJ1dHRvbkxhYmVsKX1cbiAgICA+XG4gICAgICA8Q2xvc2VJY29uIGNvbG9yPVwic29saWRcIiBzaXplPVwibWVkaXVtXCIgLz5cbiAgICA8L2J1dHRvbj5cbiAgKTtcbn07XG5cbkNsZWFySW5kaWNhdG9yLmRpc3BsYXlOYW1lID0gJ0NsZWFySW5kaWNhdG9yJztcbkNsZWFySW5kaWNhdG9yLnByb3BUeXBlcyA9IHtcbiAgaW5uZXJQcm9wczogUHJvcFR5cGVzLm9iamVjdCxcbiAgZ2V0U3R5bGVzOiBQcm9wVHlwZXMuZnVuYy5pc1JlcXVpcmVkLFxufTtcblxuZXhwb3J0IGRlZmF1bHQgQ2xlYXJJbmRpY2F0b3I7XG4iXX0= */"),
     style: getStyles('clearIndicator', props),
-    title: intl.formatMessage(messages.clearButtonLabel),
-    "aria-label": intl.formatMessage(messages.clearButtonLabel)
-  }), react.jsx(icons.CloseIcon, {
-    color: "solid",
-    size: "medium"
+    title: intl.formatMessage(messages$1.clearButtonLabel),
+    "aria-label": intl.formatMessage(messages$1.clearButtonLabel),
+    children: jsxRuntime.jsx(icons.CloseIcon, {
+      color: "solid",
+      size: "medium"
+    })
   }));
 };
 
 ClearIndicator.displayName = 'ClearIndicator';
 ClearIndicator.propTypes = process.env.NODE_ENV !== "production" ? {
-  innerProps: PropTypes__default['default'].object,
-  getStyles: PropTypes__default['default'].func.isRequired
+  innerProps: PropTypes__default["default"].object,
+  getStyles: PropTypes__default["default"].func.isRequired
 } : {};
+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); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$5(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
 var removeProps = ['onClick', 'onTouchEnd', 'onMouseDown'];
 
 var TagRemove = function TagRemove(props) {
   var isDisabled = Boolean(props.selectProps.isDisabled || props.selectProps.isReadOnly); // when the select input is disabled,
   // we don't want to spread the removeProp event handlers
 
-  var innerProps = isDisabled ? omit__default['default'](props.innerProps, removeProps) : props.innerProps;
-  return react.jsx(AccessibleButton__default['default'], _extends({
+  var innerProps = isDisabled ? omit__default["default"](props.innerProps, removeProps) : props.innerProps;
+  return jsxRuntime.jsx(AccessibleButton__default["default"], _objectSpread$5(_objectSpread$5({
     label: "Remove"
-  }, innerProps), react.jsx(icons.CloseBoldIcon, {
-    color: isDisabled ? 'neutral60' : 'solid',
-    size: "medium"
+  }, innerProps), {}, {
+    children: jsxRuntime.jsx(icons.CloseBoldIcon, {
+      color: isDisabled ? 'neutral60' : 'solid',
+      size: "medium"
+    })
   }));
 };
 
 TagRemove.displayName = 'TagRemove';
 TagRemove.propTypes = process.env.NODE_ENV !== "production" ? {
-  selectProps: PropTypes__default['default'].shape({
-    isDisabled: PropTypes__default['default'].bool.isRequired,
-    isReadOnly: PropTypes__default['default'].bool
+  selectProps: PropTypes__default["default"].shape({
+    isDisabled: PropTypes__default["default"].bool.isRequired,
+    isReadOnly: PropTypes__default["default"].bool
   }).isRequired,
-  innerProps: PropTypes__default['default'].object
+  innerProps: PropTypes__default["default"].object
 } : {};
+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); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$4(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
 
 var DropdownIndicator = function DropdownIndicator(props) {
-  return react.jsx(reactSelect.components.DropdownIndicator, props, react.jsx(icons.CaretDownIcon, {
-    color: props.isDisabled ? 'neutral60' : undefined,
-    size: "small"
+  return 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';
 DropdownIndicator.propTypes = process.env.NODE_ENV !== "production" ? {
-  isDisabled: PropTypes__default['default'].bool
+  isDisabled: PropTypes__default["default"].bool
 } : {};
+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); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$3(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
 
 var SearchIconDropdownIndicator = function SearchIconDropdownIndicator(props) {
-  return react.jsx(reactSelect.components.DropdownIndicator, props, react.jsx(icons.SearchIcon, {
-    color: 'neutral60',
-    size: "big"
+  return jsxRuntime.jsx(reactSelect.components.DropdownIndicator, _objectSpread$3(_objectSpread$3({}, props), {}, {
+    children: jsxRuntime.jsx(icons.SearchIcon, {
+      color: 'neutral60',
+      size: "big"
+    })
   }));
 };
 
 SearchIconDropdownIndicator.displayName = 'SearchIconDropdownIndicator';
+var SearchIconDropdownIndicator$1 = SearchIconDropdownIndicator;
+
+var _excluded = ["children"];
+
+function ownKeys$2(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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; }
 
-var _excluded$1 = ["children"];
+function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$2(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
 
 var getDefaultComponent = function getDefaultComponent(type) {
   if (type === 'singleValue') return reactSelect.components.SingleValue;
   if (type === 'placeholder') return reactSelect.components.Placeholder;
-  return React__default['default'].Fragment;
+  return react$1.Fragment;
 };
 
 var WrapperWithIcon = function WrapperWithIcon(_ref) {
   var children = _ref.children,
-      props = _objectWithoutProperties(_ref, _excluded$1);
+      props = _objectWithoutProperties(_ref, _excluded);
 
   var Component = getDefaultComponent(props.type);
-  return react.jsx(React__default['default'].Fragment, null, props.selectProps.iconLeft && /*#__PURE__*/React__default['default'].cloneElement(props.selectProps.iconLeft, {
-    size: 'big'
-  }), react.jsx("span", {
-    // react-select uses absolute positioning for the SingleValue/Placeholder
-    // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
-    // spacingsXs is the margin between the icon and value
-    css: /*#__PURE__*/react.css("margin-left:", designSystem.customProperties.spacingXl + designSystem.customProperties.spacingXs, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"))
-  }, react.jsx(Component, props, children)));
+  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [props.selectProps.iconLeft && /*#__PURE__*/react$1.cloneElement(props.selectProps.iconLeft, {
+      size: 'big'
+    }), jsxRuntime.jsx("span", {
+      // react-select uses absolute positioning for the SingleValue/Placeholder
+      // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
+      // spacingsXs is the margin between the icon and value
+      css: /*#__PURE__*/react.css("margin-left:", designSystem.customProperties.spacingXl + designSystem.customProperties.spacingXs, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLmpzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQXlCZ0IiLCJmaWxlIjoid3JhcHBlci13aXRoLWljb24uanMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBGcmFnbWVudCwgY2xvbmVFbGVtZW50IH0gZnJvbSAncmVhY3QnO1xuaW1wb3J0IFByb3BUeXBlcyBmcm9tICdwcm9wLXR5cGVzJztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGN1c3RvbVByb3BlcnRpZXMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7IGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMgfSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5jb25zdCBnZXREZWZhdWx0Q29tcG9uZW50ID0gKHR5cGUpID0+IHtcbiAgaWYgKHR5cGUgPT09ICdzaW5nbGVWYWx1ZScpIHJldHVybiBkZWZhdWx0Q29tcG9uZW50cy5TaW5nbGVWYWx1ZTtcbiAgaWYgKHR5cGUgPT09ICdwbGFjZWhvbGRlcicpIHJldHVybiBkZWZhdWx0Q29tcG9uZW50cy5QbGFjZWhvbGRlcjtcbiAgcmV0dXJuIEZyYWdtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gKHsgY2hpbGRyZW4sIC4uLnByb3BzIH0pID0+IHtcbiAgY29uc3QgQ29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudChwcm9wcy50eXBlKTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICB7cHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQgJiZcbiAgICAgICAgY2xvbmVFbGVtZW50KHByb3BzLnNlbGVjdFByb3BzLmljb25MZWZ0LCB7XG4gICAgICAgICAgc2l6ZTogJ2JpZycsXG4gICAgICAgIH0pfVxuICAgICAgPHNwYW5cbiAgICAgICAgLy8gcmVhY3Qtc2VsZWN0IHVzZXMgYWJzb2x1dGUgcG9zaXRpb25pbmcgZm9yIHRoZSBTaW5nbGVWYWx1ZS9QbGFjZWhvbGRlclxuICAgICAgICAvLyB0aGUgaWNvbiBoYXMgYSBmaXhlZCBzaXplIG9mIDI0cHggKD09IFNwYWNpbmdzWGwpLCB0aGVyZWZvcmUgd2UgY2FuIHVzZSBhIGZpeGVkIG1hcmdpblxuICAgICAgICAvLyBzcGFjaW5nc1hzIGlzIHRoZSBtYXJnaW4gYmV0d2VlbiB0aGUgaWNvbiBhbmQgdmFsdWVcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgbWFyZ2luLWxlZnQ6ICR7Y3VzdG9tUHJvcGVydGllcy5zcGFjaW5nWGwgK1xuICAgICAgICAgIGN1c3RvbVByb3BlcnRpZXMuc3BhY2luZ1hzfTtcbiAgICAgICAgYH1cbiAgICAgID5cbiAgICAgICAgPENvbXBvbmVudCB7Li4ucHJvcHN9PntjaGlsZHJlbn08L0NvbXBvbmVudD5cbiAgICAgIDwvc3Bhbj5cbiAgICA8Lz5cbiAgKTtcbn07XG5XcmFwcGVyV2l0aEljb24ucHJvcFR5cGVzID0ge1xuICBjaGlsZHJlbjogUHJvcFR5cGVzLm5vZGUsXG4gIHR5cGU6IFByb3BUeXBlcy5vbmVPZihbJ3NpbmdsZVZhbHVlJywgJ3BsYWNlaG9sZGVyJ10pLFxuICBzZWxlY3RQcm9wczogUHJvcFR5cGVzLnNoYXBlKHtcbiAgICBpY29uTGVmdDogUHJvcFR5cGVzLm5vZGUsXG4gIH0pLFxufTtcbldyYXBwZXJXaXRoSWNvbi5kaXNwbGF5TmFtZSA9ICdXcmFwcGVyV2l0aEljb24nO1xuXG5leHBvcnQgZGVmYXVsdCBXcmFwcGVyV2l0aEljb247XG5cbi8qIGVzbGludC1kaXNhYmxlIHJlYWN0L2Rpc3BsYXktbmFtZSAqL1xuY29uc3QgY3VzdG9tQ29tcG9uZW50cyA9IHtcbiAgU2luZ2xlVmFsdWU6IChwcm9wcykgPT4gPFdyYXBwZXJXaXRoSWNvbiB7Li4ucHJvcHN9IHR5cGU9XCJzaW5nbGVWYWx1ZVwiIC8+LFxuICBQbGFjZWhvbGRlcjogKHByb3BzKSA9PiA8V3JhcHBlcldpdGhJY29uIHsuLi5wcm9wc30gdHlwZT1cInBsYWNlaG9sZGVyXCIgLz4sXG59O1xuLyogZXNsaW50LWVuYWJsZSByZWFjdC9kaXNwbGF5LW5hbWUgKi9cblxuZXhwb3J0IHsgY3VzdG9tQ29tcG9uZW50cyB9O1xuIl19 */"),
+      children: jsxRuntime.jsx(Component, _objectSpread$2(_objectSpread$2({}, props), {}, {
+        children: children
+      }))
+    })]
+  });
 };
 
 WrapperWithIcon.propTypes = process.env.NODE_ENV !== "production" ? {
-  children: PropTypes__default['default'].node,
-  type: PropTypes__default['default'].oneOf(['singleValue', 'placeholder']),
-  selectProps: PropTypes__default['default'].shape({
-    iconLeft: PropTypes__default['default'].node
+  children: PropTypes__default["default"].node,
+  type: PropTypes__default["default"].oneOf(['singleValue', 'placeholder']),
+  selectProps: PropTypes__default["default"].shape({
+    iconLeft: PropTypes__default["default"].node
   })
 } : {};
 WrapperWithIcon.displayName = 'WrapperWithIcon';
+var WrapperWithIcon$1 = WrapperWithIcon;
 /* eslint-disable react/display-name */
 
 var customComponents = {
   SingleValue: function SingleValue(props) {
-    return react.jsx(WrapperWithIcon, _extends({}, props, {
+    return jsxRuntime.jsx(WrapperWithIcon, _objectSpread$2(_objectSpread$2({}, props), {}, {
       type: "singleValue"
     }));
   },
   Placeholder: function Placeholder(props) {
-    return react.jsx(WrapperWithIcon, _extends({}, props, {
+    return jsxRuntime.jsx(WrapperWithIcon, _objectSpread$2(_objectSpread$2({}, props), {}, {
       type: "placeholder"
     }));
   }
@@ -180,73 +215,94 @@ var SELECT_DROPDOWN_OPTION_TYPES = {
   MULTIPLE_PROPERTIES: 'multiple-properties'
 };
 
+function ownKeys$1(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context; _forEachInstanceProperty__default["default"](_context = ownKeys$1(Object(source), true)).call(_context, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context2; _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; }
 var MultiplePropertiesSelectInputOption = function MultiplePropertiesSelectInputOption(props) {
   var data = props.data;
   var noValueFallback = props.noValueFallback || NO_VALUE_FALLBACK;
-  return react.jsx(reactSelect.components.Option, props, react.jsx(Spacings__default['default'].Stack, {
-    scale: "xs"
-  }, react.jsx(Text__default['default'].Detail, {
-    isBold: true
-  }, data.label || noValueFallback), react.jsx(Text__default['default'].Detail, null, "Key: ", data.key || noValueFallback), react.jsx(Text__default['default'].Detail, null, "ID: ", data.id || noValueFallback)));
+  return jsxRuntime.jsx(reactSelect.components.Option, _objectSpread$1(_objectSpread$1({}, props), {}, {
+    children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+      scale: "xs",
+      children: [jsxRuntime.jsx(Text__default["default"].Detail, {
+        isBold: true,
+        children: data.label || noValueFallback
+      }), jsxRuntime.jsxs(Text__default["default"].Detail, {
+        children: ["Key: ", data.key || noValueFallback]
+      }), jsxRuntime.jsxs(Text__default["default"].Detail, {
+        children: ["ID: ", data.id || noValueFallback]
+      })]
+    })
+  }));
 };
 MultiplePropertiesSelectInputOption.displayName = 'MultiplePropertiesSelectInputOption';
 MultiplePropertiesSelectInputOption.propTypes = process.env.NODE_ENV !== "production" ? {
-  data: PropTypes__default['default'].shape({
-    label: PropTypes__default['default'].string,
-    key: PropTypes__default['default'].oneOfType([PropTypes__default['default'].string, PropTypes__default['default'].number]),
-    id: PropTypes__default['default'].oneOfType([PropTypes__default['default'].string, PropTypes__default['default'].number])
+  data: PropTypes__default["default"].shape({
+    label: PropTypes__default["default"].string,
+    key: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number]),
+    id: PropTypes__default["default"].oneOfType([PropTypes__default["default"].string, PropTypes__default["default"].number])
   }),
-  noValueFallback: PropTypes__default['default'].string
+  noValueFallback: PropTypes__default["default"].string
 } : {};
 var DoublePropertySelectInputOption = function DoublePropertySelectInputOption(props) {
   var data = props.data;
   var noValueFallback = props.noValueFallback || NO_VALUE_FALLBACK;
-  return react.jsx(reactSelect.components.Option, props, react.jsx(Spacings__default['default'].Stack, {
-    scale: "xs"
-  }, react.jsx(Text__default['default'].Detail, {
-    isBold: true
-  }, data.label || noValueFallback), react.jsx(Text__default['default'].Detail, null, "Key: ", data.key || noValueFallback)));
+  return jsxRuntime.jsx(reactSelect.components.Option, _objectSpread$1(_objectSpread$1({}, props), {}, {
+    children: jsxRuntime.jsxs(Spacings__default["default"].Stack, {
+      scale: "xs",
+      children: [jsxRuntime.jsx(Text__default["default"].Detail, {
+        isBold: true,
+        children: data.label || noValueFallback
+      }), jsxRuntime.jsxs(Text__default["default"].Detail, {
+        children: ["Key: ", data.key || noValueFallback]
+      })]
+    })
+  }));
 };
 DoublePropertySelectInputOption.displayName = 'DoublePropertySelectInputOption';
 DoublePropertySelectInputOption.propTypes = process.env.NODE_ENV !== "production" ? {
-  data: PropTypes__default['default'].shape({
-    label: PropTypes__default['default'].string,
-    key: PropTypes__default['default'].string
+  data: PropTypes__default["default"].shape({
+    label: PropTypes__default["default"].string,
+    key: PropTypes__default["default"].string
   }),
-  noValueFallback: PropTypes__default['default'].string
+  noValueFallback: PropTypes__default["default"].string
 } : {};
 var CustomSelectInputOption = function CustomSelectInputOption(props) {
   var noValueFallback = props.noValueFallback || NO_VALUE_FALLBACK;
 
   switch (props.optionType) {
     case SELECT_DROPDOWN_OPTION_TYPES.MULTIPLE_PROPERTIES:
-      return react.jsx(MultiplePropertiesSelectInputOption, _extends({}, props.optionInnerProps, {
+      return jsxRuntime.jsx(MultiplePropertiesSelectInputOption, _objectSpread$1(_objectSpread$1({}, props.optionInnerProps), {}, {
         noValueFallback: noValueFallback
       }));
 
     case SELECT_DROPDOWN_OPTION_TYPES.DOUBLE_PROPERTY:
-      return react.jsx(DoublePropertySelectInputOption, _extends({}, props.optionInnerProps, {
+      return jsxRuntime.jsx(DoublePropertySelectInputOption, _objectSpread$1(_objectSpread$1({}, props.optionInnerProps), {}, {
         noValueFallback: noValueFallback
       }));
 
     default:
-      return react.jsx(reactSelect.components.Option, props.optionInnerProps, react.jsx(Text__default['default'].Detail, null, props.optionInnerProps.data.label || noValueFallback));
+      return jsxRuntime.jsx(reactSelect.components.Option, _objectSpread$1(_objectSpread$1({}, props.optionInnerProps), {}, {
+        children: jsxRuntime.jsx(Text__default["default"].Detail, {
+          children: props.optionInnerProps.data.label || noValueFallback
+        })
+      }));
   }
 };
 CustomSelectInputOption.displayName = 'CustomSelectInputOption';
 CustomSelectInputOption.propTypes = process.env.NODE_ENV !== "production" ? {
-  optionType: PropTypes__default['default'].oneOf(_Object$values__default['default'](SELECT_DROPDOWN_OPTION_TYPES)),
-  noValueFallback: PropTypes__default['default'].string,
-  optionInnerProps: PropTypes__default['default'].shape({
-    data: PropTypes__default['default'].shape({
-      label: PropTypes__default['default'].string,
-      key: PropTypes__default['default'].string,
-      id: PropTypes__default['default'].string
+  optionType: PropTypes__default["default"].oneOf(_Object$values__default["default"](SELECT_DROPDOWN_OPTION_TYPES)),
+  noValueFallback: PropTypes__default["default"].string,
+  optionInnerProps: PropTypes__default["default"].shape({
+    data: PropTypes__default["default"].shape({
+      label: PropTypes__default["default"].string,
+      key: PropTypes__default["default"].string,
+      id: PropTypes__default["default"].string
     })
   }).isRequired
 } : {};
 
-var messages$1 = reactIntl.defineMessages({
+var messages = reactIntl.defineMessages({
   createLabel: {
     id: 'UIKit.CreatableSelectInput.createLabel',
     description: 'Text of dropdown when creating option',
@@ -274,9 +330,9 @@ var messages$1 = 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); if (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 ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["default"](object); if (_Object$getOwnPropertySymbols__default["default"]) { var symbols = _Object$getOwnPropertySymbols__default["default"](object); if (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 source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { var _context8; _forEachInstanceProperty__default['default'](_context8 = ownKeys(Object(source), true)).call(_context8, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default['default']) { _Object$defineProperties__default['default'](target, _Object$getOwnPropertyDescriptors__default['default'](source)); } else { var _context9; _forEachInstanceProperty__default['default'](_context9 = ownKeys(Object(source))).call(_context9, function (key) { _Object$defineProperty__default['default'](target, key, _Object$getOwnPropertyDescriptor__default['default'](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) { var _context8; _forEachInstanceProperty__default["default"](_context8 = ownKeys(Object(source), true)).call(_context8, function (key) { _defineProperty(target, key, source[key]); }); } else if (_Object$getOwnPropertyDescriptors__default["default"]) { _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)); } else { var _context9; _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(source))).call(_context9, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } } return target; }
 
 var controlStyles = function controlStyles(props, theme) {
   return function (base, state) {
@@ -303,7 +359,7 @@ var controlStyles = function controlStyles(props, theme) {
         return 'pointer';
       }(),
       padding: "0 ".concat(overwrittenVars.spacingS),
-      transition: _concatInstanceProperty__default['default'](_context = "border-color ".concat(overwrittenVars.transitionStandard, ",\n    box-shadow ")).call(_context, overwrittenVars.transitionStandard),
+      transition: _concatInstanceProperty__default["default"](_context = "border-color ".concat(overwrittenVars.transitionStandard, ",\n    box-shadow ")).call(_context, overwrittenVars.transitionStandard),
       outline: 0,
       boxShadow: 'none',
       '&:focus-within': {
@@ -404,7 +460,7 @@ var optionStyles = function optionStyles(props, theme) {
     var overwrittenVars = _objectSpread(_objectSpread({}, designSystem.customProperties), theme);
 
     return _objectSpread(_objectSpread({}, base), {}, {
-      transition: _concatInstanceProperty__default['default'](_context2 = _concatInstanceProperty__default['default'](_context3 = "border-color ".concat(overwrittenVars.transitionStandard, ",\n      background-color ")).call(_context3, overwrittenVars.transitionStandard, ",\n      color ")).call(_context2, overwrittenVars.transitionStandard),
+      transition: _concatInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](_context3 = "border-color ".concat(overwrittenVars.transitionStandard, ",\n      background-color ")).call(_context3, overwrittenVars.transitionStandard, ",\n      color ")).call(_context2, overwrittenVars.transitionStandard),
       paddingLeft: overwrittenVars.spacingS,
       paddingRight: overwrittenVars.spacingS,
       color: function () {
@@ -501,7 +557,7 @@ var groupHeadingStyles = function groupHeadingStyles(props, theme) {
       textTransform: 'none',
       fontWeight: 'bold',
       margin: "0 ".concat(overwrittenVars.spacingXs),
-      padding: _concatInstanceProperty__default['default'](_context4 = "".concat(overwrittenVars.spacingS, " ")).call(_context4, overwrittenVars.spacingXs),
+      padding: _concatInstanceProperty__default["default"](_context4 = "".concat(overwrittenVars.spacingS, " ")).call(_context4, overwrittenVars.spacingXs),
       '&:empty': {
         padding: 0
       }
@@ -566,8 +622,8 @@ var multiValueLabelStyles = function multiValueLabelStyles(props, theme) {
         if (props.isReadOnly) return overwrittenVars[designSystem.designTokens.fontColorForInputWhenReadonly];
         return base.color;
       }(),
-      padding: _concatInstanceProperty__default['default'](_context5 = "".concat(overwrittenVars.spacingXs, " ")).call(_context5, overwrittenVars.spacingS),
-      borderRadius: _concatInstanceProperty__default['default'](_context6 = "".concat(overwrittenVars.borderRadiusForTag, " 0 0 ")).call(_context6, overwrittenVars.borderRadiusForTag),
+      padding: _concatInstanceProperty__default["default"](_context5 = "".concat(overwrittenVars.spacingXs, " ")).call(_context5, overwrittenVars.spacingS),
+      borderRadius: _concatInstanceProperty__default["default"](_context6 = "".concat(overwrittenVars.borderRadiusForTag, " 0 0 ")).call(_context6, overwrittenVars.borderRadiusForTag),
       border: "1px ".concat(overwrittenVars[designSystem.designTokens.borderColorForTag], " solid"),
       borderWidth: '1px 0 1px 1px',
       '&:last-child': {
@@ -587,7 +643,7 @@ var multiValueRemoveStyles = function multiValueRemoveStyles(props, theme) {
     return _objectSpread(_objectSpread({}, base), {}, {
       borderColor: overwrittenVars[designSystem.designTokens.borderColorForTag],
       padding: "0 ".concat(overwrittenVars.spacingXs),
-      borderRadius: _concatInstanceProperty__default['default'](_context7 = "0 ".concat(overwrittenVars[designSystem.designTokens.borderRadiusForTag], " ")).call(_context7, overwrittenVars[designSystem.designTokens.borderRadiusForTag], " 0"),
+      borderRadius: _concatInstanceProperty__default["default"](_context7 = "0 ".concat(overwrittenVars[designSystem.designTokens.borderRadiusForTag], " ")).call(_context7, overwrittenVars[designSystem.designTokens.borderRadiusForTag], " 0"),
       borderStyle: 'solid',
       borderWidth: '1px',
       pointerEvents: state.isDisabled || props.isReadOnly ? 'none' : base.pointerEvents,
@@ -612,13 +668,13 @@ function createSelectStyles(props, theme) {
     menu: menuStyles(props, theme),
     indicatorSeparator: indicatorSeparatorStyles(props, theme),
     dropdownIndicator: dropdownIndicatorStyles(props, theme),
-    clearIndicator: clearIndicatorStyles(),
+    clearIndicator: clearIndicatorStyles(props, theme),
     menuList: menuListStyles(props, theme),
-    menuPortal: menuPortalStyles(props),
+    menuPortal: menuPortalStyles(props, theme),
     multiValue: multiValueStyles(props, theme),
     multiValueLabel: multiValueLabelStyles(props, theme),
     multiValueRemove: multiValueRemoveStyles(props, theme),
-    indicatorsContainer: indicatorsContainerStyles(),
+    indicatorsContainer: indicatorsContainerStyles(props, theme),
     option: optionStyles(props, theme),
     placeholder: placeholderStyles(props, theme),
     valueContainer: valueContainerStyles(props, theme),
@@ -629,19 +685,19 @@ function createSelectStyles(props, theme) {
   };
 }
 
-// NOTE: This string will be replaced in the `prepare` script by the `scripts/version.js` file.
-var version = '12.2.1';
+// NOTE: This string will be replaced on build time with the package version.
+var version = "12.2.5";
 
-exports.ClearIndicator = ClearIndicator;
+exports.ClearIndicator = ClearIndicator$1;
 exports.CustomSelectInputOption = CustomSelectInputOption;
 exports.DoublePropertySelectInputOption = DoublePropertySelectInputOption;
-exports.DropdownIndicator = DropdownIndicator;
+exports.DropdownIndicator = DropdownIndicator$1;
 exports.MultiplePropertiesSelectInputOption = MultiplePropertiesSelectInputOption;
 exports.SELECT_DROPDOWN_OPTION_TYPES = SELECT_DROPDOWN_OPTION_TYPES;
-exports.SearchIconDropdownIndicator = SearchIconDropdownIndicator;
-exports.TagRemove = TagRemove;
-exports.ValueWrapperWithIcon = WrapperWithIcon;
+exports.SearchIconDropdownIndicator = SearchIconDropdownIndicator$1;
+exports.TagRemove = TagRemove$1;
+exports.ValueWrapperWithIcon = WrapperWithIcon$1;
 exports.createSelectStyles = createSelectStyles;
 exports.customComponentsWithIcons = customComponents;
-exports.messages = messages$1;
+exports.messages = messages;
 exports.version = version;