labsense-ui-kit 1.1.57 → 1.1.58

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.
@@ -6,13 +6,11 @@ interface ITooltipProps {
6
6
  infoText: React.ReactNode;
7
7
  tooltipCSS?: {
8
8
  background?: string;
9
- color?: string;
10
9
  gap?: string;
11
10
  minWidth?: string;
11
+ maxWidth?: string;
12
12
  position?: 'topLeft' | 'topCenter' | 'topRight' | 'bottomLeft' | 'bottomCenter' | 'bottomRight';
13
13
  tooltipTop?: string;
14
- fontSize?: string;
15
- fontWeight?: string;
16
14
  };
17
15
  }
18
16
  declare const IconTooltip: React.FC<ITooltipProps>;
package/dist/index.js CHANGED
@@ -3609,27 +3609,30 @@ var Badge = function Badge(_ref4) {
3609
3609
  };
3610
3610
 
3611
3611
  var _templateObject$3, _templateObject2$3, _templateObject3$1, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
3612
- var TooltipContainer = styled__default.div(_templateObject$3 || (_templateObject$3 = _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: 4px;\n padding: 6px 8px;\n min-width: ", ";\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) {
3612
+ var TooltipContainer = styled__default.div(_templateObject$3 || (_templateObject$3 = _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: 4px;\n padding: 6px 8px;\n min-width: ", ";\n min-width: ", ";\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) {
3613
3613
  var $minWidth = _ref.$minWidth;
3614
3614
  return $minWidth != null ? $minWidth : 'auto';
3615
3615
  }, function (_ref2) {
3616
- var $background = _ref2.$background;
3617
- return $background != null ? $background : colorVariables.accent.light_1;
3616
+ var $maxWidth = _ref2.$maxWidth;
3617
+ return $maxWidth != null ? $maxWidth : 'auto';
3618
3618
  }, function (_ref3) {
3619
- var $gap = _ref3.$gap;
3620
- return $gap != null ? $gap : '16px';
3619
+ var $background = _ref3.$background;
3620
+ return $background != null ? $background : colorVariables.accent.light_1;
3621
3621
  }, function (_ref4) {
3622
- var $tooltipPosition = _ref4.$tooltipPosition,
3623
- $iconSize = _ref4.$iconSize,
3624
- $tooltipTop = _ref4.$tooltipTop;
3622
+ var $gap = _ref4.$gap;
3623
+ return $gap != null ? $gap : '16px';
3624
+ }, function (_ref5) {
3625
+ var $tooltipPosition = _ref5.$tooltipPosition,
3626
+ $iconSize = _ref5.$iconSize,
3627
+ $tooltipTop = _ref5.$tooltipTop;
3625
3628
  var vertical = $tooltipPosition.startsWith('top') ? "bottom: " + ($tooltipTop != null ? $tooltipTop : "calc(50% + " + ($iconSize + 2) + "px)") + ";" : "top: " + ($tooltipTop != null ? $tooltipTop : "calc(50% + " + ($iconSize + 2) + "px)") + ";";
3626
3629
  var horizontal = $tooltipPosition.endsWith('Left') ? styled.css(_templateObject2$3 || (_templateObject2$3 = _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%);"])));
3627
3630
  return styled.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["", " ", ";"])), vertical, horizontal);
3628
- }, function (_ref5) {
3629
- var $background = _ref5.$background;
3630
- return $background != null ? $background : colorVariables.accent.light_1;
3631
3631
  }, function (_ref6) {
3632
- var $tooltipPosition = _ref6.$tooltipPosition;
3632
+ var $background = _ref6.$background;
3633
+ return $background != null ? $background : colorVariables.accent.light_1;
3634
+ }, function (_ref7) {
3635
+ var $tooltipPosition = _ref7.$tooltipPosition;
3633
3636
  if ($tooltipPosition.startsWith('top')) {
3634
3637
  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);"])));
3635
3638
  } else {
@@ -3637,33 +3640,31 @@ var TooltipContainer = styled__default.div(_templateObject$3 || (_templateObject
3637
3640
  }
3638
3641
  });
3639
3642
  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);
3640
- var IconTooltip = function IconTooltip(_ref7) {
3643
+ var IconTooltip = function IconTooltip(_ref8) {
3641
3644
  var _tooltipCSS$position;
3642
- var _ref7$icon = _ref7.icon,
3643
- icon = _ref7$icon === void 0 ? {
3645
+ var _ref8$icon = _ref8.icon,
3646
+ icon = _ref8$icon === void 0 ? {
3644
3647
  icon: 'Information',
3645
3648
  size: 12,
3646
3649
  weight: '0px',
3647
3650
  color: colorVariables.text.medium
3648
- } : _ref7$icon,
3649
- infoIcon = _ref7.infoIcon,
3650
- infoText = _ref7.infoText,
3651
- _ref7$tooltipCSS = _ref7.tooltipCSS,
3652
- tooltipCSS = _ref7$tooltipCSS === void 0 ? {
3651
+ } : _ref8$icon,
3652
+ infoIcon = _ref8.infoIcon,
3653
+ infoText = _ref8.infoText,
3654
+ _ref8$tooltipCSS = _ref8.tooltipCSS,
3655
+ tooltipCSS = _ref8$tooltipCSS === void 0 ? {
3653
3656
  background: colorVariables.accent.light_1,
3654
- color: colorVariables.text.dark,
3655
3657
  gap: '4px',
3656
3658
  minWidth: 'max-content',
3657
3659
  position: 'bottomCenter',
3658
- tooltipTop: undefined,
3659
- fontSize: '12px',
3660
- fontWeight: '400'
3661
- } : _ref7$tooltipCSS;
3660
+ tooltipTop: undefined
3661
+ } : _ref8$tooltipCSS;
3662
3662
  return React__default.createElement(TooltipWrapper$1, null, React__default.createElement(Icon, Object.assign({}, icon, {
3663
3663
  onClick: function onClick() {}
3664
3664
  })), React__default.createElement(TooltipContainer, {
3665
3665
  "$tooltipPosition": (_tooltipCSS$position = tooltipCSS.position) != null ? _tooltipCSS$position : 'bottomCenter',
3666
3666
  "$minWidth": tooltipCSS.minWidth,
3667
+ "$maxWidth": tooltipCSS.maxWidth,
3667
3668
  "$tooltipTop": tooltipCSS.tooltipTop,
3668
3669
  "$background": tooltipCSS.background,
3669
3670
  "$gap": tooltipCSS.gap,