@trafilea/afrodita-components 6.57.0 → 6.57.2

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.
Files changed (6) hide show
  1. package/build/index.d.ts +2 -0
  2. package/build/index.esm.js +55 -27
  3. package/build/index.esm.js.map +1 -1
  4. package/build/index.js +55 -27
  5. package/build/index.js.map +1 -1
  6. package/package.json +1 -1
package/build/index.js CHANGED
@@ -3564,9 +3564,9 @@ var getWrapperFlexDirection = function (position) {
3564
3564
  case exports.ComponentPosition.Bottom:
3565
3565
  return 'column-reverse';
3566
3566
  case exports.ComponentPosition.BottomLeft:
3567
- return 'column-reverse';
3567
+ return 'row-reverse';
3568
3568
  case exports.ComponentPosition.BottomRight:
3569
- return 'column-reverse';
3569
+ return 'row';
3570
3570
  case exports.ComponentPosition.Left:
3571
3571
  return 'row-reverse';
3572
3572
  case exports.ComponentPosition.Right:
@@ -3580,9 +3580,9 @@ var getContainerFlexDirection = function (position) {
3580
3580
  case exports.ComponentPosition.Bottom:
3581
3581
  return 'column-reverse';
3582
3582
  case exports.ComponentPosition.BottomLeft:
3583
- return 'column-reverse';
3583
+ return 'row';
3584
3584
  case exports.ComponentPosition.BottomRight:
3585
- return 'column-reverse';
3585
+ return 'row-reverse';
3586
3586
  case exports.ComponentPosition.Left:
3587
3587
  return 'row';
3588
3588
  case exports.ComponentPosition.Right:
@@ -3596,9 +3596,9 @@ var getArrowStyles = function (position, borderColor, backgroundColor) {
3596
3596
  case exports.ComponentPosition.Bottom:
3597
3597
  return "\n &::before,&::after\n {\n content: '';\n position: absolute;\n top: 0%;\n left: 50%;\n margin-left: -10px;\n margin-top: -9px;\n border: 10px solid transparent;\n border-top: 0;\n }\n \n &::before {\n border-bottom: 10px solid ".concat(borderColor, ";\n margin-top: -10px;\n }\n &::after {\n border-bottom: 10px solid ").concat(backgroundColor, ";\n z-index: 999;\n }");
3598
3598
  case exports.ComponentPosition.BottomLeft:
3599
- return "\n &::before,&::after\n {\n content: '';\n position: absolute;\n top: 0%;\n left: 65%;\n margin-left: -10px;\n margin-top: -9px;\n border: 10px solid transparent;\n border-top: 0;\n }\n \n &::before {\n border-bottom: 10px solid ".concat(borderColor, ";\n margin-top: -10px;\n }\n &::after {\n border-bottom: 10px solid ").concat(backgroundColor, ";\n z-index: 999;\n }");
3599
+ return "\n &::before,&::after\n {\n content: '';\n position: absolute;\n top: 0%;\n left: 171px;\n margin-top: -9px;\n border: 10px solid transparent;\n border-top: 0;\n }\n \n &::before {\n border-bottom: 10px solid ".concat(borderColor, ";\n margin-top: -10px;\n }\n &::after {\n border-bottom: 10px solid ").concat(backgroundColor, ";\n z-index: 999;\n }");
3600
3600
  case exports.ComponentPosition.BottomRight:
3601
- return "\n &::before,&::after\n {\n content: '';\n position: absolute;\n top: 0%;\n left: 15%;\n margin-left: -10px;\n margin-top: -9px;\n border: 10px solid transparent;\n border-top: 0;\n }\n \n &::before {\n border-bottom: 10px solid ".concat(borderColor, ";\n margin-top: -10px;\n }\n &::after {\n border-bottom: 10px solid ").concat(backgroundColor, ";\n z-index: 999;\n }");
3601
+ return "\n &::before,&::after\n {\n content: '';\n position: absolute;\n top: 0%;\n left: 28px;\n margin-top: -9px;\n border: 10px solid transparent;\n border-top: 0;\n }\n \n &::before {\n border-bottom: 10px solid ".concat(borderColor, ";\n margin-top: -10px;\n }\n &::after {\n border-bottom: 10px solid ").concat(backgroundColor, ";\n z-index: 999;\n }");
3602
3602
  case exports.ComponentPosition.Left:
3603
3603
  return "\n &::before,&::after\n {\n content: '';\n position: absolute;\n top: 50%;\n left: 100%;\n margin-top: -10px;\n border: 10px solid transparent;\n border-right: 0;s\n border-left: 10px solid transparent;\n margin-left: -1px;\n }\n \n &::before {\n border-left: 10px solid ".concat(borderColor, ";\n \n }\n &::after {\n border-left: 10px solid ").concat(backgroundColor, ";\n z-index: 999;\n }");
3604
3604
  case exports.ComponentPosition.Right:
@@ -3612,14 +3612,32 @@ var getTooltipAlignItems = function (position, align) {
3612
3612
  case exports.ComponentPosition.Bottom:
3613
3613
  return align;
3614
3614
  case exports.ComponentPosition.BottomLeft:
3615
- return align;
3615
+ return 'center';
3616
3616
  case exports.ComponentPosition.BottomRight:
3617
- return align;
3617
+ return 'center';
3618
3618
  case exports.ComponentPosition.Left:
3619
3619
  return 'center';
3620
3620
  case exports.ComponentPosition.Right:
3621
3621
  return 'center';
3622
3622
  }
3623
+ };
3624
+ var getCloseIconRight = function (position, defaultRight) {
3625
+ switch (position) {
3626
+ case exports.ComponentPosition.BottomLeft:
3627
+ case exports.ComponentPosition.BottomRight:
3628
+ return '.55rem';
3629
+ default:
3630
+ return defaultRight;
3631
+ }
3632
+ };
3633
+ var getTooltipTextMaxWidth = function (position) {
3634
+ switch (position) {
3635
+ case exports.ComponentPosition.BottomLeft:
3636
+ case exports.ComponentPosition.BottomRight:
3637
+ return '203px';
3638
+ default:
3639
+ return undefined;
3640
+ }
3623
3641
  };
3624
3642
 
3625
3643
  var Wrapper$8 = newStyled.div(templateObject_1$2D || (templateObject_1$2D = __makeTemplateObject(["\n display: flex;\n flex-direction: ", ";\n align-items: center;\n cursor: pointer;\n\n &:hover {\n .tooltip-container {\n visibility: ", ";\n opacity: ", ";\n cursor: text;\n }\n }\n"], ["\n display: flex;\n flex-direction: ", ";\n align-items: center;\n cursor: pointer;\n\n &:hover {\n .tooltip-container {\n visibility: ", ";\n opacity: ", ";\n cursor: text;\n }\n }\n"])), function (_a) {
@@ -3660,13 +3678,13 @@ var TooltipContainer = newStyled.div(templateObject_2$1T || (templateObject_2$1T
3660
3678
  var getTooltipMargin = function (actual, expected, margin) {
3661
3679
  if ((actual === exports.ComponentPosition.BottomLeft || actual === exports.ComponentPosition.BottomRight) &&
3662
3680
  expected === exports.ComponentPosition.Bottom) {
3663
- return "calc(".concat(margin, " - 10px)");
3681
+ return "calc(".concat(margin, " - 37px)");
3664
3682
  }
3665
- if (actual === exports.ComponentPosition.BottomLeft && expected === exports.ComponentPosition.Right) {
3666
- return '-80px';
3683
+ if (actual === exports.ComponentPosition.BottomRight && expected === exports.ComponentPosition.Right) {
3684
+ return '-30px';
3667
3685
  }
3668
- if (actual === exports.ComponentPosition.BottomRight && expected === exports.ComponentPosition.Left) {
3669
- return '-190px';
3686
+ if (actual === exports.ComponentPosition.BottomLeft && expected === exports.ComponentPosition.Left) {
3687
+ return '-40px';
3670
3688
  }
3671
3689
  return actual === expected ? margin : '0';
3672
3690
  };
@@ -3681,8 +3699,8 @@ var TooltipText = newStyled.div(templateObject_4$17 || (templateObject_4$17 = __
3681
3699
  var theme = _a.theme;
3682
3700
  return theme.component.autoship.tooltip.text.alignment;
3683
3701
  }, function (_a) {
3684
- var theme = _a.theme;
3685
- return theme.component.autoship.tooltip.text.maxWidth;
3702
+ var theme = _a.theme, maxWidth = _a.maxWidth;
3703
+ return maxWidth !== null && maxWidth !== void 0 ? maxWidth : theme.component.autoship.tooltip.text.maxWidth;
3686
3704
  }, function (_a) {
3687
3705
  var color = _a.color;
3688
3706
  return color;
@@ -3717,12 +3735,12 @@ var Tooltip = function (_a) {
3717
3735
  var ref = tooltipRef.current;
3718
3736
  setTooltipHeight((ref === null || ref === void 0 ? void 0 : ref.offsetHeight) || 0);
3719
3737
  }, [tooltipRef]);
3720
- return (jsxRuntime.jsxs(Wrapper$8, __assign$1({ position: position, disableHover: closeTooltip, onMouseEnter: function () { return setCloseTooltip(closeTooltip && false); }, "data-testid": "TooltipWrapper" }, { children: [jsxRuntime.jsx("div", __assign$1({ ref: childrenRef, onClick: function () { return closeTooltip && setCloseTooltip(false); }, onKeyDown: function (e) { return e.key === 'Enter' && closeTooltip && setCloseTooltip(false); }, role: "button", tabIndex: 0 }, { children: children }), void 0), jsxRuntime.jsxs(TooltipContainer, __assign$1({ position: position, align: align, maxWidth: maxWidth, childrenWidth: childrenWidth, tooltipHeight: tooltipHeight, ref: tooltipRef, onClick: onClick, "data-testid": "TooltipContainer", className: "tooltip-container ".concat(closeTooltip ? 'hidden' : ''), borderColor: theme.colors.shades['200'].color, backgroundColor: backgroundColor ? backgroundColor : theme.colors.shades.white.color, withArrow: withArrow }, { children: [(showCloseIcon || isMobile) && (jsxRuntime.jsx(CloseToolTip, __assign$1({ right: header === null || header === void 0 ? void 0 : header.iconRight, onClick: function () { return setCloseTooltip(true); } }, { children: jsxRuntime.jsx(Icon.Actions.Close, { width: closeBtnSize, height: closeBtnSize, fill: (_b = header === null || header === void 0 ? void 0 : header.iconFill) !== null && _b !== void 0 ? _b : theme.colors.pallete.secondary.color }, void 0) }), void 0)), jsxRuntime.jsxs(ContentWrapper$1, __assign$1({ className: "tooltip-wrapper", borderColor: theme.colors.shades['200'].color, backgroundColor: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : theme.colors.shades.white.color }, { children: [header && (jsxRuntime.jsxs(TopSection, __assign$1({ "data-testid": "TooltipHeader" }, { children: [(header === null || header === void 0 ? void 0 : header.Icon) && (jsxRuntime.jsx(IconContainer$6, { children: React__default["default"].createElement(header.Icon, {
3738
+ return (jsxRuntime.jsxs(Wrapper$8, __assign$1({ position: position, disableHover: closeTooltip, onMouseEnter: function () { return setCloseTooltip(closeTooltip && false); }, "data-testid": "TooltipWrapper" }, { children: [jsxRuntime.jsx("div", __assign$1({ ref: childrenRef, onClick: function () { return closeTooltip && setCloseTooltip(false); }, onKeyDown: function (e) { return e.key === 'Enter' && closeTooltip && setCloseTooltip(false); }, role: "button", tabIndex: 0 }, { children: children }), void 0), jsxRuntime.jsxs(TooltipContainer, __assign$1({ position: position, align: align, maxWidth: maxWidth, childrenWidth: childrenWidth, tooltipHeight: tooltipHeight, ref: tooltipRef, onClick: onClick, "data-testid": "TooltipContainer", className: "tooltip-container ".concat(closeTooltip ? 'hidden' : ''), borderColor: theme.colors.shades['200'].color, backgroundColor: backgroundColor ? backgroundColor : theme.colors.shades.white.color, withArrow: withArrow, "data-position": position }, { children: [(showCloseIcon || isMobile) && (jsxRuntime.jsx(CloseToolTip, __assign$1({ right: getCloseIconRight(position, header === null || header === void 0 ? void 0 : header.iconRight), onClick: function () { return setCloseTooltip(true); } }, { children: jsxRuntime.jsx(Icon.Actions.Close, { width: closeBtnSize, height: closeBtnSize, fill: (_b = header === null || header === void 0 ? void 0 : header.iconFill) !== null && _b !== void 0 ? _b : theme.colors.pallete.secondary.color }, void 0) }), void 0)), jsxRuntime.jsxs(ContentWrapper$1, __assign$1({ className: "tooltip-wrapper", borderColor: theme.colors.shades['200'].color, backgroundColor: backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : theme.colors.shades.white.color }, { children: [header && (jsxRuntime.jsxs(TopSection, __assign$1({ "data-testid": "TooltipHeader" }, { children: [(header === null || header === void 0 ? void 0 : header.Icon) && (jsxRuntime.jsx(IconContainer$6, { children: React__default["default"].createElement(header.Icon, {
3721
3739
  testId: 'HeaderIcon',
3722
3740
  fill: (header === null || header === void 0 ? void 0 : header.iconFill)
3723
3741
  ? header === null || header === void 0 ? void 0 : header.iconFill
3724
3742
  : theme.colors.pallete.secondary.color,
3725
- }) }, void 0)), jsxRuntime.jsx(Title$b, __assign$1({ color: (header === null || header === void 0 ? void 0 : header.titleColor) ? header === null || header === void 0 ? void 0 : header.titleColor : theme.colors.pallete.secondary.color }, { children: header.title }), void 0)] }), void 0)), content && (content === null || content === void 0 ? void 0 : content.text) ? (jsxRuntime.jsx(TooltipText, { color: (content === null || content === void 0 ? void 0 : content.color) ? content === null || content === void 0 ? void 0 : content.color : theme.colors.pallete.secondary.color, "data-testid": "TooltipText", dangerouslySetInnerHTML: { __html: content.text } }, void 0)) : (elementContent)] }), void 0)] }), void 0)] }), void 0));
3743
+ }) }, void 0)), jsxRuntime.jsx(Title$b, __assign$1({ color: (header === null || header === void 0 ? void 0 : header.titleColor) ? header === null || header === void 0 ? void 0 : header.titleColor : theme.colors.pallete.secondary.color }, { children: header.title }), void 0)] }), void 0)), content && (content === null || content === void 0 ? void 0 : content.text) ? (jsxRuntime.jsx(TooltipText, { color: (content === null || content === void 0 ? void 0 : content.color) ? content === null || content === void 0 ? void 0 : content.color : theme.colors.pallete.secondary.color, "data-testid": "TooltipText", dangerouslySetInnerHTML: { __html: content.text }, maxWidth: getTooltipTextMaxWidth(position) }, void 0)) : (elementContent)] }), void 0)] }), void 0)] }), void 0));
3726
3744
  };
3727
3745
 
3728
3746
  var FinalPriceStyledContainer$3 = newStyled.div(templateObject_1$2C || (templateObject_1$2C = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
@@ -3782,7 +3800,9 @@ var PriceLabelV2$1 = function (_a) {
3782
3800
  letterSpacing: '-0.05rem',
3783
3801
  }, bordersRounded: bordersRounded, savings: savingsDisplay ? "Save ".concat(currencySymbol).concat(savetoString) : undefined }), void 0)) }), void 0)), tooltipText && (jsxRuntime.jsx(TooltipContainer$1, __assign$1({ "data-testid": "tooltip-container" }, { children: jsxRuntime.jsx(Tooltip, __assign$1({ showCloseIcon: true, withArrow: true, content: {
3784
3802
  text: tooltipText,
3785
- }, position: tooltipPosition !== null && tooltipPosition !== void 0 ? tooltipPosition : (isMobile ? exports.ComponentPosition.BottomLeft : exports.ComponentPosition.BottomRight), "data-testid": "tooltip" }, { children: jsxRuntime.jsx(Icon$1, { name: tooltipIcon !== null && tooltipIcon !== void 0 ? tooltipIcon : 'actions/circle_info', fill: theme.colors.shades[500].color, testId: "tooltip-icon" }, void 0) }), void 0) }), void 0)), isClubOffer && (jsxRuntime.jsx(TagContainer, __assign$1({ size: exports.ComponentSize.Medium }, { children: clubOffer && (jsxRuntime.jsx(ClubOfferTag, __assign$1({}, clubOffer, { size: exports.ComponentSize.Small, style: {
3803
+ }, position: tooltipPosition !== null && tooltipPosition !== void 0 ? tooltipPosition : (isDiscount && isMobile
3804
+ ? exports.ComponentPosition.BottomLeft
3805
+ : exports.ComponentPosition.BottomRight), closeBtnSize: 0.7, "data-testid": "tooltip" }, { children: jsxRuntime.jsx(Icon$1, { name: tooltipIcon !== null && tooltipIcon !== void 0 ? tooltipIcon : 'actions/circle_info', fill: theme.colors.shades[500].color, testId: "tooltip-icon", showTooltipTitle: false }, void 0) }), void 0) }), void 0)), isClubOffer && (jsxRuntime.jsx(TagContainer, __assign$1({ size: exports.ComponentSize.Medium }, { children: clubOffer && (jsxRuntime.jsx(ClubOfferTag, __assign$1({}, clubOffer, { size: exports.ComponentSize.Small, style: {
3786
3806
  borderRadius: '8px',
3787
3807
  width: '107px',
3788
3808
  height: '28px',
@@ -4009,7 +4029,7 @@ var SkeletonBox = function (_a) {
4009
4029
  };
4010
4030
  var templateObject_1$2v;
4011
4031
 
4012
- var StyledSvgWrapper = newStyled.svg(templateObject_1$2u || (templateObject_1$2u = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n color: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n"], ["\n width: ", ";\n height: ", ";\n color: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n"])), function (_a) {
4032
+ var StyledSvgWrapper = newStyled.svg(templateObject_1$2u || (templateObject_1$2u = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n color: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n ", "\n"], ["\n width: ", ";\n height: ", ";\n color: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n ", "\n"])), function (_a) {
4013
4033
  var width = _a.width;
4014
4034
  return width;
4015
4035
  }, function (_a) {
@@ -4024,8 +4044,12 @@ var StyledSvgWrapper = newStyled.svg(templateObject_1$2u || (templateObject_1$2u
4024
4044
  }, function (_a) {
4025
4045
  var opacity = _a.opacity;
4026
4046
  return opacity && "opacity: ".concat(opacity, ";");
4047
+ }, function (_a) {
4048
+ var showTooltipTitle = _a.showTooltipTitle;
4049
+ return !showTooltipTitle &&
4050
+ "\n use {\n pointer-events: none;\n }\n ";
4027
4051
  });
4028
- var StyledImageWrapper = newStyled.img(templateObject_2$1P || (templateObject_2$1P = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n"], ["\n width: ", ";\n height: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n"])), function (_a) {
4052
+ var StyledImageWrapper = newStyled.img(templateObject_2$1P || (templateObject_2$1P = __makeTemplateObject(["\n width: ", ";\n height: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n ", "\n"], ["\n width: ", ";\n height: ", ";\n display: inline-block;\n vertical-align: middle;\n flex: none;\n ", "\n ", "\n ", "\n"])), function (_a) {
4029
4053
  var width = _a.width;
4030
4054
  return width;
4031
4055
  }, function (_a) {
@@ -4037,6 +4061,10 @@ var StyledImageWrapper = newStyled.img(templateObject_2$1P || (templateObject_2$
4037
4061
  }, function (_a) {
4038
4062
  var opacity = _a.opacity;
4039
4063
  return opacity && "opacity: ".concat(opacity, ";");
4064
+ }, function (_a) {
4065
+ var showTooltipTitle = _a.showTooltipTitle;
4066
+ return !showTooltipTitle &&
4067
+ "\n use {\n pointer-events: none;\n }\n ";
4040
4068
  });
4041
4069
  var templateObject_1$2u, templateObject_2$1P;
4042
4070
 
@@ -4117,9 +4145,9 @@ var getIconDimension = function (dimension) {
4117
4145
  };
4118
4146
 
4119
4147
  var UnmemoIconFromExtSource = function (_a) {
4120
- var height = _a.height, width = _a.width, title = _a.title, testId = _a.testId, fill = _a.fill, name = _a.name, svgProps = _a.svgProps, iconURL = _a.iconURL, svgId = _a.svgId, rest = __rest(_a, ["height", "width", "title", "testId", "fill", "name", "svgProps", "iconURL", "svgId"]);
4121
- var _b = React$2.useState(false), error = _b[0], setError = _b[1];
4122
- var _c = React$2.useState(), localSource = _c[0], setLocalSource = _c[1];
4148
+ var height = _a.height, width = _a.width, title = _a.title, testId = _a.testId, fill = _a.fill, name = _a.name, svgProps = _a.svgProps, iconURL = _a.iconURL, svgId = _a.svgId, _b = _a.showTooltipTitle, showTooltipTitle = _b === void 0 ? true : _b, rest = __rest(_a, ["height", "width", "title", "testId", "fill", "name", "svgProps", "iconURL", "svgId", "showTooltipTitle"]);
4149
+ var _c = React$2.useState(false), error = _c[0], setError = _c[1];
4150
+ var _d = React$2.useState(), localSource = _d[0], setLocalSource = _d[1];
4123
4151
  React$2.useEffect(function () {
4124
4152
  var fetchIcon = function () { return __awaiter(void 0, void 0, void 0, function () {
4125
4153
  var localSource;
@@ -4153,13 +4181,13 @@ var UnmemoIconFromExtSource = function (_a) {
4153
4181
  if (!fill && !svgProps) {
4154
4182
  return jsxRuntime.jsx(StyledImageWrapper, __assign$1({}, imageProperties, rest, { src: localSource.src }), void 0);
4155
4183
  }
4156
- return (jsxRuntime.jsxs(StyledSvgWrapper, __assign$1({ "data-testid": testId, fill: fill, height: height, type: "image/svg+xml", width: width }, rest, svgProps, { children: [jsxRuntime.jsx("title", { children: title !== null && title !== void 0 ? title : name }, void 0), jsxRuntime.jsx("use", { href: "".concat(localSource.src, "#").concat(svgId) }, void 0)] }), void 0));
4184
+ return (jsxRuntime.jsxs(StyledSvgWrapper, __assign$1({ "data-testid": testId, fill: fill, height: height, type: "image/svg+xml", width: width }, rest, svgProps, { showTooltipTitle: showTooltipTitle }, { children: [showTooltipTitle && jsxRuntime.jsx("title", { children: title !== null && title !== void 0 ? title : name }, void 0), jsxRuntime.jsx("use", { href: "".concat(localSource.src, "#").concat(svgId) }, void 0)] }), void 0));
4157
4185
  };
4158
4186
  var IconFromExtSource = React__default["default"].memo(UnmemoIconFromExtSource);
4159
4187
 
4160
4188
  /* eslint-disable react/forbid-component-props */
4161
4189
  var UnmemoIcon = function (_a) {
4162
- var height = _a.height, _b = _a.width, width = _b === void 0 ? 1 : _b, title = _a.title, testId = _a.testId, fill = _a.fill, name = _a.name, svgProps = _a.svgProps, rest = __rest(_a, ["height", "width", "title", "testId", "fill", "name", "svgProps"]);
4190
+ var height = _a.height, _b = _a.width, width = _b === void 0 ? 1 : _b, title = _a.title, testId = _a.testId, fill = _a.fill, name = _a.name, svgProps = _a.svgProps, _c = _a.showTooltipTitle, showTooltipTitle = _c === void 0 ? true : _c, rest = __rest(_a, ["height", "width", "title", "testId", "fill", "name", "svgProps", "showTooltipTitle"]);
4163
4191
  var assets = useTheme().assets;
4164
4192
  var newWidth = width && getIconDimension(width);
4165
4193
  var newHeight = height ? getIconDimension(height) : getIconDimension(width);
@@ -4167,9 +4195,9 @@ var UnmemoIcon = function (_a) {
4167
4195
  var svgSplit = name.split('/');
4168
4196
  var svgId = svgSplit[svgSplit.length - 1];
4169
4197
  if (assets.isSameOriginIcons) {
4170
- return (jsxRuntime.jsxs(StyledSvgWrapper, __assign$1({ "data-testid": testId, fill: fill, height: newHeight, type: "image/svg+xml", width: newWidth }, rest, svgProps, { children: [jsxRuntime.jsx("title", { children: title !== null && title !== void 0 ? title : name }, void 0), jsxRuntime.jsx("use", { href: "".concat(iconURL, "#").concat(svgId) }, void 0)] }), void 0));
4198
+ return (jsxRuntime.jsxs(StyledSvgWrapper, __assign$1({ "data-testid": testId, fill: fill, height: newHeight, type: "image/svg+xml", width: newWidth }, rest, svgProps, { showTooltipTitle: showTooltipTitle }, { children: [showTooltipTitle && jsxRuntime.jsx("title", { children: title !== null && title !== void 0 ? title : name }, void 0), jsxRuntime.jsx("use", { href: "".concat(iconURL, "#").concat(svgId) }, void 0)] }), void 0));
4171
4199
  }
4172
- return (jsxRuntime.jsx(IconFromExtSource, __assign$1({ svgId: svgId, iconURL: iconURL, testId: testId, fill: fill, height: newHeight, svgProps: svgProps, width: newWidth, name: name, title: title }, rest), void 0));
4200
+ return (jsxRuntime.jsx(IconFromExtSource, __assign$1({ svgId: svgId, iconURL: iconURL, testId: testId, fill: fill, height: newHeight, svgProps: svgProps, width: newWidth, name: name, title: title, showTooltipTitle: showTooltipTitle }, rest), void 0));
4173
4201
  };
4174
4202
  var Icon$1 = React__default["default"].memo(UnmemoIcon, function (prevProps, nextProps) { return prevProps.name !== nextProps.name; });
4175
4203