@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:
|
|
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.
|
|
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:
|
|
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.
|
|
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:
|
|
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.
|
|
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:
|
|
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.
|
|
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.
|
|
25
|
-
"@commercetools-uikit/design-system": "15.13.
|
|
26
|
-
"@commercetools-uikit/icons": "15.13.
|
|
27
|
-
"@commercetools-uikit/spacings": "15.13.
|
|
28
|
-
"@commercetools-uikit/text": "15.13.
|
|
29
|
-
"@commercetools-uikit/utils": "15.13.
|
|
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",
|