labsense-ui-kit 1.3.88 → 1.3.90
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/IconTooltip.d.ts +1 -0
- package/dist/index.js +34 -27
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +34 -27
- package/dist/index.modern.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -7061,7 +7061,7 @@ var Badge = function Badge(_ref8) {
|
|
|
7061
7061
|
};
|
|
7062
7062
|
|
|
7063
7063
|
var _templateObject$4, _templateObject2$4, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
|
|
7064
|
-
var TooltipContainer = styled__default.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: absolute;\n z-index: 10;\n align-items: center;\n justify-content: center;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.3s;\n border-radius: ", ";\n padding: 6px 8px;\n border: ", ";\n min-width: ", ";\n
|
|
7064
|
+
var TooltipContainer = styled__default.div(_templateObject$4 || (_templateObject$4 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: absolute;\n z-index: 10;\n align-items: center;\n justify-content: center;\n visibility: hidden;\n opacity: 0;\n transition: opacity 0.3s;\n border-radius: ", ";\n padding: 6px 8px;\n border: ", ";\n min-width: ", ";\n max-width: ", ";\n text-align: ", ";\n background-color: ", ";\n gap: ", ";\n\n ", "\n\n &::after {\n content: '';\n position: absolute;\n width: 16px;\n height: 8px;\n background-color: ", ";\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%);\n\n ", "\n }\n"])), function (_ref) {
|
|
7065
7065
|
var $borderRadius = _ref.$borderRadius;
|
|
7066
7066
|
return $borderRadius != null ? $borderRadius : '4px';
|
|
7067
7067
|
}, function (_ref2) {
|
|
@@ -7074,25 +7074,28 @@ var TooltipContainer = styled__default.div(_templateObject$4 || (_templateObject
|
|
|
7074
7074
|
var $maxWidth = _ref4.$maxWidth;
|
|
7075
7075
|
return $maxWidth != null ? $maxWidth : 'auto';
|
|
7076
7076
|
}, function (_ref5) {
|
|
7077
|
-
var $
|
|
7078
|
-
|
|
7079
|
-
return $background != null ? $background : theme.vms.accent.light_1;
|
|
7077
|
+
var $textAlign = _ref5.$textAlign;
|
|
7078
|
+
return $textAlign;
|
|
7080
7079
|
}, function (_ref6) {
|
|
7081
|
-
var $
|
|
7082
|
-
|
|
7080
|
+
var $background = _ref6.$background,
|
|
7081
|
+
theme = _ref6.theme;
|
|
7082
|
+
return $background != null ? $background : theme.vms.accent.light_1;
|
|
7083
7083
|
}, function (_ref7) {
|
|
7084
|
-
var $
|
|
7085
|
-
|
|
7086
|
-
|
|
7084
|
+
var $gap = _ref7.$gap;
|
|
7085
|
+
return $gap != null ? $gap : '16px';
|
|
7086
|
+
}, function (_ref8) {
|
|
7087
|
+
var $tooltipPosition = _ref8.$tooltipPosition,
|
|
7088
|
+
$iconSize = _ref8.$iconSize,
|
|
7089
|
+
$tooltipTop = _ref8.$tooltipTop;
|
|
7087
7090
|
var vertical = $tooltipPosition.startsWith('top') ? "bottom: " + ($tooltipTop != null ? $tooltipTop : "calc(50% + " + ($iconSize + 2) + "px)") + ";" : "top: " + ($tooltipTop != null ? $tooltipTop : "calc(50% + " + ($iconSize + 2) + "px)") + ";";
|
|
7088
7091
|
var horizontal = $tooltipPosition.endsWith('Left') ? styled.css(_templateObject2$4 || (_templateObject2$4 = _taggedTemplateLiteralLoose(["left: calc(100% + 10px); transform: translateX(-99%);"]))) : $tooltipPosition.endsWith('Center') ? styled.css(_templateObject3$1 || (_templateObject3$1 = _taggedTemplateLiteralLoose(["left: 50%; transform: translateX(-50%);"]))) : styled.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["right: calc(100% + 10px); transform: translateX(99%);"])));
|
|
7089
7092
|
return styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["", " ", ";"])), vertical, horizontal);
|
|
7090
|
-
}, function (_ref8) {
|
|
7091
|
-
var $background = _ref8.$background,
|
|
7092
|
-
theme = _ref8.theme;
|
|
7093
|
-
return $background != null ? $background : theme.vms.accent.light_1;
|
|
7094
7093
|
}, function (_ref9) {
|
|
7095
|
-
var $
|
|
7094
|
+
var $background = _ref9.$background,
|
|
7095
|
+
theme = _ref9.theme;
|
|
7096
|
+
return $background != null ? $background : theme.vms.accent.light_1;
|
|
7097
|
+
}, function (_ref10) {
|
|
7098
|
+
var $tooltipPosition = _ref10.$tooltipPosition;
|
|
7096
7099
|
if ($tooltipPosition.startsWith('top')) {
|
|
7097
7100
|
return $tooltipPosition.endsWith('Left') ? styled.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["top: 100%; right: 10px; transform: rotate(180deg);"]))) : $tooltipPosition.endsWith('Right') ? styled.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["top: 100%; left: 10px; transform: rotate(180deg);"]))) : styled.css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["top: 100%; left: 50%; transform: translateX(-50%) rotate(180deg);"])));
|
|
7098
7101
|
} else {
|
|
@@ -7100,24 +7103,24 @@ var TooltipContainer = styled__default.div(_templateObject$4 || (_templateObject
|
|
|
7100
7103
|
}
|
|
7101
7104
|
});
|
|
7102
7105
|
var TooltipWrapper$1 = styled__default.div(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n display: flex;\n position: relative;\n align-items: center;\n cursor: pointer;\n\n &:hover ", " {\n visibility: visible;\n opacity: 1;\n }\n"])), TooltipContainer);
|
|
7103
|
-
var IconTooltip = function IconTooltip(
|
|
7106
|
+
var IconTooltip = function IconTooltip(_ref11) {
|
|
7104
7107
|
var _tooltipCSS$position;
|
|
7105
|
-
var
|
|
7106
|
-
icon =
|
|
7108
|
+
var _ref11$icon = _ref11.icon,
|
|
7109
|
+
icon = _ref11$icon === void 0 ? {
|
|
7107
7110
|
icon: 'Information',
|
|
7108
7111
|
size: 12,
|
|
7109
7112
|
weight: '0px'
|
|
7110
|
-
} :
|
|
7111
|
-
image =
|
|
7112
|
-
infoIcon =
|
|
7113
|
-
infoText =
|
|
7114
|
-
|
|
7115
|
-
tooltipCSS =
|
|
7113
|
+
} : _ref11$icon,
|
|
7114
|
+
image = _ref11.image,
|
|
7115
|
+
infoIcon = _ref11.infoIcon,
|
|
7116
|
+
infoText = _ref11.infoText,
|
|
7117
|
+
_ref11$tooltipCSS = _ref11.tooltipCSS,
|
|
7118
|
+
tooltipCSS = _ref11$tooltipCSS === void 0 ? {
|
|
7116
7119
|
gap: '4px',
|
|
7117
7120
|
minWidth: 'max-content',
|
|
7118
7121
|
position: 'bottomCenter',
|
|
7119
7122
|
tooltipTop: undefined
|
|
7120
|
-
} :
|
|
7123
|
+
} : _ref11$tooltipCSS;
|
|
7121
7124
|
var themeColors = styled.useTheme();
|
|
7122
7125
|
return React__default.createElement(TooltipWrapper$1, null, image ? React__default.createElement("img", {
|
|
7123
7126
|
src: image.src,
|
|
@@ -7136,7 +7139,8 @@ var IconTooltip = function IconTooltip(_ref10) {
|
|
|
7136
7139
|
"$gap": tooltipCSS.gap,
|
|
7137
7140
|
"$iconSize": icon.size || 17,
|
|
7138
7141
|
"$border": tooltipCSS.border,
|
|
7139
|
-
"$borderRadius": tooltipCSS.borderRadius
|
|
7142
|
+
"$borderRadius": tooltipCSS.borderRadius,
|
|
7143
|
+
"$textAlign": tooltipCSS.textAlign
|
|
7140
7144
|
}, infoIcon && React__default.createElement(Icon, Object.assign({}, infoIcon)), infoText));
|
|
7141
7145
|
};
|
|
7142
7146
|
|
|
@@ -11041,7 +11045,8 @@ var Sidebar = function Sidebar(_ref26) {
|
|
|
11041
11045
|
return React__default.createElement(Container, {
|
|
11042
11046
|
"$padding": '0px 0px 0px 16px',
|
|
11043
11047
|
"$flexDirection": 'column',
|
|
11044
|
-
"$gap": '10px'
|
|
11048
|
+
"$gap": '10px',
|
|
11049
|
+
"$width": '100%'
|
|
11045
11050
|
}, children.map(function (child) {
|
|
11046
11051
|
return React__default.createElement(ChildLink, {
|
|
11047
11052
|
key: child.id,
|
|
@@ -11143,7 +11148,9 @@ var Sidebar = function Sidebar(_ref26) {
|
|
|
11143
11148
|
"$color": themeColors.vms.text.medium,
|
|
11144
11149
|
"$hoverColor": themeColors.vms.text.white,
|
|
11145
11150
|
"$width": '100%'
|
|
11146
|
-
}, ContentLayout), hasChildren && isExpanded && isOpen && renderChildLinks && React__default.createElement(Container,
|
|
11151
|
+
}, ContentLayout), hasChildren && isExpanded && isOpen && renderChildLinks && React__default.createElement(Container, {
|
|
11152
|
+
"$width": '100%'
|
|
11153
|
+
}, renderChildLinks(item.children)));
|
|
11147
11154
|
};
|
|
11148
11155
|
var handleSidebarExpansion = React.useCallback(function (expanded) {
|
|
11149
11156
|
if (isExpandedRef.current !== expanded) {
|