@commercetools-uikit/select-utils 15.5.1 → 15.6.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.
Files changed (5) hide show
  1. package/dist/commercetools-uikit-select-utils.cjs.dev.js +12 -12
  2. package/dist/commercetools-uikit-select-utils.cjs.prod.js +12 -12
  3. package/dist/commercetools-uikit-select-utils.esm.js +12 -12
  4. package/dist/declarations/src/create-select-styles.d.ts +4 -4
  5. package/package.json +7 -7
package/dist/commercetools-uikit-select-utils.cjs.dev.js CHANGED
@@ -164,7 +164,7 @@ var WrapperWithIcon = function WrapperWithIcon(props) {
164
164
  // react-select uses absolute positioning for the SingleValue/Placeholder
165
165
  // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
166
166
  // spacingsXs is the margin between the icon and value
167
- css: /*#__PURE__*/react.css("margin-left:", designSystem.designTokens.spacingXl + designSystem.designTokens.spacingXs, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRWdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIHR5cGUgU2luZ2xlVmFsdWVQcm9wcyxcbiAgdHlwZSBQbGFjZWhvbGRlclByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5leHBvcnQgdHlwZSBUU2luZ2xlVmFsdWVXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogJ3NpbmdsZVZhbHVlJztcbiAgc2VsZWN0UHJvcHM/OiBUU2VsZWN0UHJvcHM7XG59ICYgU2luZ2xlVmFsdWVQcm9wcztcbmV4cG9ydCB0eXBlIFRQbGFjZWhvbGRlcldyYXBwZXJXaXRoSWNvblByb3BzID0ge1xuICB0eXBlOiAncGxhY2Vob2xkZXInO1xuICBzZWxlY3RQcm9wcz86IFRTZWxlY3RQcm9wcztcbn0gJiBQbGFjZWhvbGRlclByb3BzO1xuZXhwb3J0IHR5cGUgVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4gPVxuICBUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJ1xuICAgID8gVFNpbmdsZVZhbHVlV3JhcHBlcldpdGhJY29uUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBUUGxhY2Vob2xkZXJXcmFwcGVyV2l0aEljb25Qcm9wc1xuICAgIDogbmV2ZXI7XG5leHBvcnQgdHlwZSBURGVmYXVsdENvbXBvbmVudDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+ID0gKFxuICBwcm9wczogVHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZSdcbiAgICA/IFNpbmdsZVZhbHVlUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBQbGFjZWhvbGRlclByb3BzXG4gICAgOiBuZXZlclxuKSA9PiBKU1guRWxlbWVudDtcblxuY29uc3QgZ2V0RGVmYXVsdENvbXBvbmVudCA9IDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+KFxuICB0eXBlOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5bJ3R5cGUnXVxuKTogVERlZmF1bHRDb21wb25lbnQ8VHlwZT4gfCBudWxsID0+IHtcbiAgaWYgKHR5cGUgPT09ICdzaW5nbGVWYWx1ZScpXG4gICAgcmV0dXJuIGRlZmF1bHRDb21wb25lbnRzLlNpbmdsZVZhbHVlIGFzIFREZWZhdWx0Q29tcG9uZW50PFR5cGU+O1xuICBpZiAodHlwZSA9PT0gJ3BsYWNlaG9sZGVyJylcbiAgICByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuUGxhY2Vob2xkZXIgYXMgVERlZmF1bHRDb21wb25lbnQ8VHlwZT47XG4gIHJldHVybiBudWxsO1xufTtcblxudHlwZSBUU2VsZWN0UHJvcHMgPSB7XG4gIGljb25MZWZ0PzogUmVhY3RFbGVtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4oXG4gIHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5cbikgPT4ge1xuICBjb25zdCBEZWZhdWx0Q29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudDxUeXBlPihwcm9wcy50eXBlKTtcblxuICBpZiAoIURlZmF1bHRDb21wb25lbnQpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIHtwcm9wcy5zZWxlY3RQcm9wcy5pY29uTGVmdCAmJlxuICAgICAgICBjbG9uZUVsZW1lbnQocHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQsIHtcbiAgICAgICAgICBzaXplOiAnYmlnJyxcbiAgICAgICAgfSl9XG4gICAgICA8c3BhblxuICAgICAgICAvLyByZWFjdC1zZWxlY3QgdXNlcyBhYnNvbHV0ZSBwb3NpdGlvbmluZyBmb3IgdGhlIFNpbmdsZVZhbHVlL1BsYWNlaG9sZGVyXG4gICAgICAgIC8vIHRoZSBpY29uIGhhcyBhIGZpeGVkIHNpemUgb2YgMjRweCAoPT0gU3BhY2luZ3NYbCksIHRoZXJlZm9yZSB3ZSBjYW4gdXNlIGEgZml4ZWQgbWFyZ2luXG4gICAgICAgIC8vIHNwYWNpbmdzWHMgaXMgdGhlIG1hcmdpbiBiZXR3ZWVuIHRoZSBpY29uIGFuZCB2YWx1ZVxuICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICBtYXJnaW4tbGVmdDogJHtkZXNpZ25Ub2tlbnMuc3BhY2luZ1hsICsgZGVzaWduVG9rZW5zLnNwYWNpbmdYc307XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIHsvKiBAdHMtaWdub3JlICovfVxuICAgICAgICA8RGVmYXVsdENvbXBvbmVudCB7Li4ucHJvcHN9IC8+XG4gICAgICA8L3NwYW4+XG4gICAgPC8+XG4gICk7XG59O1xuXG5XcmFwcGVyV2l0aEljb24uZGlzcGxheU5hbWUgPSAnV3JhcHBlcldpdGhJY29uJztcblxuZXhwb3J0IGRlZmF1bHQgV3JhcHBlcldpdGhJY29uO1xuXG5jb25zdCBjdXN0b21Db21wb25lbnRzID0ge1xuICBTaW5nbGVWYWx1ZTogKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8J3NpbmdsZVZhbHVlJz4pID0+IChcbiAgICA8V3JhcHBlcldpdGhJY29uPCdzaW5nbGVWYWx1ZSc+IHsuLi5wcm9wc30gdHlwZT1cInNpbmdsZVZhbHVlXCIgLz5cbiAgKSxcbiAgUGxhY2Vob2xkZXI6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPCdwbGFjZWhvbGRlcic+KSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbjwncGxhY2Vob2xkZXInPiB7Li4ucHJvcHN9IHR5cGU9XCJwbGFjZWhvbGRlclwiIC8+XG4gICksXG59O1xuXG5leHBvcnQgeyBjdXN0b21Db21wb25lbnRzIH07XG4iXX0= */"),
167
+ css: /*#__PURE__*/react.css("margin-left:", designSystem.designTokens.spacing50 + designSystem.designTokens.spacing10, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRWdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIHR5cGUgU2luZ2xlVmFsdWVQcm9wcyxcbiAgdHlwZSBQbGFjZWhvbGRlclByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5leHBvcnQgdHlwZSBUU2luZ2xlVmFsdWVXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogJ3NpbmdsZVZhbHVlJztcbiAgc2VsZWN0UHJvcHM/OiBUU2VsZWN0UHJvcHM7XG59ICYgU2luZ2xlVmFsdWVQcm9wcztcbmV4cG9ydCB0eXBlIFRQbGFjZWhvbGRlcldyYXBwZXJXaXRoSWNvblByb3BzID0ge1xuICB0eXBlOiAncGxhY2Vob2xkZXInO1xuICBzZWxlY3RQcm9wcz86IFRTZWxlY3RQcm9wcztcbn0gJiBQbGFjZWhvbGRlclByb3BzO1xuZXhwb3J0IHR5cGUgVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4gPVxuICBUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJ1xuICAgID8gVFNpbmdsZVZhbHVlV3JhcHBlcldpdGhJY29uUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBUUGxhY2Vob2xkZXJXcmFwcGVyV2l0aEljb25Qcm9wc1xuICAgIDogbmV2ZXI7XG5leHBvcnQgdHlwZSBURGVmYXVsdENvbXBvbmVudDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+ID0gKFxuICBwcm9wczogVHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZSdcbiAgICA/IFNpbmdsZVZhbHVlUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBQbGFjZWhvbGRlclByb3BzXG4gICAgOiBuZXZlclxuKSA9PiBKU1guRWxlbWVudDtcblxuY29uc3QgZ2V0RGVmYXVsdENvbXBvbmVudCA9IDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+KFxuICB0eXBlOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5bJ3R5cGUnXVxuKTogVERlZmF1bHRDb21wb25lbnQ8VHlwZT4gfCBudWxsID0+IHtcbiAgaWYgKHR5cGUgPT09ICdzaW5nbGVWYWx1ZScpXG4gICAgcmV0dXJuIGRlZmF1bHRDb21wb25lbnRzLlNpbmdsZVZhbHVlIGFzIFREZWZhdWx0Q29tcG9uZW50PFR5cGU+O1xuICBpZiAodHlwZSA9PT0gJ3BsYWNlaG9sZGVyJylcbiAgICByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuUGxhY2Vob2xkZXIgYXMgVERlZmF1bHRDb21wb25lbnQ8VHlwZT47XG4gIHJldHVybiBudWxsO1xufTtcblxudHlwZSBUU2VsZWN0UHJvcHMgPSB7XG4gIGljb25MZWZ0PzogUmVhY3RFbGVtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4oXG4gIHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5cbikgPT4ge1xuICBjb25zdCBEZWZhdWx0Q29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudDxUeXBlPihwcm9wcy50eXBlKTtcblxuICBpZiAoIURlZmF1bHRDb21wb25lbnQpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIHtwcm9wcy5zZWxlY3RQcm9wcy5pY29uTGVmdCAmJlxuICAgICAgICBjbG9uZUVsZW1lbnQocHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQsIHtcbiAgICAgICAgICBzaXplOiAnYmlnJyxcbiAgICAgICAgfSl9XG4gICAgICA8c3BhblxuICAgICAgICAvLyByZWFjdC1zZWxlY3QgdXNlcyBhYnNvbHV0ZSBwb3NpdGlvbmluZyBmb3IgdGhlIFNpbmdsZVZhbHVlL1BsYWNlaG9sZGVyXG4gICAgICAgIC8vIHRoZSBpY29uIGhhcyBhIGZpeGVkIHNpemUgb2YgMjRweCAoPT0gU3BhY2luZ3NYbCksIHRoZXJlZm9yZSB3ZSBjYW4gdXNlIGEgZml4ZWQgbWFyZ2luXG4gICAgICAgIC8vIHNwYWNpbmdzWHMgaXMgdGhlIG1hcmdpbiBiZXR3ZWVuIHRoZSBpY29uIGFuZCB2YWx1ZVxuICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICBtYXJnaW4tbGVmdDogJHtkZXNpZ25Ub2tlbnMuc3BhY2luZzUwICsgZGVzaWduVG9rZW5zLnNwYWNpbmcxMH07XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIHsvKiBAdHMtaWdub3JlICovfVxuICAgICAgICA8RGVmYXVsdENvbXBvbmVudCB7Li4ucHJvcHN9IC8+XG4gICAgICA8L3NwYW4+XG4gICAgPC8+XG4gICk7XG59O1xuXG5XcmFwcGVyV2l0aEljb24uZGlzcGxheU5hbWUgPSAnV3JhcHBlcldpdGhJY29uJztcblxuZXhwb3J0IGRlZmF1bHQgV3JhcHBlcldpdGhJY29uO1xuXG5jb25zdCBjdXN0b21Db21wb25lbnRzID0ge1xuICBTaW5nbGVWYWx1ZTogKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8J3NpbmdsZVZhbHVlJz4pID0+IChcbiAgICA8V3JhcHBlcldpdGhJY29uPCdzaW5nbGVWYWx1ZSc+IHsuLi5wcm9wc30gdHlwZT1cInNpbmdsZVZhbHVlXCIgLz5cbiAgKSxcbiAgUGxhY2Vob2xkZXI6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPCdwbGFjZWhvbGRlcic+KSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbjwncGxhY2Vob2xkZXInPiB7Li4ucHJvcHN9IHR5cGU9XCJwbGFjZWhvbGRlclwiIC8+XG4gICksXG59O1xuXG5leHBvcnQgeyBjdXN0b21Db21wb25lbnRzIH07XG4iXX0= */"),
168
168
  children: jsxRuntime.jsx(DefaultComponent, _objectSpread$2({}, props))
169
169
  })]
170
170
  });
@@ -309,7 +309,7 @@ var controlStyles = function controlStyles(props) {
309
309
  if (props.isReadOnly) return 'default';
310
310
  return 'pointer';
311
311
  }(),
312
- padding: "0 ".concat(designSystem.designTokens.spacingS),
312
+ padding: "0 ".concat(designSystem.designTokens.spacing20),
313
313
  transition: _concatInstanceProperty__default["default"](_context = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n box-shadow ")).call(_context, designSystem.designTokens.transitionStandard),
314
314
  outline: 0,
315
315
  boxShadow: 'none',
@@ -344,7 +344,7 @@ var menuStyles = function menuStyles(props) {
344
344
  boxShadow: designSystem.designTokens.shadow7,
345
345
  fontSize: designSystem.designTokens.fontSizeForInput,
346
346
  fontFamily: 'inherit',
347
- margin: "".concat(designSystem.designTokens.spacingXs, " 0 0 0"),
347
+ margin: "".concat(designSystem.designTokens.spacing10, " 0 0 0"),
348
348
  borderColor: function () {
349
349
  if (props.hasError) return designSystem.designTokens.borderColorForInputWhenError;
350
350
  if (props.hasWarning) return designSystem.designTokens.borderColorForInputWhenWarning;
@@ -360,7 +360,7 @@ var indicatorSeparatorStyles = function indicatorSeparatorStyles() {
360
360
  display: 'none',
361
361
  margin: '0',
362
362
  padding: '0',
363
- marginLeft: designSystem.designTokens.spacingXs
363
+ marginLeft: designSystem.designTokens.spacing10
364
364
  });
365
365
  };
366
366
  };
@@ -371,7 +371,7 @@ var dropdownIndicatorStyles = function dropdownIndicatorStyles(props) {
371
371
  color: designSystem.designTokens.fontColorForInput,
372
372
  margin: '0',
373
373
  padding: '0',
374
- marginLeft: designSystem.designTokens.spacingXs,
374
+ marginLeft: designSystem.designTokens.spacing10,
375
375
  fill: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : base.fontColorForInput
376
376
  });
377
377
  };
@@ -402,8 +402,8 @@ var optionStyles = function optionStyles() {
402
402
 
403
403
  return _objectSpread(_objectSpread({}, base), {}, {
404
404
  transition: _concatInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](_context3 = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n background-color ")).call(_context3, designSystem.designTokens.transitionStandard, ",\n color ")).call(_context2, designSystem.designTokens.transitionStandard),
405
- paddingLeft: designSystem.designTokens.spacingS,
406
- paddingRight: designSystem.designTokens.spacingS,
405
+ paddingLeft: designSystem.designTokens.spacing20,
406
+ paddingRight: designSystem.designTokens.spacing20,
407
407
  color: function () {
408
408
  if (!state.isDisabled) return designSystem.designTokens.fontColorForInput;
409
409
  if (state.isSelected) return designSystem.designTokens.fontColorForInput;
@@ -491,8 +491,8 @@ var groupHeadingStyles = function groupHeadingStyles() {
491
491
  fontSize: designSystem.designTokens.fontSizeSmall,
492
492
  textTransform: 'none',
493
493
  fontWeight: 'bold',
494
- margin: "0 ".concat(designSystem.designTokens.spacingXs),
495
- padding: _concatInstanceProperty__default["default"](_context4 = "".concat(designSystem.designTokens.spacingS, " ")).call(_context4, designSystem.designTokens.spacingXs),
494
+ margin: "0 ".concat(designSystem.designTokens.spacing10),
495
+ padding: _concatInstanceProperty__default["default"](_context4 = "".concat(designSystem.designTokens.spacing20, " ")).call(_context4, designSystem.designTokens.spacing10),
496
496
  '&:empty': {
497
497
  padding: 0
498
498
  }
@@ -551,7 +551,7 @@ var multiValueLabelStyles = function multiValueLabelStyles(props) {
551
551
  if (props.isReadOnly) return designSystem.designTokens.fontColorForInputWhenReadonly;
552
552
  return base.color;
553
553
  }(),
554
- padding: _concatInstanceProperty__default["default"](_context5 = "".concat(designSystem.designTokens.spacingXs, " ")).call(_context5, designSystem.designTokens.spacingS),
554
+ padding: _concatInstanceProperty__default["default"](_context5 = "".concat(designSystem.designTokens.spacing10, " ")).call(_context5, designSystem.designTokens.spacing20),
555
555
  borderRadius: _concatInstanceProperty__default["default"](_context6 = "".concat(designSystem.designTokens.borderRadiusForTag, " 0 0 ")).call(_context6, designSystem.designTokens.borderRadiusForTag),
556
556
  border: "1px ".concat(designSystem.designTokens.borderColorForTag, " solid"),
557
557
  borderWidth: '1px 0 1px 1px',
@@ -569,7 +569,7 @@ var multiValueRemoveStyles = function multiValueRemoveStyles(props) {
569
569
 
570
570
  return _objectSpread(_objectSpread({}, base), {}, {
571
571
  borderColor: designSystem.designTokens.borderColorForTag,
572
- padding: "0 ".concat(designSystem.designTokens.spacingXs),
572
+ padding: "0 ".concat(designSystem.designTokens.spacing10),
573
573
  borderRadius: _concatInstanceProperty__default["default"](_context7 = "0 ".concat(designSystem.designTokens.borderRadiusForTag, " ")).call(_context7, designSystem.designTokens.borderRadiusForTag, " 0"),
574
574
  borderStyle: 'solid',
575
575
  borderWidth: '1px',
@@ -613,7 +613,7 @@ function createSelectStyles(props) {
613
613
  }
614
614
 
615
615
  // NOTE: This string will be replaced on build time with the package version.
616
- var version = "15.5.1";
616
+ var version = "15.6.0";
617
617
 
618
618
  exports.ClearIndicator = ClearIndicator$1;
619
619
  exports.CustomSelectInputOption = CustomSelectInputOption;
package/dist/commercetools-uikit-select-utils.cjs.prod.js CHANGED
@@ -164,7 +164,7 @@ var WrapperWithIcon = function WrapperWithIcon(props) {
164
164
  // react-select uses absolute positioning for the SingleValue/Placeholder
165
165
  // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
166
166
  // spacingsXs is the margin between the icon and value
167
- css: /*#__PURE__*/react.css("margin-left:", designSystem.designTokens.spacingXl + designSystem.designTokens.spacingXs, ";" + ("" ), "" ),
167
+ css: /*#__PURE__*/react.css("margin-left:", designSystem.designTokens.spacing50 + designSystem.designTokens.spacing10, ";" + ("" ), "" ),
168
168
  children: jsxRuntime.jsx(DefaultComponent, _objectSpread$2({}, props))
169
169
  })]
170
170
  });
@@ -309,7 +309,7 @@ var controlStyles = function controlStyles(props) {
309
309
  if (props.isReadOnly) return 'default';
310
310
  return 'pointer';
311
311
  }(),
312
- padding: "0 ".concat(designSystem.designTokens.spacingS),
312
+ padding: "0 ".concat(designSystem.designTokens.spacing20),
313
313
  transition: _concatInstanceProperty__default["default"](_context = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n box-shadow ")).call(_context, designSystem.designTokens.transitionStandard),
314
314
  outline: 0,
315
315
  boxShadow: 'none',
@@ -344,7 +344,7 @@ var menuStyles = function menuStyles(props) {
344
344
  boxShadow: designSystem.designTokens.shadow7,
345
345
  fontSize: designSystem.designTokens.fontSizeForInput,
346
346
  fontFamily: 'inherit',
347
- margin: "".concat(designSystem.designTokens.spacingXs, " 0 0 0"),
347
+ margin: "".concat(designSystem.designTokens.spacing10, " 0 0 0"),
348
348
  borderColor: function () {
349
349
  if (props.hasError) return designSystem.designTokens.borderColorForInputWhenError;
350
350
  if (props.hasWarning) return designSystem.designTokens.borderColorForInputWhenWarning;
@@ -360,7 +360,7 @@ var indicatorSeparatorStyles = function indicatorSeparatorStyles() {
360
360
  display: 'none',
361
361
  margin: '0',
362
362
  padding: '0',
363
- marginLeft: designSystem.designTokens.spacingXs
363
+ marginLeft: designSystem.designTokens.spacing10
364
364
  });
365
365
  };
366
366
  };
@@ -371,7 +371,7 @@ var dropdownIndicatorStyles = function dropdownIndicatorStyles(props) {
371
371
  color: designSystem.designTokens.fontColorForInput,
372
372
  margin: '0',
373
373
  padding: '0',
374
- marginLeft: designSystem.designTokens.spacingXs,
374
+ marginLeft: designSystem.designTokens.spacing10,
375
375
  fill: props.isDisabled || props.isReadOnly ? designSystem.designTokens.fontColorForInputWhenDisabled : base.fontColorForInput
376
376
  });
377
377
  };
@@ -402,8 +402,8 @@ var optionStyles = function optionStyles() {
402
402
 
403
403
  return _objectSpread(_objectSpread({}, base), {}, {
404
404
  transition: _concatInstanceProperty__default["default"](_context2 = _concatInstanceProperty__default["default"](_context3 = "border-color ".concat(designSystem.designTokens.transitionStandard, ",\n background-color ")).call(_context3, designSystem.designTokens.transitionStandard, ",\n color ")).call(_context2, designSystem.designTokens.transitionStandard),
405
- paddingLeft: designSystem.designTokens.spacingS,
406
- paddingRight: designSystem.designTokens.spacingS,
405
+ paddingLeft: designSystem.designTokens.spacing20,
406
+ paddingRight: designSystem.designTokens.spacing20,
407
407
  color: function () {
408
408
  if (!state.isDisabled) return designSystem.designTokens.fontColorForInput;
409
409
  if (state.isSelected) return designSystem.designTokens.fontColorForInput;
@@ -491,8 +491,8 @@ var groupHeadingStyles = function groupHeadingStyles() {
491
491
  fontSize: designSystem.designTokens.fontSizeSmall,
492
492
  textTransform: 'none',
493
493
  fontWeight: 'bold',
494
- margin: "0 ".concat(designSystem.designTokens.spacingXs),
495
- padding: _concatInstanceProperty__default["default"](_context4 = "".concat(designSystem.designTokens.spacingS, " ")).call(_context4, designSystem.designTokens.spacingXs),
494
+ margin: "0 ".concat(designSystem.designTokens.spacing10),
495
+ padding: _concatInstanceProperty__default["default"](_context4 = "".concat(designSystem.designTokens.spacing20, " ")).call(_context4, designSystem.designTokens.spacing10),
496
496
  '&:empty': {
497
497
  padding: 0
498
498
  }
@@ -551,7 +551,7 @@ var multiValueLabelStyles = function multiValueLabelStyles(props) {
551
551
  if (props.isReadOnly) return designSystem.designTokens.fontColorForInputWhenReadonly;
552
552
  return base.color;
553
553
  }(),
554
- padding: _concatInstanceProperty__default["default"](_context5 = "".concat(designSystem.designTokens.spacingXs, " ")).call(_context5, designSystem.designTokens.spacingS),
554
+ padding: _concatInstanceProperty__default["default"](_context5 = "".concat(designSystem.designTokens.spacing10, " ")).call(_context5, designSystem.designTokens.spacing20),
555
555
  borderRadius: _concatInstanceProperty__default["default"](_context6 = "".concat(designSystem.designTokens.borderRadiusForTag, " 0 0 ")).call(_context6, designSystem.designTokens.borderRadiusForTag),
556
556
  border: "1px ".concat(designSystem.designTokens.borderColorForTag, " solid"),
557
557
  borderWidth: '1px 0 1px 1px',
@@ -569,7 +569,7 @@ var multiValueRemoveStyles = function multiValueRemoveStyles(props) {
569
569
 
570
570
  return _objectSpread(_objectSpread({}, base), {}, {
571
571
  borderColor: designSystem.designTokens.borderColorForTag,
572
- padding: "0 ".concat(designSystem.designTokens.spacingXs),
572
+ padding: "0 ".concat(designSystem.designTokens.spacing10),
573
573
  borderRadius: _concatInstanceProperty__default["default"](_context7 = "0 ".concat(designSystem.designTokens.borderRadiusForTag, " ")).call(_context7, designSystem.designTokens.borderRadiusForTag, " 0"),
574
574
  borderStyle: 'solid',
575
575
  borderWidth: '1px',
@@ -613,7 +613,7 @@ function createSelectStyles(props) {
613
613
  }
614
614
 
615
615
  // NOTE: This string will be replaced on build time with the package version.
616
- var version = "15.5.1";
616
+ var version = "15.6.0";
617
617
 
618
618
  exports.ClearIndicator = ClearIndicator$1;
619
619
  exports.CustomSelectInputOption = CustomSelectInputOption;
package/dist/commercetools-uikit-select-utils.esm.js CHANGED
@@ -144,7 +144,7 @@ var WrapperWithIcon = function WrapperWithIcon(props) {
144
144
  // react-select uses absolute positioning for the SingleValue/Placeholder
145
145
  // the icon has a fixed size of 24px (== SpacingsXl), therefore we can use a fixed margin
146
146
  // spacingsXs is the margin between the icon and value
147
- css: /*#__PURE__*/css("margin-left:", designTokens.spacingXl + designTokens.spacingXs, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRWdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIHR5cGUgU2luZ2xlVmFsdWVQcm9wcyxcbiAgdHlwZSBQbGFjZWhvbGRlclByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5leHBvcnQgdHlwZSBUU2luZ2xlVmFsdWVXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogJ3NpbmdsZVZhbHVlJztcbiAgc2VsZWN0UHJvcHM/OiBUU2VsZWN0UHJvcHM7XG59ICYgU2luZ2xlVmFsdWVQcm9wcztcbmV4cG9ydCB0eXBlIFRQbGFjZWhvbGRlcldyYXBwZXJXaXRoSWNvblByb3BzID0ge1xuICB0eXBlOiAncGxhY2Vob2xkZXInO1xuICBzZWxlY3RQcm9wcz86IFRTZWxlY3RQcm9wcztcbn0gJiBQbGFjZWhvbGRlclByb3BzO1xuZXhwb3J0IHR5cGUgVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4gPVxuICBUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJ1xuICAgID8gVFNpbmdsZVZhbHVlV3JhcHBlcldpdGhJY29uUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBUUGxhY2Vob2xkZXJXcmFwcGVyV2l0aEljb25Qcm9wc1xuICAgIDogbmV2ZXI7XG5leHBvcnQgdHlwZSBURGVmYXVsdENvbXBvbmVudDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+ID0gKFxuICBwcm9wczogVHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZSdcbiAgICA/IFNpbmdsZVZhbHVlUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBQbGFjZWhvbGRlclByb3BzXG4gICAgOiBuZXZlclxuKSA9PiBKU1guRWxlbWVudDtcblxuY29uc3QgZ2V0RGVmYXVsdENvbXBvbmVudCA9IDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+KFxuICB0eXBlOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5bJ3R5cGUnXVxuKTogVERlZmF1bHRDb21wb25lbnQ8VHlwZT4gfCBudWxsID0+IHtcbiAgaWYgKHR5cGUgPT09ICdzaW5nbGVWYWx1ZScpXG4gICAgcmV0dXJuIGRlZmF1bHRDb21wb25lbnRzLlNpbmdsZVZhbHVlIGFzIFREZWZhdWx0Q29tcG9uZW50PFR5cGU+O1xuICBpZiAodHlwZSA9PT0gJ3BsYWNlaG9sZGVyJylcbiAgICByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuUGxhY2Vob2xkZXIgYXMgVERlZmF1bHRDb21wb25lbnQ8VHlwZT47XG4gIHJldHVybiBudWxsO1xufTtcblxudHlwZSBUU2VsZWN0UHJvcHMgPSB7XG4gIGljb25MZWZ0PzogUmVhY3RFbGVtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4oXG4gIHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5cbikgPT4ge1xuICBjb25zdCBEZWZhdWx0Q29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudDxUeXBlPihwcm9wcy50eXBlKTtcblxuICBpZiAoIURlZmF1bHRDb21wb25lbnQpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIHtwcm9wcy5zZWxlY3RQcm9wcy5pY29uTGVmdCAmJlxuICAgICAgICBjbG9uZUVsZW1lbnQocHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQsIHtcbiAgICAgICAgICBzaXplOiAnYmlnJyxcbiAgICAgICAgfSl9XG4gICAgICA8c3BhblxuICAgICAgICAvLyByZWFjdC1zZWxlY3QgdXNlcyBhYnNvbHV0ZSBwb3NpdGlvbmluZyBmb3IgdGhlIFNpbmdsZVZhbHVlL1BsYWNlaG9sZGVyXG4gICAgICAgIC8vIHRoZSBpY29uIGhhcyBhIGZpeGVkIHNpemUgb2YgMjRweCAoPT0gU3BhY2luZ3NYbCksIHRoZXJlZm9yZSB3ZSBjYW4gdXNlIGEgZml4ZWQgbWFyZ2luXG4gICAgICAgIC8vIHNwYWNpbmdzWHMgaXMgdGhlIG1hcmdpbiBiZXR3ZWVuIHRoZSBpY29uIGFuZCB2YWx1ZVxuICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICBtYXJnaW4tbGVmdDogJHtkZXNpZ25Ub2tlbnMuc3BhY2luZ1hsICsgZGVzaWduVG9rZW5zLnNwYWNpbmdYc307XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIHsvKiBAdHMtaWdub3JlICovfVxuICAgICAgICA8RGVmYXVsdENvbXBvbmVudCB7Li4ucHJvcHN9IC8+XG4gICAgICA8L3NwYW4+XG4gICAgPC8+XG4gICk7XG59O1xuXG5XcmFwcGVyV2l0aEljb24uZGlzcGxheU5hbWUgPSAnV3JhcHBlcldpdGhJY29uJztcblxuZXhwb3J0IGRlZmF1bHQgV3JhcHBlcldpdGhJY29uO1xuXG5jb25zdCBjdXN0b21Db21wb25lbnRzID0ge1xuICBTaW5nbGVWYWx1ZTogKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8J3NpbmdsZVZhbHVlJz4pID0+IChcbiAgICA8V3JhcHBlcldpdGhJY29uPCdzaW5nbGVWYWx1ZSc+IHsuLi5wcm9wc30gdHlwZT1cInNpbmdsZVZhbHVlXCIgLz5cbiAgKSxcbiAgUGxhY2Vob2xkZXI6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPCdwbGFjZWhvbGRlcic+KSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbjwncGxhY2Vob2xkZXInPiB7Li4ucHJvcHN9IHR5cGU9XCJwbGFjZWhvbGRlclwiIC8+XG4gICksXG59O1xuXG5leHBvcnQgeyBjdXN0b21Db21wb25lbnRzIH07XG4iXX0= */"),
147
+ css: /*#__PURE__*/css("margin-left:", designTokens.spacing50 + designTokens.spacing10, ";" + (process.env.NODE_ENV === "production" ? "" : ";label:WrapperWithIcon;"), process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIndyYXBwZXItd2l0aC1pY29uLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFnRWdCIiwiZmlsZSI6IndyYXBwZXItd2l0aC1pY29uLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IGNsb25lRWxlbWVudCwgdHlwZSBSZWFjdEVsZW1lbnQgfSBmcm9tICdyZWFjdCc7XG5pbXBvcnQgeyBjc3MgfSBmcm9tICdAZW1vdGlvbi9yZWFjdCc7XG5pbXBvcnQgeyBkZXNpZ25Ub2tlbnMgfSBmcm9tICdAY29tbWVyY2V0b29scy11aWtpdC9kZXNpZ24tc3lzdGVtJztcbmltcG9ydCB7XG4gIGNvbXBvbmVudHMgYXMgZGVmYXVsdENvbXBvbmVudHMsXG4gIHR5cGUgU2luZ2xlVmFsdWVQcm9wcyxcbiAgdHlwZSBQbGFjZWhvbGRlclByb3BzLFxufSBmcm9tICdyZWFjdC1zZWxlY3QnO1xuXG5leHBvcnQgdHlwZSBUU2luZ2xlVmFsdWVXcmFwcGVyV2l0aEljb25Qcm9wcyA9IHtcbiAgdHlwZTogJ3NpbmdsZVZhbHVlJztcbiAgc2VsZWN0UHJvcHM/OiBUU2VsZWN0UHJvcHM7XG59ICYgU2luZ2xlVmFsdWVQcm9wcztcbmV4cG9ydCB0eXBlIFRQbGFjZWhvbGRlcldyYXBwZXJXaXRoSWNvblByb3BzID0ge1xuICB0eXBlOiAncGxhY2Vob2xkZXInO1xuICBzZWxlY3RQcm9wcz86IFRTZWxlY3RQcm9wcztcbn0gJiBQbGFjZWhvbGRlclByb3BzO1xuZXhwb3J0IHR5cGUgVFdyYXBwZXJXaXRoSWNvblByb3BzPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4gPVxuICBUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJ1xuICAgID8gVFNpbmdsZVZhbHVlV3JhcHBlcldpdGhJY29uUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBUUGxhY2Vob2xkZXJXcmFwcGVyV2l0aEljb25Qcm9wc1xuICAgIDogbmV2ZXI7XG5leHBvcnQgdHlwZSBURGVmYXVsdENvbXBvbmVudDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+ID0gKFxuICBwcm9wczogVHlwZSBleHRlbmRzICdzaW5nbGVWYWx1ZSdcbiAgICA/IFNpbmdsZVZhbHVlUHJvcHNcbiAgICA6IFR5cGUgZXh0ZW5kcyAncGxhY2Vob2xkZXInXG4gICAgPyBQbGFjZWhvbGRlclByb3BzXG4gICAgOiBuZXZlclxuKSA9PiBKU1guRWxlbWVudDtcblxuY29uc3QgZ2V0RGVmYXVsdENvbXBvbmVudCA9IDxUeXBlIGV4dGVuZHMgJ3NpbmdsZVZhbHVlJyB8ICdwbGFjZWhvbGRlcic+KFxuICB0eXBlOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5bJ3R5cGUnXVxuKTogVERlZmF1bHRDb21wb25lbnQ8VHlwZT4gfCBudWxsID0+IHtcbiAgaWYgKHR5cGUgPT09ICdzaW5nbGVWYWx1ZScpXG4gICAgcmV0dXJuIGRlZmF1bHRDb21wb25lbnRzLlNpbmdsZVZhbHVlIGFzIFREZWZhdWx0Q29tcG9uZW50PFR5cGU+O1xuICBpZiAodHlwZSA9PT0gJ3BsYWNlaG9sZGVyJylcbiAgICByZXR1cm4gZGVmYXVsdENvbXBvbmVudHMuUGxhY2Vob2xkZXIgYXMgVERlZmF1bHRDb21wb25lbnQ8VHlwZT47XG4gIHJldHVybiBudWxsO1xufTtcblxudHlwZSBUU2VsZWN0UHJvcHMgPSB7XG4gIGljb25MZWZ0PzogUmVhY3RFbGVtZW50O1xufTtcblxuY29uc3QgV3JhcHBlcldpdGhJY29uID0gPFR5cGUgZXh0ZW5kcyAnc2luZ2xlVmFsdWUnIHwgJ3BsYWNlaG9sZGVyJz4oXG4gIHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8VHlwZT5cbikgPT4ge1xuICBjb25zdCBEZWZhdWx0Q29tcG9uZW50ID0gZ2V0RGVmYXVsdENvbXBvbmVudDxUeXBlPihwcm9wcy50eXBlKTtcblxuICBpZiAoIURlZmF1bHRDb21wb25lbnQpIHtcbiAgICByZXR1cm4gbnVsbDtcbiAgfVxuXG4gIHJldHVybiAoXG4gICAgPD5cbiAgICAgIHtwcm9wcy5zZWxlY3RQcm9wcy5pY29uTGVmdCAmJlxuICAgICAgICBjbG9uZUVsZW1lbnQocHJvcHMuc2VsZWN0UHJvcHMuaWNvbkxlZnQsIHtcbiAgICAgICAgICBzaXplOiAnYmlnJyxcbiAgICAgICAgfSl9XG4gICAgICA8c3BhblxuICAgICAgICAvLyByZWFjdC1zZWxlY3QgdXNlcyBhYnNvbHV0ZSBwb3NpdGlvbmluZyBmb3IgdGhlIFNpbmdsZVZhbHVlL1BsYWNlaG9sZGVyXG4gICAgICAgIC8vIHRoZSBpY29uIGhhcyBhIGZpeGVkIHNpemUgb2YgMjRweCAoPT0gU3BhY2luZ3NYbCksIHRoZXJlZm9yZSB3ZSBjYW4gdXNlIGEgZml4ZWQgbWFyZ2luXG4gICAgICAgIC8vIHNwYWNpbmdzWHMgaXMgdGhlIG1hcmdpbiBiZXR3ZWVuIHRoZSBpY29uIGFuZCB2YWx1ZVxuICAgICAgICBjc3M9e2Nzc2BcbiAgICAgICAgICBtYXJnaW4tbGVmdDogJHtkZXNpZ25Ub2tlbnMuc3BhY2luZzUwICsgZGVzaWduVG9rZW5zLnNwYWNpbmcxMH07XG4gICAgICAgIGB9XG4gICAgICA+XG4gICAgICAgIHsvKiBAdHMtaWdub3JlICovfVxuICAgICAgICA8RGVmYXVsdENvbXBvbmVudCB7Li4ucHJvcHN9IC8+XG4gICAgICA8L3NwYW4+XG4gICAgPC8+XG4gICk7XG59O1xuXG5XcmFwcGVyV2l0aEljb24uZGlzcGxheU5hbWUgPSAnV3JhcHBlcldpdGhJY29uJztcblxuZXhwb3J0IGRlZmF1bHQgV3JhcHBlcldpdGhJY29uO1xuXG5jb25zdCBjdXN0b21Db21wb25lbnRzID0ge1xuICBTaW5nbGVWYWx1ZTogKHByb3BzOiBUV3JhcHBlcldpdGhJY29uUHJvcHM8J3NpbmdsZVZhbHVlJz4pID0+IChcbiAgICA8V3JhcHBlcldpdGhJY29uPCdzaW5nbGVWYWx1ZSc+IHsuLi5wcm9wc30gdHlwZT1cInNpbmdsZVZhbHVlXCIgLz5cbiAgKSxcbiAgUGxhY2Vob2xkZXI6IChwcm9wczogVFdyYXBwZXJXaXRoSWNvblByb3BzPCdwbGFjZWhvbGRlcic+KSA9PiAoXG4gICAgPFdyYXBwZXJXaXRoSWNvbjwncGxhY2Vob2xkZXInPiB7Li4ucHJvcHN9IHR5cGU9XCJwbGFjZWhvbGRlclwiIC8+XG4gICksXG59O1xuXG5leHBvcnQgeyBjdXN0b21Db21wb25lbnRzIH07XG4iXX0= */"),
148
148
  children: jsx(DefaultComponent, _objectSpread$2({}, props))
149
149
  })]
150
150
  });
@@ -289,7 +289,7 @@ var controlStyles = function controlStyles(props) {
289
289
  if (props.isReadOnly) return 'default';
290
290
  return 'pointer';
291
291
  }(),
292
- padding: "0 ".concat(designTokens.spacingS),
292
+ padding: "0 ".concat(designTokens.spacing20),
293
293
  transition: _concatInstanceProperty(_context = "border-color ".concat(designTokens.transitionStandard, ",\n box-shadow ")).call(_context, designTokens.transitionStandard),
294
294
  outline: 0,
295
295
  boxShadow: 'none',
@@ -324,7 +324,7 @@ var menuStyles = function menuStyles(props) {
324
324
  boxShadow: designTokens.shadow7,
325
325
  fontSize: designTokens.fontSizeForInput,
326
326
  fontFamily: 'inherit',
327
- margin: "".concat(designTokens.spacingXs, " 0 0 0"),
327
+ margin: "".concat(designTokens.spacing10, " 0 0 0"),
328
328
  borderColor: function () {
329
329
  if (props.hasError) return designTokens.borderColorForInputWhenError;
330
330
  if (props.hasWarning) return designTokens.borderColorForInputWhenWarning;
@@ -340,7 +340,7 @@ var indicatorSeparatorStyles = function indicatorSeparatorStyles() {
340
340
  display: 'none',
341
341
  margin: '0',
342
342
  padding: '0',
343
- marginLeft: designTokens.spacingXs
343
+ marginLeft: designTokens.spacing10
344
344
  });
345
345
  };
346
346
  };
@@ -351,7 +351,7 @@ var dropdownIndicatorStyles = function dropdownIndicatorStyles(props) {
351
351
  color: designTokens.fontColorForInput,
352
352
  margin: '0',
353
353
  padding: '0',
354
- marginLeft: designTokens.spacingXs,
354
+ marginLeft: designTokens.spacing10,
355
355
  fill: props.isDisabled || props.isReadOnly ? designTokens.fontColorForInputWhenDisabled : base.fontColorForInput
356
356
  });
357
357
  };
@@ -382,8 +382,8 @@ var optionStyles = function optionStyles() {
382
382
 
383
383
  return _objectSpread(_objectSpread({}, base), {}, {
384
384
  transition: _concatInstanceProperty(_context2 = _concatInstanceProperty(_context3 = "border-color ".concat(designTokens.transitionStandard, ",\n background-color ")).call(_context3, designTokens.transitionStandard, ",\n color ")).call(_context2, designTokens.transitionStandard),
385
- paddingLeft: designTokens.spacingS,
386
- paddingRight: designTokens.spacingS,
385
+ paddingLeft: designTokens.spacing20,
386
+ paddingRight: designTokens.spacing20,
387
387
  color: function () {
388
388
  if (!state.isDisabled) return designTokens.fontColorForInput;
389
389
  if (state.isSelected) return designTokens.fontColorForInput;
@@ -471,8 +471,8 @@ var groupHeadingStyles = function groupHeadingStyles() {
471
471
  fontSize: designTokens.fontSizeSmall,
472
472
  textTransform: 'none',
473
473
  fontWeight: 'bold',
474
- margin: "0 ".concat(designTokens.spacingXs),
475
- padding: _concatInstanceProperty(_context4 = "".concat(designTokens.spacingS, " ")).call(_context4, designTokens.spacingXs),
474
+ margin: "0 ".concat(designTokens.spacing10),
475
+ padding: _concatInstanceProperty(_context4 = "".concat(designTokens.spacing20, " ")).call(_context4, designTokens.spacing10),
476
476
  '&:empty': {
477
477
  padding: 0
478
478
  }
@@ -531,7 +531,7 @@ var multiValueLabelStyles = function multiValueLabelStyles(props) {
531
531
  if (props.isReadOnly) return designTokens.fontColorForInputWhenReadonly;
532
532
  return base.color;
533
533
  }(),
534
- padding: _concatInstanceProperty(_context5 = "".concat(designTokens.spacingXs, " ")).call(_context5, designTokens.spacingS),
534
+ padding: _concatInstanceProperty(_context5 = "".concat(designTokens.spacing10, " ")).call(_context5, designTokens.spacing20),
535
535
  borderRadius: _concatInstanceProperty(_context6 = "".concat(designTokens.borderRadiusForTag, " 0 0 ")).call(_context6, designTokens.borderRadiusForTag),
536
536
  border: "1px ".concat(designTokens.borderColorForTag, " solid"),
537
537
  borderWidth: '1px 0 1px 1px',
@@ -549,7 +549,7 @@ var multiValueRemoveStyles = function multiValueRemoveStyles(props) {
549
549
 
550
550
  return _objectSpread(_objectSpread({}, base), {}, {
551
551
  borderColor: designTokens.borderColorForTag,
552
- padding: "0 ".concat(designTokens.spacingXs),
552
+ padding: "0 ".concat(designTokens.spacing10),
553
553
  borderRadius: _concatInstanceProperty(_context7 = "0 ".concat(designTokens.borderRadiusForTag, " ")).call(_context7, designTokens.borderRadiusForTag, " 0"),
554
554
  borderStyle: 'solid',
555
555
  borderWidth: '1px',
@@ -593,6 +593,6 @@ function createSelectStyles(props) {
593
593
  }
594
594
 
595
595
  // NOTE: This string will be replaced on build time with the package version.
596
- var version = "15.5.1";
596
+ var version = "15.6.0";
597
597
 
598
598
  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 };
package/dist/declarations/src/create-select-styles.d.ts CHANGED
@@ -69,7 +69,7 @@ export default function createSelectStyles(props: TProps): {
69
69
  display: string;
70
70
  margin: string;
71
71
  padding: string;
72
- marginLeft: "var(--spacing-xs, 4px)";
72
+ marginLeft: "var(--spacing-10, 4px)";
73
73
  fontColorForInput?: string | undefined;
74
74
  borderColorForInput?: string | undefined;
75
75
  color?: string | undefined;
@@ -83,7 +83,7 @@ export default function createSelectStyles(props: TProps): {
83
83
  color: "var(--font-color-for-input, #1a1a1a)";
84
84
  margin: string;
85
85
  padding: string;
86
- marginLeft: "var(--spacing-xs, 4px)";
86
+ marginLeft: "var(--spacing-10, 4px)";
87
87
  fill: string | undefined;
88
88
  fontColorForInput?: string | undefined;
89
89
  borderColorForInput?: string | undefined;
@@ -190,8 +190,8 @@ export default function createSelectStyles(props: TProps): {
190
190
  };
191
191
  option: (base: TBase, state: TState) => {
192
192
  transition: string;
193
- paddingLeft: "var(--spacing-s, 8px)";
194
- paddingRight: "var(--spacing-s, 8px)";
193
+ paddingLeft: "var(--spacing-20, 8px)";
194
+ paddingRight: "var(--spacing-20, 8px)";
195
195
  color: string | undefined;
196
196
  backgroundColor: string | undefined;
197
197
  '&:active': {
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": "15.5.1",
4
+ "version": "15.6.0",
5
5
  "bugs": "https://github.com/commercetools/ui-kit/issues",
6
6
  "repository": {
7
7
  "type": "git",
@@ -21,12 +21,12 @@
21
21
  "dependencies": {
22
22
  "@babel/runtime": "^7.19.0",
23
23
  "@babel/runtime-corejs3": "^7.19.1",
24
- "@commercetools-uikit/accessible-button": "15.5.1",
25
- "@commercetools-uikit/design-system": "15.5.1",
26
- "@commercetools-uikit/icons": "15.5.1",
27
- "@commercetools-uikit/spacings": "15.5.1",
28
- "@commercetools-uikit/text": "15.5.1",
29
- "@commercetools-uikit/utils": "15.5.1",
24
+ "@commercetools-uikit/accessible-button": "15.6.0",
25
+ "@commercetools-uikit/design-system": "15.6.0",
26
+ "@commercetools-uikit/icons": "15.6.0",
27
+ "@commercetools-uikit/spacings": "15.6.0",
28
+ "@commercetools-uikit/text": "15.6.0",
29
+ "@commercetools-uikit/utils": "15.6.0",
30
30
  "@emotion/react": "^11.4.0",
31
31
  "@emotion/styled": "^11.3.0",
32
32
  "lodash": "4.17.21",