@itcase/ui 1.8.121 → 1.8.123
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_BKcQuqYV.js → Avatar_cjs_CLJnKU39.js} +3 -3
- package/dist/{Avatar_es_Cpn1PNmO.js → Avatar_es_BgN-fbOj.js} +3 -3
- package/dist/{Button_cjs_3BTD8Mlm.js → Button_cjs_Ce97psFT.js} +5 -5
- package/dist/{Button_es_B_k-SP92.js → Button_es_CZss7cXh.js} +5 -5
- package/dist/{ChipsGroup_cjs_DhoY9YjT.js → ChipsGroup_cjs_C8L3ZeD_.js} +1 -1
- package/dist/{ChipsGroup_es_Dg1GmJ-9.js → ChipsGroup_es_ayPPUwQ7.js} +1 -1
- package/dist/{DatePicker_cjs_BLkZB0S0.js → DatePicker_cjs_BzEtDAb8.js} +4 -4
- package/dist/{DatePicker_es_CKrgRUWu.js → DatePicker_es_DRyCMO0I.js} +4 -4
- package/dist/{DropdownItem_cjs_D3Mcbsxa.js → DropdownItem_cjs_Bhss6lyM.js} +1 -1
- package/dist/{DropdownItem_es_BUs02mjJ.js → DropdownItem_es_BXl6lPJx.js} +1 -1
- package/dist/{Icon_cjs_CUArL1z2.js → Icon_cjs_Cz6IyOkb.js} +2 -2
- package/dist/{Icon_es_CNrc90oI.js → Icon_es_BrwLifge.js} +2 -2
- package/dist/{Image_cjs_B6YlGx8G.js → Image_cjs_DRhhc66R.js} +2 -1
- package/dist/{Image_es_BvYo_cHH.js → Image_es_BpMidmve.js} +2 -1
- package/dist/{Input_cjs_Du73R-wm.js → Input_cjs_DRPK_RHK.js} +3 -3
- package/dist/{Input_es_CiDHjDqJ.js → Input_es_Cv5nEb_n.js} +3 -3
- package/dist/{Label_cjs_BUEGAnsq.js → Label_cjs_DMoaOoHi.js} +1 -1
- package/dist/{Label_es_I01RN9hv.js → Label_es_SULlg9bL.js} +1 -1
- package/dist/{Loader_cjs_Cme6Hi0B.js → Loader_cjs_D3lnxPlI.js} +4 -0
- package/dist/{Loader_es_ByhTIMxS.js → Loader_es_BUSqFrCd.js} +4 -0
- package/dist/cjs/components/Accordion.js +1 -1
- package/dist/cjs/components/Avatar.js +3 -3
- package/dist/cjs/components/AvatarStack.js +3 -3
- package/dist/cjs/components/Badge.js +1 -1
- package/dist/cjs/components/Breadcrumbs.js +1 -1
- package/dist/cjs/components/Button.js +3 -3
- package/dist/cjs/components/Cell.js +2 -2
- package/dist/cjs/components/Chips.js +2 -2
- package/dist/cjs/components/Choice.js +2 -2
- package/dist/cjs/components/CookiesWarning.js +3 -3
- package/dist/cjs/components/Dadata.js +1 -1
- package/dist/cjs/components/DatePeriod.js +10 -10
- package/dist/cjs/components/DatePicker.js +6 -6
- package/dist/cjs/components/Drawer.js +1 -1
- package/dist/cjs/components/Dropdown.js +2 -2
- package/dist/cjs/components/Grid.js +3 -3
- package/dist/cjs/components/HeroTitle.js +1 -1
- package/dist/cjs/components/Icon.js +1 -1
- package/dist/cjs/components/Image.js +1 -1
- package/dist/cjs/components/Input.js +1 -1
- package/dist/cjs/components/InputPassword.js +89 -67
- package/dist/cjs/components/Label.js +2 -2
- package/dist/cjs/components/Loader.js +1 -1
- package/dist/cjs/components/MenuItem.js +3 -2
- package/dist/cjs/components/Modal.js +2 -2
- package/dist/cjs/components/ModalSheetBottom.js +1 -1
- package/dist/cjs/components/Notification.js +1 -1
- package/dist/cjs/components/Pagination.js +2 -2
- package/dist/cjs/components/Response/img.js +8 -2
- package/dist/cjs/components/Response.js +131 -30
- package/dist/cjs/components/Search.js +1 -1
- package/dist/cjs/components/Segmented.js +6 -6
- package/dist/cjs/components/Select.js +2 -2
- package/dist/cjs/components/Swiper.js +1 -1
- package/dist/cjs/components/Tab.js +30 -46
- package/dist/cjs/components/Tile.js +1 -1
- package/dist/cjs/components/Title.js +1 -1
- package/dist/cjs/components/Tooltip.js +1 -1
- package/dist/cjs/components/Warning.js +1 -1
- package/dist/components/Accordion.js +1 -1
- package/dist/components/Avatar.js +3 -3
- package/dist/components/AvatarStack.js +3 -3
- package/dist/components/Badge.js +1 -1
- package/dist/components/Breadcrumbs.js +1 -1
- package/dist/components/Button.js +3 -3
- package/dist/components/Cell.js +2 -2
- package/dist/components/Chips.js +2 -2
- package/dist/components/Choice.js +2 -2
- package/dist/components/CookiesWarning.js +3 -3
- package/dist/components/Dadata.js +1 -1
- package/dist/components/DatePeriod.js +10 -10
- package/dist/components/DatePicker.js +6 -6
- package/dist/components/Drawer.js +1 -1
- package/dist/components/Dropdown.js +2 -2
- package/dist/components/Grid.js +3 -3
- package/dist/components/HeroTitle.js +1 -1
- package/dist/components/Icon.js +1 -1
- package/dist/components/Image.js +1 -1
- package/dist/components/Input.js +1 -1
- package/dist/components/InputPassword.js +89 -67
- package/dist/components/Label.js +2 -2
- package/dist/components/Loader.js +1 -1
- package/dist/components/MenuItem.js +3 -2
- package/dist/components/Modal.js +2 -2
- package/dist/components/ModalSheetBottom.js +1 -1
- package/dist/components/Notification.js +1 -1
- package/dist/components/Pagination.js +2 -2
- package/dist/components/Response/img.js +8 -2
- package/dist/components/Response.js +132 -32
- package/dist/components/Search.js +1 -1
- package/dist/components/Segmented.js +6 -6
- package/dist/components/Select.js +2 -2
- package/dist/components/Swiper.js +1 -1
- package/dist/components/Tab.js +30 -46
- package/dist/components/Tile.js +1 -1
- package/dist/components/Title.js +1 -1
- package/dist/components/Tooltip.js +1 -1
- package/dist/components/Warning.js +1 -1
- package/dist/css/components/Cell/Cell.css +1 -2
- package/dist/css/components/Checkmark/Checkmark.css +2 -0
- package/dist/css/components/DatePeriod/DatePeriod.css +3 -0
- package/dist/css/components/Input/Input.css +0 -8
- package/dist/css/components/InputPassword/InputPassword.css +34 -43
- package/dist/css/components/MenuItem/MenuItem.css +28 -15
- package/dist/css/components/Tooltip/Tooltip.css +1 -0
- package/dist/types/components/InputPassword/InputPassword.appearance.d.ts +179 -2
- package/dist/types/components/InputPassword/appearance/inputPasswordDefault.d.ts +7 -4
- package/dist/types/components/InputPassword/appearance/inputPasswordDisabled.d.ts +6 -4
- package/dist/types/components/InputPassword/appearance/inputPasswordError.d.ts +6 -4
- package/dist/types/components/InputPassword/appearance/inputPasswordRequire.d.ts +6 -4
- package/dist/types/components/InputPassword/appearance/inputPasswordShape.d.ts +25 -0
- package/dist/types/components/InputPassword/appearance/inputPasswordSize.d.ts +14 -28
- package/dist/types/components/InputPassword/appearance/inputPasswordStyle.d.ts +5 -5
- package/dist/types/components/InputPassword/appearance/inputPasswordSuccess.d.ts +6 -4
- package/dist/types/components/Response/Response.constant.d.ts +76 -0
- package/dist/types/components/Response/appearance/{responceConfirm.d.ts → responseConfirm.d.ts} +1 -0
- package/dist/types/components/Response/appearance/responseDanger.d.ts +1 -0
- package/dist/types/components/Response/appearance/{responceEmpty.d.ts → responseEmpty.d.ts} +1 -0
- package/dist/types/components/Response/appearance/responseError.d.ts +1 -0
- package/dist/types/components/Response/appearance/{responceFail.d.ts → responseFail.d.ts} +1 -0
- package/dist/types/components/Response/appearance/{responceNothingFound.d.ts → responseNothingFound.d.ts} +1 -0
- package/dist/types/components/Response/appearance/{responceRefresh.d.ts → responseRefresh.d.ts} +1 -0
- package/dist/types/components/Response/appearance/responseStyle.d.ts +14 -0
- package/dist/types/components/Response/appearance/responseSuccess.d.ts +1 -0
- package/dist/types/components/Response/appearance/responseUnableLoadData.d.ts +1 -0
- package/dist/types/components/Response/appearance/responseWarning.d.ts +1 -0
- package/dist/types/components/Response/img/index.d.ts +2 -0
- package/dist/types/components/Response/index.d.ts +2 -1
- package/dist/types/components/Tab/appearance/tabSize.d.ts +0 -14
- package/dist/types/components/Tab/appearance/tabSurface.d.ts +7 -7
- package/package.json +13 -13
|
@@ -9,7 +9,7 @@ var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
|
|
|
9
9
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
10
10
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
11
11
|
var useStyles = require('../hooks/useStyles/useStyles.js');
|
|
12
|
-
var Button = require('../../
|
|
12
|
+
var Button = require('../../Button_cjs_Ce97psFT.js');
|
|
13
13
|
var Group = require('../../Group_cjs_CsJ6ICKK.js');
|
|
14
14
|
var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
15
15
|
require('@itcase/common');
|
|
@@ -26,10 +26,10 @@ require('../utils/setViewportProperty.js');
|
|
|
26
26
|
require('../hooks.js');
|
|
27
27
|
require('../hooks/useStyles/styleAttributes.js');
|
|
28
28
|
require('lodash/maxBy');
|
|
29
|
-
require('../../
|
|
29
|
+
require('../../Icon_cjs_Cz6IyOkb.js');
|
|
30
30
|
require('react-inlinesvg');
|
|
31
31
|
require('../../Link_cjs_C5UsZUiF.js');
|
|
32
|
-
require('../../
|
|
32
|
+
require('../../Loader_cjs_D3lnxPlI.js');
|
|
33
33
|
|
|
34
34
|
var responseAppearanceConfirm = {
|
|
35
35
|
confirm: {
|
|
@@ -38,6 +38,7 @@ var responseAppearanceConfirm = {
|
|
|
38
38
|
titleTextSize: 'xxl',
|
|
39
39
|
labelTextColor: 'surfaceTextPrimary',
|
|
40
40
|
descTextSize: 'm',
|
|
41
|
+
imageSrc: index.responseIcon.Confirm,
|
|
41
42
|
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
42
43
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
43
44
|
svgFill: 'surfaceTertiary',
|
|
@@ -45,27 +46,29 @@ var responseAppearanceConfirm = {
|
|
|
45
46
|
},
|
|
46
47
|
};
|
|
47
48
|
|
|
48
|
-
var
|
|
49
|
-
|
|
49
|
+
var responseAppearanceDanger = {
|
|
50
|
+
danger: {
|
|
50
51
|
fill: 'surfacePrimary',
|
|
51
52
|
titleTextColor: 'surfaceTextPrimary',
|
|
52
53
|
titleTextSize: 'xxl',
|
|
53
54
|
labelTextColor: 'surfaceTextPrimary',
|
|
54
55
|
descTextSize: 'm',
|
|
55
|
-
|
|
56
|
+
imageSrc: index.responseIcon.Danger,
|
|
57
|
+
primaryButtonAppearance: 'dangerPrimary sizeXXL solid',
|
|
56
58
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
57
|
-
svgFill: '
|
|
58
|
-
svgPathFill: '
|
|
59
|
+
svgFill: 'dangerPrimary',
|
|
60
|
+
svgPathFill: 'dangerItemPrimary',
|
|
59
61
|
},
|
|
60
62
|
};
|
|
61
63
|
|
|
62
|
-
var
|
|
63
|
-
|
|
64
|
+
var responseAppearanceEmpty = {
|
|
65
|
+
empty: {
|
|
64
66
|
fill: 'surfacePrimary',
|
|
65
67
|
titleTextColor: 'surfaceTextPrimary',
|
|
66
68
|
titleTextSize: 'xxl',
|
|
67
69
|
labelTextColor: 'surfaceTextPrimary',
|
|
68
70
|
descTextSize: 'm',
|
|
71
|
+
imageSrc: index.responseIcon.Empty,
|
|
69
72
|
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
70
73
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
71
74
|
svgFill: 'surfaceTertiary',
|
|
@@ -73,27 +76,29 @@ var responseAppearanceFail = {
|
|
|
73
76
|
},
|
|
74
77
|
};
|
|
75
78
|
|
|
76
|
-
var
|
|
77
|
-
|
|
79
|
+
var responseAppearanceError = {
|
|
80
|
+
error: {
|
|
78
81
|
fill: 'surfacePrimary',
|
|
79
82
|
titleTextColor: 'surfaceTextPrimary',
|
|
80
83
|
titleTextSize: 'xxl',
|
|
81
84
|
labelTextColor: 'surfaceTextPrimary',
|
|
82
85
|
descTextSize: 'm',
|
|
83
|
-
|
|
86
|
+
imageSrc: index.responseIcon.Error,
|
|
87
|
+
primaryButtonAppearance: 'errorPrimary sizeXXL solid',
|
|
84
88
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
85
|
-
svgFill: '
|
|
86
|
-
svgPathFill: '
|
|
89
|
+
svgFill: 'errorPrimary',
|
|
90
|
+
svgPathFill: 'errorItemPrimary',
|
|
87
91
|
},
|
|
88
92
|
};
|
|
89
93
|
|
|
90
|
-
var
|
|
91
|
-
|
|
94
|
+
var responseAppearanceFail = {
|
|
95
|
+
fail: {
|
|
92
96
|
fill: 'surfacePrimary',
|
|
93
97
|
titleTextColor: 'surfaceTextPrimary',
|
|
94
98
|
titleTextSize: 'xxl',
|
|
95
99
|
labelTextColor: 'surfaceTextPrimary',
|
|
96
100
|
descTextSize: 'm',
|
|
101
|
+
imageSrc: index.responseIcon.Fail,
|
|
97
102
|
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
98
103
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
99
104
|
svgFill: 'surfaceTertiary',
|
|
@@ -101,31 +106,47 @@ var responseAppearanceRefresh = {
|
|
|
101
106
|
},
|
|
102
107
|
};
|
|
103
108
|
|
|
104
|
-
var
|
|
105
|
-
|
|
109
|
+
var responseAppearanceNothingFound = {
|
|
110
|
+
nothingFound: {
|
|
106
111
|
fill: 'surfacePrimary',
|
|
107
112
|
titleTextColor: 'surfaceTextPrimary',
|
|
108
113
|
titleTextSize: 'xxl',
|
|
109
114
|
labelTextColor: 'surfaceTextPrimary',
|
|
110
115
|
descTextSize: 'm',
|
|
111
|
-
|
|
116
|
+
imageSrc: index.responseIcon.NothingFound,
|
|
117
|
+
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
112
118
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
113
|
-
svgFill: '
|
|
114
|
-
svgPathFill: '
|
|
119
|
+
svgFill: 'surfaceTertiary',
|
|
120
|
+
svgPathFill: 'surfaceItemQuaternary',
|
|
115
121
|
},
|
|
116
122
|
};
|
|
117
123
|
|
|
118
|
-
var
|
|
119
|
-
|
|
124
|
+
var responseAppearanceRefresh = {
|
|
125
|
+
refresh: {
|
|
120
126
|
fill: 'surfacePrimary',
|
|
121
127
|
titleTextColor: 'surfaceTextPrimary',
|
|
122
128
|
titleTextSize: 'xxl',
|
|
123
129
|
labelTextColor: 'surfaceTextPrimary',
|
|
124
130
|
descTextSize: 'm',
|
|
125
|
-
|
|
131
|
+
imageSrc: index.responseIcon.Refresh,
|
|
132
|
+
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
126
133
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
127
|
-
svgFill: '
|
|
128
|
-
svgPathFill: '
|
|
134
|
+
svgFill: 'surfaceTertiary',
|
|
135
|
+
svgPathFill: 'surfaceItemQuaternary',
|
|
136
|
+
},
|
|
137
|
+
};
|
|
138
|
+
|
|
139
|
+
var responseAppearanceStyle = {
|
|
140
|
+
solid: {
|
|
141
|
+
borderColor: 'none',
|
|
142
|
+
},
|
|
143
|
+
outlined: {
|
|
144
|
+
fill: 'none',
|
|
145
|
+
},
|
|
146
|
+
full: {},
|
|
147
|
+
ghost: {
|
|
148
|
+
fill: 'none',
|
|
149
|
+
borderColor: 'none',
|
|
129
150
|
},
|
|
130
151
|
};
|
|
131
152
|
|
|
@@ -136,6 +157,7 @@ var responseAppearanceSuccess = {
|
|
|
136
157
|
titleTextSize: 'xxl',
|
|
137
158
|
labelTextColor: 'surfaceTextPrimary',
|
|
138
159
|
descTextSize: 'm',
|
|
160
|
+
imageSrc: index.responseIcon.Success,
|
|
139
161
|
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
140
162
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
141
163
|
svgFill: 'accentPrimary',
|
|
@@ -150,6 +172,7 @@ var responseAppearanceUnableLoadData = {
|
|
|
150
172
|
titleTextSize: 'xxl',
|
|
151
173
|
labelTextColor: 'surfaceTextPrimary',
|
|
152
174
|
descTextSize: 'm',
|
|
175
|
+
imageSrc: index.responseIcon.UnableLoadData,
|
|
153
176
|
primaryButtonAppearance: 'accentPrimary sizeXXL solid',
|
|
154
177
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
155
178
|
svgFill: 'surfaceTertiary',
|
|
@@ -164,6 +187,7 @@ var responseAppearanceWarning = {
|
|
|
164
187
|
titleTextSize: 'xxl',
|
|
165
188
|
labelTextColor: 'surfaceTextPrimary',
|
|
166
189
|
descTextSize: 'm',
|
|
190
|
+
imageSrc: index.responseIcon.Warning,
|
|
167
191
|
primaryButtonAppearance: 'warningPrimary sizeXXL solid',
|
|
168
192
|
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
|
|
169
193
|
svgFill: 'warningPrimary',
|
|
@@ -171,7 +195,7 @@ var responseAppearanceWarning = {
|
|
|
171
195
|
},
|
|
172
196
|
};
|
|
173
197
|
|
|
174
|
-
var responseAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, responseAppearanceConfirm), responseAppearanceEmpty), responseAppearanceDanger), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning);
|
|
198
|
+
var responseAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, responseAppearanceConfirm), responseAppearanceEmpty), responseAppearanceDanger), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning), responseAppearanceStyle);
|
|
175
199
|
|
|
176
200
|
var responseConfig = {
|
|
177
201
|
appearance: responseAppearance,
|
|
@@ -180,10 +204,10 @@ var responseConfig = {
|
|
|
180
204
|
},
|
|
181
205
|
};
|
|
182
206
|
var Response = urlWithAssetPrefix.urlWithAssetPrefix(function Response(props) {
|
|
183
|
-
var
|
|
207
|
+
var appearance = props.appearance, className = props.className, width = props.width, height = props.height, title = props.title, desc = props.desc, secondaryButton = props.secondaryButton, primaryButton = props.primaryButton, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClickSecondaryButton = props.onClickSecondaryButton;
|
|
184
208
|
var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, responseConfig);
|
|
185
209
|
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
186
|
-
var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, onClickPrimaryButton = propsGenerator.onClickPrimaryButton,
|
|
210
|
+
var dataTestId = propsGenerator.dataTestId, dataTour = propsGenerator.dataTour, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, titleTextColor = propsGenerator.titleTextColor, titleTextSize = propsGenerator.titleTextSize, titleTextWeight = propsGenerator.titleTextWeight, descTextColor = propsGenerator.descTextColor, descTextSize = propsGenerator.descTextSize, descTextWeight = propsGenerator.descTextWeight, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, onClickPrimaryButton = propsGenerator.onClickPrimaryButton, secondaryButtonAfter = propsGenerator.secondaryButtonAfter, secondaryButtonAppearance = propsGenerator.secondaryButtonAppearance, secondaryButtonBefore = propsGenerator.secondaryButtonBefore, secondaryButtonFill = propsGenerator.secondaryButtonFill, secondaryButtonFillHover = propsGenerator.secondaryButtonFillHover, secondaryButtonLabel = propsGenerator.secondaryButtonLabel, secondaryButtonLabelTextColor = propsGenerator.secondaryButtonLabelTextColor, secondaryButtonLabelTextSize = propsGenerator.secondaryButtonLabelTextSize, secondaryButtonShape = propsGenerator.secondaryButtonShape, secondaryButtonSize = propsGenerator.secondaryButtonSize, secondaryButtonWidth = propsGenerator.secondaryButtonWidth, imageSrc = propsGenerator.imageSrc, primaryButtonAfter = propsGenerator.primaryButtonAfter, primaryButtonAppearance = propsGenerator.primaryButtonAppearance, primaryButtonBefore = propsGenerator.primaryButtonBefore, primaryButtonFill = propsGenerator.primaryButtonFill, primaryButtonFillHover = propsGenerator.primaryButtonFillHover, primaryButtonLabel = propsGenerator.primaryButtonLabel, primaryButtonLabelTextColor = propsGenerator.primaryButtonLabelTextColor, primaryButtonLabelTextSize = propsGenerator.primaryButtonLabelTextSize, primaryButtonShape = propsGenerator.primaryButtonShape, primaryButtonSize = propsGenerator.primaryButtonSize, primaryButtonWidth = propsGenerator.primaryButtonWidth, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, svgFillClass = propsGenerator.svgFillClass, SvgImage = propsGenerator.SvgImage, svgPathFillClass = propsGenerator.svgPathFillClass, svgSrc = propsGenerator.svgSrc, widthClass = propsGenerator.widthClass;
|
|
187
211
|
// TODO: use Icon instead?
|
|
188
212
|
var ImageComponent = React.useMemo(function () {
|
|
189
213
|
var src = imageSrc || svgSrc;
|
|
@@ -219,7 +243,84 @@ var Response = urlWithAssetPrefix.urlWithAssetPrefix(function Response(props) {
|
|
|
219
243
|
appearanceConfig) && (jsxRuntime.jsxs(Group.Group, { className: "response__button", width: "fill", children: [primaryButtonLabel ? (jsxRuntime.jsx(Button.Button, { className: "response__button-item", appearance: primaryButtonAppearance, width: primaryButtonWidth || 'fill', size: primaryButtonSize, fill: primaryButtonFill, fillHover: primaryButtonFillHover, label: primaryButtonLabel, labelTextColor: primaryButtonLabelTextColor, labelTextSize: primaryButtonLabelTextSize, shape: primaryButtonShape, before: primaryButtonBefore, after: primaryButtonAfter, onClick: onClickPrimaryButton })) : (primaryButton), secondaryButtonLabel ? (jsxRuntime.jsx(Button.Button, { className: "response__button-item", appearance: secondaryButtonAppearance, width: secondaryButtonWidth || 'fill', size: secondaryButtonSize, fill: secondaryButtonFill, fillHover: secondaryButtonFillHover, label: secondaryButtonLabel, labelTextColor: secondaryButtonLabelTextColor, labelTextSize: secondaryButtonLabelTextSize, shape: secondaryButtonShape, before: secondaryButtonBefore, after: secondaryButtonAfter, onClick: onClickSecondaryButton })) : (secondaryButton)] })), after] }));
|
|
220
244
|
});
|
|
221
245
|
|
|
246
|
+
var RESPONSE_MESSAGES = {
|
|
247
|
+
empty: {
|
|
248
|
+
appearance: 'refresh ghost',
|
|
249
|
+
title: ' Список пуст',
|
|
250
|
+
desc: 'Нет данных по заданным параметрам',
|
|
251
|
+
code: '500',
|
|
252
|
+
imageSrc: index.responseIcon.Empty,
|
|
253
|
+
primaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
254
|
+
primaryButtonLabel: 'ОК',
|
|
255
|
+
},
|
|
256
|
+
error: {
|
|
257
|
+
appearance: 'error ghost',
|
|
258
|
+
title: 'Ошибка',
|
|
259
|
+
desc: 'Возникла проблема с обработкой вашего запроса. Повторите попытку позже или обратитесь в поддержку по электронной почте: support@example.com',
|
|
260
|
+
code: '500',
|
|
261
|
+
imageSrc: index.responseIcon.Error,
|
|
262
|
+
primaryButtonAppearance: 'errorPrimary sizeXXL solid rounded',
|
|
263
|
+
primaryButtonLabel: 'ОК',
|
|
264
|
+
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
265
|
+
secondaryButtonLabel: 'Отмена',
|
|
266
|
+
},
|
|
267
|
+
warning: {
|
|
268
|
+
appearance: 'warning ghost',
|
|
269
|
+
title: 'Внимание',
|
|
270
|
+
imageSrc: index.responseIcon.Warning,
|
|
271
|
+
primaryButtonAppearance: 'warningPrimary sizeXXL solid rounded',
|
|
272
|
+
primaryButtonLabel: 'Повторить',
|
|
273
|
+
secondaryButtonAppearance: 'warningPrimary sizeXXL solid rounded',
|
|
274
|
+
secondaryButtonLabel: 'Отмена',
|
|
275
|
+
},
|
|
276
|
+
success: {
|
|
277
|
+
appearance: 'refresh ghost',
|
|
278
|
+
title: 'Готово',
|
|
279
|
+
desc: 'Успешно выполнено',
|
|
280
|
+
code: '500',
|
|
281
|
+
imageSrc: index.responseIcon.Success,
|
|
282
|
+
primaryButtonAppearance: 'successPrimary sizeXXL solid rounded',
|
|
283
|
+
primaryButtonLabel: 'ОК',
|
|
284
|
+
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
285
|
+
secondaryButtonLabel: 'Закрыть',
|
|
286
|
+
},
|
|
287
|
+
nothingFound: {
|
|
288
|
+
appearance: 'refresh ghost',
|
|
289
|
+
title: 'Ничего не найдено',
|
|
290
|
+
desc: 'Нет данных по заданным параметрам',
|
|
291
|
+
code: '500',
|
|
292
|
+
imageSrc: index.responseIcon.NothingFound,
|
|
293
|
+
primaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
294
|
+
primaryButtonLabel: 'Сбросить',
|
|
295
|
+
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
296
|
+
secondaryButtonLabel: 'Отмена',
|
|
297
|
+
},
|
|
298
|
+
errorNetwork: {
|
|
299
|
+
appearance: 'unableLoadData ghost',
|
|
300
|
+
title: 'Ошибка соединения',
|
|
301
|
+
desc: 'Не удалось подключиться.Проверьте интернет-соединение и повторите попытку',
|
|
302
|
+
code: '503',
|
|
303
|
+
imageSrc: index.responseIcon.UnableLoadData,
|
|
304
|
+
primaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
305
|
+
primaryButtonLabel: 'Обновить',
|
|
306
|
+
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
307
|
+
secondaryButtonLabel: 'Отмена',
|
|
308
|
+
},
|
|
309
|
+
errorRequest: {
|
|
310
|
+
appearance: 'refresh ghost',
|
|
311
|
+
title: 'Доступ ограничен',
|
|
312
|
+
desc: 'Для выяснения причин и восстановления доступа обратитесь, пожалуйста, в техническую поддержку по электронной почте: support@example.com',
|
|
313
|
+
code: '403',
|
|
314
|
+
imageSrc: index.responseIcon.UnableLoadData,
|
|
315
|
+
primaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
316
|
+
primaryButtonLabel: 'Повторить',
|
|
317
|
+
secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid rounded',
|
|
318
|
+
secondaryButtonLabel: 'Отмена',
|
|
319
|
+
},
|
|
320
|
+
};
|
|
321
|
+
|
|
222
322
|
exports.responseIcon = index.responseIcon;
|
|
323
|
+
exports.RESPONSE_MESSAGES = RESPONSE_MESSAGES;
|
|
223
324
|
exports.Response = Response;
|
|
224
325
|
exports.responseAppearance = responseAppearance;
|
|
225
326
|
exports.responseConfig = responseConfig;
|
|
@@ -8,7 +8,7 @@ var clsx = require('clsx');
|
|
|
8
8
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
9
9
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
10
10
|
var useStyles = require('../hooks/useStyles/useStyles.js');
|
|
11
|
-
var Icon = require('../../
|
|
11
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
12
12
|
var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
13
13
|
var Scrollbar = require('../../Scrollbar_cjs_DcKOfcNp.js');
|
|
14
14
|
require('lodash/camelCase');
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
|
-
var Icon = require('../../
|
|
6
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
7
7
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
8
8
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
9
9
|
var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
@@ -213,7 +213,7 @@ var segmentedConfig = {
|
|
|
213
213
|
},
|
|
214
214
|
};
|
|
215
215
|
var Segmented = function (props) {
|
|
216
|
-
var
|
|
216
|
+
var appearance = props.appearance, className = props.className, name = props.name, _a = props.activeSegment, activeSegment = _a === void 0 ? {} : _a, segments = props.segments, isDisabled = props.isDisabled, isSkeleton = props.isSkeleton, setActiveSegment = props.setActiveSegment, onChange = props.onChange;
|
|
217
217
|
var controlRef = React.useRef(null);
|
|
218
218
|
var segmentsRefs = React.useMemo(function () {
|
|
219
219
|
return new Map(segments.map(function (item) { return [item.value, React.createRef()]; }));
|
|
@@ -237,7 +237,7 @@ var Segmented = function (props) {
|
|
|
237
237
|
}, [activeSegment, segmentsRefs]);
|
|
238
238
|
var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, segmentedConfig, isDisabled);
|
|
239
239
|
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
240
|
-
var fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelTextWrap = propsGenerator.labelTextWrap,
|
|
240
|
+
var fillActiveClass = propsGenerator.fillActiveClass, fillActiveHoverClass = propsGenerator.fillActiveHoverClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, labelTextActiveColor = propsGenerator.labelTextActiveColor, labelTextActiveHoverColor = propsGenerator.labelTextActiveHoverColor, labelTextColor = propsGenerator.labelTextColor, labelTextHoverColor = propsGenerator.labelTextHoverColor, labelTextSize = propsGenerator.labelTextSize, labelTextWrap = propsGenerator.labelTextWrap, borderColorClass = propsGenerator.borderColorClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, iconFill = propsGenerator.iconFill, iconFillActive = propsGenerator.iconFillActive, iconFillDisabled = propsGenerator.iconFillDisabled, iconSize = propsGenerator.iconSize, indicatorFillClass = propsGenerator.indicatorFillClass, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
|
|
241
241
|
return (jsxRuntime.jsx("div", { className: clsx(className, 'segmented', shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), fillClass && "fill_".concat(fillClass), widthClass && "segmented_width_".concat(widthClass), sizeClass && "segmented_size_".concat(sizeClass), borderColorClass && "border-color_".concat(borderColorClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), isSkeleton && "segmented_skeleton"), ref: controlRef, children: jsxRuntime.jsx("div", { className: "segmented__wrapper", children: jsxRuntime.jsxs("div", { className: clsx('segmented__wrapper-inner'), children: [segments === null || segments === void 0 ? void 0 : segments.map(function (item) {
|
|
242
242
|
var isActive = String(activeSegment === null || activeSegment === void 0 ? void 0 : activeSegment.value) === String(item.value);
|
|
243
243
|
return (jsxRuntime.jsx("div", { className: clsx('segmented__item', !item.label && 'segmented__item_icon', sizeClass && "segmented__item_size_".concat(sizeClass), isActive && 'segmented__item_active', !isActive && isDisabled && 'segmented__item_state_disabled', isActive &&
|
|
@@ -247,11 +247,11 @@ var Segmented = function (props) {
|
|
|
247
247
|
: fillActiveHoverClass &&
|
|
248
248
|
"fill_active_hover_".concat(fillActiveHoverClass), isActive &&
|
|
249
249
|
fillActiveClass &&
|
|
250
|
-
"fill_active_".concat(fillActiveClass)), ref: segmentsRefs.get(item.value), onClick: function () { return !isDisabled && onChangeValue(item); }, children: jsxRuntime.jsxs("div", { className: clsx('segmented__item-label', sizeClass && "segmented_size_".concat(sizeClass)), children: [item.iconBefore || item.iconBeforeActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon",
|
|
250
|
+
"fill_active_".concat(fillActiveClass)), ref: segmentsRefs.get(item.value), onClick: function () { return !isDisabled && onChangeValue(item); }, children: jsxRuntime.jsxs("div", { className: clsx('segmented__item-label', sizeClass && "segmented_size_".concat(sizeClass)), children: [item.iconBefore || item.iconBeforeActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive
|
|
251
251
|
? item.iconBeforeActive || item.iconBefore
|
|
252
|
-
: item.iconBefore, isActive: isActive })) : null, item.label && (jsxRuntime.jsx(Text.Text, { size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveHoverColor, textColorHover: labelTextHoverColor, textWrap: labelTextWrap, isActive: isActive, children: item.label })), item.icon || item.iconActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon",
|
|
252
|
+
: item.iconBefore, isActive: isActive, isDisabled: isDisabled })) : null, item.label && (jsxRuntime.jsx(Text.Text, { size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveHoverColor, textColorHover: labelTextHoverColor, textWrap: labelTextWrap, isActive: isActive, children: item.label })), item.icon || item.iconActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive ? item.iconActive || item.icon : item.icon, isActive: isActive, isDisabled: isDisabled })) : null, item.iconAfter || item.iconAfterActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive
|
|
253
253
|
? item.iconAfterActive || item.iconAfter
|
|
254
|
-
: item.iconAfter, isActive: isActive })) : null] }) }, "".concat(name, "-").concat(item.value)));
|
|
254
|
+
: item.iconAfter, isActive: isActive, isDisabled: isDisabled })) : null] }) }, "".concat(name, "-").concat(item.value)));
|
|
255
255
|
}), jsxRuntime.jsx("div", { className: clsx('segmented__indicator', indicatorFillClass && "fill_".concat(indicatorFillClass)) })] }) }) }));
|
|
256
256
|
};
|
|
257
257
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
|
|
4
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
var Select = require('react-select');
|
|
6
|
-
var Icon = require('../../
|
|
6
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
7
7
|
var React = require('react');
|
|
8
8
|
var clsx = require('clsx');
|
|
9
9
|
var CreatableSelect = require('react-select/creatable');
|
|
@@ -12,7 +12,7 @@ var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
|
12
12
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
13
13
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
14
14
|
var _default = require('@itcase/icons/default');
|
|
15
|
-
var Loader = require('../../
|
|
15
|
+
var Loader = require('../../Loader_cjs_D3lnxPlI.js');
|
|
16
16
|
var Divider = require('../../Divider_cjs_DUYtmwn2.js');
|
|
17
17
|
require('react-inlinesvg');
|
|
18
18
|
require('../hoc/urlWithAssetPrefix.js');
|
|
@@ -6,7 +6,7 @@ var clsx = require('clsx');
|
|
|
6
6
|
var react = require('swiper/react');
|
|
7
7
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
8
8
|
var useStyles = require('../hooks/useStyles/useStyles.js');
|
|
9
|
-
var Icon = require('../../
|
|
9
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
10
10
|
require('../../tslib.es6_cjs_CCZ3TN_7.js');
|
|
11
11
|
require('lodash/camelCase');
|
|
12
12
|
require('lodash/castArray');
|
|
@@ -7,7 +7,7 @@ var useActiveClasses = require('../hooks/useActiveClasses/useActiveClasses.js');
|
|
|
7
7
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
8
8
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
9
9
|
var useStyles = require('../hooks/useStyles/useStyles.js');
|
|
10
|
-
var Icon = require('../../
|
|
10
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
11
11
|
var Divider = require('../../Divider_cjs_DUYtmwn2.js');
|
|
12
12
|
var Link = require('../../Link_cjs_C5UsZUiF.js');
|
|
13
13
|
var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
@@ -47,56 +47,42 @@ var tabAppearanceSize = {
|
|
|
47
47
|
sizeXXL: {
|
|
48
48
|
size: 'xxl',
|
|
49
49
|
labelTextSize: 's',
|
|
50
|
-
badgeAppearanceSize: '
|
|
51
|
-
badgeSize: 'xs',
|
|
52
|
-
badgeTextSize: 'xs',
|
|
50
|
+
badgeAppearanceSize: 'sizeXS',
|
|
53
51
|
dividerSize: 's',
|
|
54
52
|
},
|
|
55
53
|
sizeXL: {
|
|
56
54
|
size: 'xl',
|
|
57
55
|
labelTextSize: 's',
|
|
58
|
-
badgeAppearanceSize: '
|
|
59
|
-
badgeSize: 'xs',
|
|
60
|
-
badgeTextSize: 'xs',
|
|
56
|
+
badgeAppearanceSize: 'sizeXS',
|
|
61
57
|
dividerSize: 's',
|
|
62
58
|
},
|
|
63
59
|
sizeL: {
|
|
64
60
|
size: 'l',
|
|
65
61
|
labelTextSize: 's',
|
|
66
|
-
badgeAppearanceSize: '
|
|
67
|
-
badgeSize: 'xs',
|
|
68
|
-
badgeTextSize: 'xs',
|
|
62
|
+
badgeAppearanceSize: 'sizeXS',
|
|
69
63
|
dividerSize: 's',
|
|
70
64
|
},
|
|
71
65
|
sizeM: {
|
|
72
66
|
size: 'm',
|
|
73
67
|
labelTextSize: 's',
|
|
74
|
-
badgeAppearanceSize: '
|
|
75
|
-
badgeSize: 'xs',
|
|
76
|
-
badgeTextSize: 'xs',
|
|
68
|
+
badgeAppearanceSize: 'sizeXS',
|
|
77
69
|
dividerSize: 's',
|
|
78
70
|
},
|
|
79
71
|
sizeS: {
|
|
80
72
|
size: 's',
|
|
81
73
|
labelTextSize: 's',
|
|
82
|
-
badgeAppearanceSize: '
|
|
83
|
-
badgeSize: 'xs',
|
|
84
|
-
badgeTextSize: 'xs',
|
|
74
|
+
badgeAppearanceSize: 'sizeXS',
|
|
85
75
|
dividerSize: 's',
|
|
86
76
|
},
|
|
87
77
|
sizeXS: {
|
|
88
78
|
size: 'xs',
|
|
89
79
|
labelTextSize: 'xs',
|
|
90
|
-
badgeAppearanceSize: '
|
|
91
|
-
badgeSize: 'xs',
|
|
92
|
-
badgeTextSize: 'xs',
|
|
80
|
+
badgeAppearanceSize: 'sizeXS',
|
|
93
81
|
},
|
|
94
82
|
sizeXXS: {
|
|
95
83
|
size: 'xxs',
|
|
96
84
|
labelTextSize: 'xs',
|
|
97
|
-
badgeAppearanceSize: '
|
|
98
|
-
badgeSize: 'xxs',
|
|
99
|
-
badgeTextSize: 'xxs',
|
|
85
|
+
badgeAppearanceSize: 'sizeXXS',
|
|
100
86
|
dividerSize: 's',
|
|
101
87
|
},
|
|
102
88
|
};
|
|
@@ -140,12 +126,26 @@ var tabAppearanceSurface = {
|
|
|
140
126
|
fillHover: 'surfaceSecondary',
|
|
141
127
|
labelTextColor: 'surfaceTextPrimary',
|
|
142
128
|
labelTextColorActive: 'surfaceTextAccent',
|
|
129
|
+
borderColor: 'surfaceBorderPrimary',
|
|
130
|
+
borderColorActive: 'surfaceBorderPrimary',
|
|
131
|
+
badgeAppearance: 'accentPrimary solid circular',
|
|
132
|
+
dividerFillActive: 'accentPrimary',
|
|
143
133
|
dividerFillDisabled: 'accentDisabled',
|
|
134
|
+
iconFillIcon: 'surfaceItemPrimary',
|
|
135
|
+
},
|
|
136
|
+
surfaceQuaternary: {
|
|
137
|
+
fill: 'surfaceQuaternary',
|
|
138
|
+
fillActive: 'accentPrimary',
|
|
139
|
+
fillActiveHover: 'surfaceTertiary',
|
|
140
|
+
fillDisabled: 'surfaceDisabled',
|
|
141
|
+
fillHover: 'surfaceQuaternary',
|
|
142
|
+
labelTextColor: 'surfaceTextInverse',
|
|
143
|
+
labelTextColorActive: 'surfaceTextInverse',
|
|
144
144
|
borderColor: 'surfaceBorderPrimary',
|
|
145
145
|
borderColorActive: 'surfaceBorderPrimary',
|
|
146
|
-
badgeAppearance: 'accentPrimary',
|
|
147
146
|
badgeAppearance: 'accentPrimary solid circular',
|
|
148
147
|
dividerFillActive: 'accentPrimary',
|
|
148
|
+
dividerFillDisabled: 'accentDisabled',
|
|
149
149
|
iconFillIcon: 'surfaceItemPrimary',
|
|
150
150
|
},
|
|
151
151
|
surfaceSecondary: {
|
|
@@ -156,12 +156,11 @@ var tabAppearanceSurface = {
|
|
|
156
156
|
fillHover: 'surfaceTertiary',
|
|
157
157
|
labelTextColor: 'surfaceTextPrimary',
|
|
158
158
|
labelTextColorActive: 'surfaceTextAccent',
|
|
159
|
-
dividerFillDisabled: 'accentDisabled',
|
|
160
159
|
borderColor: 'surfaceBorderPrimary',
|
|
161
160
|
borderColorActive: 'surfaceBorderPrimary',
|
|
162
|
-
badgeAppearance: 'accentPrimary',
|
|
163
161
|
badgeAppearance: 'accentPrimary solid circular',
|
|
164
162
|
dividerFillActive: 'accentPrimary',
|
|
163
|
+
dividerFillDisabled: 'accentDisabled',
|
|
165
164
|
iconFillIcon: 'surfaceItemPrimary',
|
|
166
165
|
},
|
|
167
166
|
surfaceTertiary: {
|
|
@@ -172,28 +171,11 @@ var tabAppearanceSurface = {
|
|
|
172
171
|
fillHover: 'surfaceSecondary',
|
|
173
172
|
labelTextColor: 'surfaceTextPrimary',
|
|
174
173
|
labelTextColorActive: 'surfaceTextAccent',
|
|
175
|
-
dividerFillDisabled: 'accentDisabled',
|
|
176
174
|
borderColor: 'surfaceBorderPrimary',
|
|
177
175
|
borderColorActive: 'surfaceBorderPrimary',
|
|
178
|
-
badgeAppearance: 'accentPrimary',
|
|
179
176
|
badgeAppearance: 'accentPrimary solid circular',
|
|
180
177
|
dividerFillActive: 'accentPrimary',
|
|
181
|
-
iconFillIcon: 'surfaceItemPrimary',
|
|
182
|
-
},
|
|
183
|
-
surfaceQuaternary: {
|
|
184
|
-
fill: 'surfaceQuaternary',
|
|
185
|
-
fillActive: 'accentPrimary',
|
|
186
|
-
fillActiveHover: 'surfaceTertiary',
|
|
187
|
-
fillDisabled: 'surfaceDisabled',
|
|
188
|
-
fillHover: 'surfaceQuaternary',
|
|
189
|
-
labelTextColor: 'surfaceTextInverse',
|
|
190
|
-
labelTextColorActive: 'surfaceTextInverse',
|
|
191
178
|
dividerFillDisabled: 'accentDisabled',
|
|
192
|
-
borderColor: 'surfaceBorderPrimary',
|
|
193
|
-
borderColorActive: 'surfaceBorderPrimary',
|
|
194
|
-
badgeAppearance: 'accentPrimary',
|
|
195
|
-
badgeAppearance: 'accentPrimary solid circular',
|
|
196
|
-
dividerFillActive: 'accentPrimary',
|
|
197
179
|
iconFillIcon: 'surfaceItemPrimary',
|
|
198
180
|
},
|
|
199
181
|
};
|
|
@@ -220,18 +202,20 @@ var tabConfig = {
|
|
|
220
202
|
},
|
|
221
203
|
};
|
|
222
204
|
function Tab(props) {
|
|
223
|
-
var
|
|
205
|
+
var appearance = props.appearance, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, label = props.label, badgeValue = props.badgeValue, href = props.href, link = props.link, rel = props.rel, target = props.target, before = props.before, after = props.after, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, isSkeleton = props.isSkeleton, onClick = props.onClick, onMouseEnter = props.onMouseEnter, children = props.children;
|
|
224
206
|
var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, tabConfig, isDisabled);
|
|
225
207
|
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
226
208
|
var rootClasses = useActiveClasses.useActiveClasses({
|
|
227
|
-
isDisabled: isDisabled,
|
|
228
209
|
propsGenerator: propsGenerator,
|
|
229
210
|
isActive: isActive,
|
|
211
|
+
isDisabled: isDisabled,
|
|
230
212
|
}).rootClasses;
|
|
231
|
-
var justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, labelTextAlign = propsGenerator.labelTextAlign, labelTextColor = propsGenerator.labelTextColor, labelTextColorActive = propsGenerator.labelTextColorActive, labelTextColorActiveHover = propsGenerator.labelTextColorActiveHover, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextStyle = propsGenerator.labelTextStyle, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap,
|
|
213
|
+
var justifyContentClass = propsGenerator.justifyContentClass, alignClass = propsGenerator.alignClass, alignDirectionClass = propsGenerator.alignDirectionClass, labelTextAlign = propsGenerator.labelTextAlign, labelTextColor = propsGenerator.labelTextColor, labelTextColorActive = propsGenerator.labelTextColorActive, labelTextColorActiveHover = propsGenerator.labelTextColorActiveHover, labelTextColorHover = propsGenerator.labelTextColorHover, labelTextSize = propsGenerator.labelTextSize, labelTextStyle = propsGenerator.labelTextStyle, labelTextWeight = propsGenerator.labelTextWeight, labelTextWrap = propsGenerator.labelTextWrap, badgeAppearance = propsGenerator.badgeAppearance, badgeAppearanceSize = propsGenerator.badgeAppearanceSize, badgeShape = propsGenerator.badgeShape, badgeSize = propsGenerator.badgeSize, badgeTextColor = propsGenerator.badgeTextColor, badgeTextSize = propsGenerator.badgeTextSize, dividerFill = propsGenerator.dividerFill, dividerFillActive = propsGenerator.dividerFillActive, dividerFillActiveHover = propsGenerator.dividerFillActiveHover, dividerFillDisabled = propsGenerator.dividerFillDisabled, dividerFillHover = propsGenerator.dividerFillHover, dividerSize = propsGenerator.dividerSize, icon = propsGenerator.icon, iconFill = propsGenerator.iconFill, iconFillIcon = propsGenerator.iconFillIcon, iconFillSize = propsGenerator.iconFillSize, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, iconSrc = propsGenerator.iconSrc, linkFill = propsGenerator.linkFill, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass, widthClass = propsGenerator.widthClass;
|
|
232
214
|
// @ts-expect-error
|
|
233
215
|
var tab = useStyles.useStyles(props).styles;
|
|
234
|
-
|
|
216
|
+
console.log(badgeAppearance);
|
|
217
|
+
console.log(badgeAppearanceSize);
|
|
218
|
+
return (jsxRuntime.jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && "tab_size_".concat(sizeClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass), widthClass && "width_".concat(widthClass), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), isSkeleton && "tab_skeleton", onClick && 'cursor_type_pointer'), "data-test-id": dataTestId && "".concat(dataTestId, "Tab"), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsxs(Link.Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: "tab__wrapper", children: [label && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textColorHoverActive: labelTextColorActiveHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (jsxRuntime.jsx(Icon.Badge, { appearance: "".concat(badgeAppearance, " ").concat(badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: clsx('tab__icon_after'), fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), jsxRuntime.jsx(Divider.Divider, { className: clsx('tab__divider'), width: "fill", direction: "horizontal", size: dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
|
|
235
219
|
}
|
|
236
220
|
|
|
237
221
|
function TabGroup(props) {
|
|
@@ -5,7 +5,7 @@ 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 Icon = require('../../
|
|
8
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
9
9
|
var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
10
10
|
var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
|
|
11
11
|
require('react');
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
|
-
var Icon = require('../../
|
|
6
|
+
var Icon = require('../../Icon_cjs_Cz6IyOkb.js');
|
|
7
7
|
var Text = require('../../Text_cjs_0EINiUq4.js');
|
|
8
8
|
var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
|
|
9
9
|
var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
|
|
@@ -6,7 +6,7 @@ import castArray from 'lodash/castArray';
|
|
|
6
6
|
import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
7
7
|
import { useStyles } from '../hooks/useStyles/useStyles.js';
|
|
8
8
|
import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
|
|
9
|
-
import { B as Badge, I as Icon } from '../
|
|
9
|
+
import { B as Badge, I as Icon } from '../Icon_es_BrwLifge.js';
|
|
10
10
|
import { D as Divider } from '../Divider_es_CCLBFIx6.js';
|
|
11
11
|
import { T as Text } from '../Text_es_CwV9rjFD.js';
|
|
12
12
|
import { icons16 } from '@itcase/icons/default';
|