@itcase/ui 1.9.23 → 1.9.25
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/{Avatar_cjs_DRZE113U.js → Avatar_cjs_CS01fvh-.js} +11 -5
- package/dist/{Avatar_es_Cmq4xAG6.js → Avatar_es_DRObE1DB.js} +11 -5
- package/dist/{ChipsGroup_cjs_D0bGehZY.js → ChipsGroup_cjs_Sn3uiCSJ.js} +33 -33
- package/dist/{ChipsGroup_es_DWvsJ5bu.js → ChipsGroup_es_CbzUWqG9.js} +33 -33
- package/dist/{DatePicker_cjs_Cm50AX0J.js → DatePicker_cjs_Bfiav-tb.js} +1 -1
- package/dist/{DatePicker_es_B-WPA9y9.js → DatePicker_es_CtbVXMmy.js} +1 -1
- package/dist/{Group_cjs_CFzdSMKV.js → Group_cjs_DNI9PTBq.js} +3 -3
- package/dist/{Group_es_BwTj-yH-.js → Group_es_nBtACpoG.js} +3 -3
- package/dist/{SelectContainer_cjs_tjM35jHG.js → SelectContainer_cjs_CdLyIuwj.js} +1 -1
- package/dist/{SelectContainer_es_BKIz5i19.js → SelectContainer_es_DGTrm8OT.js} +1 -1
- package/dist/cjs/components/Avatar.js +1 -1
- package/dist/cjs/components/AvatarStack.js +2 -2
- package/dist/cjs/components/Button.js +1 -1
- package/dist/cjs/components/Cell.js +12 -16
- package/dist/cjs/components/Chips.js +1 -1
- package/dist/cjs/components/Code.js +17 -17
- package/dist/cjs/components/CookiesWarning.js +1 -1
- package/dist/cjs/components/DatePeriod.js +5 -5
- package/dist/cjs/components/DatePicker.js +2 -2
- package/dist/cjs/components/Group.js +1 -1
- package/dist/cjs/components/Notification.js +1 -1
- package/dist/cjs/components/Response.js +2 -2
- package/dist/cjs/components/Select.js +2 -2
- package/dist/cjs/components/Swiper.js +1 -1
- package/dist/cjs/components/Textarea.js +9 -21
- package/dist/cjs/components/Video.js +1 -1
- package/dist/cjs/components/Warning.js +2 -2
- package/dist/components/Avatar.js +1 -1
- package/dist/components/AvatarStack.js +2 -2
- package/dist/components/Button.js +1 -1
- package/dist/components/Cell.js +12 -16
- package/dist/components/Chips.js +1 -1
- package/dist/components/Code.js +17 -17
- package/dist/components/CookiesWarning.js +1 -1
- package/dist/components/DatePeriod.js +5 -5
- package/dist/components/DatePicker.js +2 -2
- package/dist/components/Group.js +1 -1
- package/dist/components/Notification.js +1 -1
- package/dist/components/Response.js +2 -2
- package/dist/components/Select.js +2 -2
- package/dist/components/Swiper.js +1 -1
- package/dist/components/Textarea.js +9 -21
- package/dist/components/Video.js +1 -1
- package/dist/components/Warning.js +2 -2
- package/dist/css/styles/bundles.css +25 -6
- package/dist/snippets/Group.snippets.json +1 -1
- package/dist/types/components/Button/Button.d.ts +1 -1
- package/dist/types/components/Button/Button.interface.d.ts +1 -1
- package/dist/types/components/Cell/Cell.appearance.d.ts +2 -2
- package/dist/types/components/Cell/Cell.interface.d.ts +67 -56
- package/dist/types/components/Cell/appearance/cellSize.d.ts +2 -58
- package/dist/types/components/Cell/appearance/cellStyle.d.ts +2 -13
- package/dist/types/components/Cell/appearance/cellSurface.d.ts +2 -54
- package/dist/types/components/Chips/Chips.interface.d.ts +83 -21
- package/dist/types/components/Chips/ChipsGroup.d.ts +2 -1
- package/dist/types/components/Chips/appearance/chipsAccent.d.ts +2 -23
- package/dist/types/components/Chips/appearance/chipsDanger.d.ts +2 -16
- package/dist/types/components/Chips/appearance/chipsDisabled.d.ts +2 -13
- package/dist/types/components/Chips/appearance/chipsError.d.ts +2 -16
- package/dist/types/components/Chips/appearance/chipsInfo.d.ts +2 -16
- package/dist/types/components/Chips/appearance/chipsPrimary.d.ts +2 -16
- package/dist/types/components/Chips/appearance/chipsSecondary.d.ts +2 -16
- package/dist/types/components/Chips/appearance/chipsShape.d.ts +2 -24
- package/dist/types/components/Chips/appearance/chipsSize.d.ts +2 -44
- package/dist/types/components/Chips/appearance/chipsStyle.d.ts +2 -13
- package/dist/types/components/Chips/appearance/chipsSuccess.d.ts +2 -16
- package/dist/types/components/Chips/appearance/chipsSurface.d.ts +2 -45
- package/dist/types/components/Chips/appearance/chipsWarning.d.ts +2 -16
- package/dist/types/components/Code/Code.appearance.d.ts +2 -2
- package/dist/types/components/Code/Code.interface.d.ts +32 -33
- package/dist/types/components/Code/appearance/codeDefault.d.ts +2 -10
- package/dist/types/components/Code/appearance/codeDisabled.d.ts +2 -11
- package/dist/types/components/Code/appearance/codeError.d.ts +2 -11
- package/dist/types/components/Code/appearance/codeRequire.d.ts +2 -11
- package/dist/types/components/Code/appearance/codeShape.d.ts +2 -24
- package/dist/types/components/Code/appearance/codeSize.d.ts +2 -12
- package/dist/types/components/Code/appearance/codeStyle.d.ts +2 -15
- package/dist/types/components/Code/appearance/codeSuccess.d.ts +2 -11
- package/dist/types/components/Dot/Dot.interface.d.ts +5 -5
- package/dist/types/components/Group/Group.appearance.d.ts +2 -2
- package/dist/types/components/Group/Group.d.ts +53 -2
- package/dist/types/components/Group/Group.interface.d.ts +48 -36
- package/dist/types/components/Textarea/Textarea.appearance.d.ts +2 -2
- package/dist/types/components/Textarea/Textarea.interface.d.ts +25 -22
- package/dist/types/components/Textarea/appearance/textareaDefault.d.ts +2 -36
- package/dist/types/components/Textarea/appearance/textareaDisabled.d.ts +2 -19
- package/dist/types/components/Textarea/appearance/textareaError.d.ts +2 -19
- package/dist/types/components/Textarea/appearance/textareaRequire.d.ts +2 -19
- package/dist/types/components/Textarea/appearance/textareaShape.d.ts +2 -24
- package/dist/types/components/Textarea/appearance/textareaSize.d.ts +2 -30
- package/dist/types/components/Textarea/appearance/textareaStyle.d.ts +2 -15
- package/dist/types/components/Textarea/appearance/textareaSuccess.d.ts +2 -20
- package/dist/types/components/Title/Title.appearance.d.ts +513 -456
- package/dist/types/components/Title/Title.interface.d.ts +11 -9
- package/dist/types/components/Video/Video.interface.d.ts +3 -6
- package/dist/types/components/Warning/Warning.appearance.d.ts +1276 -121
- package/dist/types/components/Warning/Warning.interface.d.ts +38 -34
- package/dist/types/components/Warning/appearance/warningAccent.d.ts +2 -22
- package/dist/types/components/Warning/appearance/warningError.d.ts +2 -22
- package/dist/types/components/Warning/appearance/warningInfo.d.ts +2 -22
- package/dist/types/components/Warning/appearance/warningShape.d.ts +2 -24
- package/dist/types/components/Warning/appearance/warningSize.d.ts +2 -10
- package/dist/types/components/Warning/appearance/warningStyle.d.ts +2 -13
- package/dist/types/components/Warning/appearance/warningWarning.d.ts +2 -22
- package/package.json +1 -1
- package/dist/{Button_cjs_BRShPZw4.js → Button_cjs_DPs7uj_n.js} +1 -1
- package/dist/{Button_es_CvRcO3xM.js → Button_es_ljlle2Pu.js} +1 -1
|
@@ -60,25 +60,25 @@ const avatarAppearanceShape = {
|
|
|
60
60
|
const avatarAppearanceSize = {
|
|
61
61
|
size16: {
|
|
62
62
|
size: '16',
|
|
63
|
-
textSize: '
|
|
63
|
+
textSize: 'xs',
|
|
64
64
|
badgeAppearanceSize: 'sizeXXS',
|
|
65
65
|
iconFillSize: '12',
|
|
66
66
|
},
|
|
67
67
|
size20: {
|
|
68
68
|
size: '20',
|
|
69
|
-
textSize: '
|
|
69
|
+
textSize: 'xs',
|
|
70
70
|
badgeAppearanceSize: 'sizeXXS',
|
|
71
71
|
iconFillSize: '12',
|
|
72
72
|
},
|
|
73
73
|
size24: {
|
|
74
74
|
size: '24',
|
|
75
|
-
textSize: '
|
|
75
|
+
textSize: 's',
|
|
76
76
|
badgeAppearanceSize: 'sizeXXS',
|
|
77
77
|
iconFillSize: '12',
|
|
78
78
|
},
|
|
79
79
|
size32: {
|
|
80
80
|
size: '32',
|
|
81
|
-
textSize: '
|
|
81
|
+
textSize: 'm',
|
|
82
82
|
badgeAppearanceSize: 'sizeXS',
|
|
83
83
|
iconFillSize: '12',
|
|
84
84
|
},
|
|
@@ -88,9 +88,15 @@ const avatarAppearanceSize = {
|
|
|
88
88
|
badgeAppearanceSize: 'sizeS',
|
|
89
89
|
iconFillSize: '12',
|
|
90
90
|
},
|
|
91
|
+
size48: {
|
|
92
|
+
size: '48',
|
|
93
|
+
textSize: 'l',
|
|
94
|
+
badgeAppearanceSize: 'sizeS',
|
|
95
|
+
iconFillSize: '12',
|
|
96
|
+
},
|
|
91
97
|
size56: {
|
|
92
98
|
size: '56',
|
|
93
|
-
textSize: '
|
|
99
|
+
textSize: 'xl',
|
|
94
100
|
badgeAppearanceSize: 'sizeM',
|
|
95
101
|
iconFillSize: '16',
|
|
96
102
|
},
|
|
@@ -58,25 +58,25 @@ const avatarAppearanceShape = {
|
|
|
58
58
|
const avatarAppearanceSize = {
|
|
59
59
|
size16: {
|
|
60
60
|
size: '16',
|
|
61
|
-
textSize: '
|
|
61
|
+
textSize: 'xs',
|
|
62
62
|
badgeAppearanceSize: 'sizeXXS',
|
|
63
63
|
iconFillSize: '12',
|
|
64
64
|
},
|
|
65
65
|
size20: {
|
|
66
66
|
size: '20',
|
|
67
|
-
textSize: '
|
|
67
|
+
textSize: 'xs',
|
|
68
68
|
badgeAppearanceSize: 'sizeXXS',
|
|
69
69
|
iconFillSize: '12',
|
|
70
70
|
},
|
|
71
71
|
size24: {
|
|
72
72
|
size: '24',
|
|
73
|
-
textSize: '
|
|
73
|
+
textSize: 's',
|
|
74
74
|
badgeAppearanceSize: 'sizeXXS',
|
|
75
75
|
iconFillSize: '12',
|
|
76
76
|
},
|
|
77
77
|
size32: {
|
|
78
78
|
size: '32',
|
|
79
|
-
textSize: '
|
|
79
|
+
textSize: 'm',
|
|
80
80
|
badgeAppearanceSize: 'sizeXS',
|
|
81
81
|
iconFillSize: '12',
|
|
82
82
|
},
|
|
@@ -86,9 +86,15 @@ const avatarAppearanceSize = {
|
|
|
86
86
|
badgeAppearanceSize: 'sizeS',
|
|
87
87
|
iconFillSize: '12',
|
|
88
88
|
},
|
|
89
|
+
size48: {
|
|
90
|
+
size: '48',
|
|
91
|
+
textSize: 'l',
|
|
92
|
+
badgeAppearanceSize: 'sizeS',
|
|
93
|
+
iconFillSize: '12',
|
|
94
|
+
},
|
|
89
95
|
size56: {
|
|
90
96
|
size: '56',
|
|
91
|
-
textSize: '
|
|
97
|
+
textSize: 'xl',
|
|
92
98
|
badgeAppearanceSize: 'sizeM',
|
|
93
99
|
iconFillSize: '16',
|
|
94
100
|
},
|
|
@@ -90,10 +90,10 @@ const chipsAppearanceInfo = {
|
|
|
90
90
|
},
|
|
91
91
|
infoPrimary: {
|
|
92
92
|
fill: 'infoPrimary',
|
|
93
|
-
labelTextColor: '
|
|
94
|
-
borderColor: '
|
|
95
|
-
iconAfterFillIcon: '
|
|
96
|
-
iconBeforeFillIcon: '
|
|
93
|
+
labelTextColor: 'infoTextPrimary',
|
|
94
|
+
borderColor: 'infoBorderPrimary',
|
|
95
|
+
iconAfterFillIcon: 'infoItemPrimary',
|
|
96
|
+
iconBeforeFillIcon: 'infoItemPrimary',
|
|
97
97
|
},
|
|
98
98
|
};
|
|
99
99
|
|
|
@@ -138,21 +138,21 @@ const chipsAppearanceShape = {
|
|
|
138
138
|
rounded: {
|
|
139
139
|
shape: 'rounded',
|
|
140
140
|
},
|
|
141
|
-
|
|
142
|
-
shape: 'rounded',
|
|
143
|
-
shapeStrength: '0_5m',
|
|
144
|
-
},
|
|
145
|
-
roundedM: {
|
|
141
|
+
roundedXL: {
|
|
146
142
|
shape: 'rounded',
|
|
147
|
-
shapeStrength: '
|
|
143
|
+
shapeStrength: '2m',
|
|
148
144
|
},
|
|
149
145
|
roundedL: {
|
|
150
146
|
shape: 'rounded',
|
|
151
147
|
shapeStrength: '1_5m',
|
|
152
148
|
},
|
|
153
|
-
|
|
149
|
+
roundedM: {
|
|
154
150
|
shape: 'rounded',
|
|
155
|
-
shapeStrength: '
|
|
151
|
+
shapeStrength: '1m',
|
|
152
|
+
},
|
|
153
|
+
roundedS: {
|
|
154
|
+
shape: 'rounded',
|
|
155
|
+
shapeStrength: '0_5m',
|
|
156
156
|
},
|
|
157
157
|
};
|
|
158
158
|
|
|
@@ -160,44 +160,44 @@ const chipsAppearanceSize = {
|
|
|
160
160
|
sizeXXL: {
|
|
161
161
|
size: 'xxl',
|
|
162
162
|
labelTextSize: 'xl',
|
|
163
|
-
iconAfterSize: 24,
|
|
164
|
-
iconBeforeSize: 24,
|
|
163
|
+
iconAfterSize: '24',
|
|
164
|
+
iconBeforeSize: '24',
|
|
165
165
|
},
|
|
166
166
|
sizeXL: {
|
|
167
167
|
size: 'xl',
|
|
168
168
|
labelTextSize: 'm',
|
|
169
|
-
iconAfterSize: 20,
|
|
170
|
-
iconBeforeSize: 20,
|
|
169
|
+
iconAfterSize: '20',
|
|
170
|
+
iconBeforeSize: '20',
|
|
171
171
|
},
|
|
172
172
|
sizeL: {
|
|
173
173
|
size: 'l',
|
|
174
174
|
labelTextSize: 'm',
|
|
175
|
-
iconAfterSize: 16,
|
|
176
|
-
iconBeforeSize: 16,
|
|
175
|
+
iconAfterSize: '16',
|
|
176
|
+
iconBeforeSize: '16',
|
|
177
177
|
},
|
|
178
178
|
sizeM: {
|
|
179
179
|
size: 'm',
|
|
180
180
|
labelTextSize: 's',
|
|
181
|
-
iconAfterSize: 16,
|
|
182
|
-
iconBeforeSize: 16,
|
|
181
|
+
iconAfterSize: '16',
|
|
182
|
+
iconBeforeSize: '16',
|
|
183
183
|
},
|
|
184
184
|
sizeS: {
|
|
185
185
|
size: 's',
|
|
186
186
|
labelTextSize: 's',
|
|
187
|
-
iconAfterSize: 16,
|
|
188
|
-
iconBeforeSize: 16,
|
|
187
|
+
iconAfterSize: '16',
|
|
188
|
+
iconBeforeSize: '16',
|
|
189
189
|
},
|
|
190
190
|
sizeXS: {
|
|
191
191
|
size: 'xs',
|
|
192
192
|
labelTextSize: 'xs',
|
|
193
|
-
iconAfterSize: 14,
|
|
194
|
-
iconBeforeSize: 14,
|
|
193
|
+
iconAfterSize: '14',
|
|
194
|
+
iconBeforeSize: '14',
|
|
195
195
|
},
|
|
196
196
|
sizeXXS: {
|
|
197
197
|
size: 'xxs',
|
|
198
198
|
labelTextSize: 'xxs',
|
|
199
|
-
iconAfterSize: 12,
|
|
200
|
-
iconBeforeSize: 12,
|
|
199
|
+
iconAfterSize: '12',
|
|
200
|
+
iconBeforeSize: '12',
|
|
201
201
|
},
|
|
202
202
|
};
|
|
203
203
|
|
|
@@ -244,7 +244,7 @@ const chipsAppearanceSurface = {
|
|
|
244
244
|
fill: 'surfacePrimary',
|
|
245
245
|
fillActive: 'accentPrimary',
|
|
246
246
|
fillActiveHover: 'accentSecondary',
|
|
247
|
-
fillHover: '
|
|
247
|
+
fillHover: 'surfaceHoverTertiary',
|
|
248
248
|
labelTextActiveColor: 'accentTextPrimary',
|
|
249
249
|
labelTextColor: 'surfaceTextPrimary',
|
|
250
250
|
labelTextColorHover: 'surfaceTextPrimary',
|
|
@@ -260,7 +260,7 @@ const chipsAppearanceSurface = {
|
|
|
260
260
|
fill: 'surfaceSecondary',
|
|
261
261
|
fillActive: 'accentPrimary',
|
|
262
262
|
fillActiveHover: 'accentSecondary',
|
|
263
|
-
fillHover: '
|
|
263
|
+
fillHover: 'surfaceHoverTertiary',
|
|
264
264
|
labelTextActiveColor: 'accentTextPrimary',
|
|
265
265
|
labelTextColor: 'surfaceTextPrimary',
|
|
266
266
|
labelTextColorHover: 'surfaceTextPrimary',
|
|
@@ -272,7 +272,7 @@ const chipsAppearanceSurface = {
|
|
|
272
272
|
},
|
|
273
273
|
surfaceTertiary: {
|
|
274
274
|
fill: 'surfaceTertiary',
|
|
275
|
-
fillHover: '
|
|
275
|
+
fillHover: 'surfaceHoverTertiary',
|
|
276
276
|
labelTextColor: 'surfaceTextPrimary',
|
|
277
277
|
borderColor: 'surfaceBorderTertiary',
|
|
278
278
|
},
|
|
@@ -318,16 +318,16 @@ const chipsConfig = {
|
|
|
318
318
|
},
|
|
319
319
|
};
|
|
320
320
|
function Chips(props) {
|
|
321
|
-
const { appearance, className, dataTestId, dataTour, label = '',
|
|
321
|
+
const { appearance, className, dataTestId, dataTour, label = '', isActive, isDisabled, isSkeleton, onClick, onClickIconAfter, onClickIconBefore, children, } = props;
|
|
322
322
|
const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, chipsConfig, isDisabled);
|
|
323
323
|
const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
324
|
-
const { alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, cursorClass, iconAfterFill, iconAfterFillActiveIcon, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconBeforeFill, iconBeforeFillActiveIcon, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
|
|
324
|
+
const { alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, cursorClass, iconAfter, iconAfterFill, iconAfterFillActiveIcon, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillActiveIcon, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
|
|
325
325
|
const { styles: chipsStyles } = useStyles.useStyles(props);
|
|
326
326
|
return (jsxRuntime.jsx("div", { className: clsx(className, 'chips', !isActive
|
|
327
327
|
? fillClass && `fill_${fillClass}`
|
|
328
328
|
: fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
|
|
329
329
|
? fillHoverClass && `fill_hover_${fillHoverClass}`
|
|
330
|
-
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-test-id": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxRuntime.jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (jsxRuntime.jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (jsxRuntime.jsx(Icon.Badge, { className: "chips__badge",
|
|
330
|
+
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-test-id": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxRuntime.jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (jsxRuntime.jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (jsxRuntime.jsx(Icon.Badge, { appearance: badgeAppearance, className: "chips__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }) }));
|
|
331
331
|
}
|
|
332
332
|
|
|
333
333
|
function ChipsGroup(props) {
|
|
@@ -338,7 +338,7 @@ function ChipsGroup(props) {
|
|
|
338
338
|
const { styles: groupStyles } = useStyles.useStyles(props);
|
|
339
339
|
return (jsxRuntime.jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-test-id": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: children
|
|
340
340
|
? children
|
|
341
|
-
: chipsList?.map((item) => (jsxRuntime.jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: () => onClick(item) }, item.id))) }));
|
|
341
|
+
: chipsList?.map((item) => (jsxRuntime.jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: (event) => onClick(item, event) }, item.id))) }));
|
|
342
342
|
}
|
|
343
343
|
|
|
344
344
|
exports.Chips = Chips;
|
|
@@ -88,10 +88,10 @@ const chipsAppearanceInfo = {
|
|
|
88
88
|
},
|
|
89
89
|
infoPrimary: {
|
|
90
90
|
fill: 'infoPrimary',
|
|
91
|
-
labelTextColor: '
|
|
92
|
-
borderColor: '
|
|
93
|
-
iconAfterFillIcon: '
|
|
94
|
-
iconBeforeFillIcon: '
|
|
91
|
+
labelTextColor: 'infoTextPrimary',
|
|
92
|
+
borderColor: 'infoBorderPrimary',
|
|
93
|
+
iconAfterFillIcon: 'infoItemPrimary',
|
|
94
|
+
iconBeforeFillIcon: 'infoItemPrimary',
|
|
95
95
|
},
|
|
96
96
|
};
|
|
97
97
|
|
|
@@ -136,21 +136,21 @@ const chipsAppearanceShape = {
|
|
|
136
136
|
rounded: {
|
|
137
137
|
shape: 'rounded',
|
|
138
138
|
},
|
|
139
|
-
|
|
140
|
-
shape: 'rounded',
|
|
141
|
-
shapeStrength: '0_5m',
|
|
142
|
-
},
|
|
143
|
-
roundedM: {
|
|
139
|
+
roundedXL: {
|
|
144
140
|
shape: 'rounded',
|
|
145
|
-
shapeStrength: '
|
|
141
|
+
shapeStrength: '2m',
|
|
146
142
|
},
|
|
147
143
|
roundedL: {
|
|
148
144
|
shape: 'rounded',
|
|
149
145
|
shapeStrength: '1_5m',
|
|
150
146
|
},
|
|
151
|
-
|
|
147
|
+
roundedM: {
|
|
152
148
|
shape: 'rounded',
|
|
153
|
-
shapeStrength: '
|
|
149
|
+
shapeStrength: '1m',
|
|
150
|
+
},
|
|
151
|
+
roundedS: {
|
|
152
|
+
shape: 'rounded',
|
|
153
|
+
shapeStrength: '0_5m',
|
|
154
154
|
},
|
|
155
155
|
};
|
|
156
156
|
|
|
@@ -158,44 +158,44 @@ const chipsAppearanceSize = {
|
|
|
158
158
|
sizeXXL: {
|
|
159
159
|
size: 'xxl',
|
|
160
160
|
labelTextSize: 'xl',
|
|
161
|
-
iconAfterSize: 24,
|
|
162
|
-
iconBeforeSize: 24,
|
|
161
|
+
iconAfterSize: '24',
|
|
162
|
+
iconBeforeSize: '24',
|
|
163
163
|
},
|
|
164
164
|
sizeXL: {
|
|
165
165
|
size: 'xl',
|
|
166
166
|
labelTextSize: 'm',
|
|
167
|
-
iconAfterSize: 20,
|
|
168
|
-
iconBeforeSize: 20,
|
|
167
|
+
iconAfterSize: '20',
|
|
168
|
+
iconBeforeSize: '20',
|
|
169
169
|
},
|
|
170
170
|
sizeL: {
|
|
171
171
|
size: 'l',
|
|
172
172
|
labelTextSize: 'm',
|
|
173
|
-
iconAfterSize: 16,
|
|
174
|
-
iconBeforeSize: 16,
|
|
173
|
+
iconAfterSize: '16',
|
|
174
|
+
iconBeforeSize: '16',
|
|
175
175
|
},
|
|
176
176
|
sizeM: {
|
|
177
177
|
size: 'm',
|
|
178
178
|
labelTextSize: 's',
|
|
179
|
-
iconAfterSize: 16,
|
|
180
|
-
iconBeforeSize: 16,
|
|
179
|
+
iconAfterSize: '16',
|
|
180
|
+
iconBeforeSize: '16',
|
|
181
181
|
},
|
|
182
182
|
sizeS: {
|
|
183
183
|
size: 's',
|
|
184
184
|
labelTextSize: 's',
|
|
185
|
-
iconAfterSize: 16,
|
|
186
|
-
iconBeforeSize: 16,
|
|
185
|
+
iconAfterSize: '16',
|
|
186
|
+
iconBeforeSize: '16',
|
|
187
187
|
},
|
|
188
188
|
sizeXS: {
|
|
189
189
|
size: 'xs',
|
|
190
190
|
labelTextSize: 'xs',
|
|
191
|
-
iconAfterSize: 14,
|
|
192
|
-
iconBeforeSize: 14,
|
|
191
|
+
iconAfterSize: '14',
|
|
192
|
+
iconBeforeSize: '14',
|
|
193
193
|
},
|
|
194
194
|
sizeXXS: {
|
|
195
195
|
size: 'xxs',
|
|
196
196
|
labelTextSize: 'xxs',
|
|
197
|
-
iconAfterSize: 12,
|
|
198
|
-
iconBeforeSize: 12,
|
|
197
|
+
iconAfterSize: '12',
|
|
198
|
+
iconBeforeSize: '12',
|
|
199
199
|
},
|
|
200
200
|
};
|
|
201
201
|
|
|
@@ -242,7 +242,7 @@ const chipsAppearanceSurface = {
|
|
|
242
242
|
fill: 'surfacePrimary',
|
|
243
243
|
fillActive: 'accentPrimary',
|
|
244
244
|
fillActiveHover: 'accentSecondary',
|
|
245
|
-
fillHover: '
|
|
245
|
+
fillHover: 'surfaceHoverTertiary',
|
|
246
246
|
labelTextActiveColor: 'accentTextPrimary',
|
|
247
247
|
labelTextColor: 'surfaceTextPrimary',
|
|
248
248
|
labelTextColorHover: 'surfaceTextPrimary',
|
|
@@ -258,7 +258,7 @@ const chipsAppearanceSurface = {
|
|
|
258
258
|
fill: 'surfaceSecondary',
|
|
259
259
|
fillActive: 'accentPrimary',
|
|
260
260
|
fillActiveHover: 'accentSecondary',
|
|
261
|
-
fillHover: '
|
|
261
|
+
fillHover: 'surfaceHoverTertiary',
|
|
262
262
|
labelTextActiveColor: 'accentTextPrimary',
|
|
263
263
|
labelTextColor: 'surfaceTextPrimary',
|
|
264
264
|
labelTextColorHover: 'surfaceTextPrimary',
|
|
@@ -270,7 +270,7 @@ const chipsAppearanceSurface = {
|
|
|
270
270
|
},
|
|
271
271
|
surfaceTertiary: {
|
|
272
272
|
fill: 'surfaceTertiary',
|
|
273
|
-
fillHover: '
|
|
273
|
+
fillHover: 'surfaceHoverTertiary',
|
|
274
274
|
labelTextColor: 'surfaceTextPrimary',
|
|
275
275
|
borderColor: 'surfaceBorderTertiary',
|
|
276
276
|
},
|
|
@@ -316,16 +316,16 @@ const chipsConfig = {
|
|
|
316
316
|
},
|
|
317
317
|
};
|
|
318
318
|
function Chips(props) {
|
|
319
|
-
const { appearance, className, dataTestId, dataTour, label = '',
|
|
319
|
+
const { appearance, className, dataTestId, dataTour, label = '', isActive, isDisabled, isSkeleton, onClick, onClickIconAfter, onClickIconBefore, children, } = props;
|
|
320
320
|
const appearanceConfig = useAppearanceConfig(appearance, chipsConfig, isDisabled);
|
|
321
321
|
const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
322
|
-
const { alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, cursorClass, iconAfterFill, iconAfterFillActiveIcon, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconBeforeFill, iconBeforeFillActiveIcon, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
|
|
322
|
+
const { alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, cursorClass, iconAfter, iconAfterFill, iconAfterFillActiveIcon, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeFillActiveIcon, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
|
|
323
323
|
const { styles: chipsStyles } = useStyles(props);
|
|
324
324
|
return (jsx("div", { className: clsx(className, 'chips', !isActive
|
|
325
325
|
? fillClass && `fill_${fillClass}`
|
|
326
326
|
: fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
|
|
327
327
|
? fillHoverClass && `fill_hover_${fillHoverClass}`
|
|
328
|
-
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-test-id": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (jsx(Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (jsx(Badge, { className: "chips__badge",
|
|
328
|
+
: fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `chips_skeleton`), "data-test-id": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (jsx(Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (jsx(Badge, { appearance: badgeAppearance, className: "chips__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }) }));
|
|
329
329
|
}
|
|
330
330
|
|
|
331
331
|
function ChipsGroup(props) {
|
|
@@ -336,7 +336,7 @@ function ChipsGroup(props) {
|
|
|
336
336
|
const { styles: groupStyles } = useStyles(props);
|
|
337
337
|
return (jsx("div", { className: clsx(className, 'chips-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-test-id": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: children
|
|
338
338
|
? children
|
|
339
|
-
: chipsList?.map((item) => (jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: () => onClick(item) }, item.id))) }));
|
|
339
|
+
: chipsList?.map((item) => (jsx(Chips, { appearance: chipsAppearance, label: item.label, iconAfter: item.iconAfter, iconBefore: item.iconBefore, isActive: item.isActive, isDisabled: item.isDisabled, onClick: (event) => onClick(item, event) }, item.id))) }));
|
|
340
340
|
}
|
|
341
341
|
|
|
342
342
|
export { Chips as C, chipsAppearance as a, ChipsGroup as b, chipsConfig as c };
|
|
@@ -8,7 +8,7 @@ var DatePicker = require('react-datepicker');
|
|
|
8
8
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
9
9
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
10
10
|
var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
|
|
11
|
-
var Button = require('./
|
|
11
|
+
var Button = require('./Button_cjs_DPs7uj_n.js');
|
|
12
12
|
var Icon = require('./Icon_cjs_BgGtdviU.js');
|
|
13
13
|
var Input = require('./Input_cjs_KgFCCi2U.js');
|
|
14
14
|
var Label = require('./Label_cjs_FRIVslSV.js');
|
|
@@ -6,7 +6,7 @@ import DatePicker from 'react-datepicker';
|
|
|
6
6
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
7
7
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
8
8
|
import { useStyles } from './hooks/useStyles/useStyles.js';
|
|
9
|
-
import { B as Button } from './
|
|
9
|
+
import { B as Button } from './Button_es_ljlle2Pu.js';
|
|
10
10
|
import { I as Icon } from './Icon_es_CtZHchZc.js';
|
|
11
11
|
import { I as Input } from './Input_es_I8GPoibb.js';
|
|
12
12
|
import { L as Label } from './Label_es_CI2mt2wH.js';
|
|
@@ -27,10 +27,10 @@ const Group = React.forwardRef(function Group(props, ref) {
|
|
|
27
27
|
const { id, appearance, className, dataTestId, dataTour, name, easing, htmlFor, print, scroll, style, tag: Tag = 'div', isActive, isDisabled, onClick, onMouseDown, children, } = props;
|
|
28
28
|
const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, groupConfig);
|
|
29
29
|
const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
30
|
-
const { directionClass, flexGrowClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, textColorActiveClass, textColorClass, textColorHoverClass, columnsClass, elevationClass, heightClass, iconFillHoverClass, shapeClass, shapeStrengthClass, stackingClass, widthClass, wrapClass, } = propsGenerator;
|
|
30
|
+
const { directionClass, flexGrowClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, textColorActiveClass, textColorClass, textColorHoverClass, columnsClass, elevationClass, heightClass, hoverFilterClass, iconFillHoverClass, shapeClass, shapeStrengthClass, stackingClass, widthClass, wrapClass, } = propsGenerator;
|
|
31
31
|
// @ts-expect-error
|
|
32
32
|
const { styles: groupStyles } = useStyles.useStyles(props);
|
|
33
|
-
return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'group', easing && `easing_${easing}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, columnsClass && `group_columns_${columnsClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, textColorClass && `group_text-color_${textColorClass}`, textColorActiveClass &&
|
|
33
|
+
return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'group', easing && `easing_${easing}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, hoverFilterClass && `hover-filter_${hoverFilterClass}`, columnsClass && `group_columns_${columnsClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, textColorClass && `group_text-color_${textColorClass}`, textColorActiveClass &&
|
|
34
34
|
`group_text-color_active_${textColorActiveClass}`, textColorHoverClass && `group_text-color_hover_${textColorHoverClass}`, iconFillHoverClass && `group_icon_fill_hover_${iconFillHoverClass}`, !isDisabled
|
|
35
35
|
? !isActive
|
|
36
36
|
? fillClass && `fill_${fillClass}`
|
|
@@ -51,7 +51,7 @@ const Group = React.forwardRef(function Group(props, ref) {
|
|
|
51
51
|
`border-color_hover_${borderColorHoverClass}`
|
|
52
52
|
: borderColorActiveHoverClass &&
|
|
53
53
|
`border-color_active_hover_${borderColorActiveHoverClass}`
|
|
54
|
-
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, print
|
|
54
|
+
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, !print && 'no-print', print && 'print', onClick && 'cursor_type_pointer'), name: name, ref: ref, "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, groupStyles, style), onClick: onClick, onMouseDown: onMouseDown, children: children }));
|
|
55
55
|
});
|
|
56
56
|
|
|
57
57
|
exports.Group = Group;
|
|
@@ -25,10 +25,10 @@ const Group = React.forwardRef(function Group(props, ref) {
|
|
|
25
25
|
const { id, appearance, className, dataTestId, dataTour, name, easing, htmlFor, print, scroll, style, tag: Tag = 'div', isActive, isDisabled, onClick, onMouseDown, children, } = props;
|
|
26
26
|
const appearanceConfig = useAppearanceConfig(appearance, groupConfig);
|
|
27
27
|
const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
|
|
28
|
-
const { directionClass, flexGrowClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, textColorActiveClass, textColorClass, textColorHoverClass, columnsClass, elevationClass, heightClass, iconFillHoverClass, shapeClass, shapeStrengthClass, stackingClass, widthClass, wrapClass, } = propsGenerator;
|
|
28
|
+
const { directionClass, flexGrowClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, textColorActiveClass, textColorClass, textColorHoverClass, columnsClass, elevationClass, heightClass, hoverFilterClass, iconFillHoverClass, shapeClass, shapeStrengthClass, stackingClass, widthClass, wrapClass, } = propsGenerator;
|
|
29
29
|
// @ts-expect-error
|
|
30
30
|
const { styles: groupStyles } = useStyles(props);
|
|
31
|
-
return (jsx(Tag, { id: id, className: clsx(className, 'group', easing && `easing_${easing}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, columnsClass && `group_columns_${columnsClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, textColorClass && `group_text-color_${textColorClass}`, textColorActiveClass &&
|
|
31
|
+
return (jsx(Tag, { id: id, className: clsx(className, 'group', easing && `easing_${easing}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, hoverFilterClass && `hover-filter_${hoverFilterClass}`, columnsClass && `group_columns_${columnsClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, textColorClass && `group_text-color_${textColorClass}`, textColorActiveClass &&
|
|
32
32
|
`group_text-color_active_${textColorActiveClass}`, textColorHoverClass && `group_text-color_hover_${textColorHoverClass}`, iconFillHoverClass && `group_icon_fill_hover_${iconFillHoverClass}`, !isDisabled
|
|
33
33
|
? !isActive
|
|
34
34
|
? fillClass && `fill_${fillClass}`
|
|
@@ -49,7 +49,7 @@ const Group = React.forwardRef(function Group(props, ref) {
|
|
|
49
49
|
`border-color_hover_${borderColorHoverClass}`
|
|
50
50
|
: borderColorActiveHoverClass &&
|
|
51
51
|
`border-color_active_hover_${borderColorActiveHoverClass}`
|
|
52
|
-
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, print
|
|
52
|
+
: fillDisabledClass && `fill_${fillDisabledClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, !print && 'no-print', print && 'print', onClick && 'cursor_type_pointer'), name: name, ref: ref, "data-test-id": dataTestId, "data-tour": dataTour, htmlFor: htmlFor, style: Object.assign({}, groupStyles, style), onClick: onClick, onMouseDown: onMouseDown, children: children }));
|
|
53
53
|
});
|
|
54
54
|
|
|
55
55
|
export { Group as G, groupAppearance as a, groupConfig as g };
|
|
@@ -7,7 +7,7 @@ var Select = require('react-select');
|
|
|
7
7
|
var CreatableSelect = require('react-select/creatable');
|
|
8
8
|
var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
9
9
|
var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
10
|
-
var Group = require('./
|
|
10
|
+
var Group = require('./Group_cjs_DNI9PTBq.js');
|
|
11
11
|
var Text = require('./Text_cjs_DG2eMKBi.js');
|
|
12
12
|
var _default = require('@itcase/icons/default');
|
|
13
13
|
var Icon = require('./Icon_cjs_BgGtdviU.js');
|
|
@@ -5,7 +5,7 @@ import Select, { components } from 'react-select';
|
|
|
5
5
|
import CreatableSelect from 'react-select/creatable';
|
|
6
6
|
import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
7
7
|
import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
8
|
-
import { G as Group } from './
|
|
8
|
+
import { G as Group } from './Group_es_nBtACpoG.js';
|
|
9
9
|
import { T as Text } from './Text_es_CU9KR5AE.js';
|
|
10
10
|
import { icons12, icons16, icons14, icons24 } from '@itcase/icons/default';
|
|
11
11
|
import { I as Icon, B as Badge } from './Icon_es_CtZHchZc.js';
|
|
@@ -5,8 +5,8 @@ var clsx = require('clsx');
|
|
|
5
5
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
6
6
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
7
7
|
var useStyles = require('../hooks/useStyles/useStyles.js');
|
|
8
|
-
var Avatar = require('../../
|
|
9
|
-
var Group = require('../../
|
|
8
|
+
var Avatar = require('../../Avatar_cjs_CS01fvh-.js');
|
|
9
|
+
var Group = require('../../Group_cjs_DNI9PTBq.js');
|
|
10
10
|
var Text = require('../../Text_cjs_DG2eMKBi.js');
|
|
11
11
|
require('react');
|
|
12
12
|
require('lodash/camelCase');
|