@itcase/ui 1.8.33 → 1.8.35
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.
- package/dist/{ChipsGroup_cjs_DdWjvr_S.js → ChipsGroup_cjs_j3QOma3U.js} +49 -17
- package/dist/{ChipsGroup_es_CXS0aeon.js → ChipsGroup_es_DF1fhn97.js} +49 -17
- package/dist/{DatePicker_cjs_CJl9V32f.js → DatePicker_cjs_Bx5_lZNT.js} +23 -27
- package/dist/{DatePicker_es_C2Pi6aB-.js → DatePicker_es_A1FcasHs.js} +24 -28
- package/dist/{DropdownItem_cjs_D-zoX7Ik.js → DropdownItem_cjs_tH2DBClp.js} +4 -2
- package/dist/{DropdownItem_es_BMnIhUSe.js → DropdownItem_es_BeVv-pDA.js} +4 -2
- package/dist/{Label_cjs_CZMMdwt5.js → Label_cjs_CP4b6Mg2.js} +13 -85
- package/dist/{Label_es_DmDqs4Rc.js → Label_es_DFSiy5sL.js} +13 -85
- package/dist/cjs/components/Cell.js +1 -1
- package/dist/cjs/components/Chips.js +1 -1
- package/dist/cjs/components/Choice/stories/__mock__.js +15 -15
- package/dist/cjs/components/Choice.js +33 -28
- package/dist/cjs/components/DatePeriod.js +6 -4
- package/dist/cjs/components/DatePicker.js +2 -2
- package/dist/cjs/components/Dropdown/stories/__mock__.js +2 -2
- package/dist/cjs/components/Dropdown.js +1 -1
- package/dist/cjs/components/Label.js +1 -1
- package/dist/cjs/components/MenuItem.js +11 -6
- package/dist/cjs/components/Notification/stories/__mock__.js +4 -0
- package/dist/cjs/components/Notification.js +27 -9
- package/dist/cjs/components/Pagination.js +19 -10
- package/dist/cjs/components/Segmented/stories/__mock__.js +38 -0
- package/dist/cjs/components/Segmented.js +12 -9
- package/dist/components/Cell.js +1 -1
- package/dist/components/Chips.js +1 -1
- package/dist/components/Choice/stories/__mock__.js +16 -16
- package/dist/components/Choice.js +33 -28
- package/dist/components/DatePeriod.js +6 -4
- package/dist/components/DatePicker.js +2 -2
- package/dist/components/Dropdown/stories/__mock__.js +2 -2
- package/dist/components/Dropdown.js +1 -1
- package/dist/components/Label.js +1 -1
- package/dist/components/MenuItem.js +11 -6
- package/dist/components/Notification/stories/__mock__.js +4 -0
- package/dist/components/Notification.js +27 -9
- package/dist/components/Pagination.js +20 -11
- package/dist/components/Segmented/stories/__mock__.js +36 -0
- package/dist/components/Segmented.js +12 -9
- package/dist/css/components/Dropdown/Dropdown.css +7 -14
- package/dist/css/components/Notification/Notification.css +23 -0
- package/dist/css/components/Pagination/Pagination.css +19 -6
- package/dist/css/components/Segmented/Segmented.css +24 -0
- package/dist/css/styles/shape-strength/shape-strength.css +4 -9
- package/dist/stories/CellOverview.mdx +3 -2
- package/dist/stories/DatePeriodPlayground.mdx +2 -2
- package/dist/stories/RangeSliderOverview.mdx +0 -3
- package/dist/stories/VideoOverview.mdx +2 -10
- package/dist/stories/VideoPlayground.mdx +2 -2
- package/dist/types/components/Chips/appearance/chipsSize.d.ts +34 -0
- package/dist/types/components/Chips/appearance/chipsStyle.d.ts +7 -9
- package/dist/types/components/Choice/appearance/choiceDefault.d.ts +7 -0
- package/dist/types/components/Choice/appearance/choiceDisabled.d.ts +7 -0
- package/dist/types/components/Choice/appearance/choiceRequire.d.ts +6 -0
- package/dist/types/components/Choice/appearance/choiceStyle.d.ts +4 -0
- package/dist/types/components/Choice/appearance/choiceSuccess.d.ts +6 -0
- package/dist/types/components/Choice/stories/__mock__/index.d.ts +9 -3
- package/dist/types/components/Label/appearance/labelAccent.d.ts +0 -8
- package/dist/types/components/Label/appearance/labelDanger.d.ts +0 -12
- package/dist/types/components/Label/appearance/labelDisable.d.ts +0 -2
- package/dist/types/components/Label/appearance/labelError.d.ts +0 -8
- package/dist/types/components/Label/appearance/labelInfo.d.ts +1 -6
- package/dist/types/components/Label/appearance/labelPrimary.d.ts +0 -10
- package/dist/types/components/Label/appearance/labelSecondary.d.ts +0 -10
- package/dist/types/components/Label/appearance/labelSize.d.ts +6 -0
- package/dist/types/components/Label/appearance/labelStyle.d.ts +4 -4
- package/dist/types/components/Label/appearance/labelSuccess.d.ts +0 -8
- package/dist/types/components/Label/appearance/labelSurface.d.ts +0 -6
- package/dist/types/components/Label/appearance/labelWarning.d.ts +0 -9
- package/dist/types/components/MenuItem/appearance/menuItemAccent.d.ts +1 -0
- package/dist/types/components/MenuItem/appearance/menuItemError.d.ts +1 -0
- package/dist/types/components/MenuItem/appearance/menuItemStyle.d.ts +6 -4
- package/dist/types/components/MenuItem/appearance/menuItemSurface.d.ts +1 -0
- package/dist/types/components/Notification/appearance/notificationInfo.d.ts +17 -0
- package/dist/types/components/Notification/appearance/notificationStyle.d.ts +4 -4
- package/dist/types/components/Notification/stories/__mock__/index.d.ts +1 -0
- package/dist/types/components/Pagination/appearance/paginationSize.d.ts +12 -0
- package/dist/types/components/Pagination/appearance/paginationSurface.d.ts +0 -5
- package/dist/types/components/Segmented/Segmented.interface.d.ts +1 -0
- package/dist/types/components/Segmented/appearance/segmentedSuccess.d.ts +1 -1
- package/dist/types/components/Segmented/stories/__mock__/index.d.ts +17 -0
- package/package.json +5 -5
- package/dist/types/components/Choice/appearance/choiceSurface.d.ts +0 -25
|
@@ -10,15 +10,9 @@ var Tooltip = require('./Tooltip_cjs_DinScDnC.js');
|
|
|
10
10
|
var Text = require('./Text_cjs_C9fOm0nd.js');
|
|
11
11
|
|
|
12
12
|
var labelAppearanceAccent = {
|
|
13
|
-
accent: {
|
|
14
|
-
fill: 'accentPrimary',
|
|
15
|
-
labelTextColor: 'accentTextPrimary',
|
|
16
|
-
labelTextColorHover: 'accentTextPrimary',
|
|
17
|
-
},
|
|
18
13
|
accentMutedPrimary: {
|
|
19
14
|
fill: 'accentTertiary',
|
|
20
15
|
labelTextColor: 'accentTextQuaternary',
|
|
21
|
-
labelTextColorHover: 'accentTextQuaternary',
|
|
22
16
|
borderColor: 'accentBorderSecondary',
|
|
23
17
|
iconAfterFillIcon: 'accentItemQuaternary',
|
|
24
18
|
iconBeforeFillIcon: 'accentItemQuaternary',
|
|
@@ -26,7 +20,6 @@ var labelAppearanceAccent = {
|
|
|
26
20
|
accentPrimary: {
|
|
27
21
|
fill: 'accentPrimary',
|
|
28
22
|
labelTextColor: 'accentTextPrimary',
|
|
29
|
-
labelTextColorHover: 'accentTextPrimary',
|
|
30
23
|
borderColor: 'accentBorderSecondary',
|
|
31
24
|
iconAfterFillIcon: 'accentItemPrimary',
|
|
32
25
|
iconBeforeFillIcon: 'accentItemPrimary',
|
|
@@ -34,33 +27,20 @@ var labelAppearanceAccent = {
|
|
|
34
27
|
accentTertiary: {
|
|
35
28
|
fill: 'accentTertiary',
|
|
36
29
|
labelTextColor: 'accentTextPrimary',
|
|
37
|
-
labelTextColorHover: 'accentTextPrimary',
|
|
38
30
|
},
|
|
39
31
|
};
|
|
40
32
|
|
|
41
33
|
var labelAppearanceDanger = {
|
|
42
|
-
danger: {
|
|
43
|
-
fill: 'dangerPrimary',
|
|
44
|
-
fillHover: 'dangerPrimaryHover',
|
|
45
|
-
labelTextColor: 'dangerTextPrimary',
|
|
46
|
-
labelTextColorHover: 'dangerTextSecondary',
|
|
47
|
-
borderColor: 'dangerBorderSecondary',
|
|
48
|
-
iconAfterFillIcon: 'dangerItemPrimary',
|
|
49
|
-
iconBeforeFillIcon: 'dangerItemPrimary',
|
|
50
|
-
},
|
|
51
34
|
dangerMutedPrimary: {
|
|
52
35
|
fill: 'dangerTertiary',
|
|
53
36
|
labelTextColor: 'dangerTextQuaternary',
|
|
54
|
-
labelTextColorHover: 'dangerTextQuaternary',
|
|
55
37
|
borderColor: 'dangerBorderQuaternary',
|
|
56
38
|
iconAfterFillIcon: 'dangerItemQuaternary',
|
|
57
39
|
iconBeforeFillIcon: 'dangerItemQuaternary',
|
|
58
40
|
},
|
|
59
41
|
dangerPrimary: {
|
|
60
42
|
fill: 'dangerPrimary',
|
|
61
|
-
fillHover: 'dangerPrimaryHover',
|
|
62
43
|
labelTextColor: 'dangerTextPrimary',
|
|
63
|
-
labelTextColorHover: 'dangerTextSecondary',
|
|
64
44
|
borderColor: 'dangerBorderSecondary',
|
|
65
45
|
iconAfterFillIcon: 'dangerItemPrimary',
|
|
66
46
|
iconBeforeFillIcon: 'dangerItemPrimary',
|
|
@@ -71,7 +51,6 @@ var labelAppearanceDisable = {
|
|
|
71
51
|
disablePrimary: {
|
|
72
52
|
fill: 'disablePrimary',
|
|
73
53
|
labelTextColor: 'disableTextPrimary',
|
|
74
|
-
labelTextColorHover: 'disableTextPrimary',
|
|
75
54
|
borderColor: 'disableBorderPrimary',
|
|
76
55
|
iconAfterFillIcon: 'disableItemPrimary',
|
|
77
56
|
iconBeforeFillIcon: 'disableItemPrimary',
|
|
@@ -79,7 +58,6 @@ var labelAppearanceDisable = {
|
|
|
79
58
|
disableMuted: {
|
|
80
59
|
fill: 'disableMuted',
|
|
81
60
|
labelTextColor: 'disableMutedTextPrimary',
|
|
82
|
-
labelTextColorHover: 'disableMutedTextPrimary',
|
|
83
61
|
borderColor: 'disableMutedBorderSecondary',
|
|
84
62
|
iconAfterFillIcon: 'disableMutedItemPrimary',
|
|
85
63
|
iconBeforeFillIcon: 'disableMutedItemPrimary',
|
|
@@ -87,16 +65,9 @@ var labelAppearanceDisable = {
|
|
|
87
65
|
};
|
|
88
66
|
|
|
89
67
|
var labelAppearanceError = {
|
|
90
|
-
error: {
|
|
91
|
-
fill: 'errorPrimary',
|
|
92
|
-
fillHover: 'errorPrimaryHover',
|
|
93
|
-
labelTextColor: 'errorTextPrimary',
|
|
94
|
-
labelTextColorHover: 'errorTextPrimary',
|
|
95
|
-
},
|
|
96
68
|
errorMutedPrimary: {
|
|
97
69
|
fill: 'errorDisabled',
|
|
98
70
|
labelTextColor: 'errorTextQuaternary',
|
|
99
|
-
labelTextColorHover: 'errorTextQuaternary',
|
|
100
71
|
borderColor: 'errorBorderSecondary',
|
|
101
72
|
iconAfterFillIcon: 'errorItemQuaternary',
|
|
102
73
|
iconBeforeFillIcon: 'errorItemQuaternary',
|
|
@@ -105,7 +76,6 @@ var labelAppearanceError = {
|
|
|
105
76
|
fill: 'errorPrimary',
|
|
106
77
|
fillHover: 'errorPrimaryHover',
|
|
107
78
|
labelTextColor: 'errorTextPrimary',
|
|
108
|
-
labelTextColorHover: 'errorTextPrimary',
|
|
109
79
|
borderColor: 'errorBorderSecondary',
|
|
110
80
|
iconAfterFillIcon: 'errorItemPrimary',
|
|
111
81
|
iconBeforeFillIcon: 'errorItemPrimary',
|
|
@@ -113,28 +83,23 @@ var labelAppearanceError = {
|
|
|
113
83
|
};
|
|
114
84
|
|
|
115
85
|
var labelAppearanceInfo = {
|
|
116
|
-
|
|
86
|
+
infoMutedPrimary: {
|
|
117
87
|
fill: 'infoMuted',
|
|
118
88
|
labelTextColor: 'infoMutedTextPrimary',
|
|
119
|
-
labelTextColorHover: 'infoMutedTextPrimary',
|
|
120
89
|
borderColor: 'infoMutedBorderSecondary',
|
|
121
90
|
iconAfterFillIcon: 'infoMutedItemPrimary',
|
|
122
91
|
iconBeforeFillIcon: 'infoMutedItemPrimary',
|
|
123
92
|
},
|
|
124
93
|
infoPrimary: {
|
|
125
94
|
fill: 'infoPrimary',
|
|
126
|
-
fillHover: 'infoPrimaryHover',
|
|
127
95
|
labelTextColor: 'infoTextPrimary',
|
|
128
|
-
labelTextColorHover: 'infoTextPrimary',
|
|
129
96
|
borderColor: 'infoBorderPrimary',
|
|
130
97
|
iconAfterFillIcon: 'infoItemPrimary',
|
|
131
98
|
iconBeforeFillIcon: 'infoItemPrimary',
|
|
132
99
|
},
|
|
133
100
|
infoSecondary: {
|
|
134
101
|
fill: 'infoPrimary',
|
|
135
|
-
fillHover: 'infoPrimaryHover',
|
|
136
102
|
labelTextColor: 'infoTextPrimary',
|
|
137
|
-
labelTextColorHover: 'infoTextSecondary',
|
|
138
103
|
borderColor: 'infoBorderSecondary',
|
|
139
104
|
iconAfterFillIcon: 'infoItemPrimary',
|
|
140
105
|
iconBeforeFillIcon: 'infoItemPrimary',
|
|
@@ -142,18 +107,9 @@ var labelAppearanceInfo = {
|
|
|
142
107
|
};
|
|
143
108
|
|
|
144
109
|
var labelAppearancePrimary = {
|
|
145
|
-
primary: {
|
|
146
|
-
fill: 'primaryPrimary',
|
|
147
|
-
labelTextColor: 'primaryTextPrimary',
|
|
148
|
-
labelTextColorHover: 'primaryTextPrimary',
|
|
149
|
-
borderColor: 'primaryBorderSecondary',
|
|
150
|
-
iconAfterFillIcon: 'dangerItemPrimary',
|
|
151
|
-
iconBeforeFillIcon: 'dangerItemPrimary',
|
|
152
|
-
},
|
|
153
110
|
primaryMutedPrimary: {
|
|
154
111
|
fill: 'primaryDisabled',
|
|
155
112
|
labelTextColor: 'primaryTextSecondary',
|
|
156
|
-
labelTextColorHover: 'primaryTextSecondary',
|
|
157
113
|
borderColor: 'primaryBorderTertiary',
|
|
158
114
|
iconAfterFillIcon: 'primaryItemSecondary',
|
|
159
115
|
iconBeforeFillIcon: 'primaryItemSecondary',
|
|
@@ -161,7 +117,6 @@ var labelAppearancePrimary = {
|
|
|
161
117
|
primaryPrimary: {
|
|
162
118
|
fill: 'primaryPrimary',
|
|
163
119
|
labelTextColor: 'primaryTextPrimary',
|
|
164
|
-
labelTextColorHover: 'primaryTextPrimary',
|
|
165
120
|
borderColor: 'primaryBorderSecondary',
|
|
166
121
|
iconAfterFillIcon: 'dangerItemPrimary',
|
|
167
122
|
iconBeforeFillIcon: 'dangerItemPrimary',
|
|
@@ -169,18 +124,9 @@ var labelAppearancePrimary = {
|
|
|
169
124
|
};
|
|
170
125
|
|
|
171
126
|
var labelAppearanceSecondary = {
|
|
172
|
-
secondary: {
|
|
173
|
-
fill: 'secondaryPrimary',
|
|
174
|
-
labelTextColor: 'secondaryTextPrimary',
|
|
175
|
-
labelTextColorHover: 'secondaryTextPrimary',
|
|
176
|
-
borderColor: 'secondaryBorderPrimary',
|
|
177
|
-
iconAfterFillIcon: 'secondaryItemPrimary',
|
|
178
|
-
iconBeforeFillIcon: 'secondaryItemPrimary',
|
|
179
|
-
},
|
|
180
127
|
secondaryMutedPrimary: {
|
|
181
128
|
fill: 'secondaryDisabled',
|
|
182
129
|
labelTextColor: 'secondaryTextQuaternary',
|
|
183
|
-
labelTextColorHover: 'secondaryTextQuaternary',
|
|
184
130
|
borderColor: 'secondaryBorderDisabled',
|
|
185
131
|
iconAfterFillIcon: 'secondaryItemQuaternary',
|
|
186
132
|
iconBeforeFillIcon: 'secondaryItemQuaternary',
|
|
@@ -188,7 +134,6 @@ var labelAppearanceSecondary = {
|
|
|
188
134
|
secondaryPrimary: {
|
|
189
135
|
fill: 'secondaryPrimary',
|
|
190
136
|
labelTextColor: 'secondaryTextPrimary',
|
|
191
|
-
labelTextColorHover: 'secondaryTextPrimary',
|
|
192
137
|
borderColor: 'secondaryBorderPrimary',
|
|
193
138
|
iconAfterFillIcon: 'secondaryItemPrimary',
|
|
194
139
|
iconBeforeFillIcon: 'secondaryItemPrimary',
|
|
@@ -205,6 +150,7 @@ var labelAppearanceSize = {
|
|
|
205
150
|
iconBeforeSize: 24,
|
|
206
151
|
},
|
|
207
152
|
sizeXL: {
|
|
153
|
+
size: 'xl',
|
|
208
154
|
labelTextSize: 'l',
|
|
209
155
|
iconAfterFillSize: 24,
|
|
210
156
|
iconAfterSize: 24,
|
|
@@ -212,6 +158,7 @@ var labelAppearanceSize = {
|
|
|
212
158
|
iconBeforeSize: 24,
|
|
213
159
|
},
|
|
214
160
|
sizeL: {
|
|
161
|
+
size: 'l',
|
|
215
162
|
labelTextSize: 'l',
|
|
216
163
|
iconAfterFillSize: 24,
|
|
217
164
|
iconAfterSize: 24,
|
|
@@ -219,6 +166,7 @@ var labelAppearanceSize = {
|
|
|
219
166
|
iconBeforeSize: 24,
|
|
220
167
|
},
|
|
221
168
|
sizeM: {
|
|
169
|
+
size: 'm',
|
|
222
170
|
labelTextSize: 'm',
|
|
223
171
|
iconAfterFillSize: 24,
|
|
224
172
|
iconAfterSize: 24,
|
|
@@ -226,6 +174,7 @@ var labelAppearanceSize = {
|
|
|
226
174
|
iconBeforeSize: 24,
|
|
227
175
|
},
|
|
228
176
|
sizeS: {
|
|
177
|
+
size: 's',
|
|
229
178
|
labelTextSize: 's',
|
|
230
179
|
iconAfterFillSize: 20,
|
|
231
180
|
iconAfterSize: 20,
|
|
@@ -233,6 +182,7 @@ var labelAppearanceSize = {
|
|
|
233
182
|
iconBeforeSize: 20,
|
|
234
183
|
},
|
|
235
184
|
sizeXS: {
|
|
185
|
+
size: 'xs',
|
|
236
186
|
labelTextSize: 'xs',
|
|
237
187
|
iconAfterFillSize: 16,
|
|
238
188
|
iconAfterSize: 16,
|
|
@@ -240,6 +190,7 @@ var labelAppearanceSize = {
|
|
|
240
190
|
iconBeforeSize: 16,
|
|
241
191
|
},
|
|
242
192
|
sizeXXS: {
|
|
193
|
+
size: 'xxs',
|
|
243
194
|
labelTextSize: 'xs',
|
|
244
195
|
iconAfterFillSize: 14,
|
|
245
196
|
iconAfterSize: 14,
|
|
@@ -249,30 +200,23 @@ var labelAppearanceSize = {
|
|
|
249
200
|
};
|
|
250
201
|
|
|
251
202
|
var labelAppearanceStyle = {
|
|
252
|
-
|
|
253
|
-
ghost: {
|
|
254
|
-
fill: 'none',
|
|
203
|
+
solid: {
|
|
255
204
|
borderColor: 'none',
|
|
256
205
|
},
|
|
257
206
|
outlined: {
|
|
258
207
|
fill: 'none',
|
|
259
208
|
},
|
|
260
|
-
|
|
209
|
+
full: {},
|
|
210
|
+
ghost: {
|
|
211
|
+
fill: 'none',
|
|
261
212
|
borderColor: 'none',
|
|
262
213
|
},
|
|
263
214
|
};
|
|
264
215
|
|
|
265
216
|
var labelAppearanceSuccess = {
|
|
266
|
-
success: {
|
|
267
|
-
fill: 'successPrimary',
|
|
268
|
-
fillHover: 'successPrimaryHover',
|
|
269
|
-
labelTextColor: 'successTextSecondary',
|
|
270
|
-
labelTextColorHover: 'successTextSecondary',
|
|
271
|
-
},
|
|
272
217
|
successMutedPrimary: {
|
|
273
218
|
fill: 'successTertiary',
|
|
274
219
|
labelTextColor: 'successTextQuaternary',
|
|
275
|
-
labelTextColorHover: 'successTextQuaternary',
|
|
276
220
|
borderColor: 'successBorderQuaternary',
|
|
277
221
|
iconAfterFillIcon: 'successItemQuaternary',
|
|
278
222
|
iconBeforeFillIcon: 'successItemQuaternary',
|
|
@@ -281,7 +225,6 @@ var labelAppearanceSuccess = {
|
|
|
281
225
|
fill: 'successPrimary',
|
|
282
226
|
fillHover: 'successPrimaryHover',
|
|
283
227
|
labelTextColor: 'successTextPrimary',
|
|
284
|
-
labelTextColorHover: 'successTextSecondary',
|
|
285
228
|
borderColor: 'successBorderSecondary',
|
|
286
229
|
iconAfterFillIcon: 'successItemPrimary',
|
|
287
230
|
iconBeforeFillIcon: 'successItemPrimary',
|
|
@@ -292,16 +235,13 @@ var labelAppearanceSurface = {
|
|
|
292
235
|
surfaceMutedPrimary: {
|
|
293
236
|
fill: 'surfaceSecondary',
|
|
294
237
|
labelTextColor: 'surfaceTextQuaternary',
|
|
295
|
-
labelTextColorHover: 'surfaceTextQuaternary',
|
|
296
238
|
borderColor: 'surfaceBorderQuaternary',
|
|
297
239
|
iconAfterFillIcon: 'surfaceItemQuaternary',
|
|
298
240
|
iconBeforeFillIcon: 'surfaceItemQuaternary',
|
|
299
241
|
},
|
|
300
242
|
surfacePrimary: {
|
|
301
243
|
fill: 'surfacePrimary',
|
|
302
|
-
fillHover: 'surfacePrimaryHover',
|
|
303
244
|
labelTextColor: 'surfaceTextPrimary',
|
|
304
|
-
labelTextColorHover: 'surfaceTextPrimary',
|
|
305
245
|
borderColor: 'surfaceBorderQuaternary',
|
|
306
246
|
iconAfterFillIcon: 'surfaceItemPrimary',
|
|
307
247
|
iconBeforeFillIcon: 'surfaceItemPrimary',
|
|
@@ -309,40 +249,28 @@ var labelAppearanceSurface = {
|
|
|
309
249
|
surfaceSecondary: {
|
|
310
250
|
fill: 'surfaceSecondary',
|
|
311
251
|
labelTextColor: 'surfaceTextPrimary',
|
|
312
|
-
labelTextColorHover: 'surfaceTextPrimary',
|
|
313
252
|
},
|
|
314
253
|
surfaceTertiary: {
|
|
315
254
|
fill: 'surfaceTertiary',
|
|
316
255
|
labelTextColor: 'surfaceTextPrimary',
|
|
317
|
-
labelTextColorHover: 'surfaceTextPrimary',
|
|
318
256
|
},
|
|
319
257
|
surfaceQuaternary: {
|
|
320
258
|
fill: 'surfaceQuaternary',
|
|
321
259
|
labelTextColor: 'surfaceTextInverse',
|
|
322
|
-
labelTextColorHover: 'surfaceTextInverse',
|
|
323
260
|
},
|
|
324
261
|
};
|
|
325
262
|
|
|
326
263
|
var labelAppearanceWarning = {
|
|
327
|
-
warning: {
|
|
328
|
-
fill: 'warningPrimary',
|
|
329
|
-
fillHover: 'warningPrimaryHover',
|
|
330
|
-
labelTextColor: 'warningTextSecondary',
|
|
331
|
-
labelTextColorHover: 'warningTextSecondary',
|
|
332
|
-
},
|
|
333
264
|
warningMutedPrimary: {
|
|
334
265
|
fill: 'warningTertiary',
|
|
335
266
|
labelTextColor: 'warningTextSecondary',
|
|
336
|
-
labelTextColorHover: 'warningTextSecondary',
|
|
337
267
|
borderColor: 'warningBorderSecondary',
|
|
338
268
|
iconAfterFillIcon: 'warningItemSecondary',
|
|
339
269
|
iconBeforeFillIcon: 'warningItemSecondary',
|
|
340
270
|
},
|
|
341
271
|
warningPrimary: {
|
|
342
272
|
fill: 'warningPrimary',
|
|
343
|
-
fillHover: 'warningPrimaryHover',
|
|
344
273
|
labelTextColor: 'warningTextPrimary',
|
|
345
|
-
labelTextColorHover: 'warningTextSecondary',
|
|
346
274
|
borderColor: 'warningBorderSecondary',
|
|
347
275
|
iconAfterFillIcon: 'warningItemPrimary',
|
|
348
276
|
iconBeforeFillIcon: 'warningItemPrimary',
|
|
@@ -373,10 +301,10 @@ function Label(props) {
|
|
|
373
301
|
return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = labelConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
|
|
374
302
|
}, {});
|
|
375
303
|
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,
|
|
304
|
+
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
305
|
// @ts-expect-error
|
|
378
306
|
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 && "
|
|
307
|
+
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
308
|
}
|
|
381
309
|
|
|
382
310
|
exports.Label = Label;
|