@itcase/ui 1.3.24 → 1.3.26
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/{Badge-Bcj5H3vs.js → Badge-CcaG-4ly.js} +49 -8
- package/dist/{Badge-DxHwStfq.js → Badge-CoHPvO35.js} +49 -8
- package/dist/{Button-BSygAkO5.js → Button-BFX_EEum.js} +6 -6
- package/dist/{Button-Bn8Mjoeh.js → Button-BSzqA8CB.js} +6 -6
- package/dist/{DropdownItem-CExjlJjQ.js → DropdownItem-Bq-oPnWX.js} +4 -4
- package/dist/{DropdownItem-DFE1HsyX.js → DropdownItem-FNOztnTT.js} +4 -4
- package/dist/{Group-CIIZoSm5.js → Group-B9L2NTgM.js} +1 -1
- package/dist/{Group-pMTTxQH4.js → Group-D6CXN4hS.js} +1 -1
- package/dist/{Icon-DotE-03d.js → Icon-BZa8B7te.js} +3 -3
- package/dist/{Icon-ByLHEhHL.js → Icon-B_bS-o4g.js} +2 -2
- package/dist/{Input-Ck5IbuH6.js → Input-BrV5_NoV.js} +1 -1
- package/dist/{Input-zkYoZhQk.js → Input-ffioh1sj.js} +1 -1
- package/dist/{Label-9O3dQlUa.js → Label-DQyB2ThM.js} +6 -6
- package/dist/{Label-GEBQXoVJ.js → Label-HKRKV3mn.js} +6 -6
- package/dist/{Link-CoAhRbFg.js → Link-CxWmYMyL.js} +1 -1
- package/dist/{Link-C53o3P6_.js → Link-DN2LhPjD.js} +4 -4
- package/dist/{Loader-D_53c71f.js → Loader-Dn036JwE.js} +2 -2
- package/dist/{Loader-Cm98w6lJ.js → Loader-K_DJmah6.js} +2 -2
- package/dist/{MenuItem-Cu6wlj-X.js → MenuItem-CLDNk2l8.js} +3 -3
- package/dist/{MenuItem-Ybh5Mpoi.js → MenuItem-amqx61Y0.js} +3 -3
- package/dist/{Scrollbar-DkJr3S-w.js → Scrollbar-Bo7z7ELm.js} +1 -1
- package/dist/{Scrollbar-CL9V8d1X.js → Scrollbar-CKbA0jQU.js} +1 -1
- package/dist/{Text-COHpLTYr.js → Text-Beslj4Ns.js} +1 -1
- package/dist/{Text-D9sEeRE4.js → Text-JayJa3hj.js} +1 -1
- package/dist/{Title-Cl95USIn.js → Title-CHgrIarR.js} +1 -1
- package/dist/{Title-BduD-TXE.js → Title-DBaHcpvB.js} +1 -1
- package/dist/{Tooltip-BsbXMzGd.js → Tooltip-1Jbub0K6.js} +4 -4
- package/dist/{Tooltip-CyZCVyba.js → Tooltip-CNua1g76.js} +4 -4
- package/dist/cjs/components/Accordion.js +8 -7
- package/dist/cjs/components/Avatar.js +10 -9
- package/dist/cjs/components/Badge.js +4 -3
- package/dist/cjs/components/Breadcrumbs.js +7 -6
- package/dist/cjs/components/Button.js +8 -7
- package/dist/cjs/components/Caption.js +1 -0
- package/dist/cjs/components/Card.js +3 -2
- package/dist/cjs/components/Cell.js +10 -9
- package/dist/cjs/components/Checkbox.js +4 -3
- package/dist/cjs/components/Checkmark.js +65 -0
- package/dist/cjs/components/Chips.js +5 -4
- package/dist/cjs/components/Choice.js +11 -10
- package/dist/cjs/components/Code.js +4 -3
- package/dist/cjs/components/CookiesWarning.js +11 -10
- package/dist/cjs/components/DadataHintField.js +2 -1
- package/dist/cjs/components/DatePicker.js +17 -16
- package/dist/cjs/components/Divider.js +1 -0
- package/dist/cjs/components/Dot.js +1 -0
- package/dist/cjs/components/Dropdown.js +4 -3
- package/dist/cjs/components/Flex.js +3 -2
- package/dist/cjs/components/Grid.js +3 -2
- package/dist/cjs/components/Group.js +2 -1
- package/dist/cjs/components/HTMLContent.js +1 -0
- package/dist/cjs/components/HeroTitle.js +2 -1
- package/dist/cjs/components/Icon.js +6 -5
- package/dist/cjs/components/Image.js +1 -0
- package/dist/cjs/components/Input.js +2 -1
- package/dist/cjs/components/InputMask.js +2 -1
- package/dist/cjs/components/InputPassword.js +6 -5
- package/dist/cjs/components/Label.js +5 -4
- package/dist/cjs/components/Link.js +2 -1
- package/dist/cjs/components/List.js +2 -1
- package/dist/cjs/components/Loader.js +3 -2
- package/dist/cjs/components/Logo.js +3 -2
- package/dist/cjs/components/Menu.js +5 -4
- package/dist/cjs/components/MenuItem.js +4 -3
- package/dist/cjs/components/Modal.js +6 -5
- package/dist/cjs/components/ModalSheetBottom.js +1 -0
- package/dist/cjs/components/Notification.js +4 -5
- package/dist/cjs/components/Overlay.js +1 -0
- package/dist/cjs/components/Pagination.js +29 -28
- package/dist/cjs/components/Panel.js +3 -2
- package/dist/cjs/components/Radio.js +4 -3
- package/dist/cjs/components/RangeSlider.js +1 -0
- package/dist/cjs/components/Response.js +82 -57
- package/dist/cjs/components/SVGContent.js +1 -0
- package/dist/cjs/components/ScrollOnDrag.js +1 -0
- package/dist/cjs/components/ScrollToView.js +2 -1
- package/dist/cjs/components/Scrollbar.js +1 -1
- package/dist/cjs/components/Search.js +10 -9
- package/dist/cjs/components/Segmented.js +14 -13
- package/dist/cjs/components/Select.js +28 -12
- package/dist/cjs/components/SiteMenu.js +7 -6
- package/dist/cjs/components/Swiper.js +9 -8
- package/dist/cjs/components/Tab.js +10 -9
- package/dist/cjs/components/Text.js +2 -1
- package/dist/cjs/components/Textarea.js +1 -0
- package/dist/cjs/components/Tile.js +5 -4
- package/dist/cjs/components/Title.js +2 -1
- package/dist/cjs/components/Tooltip.js +4 -3
- package/dist/cjs/components/Video.js +1 -0
- package/dist/cjs/components/Wrapper.js +2 -1
- package/dist/cjs/context/Notifications.js +6 -6
- package/dist/cjs/context/UIContext.js +6 -1
- package/dist/cjs/hooks/useDeviceTargetClass.js +1 -0
- package/dist/cjs/hooks/useDeviceTargetClassGenerator.interface.js +1 -0
- package/dist/cjs/hooks/useDeviceTargetClassGenerator.js +5 -4
- package/dist/cjs/hooks/useMediaQueries.js +0 -12
- package/dist/cjs/hooks/useStyles.js +1 -0
- package/dist/cjs/hooks.js +0 -1
- package/dist/cjs/utils/setViewportProperty.js +8 -0
- package/dist/cjs/utils.js +7 -0
- package/dist/components/Accordion.js +9 -8
- package/dist/components/Avatar.js +11 -10
- package/dist/components/Badge.js +4 -3
- package/dist/components/Breadcrumbs.js +8 -7
- package/dist/components/Button.js +9 -8
- package/dist/components/Caption.js +2 -1
- package/dist/components/Card.js +4 -3
- package/dist/components/Cell.js +11 -10
- package/dist/components/Checkbox.js +5 -4
- package/dist/components/Checkmark.js +61 -0
- package/dist/components/Chips.js +6 -5
- package/dist/components/Choice.js +12 -11
- package/dist/components/Code.js +5 -4
- package/dist/components/CookiesWarning.js +12 -11
- package/dist/components/DadataHintField.js +3 -2
- package/dist/components/DatePicker.js +18 -17
- package/dist/components/Divider.js +2 -1
- package/dist/components/Dot.js +2 -1
- package/dist/components/Dropdown.js +5 -4
- package/dist/components/Flex.js +4 -3
- package/dist/components/Grid.js +4 -3
- package/dist/components/Group.js +3 -2
- package/dist/components/HTMLContent.js +2 -1
- package/dist/components/HeroTitle.js +3 -2
- package/dist/components/Icon.js +7 -6
- package/dist/components/Image.js +2 -1
- package/dist/components/Input.js +3 -2
- package/dist/components/InputMask.js +3 -2
- package/dist/components/InputPassword.js +7 -6
- package/dist/components/Label.js +6 -5
- package/dist/components/Link.js +3 -2
- package/dist/components/List.js +3 -2
- package/dist/components/Loader.js +4 -3
- package/dist/components/Logo.js +4 -3
- package/dist/components/Menu.js +6 -5
- package/dist/components/MenuItem.js +5 -4
- package/dist/components/Modal.js +7 -6
- package/dist/components/ModalSheetBottom.js +2 -1
- package/dist/components/Notification.js +5 -6
- package/dist/components/Overlay.js +2 -1
- package/dist/components/Pagination.js +30 -29
- package/dist/components/Panel.js +4 -3
- package/dist/components/Radio.js +5 -4
- package/dist/components/RangeSlider.js +2 -1
- package/dist/components/Response.js +83 -58
- package/dist/components/SVGContent.js +2 -1
- package/dist/components/ScrollOnDrag.js +2 -1
- package/dist/components/ScrollToView.js +3 -2
- package/dist/components/Scrollbar.js +1 -1
- package/dist/components/Search.js +11 -10
- package/dist/components/Segmented.js +15 -14
- package/dist/components/Select.js +29 -13
- package/dist/components/SiteMenu.js +8 -7
- package/dist/components/Swiper.js +10 -9
- package/dist/components/Tab.js +11 -10
- package/dist/components/Text.js +3 -2
- package/dist/components/Textarea.js +2 -1
- package/dist/components/Tile.js +6 -5
- package/dist/components/Title.js +3 -2
- package/dist/components/Tooltip.js +5 -4
- package/dist/components/Video.js +1 -0
- package/dist/components/Wrapper.js +3 -2
- package/dist/context/Notifications.js +7 -7
- package/dist/context/UIContext.js +7 -2
- package/dist/css/components/Checkmark/Checkmark.css +30 -0
- package/dist/css/components/Checkmark/Checkmark.tokens.css +16 -0
- package/dist/css/components/Code/Code.css +2 -1
- package/dist/css/components/Dropdown/Dropdown.css +1 -1
- package/dist/css/components/Notification/Notification.css +6 -2
- package/dist/css/components/Notification/css/__item/notification__item_set_form.css +6 -2
- package/dist/css/components/Pagination/Pagination.css +4 -4
- package/dist/css/components/Pagination/css/__item/pagination__item_state_active.css +4 -4
- package/dist/css/components/Response/Response.css +10 -2
- package/dist/css/components/Swiper/Swiper.css +2 -2
- package/dist/css/components/Switch/Switch.css +1 -1
- package/dist/css/components/Tile/Tile.css +1 -1
- package/dist/css/tokens/colors.css +9 -0
- package/dist/hooks/useDeviceTargetClass.js +1 -0
- package/dist/hooks/useDeviceTargetClassGenerator.interface.js +1 -1
- package/dist/hooks/useDeviceTargetClassGenerator.js +6 -5
- package/dist/hooks/useMediaQueries.js +0 -12
- package/dist/hooks/useStyles.js +1 -0
- package/dist/hooks.js +1 -1
- package/dist/stories/Checkmark.mdx +11 -0
- package/dist/stories/Overview.mdx +5 -5
- package/dist/stories/Playground.mdx +4 -4
- package/dist/{tslib.es6-5FtW-kfi.js → tslib.es6-Bwu1Cn-t.js} +1 -1
- package/dist/types/components/Badge/stories/args.d.ts +69 -0
- package/dist/types/components/Checkmark/Checkmark.appearance.d.ts +2 -0
- package/dist/types/components/Checkmark/Checkmark.d.ts +4 -0
- package/dist/types/components/Checkmark/Checkmark.interface.d.ts +29 -0
- package/dist/types/components/Checkmark/index.d.ts +2 -0
- package/dist/types/components/Notification/Notification.interface.d.ts +3 -3
- package/dist/types/components/Select/index.d.ts +15 -15
- package/dist/types/utils/index.d.ts +2 -0
- package/dist/types/utils/setViewportProperty.d.ts +2 -0
- package/dist/utils/setViewportProperty.js +6 -0
- package/dist/utils.js +1 -0
- package/package.json +29 -53
|
@@ -1,8 +1,9 @@
|
|
|
1
|
+
import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
|
|
1
2
|
import { jsx } from 'react/jsx-runtime';
|
|
2
3
|
import clsx from 'clsx';
|
|
3
4
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
4
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
5
|
-
import { T as Text } from './Text-
|
|
6
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
6
7
|
|
|
7
8
|
var badgeAppearance = {
|
|
8
9
|
accent: {
|
|
@@ -15,6 +16,11 @@ var badgeAppearance = {
|
|
|
15
16
|
fillHover: 'primaryPrimaryHover',
|
|
16
17
|
textColor: 'primaryTextPrimary',
|
|
17
18
|
},
|
|
19
|
+
secondary: {
|
|
20
|
+
fill: 'secondaryPrimary',
|
|
21
|
+
fillHover: 'secondaryPrimaryHover',
|
|
22
|
+
textColor: 'secondaryTextPrimary',
|
|
23
|
+
},
|
|
18
24
|
surfacePrimary: {
|
|
19
25
|
fill: 'surfacePrimary',
|
|
20
26
|
fillHover: 'surfacePrimaryHover',
|
|
@@ -35,16 +41,47 @@ var badgeAppearance = {
|
|
|
35
41
|
fillHover: 'surfaceTertiaryHover',
|
|
36
42
|
textColor: 'surfaceTextInverse',
|
|
37
43
|
},
|
|
38
|
-
secondary: {
|
|
39
|
-
fill: 'secondaryPrimary',
|
|
40
|
-
fillHover: 'secondaryPrimaryHover',
|
|
41
|
-
textColor: 'secondaryTextPrimary',
|
|
42
|
-
},
|
|
43
44
|
disabled: {
|
|
44
45
|
fill: 'accentDisabled',
|
|
45
46
|
fillHover: 'none',
|
|
46
47
|
textColor: 'accentTextDisabled',
|
|
47
48
|
},
|
|
49
|
+
success: {
|
|
50
|
+
fill: 'successPrimary',
|
|
51
|
+
fillHover: 'successPrimary',
|
|
52
|
+
textColor: 'successTextSecondary',
|
|
53
|
+
},
|
|
54
|
+
warning: {
|
|
55
|
+
fill: 'warningPrimary',
|
|
56
|
+
fillHover: 'warningPrimary',
|
|
57
|
+
textColor: 'warningTextSecondary',
|
|
58
|
+
},
|
|
59
|
+
danger: {
|
|
60
|
+
fill: 'dangerPrimary',
|
|
61
|
+
fillHover: 'dangerPrimary',
|
|
62
|
+
textColor: 'dangerTextSecondary',
|
|
63
|
+
},
|
|
64
|
+
textXXS: {
|
|
65
|
+
textSize: 'xxs',
|
|
66
|
+
},
|
|
67
|
+
textXS: {
|
|
68
|
+
textSize: 'xs',
|
|
69
|
+
},
|
|
70
|
+
textS: {
|
|
71
|
+
textSize: 's',
|
|
72
|
+
},
|
|
73
|
+
textM: {
|
|
74
|
+
textSize: 'm',
|
|
75
|
+
},
|
|
76
|
+
textL: {
|
|
77
|
+
textSize: 'l',
|
|
78
|
+
},
|
|
79
|
+
textXL: {
|
|
80
|
+
textSize: 'xl',
|
|
81
|
+
},
|
|
82
|
+
textXXL: {
|
|
83
|
+
textSize: 'xxl',
|
|
84
|
+
},
|
|
48
85
|
};
|
|
49
86
|
|
|
50
87
|
var badgeConfig = {
|
|
@@ -55,14 +92,18 @@ var badgeConfig = {
|
|
|
55
92
|
};
|
|
56
93
|
function Badge(props) {
|
|
57
94
|
var children = props.children, appearance = props.appearance, className = props.className, mode = props.mode, textColor = props.textColor, textSize = props.textSize, value = props.value;
|
|
95
|
+
// // @ts-expect-error
|
|
96
|
+
// const appearanceConfig = badgeConfig.appearance && badgeConfig.appearance[appearance]
|
|
58
97
|
// @ts-expect-error
|
|
59
|
-
var appearanceConfig =
|
|
98
|
+
var appearanceConfig = appearance
|
|
99
|
+
.split(' ')
|
|
100
|
+
.reduce(function (acc, appearance) { var _a; return (__assign(__assign({}, acc), (_a = badgeConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance])); }, {});
|
|
60
101
|
var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
61
102
|
var borderColorClass = classGenerator.borderColorClass, borderColorHoverClass = classGenerator.borderColorHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, positionClass = classGenerator.positionClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass;
|
|
62
103
|
// @ts-expect-error
|
|
63
104
|
var badgeStyles = useStyles(props).styles;
|
|
64
105
|
return (jsx("div", { className: clsx(className, 'badge', !value && 'badge_type_status', mode && "badge_mode_".concat(mode), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), positionClass && "position_".concat(positionClass), sizeClass && "badge_size_".concat(sizeClass), shapeClass && "badge_shape_".concat(shapeClass)), style: badgeStyles, children: children ||
|
|
65
|
-
(value && (jsx(Text, { size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig ===
|
|
106
|
+
(value && (jsx(Text, { size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: value }))) }));
|
|
66
107
|
}
|
|
67
108
|
Badge.defaultProps = {
|
|
68
109
|
shape: 'circular',
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
+
var tslib_es6 = require('./tslib.es6-CCZ3TN_7.js');
|
|
3
4
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
5
|
var clsx = require('clsx');
|
|
5
6
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
6
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
7
|
-
var Text = require('./Text-
|
|
8
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
8
9
|
|
|
9
10
|
var badgeAppearance = {
|
|
10
11
|
accent: {
|
|
@@ -17,6 +18,11 @@ var badgeAppearance = {
|
|
|
17
18
|
fillHover: 'primaryPrimaryHover',
|
|
18
19
|
textColor: 'primaryTextPrimary',
|
|
19
20
|
},
|
|
21
|
+
secondary: {
|
|
22
|
+
fill: 'secondaryPrimary',
|
|
23
|
+
fillHover: 'secondaryPrimaryHover',
|
|
24
|
+
textColor: 'secondaryTextPrimary',
|
|
25
|
+
},
|
|
20
26
|
surfacePrimary: {
|
|
21
27
|
fill: 'surfacePrimary',
|
|
22
28
|
fillHover: 'surfacePrimaryHover',
|
|
@@ -37,16 +43,47 @@ var badgeAppearance = {
|
|
|
37
43
|
fillHover: 'surfaceTertiaryHover',
|
|
38
44
|
textColor: 'surfaceTextInverse',
|
|
39
45
|
},
|
|
40
|
-
secondary: {
|
|
41
|
-
fill: 'secondaryPrimary',
|
|
42
|
-
fillHover: 'secondaryPrimaryHover',
|
|
43
|
-
textColor: 'secondaryTextPrimary',
|
|
44
|
-
},
|
|
45
46
|
disabled: {
|
|
46
47
|
fill: 'accentDisabled',
|
|
47
48
|
fillHover: 'none',
|
|
48
49
|
textColor: 'accentTextDisabled',
|
|
49
50
|
},
|
|
51
|
+
success: {
|
|
52
|
+
fill: 'successPrimary',
|
|
53
|
+
fillHover: 'successPrimary',
|
|
54
|
+
textColor: 'successTextSecondary',
|
|
55
|
+
},
|
|
56
|
+
warning: {
|
|
57
|
+
fill: 'warningPrimary',
|
|
58
|
+
fillHover: 'warningPrimary',
|
|
59
|
+
textColor: 'warningTextSecondary',
|
|
60
|
+
},
|
|
61
|
+
danger: {
|
|
62
|
+
fill: 'dangerPrimary',
|
|
63
|
+
fillHover: 'dangerPrimary',
|
|
64
|
+
textColor: 'dangerTextSecondary',
|
|
65
|
+
},
|
|
66
|
+
textXXS: {
|
|
67
|
+
textSize: 'xxs',
|
|
68
|
+
},
|
|
69
|
+
textXS: {
|
|
70
|
+
textSize: 'xs',
|
|
71
|
+
},
|
|
72
|
+
textS: {
|
|
73
|
+
textSize: 's',
|
|
74
|
+
},
|
|
75
|
+
textM: {
|
|
76
|
+
textSize: 'm',
|
|
77
|
+
},
|
|
78
|
+
textL: {
|
|
79
|
+
textSize: 'l',
|
|
80
|
+
},
|
|
81
|
+
textXL: {
|
|
82
|
+
textSize: 'xl',
|
|
83
|
+
},
|
|
84
|
+
textXXL: {
|
|
85
|
+
textSize: 'xxl',
|
|
86
|
+
},
|
|
50
87
|
};
|
|
51
88
|
|
|
52
89
|
var badgeConfig = {
|
|
@@ -57,14 +94,18 @@ var badgeConfig = {
|
|
|
57
94
|
};
|
|
58
95
|
function Badge(props) {
|
|
59
96
|
var children = props.children, appearance = props.appearance, className = props.className, mode = props.mode, textColor = props.textColor, textSize = props.textSize, value = props.value;
|
|
97
|
+
// // @ts-expect-error
|
|
98
|
+
// const appearanceConfig = badgeConfig.appearance && badgeConfig.appearance[appearance]
|
|
60
99
|
// @ts-expect-error
|
|
61
|
-
var appearanceConfig =
|
|
100
|
+
var appearanceConfig = appearance
|
|
101
|
+
.split(' ')
|
|
102
|
+
.reduce(function (acc, appearance) { var _a; return (tslib_es6.__assign(tslib_es6.__assign({}, acc), (_a = badgeConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearance])); }, {});
|
|
62
103
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
63
104
|
var borderColorClass = classGenerator.borderColorClass, borderColorHoverClass = classGenerator.borderColorHoverClass, borderTypeClass = classGenerator.borderTypeClass, borderWidthClass = classGenerator.borderWidthClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, positionClass = classGenerator.positionClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass;
|
|
64
105
|
// @ts-expect-error
|
|
65
106
|
var badgeStyles = useStyles.useStyles(props).styles;
|
|
66
107
|
return (jsxRuntime.jsx("div", { className: clsx(className, 'badge', !value && 'badge_type_status', mode && "badge_mode_".concat(mode), borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), positionClass && "position_".concat(positionClass), sizeClass && "badge_size_".concat(sizeClass), shapeClass && "badge_shape_".concat(shapeClass)), style: badgeStyles, children: children ||
|
|
67
|
-
(value && (jsxRuntime.jsx(Text.Text, { size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig ===
|
|
108
|
+
(value && (jsxRuntime.jsx(Text.Text, { size: textSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textSize), textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: value }))) }));
|
|
68
109
|
}
|
|
69
110
|
Badge.defaultProps = {
|
|
70
111
|
shape: 'circular',
|
|
@@ -5,10 +5,10 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
|
-
var Icon = require('./Icon-
|
|
9
|
-
var Link = require('./Link-
|
|
10
|
-
var Loader = require('./Loader-
|
|
11
|
-
var Text = require('./Text-
|
|
8
|
+
var Icon = require('./Icon-B_bS-o4g.js');
|
|
9
|
+
var Link = require('./Link-CxWmYMyL.js');
|
|
10
|
+
var Loader = require('./Loader-Dn036JwE.js');
|
|
11
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
12
12
|
|
|
13
13
|
var buttonAppearance = {
|
|
14
14
|
dev: {
|
|
@@ -77,7 +77,7 @@ var buttonConfig = {
|
|
|
77
77
|
},
|
|
78
78
|
};
|
|
79
79
|
var Button = React.forwardRef(function Button(props, ref) {
|
|
80
|
-
var children = props.children, isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _a = props.htmlType, htmlType = _a ===
|
|
80
|
+
var children = props.children, isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _a = props.htmlType, htmlType = _a === void 0 ? 'button' : _a, icon = props.icon, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterFillSize = props.iconAfterFillSize, iconAfterShape = props.iconAfterShape, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeFillSize = props.iconBeforeFillSize, iconBeforeShape = props.iconBeforeShape, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconFill = props.iconFill, iconFillSize = props.iconFillSize, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, label = props.label, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextSizeMobile = props.labelTextSizeMobile, labelTextTruncate = props.labelTextTruncate, labelTextWeight = props.labelTextWeight, labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap, link = props.link, loaderFill = props.loaderFill, loaderItemFill = props.loaderItemFill, _b = props.loaderSet, loaderSet = _b === void 0 ? 'simple' : _b, _c = props.loading, loading = _c === void 0 ? false : _c, rel = props.rel, set = props.set, target = props.target, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
81
81
|
// @ts-expect-error
|
|
82
82
|
var appearanceConfig = buttonConfig.appearance && buttonConfig.appearance[appearance];
|
|
83
83
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -95,7 +95,7 @@ var Button = React.forwardRef(function Button(props, ref) {
|
|
|
95
95
|
iconBefore ||
|
|
96
96
|
iconBeforeSrc ||
|
|
97
97
|
iconSrc) &&
|
|
98
|
-
'button_type_with-icon', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "button_shape_".concat(shapeClass), sizeClass && "button_size_".concat(sizeClass), widthClass && "button_width_".concat(widthClass), elevationClass && "elevation_".concat(elevationClass), onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', loading && 'button_state_loading'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsx(Loader.Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig ===
|
|
98
|
+
'button_type_with-icon', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "button_shape_".concat(shapeClass), sizeClass && "button_size_".concat(sizeClass), widthClass && "button_width_".concat(widthClass), elevationClass && "elevation_".concat(elevationClass), onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', loading && 'button_state_loading'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxRuntime.jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsxRuntime.jsx(Loader.Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsx(Text.Text, { className: "button__label", width: labelTextWidth, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
|
|
99
99
|
});
|
|
100
100
|
|
|
101
101
|
exports.Button = Button;
|
|
@@ -3,10 +3,10 @@ import React from 'react';
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
|
-
import { I as Icon } from './Icon-
|
|
7
|
-
import {
|
|
8
|
-
import { L as Loader } from './Loader-
|
|
9
|
-
import { T as Text } from './Text-
|
|
6
|
+
import { I as Icon } from './Icon-BZa8B7te.js';
|
|
7
|
+
import { L as LinkWrapper } from './Link-DN2LhPjD.js';
|
|
8
|
+
import { L as Loader } from './Loader-K_DJmah6.js';
|
|
9
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
10
10
|
|
|
11
11
|
var buttonAppearance = {
|
|
12
12
|
dev: {
|
|
@@ -75,7 +75,7 @@ var buttonConfig = {
|
|
|
75
75
|
},
|
|
76
76
|
};
|
|
77
77
|
var Button = React.forwardRef(function Button(props, ref) {
|
|
78
|
-
var children = props.children, isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _a = props.htmlType, htmlType = _a ===
|
|
78
|
+
var children = props.children, isDisabled = props.isDisabled, after = props.after, appearance = props.appearance, Badge = props.Badge, before = props.before, className = props.className, dataTestId = props.dataTestId, dataTour = props.dataTour, fillIcon = props.fillIcon, fillIconAfter = props.fillIconAfter, fillIconBefore = props.fillIconBefore, href = props.href, _a = props.htmlType, htmlType = _a === void 0 ? 'button' : _a, icon = props.icon, iconAfter = props.iconAfter, iconAfterFill = props.iconAfterFill, iconAfterFillSize = props.iconAfterFillSize, iconAfterShape = props.iconAfterShape, iconAfterSize = props.iconAfterSize, iconAfterSrc = props.iconAfterSrc, iconBefore = props.iconBefore, iconBeforeFill = props.iconBeforeFill, iconBeforeFillSize = props.iconBeforeFillSize, iconBeforeShape = props.iconBeforeShape, iconBeforeSize = props.iconBeforeSize, iconBeforeSrc = props.iconBeforeSrc, iconFill = props.iconFill, iconFillSize = props.iconFillSize, iconShape = props.iconShape, iconSize = props.iconSize, iconSrc = props.iconSrc, label = props.label, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextSizeMobile = props.labelTextSizeMobile, labelTextTruncate = props.labelTextTruncate, labelTextWeight = props.labelTextWeight, labelTextWidth = props.labelTextWidth, labelTextWrap = props.labelTextWrap, link = props.link, loaderFill = props.loaderFill, loaderItemFill = props.loaderItemFill, _b = props.loaderSet, loaderSet = _b === void 0 ? 'simple' : _b, _c = props.loading, loading = _c === void 0 ? false : _c, rel = props.rel, set = props.set, target = props.target, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
79
79
|
// @ts-expect-error
|
|
80
80
|
var appearanceConfig = buttonConfig.appearance && buttonConfig.appearance[appearance];
|
|
81
81
|
var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -93,7 +93,7 @@ var Button = React.forwardRef(function Button(props, ref) {
|
|
|
93
93
|
iconBefore ||
|
|
94
94
|
iconBeforeSrc ||
|
|
95
95
|
iconSrc) &&
|
|
96
|
-
'button_type_with-icon', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "button_shape_".concat(shapeClass), sizeClass && "button_size_".concat(sizeClass), widthClass && "button_width_".concat(widthClass), elevationClass && "elevation_".concat(elevationClass), onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', loading && 'button_state_loading'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsx(Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig ===
|
|
96
|
+
'button_type_with-icon', borderColorClass ? 'button_set_outlined' : set ? "button_set_".concat(set) : 'button_set_filled', borderWidthClass && "border-width_".concat(borderWidthClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "button_shape_".concat(shapeClass), sizeClass && "button_size_".concat(sizeClass), widthClass && "button_width_".concat(widthClass), elevationClass && "elevation_".concat(elevationClass), onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', loading && 'button_state_loading'), "data-test-id": dataTestId && "".concat(dataTestId, "Button"), "data-tour": dataTour, DefaultComponent: "button", disabled: isDisabled, href: link || href, rel: rel, style: buttonStyles, target: target, type: htmlType, onClick: onClick, onMouseDown: onMouseDown, children: jsxs("div", { className: "button__wrapper", ref: ref, children: [loading && (jsx(Loader, { className: clsx(className, 'button__loader', shapeClass), fill: loaderFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderFill), itemFill: loaderItemFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.loaderItemFill), set: loaderSet })), before, (iconBefore || iconBeforeSrc) && (jsx(Icon, { className: "button__icon_before", fill: fillIconBefore, fillSize: iconBeforeFillSize, iconFill: iconBeforeFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconBeforeFill), imageSrc: iconBeforeSrc, shape: iconBeforeShape, size: iconBeforeSize, SvgImage: iconBefore })), (icon || iconSrc) && (jsx(Icon, { className: "button__icon", fill: fillIcon, fillSize: iconFillSize, iconFill: iconFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconFill), imageSrc: iconSrc, shape: iconShape, size: iconSize, SvgImage: icon })), (children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "button__label", width: labelTextWidth, size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize) || undefined, sizeMobile: labelTextSizeMobile, style: labelStyles, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, children: children || label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (iconAfter || iconAfterSrc) && (jsx(Icon, { className: "button__icon_after", fill: fillIconAfter, fillSize: iconAfterFillSize, iconFill: iconAfterFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.iconAfterFill), imageSrc: iconAfterSrc, shape: iconAfterShape, size: iconAfterSize, SvgImage: iconAfter })), Badge, after] }) }));
|
|
97
97
|
});
|
|
98
98
|
|
|
99
99
|
export { Button as B, buttonAppearance as a, buttonConfig as b };
|
|
@@ -4,11 +4,11 @@ import clsx from 'clsx';
|
|
|
4
4
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
6
|
import { D as Divider } from './Divider-DBvDCUqP.js';
|
|
7
|
-
import {
|
|
8
|
-
import { T as Text } from './Text-
|
|
7
|
+
import { a as Link } from './Link-DN2LhPjD.js';
|
|
8
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
9
9
|
|
|
10
10
|
function Dropdown(props) {
|
|
11
|
-
var children = props.children, isOpen = props.isOpen, after = props.after, _a = props.animationClose, animationClose = _a ===
|
|
11
|
+
var children = props.children, isOpen = props.isOpen, after = props.after, _a = props.animationClose, animationClose = _a === void 0 ? 'dropdown_animation_close' : _a, _b = props.animationOpen, animationOpen = _b === void 0 ? 'dropdown_animation_open' : _b, before = props.before, className = props.className, _c = props.set, set = _c === void 0 ? 'normal' : _c, setIsOpen = props.setIsOpen;
|
|
12
12
|
var dropdownRef = useRef(null);
|
|
13
13
|
// const [isOpen, setIsOpen] = useState(false)
|
|
14
14
|
var _d = useState({
|
|
@@ -81,7 +81,7 @@ function DropdownItem(props) {
|
|
|
81
81
|
var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, directionClass = classGenerator.directionClass, fillActiveClass = classGenerator.fillActiveClass, fillActiveHoverClass = classGenerator.fillActiveHoverClass, fillClass = classGenerator.fillClass, fillDisabledClass = classGenerator.fillDisabledClass, fillHoverClass = classGenerator.fillHoverClass, justifyContentClass = classGenerator.justifyContentClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, typeClass = classGenerator.typeClass, widthClass = classGenerator.widthClass;
|
|
82
82
|
// @ts-expect-error
|
|
83
83
|
var dropdownItem = useStyles(props).styles;
|
|
84
|
-
return (jsxs("div", { className: clsx('dropdown__item', isActive && 'dropdown__item_state_active', isHover && 'dropdown__item_state_hover', directionClass && "dropdown__item_direction_".concat(directionClass), className, fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), sizeClass && "dropdown__item_size_".concat(sizeClass), shapeClass && "dropdown__item_shape_".concat(shapeClass), typeClass && "dropdown__item_type_".concat(typeClass), widthClass && "dropdown__item_width_".concat(widthClass), onClick && 'cursor_type_pointer', set && "dropdown__item_set_".concat(set), justifyContentClass && "dropdown__item_justify-content_".concat(justifyContentClass)), style: dropdownItem, onClick: onClick, onMouseEnter: onMouseEnter, children: [jsx("div", { className: "dropdown__item-wrapper", children: jsx(Link, { className: clsx('dropdown__item-link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [label && (jsx(Text, { className: "dropdown__item-label", size: labelTextSize || (appearanceConfig === null || appearanceConfig ===
|
|
84
|
+
return (jsxs("div", { className: clsx('dropdown__item', isActive && 'dropdown__item_state_active', isHover && 'dropdown__item_state_hover', directionClass && "dropdown__item_direction_".concat(directionClass), className, fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), sizeClass && "dropdown__item_size_".concat(sizeClass), shapeClass && "dropdown__item_shape_".concat(shapeClass), typeClass && "dropdown__item_type_".concat(typeClass), widthClass && "dropdown__item_width_".concat(widthClass), onClick && 'cursor_type_pointer', set && "dropdown__item_set_".concat(set), justifyContentClass && "dropdown__item_justify-content_".concat(justifyContentClass)), style: dropdownItem, onClick: onClick, onMouseEnter: onMouseEnter, children: [jsx("div", { className: "dropdown__item-wrapper", children: jsx(Link, { className: clsx('dropdown__item-link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [label && (jsx(Text, { className: "dropdown__item-label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textAlign: labelTextAlign, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorActive: isActive ? labelTextColorActive : undefined, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), desc && (jsx(Text, { className: "dropdown__item-desc", size: descTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextSize), textColor: descTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColor), textColorGradient: descTextGradient, textColorHover: descTextColorHover, textStyle: descTextStyle, textWeight: descTextWeight, textWrap: descTextWrap, children: desc }))] })), after] }) }) }), showDivider && (jsx(Divider, { width: "fill", fill: dividerFill || 'surfaceTertiary', direction: dividerDirection, size: dividerSize }))] }));
|
|
85
85
|
}
|
|
86
86
|
DropdownItem.defaultProps = {
|
|
87
87
|
width: 'fixed',
|
|
@@ -6,11 +6,11 @@ var clsx = require('clsx');
|
|
|
6
6
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
8
|
var Divider = require('./Divider-Goh6mpPK.js');
|
|
9
|
-
var Link = require('./Link-
|
|
10
|
-
var Text = require('./Text-
|
|
9
|
+
var Link = require('./Link-CxWmYMyL.js');
|
|
10
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
11
11
|
|
|
12
12
|
function Dropdown(props) {
|
|
13
|
-
var children = props.children, isOpen = props.isOpen, after = props.after, _a = props.animationClose, animationClose = _a ===
|
|
13
|
+
var children = props.children, isOpen = props.isOpen, after = props.after, _a = props.animationClose, animationClose = _a === void 0 ? 'dropdown_animation_close' : _a, _b = props.animationOpen, animationOpen = _b === void 0 ? 'dropdown_animation_open' : _b, before = props.before, className = props.className, _c = props.set, set = _c === void 0 ? 'normal' : _c, setIsOpen = props.setIsOpen;
|
|
14
14
|
var dropdownRef = React.useRef(null);
|
|
15
15
|
// const [isOpen, setIsOpen] = useState(false)
|
|
16
16
|
var _d = React.useState({
|
|
@@ -83,7 +83,7 @@ function DropdownItem(props) {
|
|
|
83
83
|
var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, directionClass = classGenerator.directionClass, fillActiveClass = classGenerator.fillActiveClass, fillActiveHoverClass = classGenerator.fillActiveHoverClass, fillClass = classGenerator.fillClass, fillDisabledClass = classGenerator.fillDisabledClass, fillHoverClass = classGenerator.fillHoverClass, justifyContentClass = classGenerator.justifyContentClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, typeClass = classGenerator.typeClass, widthClass = classGenerator.widthClass;
|
|
84
84
|
// @ts-expect-error
|
|
85
85
|
var dropdownItem = useStyles.useStyles(props).styles;
|
|
86
|
-
return (jsxRuntime.jsxs("div", { className: clsx('dropdown__item', isActive && 'dropdown__item_state_active', isHover && 'dropdown__item_state_hover', directionClass && "dropdown__item_direction_".concat(directionClass), className, fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), sizeClass && "dropdown__item_size_".concat(sizeClass), shapeClass && "dropdown__item_shape_".concat(shapeClass), typeClass && "dropdown__item_type_".concat(typeClass), widthClass && "dropdown__item_width_".concat(widthClass), onClick && 'cursor_type_pointer', set && "dropdown__item_set_".concat(set), justifyContentClass && "dropdown__item_justify-content_".concat(justifyContentClass)), style: dropdownItem, onClick: onClick, onMouseEnter: onMouseEnter, children: [jsxRuntime.jsx("div", { className: "dropdown__item-wrapper", children: jsxRuntime.jsx(Link.Link, { className: clsx('dropdown__item-link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [label && (jsxRuntime.jsx(Text.Text, { className: "dropdown__item-label", size: labelTextSize || (appearanceConfig === null || appearanceConfig ===
|
|
86
|
+
return (jsxRuntime.jsxs("div", { className: clsx('dropdown__item', isActive && 'dropdown__item_state_active', isHover && 'dropdown__item_state_hover', directionClass && "dropdown__item_direction_".concat(directionClass), className, fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), sizeClass && "dropdown__item_size_".concat(sizeClass), shapeClass && "dropdown__item_shape_".concat(shapeClass), typeClass && "dropdown__item_type_".concat(typeClass), widthClass && "dropdown__item_width_".concat(widthClass), onClick && 'cursor_type_pointer', set && "dropdown__item_set_".concat(set), justifyContentClass && "dropdown__item_justify-content_".concat(justifyContentClass)), style: dropdownItem, onClick: onClick, onMouseEnter: onMouseEnter, children: [jsxRuntime.jsx("div", { className: "dropdown__item-wrapper", children: jsxRuntime.jsx(Link.Link, { className: clsx('dropdown__item-link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, underline: underline, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [label && (jsxRuntime.jsx(Text.Text, { className: "dropdown__item-label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textAlign: labelTextAlign, textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorActive: isActive ? labelTextColorActive : undefined, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, children: label })), desc && (jsxRuntime.jsx(Text.Text, { className: "dropdown__item-desc", size: descTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextSize), textColor: descTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.descTextColor), textColorGradient: descTextGradient, textColorHover: descTextColorHover, textStyle: descTextStyle, textWeight: descTextWeight, textWrap: descTextWrap, children: desc }))] })), after] }) }) }), showDivider && (jsxRuntime.jsx(Divider.Divider, { width: "fill", fill: dividerFill || 'surfaceTertiary', direction: dividerDirection, size: dividerSize }))] }));
|
|
87
87
|
}
|
|
88
88
|
DropdownItem.defaultProps = {
|
|
89
89
|
width: 'fixed',
|
|
@@ -21,7 +21,7 @@ var groupConfig = {
|
|
|
21
21
|
},
|
|
22
22
|
};
|
|
23
23
|
var Group = React.forwardRef(function Group(props, ref) {
|
|
24
|
-
var id = props.id, children = props.children, appearance = props.appearance, className = props.className, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, htmlFor = props.htmlFor, name = props.name, set = props.set, style = props.style, _a = props.tag, Tag = _a ===
|
|
24
|
+
var id = props.id, children = props.children, appearance = props.appearance, className = props.className, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, htmlFor = props.htmlFor, name = props.name, set = props.set, style = props.style, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, onClick = props.onClick;
|
|
25
25
|
// @ts-expect-error
|
|
26
26
|
var appearanceConfig = groupConfig.appearance && groupConfig.appearance[appearance];
|
|
27
27
|
var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -23,7 +23,7 @@ var groupConfig = {
|
|
|
23
23
|
},
|
|
24
24
|
};
|
|
25
25
|
var Group = React.forwardRef(function Group(props, ref) {
|
|
26
|
-
var id = props.id, children = props.children, appearance = props.appearance, className = props.className, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, htmlFor = props.htmlFor, name = props.name, set = props.set, style = props.style, _a = props.tag, Tag = _a ===
|
|
26
|
+
var id = props.id, children = props.children, appearance = props.appearance, className = props.className, dataTour = props.dataTour, horizontalScroll = props.horizontalScroll, htmlFor = props.htmlFor, name = props.name, set = props.set, style = props.style, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, onClick = props.onClick;
|
|
27
27
|
// @ts-expect-error
|
|
28
28
|
var appearanceConfig = groupConfig.appearance && groupConfig.appearance[appearance];
|
|
29
29
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
import { _ as __assign } from './tslib.es6-
|
|
1
|
+
import { _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
|
|
2
2
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
3
|
import React, { useMemo } from 'react';
|
|
4
4
|
import clsx from 'clsx';
|
|
5
5
|
import SVG from 'react-inlinesvg';
|
|
6
6
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
7
7
|
import { useStyles } from './hooks/useStyles.js';
|
|
8
|
-
import {
|
|
9
|
-
import { T as Tooltip } from './Tooltip-
|
|
8
|
+
import { L as LinkWrapper } from './Link-DN2LhPjD.js';
|
|
9
|
+
import { T as Tooltip } from './Tooltip-1Jbub0K6.js';
|
|
10
10
|
|
|
11
11
|
var iconAppearance = {
|
|
12
12
|
accent: {
|
|
@@ -7,8 +7,8 @@ var clsx = require('clsx');
|
|
|
7
7
|
var SVG = require('react-inlinesvg');
|
|
8
8
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
9
9
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
10
|
-
var Link = require('./Link-
|
|
11
|
-
var Tooltip = require('./Tooltip-
|
|
10
|
+
var Link = require('./Link-CxWmYMyL.js');
|
|
11
|
+
var Tooltip = require('./Tooltip-CNua1g76.js');
|
|
12
12
|
|
|
13
13
|
var iconAppearance = {
|
|
14
14
|
accent: {
|
|
@@ -70,7 +70,7 @@ var inputConfig = {
|
|
|
70
70
|
},
|
|
71
71
|
};
|
|
72
72
|
var Input = React.forwardRef(function Input(props, ref) {
|
|
73
|
-
var id = props.id, isDisabled = props.isDisabled, appearance = props.appearance, autocomplete = props.autocomplete, className = props.className, dataTestId = props.dataTestId, index = props.index, name = props.name, placeholder = props.placeholder, _a = props.type, type = _a ===
|
|
73
|
+
var id = props.id, isDisabled = props.isDisabled, appearance = props.appearance, autocomplete = props.autocomplete, className = props.className, dataTestId = props.dataTestId, index = props.index, name = props.name, placeholder = props.placeholder, _a = props.type, type = _a === void 0 ? 'text' : _a, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
|
|
74
74
|
// @ts-expect-error
|
|
75
75
|
var appearanceConfig = inputConfig.appearance && inputConfig.appearance[appearance];
|
|
76
76
|
// const stateConfig = state && inputConfig.state && inputConfig.state[state]
|
|
@@ -72,7 +72,7 @@ var inputConfig = {
|
|
|
72
72
|
},
|
|
73
73
|
};
|
|
74
74
|
var Input = React.forwardRef(function Input(props, ref) {
|
|
75
|
-
var id = props.id, isDisabled = props.isDisabled, appearance = props.appearance, autocomplete = props.autocomplete, className = props.className, dataTestId = props.dataTestId, index = props.index, name = props.name, placeholder = props.placeholder, _a = props.type, type = _a ===
|
|
75
|
+
var id = props.id, isDisabled = props.isDisabled, appearance = props.appearance, autocomplete = props.autocomplete, className = props.className, dataTestId = props.dataTestId, index = props.index, name = props.name, placeholder = props.placeholder, _a = props.type, type = _a === void 0 ? 'text' : _a, value = props.value, onBlur = props.onBlur, onChange = props.onChange, onFocus = props.onFocus, onKeyDown = props.onKeyDown;
|
|
76
76
|
// @ts-expect-error
|
|
77
77
|
var appearanceConfig = inputConfig.appearance && inputConfig.appearance[appearance];
|
|
78
78
|
// const stateConfig = state && inputConfig.state && inputConfig.state[state]
|
|
@@ -3,8 +3,8 @@ import { useRef, useCallback } from 'react';
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
|
-
import { T as Text } from './Text-
|
|
7
|
-
import { T as Tooltip } from './Tooltip-
|
|
6
|
+
import { T as Text } from './Text-JayJa3hj.js';
|
|
7
|
+
import { T as Tooltip } from './Tooltip-1Jbub0K6.js';
|
|
8
8
|
|
|
9
9
|
var labelAppearance = {
|
|
10
10
|
dev: {
|
|
@@ -71,15 +71,15 @@ var labelConfig = {
|
|
|
71
71
|
},
|
|
72
72
|
};
|
|
73
73
|
function Label(props) {
|
|
74
|
-
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, _a = props.label, label = _a ===
|
|
74
|
+
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, _a = props.label, label = _a === void 0 ? 'Label' : _a, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, mode = props.mode, set = props.set, showTooltip = props.showTooltip, tooltipAlignment = props.tooltipAlignment, tooltipAppearance = props.tooltipAppearance, tooltipArrowPosition = props.tooltipArrowPosition, tooltipContent = props.tooltipContent, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, type = props.type, onClick = props.onClick;
|
|
75
75
|
var tooltipRef = useRef(null);
|
|
76
76
|
var onMouseEnterLabel = useCallback(function () {
|
|
77
77
|
var _a;
|
|
78
|
-
(_a = tooltipRef.current) === null || _a ===
|
|
78
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.openTooltip();
|
|
79
79
|
}, []);
|
|
80
80
|
var onMouseLeaveLabel = useCallback(function () {
|
|
81
81
|
var _a;
|
|
82
|
-
(_a = tooltipRef.current) === null || _a ===
|
|
82
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.closeTooltip();
|
|
83
83
|
}, []);
|
|
84
84
|
// @ts-expect-error
|
|
85
85
|
var appearanceConfig = labelConfig.appearance && labelConfig.appearance[appearance];
|
|
@@ -87,7 +87,7 @@ function Label(props) {
|
|
|
87
87
|
var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, borderColorClass = classGenerator.borderColorClass, borderTypeClass = classGenerator.borderTypeClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, widthClass = classGenerator.widthClass, wrapClass = classGenerator.wrapClass;
|
|
88
88
|
// @ts-expect-error
|
|
89
89
|
var labelStyles = useStyles(props).styles;
|
|
90
|
-
return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), set && "label_set_".concat(set), mode && "label_mode_".concat(mode), onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig ===
|
|
90
|
+
return (jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), set && "label_set_".concat(set), mode && "label_mode_".concat(mode), onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsx(Text, { className: "label__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textWeight: labelTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextWeight), textWrap: labelTextWrap, children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })) : (jsx("div", { className: "label__label", children: label })), children, showTooltip && (jsx(Tooltip, { className: "label__tooltip", ref: tooltipRef, alignment: tooltipAlignment, appearance: tooltipAppearance, arrowPosition: tooltipArrowPosition, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize, children: tooltipContent }))] }), after] }));
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
export { Label as L, labelAppearance as a, labelConfig as l };
|
|
@@ -5,8 +5,8 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClassGenerator = require('./cjs/hooks/useDeviceTargetClassGenerator.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
|
-
var Text = require('./Text-
|
|
9
|
-
var Tooltip = require('./Tooltip-
|
|
8
|
+
var Text = require('./Text-Beslj4Ns.js');
|
|
9
|
+
var Tooltip = require('./Tooltip-CNua1g76.js');
|
|
10
10
|
|
|
11
11
|
var labelAppearance = {
|
|
12
12
|
dev: {
|
|
@@ -73,15 +73,15 @@ var labelConfig = {
|
|
|
73
73
|
},
|
|
74
74
|
};
|
|
75
75
|
function Label(props) {
|
|
76
|
-
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, _a = props.label, label = _a ===
|
|
76
|
+
var children = props.children, cursor = props.cursor, after = props.after, appearance = props.appearance, before = props.before, className = props.className, dataTour = props.dataTour, _a = props.label, label = _a === void 0 ? 'Label' : _a, labelTextColor = props.labelTextColor, labelTextColorHover = props.labelTextColorHover, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, mode = props.mode, set = props.set, showTooltip = props.showTooltip, tooltipAlignment = props.tooltipAlignment, tooltipAppearance = props.tooltipAppearance, tooltipArrowPosition = props.tooltipArrowPosition, tooltipContent = props.tooltipContent, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, type = props.type, onClick = props.onClick;
|
|
77
77
|
var tooltipRef = React.useRef(null);
|
|
78
78
|
var onMouseEnterLabel = React.useCallback(function () {
|
|
79
79
|
var _a;
|
|
80
|
-
(_a = tooltipRef.current) === null || _a ===
|
|
80
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.openTooltip();
|
|
81
81
|
}, []);
|
|
82
82
|
var onMouseLeaveLabel = React.useCallback(function () {
|
|
83
83
|
var _a;
|
|
84
|
-
(_a = tooltipRef.current) === null || _a ===
|
|
84
|
+
(_a = tooltipRef.current) === null || _a === void 0 ? void 0 : _a.closeTooltip();
|
|
85
85
|
}, []);
|
|
86
86
|
// @ts-expect-error
|
|
87
87
|
var appearanceConfig = labelConfig.appearance && labelConfig.appearance[appearance];
|
|
@@ -89,7 +89,7 @@ function Label(props) {
|
|
|
89
89
|
var alignClass = classGenerator.alignClass, alignDirectionClass = classGenerator.alignDirectionClass, borderColorClass = classGenerator.borderColorClass, borderTypeClass = classGenerator.borderTypeClass, fillClass = classGenerator.fillClass, fillHoverClass = classGenerator.fillHoverClass, shapeClass = classGenerator.shapeClass, sizeClass = classGenerator.sizeClass, widthClass = classGenerator.widthClass, wrapClass = classGenerator.wrapClass;
|
|
90
90
|
// @ts-expect-error
|
|
91
91
|
var labelStyles = useStyles.useStyles(props).styles;
|
|
92
|
-
return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), set && "label_set_".concat(set), mode && "label_mode_".concat(mode), onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig ===
|
|
92
|
+
return (jsxRuntime.jsxs("div", { className: clsx(className, 'label', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "label_shape_".concat(shapeClass), borderColorClass && "border-color_".concat(borderColorClass), borderTypeClass && "border_type_".concat(borderTypeClass), sizeClass && "label_size_".concat(sizeClass), wrapClass && "'word-wrap_".concat(wrapClass), widthClass && "label_width_".concat(widthClass), alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass), type && "label_type_".concat(type), set && "label_set_".concat(set), mode && "label_mode_".concat(mode), onClick && (cursor || 'cursor_type_pointer')), "data-tour": dataTour, style: labelStyles, onClick: onClick, onMouseEnter: onMouseEnterLabel, onMouseLeave: onMouseLeaveLabel, children: [before, jsxRuntime.jsxs("div", { className: "label__inner", children: [typeof label === 'string' ? (jsxRuntime.jsx(Text.Text, { className: "label__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textColor: labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor), textColorHover: labelTextColorHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColorHover), textWeight: labelTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextWeight), textWrap: labelTextWrap, children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })) : (jsxRuntime.jsx("div", { className: "label__label", children: label })), children, showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: "label__tooltip", ref: tooltipRef, alignment: tooltipAlignment, appearance: tooltipAppearance, arrowPosition: tooltipArrowPosition, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize, children: tooltipContent }))] }), after] }));
|
|
93
93
|
}
|
|
94
94
|
|
|
95
95
|
exports.Label = Label;
|
|
@@ -20,7 +20,7 @@ var linkConfig = {
|
|
|
20
20
|
// },
|
|
21
21
|
// }
|
|
22
22
|
function Link(props) {
|
|
23
|
-
var children = props.children, after = props.after, before = props.before, className = props.className, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, text = props.text, _a = props.underline, underline = _a ===
|
|
23
|
+
var children = props.children, after = props.after, before = props.before, className = props.className, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, text = props.text, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
24
24
|
// @ts-expect-error
|
|
25
25
|
var appearanceConfig = linkConfig.appearance && linkConfig.appearance[appearance];
|
|
26
26
|
var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { b as __rest, _ as __assign } from './tslib.es6-Bwu1Cn-t.js';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
3
|
import React from 'react';
|
|
4
4
|
import clsx from 'clsx';
|
|
5
5
|
import { useDeviceTargetClassGenerator } from './hooks/useDeviceTargetClassGenerator.js';
|
|
@@ -18,7 +18,7 @@ var linkConfig = {
|
|
|
18
18
|
// },
|
|
19
19
|
// }
|
|
20
20
|
function Link(props) {
|
|
21
|
-
var children = props.children, after = props.after, before = props.before, className = props.className, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, text = props.text, _a = props.underline, underline = _a ===
|
|
21
|
+
var children = props.children, after = props.after, before = props.before, className = props.className, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, text = props.text, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, onClick = props.onClick, onMouseDown = props.onMouseDown;
|
|
22
22
|
// @ts-expect-error
|
|
23
23
|
var appearanceConfig = linkConfig.appearance && linkConfig.appearance[appearance];
|
|
24
24
|
var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
|
|
@@ -54,4 +54,4 @@ function LinkWrapper(props) {
|
|
|
54
54
|
});
|
|
55
55
|
}
|
|
56
56
|
|
|
57
|
-
export {
|
|
57
|
+
export { LinkWrapper as L, Link as a, linkConfig as l };
|