@commercetools-uikit/select-utils 15.13.0 → 15.13.2

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.
@@ -286,6 +286,26 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["def
286
286
 
287
287
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context9, _context10; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(source), !0)).call(_context9, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys(Object(source))).call(_context10, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
288
288
 
289
+ var getControlBorderColor = function getControlBorderColor(props, defaultColor) {
290
+ if (props.isDisabled) {
291
+ return designSystem.designTokens.borderColorForInputWhenDisabled;
292
+ }
293
+
294
+ if (props.isReadOnly) {
295
+ return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
296
+ }
297
+
298
+ if (props.hasError) {
299
+ return designSystem.designTokens.borderColorForInputWhenError;
300
+ }
301
+
302
+ if (props.hasWarning) {
303
+ return designSystem.designTokens.borderColorForInputWhenWarning;
304
+ }
305
+
306
+ return defaultColor;
307
+ };
308
+
289
309
  var controlStyles = function controlStyles(props) {
290
310
  return function (base, state) {
291
311
  var _context;
@@ -299,10 +319,10 @@ var controlStyles = function controlStyles(props) {
299
319
  }(),
300
320
  borderColor: function () {
301
321
  if (props.isDisabled) return designSystem.designTokens.borderColorForInputWhenDisabled;
322
+ if (props.isReadOnly) return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
302
323
  if (state.isFocused) return designSystem.designTokens.borderColorForInputWhenFocused;
303
324
  if (props.hasError) return designSystem.designTokens.borderColorForInputWhenError;
304
325
  if (props.hasWarning) return designSystem.designTokens.borderColorForInputWhenWarning;
305
- if (props.isReadOnly) return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
306
326
  return designSystem.designTokens.borderColorForInput;
307
327
  }(),
308
328
  borderWidth: function () {
@@ -324,19 +344,16 @@ var controlStyles = function controlStyles(props) {
324
344
  boxShadow: function () {
325
345
  var _context2;
326
346
 
327
- if (!props.isDisabled) return _concatInstanceProperty__default["default"](_context2 = "".concat(designSystem.designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designSystem.designTokens.borderColorForInputWhenFocused);
347
+ if (!props.isDisabled && !props.isReadOnly) return _concatInstanceProperty__default["default"](_context2 = "".concat(designSystem.designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designSystem.designTokens.borderColorForInputWhenFocused);
328
348
  return null;
329
349
  }(),
330
350
  borderColor: function () {
331
- if (!props.isDisabled) return designSystem.designTokens.borderColorForInputWhenFocused;
351
+ if (!props.isDisabled && !props.isReadOnly) return designSystem.designTokens.borderColorForInputWhenFocused;
332
352
  return null;
333
353
  }()
334
354
  },
335
355
  '&:hover': {
336
- borderColor: function () {
337
- if (!props.isDisabled && !props.isReadOnly) return designSystem.designTokens.borderColorForInputWhenHovered;
338
- return null;
339
- }(),
356
+ borderColor: getControlBorderColor(props, designSystem.designTokens.borderColorForInputWhenHovered),
340
357
  backgroundColor: function () {
341
358
  if (!props.isDisabled && !props.isReadOnly) return designSystem.designTokens.backgroundColorForInputWhenHovered;
342
359
  return null;
@@ -640,7 +657,7 @@ function createSelectStyles(props) {
640
657
  }
641
658
 
642
659
  // NOTE: This string will be replaced on build time with the package version.
643
- var version = "15.13.0";
660
+ var version = "15.13.2";
644
661
 
645
662
  exports.ClearIndicator = ClearIndicator$1;
646
663
  exports.CustomSelectInputOption = CustomSelectInputOption;
@@ -286,6 +286,26 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys__default["def
286
286
 
287
287
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context9, _context10; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty__default["default"](_context9 = ownKeys(Object(source), !0)).call(_context9, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors__default["default"] ? _Object$defineProperties__default["default"](target, _Object$getOwnPropertyDescriptors__default["default"](source)) : _forEachInstanceProperty__default["default"](_context10 = ownKeys(Object(source))).call(_context10, function (key) { _Object$defineProperty__default["default"](target, key, _Object$getOwnPropertyDescriptor__default["default"](source, key)); }); } return target; }
288
288
 
289
+ var getControlBorderColor = function getControlBorderColor(props, defaultColor) {
290
+ if (props.isDisabled) {
291
+ return designSystem.designTokens.borderColorForInputWhenDisabled;
292
+ }
293
+
294
+ if (props.isReadOnly) {
295
+ return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
296
+ }
297
+
298
+ if (props.hasError) {
299
+ return designSystem.designTokens.borderColorForInputWhenError;
300
+ }
301
+
302
+ if (props.hasWarning) {
303
+ return designSystem.designTokens.borderColorForInputWhenWarning;
304
+ }
305
+
306
+ return defaultColor;
307
+ };
308
+
289
309
  var controlStyles = function controlStyles(props) {
290
310
  return function (base, state) {
291
311
  var _context;
@@ -299,10 +319,10 @@ var controlStyles = function controlStyles(props) {
299
319
  }(),
300
320
  borderColor: function () {
301
321
  if (props.isDisabled) return designSystem.designTokens.borderColorForInputWhenDisabled;
322
+ if (props.isReadOnly) return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
302
323
  if (state.isFocused) return designSystem.designTokens.borderColorForInputWhenFocused;
303
324
  if (props.hasError) return designSystem.designTokens.borderColorForInputWhenError;
304
325
  if (props.hasWarning) return designSystem.designTokens.borderColorForInputWhenWarning;
305
- if (props.isReadOnly) return designSystem.designTokens.borderColorForSelectInputWhenReadonly;
306
326
  return designSystem.designTokens.borderColorForInput;
307
327
  }(),
308
328
  borderWidth: function () {
@@ -324,19 +344,16 @@ var controlStyles = function controlStyles(props) {
324
344
  boxShadow: function () {
325
345
  var _context2;
326
346
 
327
- if (!props.isDisabled) return _concatInstanceProperty__default["default"](_context2 = "".concat(designSystem.designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designSystem.designTokens.borderColorForInputWhenFocused);
347
+ if (!props.isDisabled && !props.isReadOnly) return _concatInstanceProperty__default["default"](_context2 = "".concat(designSystem.designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designSystem.designTokens.borderColorForInputWhenFocused);
328
348
  return null;
329
349
  }(),
330
350
  borderColor: function () {
331
- if (!props.isDisabled) return designSystem.designTokens.borderColorForInputWhenFocused;
351
+ if (!props.isDisabled && !props.isReadOnly) return designSystem.designTokens.borderColorForInputWhenFocused;
332
352
  return null;
333
353
  }()
334
354
  },
335
355
  '&:hover': {
336
- borderColor: function () {
337
- if (!props.isDisabled && !props.isReadOnly) return designSystem.designTokens.borderColorForInputWhenHovered;
338
- return null;
339
- }(),
356
+ borderColor: getControlBorderColor(props, designSystem.designTokens.borderColorForInputWhenHovered),
340
357
  backgroundColor: function () {
341
358
  if (!props.isDisabled && !props.isReadOnly) return designSystem.designTokens.backgroundColorForInputWhenHovered;
342
359
  return null;
@@ -640,7 +657,7 @@ function createSelectStyles(props) {
640
657
  }
641
658
 
642
659
  // NOTE: This string will be replaced on build time with the package version.
643
- var version = "15.13.0";
660
+ var version = "15.13.2";
644
661
 
645
662
  exports.ClearIndicator = ClearIndicator$1;
646
663
  exports.CustomSelectInputOption = CustomSelectInputOption;
@@ -266,6 +266,26 @@ function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (
266
266
 
267
267
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context9, _context10; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context9 = ownKeys(Object(source), !0)).call(_context9, function (key) { _defineProperty(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context10 = ownKeys(Object(source))).call(_context10, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
268
268
 
269
+ var getControlBorderColor = function getControlBorderColor(props, defaultColor) {
270
+ if (props.isDisabled) {
271
+ return designTokens.borderColorForInputWhenDisabled;
272
+ }
273
+
274
+ if (props.isReadOnly) {
275
+ return designTokens.borderColorForSelectInputWhenReadonly;
276
+ }
277
+
278
+ if (props.hasError) {
279
+ return designTokens.borderColorForInputWhenError;
280
+ }
281
+
282
+ if (props.hasWarning) {
283
+ return designTokens.borderColorForInputWhenWarning;
284
+ }
285
+
286
+ return defaultColor;
287
+ };
288
+
269
289
  var controlStyles = function controlStyles(props) {
270
290
  return function (base, state) {
271
291
  var _context;
@@ -279,10 +299,10 @@ var controlStyles = function controlStyles(props) {
279
299
  }(),
280
300
  borderColor: function () {
281
301
  if (props.isDisabled) return designTokens.borderColorForInputWhenDisabled;
302
+ if (props.isReadOnly) return designTokens.borderColorForSelectInputWhenReadonly;
282
303
  if (state.isFocused) return designTokens.borderColorForInputWhenFocused;
283
304
  if (props.hasError) return designTokens.borderColorForInputWhenError;
284
305
  if (props.hasWarning) return designTokens.borderColorForInputWhenWarning;
285
- if (props.isReadOnly) return designTokens.borderColorForSelectInputWhenReadonly;
286
306
  return designTokens.borderColorForInput;
287
307
  }(),
288
308
  borderWidth: function () {
@@ -304,19 +324,16 @@ var controlStyles = function controlStyles(props) {
304
324
  boxShadow: function () {
305
325
  var _context2;
306
326
 
307
- if (!props.isDisabled) return _concatInstanceProperty(_context2 = "".concat(designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designTokens.borderColorForInputWhenFocused);
327
+ if (!props.isDisabled && !props.isReadOnly) return _concatInstanceProperty(_context2 = "".concat(designTokens.boxShadowForSelectInputWhenFocused, " ")).call(_context2, designTokens.borderColorForInputWhenFocused);
308
328
  return null;
309
329
  }(),
310
330
  borderColor: function () {
311
- if (!props.isDisabled) return designTokens.borderColorForInputWhenFocused;
331
+ if (!props.isDisabled && !props.isReadOnly) return designTokens.borderColorForInputWhenFocused;
312
332
  return null;
313
333
  }()
314
334
  },
315
335
  '&:hover': {
316
- borderColor: function () {
317
- if (!props.isDisabled && !props.isReadOnly) return designTokens.borderColorForInputWhenHovered;
318
- return null;
319
- }(),
336
+ borderColor: getControlBorderColor(props, designTokens.borderColorForInputWhenHovered),
320
337
  backgroundColor: function () {
321
338
  if (!props.isDisabled && !props.isReadOnly) return designTokens.backgroundColorForInputWhenHovered;
322
339
  return null;
@@ -620,6 +637,6 @@ function createSelectStyles(props) {
620
637
  }
621
638
 
622
639
  // NOTE: This string will be replaced on build time with the package version.
623
- var version = "15.13.0";
640
+ var version = "15.13.2";
624
641
 
625
642
  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 };
@@ -45,7 +45,7 @@ export default function createSelectStyles(props: TProps & {
45
45
  borderColor: "var(--border-color-for-input-when-focused, #00b39e)" | null;
46
46
  };
47
47
  '&:hover': {
48
- borderColor: "var(--border-color-for-input-when-hovered, #00b39e)" | null;
48
+ borderColor: string;
49
49
  backgroundColor: "var(--background-color-for-input-when-hovered, #fff)" | null;
50
50
  };
51
51
  pointerEvents: string;
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.13.0",
4
+ "version": "15.13.2",
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.20.13",
23
23
  "@babel/runtime-corejs3": "^7.20.13",
24
- "@commercetools-uikit/accessible-button": "15.13.0",
25
- "@commercetools-uikit/design-system": "15.13.0",
26
- "@commercetools-uikit/icons": "15.13.0",
27
- "@commercetools-uikit/spacings": "15.13.0",
28
- "@commercetools-uikit/text": "15.13.0",
29
- "@commercetools-uikit/utils": "15.13.0",
24
+ "@commercetools-uikit/accessible-button": "15.13.2",
25
+ "@commercetools-uikit/design-system": "15.13.2",
26
+ "@commercetools-uikit/icons": "15.13.2",
27
+ "@commercetools-uikit/spacings": "15.13.2",
28
+ "@commercetools-uikit/text": "15.13.2",
29
+ "@commercetools-uikit/utils": "15.13.2",
30
30
  "@emotion/react": "^11.10.5",
31
31
  "@emotion/styled": "^11.10.5",
32
32
  "lodash": "4.17.21",