@trafilea/afrodita-components 6.28.13 → 6.28.14
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/build/index.d.ts +4 -0
- package/build/index.esm.js +16 -14
- package/build/index.esm.js.map +1 -1
- package/build/index.js +16 -14
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -4804,7 +4804,7 @@ var TAGS = {
|
|
|
4804
4804
|
display2: newStyled.h2(templateObject_5$F || (templateObject_5$F = __makeTemplateObject([""], [""]))),
|
|
4805
4805
|
display3: newStyled.h3(templateObject_6$A || (templateObject_6$A = __makeTemplateObject([""], [""]))),
|
|
4806
4806
|
heading1: newStyled.h1(templateObject_7$q || (templateObject_7$q = __makeTemplateObject([""], [""]))),
|
|
4807
|
-
heading2: newStyled.h2(templateObject_8$
|
|
4807
|
+
heading2: newStyled.h2(templateObject_8$l || (templateObject_8$l = __makeTemplateObject([""], [""]))),
|
|
4808
4808
|
heading3: newStyled.h3(templateObject_9$b || (templateObject_9$b = __makeTemplateObject([""], [""]))),
|
|
4809
4809
|
heading4: newStyled.h4(templateObject_10$a || (templateObject_10$a = __makeTemplateObject([""], [""]))),
|
|
4810
4810
|
heading5: newStyled.h5(templateObject_11$7 || (templateObject_11$7 = __makeTemplateObject([""], [""]))),
|
|
@@ -4933,7 +4933,7 @@ var DEFAULTS = {
|
|
|
4933
4933
|
size: 'regular',
|
|
4934
4934
|
},
|
|
4935
4935
|
};
|
|
4936
|
-
var templateObject_1$1$, templateObject_2$1o, templateObject_3$16, templateObject_4$U, templateObject_5$F, templateObject_6$A, templateObject_7$q, templateObject_8$
|
|
4936
|
+
var templateObject_1$1$, templateObject_2$1o, templateObject_3$16, templateObject_4$U, templateObject_5$F, templateObject_6$A, templateObject_7$q, templateObject_8$l, templateObject_9$b, templateObject_10$a, templateObject_11$7, templateObject_12$4, templateObject_13$4, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2, templateObject_18$2, templateObject_19$2, templateObject_20$1;
|
|
4937
4937
|
|
|
4938
4938
|
var Container$1f = newStyled.div(templateObject_1$1_ || (templateObject_1$1_ = __makeTemplateObject(["\n position: relative;\n display: flex;\n border-radius: 6px;\n gap: 6px;\n"], ["\n position: relative;\n display: flex;\n border-radius: 6px;\n gap: 6px;\n"])));
|
|
4939
4939
|
var Card$4 = newStyled.div(templateObject_2$1n || (templateObject_2$1n = __makeTemplateObject(["\n --background: var(--colors-background-color);\n\n flex: 1;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n border: 2px solid var(--component-packSelector-borderColor);\n padding: 16px 7px 7px;\n text-align: center;\n background-color: var(--background);\n border-radius: var(--component-packSelector-borderRadius);\n\n &[aria-checked='true'] {\n --color: var(--component-packSelector-selectedColor);\n\n border-color: var(--color);\n\n & * {\n p {\n color: var(--color);\n }\n }\n }\n"], ["\n --background: var(--colors-background-color);\n\n flex: 1;\n position: relative;\n overflow: hidden;\n cursor: pointer;\n border: 2px solid var(--component-packSelector-borderColor);\n padding: 16px 7px 7px;\n text-align: center;\n background-color: var(--background);\n border-radius: var(--component-packSelector-borderRadius);\n\n &[aria-checked='true'] {\n --color: var(--component-packSelector-selectedColor);\n\n border-color: var(--color);\n\n & * {\n p {\n color: var(--color);\n }\n }\n }\n"])));
|
|
@@ -5943,11 +5943,11 @@ var Title$a = newStyled.h1(templateObject_6$y || (templateObject_6$y = __makeTem
|
|
|
5943
5943
|
return color;
|
|
5944
5944
|
});
|
|
5945
5945
|
var IconContainer$5 = newStyled.div(templateObject_7$p || (templateObject_7$p = __makeTemplateObject(["\n width: 1.375rem;\n height: 1.125rem;\n margin-right: 0.563rem;\n"], ["\n width: 1.375rem;\n height: 1.125rem;\n margin-right: 0.563rem;\n"])));
|
|
5946
|
-
var CloseToolTip = newStyled.button(templateObject_8$
|
|
5946
|
+
var CloseToolTip = newStyled.button(templateObject_8$k || (templateObject_8$k = __makeTemplateObject(["\n position: absolute;\n background: none;\n border: none;\n cursor: pointer;\n right: ", ";\n top: 0.25rem;\n padding: 0px;\n z-index: 2;\n"], ["\n position: absolute;\n background: none;\n border: none;\n cursor: pointer;\n right: ", ";\n top: 0.25rem;\n padding: 0px;\n z-index: 2;\n"])), function (_a) {
|
|
5947
5947
|
var _b = _a.right, right = _b === void 0 ? '.3rem' : _b;
|
|
5948
5948
|
return right;
|
|
5949
5949
|
});
|
|
5950
|
-
var templateObject_1$1N, templateObject_2$1e, templateObject_3$10, templateObject_4$Q, templateObject_5$C, templateObject_6$y, templateObject_7$p, templateObject_8$
|
|
5950
|
+
var templateObject_1$1N, templateObject_2$1e, templateObject_3$10, templateObject_4$Q, templateObject_5$C, templateObject_6$y, templateObject_7$p, templateObject_8$k;
|
|
5951
5951
|
|
|
5952
5952
|
var Tooltip = function (_a) {
|
|
5953
5953
|
var _b;
|
|
@@ -6019,7 +6019,7 @@ var SubscriptionHeader$2 = newStyled.div(templateObject_5$B || (templateObject_5
|
|
|
6019
6019
|
});
|
|
6020
6020
|
var BenefitsContainer$2 = newStyled.div(templateObject_6$x || (templateObject_6$x = __makeTemplateObject(["\n margin-bottom: 5px;\n"], ["\n margin-bottom: 5px;\n"])));
|
|
6021
6021
|
var Benefit$2 = newStyled.div(templateObject_7$o || (templateObject_7$o = __makeTemplateObject(["\n display: flex;\n padding: 8px 0px;\n svg {\n overflow: visible;\n }\n"], ["\n display: flex;\n padding: 8px 0px;\n svg {\n overflow: visible;\n }\n"])));
|
|
6022
|
-
var BenefitText$2 = newStyled(Text$7)(templateObject_8$
|
|
6022
|
+
var BenefitText$2 = newStyled(Text$7)(templateObject_8$j || (templateObject_8$j = __makeTemplateObject(["\n line-height: 20px;\n margin-left: 9px;\n"], ["\n line-height: 20px;\n margin-left: 9px;\n"])));
|
|
6023
6023
|
var SubscriptionDetails = newStyled(Text$7)(templateObject_9$a || (templateObject_9$a = __makeTemplateObject(["\n font-size: 16px;\n margin-right: 7px;\n"], ["\n font-size: 16px;\n margin-right: 7px;\n"])));
|
|
6024
6024
|
var SubscriptionDetailsContainer = newStyled.div(templateObject_10$9 || (templateObject_10$9 = __makeTemplateObject(["\n margin-top: 18px;\n display: flex;\n"], ["\n margin-top: 18px;\n display: flex;\n"])));
|
|
6025
6025
|
var DeliveryFrequencyLabel$1 = newStyled(Text$7)(templateObject_11$6 || (templateObject_11$6 = __makeTemplateObject(["\n line-height: 35px;\n margin-right: 8px;\n align-self: center;\n"], ["\n line-height: 35px;\n margin-right: 8px;\n align-self: center;\n"])));
|
|
@@ -6028,7 +6028,7 @@ var StyledPrice$2 = newStyled(PriceLabelV2$1)(templateObject_12$3 || (templateOb
|
|
|
6028
6028
|
return selected ? theme.colors.shades[700].color : theme.colors.shades[200].color;
|
|
6029
6029
|
});
|
|
6030
6030
|
var Container$17 = newStyled.div(templateObject_13$3 || (templateObject_13$3 = __makeTemplateObject([""], [""])));
|
|
6031
|
-
var templateObject_1$1M, templateObject_2$1d, templateObject_3$$, templateObject_4$P, templateObject_5$B, templateObject_6$x, templateObject_7$o, templateObject_8$
|
|
6031
|
+
var templateObject_1$1M, templateObject_2$1d, templateObject_3$$, templateObject_4$P, templateObject_5$B, templateObject_6$x, templateObject_7$o, templateObject_8$j, templateObject_9$a, templateObject_10$9, templateObject_11$6, templateObject_12$3, templateObject_13$3;
|
|
6032
6032
|
|
|
6033
6033
|
var radioIds$2 = {
|
|
6034
6034
|
oneTime: {
|
|
@@ -6129,7 +6129,7 @@ var SubscriptionHeader$1 = newStyled.div(templateObject_6$w || (templateObject_6
|
|
|
6129
6129
|
return theme.colors.pallete.primary.color;
|
|
6130
6130
|
});
|
|
6131
6131
|
var BenefitsContainer$1 = newStyled.div(templateObject_7$n || (templateObject_7$n = __makeTemplateObject(["\n margin-bottom: 5px;\n"], ["\n margin-bottom: 5px;\n"])));
|
|
6132
|
-
var Benefit$1 = newStyled.div(templateObject_8$
|
|
6132
|
+
var Benefit$1 = newStyled.div(templateObject_8$i || (templateObject_8$i = __makeTemplateObject(["\n display: flex;\n padding: 8px 0;\n svg {\n overflow: visible;\n }\n"], ["\n display: flex;\n padding: 8px 0;\n svg {\n overflow: visible;\n }\n"])));
|
|
6133
6133
|
var BenefitText$1 = newStyled(Text$7)(templateObject_9$9 || (templateObject_9$9 = __makeTemplateObject(["\n line-height: 20px;\n margin-left: 9px;\n"], ["\n line-height: 20px;\n margin-left: 9px;\n"])));
|
|
6134
6134
|
var DeliveryFrequencyLabel = newStyled(Text$7)(templateObject_10$8 || (templateObject_10$8 = __makeTemplateObject(["\n line-height: 35px;\n margin-right: 8px;\n align-self: center;\n"], ["\n line-height: 35px;\n margin-right: 8px;\n align-self: center;\n"])));
|
|
6135
6135
|
var StyledPrice$1 = newStyled(PriceLabelV2$1)(templateObject_11$5 || (templateObject_11$5 = __makeTemplateObject(["\n div p {\n color: ", ";\n }\n"], ["\n div p {\n color: ", ";\n }\n"])), function (_a) {
|
|
@@ -6141,7 +6141,7 @@ var TooltipWrapper = newStyled.div(templateObject_13$2 || (templateObject_13$2 =
|
|
|
6141
6141
|
var theme = _a.theme;
|
|
6142
6142
|
return theme.component.autoship.tooltip.margin;
|
|
6143
6143
|
});
|
|
6144
|
-
var templateObject_1$1L, templateObject_2$1c, templateObject_3$_, templateObject_4$O, templateObject_5$A, templateObject_6$w, templateObject_7$n, templateObject_8$
|
|
6144
|
+
var templateObject_1$1L, templateObject_2$1c, templateObject_3$_, templateObject_4$O, templateObject_5$A, templateObject_6$w, templateObject_7$n, templateObject_8$i, templateObject_9$9, templateObject_10$8, templateObject_11$5, templateObject_12$2, templateObject_13$2;
|
|
6145
6145
|
|
|
6146
6146
|
var radioIds$1 = {
|
|
6147
6147
|
oneTime: {
|
|
@@ -6492,13 +6492,13 @@ var ClubMembersText = newStyled.span(templateObject_4$J || (templateObject_4$J =
|
|
|
6492
6492
|
var MobileDollarPart = newStyled(DollarPart)(templateObject_5$y || (templateObject_5$y = __makeTemplateObject(["\n font-size: 10px;\n"], ["\n font-size: 10px;\n"])));
|
|
6493
6493
|
var MobileClubMembersText = newStyled(ClubMembersText)(templateObject_6$u || (templateObject_6$u = __makeTemplateObject(["\n font-size: 10px;\n"], ["\n font-size: 10px;\n"])));
|
|
6494
6494
|
var DesktopDollarPart = newStyled(DollarPart)(templateObject_7$m || (templateObject_7$m = __makeTemplateObject(["\n font-size: 13px;\n"], ["\n font-size: 13px;\n"])));
|
|
6495
|
-
var DesktopClubMembersText = newStyled(ClubMembersText)(templateObject_8$
|
|
6495
|
+
var DesktopClubMembersText = newStyled(ClubMembersText)(templateObject_8$h || (templateObject_8$h = __makeTemplateObject(["\n font-size: 13px;\n"], ["\n font-size: 13px;\n"])));
|
|
6496
6496
|
var ClubPriceLabel = function (_a) {
|
|
6497
6497
|
var clubPrice = _a.clubPrice;
|
|
6498
6498
|
var isMobile = useWindowDimensions().isMobile;
|
|
6499
6499
|
return (jsxRuntime.jsx(jsxRuntime.Fragment, { children: isMobile ? (jsxRuntime.jsxs(MobileContainer, { children: [jsxRuntime.jsx(MobileDollarPart, { children: clubPrice }, void 0), jsxRuntime.jsx(MobileClubMembersText, { children: "FOR CLUB MEMBERS" }, void 0)] }, void 0)) : (jsxRuntime.jsxs(Container$10, { children: [jsxRuntime.jsx(DesktopDollarPart, { children: clubPrice }, void 0), jsxRuntime.jsx(DesktopClubMembersText, { children: "FOR CLUB MEMBERS" }, void 0)] }, void 0)) }, void 0));
|
|
6500
6500
|
};
|
|
6501
|
-
var templateObject_1$1x, templateObject_2$16, templateObject_3$U, templateObject_4$J, templateObject_5$y, templateObject_6$u, templateObject_7$m, templateObject_8$
|
|
6501
|
+
var templateObject_1$1x, templateObject_2$16, templateObject_3$U, templateObject_4$J, templateObject_5$y, templateObject_6$u, templateObject_7$m, templateObject_8$h;
|
|
6502
6502
|
|
|
6503
6503
|
var Spacing = function (_a) {
|
|
6504
6504
|
var size = _a.size, _b = _a.type, type = _b === void 0 ? 'block' : _b, children = _a.children, styleProp = _a.style;
|
|
@@ -6733,6 +6733,9 @@ var BottomTagContainer$8 = newStyled.div(templateObject_6$t || (templateObject_6
|
|
|
6733
6733
|
return style.width;
|
|
6734
6734
|
});
|
|
6735
6735
|
var MarginTopContainer$1 = newStyled.div(templateObject_7$l || (templateObject_7$l = __makeTemplateObject(["\n margin-top: 8px;\n"], ["\n margin-top: 8px;\n"])));
|
|
6736
|
+
var ClubOfferPriceLabelWrapper = newStyled.div(templateObject_8$g || (templateObject_8$g = __makeTemplateObject(["\n margin-top: 2px;\n margin-bottom: 2px;\n"], ["\n margin-top: 2px;\n margin-bottom: 2px;\n"])));
|
|
6737
|
+
var templateObject_1$1q, templateObject_2$13, templateObject_3$R, templateObject_4$G, templateObject_5$w, templateObject_6$t, templateObject_7$l, templateObject_8$g;
|
|
6738
|
+
|
|
6736
6739
|
var ProductItemMobile = function (_a) {
|
|
6737
6740
|
var title = _a.title, image = _a.image, imageHover = _a.imageHover, price = _a.price, rating = _a.rating, size = _a.size, _b = _a.alignName, alignName = _b === void 0 ? 'center' : _b, url = _a.url, className = _a.className, topTag = _a.topTag, bottomTag = _a.bottomTag, onClick = _a.onClick, _c = _a.priceDisplayType, priceDisplayType = _c === void 0 ? 'default' : _c, priceAtBottom = _a.priceAtBottom, priceLoading = _a.priceLoading, _d = _a.noFollow, noFollow = _d === void 0 ? false : _d, _e = _a.colorPicker, colorPicker = _e === void 0 ? {
|
|
6738
6741
|
display: false,
|
|
@@ -6777,7 +6780,7 @@ var ProductItemMobile = function (_a) {
|
|
|
6777
6780
|
: { fontSize: '12px', fontWeight: 700, color: '#C64844' }
|
|
6778
6781
|
: undefined }, void 0));
|
|
6779
6782
|
case 5:
|
|
6780
|
-
return (jsx(ClubPriceMemberLabel, { isClub: true, isPDP: true, finalPrice: (_a = clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.price) === null || _a === void 0 ? void 0 : _a.finalPrice, originalPrice: (_b = clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.price) === null || _b === void 0 ? void 0 : _b.originalPrice, finalPriceStyled: false, color: price.color, size: exports.ComponentSize.Medium, testId: "volume-discount-v4", clubStyle: showClubPriceLabel, icon: clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.clubOfferIcon, isCollections: true }, void 0));
|
|
6783
|
+
return (jsx(ClubOfferPriceLabelWrapper, __assign$1({ style: clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.wrapperStyle }, { children: jsx(ClubPriceMemberLabel, { isClub: true, isPDP: true, finalPrice: (_a = clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.price) === null || _a === void 0 ? void 0 : _a.finalPrice, originalPrice: (_b = clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.price) === null || _b === void 0 ? void 0 : _b.originalPrice, finalPriceStyled: false, color: price.color, size: exports.ComponentSize.Medium, testId: "volume-discount-v4", clubStyle: showClubPriceLabel, icon: clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.clubOfferIcon, isCollections: true }, void 0) }), void 0));
|
|
6781
6784
|
default:
|
|
6782
6785
|
return priceDisplayType === 'styled' ? (jsx(PriceLabelV2$1, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: exports.ComponentSize.Large, testId: "volume-discount" }, void 0)) : (jsx(PriceLabel$1, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: exports.ComponentSize.Medium, testId: "volume-discount", clubStyle: showClubPriceLabel, finalPriceStyle: showClubPriceLabel
|
|
6783
6786
|
? !isMobile
|
|
@@ -6793,11 +6796,10 @@ var ProductItemMobile = function (_a) {
|
|
|
6793
6796
|
return jsx(Fragment, {}, void 0);
|
|
6794
6797
|
return (jsx(Rating, { size: size === exports.ComponentSize.Large ? exports.ComponentSize.Small : exports.ComponentSize.XSmall, rating: rating.rating, reviews: rating.reviews, reviewsText: "", wrapWithParenthesis: true }, void 0));
|
|
6795
6798
|
};
|
|
6796
|
-
return (jsxs(ProdCardContainer$4, __assign$1({ className: className, "data-testid": "product-card-container-div" }, { children: [jsxs(Container$Y, __assign$1({ as: url ? 'a' : 'div', href: url, rel: noFollow ? 'nofollow' : '', className: "picContainer", onClick: onClick }, { children: [!!topTag || !!bottomTag ? (jsxs(ImageContainer$6, __assign$1({ width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height, "data-testid": "tags-image-container" }, { children: [jsx(Image$3, { src: image.src, srcSet: getSrcSet(image.src, 180, 360, 720, 960), alt: image.alt, width: hasDefaultSize ? styles === null || styles === void 0 ? void 0 : styles.width : '100%', height: hasDefaultSize ? styles === null || styles === void 0 ? void 0 : styles.height : '100%', loading: isOnViewport ? 'eager' : 'lazy', decoding: isOnViewport ? 'sync' : 'async' }, void 0), jsx(TopTagContainer$8, __assign$1({ style: { width: colorPicker.display ? '100%' : 'inherit' } }, { children: topTag }), void 0), jsx(BottomTagContainer$8, __assign$1({ style: { width: colorPicker.display ? '100%' : 'inherit' } }, { children: bottomTag }), void 0)] }), void 0)) : (jsx(Image$3, { src: image.src, srcSet: getSrcSet(image.src, 180, 360, 720, 960), alt: image.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height, loading: isOnViewport ? 'eager' : 'lazy', decoding: isOnViewport ? 'sync' : 'async' }, void 0)), imageHover ? (jsx(ImageHoverContainer$3, { className: "hover__image", src: imageHover.src, srcSet: getSrcSet(imageHover.src, 180, 360, 720, 960), loading: "lazy", decoding: "async", alt: imageHover.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height }, void 0)) : null] }), void 0), colorPicker.display && colorPicker.position === 'top' && (jsxs(Fragment, { children: [jsx(Spacing, { size: space }, void 0), colorPicker.component] }, void 0)), jsxs(Container$Y, __assign$1({ as: url ? 'a' : 'div', href: url, rel: noFollow ? 'nofollow' : '', onClick: onClick, className: "textContainer", style: { alignItems: showClubPriceLabel ? 'flex-start' : 'center' } }, { children: [jsx(Spacing, { size: space }, void 0),
|
|
6799
|
+
return (jsxs(ProdCardContainer$4, __assign$1({ className: className, "data-testid": "product-card-container-div" }, { children: [jsxs(Container$Y, __assign$1({ as: url ? 'a' : 'div', href: url, rel: noFollow ? 'nofollow' : '', className: "picContainer", onClick: onClick }, { children: [!!topTag || !!bottomTag ? (jsxs(ImageContainer$6, __assign$1({ width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height, "data-testid": "tags-image-container" }, { children: [jsx(Image$3, { src: image.src, srcSet: getSrcSet(image.src, 180, 360, 720, 960), alt: image.alt, width: hasDefaultSize ? styles === null || styles === void 0 ? void 0 : styles.width : '100%', height: hasDefaultSize ? styles === null || styles === void 0 ? void 0 : styles.height : '100%', loading: isOnViewport ? 'eager' : 'lazy', decoding: isOnViewport ? 'sync' : 'async' }, void 0), jsx(TopTagContainer$8, __assign$1({ style: { width: colorPicker.display ? '100%' : 'inherit' } }, { children: topTag }), void 0), jsx(BottomTagContainer$8, __assign$1({ style: { width: colorPicker.display ? '100%' : 'inherit' } }, { children: bottomTag }), void 0)] }), void 0)) : (jsx(Image$3, { src: image.src, srcSet: getSrcSet(image.src, 180, 360, 720, 960), alt: image.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height, loading: isOnViewport ? 'eager' : 'lazy', decoding: isOnViewport ? 'sync' : 'async' }, void 0)), imageHover ? (jsx(ImageHoverContainer$3, { className: "hover__image", src: imageHover.src, srcSet: getSrcSet(imageHover.src, 180, 360, 720, 960), loading: "lazy", decoding: "async", alt: imageHover.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height }, void 0)) : null] }), void 0), colorPicker.display && colorPicker.position === 'top' && (jsxs(Fragment, { children: [jsx(Spacing, { size: space }, void 0), colorPicker.component] }, void 0)), jsxs(Container$Y, __assign$1({ as: url ? 'a' : 'div', href: url, rel: noFollow ? 'nofollow' : '', onClick: onClick, className: "textContainer", style: { alignItems: showClubPriceLabel ? 'flex-start' : 'center' } }, { children: [jsx(Spacing, { size: space }, void 0), jsx(Title$7, __assign$1({ theme: theme, align: showClubPriceLabel ? 'left' : alignName }, { children: title }), void 0), jsx(Spacing, { size: space }, void 0), hasStrength && hasStrength.strength !== -1 && (jsxs(Fragment, { children: [jsx(StrengthBars, { barsFilled: hasStrength.strength, supportText: hasStrength.description }, void 0), jsx(Spacing, { size: 10 }, void 0)] }, void 0)), priceAtBottom ? (jsxs(Fragment, { children: [jsx(RatingDisplay, {}, void 0), jsx(Spacing, { size: space }, void 0), jsxs(MarginTopContainer$1, __assign$1({ style: { marginTop: (clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.isClubOffer) ? 0 : 8 } }, { children: [priceLoading ? jsx(SkeletonBox, { height: "20px", width: "140px" }, void 0) : PriceLabelDisplay(), (clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.isClubOffer) && PriceLabelDisplay(5)] }), void 0)] }, void 0)) : (jsxs(Fragment, { children: [priceLoading ? (jsx(SkeletonBox, { height: "20px", width: "140px" }, void 0)) : (jsxs(Fragment, { children: [!(clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.isClubMember) && PriceLabelDisplay(), (clubOffer === null || clubOffer === void 0 ? void 0 : clubOffer.isClubOffer) && PriceLabelDisplay(5), jsx(BuyNowPayLater, { displayBNPL: isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.displayBNPL, installments: (isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.installments) || 0, installmentPrice: (isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.installmentPrice) || '', iconFolder: isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.iconFolder, iconName: (isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.iconName) || '', showLogo: isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.showLogo, iconColor: isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.iconColor, fontSize: isBNPL === null || isBNPL === void 0 ? void 0 : isBNPL.fontSize }, void 0)] }, void 0)), showClubPriceLabel && jsx(ClubPriceLabel, { clubPrice: clubPrice }, void 0), discountTagLoading ? (jsx(SkeletonBox, { height: "22px", width: "75px" }, void 0)) : (showDiscountPercentageTag && (jsx(TagContainer, __assign$1({ size: exports.ComponentSize.Small }, { children: discountTag && (jsx(DiscountTag$2, __assign$1({}, discountTag, { size: exports.ComponentSize.Medium, style: {
|
|
6797
6800
|
letterSpacing: '-0.05rem',
|
|
6798
6801
|
} }), void 0)) }), void 0))), jsx(Spacing, { size: space }, void 0), jsx(RatingDisplay, {}, void 0)] }, void 0))] }), void 0), colorPicker.display && colorPicker.position === 'bottom' && (jsxs(Fragment, { children: [jsx(Spacing, { size: space }, void 0), colorPicker.component] }, void 0))] }), void 0));
|
|
6799
|
-
};
|
|
6800
|
-
var templateObject_1$1q, templateObject_2$13, templateObject_3$R, templateObject_4$G, templateObject_5$w, templateObject_6$t, templateObject_7$l;
|
|
6802
|
+
};
|
|
6801
6803
|
|
|
6802
6804
|
var ImageContainer$5 = newStyled.div(function (_a) {
|
|
6803
6805
|
var width = _a.width, height = _a.height;
|