@itcase/ui 1.8.32 → 1.8.33
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/{DatePicker_cjs_BYh1Dsto.js → DatePicker_cjs_CJl9V32f.js} +8 -8
- package/dist/{DatePicker_es_DEAcYDTL.js → DatePicker_es_C2Pi6aB-.js} +8 -8
- package/dist/{Input_cjs_BAVggtkk.js → Input_cjs_arr_wxD2.js} +21 -20
- package/dist/{Input_es_CNduH28G.js → Input_es_BW6cZThr.js} +21 -20
- package/dist/cjs/components/Breadcrumbs/stories/__mock__.js +7 -15
- package/dist/cjs/components/Code.js +31 -42
- package/dist/cjs/components/Dadata.js +1 -1
- package/dist/cjs/components/DatePeriod.js +2 -2
- package/dist/cjs/components/DatePicker.js +2 -2
- package/dist/cjs/components/Input.js +1 -1
- package/dist/cjs/components/MenuItem.js +3 -1
- package/dist/cjs/components/Pagination.js +89 -17
- package/dist/cjs/components/Search.js +15 -14
- package/dist/cjs/components/Segmented.js +1 -1
- package/dist/cjs/components/Tab/stories/__mock__.js +6 -1
- package/dist/cjs/context/Notifications.js +6 -6
- package/dist/components/Breadcrumbs/stories/__mock__.js +7 -15
- package/dist/components/Code.js +31 -42
- package/dist/components/Dadata.js +1 -1
- package/dist/components/DatePeriod.js +2 -2
- package/dist/components/DatePicker.js +2 -2
- package/dist/components/Input.js +1 -1
- package/dist/components/MenuItem.js +3 -1
- package/dist/components/Pagination.js +90 -18
- package/dist/components/Search.js +15 -14
- package/dist/components/Segmented.js +1 -1
- package/dist/components/Tab/stories/__mock__.js +6 -1
- package/dist/context/Notifications.js +6 -6
- package/dist/css/components/Input/Input.css +6 -0
- package/dist/css/components/Search/Search.css +0 -1
- package/dist/css/components/Search/css/search-input/search-input.css +0 -1
- package/dist/css/components/Tab/Tab.css +4 -0
- package/dist/css/styles/border-color/border-color_hover.css +3 -0
- package/dist/types/components/Breadcrumbs/stories/__mock__/index.d.ts +1 -0
- package/dist/types/components/Code/appearance/codeDisabled.d.ts +7 -11
- package/dist/types/components/Code/appearance/codeRequire.d.ts +7 -15
- package/dist/types/components/Code/appearance/codeStyle.d.ts +9 -9
- package/dist/types/components/Code/appearance/codeSuccess.d.ts +8 -7
- package/dist/types/components/DatePicker/DatePicker.appearance.d.ts +1 -1
- package/dist/types/components/DatePicker/appearance/datePickerStyle.d.ts +1 -1
- package/dist/types/components/Input/appearance/inputDefault.d.ts +2 -2
- package/dist/types/components/Input/appearance/inputDisabled.d.ts +2 -2
- package/dist/types/components/Input/appearance/inputError.d.ts +2 -2
- package/dist/types/components/Input/appearance/inputRequire.d.ts +2 -2
- package/dist/types/components/Input/appearance/inputStyle.d.ts +7 -6
- package/dist/types/components/Input/appearance/inputSuccess.d.ts +2 -2
- package/dist/types/components/MenuItem/appearance/menuItemSurface.d.ts +2 -0
- package/dist/types/components/Pagination/appearance/paginationAccent.d.ts +21 -0
- package/dist/types/components/Pagination/appearance/paginationSize.d.ts +45 -0
- package/dist/types/components/Pagination/appearance/paginationStyle.d.ts +14 -0
- package/dist/types/components/Pagination/appearance/paginationSurface.d.ts +4 -12
- package/dist/types/components/Search/appearance/searchDefault.d.ts +1 -1
- package/dist/types/components/Search/appearance/searchDisabled.d.ts +1 -1
- package/dist/types/components/Search/appearance/searchError.d.ts +1 -1
- package/dist/types/components/Search/appearance/searchRequire.d.ts +1 -1
- package/dist/types/components/Search/appearance/searchStyle.d.ts +8 -7
- package/dist/types/components/Search/appearance/searchSuccess.d.ts +1 -1
- package/package.json +2 -2
|
@@ -28,21 +28,98 @@ require('../../Divider_cjs_BmCJj3TN.js');
|
|
|
28
28
|
require('react-inlinesvg');
|
|
29
29
|
require('../../Link_cjs_DbRGq2Yk.js');
|
|
30
30
|
|
|
31
|
+
var paginationAppearanceAccent = {
|
|
32
|
+
accent: {
|
|
33
|
+
fill: 'accentPrimary',
|
|
34
|
+
fillHover: 'accentPrimaryHover',
|
|
35
|
+
},
|
|
36
|
+
accentPrimary: {
|
|
37
|
+
fill: 'accentPrimary',
|
|
38
|
+
fillHover: 'accentPrimaryHover',
|
|
39
|
+
borderColor: 'accentBorderPrimary',
|
|
40
|
+
},
|
|
41
|
+
accentSecondary: {
|
|
42
|
+
fill: 'accentPrimary',
|
|
43
|
+
fillHover: 'accentPrimaryHover',
|
|
44
|
+
labelTextColor: 'accentTextSecondary',
|
|
45
|
+
labelTextColorHover: 'accentTextSecondary',
|
|
46
|
+
borderColor: 'accentBorderPrimary',
|
|
47
|
+
loaderFill: 'accentPrimary',
|
|
48
|
+
loaderItemFill: 'accentItemPrimary',
|
|
49
|
+
},
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
var paginationAppearanceSize = {
|
|
53
|
+
sizeL: {
|
|
54
|
+
size: 'l',
|
|
55
|
+
labelTextSize: 'l',
|
|
56
|
+
iconAfterFillSize: '24',
|
|
57
|
+
iconAfterSize: '24',
|
|
58
|
+
iconBeforeFillSize: '24',
|
|
59
|
+
iconBeforeSize: '24',
|
|
60
|
+
pageCountDescTextSize: 'l',
|
|
61
|
+
pageCountDropdownItemDividerSize: 'xxs',
|
|
62
|
+
pageCountDropdownItemLabelSize: 'm',
|
|
63
|
+
pageCountDropdownItemSize: 'l',
|
|
64
|
+
pageCountInputIconFillSize: '24',
|
|
65
|
+
pageCountInputTextSize: 'm',
|
|
66
|
+
},
|
|
67
|
+
sizeM: {
|
|
68
|
+
size: 'm',
|
|
69
|
+
labelTextSize: 'm',
|
|
70
|
+
iconAfterFillSize: '24',
|
|
71
|
+
iconAfterSize: '24',
|
|
72
|
+
iconBeforeFillSize: '24',
|
|
73
|
+
iconBeforeSize: '24',
|
|
74
|
+
pageCountDescTextSize: 'm',
|
|
75
|
+
pageCountDropdownItemDividerSize: 'xxs',
|
|
76
|
+
pageCountDropdownItemLabelSize: 'm',
|
|
77
|
+
pageCountDropdownItemSize: 'l',
|
|
78
|
+
pageCountInputIconFillSize: '24',
|
|
79
|
+
pageCountInputTextSize: 'm',
|
|
80
|
+
},
|
|
81
|
+
sizeS: {
|
|
82
|
+
size: 's',
|
|
83
|
+
labelTextSize: 's',
|
|
84
|
+
iconAfterFillSize: '20',
|
|
85
|
+
iconAfterSize: '20',
|
|
86
|
+
iconBeforeFillSize: '20',
|
|
87
|
+
iconBeforeSize: '20',
|
|
88
|
+
},
|
|
89
|
+
sizeXS: {
|
|
90
|
+
size: 'xs',
|
|
91
|
+
labelTextSize: 'xs',
|
|
92
|
+
beforeSize: '16',
|
|
93
|
+
iconAfterFillSize: '16',
|
|
94
|
+
},
|
|
95
|
+
};
|
|
96
|
+
|
|
97
|
+
var paginationAppearanceStyle = {
|
|
98
|
+
solid: {
|
|
99
|
+
borderColor: 'none',
|
|
100
|
+
},
|
|
101
|
+
outlined: {
|
|
102
|
+
fill: 'none',
|
|
103
|
+
},
|
|
104
|
+
full: {},
|
|
105
|
+
ghost: {
|
|
106
|
+
fill: 'none',
|
|
107
|
+
borderColor: 'none',
|
|
108
|
+
},
|
|
109
|
+
};
|
|
110
|
+
|
|
31
111
|
var paginationAppearanceSurface = {
|
|
32
112
|
surfacePrimary: {
|
|
33
113
|
fill: 'surfacePrimary',
|
|
34
114
|
fillHover: 'surfaceSecondary',
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
nextLabel: (jsxRuntime.jsx(Tooltip.Icon, { size: "14", fillSize: "32", iconFill: "surfaceItemPrimary", shape: "circular", SvgImage: _default.icons32.Arrow.Chevron_Right_Small })),
|
|
115
|
+
nextIcon: _default.icons32.Arrow.ChevronRightSmall,
|
|
116
|
+
nextIconFillIcon: 'surfaceItemPrimary',
|
|
38
117
|
pageCountDesc: 'кол-во строк',
|
|
39
118
|
pageCountDescTextColor: 'surfaceTextPrimary',
|
|
40
|
-
pageCountDescTextSize: 'm',
|
|
41
119
|
pageCountDropdownAlignment: 'topCenter',
|
|
42
120
|
pageCountDropdownElevation: 8,
|
|
43
121
|
pageCountDropdownFill: 'surfacePrimary',
|
|
44
122
|
pageCountDropdownItemDividerFill: 'surfaceSecondary',
|
|
45
|
-
pageCountDropdownItemDividerSize: 'xxs',
|
|
46
123
|
pageCountDropdownItemFill: 'surfacePrimary',
|
|
47
124
|
pageCountDropdownItemFillActive: 'accentPrimary',
|
|
48
125
|
pageCountDropdownItemFillActiveHover: 'accentActiveHover',
|
|
@@ -52,22 +129,17 @@ var paginationAppearanceSurface = {
|
|
|
52
129
|
pageCountDropdownItemLabelColorActive: 'accentTextPrimary',
|
|
53
130
|
pageCountDropdownItemLabelColorActiveHover: 'accentTextPrimary',
|
|
54
131
|
pageCountDropdownItemLabelColorHover: 'surfaceTextPrimary',
|
|
55
|
-
pageCountDropdownItemLabelSize: 'm',
|
|
56
|
-
pageCountDropdownItemShowDivider: true,
|
|
57
|
-
pageCountDropdownItemSize: 'l',
|
|
58
132
|
pageCountDropdownItemWidth: 'hug',
|
|
59
133
|
pageCountDropdownShape: 'rounded',
|
|
60
|
-
pageCountInputIcon: _default.icons24.Arrow.
|
|
134
|
+
pageCountInputIcon: _default.icons24.Arrow.ChevronDownSmall,
|
|
61
135
|
pageCountInputIconColor: 'surfaceItemPrimary',
|
|
62
|
-
pageCountInputIconFillSize: '24',
|
|
63
136
|
pageCountInputTextColor: 'surfaceTextPrimary',
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
previousLabel: (jsxRuntime.jsx(Tooltip.Icon, { size: "14", fillSize: "32", iconFill: "surfaceItemPrimary", shape: "circular", SvgImage: _default.icons32.Arrow.Chevron_Left_Small })),
|
|
137
|
+
previousIcon: _default.icons32.Arrow.ChevronLeftSmall,
|
|
138
|
+
previousIconFillIcon: 'surfaceItemPrimary',
|
|
67
139
|
},
|
|
68
140
|
};
|
|
69
141
|
|
|
70
|
-
var paginationAppearance = tslib_es6.__assign({}, paginationAppearanceSurface);
|
|
142
|
+
var paginationAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, paginationAppearanceSurface), paginationAppearanceAccent), paginationAppearanceSize), paginationAppearanceStyle);
|
|
71
143
|
|
|
72
144
|
var paginationConfig = {
|
|
73
145
|
appearance: paginationAppearance,
|
|
@@ -138,15 +210,15 @@ function Pagination(props) {
|
|
|
138
210
|
return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = paginationConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
|
|
139
211
|
}, {});
|
|
140
212
|
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
141
|
-
var justifyContentClass = propsGenerator.justifyContentClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, marginPagesDisplayed = propsGenerator.marginPagesDisplayed,
|
|
213
|
+
var justifyContentClass = propsGenerator.justifyContentClass, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, marginPagesDisplayed = propsGenerator.marginPagesDisplayed, nextIcon = propsGenerator.nextIcon, nextIconFill = propsGenerator.nextIconFill, nextIconFillIcon = propsGenerator.nextIconFillIcon, nextIconFillSize = propsGenerator.nextIconFillSize, nextIconSize = propsGenerator.nextIconSize, pageCountDescTextColor = propsGenerator.pageCountDescTextColor, pageCountDescTextSize = propsGenerator.pageCountDescTextSize, pageCountDropdownAlignment = propsGenerator.pageCountDropdownAlignment, pageCountDropdownElevation = propsGenerator.pageCountDropdownElevation, pageCountDropdownFill = propsGenerator.pageCountDropdownFill, pageCountDropdownItemDividerFill = propsGenerator.pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize = propsGenerator.pageCountDropdownItemDividerSize, pageCountDropdownItemFill = propsGenerator.pageCountDropdownItemFill, pageCountDropdownItemFillActive = propsGenerator.pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover = propsGenerator.pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover = propsGenerator.pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign = propsGenerator.pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor = propsGenerator.pageCountDropdownItemLabelColor, pageCountDropdownItemLabelColorActive = propsGenerator.pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActiveHover = propsGenerator.pageCountDropdownItemLabelColorActiveHover, pageCountDropdownItemLabelColorHover = propsGenerator.pageCountDropdownItemLabelColorHover, pageCountDropdownItemLabelSize = propsGenerator.pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap = propsGenerator.pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider = propsGenerator.pageCountDropdownItemShowDivider, pageCountDropdownItemSize = propsGenerator.pageCountDropdownItemSize, pageCountDropdownItemWidth = propsGenerator.pageCountDropdownItemWidth, pageCountDropdownShape = propsGenerator.pageCountDropdownShape, pageCountInputIcon = propsGenerator.pageCountInputIcon, pageCountInputIconColor = propsGenerator.pageCountInputIconColor, pageCountInputIconFillSize = propsGenerator.pageCountInputIconFillSize, pageCountInputIconSrc = propsGenerator.pageCountInputIconSrc, pageCountInputTextColor = propsGenerator.pageCountInputTextColor, pageCountInputTextSize = propsGenerator.pageCountInputTextSize, pageRangeDisplayed = propsGenerator.pageRangeDisplayed, previousIcon = propsGenerator.previousIcon, previousIconFill = propsGenerator.previousIconFill, previousIconFillIcon = propsGenerator.previousIconFillIcon, previousIconFillSize = propsGenerator.previousIconFillSize, previousIconSize = propsGenerator.previousIconSize;
|
|
142
214
|
var paginationStyles = useStyles.useStyles(props).styles;
|
|
143
215
|
return (jsxRuntime.jsxs("div", { className: "pagination", "data-testid": dataTestId, "data-tour": dataTour, style: paginationStyles, children: [jsxRuntime.jsx(ReactPaginate, { disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", activeClassName: "pagination__item_state_active cursor_type_default", activeLinkClassName: "pagination__item-link_state_active", breakClassName: "pagination__item pagination__item_break", breakLabel: "...", breakLinkClassName: "pagination__item-link", containerClassName: clsx(className, 'pagination__container', justifyContentClass &&
|
|
144
216
|
"pagination_justify-content_".concat(justifyContentClass)),
|
|
145
217
|
// pages settings
|
|
146
218
|
forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed, nextClassName: "pagination__item pagination__item_next",
|
|
147
219
|
// next button
|
|
148
|
-
nextLabel:
|
|
149
|
-
return activeDropdownItem === item ? (jsxRuntime.jsx(DropdownItem.DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillActive: pageCountDropdownItemFillActive, fillActiveHover: pageCountDropdownItemFillActiveHover, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorActive: pageCountDropdownItemLabelColorActive,
|
|
220
|
+
nextLabel: jsxRuntime.jsx(Tooltip.Icon, { fill: nextIconFill, fillSize: nextIconFillSize, iconFill: nextIconFillIcon, iconSize: nextIconSize, shape: "circular", SvgImage: nextIcon }), nextLinkClassName: "pagination__item-link", pageClassName: "pagination__item", pageCount: paginationPagesCount, pageLinkClassName: "pagination__item-link", pageRangeDisplayed: pageRangeDisplayed, previousClassName: "pagination__item pagination__item_previous", previousLabel: jsxRuntime.jsx(Tooltip.Icon, { fill: previousIconFill, fillSize: previousIconFillSize, iconFill: previousIconFillIcon, iconSize: previousIconSize, shape: "circular", SvgImage: previousIcon }), previousLinkClassName: "pagination__item-link", onPageChange: _onChangePage }), isPageCount && (jsxRuntime.jsxs("div", { className: clsx(className, 'pagination__count'), children: [jsxRuntime.jsx(Text.Text, { className: "pagination__count-text", size: pageCountDescTextSize, textColor: pageCountDescTextColor, children: pageCountDesc }), jsxRuntime.jsxs("div", { className: clsx('pagination__input', 'cursor_type_pointer', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass)), onClick: onClickCommandMenuButton, children: [jsxRuntime.jsx(Text.Text, { size: pageCountInputTextSize, textColor: pageCountInputTextColor, children: activeDropdownItem }), jsxRuntime.jsx(Tooltip.Icon, { fillSize: pageCountInputIconFillSize, iconFill: pageCountInputIconColor, imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), jsxRuntime.jsx(DropdownItem.Dropdown, { alignment: pageCountDropdownAlignment, fill: pageCountDropdownFill, elevation: pageCountDropdownElevation, shape: pageCountDropdownShape, isOpen: isOpenDropdown, setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map(function (item, index) {
|
|
221
|
+
return activeDropdownItem === item ? (jsxRuntime.jsx(DropdownItem.DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillActive: pageCountDropdownItemFillActive, fillActiveHover: pageCountDropdownItemFillActiveHover, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorActive: pageCountDropdownItemLabelColorActive, labelTextColorActiveHover: pageCountDropdownItemLabelColorActiveHover, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountArray.length - 1 &&
|
|
150
222
|
pageCountDropdownItemShowDivider, isActive: true, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item)) : (jsxRuntime.jsx(DropdownItem.DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountArray.length - 1 &&
|
|
151
223
|
pageCountDropdownItemShowDivider, isActive: false, onClick: function (event) { return handleDropdownItemClick(event, item); } }, item));
|
|
152
224
|
}) })] })] }))] }));
|
|
@@ -30,7 +30,7 @@ var searchAppearanceDefault = {
|
|
|
30
30
|
defaultPrimary: {
|
|
31
31
|
fill: 'surfaceSecondary',
|
|
32
32
|
borderColor: 'surfaceBorderQuaternary',
|
|
33
|
-
|
|
33
|
+
borderColorHover: 'surfaceBorderQuaternaryHover',
|
|
34
34
|
iconAfterFill: 'surfaceItemQuaternary',
|
|
35
35
|
iconBeforeFill: 'surfaceItemQuaternary',
|
|
36
36
|
iconClearFill: 'surfaceItemQuaternary',
|
|
@@ -43,7 +43,7 @@ var searchAppearanceDisabled = {
|
|
|
43
43
|
disabledPrimary: {
|
|
44
44
|
fill: 'surfaceDisabled',
|
|
45
45
|
borderColor: 'surfaceBorderDisabled',
|
|
46
|
-
|
|
46
|
+
borderColorHover: 'surfaceBorderDisabledHover',
|
|
47
47
|
iconAfterFill: 'surfaceItemPrimary',
|
|
48
48
|
iconBeforeFill: 'surfaceItemPrimary',
|
|
49
49
|
iconClearFill: 'surfaceItemPrimary',
|
|
@@ -56,7 +56,7 @@ var searchAppearanceError = {
|
|
|
56
56
|
errorPrimary: {
|
|
57
57
|
fill: 'errorTertiary',
|
|
58
58
|
borderColor: 'errorBorderQuaternary',
|
|
59
|
-
|
|
59
|
+
borderColorHover: 'errorBorderQuaternaryHover',
|
|
60
60
|
iconAfterFill: 'errorItemSecondary',
|
|
61
61
|
iconBeforeFill: 'errorItemSecondary',
|
|
62
62
|
iconClearFill: 'errorItemSecondary',
|
|
@@ -69,7 +69,7 @@ var searchAppearanceRequire = {
|
|
|
69
69
|
requirePrimary: {
|
|
70
70
|
fill: 'warningTertiary',
|
|
71
71
|
borderColor: 'warningBorderSecondary',
|
|
72
|
-
|
|
72
|
+
borderColorHover: 'warningBorderSecondaryHover',
|
|
73
73
|
iconAfterFill: 'warningItemSecondary',
|
|
74
74
|
iconBeforeFill: 'warningItemSecondary',
|
|
75
75
|
iconClearFill: 'warningItemSecondary',
|
|
@@ -124,18 +124,19 @@ var searchAppearanceSize = {
|
|
|
124
124
|
};
|
|
125
125
|
|
|
126
126
|
var searchAppearanceStyle = {
|
|
127
|
-
|
|
127
|
+
solid: {
|
|
128
128
|
borderColor: 'none',
|
|
129
|
-
|
|
130
|
-
ghost: {
|
|
131
|
-
fill: 'none',
|
|
132
|
-
borderWidth: '0',
|
|
129
|
+
borderColorHover: 'none',
|
|
133
130
|
},
|
|
134
131
|
outlined: {
|
|
135
132
|
fill: 'none',
|
|
136
133
|
},
|
|
137
|
-
|
|
138
|
-
|
|
134
|
+
full: {
|
|
135
|
+
borderColor: 'none',
|
|
136
|
+
},
|
|
137
|
+
ghost: {
|
|
138
|
+
fill: 'none',
|
|
139
|
+
borderColor: 'none',
|
|
139
140
|
},
|
|
140
141
|
};
|
|
141
142
|
|
|
@@ -143,7 +144,7 @@ var searchAppearanceSuccess = {
|
|
|
143
144
|
successPrimary: {
|
|
144
145
|
fill: 'successTertiary',
|
|
145
146
|
borderColor: 'accentBorderQuaternary',
|
|
146
|
-
|
|
147
|
+
borderColorHover: 'accentBorderQuaternary',
|
|
147
148
|
textColor: 'surfaceTextPrimary',
|
|
148
149
|
iconAfterFill: 'successItemSecondary',
|
|
149
150
|
iconBeforeFill: 'successItemSecondary',
|
|
@@ -177,9 +178,9 @@ var SearchInput = React.forwardRef(function SearchInput(props, ref) {
|
|
|
177
178
|
return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = searchInputConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
|
|
178
179
|
}, {});
|
|
179
180
|
var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
|
|
180
|
-
var size = propsGenerator.size, fillClass = propsGenerator.fillClass, borderColorClass = propsGenerator.borderColorClass,
|
|
181
|
+
var size = propsGenerator.size, fillClass = propsGenerator.fillClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, iconAfter = propsGenerator.iconAfter, iconAfterFill = propsGenerator.iconAfterFill, iconAfterSize = propsGenerator.iconAfterSize, iconAfterSrc = propsGenerator.iconAfterSrc, iconBefore = propsGenerator.iconBefore, iconBeforeFill = propsGenerator.iconBeforeFill, iconBeforeSize = propsGenerator.iconBeforeSize, iconBeforeSrc = propsGenerator.iconBeforeSrc, iconClear = propsGenerator.iconClear, iconClearFill = propsGenerator.iconClearFill, iconClearSize = propsGenerator.iconClearSize, iconClearSrc = propsGenerator.iconClearSrc, inputFillClass = propsGenerator.inputFillClass, inputShapeClass = propsGenerator.inputShapeClass, inputTextColorClass = propsGenerator.inputTextColorClass, inputTextSizeClass = propsGenerator.inputTextSizeClass, inputTextStyleClass = propsGenerator.inputTextStyleClass, inputTextWeightClass = propsGenerator.inputTextWeightClass, placeholderTextColor = propsGenerator.placeholderTextColor, placeholderTextSize = propsGenerator.placeholderTextSize, placeholderTextStyle = propsGenerator.placeholderTextStyle, placeholderTextWeight = propsGenerator.placeholderTextWeight, shapeClass = propsGenerator.shapeClass, widthClass = propsGenerator.widthClass;
|
|
181
182
|
var searchInputStyles = useStyles.useStyles(props).styles;
|
|
182
|
-
return (jsxRuntime.jsxs("label", { className: clsx(className, 'search-input', shapeClass && "search_shape_".concat(shapeClass), fillClass && "fill_".concat(fillClass), widthClass && "width_".concat(widthClass), borderColorClass && "border-color_".concat(borderColorClass),
|
|
183
|
+
return (jsxRuntime.jsxs("label", { className: clsx(className, 'search-input', shapeClass && "search_shape_".concat(shapeClass), fillClass && "fill_".concat(fillClass), widthClass && "width_".concat(widthClass), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), size && "search-input_size_".concat(size), type && "search-input_type_".concat(type), isSkeleton && "search-input_skeleton"), "data-tour": dataTour, style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Tooltip.Icon, { className: "search-input__icon search-input__icon-before", size: iconBeforeSize, iconFill: iconBeforeFill, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && "fill_".concat(inputFillClass), inputShapeClass && "search-input_shape_".concat(inputShapeClass)), children: [jsxRuntime.jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
|
|
183
184
|
inputTextWeightClass ||
|
|
184
185
|
inputTextColorClass ||
|
|
185
186
|
inputTextStyleClass) &&
|
|
@@ -35,7 +35,7 @@ var segmentedAppearanceDefault = {
|
|
|
35
35
|
fill: 'surfaceSecondary',
|
|
36
36
|
fillActive: 'accentPrimary',
|
|
37
37
|
fillActiveHover: 'accentPrimary',
|
|
38
|
-
fillHover: '
|
|
38
|
+
fillHover: 'surfaceTertiary',
|
|
39
39
|
labelTextActiveColor: 'accentTextPrimary',
|
|
40
40
|
labelTextColor: 'surfaceTextPrimary',
|
|
41
41
|
indicatorFill: 'accentPrimary',
|
|
@@ -7,7 +7,12 @@ var tabListMock = {
|
|
|
7
7
|
{ key: 1, label: 'Tab 1', isActive: true },
|
|
8
8
|
{ key: 2, label: 'Tab 2', isActive: false },
|
|
9
9
|
{ key: 3, label: 'Tab 3', badgeValue: 3, isActive: false },
|
|
10
|
-
{
|
|
10
|
+
{
|
|
11
|
+
key: 4,
|
|
12
|
+
label: 'Tab 4',
|
|
13
|
+
icon: _default.icons16.Placeholder.Default,
|
|
14
|
+
isActive: false,
|
|
15
|
+
},
|
|
11
16
|
],
|
|
12
17
|
};
|
|
13
18
|
|
|
@@ -129,7 +129,7 @@ function createNotification(notification, onClose) {
|
|
|
129
129
|
var status = STATUSES.warning;
|
|
130
130
|
// let appearance = STATUSES.appearance
|
|
131
131
|
var closeByTime = 4500;
|
|
132
|
-
var
|
|
132
|
+
var appearance = '';
|
|
133
133
|
if (typeof notification === 'string') {
|
|
134
134
|
text = notification;
|
|
135
135
|
}
|
|
@@ -142,24 +142,24 @@ function createNotification(notification, onClose) {
|
|
|
142
142
|
}
|
|
143
143
|
switch (status) {
|
|
144
144
|
case 'success':
|
|
145
|
-
|
|
145
|
+
appearance = 'successPrimary';
|
|
146
146
|
break;
|
|
147
147
|
case 'info':
|
|
148
|
-
|
|
148
|
+
appearance = 'infoPrimary';
|
|
149
149
|
break;
|
|
150
150
|
case 'error':
|
|
151
|
-
|
|
151
|
+
appearance = 'errorPrimary';
|
|
152
152
|
break;
|
|
153
153
|
case 'warning':
|
|
154
|
-
|
|
154
|
+
appearance = 'warningPrimary';
|
|
155
155
|
break;
|
|
156
156
|
}
|
|
157
157
|
return {
|
|
158
158
|
id: id,
|
|
159
|
+
appearance: appearance,
|
|
159
160
|
title: title,
|
|
160
161
|
status: status,
|
|
161
162
|
text: text,
|
|
162
|
-
textColor: textColor,
|
|
163
163
|
closeByTime: closeByTime,
|
|
164
164
|
onClose: onClose,
|
|
165
165
|
};
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { icons16 } from '@itcase/icons/default';
|
|
2
|
+
|
|
1
3
|
var breadcrumbsListMock = {
|
|
2
4
|
breadcrumbsList: [
|
|
3
5
|
{
|
|
@@ -5,45 +7,35 @@ var breadcrumbsListMock = {
|
|
|
5
7
|
key: 1,
|
|
6
8
|
text: 'Text 123',
|
|
7
9
|
href: '/',
|
|
8
|
-
|
|
9
|
-
// Use url to ".storybook/assets/icons/placeholder.svg"
|
|
10
|
-
// icon: icons16.Placeholder,
|
|
10
|
+
icon: icons16.Placeholder.Default,
|
|
11
11
|
},
|
|
12
12
|
{
|
|
13
13
|
id: '2',
|
|
14
14
|
key: 2,
|
|
15
15
|
text: 'Text 123',
|
|
16
16
|
href: '/',
|
|
17
|
-
|
|
18
|
-
// Use url to ".storybook/assets/icons/placeholder.svg"
|
|
19
|
-
// icon: icons16.Placeholder,
|
|
17
|
+
icon: icons16.Placeholder.Default,
|
|
20
18
|
},
|
|
21
19
|
{
|
|
22
20
|
id: '3',
|
|
23
21
|
key: 3,
|
|
24
22
|
text: 'Text 123',
|
|
25
23
|
href: '/',
|
|
26
|
-
|
|
27
|
-
// Use url to ".storybook/assets/icons/placeholder.svg"
|
|
28
|
-
// icon: icons16.Placeholder,
|
|
24
|
+
icon: icons16.Placeholder.Default,
|
|
29
25
|
},
|
|
30
26
|
{
|
|
31
27
|
id: '4',
|
|
32
28
|
key: 4,
|
|
33
29
|
text: 'Text 123',
|
|
34
30
|
href: '/',
|
|
35
|
-
|
|
36
|
-
// Use url to ".storybook/assets/icons/placeholder.svg"
|
|
37
|
-
// icon: icons16.Placeholder,
|
|
31
|
+
icon: icons16.Placeholder.Default,
|
|
38
32
|
},
|
|
39
33
|
{
|
|
40
34
|
id: '5',
|
|
41
35
|
key: 5,
|
|
42
36
|
text: 'Text 123',
|
|
43
37
|
href: '/',
|
|
44
|
-
|
|
45
|
-
// Use url to ".storybook/assets/icons/placeholder.svg"
|
|
46
|
-
// icon: icons16.Placeholder,
|
|
38
|
+
icon: icons16.Placeholder.Default,
|
|
47
39
|
},
|
|
48
40
|
],
|
|
49
41
|
};
|
package/dist/components/Code.js
CHANGED
|
@@ -28,17 +28,13 @@ var codeAppearanceDefault = {
|
|
|
28
28
|
|
|
29
29
|
var codeAppearanceDisabled = {
|
|
30
30
|
disabledPrimary: {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
fill: 'surfaceSecondary',
|
|
39
|
-
borderColor: 'surfaceBorderTertiary',
|
|
40
|
-
borderHover: 'surfaceBorderQuaternary',
|
|
41
|
-
placeholderTextColor: 'surfaceTextSecondary',
|
|
31
|
+
inputBorderColor: 'surfaceBorderDisabled',
|
|
32
|
+
inputBorderColorHover: 'surfaceBorderDisabled',
|
|
33
|
+
inputCaretColor: 'surfaceItemPrimary',
|
|
34
|
+
inputFill: 'surfaceDisabled',
|
|
35
|
+
inputFillHover: 'surfaceDisabled',
|
|
36
|
+
inputPlaceholderTextColor: 'surfaceTextQuaternary',
|
|
37
|
+
inputTextColor: 'surfaceTextPrimary',
|
|
42
38
|
},
|
|
43
39
|
};
|
|
44
40
|
|
|
@@ -56,21 +52,13 @@ var codeAppearanceError = {
|
|
|
56
52
|
|
|
57
53
|
var codeAppearanceRequire = {
|
|
58
54
|
requirePrimary: {
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
},
|
|
67
|
-
requireSecondary: {
|
|
68
|
-
fill: 'surfaceSecondary',
|
|
69
|
-
borderColor: 'surfaceBorderTertiary',
|
|
70
|
-
borderHover: 'surfaceBorderQuaternary',
|
|
71
|
-
iconBeforeFill: 'surfaceItemQuaternary',
|
|
72
|
-
iconClearFill: 'surfaceItemPrimary',
|
|
73
|
-
placeholderTextColor: 'surfaceTextSecondary',
|
|
55
|
+
inputBorderColor: 'warningBorderSecondary',
|
|
56
|
+
inputBorderColorHover: 'warningBorderSecondary',
|
|
57
|
+
inputCaretColor: 'surfaceItemPrimary',
|
|
58
|
+
inputFill: 'warningTertiary',
|
|
59
|
+
inputFillHover: 'warningTertiary',
|
|
60
|
+
inputPlaceholderTextColor: 'surfaceTextQuaternary',
|
|
61
|
+
inputTextColor: 'surfaceTextPrimary',
|
|
74
62
|
},
|
|
75
63
|
};
|
|
76
64
|
|
|
@@ -88,29 +76,30 @@ var codeAppearanceSize = {
|
|
|
88
76
|
};
|
|
89
77
|
|
|
90
78
|
var codeAppearanceStyle = {
|
|
91
|
-
solid: {
|
|
92
|
-
borderColor: 'none',
|
|
93
|
-
},
|
|
94
|
-
outlined: {
|
|
95
|
-
fill: 'none',
|
|
96
|
-
},
|
|
97
79
|
full: {
|
|
98
|
-
|
|
80
|
+
inputBorderColor: 'none',
|
|
99
81
|
},
|
|
100
82
|
ghost: {
|
|
101
|
-
|
|
102
|
-
|
|
83
|
+
inputBorderColor: 'none',
|
|
84
|
+
inputFill: 'none',
|
|
85
|
+
},
|
|
86
|
+
outlined: {
|
|
87
|
+
inputFill: 'none',
|
|
88
|
+
},
|
|
89
|
+
solid: {
|
|
90
|
+
inputBorderColor: 'none',
|
|
103
91
|
},
|
|
104
92
|
};
|
|
105
93
|
|
|
106
94
|
var codeAppearanceSuccess = {
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
95
|
+
successPrimary: {
|
|
96
|
+
inputBorderColor: 'successBorderSecondary',
|
|
97
|
+
inputBorderColorHover: 'successBorderSecondary',
|
|
98
|
+
inputCaretColor: 'surfaceItemPrimary',
|
|
99
|
+
inputFill: 'successTertiary',
|
|
100
|
+
inputFillHover: 'successTertiary',
|
|
101
|
+
inputPlaceholderTextColor: 'surfaceTextQuaternary',
|
|
102
|
+
inputTextColor: 'surfaceTextPrimary',
|
|
114
103
|
},
|
|
115
104
|
};
|
|
116
105
|
|
|
@@ -3,7 +3,7 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
3
3
|
import { useMemo } from 'react';
|
|
4
4
|
import clsx from 'clsx';
|
|
5
5
|
import { PartySuggestions } from 'react-dadata';
|
|
6
|
-
import { I as Input } from '../
|
|
6
|
+
import { I as Input } from '../Input_es_BW6cZThr.js';
|
|
7
7
|
import '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
8
8
|
import 'lodash/camelCase';
|
|
9
9
|
import 'lodash/castArray';
|
|
@@ -4,7 +4,7 @@ import { useCallback } from 'react';
|
|
|
4
4
|
import clsx from 'clsx';
|
|
5
5
|
import { DateTime } from 'luxon';
|
|
6
6
|
import { DATE_PERIOD_INTERVALS } from '@itcase/common';
|
|
7
|
-
import { D as DatePickerInput } from '../
|
|
7
|
+
import { D as DatePickerInput } from '../DatePicker_es_C2Pi6aB-.js';
|
|
8
8
|
import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
|
|
9
9
|
import { b as ChipsGroup, C as Chips } from '../ChipsGroup_es_CXS0aeon.js';
|
|
10
10
|
import 'date-fns/locale';
|
|
@@ -26,7 +26,7 @@ import '../Text_es_BfLRfj-5.js';
|
|
|
26
26
|
import 'react-inlinesvg';
|
|
27
27
|
import '../Link_es_DxtZLeKY.js';
|
|
28
28
|
import '../Loader_es_B2auu_rc.js';
|
|
29
|
-
import '../
|
|
29
|
+
import '../Input_es_BW6cZThr.js';
|
|
30
30
|
import '../Label_es_DmDqs4Rc.js';
|
|
31
31
|
import '@itcase/icons/default';
|
|
32
32
|
import 'lodash/castArray';
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../
|
|
1
|
+
export { D as DatePickerInput, a as datePickerAppearance, d as datePickerConfig } from '../DatePicker_es_C2Pi6aB-.js';
|
|
2
2
|
import '../tslib.es6_es_Bwu1Cn-t.js';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'react';
|
|
@@ -25,6 +25,6 @@ import '../Text_es_BfLRfj-5.js';
|
|
|
25
25
|
import 'react-inlinesvg';
|
|
26
26
|
import '../Link_es_DxtZLeKY.js';
|
|
27
27
|
import '../Loader_es_B2auu_rc.js';
|
|
28
|
-
import '../
|
|
28
|
+
import '../Input_es_BW6cZThr.js';
|
|
29
29
|
import '../Label_es_DmDqs4Rc.js';
|
|
30
30
|
import '@itcase/icons/default';
|
package/dist/components/Input.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { I as Input, a as inputAppearance, i as inputConfig } from '../
|
|
1
|
+
export { I as Input, a as inputAppearance, i as inputConfig } from '../Input_es_BW6cZThr.js';
|
|
2
2
|
import '../tslib.es6_es_Bwu1Cn-t.js';
|
|
3
3
|
import 'react/jsx-runtime';
|
|
4
4
|
import 'react';
|
|
@@ -112,7 +112,9 @@ var menuItemAppearanceStyle = {
|
|
|
112
112
|
var menuItemAppearanceSurface = {
|
|
113
113
|
surfacePrimary: {
|
|
114
114
|
fill: 'surfacePrimary',
|
|
115
|
-
|
|
115
|
+
fillActive: 'surfaceHover',
|
|
116
|
+
fillActiveHover: 'surfaceHover',
|
|
117
|
+
fillHover: 'surfaceHover',
|
|
116
118
|
labelTextColor: 'surfaceTextPrimary',
|
|
117
119
|
iconAfterFillIcon: 'surfaceItemPrimary',
|
|
118
120
|
iconBeforeFillIcon: 'surfaceItemPrimary',
|