@itcase/ui 1.8.32 → 1.8.34

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 (101) hide show
  1. package/dist/{DatePicker_cjs_BYh1Dsto.js → DatePicker_cjs_C-VbK2J4.js} +9 -9
  2. package/dist/{DatePicker_es_DEAcYDTL.js → DatePicker_es_CIEHQyHC.js} +9 -9
  3. package/dist/{Input_cjs_BAVggtkk.js → Input_cjs_arr_wxD2.js} +21 -20
  4. package/dist/{Input_es_CNduH28G.js → Input_es_BW6cZThr.js} +21 -20
  5. package/dist/{Label_cjs_CZMMdwt5.js → Label_cjs_BWbVsB-u.js} +3 -3
  6. package/dist/{Label_es_DmDqs4Rc.js → Label_es_ouC2i_iI.js} +3 -3
  7. package/dist/cjs/components/Breadcrumbs/stories/__mock__.js +7 -15
  8. package/dist/cjs/components/Cell.js +1 -1
  9. package/dist/cjs/components/Choice/stories/__mock__.js +15 -15
  10. package/dist/cjs/components/Choice.js +33 -28
  11. package/dist/cjs/components/Code.js +31 -42
  12. package/dist/cjs/components/Dadata.js +1 -1
  13. package/dist/cjs/components/DatePeriod.js +3 -3
  14. package/dist/cjs/components/DatePicker.js +3 -3
  15. package/dist/cjs/components/Dropdown/stories/__mock__.js +2 -2
  16. package/dist/cjs/components/Input.js +1 -1
  17. package/dist/cjs/components/Label.js +1 -1
  18. package/dist/cjs/components/MenuItem.js +14 -7
  19. package/dist/cjs/components/Notification/stories/__mock__.js +4 -0
  20. package/dist/cjs/components/Notification.js +27 -9
  21. package/dist/cjs/components/Pagination.js +101 -20
  22. package/dist/cjs/components/Search.js +15 -14
  23. package/dist/cjs/components/Segmented/stories/__mock__.js +38 -0
  24. package/dist/cjs/components/Segmented.js +13 -10
  25. package/dist/cjs/components/Tab/stories/__mock__.js +6 -1
  26. package/dist/cjs/context/Notifications.js +6 -6
  27. package/dist/components/Breadcrumbs/stories/__mock__.js +7 -15
  28. package/dist/components/Cell.js +1 -1
  29. package/dist/components/Choice/stories/__mock__.js +16 -16
  30. package/dist/components/Choice.js +33 -28
  31. package/dist/components/Code.js +31 -42
  32. package/dist/components/Dadata.js +1 -1
  33. package/dist/components/DatePeriod.js +3 -3
  34. package/dist/components/DatePicker.js +3 -3
  35. package/dist/components/Dropdown/stories/__mock__.js +2 -2
  36. package/dist/components/Input.js +1 -1
  37. package/dist/components/Label.js +1 -1
  38. package/dist/components/MenuItem.js +14 -7
  39. package/dist/components/Notification/stories/__mock__.js +4 -0
  40. package/dist/components/Notification.js +27 -9
  41. package/dist/components/Pagination.js +103 -22
  42. package/dist/components/Search.js +15 -14
  43. package/dist/components/Segmented/stories/__mock__.js +36 -0
  44. package/dist/components/Segmented.js +13 -10
  45. package/dist/components/Tab/stories/__mock__.js +6 -1
  46. package/dist/context/Notifications.js +6 -6
  47. package/dist/css/components/Input/Input.css +6 -0
  48. package/dist/css/components/Notification/Notification.css +23 -0
  49. package/dist/css/components/Pagination/Pagination.css +19 -6
  50. package/dist/css/components/Search/Search.css +0 -1
  51. package/dist/css/components/Search/css/search-input/search-input.css +0 -1
  52. package/dist/css/components/Segmented/Segmented.css +24 -0
  53. package/dist/css/components/Tab/Tab.css +4 -0
  54. package/dist/css/styles/border-color/border-color_hover.css +3 -0
  55. package/dist/stories/CellOverview.mdx +3 -2
  56. package/dist/stories/DatePeriodPlayground.mdx +2 -2
  57. package/dist/stories/RangeSliderOverview.mdx +0 -3
  58. package/dist/stories/VideoOverview.mdx +2 -10
  59. package/dist/stories/VideoPlayground.mdx +2 -2
  60. package/dist/types/components/Breadcrumbs/stories/__mock__/index.d.ts +1 -0
  61. package/dist/types/components/Choice/appearance/choiceDefault.d.ts +7 -0
  62. package/dist/types/components/Choice/appearance/choiceDisabled.d.ts +7 -0
  63. package/dist/types/components/Choice/appearance/choiceRequire.d.ts +6 -0
  64. package/dist/types/components/Choice/appearance/choiceStyle.d.ts +4 -0
  65. package/dist/types/components/Choice/appearance/choiceSuccess.d.ts +6 -0
  66. package/dist/types/components/Choice/stories/__mock__/index.d.ts +9 -3
  67. package/dist/types/components/Code/appearance/codeDisabled.d.ts +7 -11
  68. package/dist/types/components/Code/appearance/codeRequire.d.ts +7 -15
  69. package/dist/types/components/Code/appearance/codeStyle.d.ts +9 -9
  70. package/dist/types/components/Code/appearance/codeSuccess.d.ts +8 -7
  71. package/dist/types/components/DatePicker/DatePicker.appearance.d.ts +1 -1
  72. package/dist/types/components/DatePicker/appearance/datePickerStyle.d.ts +1 -1
  73. package/dist/types/components/Input/appearance/inputDefault.d.ts +2 -2
  74. package/dist/types/components/Input/appearance/inputDisabled.d.ts +2 -2
  75. package/dist/types/components/Input/appearance/inputError.d.ts +2 -2
  76. package/dist/types/components/Input/appearance/inputRequire.d.ts +2 -2
  77. package/dist/types/components/Input/appearance/inputStyle.d.ts +7 -6
  78. package/dist/types/components/Input/appearance/inputSuccess.d.ts +2 -2
  79. package/dist/types/components/Label/appearance/labelInfo.d.ts +1 -1
  80. package/dist/types/components/MenuItem/appearance/menuItemAccent.d.ts +1 -0
  81. package/dist/types/components/MenuItem/appearance/menuItemError.d.ts +1 -0
  82. package/dist/types/components/MenuItem/appearance/menuItemStyle.d.ts +6 -4
  83. package/dist/types/components/MenuItem/appearance/menuItemSurface.d.ts +3 -0
  84. package/dist/types/components/Notification/appearance/notificationInfo.d.ts +17 -0
  85. package/dist/types/components/Notification/appearance/notificationStyle.d.ts +4 -4
  86. package/dist/types/components/Notification/stories/__mock__/index.d.ts +1 -0
  87. package/dist/types/components/Pagination/appearance/paginationAccent.d.ts +21 -0
  88. package/dist/types/components/Pagination/appearance/paginationSize.d.ts +57 -0
  89. package/dist/types/components/Pagination/appearance/paginationStyle.d.ts +14 -0
  90. package/dist/types/components/Pagination/appearance/paginationSurface.d.ts +2 -15
  91. package/dist/types/components/Search/appearance/searchDefault.d.ts +1 -1
  92. package/dist/types/components/Search/appearance/searchDisabled.d.ts +1 -1
  93. package/dist/types/components/Search/appearance/searchError.d.ts +1 -1
  94. package/dist/types/components/Search/appearance/searchRequire.d.ts +1 -1
  95. package/dist/types/components/Search/appearance/searchStyle.d.ts +8 -7
  96. package/dist/types/components/Search/appearance/searchSuccess.d.ts +1 -1
  97. package/dist/types/components/Segmented/Segmented.interface.d.ts +1 -0
  98. package/dist/types/components/Segmented/appearance/segmentedSuccess.d.ts +1 -1
  99. package/dist/types/components/Segmented/stories/__mock__/index.d.ts +17 -0
  100. package/package.json +5 -5
  101. package/dist/types/components/Choice/appearance/choiceSurface.d.ts +0 -25
@@ -10,8 +10,8 @@ var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDe
10
10
  var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
11
11
  var Button = require('./Button_cjs_CW6ENTbm.js');
12
12
  var Tooltip = require('./Tooltip_cjs_DinScDnC.js');
13
- var Input = require('./Input_cjs_BAVggtkk.js');
14
- var Label = require('./Label_cjs_CZMMdwt5.js');
13
+ var Input = require('./Input_cjs_arr_wxD2.js');
14
+ var Label = require('./Label_cjs_BWbVsB-u.js');
15
15
  var Text = require('./Text_cjs_C9fOm0nd.js');
16
16
  var _default = require('@itcase/icons/default');
17
17
 
@@ -21,16 +21,16 @@ var datePickerSize = {
21
21
  daySize: 'xs',
22
22
  dayTextSize: 'm',
23
23
  iconFillSize: 24,
24
- iconLeft: _default.icons14.Arrow.Chevron_Left,
25
- iconRight: _default.icons14.Arrow.Chevron_Right,
24
+ iconLeft: _default.icons14.Arrow.ChevronLeft,
25
+ iconRight: _default.icons14.Arrow.ChevronRight,
26
26
  },
27
27
  sizeM: {
28
28
  size: 'm',
29
29
  daySize: 'xxl',
30
30
  dayTextSize: 'm',
31
31
  iconFillSize: 24,
32
- iconLeft: _default.icons14.Arrow.Chevron_Left,
33
- iconRight: _default.icons14.Arrow.Chevron_Right,
32
+ iconLeft: _default.icons14.Arrow.ChevronLeft,
33
+ iconRight: _default.icons14.Arrow.ChevronRight,
34
34
  iconSize: 14,
35
35
  monthTextSize: 'm',
36
36
  yearTextSize: 'm',
@@ -40,8 +40,8 @@ var datePickerSize = {
40
40
  daySize: 'xs',
41
41
  dayTextSize: 'm',
42
42
  iconFillSize: 24,
43
- iconLeft: _default.icons14.Arrow.Chevron_Left,
44
- iconRight: _default.icons14.Arrow.Chevron_Right,
43
+ iconLeft: _default.icons14.Arrow.ChevronLeft,
44
+ iconRight: _default.icons14.Arrow.ChevronRight,
45
45
  },
46
46
  };
47
47
 
@@ -56,13 +56,13 @@ var datePickerStyle = {
56
56
  fill: 'none',
57
57
  },
58
58
  },
59
+ full: {},
59
60
  ghost: {
60
61
  inputProps: {
61
62
  fill: 'none',
62
63
  borderColor: 'none',
63
64
  },
64
65
  },
65
- full: {},
66
66
  };
67
67
 
68
68
  var datePickerAppearanceSurface = {
@@ -8,8 +8,8 @@ import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevi
8
8
  import { useStyles } from './hooks/useStyles/useStyles.js';
9
9
  import { B as Button } from './Button_es_DTUagqgU.js';
10
10
  import { I as Icon } from './Tooltip_es_B0nm9irO.js';
11
- import { I as Input } from './Input_es_CNduH28G.js';
12
- import { L as Label } from './Label_es_DmDqs4Rc.js';
11
+ import { I as Input } from './Input_es_BW6cZThr.js';
12
+ import { L as Label } from './Label_es_ouC2i_iI.js';
13
13
  import { T as Text } from './Text_es_BfLRfj-5.js';
14
14
  import { icons14 } from '@itcase/icons/default';
15
15
 
@@ -19,16 +19,16 @@ var datePickerSize = {
19
19
  daySize: 'xs',
20
20
  dayTextSize: 'm',
21
21
  iconFillSize: 24,
22
- iconLeft: icons14.Arrow.Chevron_Left,
23
- iconRight: icons14.Arrow.Chevron_Right,
22
+ iconLeft: icons14.Arrow.ChevronLeft,
23
+ iconRight: icons14.Arrow.ChevronRight,
24
24
  },
25
25
  sizeM: {
26
26
  size: 'm',
27
27
  daySize: 'xxl',
28
28
  dayTextSize: 'm',
29
29
  iconFillSize: 24,
30
- iconLeft: icons14.Arrow.Chevron_Left,
31
- iconRight: icons14.Arrow.Chevron_Right,
30
+ iconLeft: icons14.Arrow.ChevronLeft,
31
+ iconRight: icons14.Arrow.ChevronRight,
32
32
  iconSize: 14,
33
33
  monthTextSize: 'm',
34
34
  yearTextSize: 'm',
@@ -38,8 +38,8 @@ var datePickerSize = {
38
38
  daySize: 'xs',
39
39
  dayTextSize: 'm',
40
40
  iconFillSize: 24,
41
- iconLeft: icons14.Arrow.Chevron_Left,
42
- iconRight: icons14.Arrow.Chevron_Right,
41
+ iconLeft: icons14.Arrow.ChevronLeft,
42
+ iconRight: icons14.Arrow.ChevronRight,
43
43
  },
44
44
  };
45
45
 
@@ -54,13 +54,13 @@ var datePickerStyle = {
54
54
  fill: 'none',
55
55
  },
56
56
  },
57
+ full: {},
57
58
  ghost: {
58
59
  inputProps: {
59
60
  fill: 'none',
60
61
  borderColor: 'none',
61
62
  },
62
63
  },
63
- full: {},
64
64
  };
65
65
 
66
66
  var datePickerAppearanceSurface = {
@@ -10,7 +10,7 @@ var inputAppearanceDefault = {
10
10
  defaultPrimary: {
11
11
  fill: 'surfaceSecondary',
12
12
  borderColor: 'surfaceBorderTertiary',
13
- borderHover: 'surfaceBorderQuaternary',
13
+ borderColorHover: 'surfaceBorderQuaternary',
14
14
  textColor: 'surfaceTextPrimary',
15
15
  textColorDisabled: 'surfaceTextDisabled',
16
16
  caret: 'secondaryItemSecondary',
@@ -20,7 +20,7 @@ var inputAppearanceDefault = {
20
20
  defaultSecondary: {
21
21
  fill: 'surfacePrimary',
22
22
  borderColor: 'surfaceBorderTertiary',
23
- borderHover: 'surfaceBorderQuaternary',
23
+ borderColorHover: 'surfaceBorderQuaternary',
24
24
  textColor: 'surfaceTextPrimary',
25
25
  textColorDisabled: 'surfaceTextDisabled',
26
26
  caret: 'secondaryItemSecondary',
@@ -34,7 +34,7 @@ var inputAppearanceDisabled = {
34
34
  disabledPrimary: {
35
35
  fill: 'surfaceFillDisabled',
36
36
  borderColor: 'errorBorderQuaternary',
37
- borderHover: 'errorBorderQuaternary',
37
+ borderColorHover: 'errorBorderQuaternary',
38
38
  textColor: 'surfaceTextQuaternary',
39
39
  iconBeforeFill: 'errorItemQuaternary',
40
40
  iconClearFill: 'errorItemPrimary',
@@ -43,7 +43,7 @@ var inputAppearanceDisabled = {
43
43
  disabledSecondary: {
44
44
  fill: 'surfaceSecondary',
45
45
  borderColor: 'surfaceBorderTertiary',
46
- borderHover: 'surfaceBorderQuaternary',
46
+ borderColorHover: 'surfaceBorderQuaternary',
47
47
  iconBeforeFill: 'surfaceItemQuaternary',
48
48
  iconClearFill: 'surfaceItemPrimary',
49
49
  placeholderTextColor: 'surfaceTextSecondary',
@@ -54,7 +54,7 @@ var inputAppearanceError = {
54
54
  errorPrimary: {
55
55
  fill: 'errorTertiary',
56
56
  borderColor: 'errorBorderQuaternary',
57
- borderHover: 'errorBorderQuaternary',
57
+ borderColorHover: 'errorBorderQuaternary',
58
58
  textColor: 'surfaceTextPrimary',
59
59
  iconBeforeFill: 'errorItemQuaternary',
60
60
  iconClearFill: 'errorItemPrimary',
@@ -63,7 +63,7 @@ var inputAppearanceError = {
63
63
  errorSecondary: {
64
64
  fill: 'errorSecondary',
65
65
  borderColor: 'errorBorderTertiary',
66
- borderHover: 'errorBorderQuaternary',
66
+ borderColorHover: 'errorBorderQuaternary',
67
67
  iconBeforeFill: 'errorItemQuaternary',
68
68
  iconClearFill: 'errorItemPrimary',
69
69
  placeholderTextColor: 'errorTextSecondary',
@@ -74,7 +74,7 @@ var inputAppearanceRequire = {
74
74
  requirePrimary: {
75
75
  fill: 'warningTertiary',
76
76
  borderColor: 'warningBorderQuaternary',
77
- borderHover: 'warningBorderQuaternary',
77
+ borderColorHover: 'warningBorderQuaternary',
78
78
  textColor: 'surfaceTextPrimary',
79
79
  iconBeforeFill: 'warningItemQuaternary',
80
80
  iconClearFill: 'warningItemPrimary',
@@ -83,7 +83,7 @@ var inputAppearanceRequire = {
83
83
  requireSecondary: {
84
84
  fill: 'surfaceSecondary',
85
85
  borderColor: 'surfaceBorderTertiary',
86
- borderHover: 'surfaceBorderQuaternary',
86
+ borderColorHover: 'surfaceBorderQuaternary',
87
87
  iconBeforeFill: 'surfaceItemQuaternary',
88
88
  iconClearFill: 'surfaceItemPrimary',
89
89
  placeholderTextColor: 'surfaceTextSecondary',
@@ -122,18 +122,17 @@ var inputAppearanceSize = {
122
122
  };
123
123
 
124
124
  var inputAppearanceStyle = {
125
- full: {
126
- /* border / fill */
127
- },
128
- ghost: {
129
- fill: 'none',
130
- borderWidth: '0',
125
+ solid: {
126
+ borderColor: 'none',
131
127
  },
132
128
  outlined: {
133
129
  fill: 'none',
134
130
  },
135
- solid: {
136
- borderWidth: '0',
131
+ full: {},
132
+ ghost: {
133
+ fill: 'none',
134
+ borderColor: 'none',
135
+ borderColorHover: 'none',
137
136
  },
138
137
  };
139
138
 
@@ -141,7 +140,7 @@ var inputAppearanceSuccess = {
141
140
  successPrimary: {
142
141
  fill: 'successTertiary',
143
142
  borderColor: 'successBorderQuaternary',
144
- borderHover: 'successBorderQuaternary',
143
+ borderColorHover: 'successBorderQuaternary',
145
144
  textColor: 'surfaceTextPrimary',
146
145
  iconBeforeFill: 'successItemQuaternary',
147
146
  iconClearFill: 'successItemPrimary',
@@ -150,7 +149,7 @@ var inputAppearanceSuccess = {
150
149
  successSecondary: {
151
150
  fill: 'surfaceSecondary',
152
151
  borderColor: 'surfaceBorderTertiary',
153
- borderHover: 'surfaceBorderQuaternary',
152
+ borderColorHover: 'surfaceBorderQuaternary',
154
153
  iconBeforeFill: 'surfaceItemQuaternary',
155
154
  iconClearFill: 'surfaceItemPrimary',
156
155
  placeholderTextColor: 'surfaceTextSecondary',
@@ -176,13 +175,15 @@ var Input = React.forwardRef(function Input(props, ref) {
176
175
  }, {});
177
176
  // const stateConfig = state && inputConfig.state && inputConfig.state[state]
178
177
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
179
- var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
178
+ var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
180
179
  return (jsxRuntime.jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "input_shape_".concat(shapeClass), textColorClass && "text-color_".concat(textColorClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), !isDisabled
181
180
  ? fillClass && "fill_".concat(fillClass)
182
181
  : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
183
182
  ? borderWidthClass && "border-width_".concat(borderWidthClass)
184
183
  : borderWidthDisabledClass &&
185
- "border-width_disabled_".concat(borderWidthDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, !isDisabled
184
+ "border-width_disabled_".concat(borderWidthDisabledClass), !isDisabled && fillHoverClass ? "fill_hover_".concat(fillHoverClass) : null, !isDisabled && borderColorHoverClass
185
+ ? "border-color_hover_".concat(borderColorHoverClass)
186
+ : null, !isDisabled
186
187
  ? borderColorClass && "border-color_".concat(borderColorClass)
187
188
  : borderColorDisabledClass &&
188
189
  "border-color_disabled_".concat(borderColorDisabledClass), !isDisabled
@@ -8,7 +8,7 @@ var inputAppearanceDefault = {
8
8
  defaultPrimary: {
9
9
  fill: 'surfaceSecondary',
10
10
  borderColor: 'surfaceBorderTertiary',
11
- borderHover: 'surfaceBorderQuaternary',
11
+ borderColorHover: 'surfaceBorderQuaternary',
12
12
  textColor: 'surfaceTextPrimary',
13
13
  textColorDisabled: 'surfaceTextDisabled',
14
14
  caret: 'secondaryItemSecondary',
@@ -18,7 +18,7 @@ var inputAppearanceDefault = {
18
18
  defaultSecondary: {
19
19
  fill: 'surfacePrimary',
20
20
  borderColor: 'surfaceBorderTertiary',
21
- borderHover: 'surfaceBorderQuaternary',
21
+ borderColorHover: 'surfaceBorderQuaternary',
22
22
  textColor: 'surfaceTextPrimary',
23
23
  textColorDisabled: 'surfaceTextDisabled',
24
24
  caret: 'secondaryItemSecondary',
@@ -32,7 +32,7 @@ var inputAppearanceDisabled = {
32
32
  disabledPrimary: {
33
33
  fill: 'surfaceFillDisabled',
34
34
  borderColor: 'errorBorderQuaternary',
35
- borderHover: 'errorBorderQuaternary',
35
+ borderColorHover: 'errorBorderQuaternary',
36
36
  textColor: 'surfaceTextQuaternary',
37
37
  iconBeforeFill: 'errorItemQuaternary',
38
38
  iconClearFill: 'errorItemPrimary',
@@ -41,7 +41,7 @@ var inputAppearanceDisabled = {
41
41
  disabledSecondary: {
42
42
  fill: 'surfaceSecondary',
43
43
  borderColor: 'surfaceBorderTertiary',
44
- borderHover: 'surfaceBorderQuaternary',
44
+ borderColorHover: 'surfaceBorderQuaternary',
45
45
  iconBeforeFill: 'surfaceItemQuaternary',
46
46
  iconClearFill: 'surfaceItemPrimary',
47
47
  placeholderTextColor: 'surfaceTextSecondary',
@@ -52,7 +52,7 @@ var inputAppearanceError = {
52
52
  errorPrimary: {
53
53
  fill: 'errorTertiary',
54
54
  borderColor: 'errorBorderQuaternary',
55
- borderHover: 'errorBorderQuaternary',
55
+ borderColorHover: 'errorBorderQuaternary',
56
56
  textColor: 'surfaceTextPrimary',
57
57
  iconBeforeFill: 'errorItemQuaternary',
58
58
  iconClearFill: 'errorItemPrimary',
@@ -61,7 +61,7 @@ var inputAppearanceError = {
61
61
  errorSecondary: {
62
62
  fill: 'errorSecondary',
63
63
  borderColor: 'errorBorderTertiary',
64
- borderHover: 'errorBorderQuaternary',
64
+ borderColorHover: 'errorBorderQuaternary',
65
65
  iconBeforeFill: 'errorItemQuaternary',
66
66
  iconClearFill: 'errorItemPrimary',
67
67
  placeholderTextColor: 'errorTextSecondary',
@@ -72,7 +72,7 @@ var inputAppearanceRequire = {
72
72
  requirePrimary: {
73
73
  fill: 'warningTertiary',
74
74
  borderColor: 'warningBorderQuaternary',
75
- borderHover: 'warningBorderQuaternary',
75
+ borderColorHover: 'warningBorderQuaternary',
76
76
  textColor: 'surfaceTextPrimary',
77
77
  iconBeforeFill: 'warningItemQuaternary',
78
78
  iconClearFill: 'warningItemPrimary',
@@ -81,7 +81,7 @@ var inputAppearanceRequire = {
81
81
  requireSecondary: {
82
82
  fill: 'surfaceSecondary',
83
83
  borderColor: 'surfaceBorderTertiary',
84
- borderHover: 'surfaceBorderQuaternary',
84
+ borderColorHover: 'surfaceBorderQuaternary',
85
85
  iconBeforeFill: 'surfaceItemQuaternary',
86
86
  iconClearFill: 'surfaceItemPrimary',
87
87
  placeholderTextColor: 'surfaceTextSecondary',
@@ -120,18 +120,17 @@ var inputAppearanceSize = {
120
120
  };
121
121
 
122
122
  var inputAppearanceStyle = {
123
- full: {
124
- /* border / fill */
125
- },
126
- ghost: {
127
- fill: 'none',
128
- borderWidth: '0',
123
+ solid: {
124
+ borderColor: 'none',
129
125
  },
130
126
  outlined: {
131
127
  fill: 'none',
132
128
  },
133
- solid: {
134
- borderWidth: '0',
129
+ full: {},
130
+ ghost: {
131
+ fill: 'none',
132
+ borderColor: 'none',
133
+ borderColorHover: 'none',
135
134
  },
136
135
  };
137
136
 
@@ -139,7 +138,7 @@ var inputAppearanceSuccess = {
139
138
  successPrimary: {
140
139
  fill: 'successTertiary',
141
140
  borderColor: 'successBorderQuaternary',
142
- borderHover: 'successBorderQuaternary',
141
+ borderColorHover: 'successBorderQuaternary',
143
142
  textColor: 'surfaceTextPrimary',
144
143
  iconBeforeFill: 'successItemQuaternary',
145
144
  iconClearFill: 'successItemPrimary',
@@ -148,7 +147,7 @@ var inputAppearanceSuccess = {
148
147
  successSecondary: {
149
148
  fill: 'surfaceSecondary',
150
149
  borderColor: 'surfaceBorderTertiary',
151
- borderHover: 'surfaceBorderQuaternary',
150
+ borderColorHover: 'surfaceBorderQuaternary',
152
151
  iconBeforeFill: 'surfaceItemQuaternary',
153
152
  iconClearFill: 'surfaceItemPrimary',
154
153
  placeholderTextColor: 'surfaceTextSecondary',
@@ -174,13 +173,15 @@ var Input = React.forwardRef(function Input(props, ref) {
174
173
  }, {});
175
174
  // const stateConfig = state && inputConfig.state && inputConfig.state[state]
176
175
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
177
- var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
176
+ var fillClass = propsGenerator.fillClass, fillDisabledClass = propsGenerator.fillDisabledClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorDisabledClass = propsGenerator.borderColorDisabledClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderWidthClass = propsGenerator.borderWidthClass, borderWidthDisabledClass = propsGenerator.borderWidthDisabledClass, textColorClass = propsGenerator.textColorClass, textColorDisabledClass = propsGenerator.textColorDisabledClass, textSizeClass = propsGenerator.textSizeClass, textWeightClass = propsGenerator.textWeightClass, placeholderTextColorDisabledClass = propsGenerator.placeholderTextColorDisabledClass, caretClass = propsGenerator.caretClass, placeholderTextColorClass = propsGenerator.placeholderTextColorClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
178
177
  return (jsx("input", { id: String(id), className: clsx(className, 'input', type === 'number' && 'input_type_number', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && "caret-color_".concat(caretClass), shapeClass && "input_shape_".concat(shapeClass), textColorClass && "text-color_".concat(textColorClass), textSizeClass && "text_size_".concat(textSizeClass), textWeightClass && "text-weight_".concat(textWeightClass), widthClass && "width_".concat(widthClass), sizeClass && "input_size_".concat(sizeClass), !isDisabled
179
178
  ? fillClass && "fill_".concat(fillClass)
180
179
  : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled
181
180
  ? borderWidthClass && "border-width_".concat(borderWidthClass)
182
181
  : borderWidthDisabledClass &&
183
- "border-width_disabled_".concat(borderWidthDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, !isDisabled
182
+ "border-width_disabled_".concat(borderWidthDisabledClass), !isDisabled && fillHoverClass ? "fill_hover_".concat(fillHoverClass) : null, !isDisabled && borderColorHoverClass
183
+ ? "border-color_hover_".concat(borderColorHoverClass)
184
+ : null, !isDisabled
184
185
  ? borderColorClass && "border-color_".concat(borderColorClass)
185
186
  : borderColorDisabledClass &&
186
187
  "border-color_disabled_".concat(borderColorDisabledClass), !isDisabled
@@ -113,7 +113,7 @@ var labelAppearanceError = {
113
113
  };
114
114
 
115
115
  var labelAppearanceInfo = {
116
- infoMuted: {
116
+ infoMutedPrimary: {
117
117
  fill: 'infoMuted',
118
118
  labelTextColor: 'infoMutedTextPrimary',
119
119
  labelTextColorHover: 'infoMutedTextPrimary',
@@ -373,10 +373,10 @@ function Label(props) {
373
373
  return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
374
374
  }, {});
375
375
  var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
376
- var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc; propsGenerator.iconBadgeAppearance; propsGenerator.iconBadgeShape; propsGenerator.iconBadgeSize; propsGenerator.iconBadgeTextColor; propsGenerator.iconBadgeTextSize; propsGenerator.iconBadgeValue; var iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
376
+ var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
377
377
  // @ts-expect-error
378
378
  var labelStyles = useStyles.useStyles(props).styles;
379
- return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Tooltip.Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Tooltip.Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
379
+ return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Tooltip.Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsxRuntime.jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Tooltip.Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
380
380
  }
381
381
 
382
382
  exports.Label = Label;
@@ -111,7 +111,7 @@ var labelAppearanceError = {
111
111
  };
112
112
 
113
113
  var labelAppearanceInfo = {
114
- infoMuted: {
114
+ infoMutedPrimary: {
115
115
  fill: 'infoMuted',
116
116
  labelTextColor: 'infoMutedTextPrimary',
117
117
  labelTextColorHover: 'infoMutedTextPrimary',
@@ -371,10 +371,10 @@ function Label(props) {
371
371
  return (__assign(__assign({}, resultConfig), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
372
372
  }, {});
373
373
  var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
374
- var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc; propsGenerator.iconBadgeAppearance; propsGenerator.iconBadgeShape; propsGenerator.iconBadgeSize; propsGenerator.iconBadgeTextColor; propsGenerator.iconBadgeTextSize; propsGenerator.iconBadgeValue; var iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
374
+ var alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextColor = propsGenerator.labelTextColor, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterFillIcon = propsGenerator.iconAfterFillIcon, iconAfterFillSize = propsGenerator.iconAfterFillSize, iconAfterShape = propsGenerator.iconAfterShape, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeFillIcon = propsGenerator.iconBeforeFillIcon, iconBeforeFillSize = propsGenerator.iconBeforeFillSize, iconBeforeShape = propsGenerator.iconBeforeShape, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, shapeClass = propsGenerator.shapeClass, sizeClass = propsGenerator.sizeClass, tooltipAlignment = propsGenerator.tooltipAlignment, tooltipAppearance = propsGenerator.tooltipAppearance, tooltipArrowPosition = propsGenerator.tooltipArrowPosition, tooltipContent = propsGenerator.tooltipContent, tooltipText = propsGenerator.tooltipText, tooltipTextSize = propsGenerator.tooltipTextSize, tooltipTitle = propsGenerator.tooltipTitle, tooltipTitleSize = propsGenerator.tooltipTitleSize, widthClass = propsGenerator.widthClass, wrapClass = propsGenerator.wrapClass;
375
375
  // @ts-expect-error
376
376
  var labelStyles = useStyles(props).styles;
377
- return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
377
+ return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), mode && "label_mode_".concat(mode), isSkeleton && "label_skeleton", onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: clsx('label__icon_before'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__text", size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })) : (jsx("div", { className: "label__text", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", appearance: tooltipAppearance, alignment: tooltipAlignment, title: tooltipTitle, titleSize: tooltipTitleSize, text: tooltipText, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, ref: tooltipRef, children: tooltipContent }))] }), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: clsx('label__icon_after'), fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), after] }));
378
378
  }
379
379
 
380
380
  export { Label as L, labelAppearance as a, labelConfig as l };
@@ -1,5 +1,7 @@
1
1
  'use strict';
2
2
 
3
+ var _default = require('@itcase/icons/default');
4
+
3
5
  var breadcrumbsListMock = {
4
6
  breadcrumbsList: [
5
7
  {
@@ -7,45 +9,35 @@ var breadcrumbsListMock = {
7
9
  key: 1,
8
10
  text: 'Text 123',
9
11
  href: '/',
10
- // "Placeholder" is removed from @itcase/icons.
11
- // Use url to ".storybook/assets/icons/placeholder.svg"
12
- // icon: icons16.Placeholder,
12
+ icon: _default.icons16.Placeholder.Default,
13
13
  },
14
14
  {
15
15
  id: '2',
16
16
  key: 2,
17
17
  text: 'Text 123',
18
18
  href: '/',
19
- // "Placeholder" is removed from @itcase/icons.
20
- // Use url to ".storybook/assets/icons/placeholder.svg"
21
- // icon: icons16.Placeholder,
19
+ icon: _default.icons16.Placeholder.Default,
22
20
  },
23
21
  {
24
22
  id: '3',
25
23
  key: 3,
26
24
  text: 'Text 123',
27
25
  href: '/',
28
- // "Placeholder" is removed from @itcase/icons.
29
- // Use url to ".storybook/assets/icons/placeholder.svg"
30
- // icon: icons16.Placeholder,
26
+ icon: _default.icons16.Placeholder.Default,
31
27
  },
32
28
  {
33
29
  id: '4',
34
30
  key: 4,
35
31
  text: 'Text 123',
36
32
  href: '/',
37
- // "Placeholder" is removed from @itcase/icons.
38
- // Use url to ".storybook/assets/icons/placeholder.svg"
39
- // icon: icons16.Placeholder,
33
+ icon: _default.icons16.Placeholder.Default,
40
34
  },
41
35
  {
42
36
  id: '5',
43
37
  key: 5,
44
38
  text: 'Text 123',
45
39
  href: '/',
46
- // "Placeholder" is removed from @itcase/icons.
47
- // Use url to ".storybook/assets/icons/placeholder.svg"
48
- // icon: icons16.Placeholder,
40
+ icon: _default.icons16.Placeholder.Default,
49
41
  },
50
42
  ],
51
43
  };
@@ -6,7 +6,7 @@ var clsx = require('clsx');
6
6
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
7
7
  var useStyles = require('../hooks/useStyles/useStyles.js');
8
8
  var Tooltip = require('../../Tooltip_cjs_DinScDnC.js');
9
- var Label = require('../../Label_cjs_CZMMdwt5.js');
9
+ var Label = require('../../Label_cjs_BWbVsB-u.js');
10
10
  var Text = require('../../Text_cjs_C9fOm0nd.js');
11
11
  require('react');
12
12
  require('lodash/camelCase');
@@ -9,32 +9,32 @@ var choiceListMock = {
9
9
  choices: [
10
10
  {
11
11
  label: 'Label 1',
12
- iconAfter: _default.icon24.Placeholder,
13
- iconBefore: _default.icon24.Placeholder,
12
+ iconAfter: _default.icons24.Placeholder,
13
+ iconBefore: _default.icons24.Placeholder,
14
14
  value: 1,
15
15
  },
16
16
  {
17
17
  label: 'Label 2',
18
- iconAfter: _default.icon24.Placeholder,
19
- iconBefore: _default.icon24.Placeholder,
18
+ iconAfter: _default.icons24.Placeholder,
19
+ iconBefore: _default.icons24.Placeholder,
20
20
  value: 2,
21
21
  },
22
22
  {
23
23
  label: 'Label 3',
24
- iconAfter: _default.icon24.Placeholder,
25
- iconBefore: _default.icon24.Placeholder,
24
+ iconAfter: _default.icons24.Placeholder,
25
+ iconBefore: _default.icons24.Placeholder,
26
26
  value: 3,
27
27
  },
28
28
  {
29
29
  label: 'Label 4',
30
- iconAfter: _default.icon24.Placeholder,
31
- iconBefore: _default.icon24.Placeholder,
30
+ iconAfter: _default.icons24.Placeholder,
31
+ iconBefore: _default.icons24.Placeholder,
32
32
  value: 4,
33
33
  },
34
34
  {
35
35
  label: 'Label 5',
36
- iconAfter: _default.icon24.Placeholder,
37
- iconBefore: _default.icon24.Placeholder,
36
+ iconAfter: _default.icons24.Placeholder,
37
+ iconBefore: _default.icons24.Placeholder,
38
38
  value: 5,
39
39
  },
40
40
  ],
@@ -45,23 +45,23 @@ var choiceListIconMock = {
45
45
  },
46
46
  choices: [
47
47
  {
48
- icon: _default.icon24.Placeholder,
48
+ icon: _default.icons24.Placeholder,
49
49
  value: 1,
50
50
  },
51
51
  {
52
- icon: _default.icon24.Placeholder,
52
+ icon: _default.icons24.Placeholder,
53
53
  value: 2,
54
54
  },
55
55
  {
56
- icon: _default.icon24.Placeholder,
56
+ icon: _default.icons24.Placeholder,
57
57
  value: 3,
58
58
  },
59
59
  {
60
- icon: _default.icon24.Placeholder,
60
+ icon: _default.icons24.Placeholder,
61
61
  value: 4,
62
62
  },
63
63
  {
64
- icon: _default.icon24.Placeholder,
64
+ icon: _default.icons24.Placeholder,
65
65
  value: 5,
66
66
  },
67
67
  ],