@itcase/ui 1.2.21 → 1.2.23
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/{Button--5mnRJi2.js → Button-BLcVDStV.js} +1 -1
- package/dist/{Button-D1PnF1C-.js → Button-DawNa85U.js} +1 -1
- package/dist/{Icon-D-zjcPll.js → Icon-BeHO7N79.js} +5 -4
- package/dist/{Icon-DD_Vyrw0.js → Icon-DQWyj5EO.js} +6 -5
- package/dist/{Label-CpSzGRtr.js → Label-B0O9q0E4.js} +1 -1
- package/dist/{Label-BA_CnRBq.js → Label-D8DRdqad.js} +1 -1
- package/dist/{Tooltip-DJufHBiQ.js → Tooltip-aaDRYNWY.js} +21 -13
- package/dist/{Tooltip-DkTKx9n-.js → Tooltip-xGmgUzGr.js} +21 -13
- package/dist/cjs/components/Accordion.js +2 -2
- package/dist/cjs/components/Avatar.js +2 -2
- package/dist/cjs/components/Breadcrumbs.js +2 -2
- package/dist/cjs/components/Button.js +3 -3
- package/dist/cjs/components/Cell.js +13 -9
- package/dist/cjs/components/Choice.js +11 -3
- package/dist/cjs/components/ContextMenu.js +2 -2
- package/dist/cjs/components/CookiesWarning.js +3 -3
- package/dist/cjs/components/DatePicker.js +4 -4
- package/dist/cjs/components/Grid.js +5 -1
- package/dist/cjs/components/Icon.js +2 -2
- package/dist/cjs/components/InputPassword.js +2 -2
- package/dist/cjs/components/Label.js +2 -2
- package/dist/cjs/components/LanguageSelector.js +2 -2
- package/dist/cjs/components/Pagination.js +2 -2
- package/dist/cjs/components/Response.js +3 -3
- package/dist/cjs/components/Search.js +2 -2
- package/dist/cjs/components/Select.js +2 -2
- package/dist/cjs/components/SiteMenu.js +2 -2
- package/dist/cjs/components/Tooltip.js +1 -1
- package/dist/components/Accordion.js +2 -2
- package/dist/components/Avatar.js +2 -2
- package/dist/components/Breadcrumbs.js +2 -2
- package/dist/components/Button.js +3 -3
- package/dist/components/Cell.js +13 -9
- package/dist/components/Choice.js +11 -3
- package/dist/components/ContextMenu.js +2 -2
- package/dist/components/CookiesWarning.js +3 -3
- package/dist/components/DatePicker.js +4 -4
- package/dist/components/Grid.js +5 -1
- package/dist/components/Icon.js +2 -2
- package/dist/components/InputPassword.js +2 -2
- package/dist/components/Label.js +2 -2
- package/dist/components/LanguageSelector.js +2 -2
- package/dist/components/Pagination.js +2 -2
- package/dist/components/Response.js +3 -3
- package/dist/components/Search.js +2 -2
- package/dist/components/Select.js +2 -2
- package/dist/components/SiteMenu.js +2 -2
- package/dist/components/Tooltip.js +1 -1
- package/dist/css/components/Accordion/Accordion.css +3 -0
- package/dist/css/components/Cell/Cell.css +23 -0
- package/dist/css/components/Drawer/Drawer.css +2 -2
- package/dist/css/components/Icon/Icon.css +4 -3
- package/dist/css/components/Tooltip/Tooltip.css +21 -0
- package/dist/types/components/Cell/Cell.interface.d.ts +8 -6
- package/dist/types/components/Icon/Icon.d.ts +3 -3
- package/dist/types/components/Icon/Icon.interface.d.ts +34 -32
- package/dist/types/components/Label/Label.interface.d.ts +1 -1
- package/dist/types/components/Tooltip/Tooltip.d.ts +1 -1
- package/dist/types/components/Tooltip/Tooltip.interface.d.ts +4 -3
- package/package.json +24 -24
|
@@ -3,7 +3,7 @@ import React from 'react';
|
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
|
-
import { I as Icon } from './Icon-
|
|
6
|
+
import { I as Icon } from './Icon-DQWyj5EO.js';
|
|
7
7
|
import { a as LinkWrapper } from './Link-CeQuavin.js';
|
|
8
8
|
import { L as Loader } from './Loader-CJ8ZCdwy.js';
|
|
9
9
|
import { T as Text } from './Text-CG3xPG27.js';
|
|
@@ -5,7 +5,7 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
|
-
var Icon = require('./Icon-
|
|
8
|
+
var Icon = require('./Icon-BeHO7N79.js');
|
|
9
9
|
var Link = require('./Link-CqWzwh8V.js');
|
|
10
10
|
var Loader = require('./Loader-fA11tUEJ.js');
|
|
11
11
|
var Text = require('./Text-_YhyTsQ1.js');
|
|
@@ -7,7 +7,7 @@ var SVG = require('react-inlinesvg');
|
|
|
7
7
|
var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
|
|
8
8
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
9
9
|
var Link = require('./Link-CqWzwh8V.js');
|
|
10
|
-
var Tooltip = require('./Tooltip-
|
|
10
|
+
var Tooltip = require('./Tooltip-xGmgUzGr.js');
|
|
11
11
|
|
|
12
12
|
var iconConfig = {
|
|
13
13
|
appearance: {},
|
|
@@ -16,8 +16,9 @@ var iconConfig = {
|
|
|
16
16
|
},
|
|
17
17
|
};
|
|
18
18
|
var Icon = React.forwardRef(function Icon(props, ref) {
|
|
19
|
-
|
|
20
|
-
|
|
19
|
+
// TODO: Tooltip doesn't work that anymore
|
|
20
|
+
// const [isTooltipVisible, setIsTooltipVisible] = useState(false)
|
|
21
|
+
var id = props.id, width = props.width, height = props.height, after = props.after, Badge = props.Badge, before = props.before, className = props.className, dataTour = props.dataTour, href = props.href, imageSrc = props.imageSrc, link = props.link, linkRel = props.linkRel, linkTarget = props.linkTarget, showTooltip = props.showTooltip, SvgImage = props.SvgImage, tooltipAppearance = props.tooltipAppearance, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, onClick = props.onClick, onMouseEnter = props.onMouseEnter, onMouseLeave = props.onMouseLeave;
|
|
21
22
|
// const svgSizes = useMemo(() => {
|
|
22
23
|
// const sizes: {
|
|
23
24
|
// width?: string
|
|
@@ -106,7 +107,7 @@ var Icon = React.forwardRef(function Icon(props, ref) {
|
|
|
106
107
|
});
|
|
107
108
|
// @ts-expect-error
|
|
108
109
|
var iconStyles = useStyles.useStyles(props).styles;
|
|
109
|
-
return (jsxRuntime.jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), ref: ref, "data-tour": dataTour, id: id, style: iconStyles, onClick: onClick, onMouseEnter:
|
|
110
|
+
return (jsxRuntime.jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), ref: ref, "data-tour": dataTour, id: id, style: iconStyles, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, children: jsxRuntime.jsxs(Link.LinkWrapper, { className: clsx(link || href ? 'icon__link' : 'icon__item', iconSizeClass), DefaultComponent: "div", href: link || href, rel: linkRel, target: linkTarget, children: [before, ImageComponent, after, Badge, showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: clsx(className, 'icon__tooltip', alignmentClass), appearance: tooltipAppearance, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize }))] }) }));
|
|
110
111
|
});
|
|
111
112
|
var removeFillStroke = function (code) {
|
|
112
113
|
return code.replace(/fill=".*?"/g, 'fill=""').replace(/stroke=".*?"/g, 'stroke=""');
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import React, {
|
|
2
|
+
import React, { useMemo } from 'react';
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import SVG from 'react-inlinesvg';
|
|
5
5
|
import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
|
|
6
6
|
import { useStyles } from './hooks/useStyles.js';
|
|
7
7
|
import { a as LinkWrapper } from './Link-CeQuavin.js';
|
|
8
|
-
import { T as Tooltip } from './Tooltip-
|
|
8
|
+
import { T as Tooltip } from './Tooltip-aaDRYNWY.js';
|
|
9
9
|
|
|
10
10
|
var iconConfig = {
|
|
11
11
|
appearance: {},
|
|
@@ -14,8 +14,9 @@ var iconConfig = {
|
|
|
14
14
|
},
|
|
15
15
|
};
|
|
16
16
|
var Icon = React.forwardRef(function Icon(props, ref) {
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
// TODO: Tooltip doesn't work that anymore
|
|
18
|
+
// const [isTooltipVisible, setIsTooltipVisible] = useState(false)
|
|
19
|
+
var id = props.id, width = props.width, height = props.height, after = props.after, Badge = props.Badge, before = props.before, className = props.className, dataTour = props.dataTour, href = props.href, imageSrc = props.imageSrc, link = props.link, linkRel = props.linkRel, linkTarget = props.linkTarget, showTooltip = props.showTooltip, SvgImage = props.SvgImage, tooltipAppearance = props.tooltipAppearance, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, onClick = props.onClick, onMouseEnter = props.onMouseEnter, onMouseLeave = props.onMouseLeave;
|
|
19
20
|
// const svgSizes = useMemo(() => {
|
|
20
21
|
// const sizes: {
|
|
21
22
|
// width?: string
|
|
@@ -104,7 +105,7 @@ var Icon = React.forwardRef(function Icon(props, ref) {
|
|
|
104
105
|
});
|
|
105
106
|
// @ts-expect-error
|
|
106
107
|
var iconStyles = useStyles(props).styles;
|
|
107
|
-
return (jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), ref: ref, "data-tour": dataTour, id: id, style: iconStyles, onClick: onClick, onMouseEnter:
|
|
108
|
+
return (jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), ref: ref, "data-tour": dataTour, id: id, style: iconStyles, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, children: jsxs(LinkWrapper, { className: clsx(link || href ? 'icon__link' : 'icon__item', iconSizeClass), DefaultComponent: "div", href: link || href, rel: linkRel, target: linkTarget, children: [before, ImageComponent, after, Badge, showTooltip && (jsx(Tooltip, { className: clsx(className, 'icon__tooltip', alignmentClass), appearance: tooltipAppearance, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize }))] }) }));
|
|
108
109
|
});
|
|
109
110
|
var removeFillStroke = function (code) {
|
|
110
111
|
return code.replace(/fill=".*?"/g, 'fill=""').replace(/stroke=".*?"/g, 'stroke=""');
|
|
@@ -6,7 +6,7 @@ var clsx = require('clsx');
|
|
|
6
6
|
var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
|
|
7
7
|
var useStyles = require('./cjs/hooks/useStyles.js');
|
|
8
8
|
var Text = require('./Text-_YhyTsQ1.js');
|
|
9
|
-
var Tooltip = require('./Tooltip-
|
|
9
|
+
var Tooltip = require('./Tooltip-xGmgUzGr.js');
|
|
10
10
|
|
|
11
11
|
var labelConfig = {
|
|
12
12
|
appearance: undefined,
|
|
@@ -4,7 +4,7 @@ import clsx from 'clsx';
|
|
|
4
4
|
import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
|
|
5
5
|
import { useStyles } from './hooks/useStyles.js';
|
|
6
6
|
import { T as Text } from './Text-CG3xPG27.js';
|
|
7
|
-
import { T as Tooltip } from './Tooltip-
|
|
7
|
+
import { T as Tooltip } from './Tooltip-aaDRYNWY.js';
|
|
8
8
|
|
|
9
9
|
var labelConfig = {
|
|
10
10
|
appearance: undefined,
|
|
@@ -13,11 +13,14 @@ var tooltipConfig = {
|
|
|
13
13
|
},
|
|
14
14
|
};
|
|
15
15
|
var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
16
|
-
var
|
|
16
|
+
var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a === void 0 ? 500 : _a, _b = props.closeTimeoutDelay, closeTimeoutDelay = _b === void 0 ? 250 : _b;
|
|
17
|
+
var tooltipElementRef = useRef(null);
|
|
17
18
|
var tooltipTimeoutHideRef = useRef(null);
|
|
18
19
|
var tooltipTimeoutShowRef = useRef(null);
|
|
19
20
|
var isTooltipCloseAnimationInProgressRef = useRef(false);
|
|
20
|
-
|
|
21
|
+
// TODO: rename to open?
|
|
22
|
+
var _c = useState(initialIsVisible), isTooltipVisible = _c[0], setIsTooltipVisible = _c[1];
|
|
23
|
+
// TODO: or rename to show/hide?
|
|
21
24
|
var openTooltip = useCallback(function () {
|
|
22
25
|
if (!isTooltipCloseAnimationInProgressRef.current) {
|
|
23
26
|
if (tooltipTimeoutHideRef.current) {
|
|
@@ -25,9 +28,9 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
25
28
|
}
|
|
26
29
|
tooltipTimeoutShowRef.current = setTimeout(function () {
|
|
27
30
|
setIsTooltipVisible(true);
|
|
28
|
-
},
|
|
31
|
+
}, openTimeoutDelay);
|
|
29
32
|
}
|
|
30
|
-
}, []);
|
|
33
|
+
}, [openTimeoutDelay]);
|
|
31
34
|
var closeTooltip = useCallback(function () {
|
|
32
35
|
if (tooltipTimeoutShowRef.current) {
|
|
33
36
|
clearTimeout(tooltipTimeoutShowRef.current);
|
|
@@ -43,13 +46,20 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
43
46
|
}
|
|
44
47
|
return newState;
|
|
45
48
|
});
|
|
46
|
-
},
|
|
47
|
-
}, []);
|
|
49
|
+
}, closeTimeoutDelay);
|
|
50
|
+
}, [closeTimeoutDelay]);
|
|
48
51
|
var onAnimationEnd = useCallback(function () {
|
|
49
52
|
isTooltipCloseAnimationInProgressRef.current = false;
|
|
50
53
|
}, []);
|
|
51
|
-
|
|
52
|
-
|
|
54
|
+
useImperativeHandle(ref, function () { return ({
|
|
55
|
+
get tooltipElement() {
|
|
56
|
+
return tooltipElementRef.current;
|
|
57
|
+
},
|
|
58
|
+
isTooltipVisible: isTooltipVisible,
|
|
59
|
+
closeTooltip: closeTooltip,
|
|
60
|
+
openTooltip: openTooltip,
|
|
61
|
+
}); }, [isTooltipVisible, openTooltip, closeTooltip]);
|
|
62
|
+
/* STYLES */
|
|
53
63
|
var alignDirectionClass = useDeviceTargetClass(props, {
|
|
54
64
|
prefix: 'align_',
|
|
55
65
|
propsKey: 'alignDirection',
|
|
@@ -96,13 +106,11 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
96
106
|
});
|
|
97
107
|
// @ts-expect-error
|
|
98
108
|
var tooltipStyles = useStyles(props).styles;
|
|
99
|
-
|
|
109
|
+
// prettier-ignore
|
|
110
|
+
var appearanceConfig = (appearance && tooltipConfig.appearance && tooltipConfig.appearance[appearance]);
|
|
100
111
|
return (jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass ||
|
|
101
112
|
((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
|
|
102
|
-
"fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, alignDirectionClass, alignClass, alignmentClass, borderWidthClass, borderColorClass, borderTypeClass, elevationClass, sizeClass, arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass), style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize, textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
|
|
113
|
+
"fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass, alignClass, alignmentClass, borderWidthClass, borderColorClass, borderTypeClass, elevationClass, sizeClass, arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass), style: tooltipStyles, ref: tooltipElementRef, onAnimationEnd: onAnimationEnd, children: [before, jsxs("div", { className: "tooltip__inner", children: [title && (jsx(Title, { className: "tooltip__title", size: titleSize, textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsx(Text, { className: "tooltip__text", size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
|
|
103
114
|
});
|
|
104
|
-
Tooltip.defaultProps = {
|
|
105
|
-
initialIsVisible: null,
|
|
106
|
-
};
|
|
107
115
|
|
|
108
116
|
export { Tooltip as T, tooltipConfig as t };
|
|
@@ -15,11 +15,14 @@ var tooltipConfig = {
|
|
|
15
15
|
},
|
|
16
16
|
};
|
|
17
17
|
var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
18
|
-
var
|
|
18
|
+
var children = props.children, after = props.after, appearance = props.appearance, arrowPosition = props.arrowPosition, before = props.before, className = props.className, initialIsVisible = props.initialIsVisible, set = props.set, text = props.text, textColor = props.textColor, textSize = props.textSize, title = props.title, alignPosition = props.alignPosition, titleSize = props.titleSize, titleTextColor = props.titleTextColor, titleTextWeight = props.titleTextWeight, type = props.type, _a = props.openTimeoutDelay, openTimeoutDelay = _a === void 0 ? 500 : _a, _b = props.closeTimeoutDelay, closeTimeoutDelay = _b === void 0 ? 250 : _b;
|
|
19
|
+
var tooltipElementRef = React.useRef(null);
|
|
19
20
|
var tooltipTimeoutHideRef = React.useRef(null);
|
|
20
21
|
var tooltipTimeoutShowRef = React.useRef(null);
|
|
21
22
|
var isTooltipCloseAnimationInProgressRef = React.useRef(false);
|
|
22
|
-
|
|
23
|
+
// TODO: rename to open?
|
|
24
|
+
var _c = React.useState(initialIsVisible), isTooltipVisible = _c[0], setIsTooltipVisible = _c[1];
|
|
25
|
+
// TODO: or rename to show/hide?
|
|
23
26
|
var openTooltip = React.useCallback(function () {
|
|
24
27
|
if (!isTooltipCloseAnimationInProgressRef.current) {
|
|
25
28
|
if (tooltipTimeoutHideRef.current) {
|
|
@@ -27,9 +30,9 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
27
30
|
}
|
|
28
31
|
tooltipTimeoutShowRef.current = setTimeout(function () {
|
|
29
32
|
setIsTooltipVisible(true);
|
|
30
|
-
},
|
|
33
|
+
}, openTimeoutDelay);
|
|
31
34
|
}
|
|
32
|
-
}, []);
|
|
35
|
+
}, [openTimeoutDelay]);
|
|
33
36
|
var closeTooltip = React.useCallback(function () {
|
|
34
37
|
if (tooltipTimeoutShowRef.current) {
|
|
35
38
|
clearTimeout(tooltipTimeoutShowRef.current);
|
|
@@ -45,13 +48,20 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
45
48
|
}
|
|
46
49
|
return newState;
|
|
47
50
|
});
|
|
48
|
-
},
|
|
49
|
-
}, []);
|
|
51
|
+
}, closeTimeoutDelay);
|
|
52
|
+
}, [closeTimeoutDelay]);
|
|
50
53
|
var onAnimationEnd = React.useCallback(function () {
|
|
51
54
|
isTooltipCloseAnimationInProgressRef.current = false;
|
|
52
55
|
}, []);
|
|
53
|
-
|
|
54
|
-
|
|
56
|
+
React.useImperativeHandle(ref, function () { return ({
|
|
57
|
+
get tooltipElement() {
|
|
58
|
+
return tooltipElementRef.current;
|
|
59
|
+
},
|
|
60
|
+
isTooltipVisible: isTooltipVisible,
|
|
61
|
+
closeTooltip: closeTooltip,
|
|
62
|
+
openTooltip: openTooltip,
|
|
63
|
+
}); }, [isTooltipVisible, openTooltip, closeTooltip]);
|
|
64
|
+
/* STYLES */
|
|
55
65
|
var alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
56
66
|
prefix: 'align_',
|
|
57
67
|
propsKey: 'alignDirection',
|
|
@@ -98,14 +108,12 @@ var Tooltip = React.forwardRef(function Tooltip(props, ref) {
|
|
|
98
108
|
});
|
|
99
109
|
// @ts-expect-error
|
|
100
110
|
var tooltipStyles = useStyles.useStyles(props).styles;
|
|
101
|
-
|
|
111
|
+
// prettier-ignore
|
|
112
|
+
var appearanceConfig = (appearance && tooltipConfig.appearance && tooltipConfig.appearance[appearance]);
|
|
102
113
|
return (jsxRuntime.jsxs("div", { className: clsx(className, 'tooltip', isTooltipVisible === true && 'tooltip_state_open', isTooltipVisible === false && 'tooltip_state_close', fillClass ||
|
|
103
114
|
((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
|
|
104
|
-
"fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, alignDirectionClass, alignClass, alignmentClass, borderWidthClass, borderColorClass, borderTypeClass, elevationClass, sizeClass, arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass), style: tooltipStyles, onAnimationEnd: onAnimationEnd, children: [before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title.Title, { className: "tooltip__title", size: titleSize, textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "tooltip__text", size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
|
|
115
|
+
"fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase()), shapeClass, alignPosition && "tooltip_align-position_".concat(alignPosition), alignDirectionClass, alignClass, alignmentClass, borderWidthClass, borderColorClass, borderTypeClass, elevationClass, sizeClass, arrowPosition && "tooltip_type_arrow tooltip_arrow_position_".concat(arrowPosition), type && "tooltip_type_".concat(type), set && "tooltip_set_".concat(set), widthClass), style: tooltipStyles, ref: tooltipElementRef, onAnimationEnd: onAnimationEnd, children: [before, jsxRuntime.jsxs("div", { className: "tooltip__inner", children: [title && (jsxRuntime.jsx(Title.Title, { className: "tooltip__title", size: titleSize, textColor: titleTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextColor), textWeight: titleTextWeight || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.titleTextWeight), children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "tooltip__text", size: textSize, textColor: textColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.textColor), children: text })), children] }), after] }));
|
|
105
116
|
});
|
|
106
|
-
Tooltip.defaultProps = {
|
|
107
|
-
initialIsVisible: null,
|
|
108
|
-
};
|
|
109
117
|
|
|
110
118
|
exports.Tooltip = Tooltip;
|
|
111
119
|
exports.tooltipConfig = tooltipConfig;
|
|
@@ -8,7 +8,7 @@ var castArray = require('lodash/castArray');
|
|
|
8
8
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
9
9
|
var useStyles = require('../hooks/useStyles.js');
|
|
10
10
|
var Divider = require('../../Divider-BjB5MD6u.js');
|
|
11
|
-
var Icon = require('../../Icon-
|
|
11
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
12
12
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
13
13
|
require('lodash/camelCase');
|
|
14
14
|
require('../context/UIContext.js');
|
|
@@ -20,7 +20,7 @@ require('lodash/upperFirst');
|
|
|
20
20
|
require('../hooks/styleAttributes.js');
|
|
21
21
|
require('react-inlinesvg');
|
|
22
22
|
require('../../Link-CqWzwh8V.js');
|
|
23
|
-
require('../../Tooltip-
|
|
23
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
24
24
|
require('../../Title-zwP6c2U2.js');
|
|
25
25
|
|
|
26
26
|
var ChevronDown16 = function ChevronDown16(props) {
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
7
|
-
var Icon = require('../../Icon-
|
|
7
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
8
8
|
var Image = require('../../Image-DrUlRMHa.js');
|
|
9
9
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
10
10
|
require('lodash/castArray');
|
|
@@ -20,7 +20,7 @@ require('lodash/upperFirst');
|
|
|
20
20
|
require('../hooks/styleAttributes.js');
|
|
21
21
|
require('../../Link-CqWzwh8V.js');
|
|
22
22
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
23
|
-
require('../../Tooltip-
|
|
23
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
24
24
|
require('../../Title-zwP6c2U2.js');
|
|
25
25
|
|
|
26
26
|
function Avatar(props) {
|
|
@@ -7,7 +7,7 @@ var clsx = require('clsx');
|
|
|
7
7
|
var camelCase = require('lodash/camelCase');
|
|
8
8
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
9
9
|
var useStyles = require('../hooks/useStyles.js');
|
|
10
|
-
var Icon = require('../../Icon-
|
|
10
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
11
11
|
var Link = require('../../Link-CqWzwh8V.js');
|
|
12
12
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
13
13
|
require('lodash/castArray');
|
|
@@ -19,7 +19,7 @@ require('lodash/maxBy');
|
|
|
19
19
|
require('lodash/upperFirst');
|
|
20
20
|
require('../hooks/styleAttributes.js');
|
|
21
21
|
require('react-inlinesvg');
|
|
22
|
-
require('../../Tooltip-
|
|
22
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
23
23
|
require('../../Title-zwP6c2U2.js');
|
|
24
24
|
|
|
25
25
|
function BreadcrumbsItem(props) {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var Button = require('../../Button-
|
|
3
|
+
var Button = require('../../Button-DawNa85U.js');
|
|
4
4
|
require('react/jsx-runtime');
|
|
5
5
|
require('react');
|
|
6
6
|
require('clsx');
|
|
@@ -15,11 +15,11 @@ require('../hooks/useStyles.js');
|
|
|
15
15
|
require('lodash/maxBy');
|
|
16
16
|
require('lodash/upperFirst');
|
|
17
17
|
require('../hooks/styleAttributes.js');
|
|
18
|
-
require('../../Icon-
|
|
18
|
+
require('../../Icon-BeHO7N79.js');
|
|
19
19
|
require('react-inlinesvg');
|
|
20
20
|
require('../../Link-CqWzwh8V.js');
|
|
21
21
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
22
|
-
require('../../Tooltip-
|
|
22
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
23
23
|
require('../../Text-_YhyTsQ1.js');
|
|
24
24
|
require('../../Title-zwP6c2U2.js');
|
|
25
25
|
require('../../Loader-fA11tUEJ.js');
|
|
@@ -3,10 +3,10 @@
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var clsx = require('clsx');
|
|
5
5
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
6
|
-
var Icon = require('../../Icon-D-zjcPll.js');
|
|
7
|
-
var Label = require('../../Label-CpSzGRtr.js');
|
|
8
|
-
var Text = require('../../Text-_YhyTsQ1.js');
|
|
9
6
|
var useStyles = require('../hooks/useStyles.js');
|
|
7
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
8
|
+
var Label = require('../../Label-B0O9q0E4.js');
|
|
9
|
+
var Text = require('../../Text-_YhyTsQ1.js');
|
|
10
10
|
require('react');
|
|
11
11
|
require('lodash/castArray');
|
|
12
12
|
require('lodash/camelCase');
|
|
@@ -14,17 +14,17 @@ require('../context/UIContext.js');
|
|
|
14
14
|
require('prop-types');
|
|
15
15
|
require('../hooks/useMediaQueries.js');
|
|
16
16
|
require('react-responsive');
|
|
17
|
+
require('lodash/maxBy');
|
|
18
|
+
require('lodash/upperFirst');
|
|
19
|
+
require('../hooks/styleAttributes.js');
|
|
17
20
|
require('react-inlinesvg');
|
|
18
21
|
require('../../Link-CqWzwh8V.js');
|
|
19
22
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
20
|
-
require('../../Tooltip-
|
|
23
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
21
24
|
require('../../Title-zwP6c2U2.js');
|
|
22
|
-
require('lodash/maxBy');
|
|
23
|
-
require('lodash/upperFirst');
|
|
24
|
-
require('../hooks/styleAttributes.js');
|
|
25
25
|
|
|
26
26
|
function Cell(props) {
|
|
27
|
-
var
|
|
27
|
+
var isActive = props.isActive, isDisabled = props.isDisabled, isEqual = props.isEqual, after = props.after, before = props.before, className = props.className, mode = props.mode, reverse = props.reverse, set = props.set, showTitleLabel = props.showTitleLabel, showValueLabel = props.showValueLabel, size = props.size, title = props.title, titleIcon = props.titleIcon, titleIconFill = props.titleIconFill, titleIconFillHover = props.titleIconFillHover, titleIconFillSize = props.titleIconFillSize, titleIconItemFill = props.titleIconItemFill, titleIconShape = props.titleIconShape, titleIconSrc = props.titleIconSrc, titleLabel = props.titleLabel, titleLabelAppearance = props.titleLabelAppearance, titleLabelShape = props.titleLabelShape, titleLabelSize = props.titleLabelSize, titleLabelTextSize = props.titleLabelTextSize, titleTag = props.titleTag, titleTextColor = props.titleTextColor, titleTextSize = props.titleTextSize, titleTextTruncate = props.titleTextTruncate, titleTextWeight = props.titleTextWeight, titleTextWrap = props.titleTextWrap, value = props.value, valueIcon = props.valueIcon, valueIconFill = props.valueIconFill, valueIconFillHover = props.valueIconFillHover, valueIconFillSize = props.valueIconFillSize, valueIconItemFill = props.valueIconItemFill, valueIconShape = props.valueIconShape, valueIconSrc = props.valueIconSrc, valueLabel = props.valueLabel, valueLabelAppearance = props.valueLabelAppearance, valueLabelShape = props.valueLabelShape, valueLabelSize = props.valueLabelSize, valueLabelTextSize = props.valueLabelTextSize, valueTag = props.valueTag, valueTextAlign = props.valueTextAlign, valueTextColor = props.valueTextColor, valueTextSize = props.valueTextSize, valueTextTruncate = props.valueTextTruncate, valueTextWeight = props.valueTextWeight, valueTextWrap = props.valueTextWrap, zeroGap = props.zeroGap, zeroPadding = props.zeroPadding, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
|
|
28
28
|
var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
29
29
|
prefix: 'fill_',
|
|
30
30
|
propsKey: 'fill',
|
|
@@ -73,9 +73,13 @@ function Cell(props) {
|
|
|
73
73
|
prefix: 'width_',
|
|
74
74
|
propsKey: 'width',
|
|
75
75
|
});
|
|
76
|
+
var gapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
77
|
+
prefix: 'gap_',
|
|
78
|
+
propsKey: 'gap',
|
|
79
|
+
});
|
|
76
80
|
// @ts-expect-error
|
|
77
81
|
var cellStyles = useStyles.useStyles(props).styles;
|
|
78
|
-
return (jsxRuntime.jsxs("div", { className: clsx(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass, bgFillHoverClass, isActive && bgFillActiveClass, isDisabled && bgFillDisabledClass, bgShapeClass, widthClass, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), onClick: onClick, onMouseEnter: onMouseEnter,
|
|
82
|
+
return (jsxRuntime.jsxs("div", { className: clsx(className, 'cell', mode && "cell_mode_".concat(mode), size && "cell_size_".concat(size), set && "cell_set_".concat(set), bgFillClass, bgFillHoverClass, isActive && bgFillActiveClass, isDisabled && bgFillDisabledClass, bgShapeClass, widthClass, gapClass, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap', reverse && 'cell_reverse'), style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass, fillClass, fillHoverClass, isActive && fillActiveClass, isDisabled && fillDisabledClass, shapeClass, isEqual && 'cell__wrapper-equal'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsx(Text.Text, { className: "cell__title", size: titleTextSize, tag: titleTag, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), showTitleLabel && (jsxRuntime.jsx(Label.Label, { labelTextSize: titleLabelTextSize, appearance: titleLabelAppearance, label: titleLabel, shape: titleLabelShape, size: titleLabelSize }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", children: [jsxRuntime.jsx(Text.Text, { className: "cell__value", size: valueTextSize, tag: valueTag, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "cell__icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), showValueLabel && (jsxRuntime.jsx(Label.Label, { labelTextSize: valueLabelTextSize, appearance: valueLabelAppearance, label: valueLabel, shape: valueLabelShape, size: valueLabelSize }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
|
|
79
83
|
}
|
|
80
84
|
Cell.defaultProps = {
|
|
81
85
|
isDisabled: false,
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
7
|
-
var Icon = require('../../Icon-
|
|
7
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
8
8
|
var Loader = require('../../Loader-fA11tUEJ.js');
|
|
9
9
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
10
10
|
require('lodash/castArray');
|
|
@@ -20,7 +20,7 @@ require('lodash/upperFirst');
|
|
|
20
20
|
require('../hooks/styleAttributes.js');
|
|
21
21
|
require('../../Link-CqWzwh8V.js');
|
|
22
22
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
23
|
-
require('../../Tooltip-
|
|
23
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
24
24
|
require('../../Title-zwP6c2U2.js');
|
|
25
25
|
|
|
26
26
|
var choiceConfig = {
|
|
@@ -81,6 +81,14 @@ var Choice = React.forwardRef(function Choice(props, ref) {
|
|
|
81
81
|
prefix: 'gap_',
|
|
82
82
|
propsKey: 'gap',
|
|
83
83
|
});
|
|
84
|
+
var rowGapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
85
|
+
prefix: 'row-gap_',
|
|
86
|
+
propsKey: 'rowGap',
|
|
87
|
+
});
|
|
88
|
+
var columnGapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
89
|
+
prefix: 'column-gap_',
|
|
90
|
+
propsKey: 'columnGap',
|
|
91
|
+
});
|
|
84
92
|
// prettier-ignore
|
|
85
93
|
var appearanceConfig = (appearance && choiceConfig.appearance && choiceConfig.appearance[appearance]);
|
|
86
94
|
return (jsxRuntime.jsx("div", { className: clsx(className, 'choice', shapeClass ||
|
|
@@ -89,7 +97,7 @@ var Choice = React.forwardRef(function Choice(props, ref) {
|
|
|
89
97
|
((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
|
|
90
98
|
"border-color_".concat(appearanceConfig.borderColor)
|
|
91
99
|
.replace(/([A-Z])/g, '-$1')
|
|
92
|
-
.toLowerCase()), borderWidthClass, borderTypeClass, set && "choice_set_".concat(set), size && "choice_size_".concat(size), type && "choice_type_".concat(type)), ref: controlRef, children: isLoading ? (jsxRuntime.jsx(Loader.Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemAccent", set: "simple" })) : (jsxRuntime.jsx("div", { className: clsx(className, 'choice__wrapper', gapClass, wrapClass), children: options.map(function (item) {
|
|
100
|
+
.toLowerCase()), borderWidthClass, borderTypeClass, set && "choice_set_".concat(set), size && "choice_size_".concat(size), type && "choice_type_".concat(type)), ref: controlRef, children: isLoading ? (jsxRuntime.jsx(Loader.Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemAccent", set: "simple" })) : (jsxRuntime.jsx("div", { className: clsx(className, 'choice__wrapper', gapClass, rowGapClass, columnGapClass, wrapClass), children: options.map(function (item) {
|
|
93
101
|
// prettier-ignore
|
|
94
102
|
var isActive = typeof active === 'object'
|
|
95
103
|
? String(item.value) === String(active.value)
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var clsx = require('clsx');
|
|
5
5
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
6
6
|
var Divider = require('../../Divider-BjB5MD6u.js');
|
|
7
|
-
var Icon = require('../../Icon-
|
|
7
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
8
8
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
9
9
|
require('react');
|
|
10
10
|
require('lodash/castArray');
|
|
@@ -20,7 +20,7 @@ require('../hooks/styleAttributes.js');
|
|
|
20
20
|
require('react-inlinesvg');
|
|
21
21
|
require('../../Link-CqWzwh8V.js');
|
|
22
22
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
23
|
-
require('../../Tooltip-
|
|
23
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
24
24
|
require('../../Title-zwP6c2U2.js');
|
|
25
25
|
|
|
26
26
|
function ContextMenu(props) {
|
|
@@ -5,7 +5,7 @@ var React = require('react');
|
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var Cookies = require('js-cookie');
|
|
7
7
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
8
|
-
var Button = require('../../Button-
|
|
8
|
+
var Button = require('../../Button-DawNa85U.js');
|
|
9
9
|
var Group = require('../../Group-B2oTJg0t.js');
|
|
10
10
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
11
11
|
require('lodash/castArray');
|
|
@@ -18,11 +18,11 @@ require('../hooks/useStyles.js');
|
|
|
18
18
|
require('lodash/maxBy');
|
|
19
19
|
require('lodash/upperFirst');
|
|
20
20
|
require('../hooks/styleAttributes.js');
|
|
21
|
-
require('../../Icon-
|
|
21
|
+
require('../../Icon-BeHO7N79.js');
|
|
22
22
|
require('react-inlinesvg');
|
|
23
23
|
require('../../Link-CqWzwh8V.js');
|
|
24
24
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
25
|
-
require('../../Tooltip-
|
|
25
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
26
26
|
require('../../Title-zwP6c2U2.js');
|
|
27
27
|
require('../../Loader-fA11tUEJ.js');
|
|
28
28
|
|
|
@@ -7,10 +7,10 @@ var clsx = require('clsx');
|
|
|
7
7
|
var DatePicker = require('react-datepicker');
|
|
8
8
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
9
9
|
var useStyles = require('../hooks/useStyles.js');
|
|
10
|
-
var Button = require('../../Button-
|
|
11
|
-
var Icon = require('../../Icon-
|
|
10
|
+
var Button = require('../../Button-DawNa85U.js');
|
|
11
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
12
12
|
var Input = require('../../Input-BSpFMsrf.js');
|
|
13
|
-
var Label = require('../../Label-
|
|
13
|
+
var Label = require('../../Label-B0O9q0E4.js');
|
|
14
14
|
var Text = require('../../Text-_YhyTsQ1.js');
|
|
15
15
|
require('lodash/castArray');
|
|
16
16
|
require('lodash/camelCase');
|
|
@@ -24,7 +24,7 @@ require('../hooks/styleAttributes.js');
|
|
|
24
24
|
require('../../Link-CqWzwh8V.js');
|
|
25
25
|
require('../../Loader-fA11tUEJ.js');
|
|
26
26
|
require('react-inlinesvg');
|
|
27
|
-
require('../../Tooltip-
|
|
27
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
28
28
|
require('../../Title-zwP6c2U2.js');
|
|
29
29
|
|
|
30
30
|
function buildFormatLongFn(args) {
|
|
@@ -150,9 +150,13 @@ function GridRow(props) {
|
|
|
150
150
|
prefix: 'fill_hover_',
|
|
151
151
|
propsKey: 'fillHover',
|
|
152
152
|
});
|
|
153
|
+
var borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
|
|
154
|
+
prefix: 'border-color_',
|
|
155
|
+
propsKey: 'borderColor',
|
|
156
|
+
});
|
|
153
157
|
// @ts-expect-error
|
|
154
158
|
var gridRowStyles = useStyles.useStyles(props).styles;
|
|
155
|
-
return (jsxRuntime.jsx(Tag, { className: clsx(className, 'grid__row', fillClass, fillHoverClass), "data-tour": dataTour, htmlFor: htmlFor, id: id, style: gridRowStyles, onClick: onClick, children: children }));
|
|
159
|
+
return (jsxRuntime.jsx(Tag, { className: clsx(className, 'grid__row', fillClass, fillHoverClass, borderColorClass), "data-tour": dataTour, htmlFor: htmlFor, id: id, style: gridRowStyles, onClick: onClick, children: children }));
|
|
156
160
|
}
|
|
157
161
|
GridRow.defaultProps = {
|
|
158
162
|
tag: 'div',
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var Icon = require('../../Icon-
|
|
3
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
4
4
|
require('react/jsx-runtime');
|
|
5
5
|
require('react');
|
|
6
6
|
require('clsx');
|
|
@@ -18,7 +18,7 @@ require('lodash/upperFirst');
|
|
|
18
18
|
require('../hooks/styleAttributes.js');
|
|
19
19
|
require('../../Link-CqWzwh8V.js');
|
|
20
20
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
21
|
-
require('../../Tooltip-
|
|
21
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
22
22
|
require('../../Text-_YhyTsQ1.js');
|
|
23
23
|
require('../../Title-zwP6c2U2.js');
|
|
24
24
|
|
|
@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
4
4
|
var React = require('react');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
|
|
7
|
-
var Icon = require('../../Icon-
|
|
7
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
8
8
|
require('lodash/castArray');
|
|
9
9
|
require('lodash/camelCase');
|
|
10
10
|
require('../context/UIContext.js');
|
|
@@ -18,7 +18,7 @@ require('lodash/upperFirst');
|
|
|
18
18
|
require('../hooks/styleAttributes.js');
|
|
19
19
|
require('../../Link-CqWzwh8V.js');
|
|
20
20
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
21
|
-
require('../../Tooltip-
|
|
21
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
22
22
|
require('../../Text-_YhyTsQ1.js');
|
|
23
23
|
require('../../Title-zwP6c2U2.js');
|
|
24
24
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var Label = require('../../Label-
|
|
3
|
+
var Label = require('../../Label-B0O9q0E4.js');
|
|
4
4
|
require('react/jsx-runtime');
|
|
5
5
|
require('react');
|
|
6
6
|
require('clsx');
|
|
@@ -16,7 +16,7 @@ require('lodash/maxBy');
|
|
|
16
16
|
require('lodash/upperFirst');
|
|
17
17
|
require('../hooks/styleAttributes.js');
|
|
18
18
|
require('../../Text-_YhyTsQ1.js');
|
|
19
|
-
require('../../Tooltip-
|
|
19
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
20
20
|
require('../../Title-zwP6c2U2.js');
|
|
21
21
|
|
|
22
22
|
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var jsxRuntime = require('react/jsx-runtime');
|
|
4
4
|
var clsx = require('clsx');
|
|
5
|
-
var Icon = require('../../Icon-
|
|
5
|
+
var Icon = require('../../Icon-BeHO7N79.js');
|
|
6
6
|
require('react');
|
|
7
7
|
require('react-inlinesvg');
|
|
8
8
|
require('../hooks/useDeviceTargetClass.js');
|
|
@@ -18,7 +18,7 @@ require('lodash/upperFirst');
|
|
|
18
18
|
require('../hooks/styleAttributes.js');
|
|
19
19
|
require('../../Link-CqWzwh8V.js');
|
|
20
20
|
require('../../tslib.es6-CCZ3TN_7.js');
|
|
21
|
-
require('../../Tooltip-
|
|
21
|
+
require('../../Tooltip-xGmgUzGr.js');
|
|
22
22
|
require('../../Text-_YhyTsQ1.js');
|
|
23
23
|
require('../../Title-zwP6c2U2.js');
|
|
24
24
|
|