@commercetools-uikit/select-utils 14.0.0 → 15.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -21,7 +21,6 @@ var jsxRuntime = require('@emotion/react/jsx-runtime');
21
21
  var omit = require('lodash/omit');
22
22
  var AccessibleButton = require('@commercetools-uikit/accessible-button');
23
23
  var reactSelect = require('react-select');
24
- var _pt = require('prop-types');
25
24
  var react$1 = require('react');
26
25
  var Spacings = require('@commercetools-uikit/spacings');
27
26
  var Text = require('@commercetools-uikit/text');
@@ -39,7 +38,6 @@ var _Object$defineProperty__default = /*#__PURE__*/_interopDefault(_Object$defin
39
38
  var _concatInstanceProperty__default = /*#__PURE__*/_interopDefault(_concatInstanceProperty);
40
39
  var omit__default = /*#__PURE__*/_interopDefault(omit);
41
40
  var AccessibleButton__default = /*#__PURE__*/_interopDefault(AccessibleButton);
42
- var _pt__default = /*#__PURE__*/_interopDefault(_pt);
43
41
  var Spacings__default = /*#__PURE__*/_interopDefault(Spacings);
44
42
  var Text__default = /*#__PURE__*/_interopDefault(Text);
45
43
 
@@ -144,11 +142,16 @@ function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) {
144
142
  var getDefaultComponent = function getDefaultComponent(type) {
145
143
  if (type === 'singleValue') return reactSelect.components.SingleValue;
146
144
  if (type === 'placeholder') return reactSelect.components.Placeholder;
147
- return react$1.Fragment;
145
+ return null;
148
146
  };
149
147
 
150
148
  var WrapperWithIcon = function WrapperWithIcon(props) {
151
- var Component = getDefaultComponent(props.type);
149
+ var DefaultComponent = getDefaultComponent(props.type);
150
+
151
+ if (!DefaultComponent) {
152
+ return null;
153
+ }
154
+
152
155
  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
153
156
  children: [props.selectProps.iconLeft && /*#__PURE__*/react$1.cloneElement(props.selectProps.iconLeft, {
154
157
  size: 'big'
@@ -156,24 +159,14 @@ var WrapperWithIcon = function WrapperWithIcon(props) {
156
159
  // react-select uses absolute positioning for the SingleValue/Placeholder
157
160
  // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
158
161
  // spacingsXs is the margin between the icon and value
159
- 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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQ2dCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZyYWdtZW50LCBjbG9uZUVsZW1lbnQsIFJlYWN0RWxlbWVudCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGN1c3RvbVByb3BlcnRpZXMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIFNpbmdsZVZhbHVlUHJvcHMsXG4gIFBsYWNlaG9sZGVyUHJvcHMsXG59IGZyb20gJ3JlYWN0LXNlbGVjdCc7XG5cbmV4cG9ydCB0eXBlIFRXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogc3RyaW5nO1xuICBzZWxlY3RQcm9wczogVFNlbGVjdFByb3BzO1xufSAmIFNpbmdsZVZhbHVlUHJvcHMgJlxuICBQbGFjZWhvbGRlclByb3BzO1xuXG5jb25zdCBnZXREZWZhdWx0Q29tcG9uZW50ID0gKHR5cGU6IFRXcmFwcGVyV2l0aEljb25Qcm9wc1sndHlwZSddKSA9PiB7XG4gIGlmICh0eXBlID09PSAnc2luZ2xlVmFsdWUnKSByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuU2luZ2xlVmFsdWU7XG4gIGlmICh0eXBlID09PSAncGxhY2Vob2xkZXInKSByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuUGxhY2Vob2xkZXI7XG4gIHJldHVybiBGcmFnbWVudDtcbn07XG5cbnR5cGUgVFNlbGVjdFByb3BzID0ge1xuICBpY29uTGVmdDogUmVhY3RFbGVtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHMpID0+IHtcbiAgY29uc3QgQ29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudChwcm9wcy50eXBlKTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICB7cHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQgJiZcbiAgICAgICAgY2xvbmVFbGVtZW50KHByb3BzLnNlbGVjdFByb3BzLmljb25MZWZ0LCB7XG4gICAgICAgICAgc2l6ZTogJ2JpZycsXG4gICAgICAgIH0pfVxuICAgICAgPHNwYW5cbiAgICAgICAgLy8gcmVhY3Qtc2VsZWN0IHVzZXMgYWJzb2x1dGUgcG9zaXRpb25pbmcgZm9yIHRoZSBTaW5nbGVWYWx1ZS9QbGFjZWhvbGRlclxuICAgICAgICAvLyB0aGUgaWNvbiBoYXMgYSBmaXhlZCBzaXplIG9mIDI0cHggKD09IFNwYWNpbmdzWGwpLCB0aGVyZWZvcmUgd2UgY2FuIHVzZSBhIGZpeGVkIG1hcmdpblxuICAgICAgICAvLyBzcGFjaW5nc1hzIGlzIHRoZSBtYXJnaW4gYmV0d2VlbiB0aGUgaWNvbiBhbmQgdmFsdWVcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgbWFyZ2luLWxlZnQ6ICR7Y3VzdG9tUHJvcGVydGllcy5zcGFjaW5nWGwgK1xuICAgICAgICAgIGN1c3RvbVByb3BlcnRpZXMuc3BhY2luZ1hzfTtcbiAgICAgICAgYH1cbiAgICAgID5cbiAgICAgICAgPENvbXBvbmVudCB7Li4ucHJvcHN9Pntwcm9wcy5jaGlsZHJlbn08L0NvbXBvbmVudD5cbiAgICAgIDwvc3Bhbj5cbiAgICA8Lz5cbiAgKTtcbn07XG5cbldyYXBwZXJXaXRoSWNvbi5kaXNwbGF5TmFtZSA9ICdXcmFwcGVyV2l0aEljb24nO1xuXG5leHBvcnQgZGVmYXVsdCBXcmFwcGVyV2l0aEljb247XG5cbi8qIGVzbGludC1kaXNhYmxlIHJlYWN0L2Rpc3BsYXktbmFtZSAqL1xuY29uc3QgY3VzdG9tQ29tcG9uZW50cyA9IHtcbiAgU2luZ2xlVmFsdWU6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzKSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbiB7Li4ucHJvcHN9IHR5cGU9XCJzaW5nbGVWYWx1ZVwiIC8+XG4gICksXG4gIFBsYWNlaG9sZGVyOiAocHJvcHM6IFRXcmFwcGVyV2l0aEljb25Qcm9wcykgPT4gKFxuICAgIDxXcmFwcGVyV2l0aEljb24gey4uLnByb3BzfSB0eXBlPVwicGxhY2Vob2xkZXJcIiAvPlxuICApLFxufTtcbi8qIGVzbGludC1lbmFibGUgcmVhY3QvZGlzcGxheS1uYW1lICovXG5cbmV4cG9ydCB7IGN1c3RvbUNvbXBvbmVudHMgfTtcbiJdfQ== */"),
160
- children: jsxRuntime.jsx(Component, _objectSpread$2(_objectSpread$2({}, props), {}, {
161
- children: props.children
162
- }))
162
+ 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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRWdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBjdXN0b21Qcm9wZXJ0aWVzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQge1xuICBjb21wb25lbnRzIGFzIGRlZmF1bHRDb21wb25lbnRzLFxuICB0eXBlIFNpbmdsZVZhbHVlUHJvcHMsXG4gIHR5cGUgUGxhY2Vob2xkZXJQcm9wcyxcbn0gZnJvbSAncmVhY3Qtc2VsZWN0JztcblxuZXhwb3J0IHR5cGUgVFNpbmdsZVZhbHVlV3JhcHBlcldpdGhJY29uUHJvcHMgPSB7XG4gIHR5cGU6ICdzaW5nbGVWYWx1ZSc7XG4gIHNlbGVjdFByb3BzPzogVFNlbGVjdFByb3BzO1xufSAmIFNpbmdsZVZhbHVlUHJvcHM7XG5leHBvcnQgdHlwZSBUUGxhY2Vob2xkZXJXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogJ3BsYWNlaG9sZGVyJztcbiAgc2VsZWN0UHJvcHM/OiBUU2VsZWN0UHJvcHM7XG59ICYgUGxhY2Vob2xkZXJQcm9wcztcbmV4cG9ydCB0eXBlIFRXcmFwcGVyV2l0aEljb25Qcm9wczxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+ID1cbiAgVHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZSdcbiAgICA/IFRTaW5nbGVWYWx1ZVdyYXBwZXJXaXRoSWNvblByb3BzXG4gICAgOiBUeXBlIGV4dGVuZHMgJ3BsYWNlaG9sZGVyJ1xuICAgID8gVFBsYWNlaG9sZGVyV3JhcHBlcldpdGhJY29uUHJvcHNcbiAgICA6IG5ldmVyO1xuZXhwb3J0IHR5cGUgVERlZmF1bHRDb21wb25lbnQ8VHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZScgfCAncGxhY2Vob2xkZXInPiA9IChcbiAgcHJvcHM6IFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnXG4gICAgPyBTaW5nbGVWYWx1ZVByb3BzXG4gICAgOiBUeXBlIGV4dGVuZHMgJ3BsYWNlaG9sZGVyJ1xuICAgID8gUGxhY2Vob2xkZXJQcm9wc1xuICAgIDogbmV2ZXJcbikgPT4gSlNYLkVsZW1lbnQ7XG5cbmNvbnN0IGdldERlZmF1bHRDb21wb25lbnQgPSA8VHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZScgfCAncGxhY2Vob2xkZXInPihcbiAgdHlwZTogVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGU+Wyd0eXBlJ11cbik6IFREZWZhdWx0Q29tcG9uZW50PFR5cGU+IHwgbnVsbCA9PiB7XG4gIGlmICh0eXBlID09PSAnc2luZ2xlVmFsdWUnKVxuICAgIHJldHVybiBkZWZhdWx0Q29tcG9uZW50cy5TaW5nbGVWYWx1ZSBhcyBURGVmYXVsdENvbXBvbmVudDxUeXBlPjtcbiAgaWYgKHR5cGUgPT09ICdwbGFjZWhvbGRlcicpXG4gICAgcmV0dXJuIGRlZmF1bHRDb21wb25lbnRzLlBsYWNlaG9sZGVyIGFzIFREZWZhdWx0Q29tcG9uZW50PFR5cGU+O1xuICByZXR1cm4gbnVsbDtcbn07XG5cbnR5cGUgVFNlbGVjdFByb3BzID0ge1xuICBpY29uTGVmdD86IFJlYWN0RWxlbWVudDtcbn07XG5cbmNvbnN0IFdyYXBwZXJXaXRoSWNvbiA9IDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+KFxuICBwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGU+XG4pID0+IHtcbiAgY29uc3QgRGVmYXVsdENvbXBvbmVudCA9IGdldERlZmF1bHRDb21wb25lbnQ8VHlwZT4ocHJvcHMudHlwZSk7XG5cbiAgaWYgKCFEZWZhdWx0Q29tcG9uZW50KSB7XG4gICAgcmV0dXJuIG51bGw7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICB7cHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQgJiZcbiAgICAgICAgY2xvbmVFbGVtZW50KHByb3BzLnNlbGVjdFByb3BzLmljb25MZWZ0LCB7XG4gICAgICAgICAgc2l6ZTogJ2JpZycsXG4gICAgICAgIH0pfVxuICAgICAgPHNwYW5cbiAgICAgICAgLy8gcmVhY3Qtc2VsZWN0IHVzZXMgYWJzb2x1dGUgcG9zaXRpb25pbmcgZm9yIHRoZSBTaW5nbGVWYWx1ZS9QbGFjZWhvbGRlclxuICAgICAgICAvLyB0aGUgaWNvbiBoYXMgYSBmaXhlZCBzaXplIG9mIDI0cHggKD09IFNwYWNpbmdzWGwpLCB0aGVyZWZvcmUgd2UgY2FuIHVzZSBhIGZpeGVkIG1hcmdpblxuICAgICAgICAvLyBzcGFjaW5nc1hzIGlzIHRoZSBtYXJnaW4gYmV0d2VlbiB0aGUgaWNvbiBhbmQgdmFsdWVcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgbWFyZ2luLWxlZnQ6ICR7Y3VzdG9tUHJvcGVydGllcy5zcGFjaW5nWGwgK1xuICAgICAgICAgIGN1c3RvbVByb3BlcnRpZXMuc3BhY2luZ1hzfTtcbiAgICAgICAgYH1cbiAgICAgID5cbiAgICAgICAgey8qIEB0cy1pZ25vcmUgKi99XG4gICAgICAgIDxEZWZhdWx0Q29tcG9uZW50IHsuLi5wcm9wc30gLz5cbiAgICAgIDwvc3Bhbj5cbiAgICA8Lz5cbiAgKTtcbn07XG5cbldyYXBwZXJXaXRoSWNvbi5kaXNwbGF5TmFtZSA9ICdXcmFwcGVyV2l0aEljb24nO1xuXG5leHBvcnQgZGVmYXVsdCBXcmFwcGVyV2l0aEljb247XG5cbmNvbnN0IGN1c3RvbUNvbXBvbmVudHMgPSB7XG4gIFNpbmdsZVZhbHVlOiAocHJvcHM6IFRXcmFwcGVyV2l0aEljb25Qcm9wczwnc2luZ2xlVmFsdWUnPikgPT4gKFxuICAgIDxXcmFwcGVyV2l0aEljb248J3NpbmdsZVZhbHVlJz4gey4uLnByb3BzfSB0eXBlPVwic2luZ2xlVmFsdWVcIiAvPlxuICApLFxuICBQbGFjZWhvbGRlcjogKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8J3BsYWNlaG9sZGVyJz4pID0+IChcbiAgICA8V3JhcHBlcldpdGhJY29uPCdwbGFjZWhvbGRlcic+IHsuLi5wcm9wc30gdHlwZT1cInBsYWNlaG9sZGVyXCIgLz5cbiAgKSxcbn07XG5cbmV4cG9ydCB7IGN1c3RvbUNvbXBvbmVudHMgfTtcbiJdfQ== */"),
163
+ children: jsxRuntime.jsx(DefaultComponent, _objectSpread$2({}, props))
163
164
  })]
164
165
  });
165
166
  };
166
167
 
167
- WrapperWithIcon.propTypes = process.env.NODE_ENV !== "production" ? {
168
- type: _pt__default["default"].string.isRequired,
169
- selectProps: _pt__default["default"].shape({
170
- iconLeft: _pt__default["default"].element.isRequired
171
- }).isRequired
172
- } : {};
173
168
  WrapperWithIcon.displayName = 'WrapperWithIcon';
174
169
  var WrapperWithIcon$1 = WrapperWithIcon;
175
- /* eslint-disable react/display-name */
176
-
177
170
  var customComponents = {
178
171
  SingleValue: function SingleValue(props) {
179
172
  return jsxRuntime.jsx(WrapperWithIcon, _objectSpread$2(_objectSpread$2({}, props), {}, {
@@ -645,7 +638,7 @@ function createSelectStyles(props, theme) {
645
638
  }
646
639
 
647
640
  // NOTE: This string will be replaced on build time with the package version.
648
- var version = "14.0.0";
641
+ var version = "15.0.0";
649
642
 
650
643
  exports.ClearIndicator = ClearIndicator$1;
651
644
  exports.CustomSelectInputOption = CustomSelectInputOption;
@@ -21,7 +21,6 @@ var jsxRuntime = require('@emotion/react/jsx-runtime');
21
21
  var omit = require('lodash/omit');
22
22
  var AccessibleButton = require('@commercetools-uikit/accessible-button');
23
23
  var reactSelect = require('react-select');
24
- require('prop-types');
25
24
  var react$1 = require('react');
26
25
  var Spacings = require('@commercetools-uikit/spacings');
27
26
  var Text = require('@commercetools-uikit/text');
@@ -143,11 +142,16 @@ function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) {
143
142
  var getDefaultComponent = function getDefaultComponent(type) {
144
143
  if (type === 'singleValue') return reactSelect.components.SingleValue;
145
144
  if (type === 'placeholder') return reactSelect.components.Placeholder;
146
- return react$1.Fragment;
145
+ return null;
147
146
  };
148
147
 
149
148
  var WrapperWithIcon = function WrapperWithIcon(props) {
150
- var Component = getDefaultComponent(props.type);
149
+ var DefaultComponent = getDefaultComponent(props.type);
150
+
151
+ if (!DefaultComponent) {
152
+ return null;
153
+ }
154
+
151
155
  return jsxRuntime.jsxs(jsxRuntime.Fragment, {
152
156
  children: [props.selectProps.iconLeft && /*#__PURE__*/react$1.cloneElement(props.selectProps.iconLeft, {
153
157
  size: 'big'
@@ -156,18 +160,13 @@ var WrapperWithIcon = function WrapperWithIcon(props) {
156
160
  // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
157
161
  // spacingsXs is the margin between the icon and value
158
162
  css: /*#__PURE__*/react.css("margin-left:", designSystem.customProperties.spacingXl + designSystem.customProperties.spacingXs, ";" + ("" ), "" ),
159
- children: jsxRuntime.jsx(Component, _objectSpread$2(_objectSpread$2({}, props), {}, {
160
- children: props.children
161
- }))
163
+ children: jsxRuntime.jsx(DefaultComponent, _objectSpread$2({}, props))
162
164
  })]
163
165
  });
164
166
  };
165
167
 
166
- WrapperWithIcon.propTypes = {};
167
168
  WrapperWithIcon.displayName = 'WrapperWithIcon';
168
169
  var WrapperWithIcon$1 = WrapperWithIcon;
169
- /* eslint-disable react/display-name */
170
-
171
170
  var customComponents = {
172
171
  SingleValue: function SingleValue(props) {
173
172
  return jsxRuntime.jsx(WrapperWithIcon, _objectSpread$2(_objectSpread$2({}, props), {}, {
@@ -639,7 +638,7 @@ function createSelectStyles(props, theme) {
639
638
  }
640
639
 
641
640
  // NOTE: This string will be replaced on build time with the package version.
642
- var version = "14.0.0";
641
+ var version = "15.0.0";
643
642
 
644
643
  exports.ClearIndicator = ClearIndicator$1;
645
644
  exports.CustomSelectInputOption = CustomSelectInputOption;
@@ -17,8 +17,7 @@ import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
17
17
  import omit from 'lodash/omit';
18
18
  import AccessibleButton from '@commercetools-uikit/accessible-button';
19
19
  import { components } from 'react-select';
20
- import _pt from 'prop-types';
21
- import { cloneElement, Fragment as Fragment$1 } from 'react';
20
+ import { cloneElement } from 'react';
22
21
  import Spacings from '@commercetools-uikit/spacings';
23
22
  import Text from '@commercetools-uikit/text';
24
23
 
@@ -123,11 +122,16 @@ function _objectSpread$2(target) { for (var i = 1; i < arguments.length; i++) {
123
122
  var getDefaultComponent = function getDefaultComponent(type) {
124
123
  if (type === 'singleValue') return components.SingleValue;
125
124
  if (type === 'placeholder') return components.Placeholder;
126
- return Fragment$1;
125
+ return null;
127
126
  };
128
127
 
129
128
  var WrapperWithIcon = function WrapperWithIcon(props) {
130
- var Component = getDefaultComponent(props.type);
129
+ var DefaultComponent = getDefaultComponent(props.type);
130
+
131
+ if (!DefaultComponent) {
132
+ return null;
133
+ }
134
+
131
135
  return jsxs(Fragment, {
132
136
  children: [props.selectProps.iconLeft && /*#__PURE__*/cloneElement(props.selectProps.iconLeft, {
133
137
  size: 'big'
@@ -135,24 +139,14 @@ var WrapperWithIcon = function WrapperWithIcon(props) {
135
139
  // react-select uses absolute positioning for the SingleValue/Placeholder
136
140
  // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
137
141
  // spacingsXs is the margin between the icon and value
138
- css: /*#__PURE__*/css("margin-left:", customProperties.spacingXl + customProperties.spacingXs, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFzQ2dCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEZyYWdtZW50LCBjbG9uZUVsZW1lbnQsIFJlYWN0RWxlbWVudCB9IGZyb20gJ3JlYWN0JztcbmltcG9ydCB7IGNzcyB9IGZyb20gJ0BlbW90aW9uL3JlYWN0JztcbmltcG9ydCB7IGN1c3RvbVByb3BlcnRpZXMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIFNpbmdsZVZhbHVlUHJvcHMsXG4gIFBsYWNlaG9sZGVyUHJvcHMsXG59IGZyb20gJ3JlYWN0LXNlbGVjdCc7XG5cbmV4cG9ydCB0eXBlIFRXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogc3RyaW5nO1xuICBzZWxlY3RQcm9wczogVFNlbGVjdFByb3BzO1xufSAmIFNpbmdsZVZhbHVlUHJvcHMgJlxuICBQbGFjZWhvbGRlclByb3BzO1xuXG5jb25zdCBnZXREZWZhdWx0Q29tcG9uZW50ID0gKHR5cGU6IFRXcmFwcGVyV2l0aEljb25Qcm9wc1sndHlwZSddKSA9PiB7XG4gIGlmICh0eXBlID09PSAnc2luZ2xlVmFsdWUnKSByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuU2luZ2xlVmFsdWU7XG4gIGlmICh0eXBlID09PSAncGxhY2Vob2xkZXInKSByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuUGxhY2Vob2xkZXI7XG4gIHJldHVybiBGcmFnbWVudDtcbn07XG5cbnR5cGUgVFNlbGVjdFByb3BzID0ge1xuICBpY29uTGVmdDogUmVhY3RFbGVtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHMpID0+IHtcbiAgY29uc3QgQ29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudChwcm9wcy50eXBlKTtcblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICB7cHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQgJiZcbiAgICAgICAgY2xvbmVFbGVtZW50KHByb3BzLnNlbGVjdFByb3BzLmljb25MZWZ0LCB7XG4gICAgICAgICAgc2l6ZTogJ2JpZycsXG4gICAgICAgIH0pfVxuICAgICAgPHNwYW5cbiAgICAgICAgLy8gcmVhY3Qtc2VsZWN0IHVzZXMgYWJzb2x1dGUgcG9zaXRpb25pbmcgZm9yIHRoZSBTaW5nbGVWYWx1ZS9QbGFjZWhvbGRlclxuICAgICAgICAvLyB0aGUgaWNvbiBoYXMgYSBmaXhlZCBzaXplIG9mIDI0cHggKD09IFNwYWNpbmdzWGwpLCB0aGVyZWZvcmUgd2UgY2FuIHVzZSBhIGZpeGVkIG1hcmdpblxuICAgICAgICAvLyBzcGFjaW5nc1hzIGlzIHRoZSBtYXJnaW4gYmV0d2VlbiB0aGUgaWNvbiBhbmQgdmFsdWVcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgbWFyZ2luLWxlZnQ6ICR7Y3VzdG9tUHJvcGVydGllcy5zcGFjaW5nWGwgK1xuICAgICAgICAgIGN1c3RvbVByb3BlcnRpZXMuc3BhY2luZ1hzfTtcbiAgICAgICAgYH1cbiAgICAgID5cbiAgICAgICAgPENvbXBvbmVudCB7Li4ucHJvcHN9Pntwcm9wcy5jaGlsZHJlbn08L0NvbXBvbmVudD5cbiAgICAgIDwvc3Bhbj5cbiAgICA8Lz5cbiAgKTtcbn07XG5cbldyYXBwZXJXaXRoSWNvbi5kaXNwbGF5TmFtZSA9ICdXcmFwcGVyV2l0aEljb24nO1xuXG5leHBvcnQgZGVmYXVsdCBXcmFwcGVyV2l0aEljb247XG5cbi8qIGVzbGludC1kaXNhYmxlIHJlYWN0L2Rpc3BsYXktbmFtZSAqL1xuY29uc3QgY3VzdG9tQ29tcG9uZW50cyA9IHtcbiAgU2luZ2xlVmFsdWU6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzKSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbiB7Li4ucHJvcHN9IHR5cGU9XCJzaW5nbGVWYWx1ZVwiIC8+XG4gICksXG4gIFBsYWNlaG9sZGVyOiAocHJvcHM6IFRXcmFwcGVyV2l0aEljb25Qcm9wcykgPT4gKFxuICAgIDxXcmFwcGVyV2l0aEljb24gey4uLnByb3BzfSB0eXBlPVwicGxhY2Vob2xkZXJcIiAvPlxuICApLFxufTtcbi8qIGVzbGludC1lbmFibGUgcmVhY3QvZGlzcGxheS1uYW1lICovXG5cbmV4cG9ydCB7IGN1c3RvbUNvbXBvbmVudHMgfTtcbiJdfQ== */"),
139
- children: jsx(Component, _objectSpread$2(_objectSpread$2({}, props), {}, {
140
- children: props.children
141
- }))
142
+ css: /*#__PURE__*/css("margin-left:", customProperties.spacingXl + customProperties.spacingXs, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRWdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBjdXN0b21Qcm9wZXJ0aWVzIH0gZnJvbSAnQGNvbW1lcmNldG9vbHMtdWlraXQvZGVzaWduLXN5c3RlbSc7XG5pbXBvcnQge1xuICBjb21wb25lbnRzIGFzIGRlZmF1bHRDb21wb25lbnRzLFxuICB0eXBlIFNpbmdsZVZhbHVlUHJvcHMsXG4gIHR5cGUgUGxhY2Vob2xkZXJQcm9wcyxcbn0gZnJvbSAncmVhY3Qtc2VsZWN0JztcblxuZXhwb3J0IHR5cGUgVFNpbmdsZVZhbHVlV3JhcHBlcldpdGhJY29uUHJvcHMgPSB7XG4gIHR5cGU6ICdzaW5nbGVWYWx1ZSc7XG4gIHNlbGVjdFByb3BzPzogVFNlbGVjdFByb3BzO1xufSAmIFNpbmdsZVZhbHVlUHJvcHM7XG5leHBvcnQgdHlwZSBUUGxhY2Vob2xkZXJXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogJ3BsYWNlaG9sZGVyJztcbiAgc2VsZWN0UHJvcHM/OiBUU2VsZWN0UHJvcHM7XG59ICYgUGxhY2Vob2xkZXJQcm9wcztcbmV4cG9ydCB0eXBlIFRXcmFwcGVyV2l0aEljb25Qcm9wczxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+ID1cbiAgVHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZSdcbiAgICA/IFRTaW5nbGVWYWx1ZVdyYXBwZXJXaXRoSWNvblByb3BzXG4gICAgOiBUeXBlIGV4dGVuZHMgJ3BsYWNlaG9sZGVyJ1xuICAgID8gVFBsYWNlaG9sZGVyV3JhcHBlcldpdGhJY29uUHJvcHNcbiAgICA6IG5ldmVyO1xuZXhwb3J0IHR5cGUgVERlZmF1bHRDb21wb25lbnQ8VHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZScgfCAncGxhY2Vob2xkZXInPiA9IChcbiAgcHJvcHM6IFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnXG4gICAgPyBTaW5nbGVWYWx1ZVByb3BzXG4gICAgOiBUeXBlIGV4dGVuZHMgJ3BsYWNlaG9sZGVyJ1xuICAgID8gUGxhY2Vob2xkZXJQcm9wc1xuICAgIDogbmV2ZXJcbikgPT4gSlNYLkVsZW1lbnQ7XG5cbmNvbnN0IGdldERlZmF1bHRDb21wb25lbnQgPSA8VHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZScgfCAncGxhY2Vob2xkZXInPihcbiAgdHlwZTogVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGU+Wyd0eXBlJ11cbik6IFREZWZhdWx0Q29tcG9uZW50PFR5cGU+IHwgbnVsbCA9PiB7XG4gIGlmICh0eXBlID09PSAnc2luZ2xlVmFsdWUnKVxuICAgIHJldHVybiBkZWZhdWx0Q29tcG9uZW50cy5TaW5nbGVWYWx1ZSBhcyBURGVmYXVsdENvbXBvbmVudDxUeXBlPjtcbiAgaWYgKHR5cGUgPT09ICdwbGFjZWhvbGRlcicpXG4gICAgcmV0dXJuIGRlZmF1bHRDb21wb25lbnRzLlBsYWNlaG9sZGVyIGFzIFREZWZhdWx0Q29tcG9uZW50PFR5cGU+O1xuICByZXR1cm4gbnVsbDtcbn07XG5cbnR5cGUgVFNlbGVjdFByb3BzID0ge1xuICBpY29uTGVmdD86IFJlYWN0RWxlbWVudDtcbn07XG5cbmNvbnN0IFdyYXBwZXJXaXRoSWNvbiA9IDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+KFxuICBwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGU+XG4pID0+IHtcbiAgY29uc3QgRGVmYXVsdENvbXBvbmVudCA9IGdldERlZmF1bHRDb21wb25lbnQ8VHlwZT4ocHJvcHMudHlwZSk7XG5cbiAgaWYgKCFEZWZhdWx0Q29tcG9uZW50KSB7XG4gICAgcmV0dXJuIG51bGw7XG4gIH1cblxuICByZXR1cm4gKFxuICAgIDw+XG4gICAgICB7cHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQgJiZcbiAgICAgICAgY2xvbmVFbGVtZW50KHByb3BzLnNlbGVjdFByb3BzLmljb25MZWZ0LCB7XG4gICAgICAgICAgc2l6ZTogJ2JpZycsXG4gICAgICAgIH0pfVxuICAgICAgPHNwYW5cbiAgICAgICAgLy8gcmVhY3Qtc2VsZWN0IHVzZXMgYWJzb2x1dGUgcG9zaXRpb25pbmcgZm9yIHRoZSBTaW5nbGVWYWx1ZS9QbGFjZWhvbGRlclxuICAgICAgICAvLyB0aGUgaWNvbiBoYXMgYSBmaXhlZCBzaXplIG9mIDI0cHggKD09IFNwYWNpbmdzWGwpLCB0aGVyZWZvcmUgd2UgY2FuIHVzZSBhIGZpeGVkIG1hcmdpblxuICAgICAgICAvLyBzcGFjaW5nc1hzIGlzIHRoZSBtYXJnaW4gYmV0d2VlbiB0aGUgaWNvbiBhbmQgdmFsdWVcbiAgICAgICAgY3NzPXtjc3NgXG4gICAgICAgICAgbWFyZ2luLWxlZnQ6ICR7Y3VzdG9tUHJvcGVydGllcy5zcGFjaW5nWGwgK1xuICAgICAgICAgIGN1c3RvbVByb3BlcnRpZXMuc3BhY2luZ1hzfTtcbiAgICAgICAgYH1cbiAgICAgID5cbiAgICAgICAgey8qIEB0cy1pZ25vcmUgKi99XG4gICAgICAgIDxEZWZhdWx0Q29tcG9uZW50IHsuLi5wcm9wc30gLz5cbiAgICAgIDwvc3Bhbj5cbiAgICA8Lz5cbiAgKTtcbn07XG5cbldyYXBwZXJXaXRoSWNvbi5kaXNwbGF5TmFtZSA9ICdXcmFwcGVyV2l0aEljb24nO1xuXG5leHBvcnQgZGVmYXVsdCBXcmFwcGVyV2l0aEljb247XG5cbmNvbnN0IGN1c3RvbUNvbXBvbmVudHMgPSB7XG4gIFNpbmdsZVZhbHVlOiAocHJvcHM6IFRXcmFwcGVyV2l0aEljb25Qcm9wczwnc2luZ2xlVmFsdWUnPikgPT4gKFxuICAgIDxXcmFwcGVyV2l0aEljb248J3NpbmdsZVZhbHVlJz4gey4uLnByb3BzfSB0eXBlPVwic2luZ2xlVmFsdWVcIiAvPlxuICApLFxuICBQbGFjZWhvbGRlcjogKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8J3BsYWNlaG9sZGVyJz4pID0+IChcbiAgICA8V3JhcHBlcldpdGhJY29uPCdwbGFjZWhvbGRlcic+IHsuLi5wcm9wc30gdHlwZT1cInBsYWNlaG9sZGVyXCIgLz5cbiAgKSxcbn07XG5cbmV4cG9ydCB7IGN1c3RvbUNvbXBvbmVudHMgfTtcbiJdfQ== */"),
143
+ children: jsx(DefaultComponent, _objectSpread$2({}, props))
142
144
  })]
143
145
  });
144
146
  };
145
147
 
146
- WrapperWithIcon.propTypes = process.env.NODE_ENV !== "production" ? {
147
- type: _pt.string.isRequired,
148
- selectProps: _pt.shape({
149
- iconLeft: _pt.element.isRequired
150
- }).isRequired
151
- } : {};
152
148
  WrapperWithIcon.displayName = 'WrapperWithIcon';
153
149
  var WrapperWithIcon$1 = WrapperWithIcon;
154
- /* eslint-disable react/display-name */
155
-
156
150
  var customComponents = {
157
151
  SingleValue: function SingleValue(props) {
158
152
  return jsx(WrapperWithIcon, _objectSpread$2(_objectSpread$2({}, props), {}, {
@@ -624,6 +618,6 @@ function createSelectStyles(props, theme) {
624
618
  }
625
619
 
626
620
  // NOTE: This string will be replaced on build time with the package version.
627
- var version = "14.0.0";
621
+ var version = "15.0.0";
628
622
 
629
623
  export { ClearIndicator$1 as ClearIndicator, CustomSelectInputOption, DoublePropertySelectInputOption, DropdownIndicator$1 as DropdownIndicator, MultiplePropertiesSelectInputOption, SELECT_DROPDOWN_OPTION_TYPES, SearchIconDropdownIndicator$1 as SearchIconDropdownIndicator, TagRemove$1 as TagRemove, WrapperWithIcon$1 as ValueWrapperWithIcon, createSelectStyles, customComponents as customComponentsWithIcons, messages, version };
@@ -1,19 +1,25 @@
1
- import { ReactElement } from 'react';
2
- import { SingleValueProps, PlaceholderProps } from 'react-select';
3
- export declare type TWrapperWithIconProps = {
4
- type: string;
5
- selectProps: TSelectProps;
6
- } & SingleValueProps & PlaceholderProps;
1
+ import { type ReactElement } from 'react';
2
+ import { type SingleValueProps, type PlaceholderProps } from 'react-select';
3
+ export declare type TSingleValueWrapperWithIconProps = {
4
+ type: 'singleValue';
5
+ selectProps?: TSelectProps;
6
+ } & SingleValueProps;
7
+ export declare type TPlaceholderWrapperWithIconProps = {
8
+ type: 'placeholder';
9
+ selectProps?: TSelectProps;
10
+ } & PlaceholderProps;
11
+ export declare type TWrapperWithIconProps<Type extends 'singleValue' | 'placeholder'> = Type extends 'singleValue' ? TSingleValueWrapperWithIconProps : Type extends 'placeholder' ? TPlaceholderWrapperWithIconProps : never;
12
+ export declare type TDefaultComponent<Type extends 'singleValue' | 'placeholder'> = (props: Type extends 'singleValue' ? SingleValueProps : Type extends 'placeholder' ? PlaceholderProps : never) => JSX.Element;
7
13
  declare type TSelectProps = {
8
- iconLeft: ReactElement;
14
+ iconLeft?: ReactElement;
9
15
  };
10
16
  declare const WrapperWithIcon: {
11
- (props: TWrapperWithIconProps): import("@emotion/react/jsx-runtime").JSX.Element;
17
+ <Type extends "placeholder" | "singleValue">(props: TWrapperWithIconProps<Type>): import("@emotion/react/jsx-runtime").JSX.Element | null;
12
18
  displayName: string;
13
19
  };
14
20
  export default WrapperWithIcon;
15
21
  declare const customComponents: {
16
- SingleValue: (props: TWrapperWithIconProps) => import("@emotion/react/jsx-runtime").JSX.Element;
17
- Placeholder: (props: TWrapperWithIconProps) => import("@emotion/react/jsx-runtime").JSX.Element;
22
+ SingleValue: (props: TWrapperWithIconProps<'singleValue'>) => import("@emotion/react/jsx-runtime").JSX.Element;
23
+ Placeholder: (props: TWrapperWithIconProps<'placeholder'>) => import("@emotion/react/jsx-runtime").JSX.Element;
18
24
  };
19
25
  export { customComponents };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@commercetools-uikit/select-utils",
3
3
  "description": "Utilities for working with select components.",
4
- "version": "14.0.0",
4
+ "version": "15.0.0",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -21,17 +21,17 @@
21
21
  "dependencies": {
22
22
  "@babel/runtime": "^7.17.2",
23
23
  "@babel/runtime-corejs3": "^7.17.2",
24
- "@commercetools-uikit/accessible-button": "14.0.0",
25
- "@commercetools-uikit/design-system": "14.0.0",
26
- "@commercetools-uikit/icons": "14.0.0",
27
- "@commercetools-uikit/spacings": "14.0.0",
28
- "@commercetools-uikit/text": "14.0.0",
29
- "@commercetools-uikit/utils": "14.0.0",
24
+ "@commercetools-uikit/accessible-button": "15.0.0",
25
+ "@commercetools-uikit/design-system": "15.0.0",
26
+ "@commercetools-uikit/icons": "15.0.0",
27
+ "@commercetools-uikit/spacings": "15.0.0",
28
+ "@commercetools-uikit/text": "15.0.0",
29
+ "@commercetools-uikit/utils": "15.0.0",
30
30
  "@emotion/react": "^11.4.0",
31
31
  "@emotion/styled": "^11.3.0",
32
32
  "lodash": "4.17.21",
33
33
  "prop-types": "15.8.1",
34
- "react-select": "5.2.2"
34
+ "react-select": "5.3.0"
35
35
  },
36
36
  "devDependencies": {
37
37
  "react": "17.0.2",