@trafilea/afrodita-components 6.51.1 → 6.51.3
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 +1 -0
- package/build/index.esm.js +26 -25
- package/build/index.esm.js.map +1 -1
- package/build/index.js +26 -25
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.d.ts
CHANGED
|
@@ -4075,6 +4075,7 @@ declare type JoinClubProps = {
|
|
|
4075
4075
|
buttonText?: string | JSX.Element;
|
|
4076
4076
|
buttonStyle?: React.CSSProperties;
|
|
4077
4077
|
termsText?: string | JSX.Element;
|
|
4078
|
+
toggleColor?: React.CSSProperties['color'];
|
|
4078
4079
|
};
|
|
4079
4080
|
|
|
4080
4081
|
declare const JoinClubCard: React.FC<JoinClubProps>;
|
package/build/index.esm.js
CHANGED
|
@@ -4880,7 +4880,7 @@ var TAGS = {
|
|
|
4880
4880
|
display3: newStyled.h3(templateObject_6$J || (templateObject_6$J = __makeTemplateObject([""], [""]))),
|
|
4881
4881
|
heading1: newStyled.h1(templateObject_7$A || (templateObject_7$A = __makeTemplateObject([""], [""]))),
|
|
4882
4882
|
heading2: newStyled.h2(templateObject_8$t || (templateObject_8$t = __makeTemplateObject([""], [""]))),
|
|
4883
|
-
heading3: newStyled.h3(templateObject_9$
|
|
4883
|
+
heading3: newStyled.h3(templateObject_9$g || (templateObject_9$g = __makeTemplateObject([""], [""]))),
|
|
4884
4884
|
heading4: newStyled.h4(templateObject_10$e || (templateObject_10$e = __makeTemplateObject([""], [""]))),
|
|
4885
4885
|
heading5: newStyled.h5(templateObject_11$a || (templateObject_11$a = __makeTemplateObject([""], [""]))),
|
|
4886
4886
|
heading6: newStyled.h6(templateObject_12$7 || (templateObject_12$7 = __makeTemplateObject([""], [""]))),
|
|
@@ -5012,7 +5012,7 @@ var DEFAULTS = {
|
|
|
5012
5012
|
size: 'regular',
|
|
5013
5013
|
},
|
|
5014
5014
|
};
|
|
5015
|
-
var templateObject_1$2k, templateObject_2$1J, templateObject_3$1m, templateObject_4$15, templateObject_5$R, templateObject_6$J, templateObject_7$A, templateObject_8$t, templateObject_9$
|
|
5015
|
+
var templateObject_1$2k, templateObject_2$1J, templateObject_3$1m, templateObject_4$15, templateObject_5$R, templateObject_6$J, templateObject_7$A, templateObject_8$t, templateObject_9$g, templateObject_10$e, templateObject_11$a, templateObject_12$7, templateObject_13$6, templateObject_14$3, templateObject_15$2, templateObject_16$2, templateObject_17$2, templateObject_18$2, templateObject_19$2, templateObject_20$1;
|
|
5016
5016
|
|
|
5017
5017
|
var Container$1s = newStyled.div(templateObject_1$2j || (templateObject_1$2j = __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"])));
|
|
5018
5018
|
var Card$4 = newStyled.div(templateObject_2$1I || (templateObject_2$1I = __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"])));
|
|
@@ -6200,7 +6200,7 @@ var SubscriptionHeader$5 = newStyled.div(templateObject_5$N || (templateObject_5
|
|
|
6200
6200
|
var BenefitsContainer$4 = newStyled.div(templateObject_6$G || (templateObject_6$G = __makeTemplateObject(["\n margin-bottom: 5px;\n"], ["\n margin-bottom: 5px;\n"])));
|
|
6201
6201
|
var Benefit$4 = newStyled.div(templateObject_7$y || (templateObject_7$y = __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"])));
|
|
6202
6202
|
var BenefitText$4 = newStyled(Text$7)(templateObject_8$r || (templateObject_8$r = __makeTemplateObject(["\n line-height: 20px;\n margin-left: 9px;\n"], ["\n line-height: 20px;\n margin-left: 9px;\n"])));
|
|
6203
|
-
var SubscriptionDetails = newStyled(Text$7)(templateObject_9$
|
|
6203
|
+
var SubscriptionDetails = newStyled(Text$7)(templateObject_9$f || (templateObject_9$f = __makeTemplateObject(["\n font-size: 16px;\n margin-right: 7px;\n"], ["\n font-size: 16px;\n margin-right: 7px;\n"])));
|
|
6204
6204
|
var SubscriptionDetailsContainer = newStyled.div(templateObject_10$d || (templateObject_10$d = __makeTemplateObject(["\n margin-top: 18px;\n display: flex;\n"], ["\n margin-top: 18px;\n display: flex;\n"])));
|
|
6205
6205
|
var DeliveryFrequencyLabel$1 = newStyled(Text$7)(templateObject_11$9 || (templateObject_11$9 = __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"])));
|
|
6206
6206
|
var StyledPrice$4 = newStyled(PriceLabelV2$1)(templateObject_12$6 || (templateObject_12$6 = __makeTemplateObject(["\n div p {\n color: ", ";\n }\n"], ["\n div p {\n color: ", ";\n }\n"])), function (_a) {
|
|
@@ -6208,7 +6208,7 @@ var StyledPrice$4 = newStyled(PriceLabelV2$1)(templateObject_12$6 || (templateOb
|
|
|
6208
6208
|
return selected ? theme.colors.shades[700].color : theme.colors.shades[200].color;
|
|
6209
6209
|
});
|
|
6210
6210
|
var Container$1k = newStyled.div(templateObject_13$5 || (templateObject_13$5 = __makeTemplateObject([""], [""])));
|
|
6211
|
-
var templateObject_1$25, templateObject_2$1y, templateObject_3$1f, templateObject_4$10, templateObject_5$N, templateObject_6$G, templateObject_7$y, templateObject_8$r, templateObject_9$
|
|
6211
|
+
var templateObject_1$25, templateObject_2$1y, templateObject_3$1f, templateObject_4$10, templateObject_5$N, templateObject_6$G, templateObject_7$y, templateObject_8$r, templateObject_9$f, templateObject_10$d, templateObject_11$9, templateObject_12$6, templateObject_13$5;
|
|
6212
6212
|
|
|
6213
6213
|
var radioIds$3 = {
|
|
6214
6214
|
oneTime: {
|
|
@@ -6310,7 +6310,7 @@ var SubscriptionHeader$4 = newStyled.div(templateObject_6$F || (templateObject_6
|
|
|
6310
6310
|
});
|
|
6311
6311
|
var BenefitsContainer$3 = newStyled.div(templateObject_7$x || (templateObject_7$x = __makeTemplateObject(["\n margin-bottom: 5px;\n"], ["\n margin-bottom: 5px;\n"])));
|
|
6312
6312
|
var Benefit$3 = newStyled.div(templateObject_8$q || (templateObject_8$q = __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"])));
|
|
6313
|
-
var BenefitText$3 = newStyled(Text$7)(templateObject_9$
|
|
6313
|
+
var BenefitText$3 = newStyled(Text$7)(templateObject_9$e || (templateObject_9$e = __makeTemplateObject(["\n line-height: 20px;\n margin-left: 9px;\n"], ["\n line-height: 20px;\n margin-left: 9px;\n"])));
|
|
6314
6314
|
var DeliveryFrequencyLabel = newStyled(Text$7)(templateObject_10$c || (templateObject_10$c = __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"])));
|
|
6315
6315
|
var StyledPrice$3 = newStyled(PriceLabelV2$1)(templateObject_11$8 || (templateObject_11$8 = __makeTemplateObject(["\n div p {\n color: ", ";\n }\n"], ["\n div p {\n color: ", ";\n }\n"])), function (_a) {
|
|
6316
6316
|
var selected = _a.selected, theme = _a.theme;
|
|
@@ -6321,7 +6321,7 @@ var TooltipWrapper$1 = newStyled.div(templateObject_13$4 || (templateObject_13$4
|
|
|
6321
6321
|
var theme = _a.theme;
|
|
6322
6322
|
return theme.component.autoship.tooltip.margin;
|
|
6323
6323
|
});
|
|
6324
|
-
var templateObject_1$24, templateObject_2$1x, templateObject_3$1e, templateObject_4$$, templateObject_5$M, templateObject_6$F, templateObject_7$x, templateObject_8$q, templateObject_9$
|
|
6324
|
+
var templateObject_1$24, templateObject_2$1x, templateObject_3$1e, templateObject_4$$, templateObject_5$M, templateObject_6$F, templateObject_7$x, templateObject_8$q, templateObject_9$e, templateObject_10$c, templateObject_11$8, templateObject_12$5, templateObject_13$4;
|
|
6325
6325
|
|
|
6326
6326
|
var radioIds$2 = {
|
|
6327
6327
|
oneTime: {
|
|
@@ -8188,9 +8188,9 @@ var H4 = newStyled.h4(templateObject_5$z || (templateObject_5$z = __makeTemplate
|
|
|
8188
8188
|
var FilterLink = newStyled.a(templateObject_6$v || (templateObject_6$v = __makeTemplateObject(["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n text-decoration: none;\n"], ["\n font-size: 1rem;\n font-weight: 700;\n line-height: 1.5rem;\n color: ", ";\n text-decoration: none;\n"])), function (props) { return props.color; });
|
|
8189
8189
|
var OptionContainer = newStyled.div(templateObject_7$s || (templateObject_7$s = __makeTemplateObject(["\n margin-bottom: 1.25rem;\n &:last-child {\n margin-bottom: 0;\n }\n @media (max-width: 768px) {\n display: ", ";\n }\n @media (min-width: 768px) and (max-width: 992px) {\n display: ", ";\n }\n"], ["\n margin-bottom: 1.25rem;\n &:last-child {\n margin-bottom: 0;\n }\n @media (max-width: 768px) {\n display: ", ";\n }\n @media (min-width: 768px) and (max-width: 992px) {\n display: ", ";\n }\n"])), function (props) { return (props.showInMobile ? 'block' : 'none'); }, function (props) { return (props.showInTablet ? 'block' : 'none'); });
|
|
8190
8190
|
var ClearAll = newStyled.span(templateObject_8$l || (templateObject_8$l = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n"], ["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n"])), function (props) { return props.color; });
|
|
8191
|
-
var MobileFooter = newStyled.div(templateObject_9$
|
|
8191
|
+
var MobileFooter = newStyled.div(templateObject_9$d || (templateObject_9$d = __makeTemplateObject(["\n background-color: #fff;\n padding: 0.75rem 0.938rem;\n position: sticky;\n bottom: 0;\n z-index: 1;\n margin-top: 5.625rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n"], ["\n background-color: #fff;\n padding: 0.75rem 0.938rem;\n position: sticky;\n bottom: 0;\n z-index: 1;\n margin-top: 5.625rem;\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
8192
8192
|
var MobileClearContainer = newStyled.div(templateObject_10$b || (templateObject_10$b = __makeTemplateObject(["\n display: flex;\n align-items: center;\n cursor: pointer;\n\n span {\n margin-left: 0.5rem;\n user-select: none;\n }\n"], ["\n display: flex;\n align-items: center;\n cursor: pointer;\n\n span {\n margin-left: 0.5rem;\n user-select: none;\n }\n"])));
|
|
8193
|
-
var templateObject_1$1m, templateObject_2$12, templateObject_3$U, templateObject_4$H, templateObject_5$z, templateObject_6$v, templateObject_7$s, templateObject_8$l, templateObject_9$
|
|
8193
|
+
var templateObject_1$1m, templateObject_2$12, templateObject_3$U, templateObject_4$H, templateObject_5$z, templateObject_6$v, templateObject_7$s, templateObject_8$l, templateObject_9$d, templateObject_10$b;
|
|
8194
8194
|
|
|
8195
8195
|
var getStylesBySize$9 = function (size, theme) {
|
|
8196
8196
|
switch (size) {
|
|
@@ -19360,7 +19360,7 @@ var DateText$1 = newStyled.span(templateObject_5$s || (templateObject_5$s = __ma
|
|
|
19360
19360
|
var ReviewerName$1 = newStyled.h1(templateObject_6$o || (templateObject_6$o = __makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"], ["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"])));
|
|
19361
19361
|
var VerifiedText = newStyled.h1(templateObject_7$m || (templateObject_7$m = __makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"], ["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"])));
|
|
19362
19362
|
var ReviewTitle$1 = newStyled.h2(templateObject_8$h || (templateObject_8$h = __makeTemplateObject(["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"], ["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"])));
|
|
19363
|
-
var ReviewDescription = newStyled.div(templateObject_9$
|
|
19363
|
+
var ReviewDescription = newStyled.div(templateObject_9$c || (templateObject_9$c = __makeTemplateObject(["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"], ["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"])));
|
|
19364
19364
|
var ImageContainer$2 = newStyled.div(templateObject_10$a || (templateObject_10$a = __makeTemplateObject(["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n padding: 20px;\n }\n"], ["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n padding: 20px;\n }\n"])));
|
|
19365
19365
|
var ImageWrapper$3 = newStyled(Image$3)(templateObject_11$7 || (templateObject_11$7 = __makeTemplateObject(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n"], ["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n"])));
|
|
19366
19366
|
var VideoWrapper = newStyled.video(templateObject_12$4 || (templateObject_12$4 = __makeTemplateObject(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n"], ["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n"])));
|
|
@@ -19393,7 +19393,7 @@ var Review$1 = function (_a) {
|
|
|
19393
19393
|
return (jsx$1(Modal, __assign$1({ id: modalId, maxFullScreen: maxFullScreen, padding: "0" }, { children: jsxs$1(Container$G, { children: [jsx$1(CloseButton, __assign$1({ onClick: close }, { children: "X" }), void 0), jsx$1(ImageContainer$2, { children: image &&
|
|
19394
19394
|
(!isVideo ? (jsx$1(ImageWrapper$3, { src: image.src, alt: image.alt }, void 0)) : (jsx$1(VideoWrapper, { ref: refVideo, src: image.src, width: "100%", controls: true }, void 0))) }, void 0), jsxs$1(DescriptionContainer, { children: [opened && (jsxs$1(ReviewerName$1, { children: [reviewerName, verified && jsx$1(VerifiedText, { children: "Verified Buyer" }, void 0)] }, void 0)), jsxs$1(Content$1, __assign$1({ "data-testid": "review-detail-content" }, { children: [jsxs$1(StarsContent, { children: [jsx$1(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsx$1(DateText$1, { children: formatDate(date) }, void 0)] }, void 0), jsxs$1(ReviewContainer$1, { children: [jsx$1(ReviewTitle$1, { children: title }, void 0), jsx$1(ReviewDescription, { dangerouslySetInnerHTML: { __html: description } }, void 0)] }, void 0), jsxs$1(HelpfulContainer, { children: [jsxs$1(HelpfulAction, __assign$1({ "data-testid": "helpful-action", onClick: function () { return (helpfulAction ? helpfulAction(reviewId) : undefined); } }, { children: [jsx$1(Icon.Custom.ThumbsUp, { width: 1, height: 1, fill: "#000" }, void 0), jsx$1(HelpfulCount, { children: helpfulCount }, void 0)] }), void 0), jsxs$1(NotHelpfulAction, __assign$1({ "data-testid": "not-helpful-action", onClick: function () { return (notHelpfulAction ? notHelpfulAction(reviewId) : undefined); } }, { children: [jsx$1(Icon.Custom.ThumbsDown, { width: 1, height: 1, fill: "#000" }, void 0), jsx$1(NotHelpfulCount, { children: notHelpfulCount }, void 0)] }), void 0)] }, void 0)] }), void 0), productImage && productLink && (jsxs$1(ProductContainer, __assign$1({ onClick: function () { return (window.location.href = productLink); } }, { children: [jsx$1(ProductImageWrapper, { children: jsx$1(ProductImage, { src: productImage, alt: "productImage" }, void 0) }, void 0), jsx$1(ProductTitle, { children: productTitle }, void 0)] }), void 0))] }, void 0)] }, void 0) }), void 0));
|
|
19395
19395
|
};
|
|
19396
|
-
var templateObject_1$W, templateObject_2$J, templateObject_3$G, templateObject_4$y, templateObject_5$s, templateObject_6$o, templateObject_7$m, templateObject_8$h, templateObject_9$
|
|
19396
|
+
var templateObject_1$W, templateObject_2$J, templateObject_3$G, templateObject_4$y, templateObject_5$s, templateObject_6$o, templateObject_7$m, templateObject_8$h, templateObject_9$c, templateObject_10$a, templateObject_11$7, templateObject_12$4, templateObject_13$3, templateObject_14$2, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19$1, templateObject_20, templateObject_21, templateObject_22, templateObject_23;
|
|
19397
19397
|
|
|
19398
19398
|
var REVIEWS_DESCRIPTION_MAX_LENGTH_DESKTOP = 500;
|
|
19399
19399
|
var REVIEWS_DESCRIPTION_MAX_LENGTH_MOBILE = 168;
|
|
@@ -19405,7 +19405,7 @@ var DateText = newStyled.span(templateObject_5$r || (templateObject_5$r = __make
|
|
|
19405
19405
|
var VariantText = newStyled.div(templateObject_6$n || (templateObject_6$n = __makeTemplateObject(["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"], ["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"])));
|
|
19406
19406
|
var ReviewerName = newStyled.h2(templateObject_7$l || (templateObject_7$l = __makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 14px;\n line-height: 22px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n line-height: 28px;\n }\n"], ["\n font-weight: 600;\n margin: 0;\n font-size: 14px;\n line-height: 22px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n line-height: 28px;\n }\n"])));
|
|
19407
19407
|
var ReviewTitle = newStyled.h3(templateObject_8$g || (templateObject_8$g = __makeTemplateObject(["\n font-size: 14px;\n line-height: 22px;\n margin: 10px 0 8px;\n font-weight: 600;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"], ["\n font-size: 14px;\n line-height: 22px;\n margin: 10px 0 8px;\n font-weight: 600;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"])));
|
|
19408
|
-
var ReviewDescriptionDesktop = newStyled.div(templateObject_9$
|
|
19408
|
+
var ReviewDescriptionDesktop = newStyled.div(templateObject_9$b || (templateObject_9$b = __makeTemplateObject(["\n display: none;\n\n @media (min-width: 768px) {\n display: block;\n font-weight: normal;\n font-size: 16px;\n line-height: 24px;\n margin: 0;\n white-space: pre-wrap;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n }\n"], ["\n display: none;\n\n @media (min-width: 768px) {\n display: block;\n font-weight: normal;\n font-size: 16px;\n line-height: 24px;\n margin: 0;\n white-space: pre-wrap;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n }\n"])));
|
|
19409
19409
|
var ReviewDescriptionMobile = newStyled.div(templateObject_10$9 || (templateObject_10$9 = __makeTemplateObject(["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n display: none;\n }\n"], ["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n display: none;\n }\n"])));
|
|
19410
19410
|
var ImagesContainer = newStyled.div(templateObject_11$6 || (templateObject_11$6 = __makeTemplateObject(["\n margin-left: 10px;\n text-align: right;\n"], ["\n margin-left: 10px;\n text-align: right;\n"])));
|
|
19411
19411
|
var Images = newStyled.div(templateObject_12$3 || (templateObject_12$3 = __makeTemplateObject(["\n display: flex;\n justify-content: end;\n"], ["\n display: flex;\n justify-content: end;\n"])));
|
|
@@ -19449,7 +19449,7 @@ var Review = function (_a) {
|
|
|
19449
19449
|
: description,
|
|
19450
19450
|
} }, void 0), jsxs$1(HelpfulContainerDesktop, __assign$1({ showMoreDesktop: description.length > REVIEWS_DESCRIPTION_MAX_LENGTH_DESKTOP }, { children: [helpfulActionText && helpfulAction && (jsx$1(ButtonSecondaryWrapper, { onClick: function () { return helpfulAction(reviewId); }, text: helpfulActionText, size: ComponentSize.Small }, void 0)), (helpfulCount || (hasTextWhenHelpfulCount0 && helpfulCount === 0)) && (jsxs$1(HelpfulText, { children: [helpfulCount, " people found this helpful"] }, void 0))] }), void 0)] }, void 0), jsxs$1(ImagesContainer, { children: [jsxs$1(Images, { children: [images === null || images === void 0 ? void 0 : images.map(function (image) { return (jsx$1(ImageWrapper$2, __assign$1({ onClick: function () { return onClickImage && onClickImage(image.src); } }, { children: jsx$1(Image$3, { src: image.src, alt: image.alt, height: "10rem", width: "7.5rem" }, void 0) }), image.src)); }), !images || (images.length === 0 && jsx$1(ImageSpace, {}, void 0))] }, void 0), jsx$1(VariantText, { children: reviewVariant }, void 0)] }, void 0)] }), void 0), jsx$1(HelpfulTexti, {}, void 0), jsxs$1(HelpfulContainerMobile, { children: [helpfulActionText && helpfulAction && (jsx$1(ButtonSecondaryWrapper, { onClick: function () { return helpfulAction(reviewId); }, text: helpfulActionText, size: ComponentSize.Small }, void 0)), (helpfulCount || (hasTextWhenHelpfulCount0 && helpfulCount === 0)) && (jsxs$1(HelpfulText, { children: [helpfulCount, " people found this helpful"] }, void 0))] }, void 0)] }, void 0));
|
|
19451
19451
|
};
|
|
19452
|
-
var templateObject_1$V, templateObject_2$I, templateObject_3$F, templateObject_4$x, templateObject_5$r, templateObject_6$n, templateObject_7$l, templateObject_8$g, templateObject_9$
|
|
19452
|
+
var templateObject_1$V, templateObject_2$I, templateObject_3$F, templateObject_4$x, templateObject_5$r, templateObject_6$n, templateObject_7$l, templateObject_8$g, templateObject_9$b, templateObject_10$9, templateObject_11$6, templateObject_12$3, templateObject_13$2, templateObject_14$1, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19;
|
|
19453
19453
|
|
|
19454
19454
|
var Container$E = newStyled.div(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"])));
|
|
19455
19455
|
var ReviewsContainer = newStyled.div(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"], ["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"])));
|
|
@@ -19722,9 +19722,9 @@ var TopLabel$1 = newStyled(Label$2)(templateObject_5$o || (templateObject_5$o =
|
|
|
19722
19722
|
var LeftLabel$1 = newStyled(Label$2)(templateObject_6$l || (templateObject_6$l = __makeTemplateObject(["\n width: 20px;\n transform: rotate(270deg);\n"], ["\n width: 20px;\n transform: rotate(270deg);\n"])));
|
|
19723
19723
|
var Container$w = newStyled('div')(templateObject_7$j || (templateObject_7$j = __makeTemplateObject(["\n gap: 5px;\n display: flex;\n width: fit-content;\n align-items: center;\n"], ["\n gap: 5px;\n display: flex;\n width: fit-content;\n align-items: center;\n"])));
|
|
19724
19724
|
var LabelText$1 = newStyled('span')(templateObject_8$f || (templateObject_8$f = __makeTemplateObject(["\n display: flex;\n min-width: 70px;\n justify-content: center;\n"], ["\n display: flex;\n min-width: 70px;\n justify-content: center;\n"])));
|
|
19725
|
-
var Column$2 = newStyled('div')(templateObject_9$
|
|
19725
|
+
var Column$2 = newStyled('div')(templateObject_9$a || (templateObject_9$a = __makeTemplateObject(["\n display: flex;\n min-width: 675px;\n align-items: center;\n flex-direction: column;\n\n @media (max-width: 768px) {\n min-width: 100%;\n }\n"], ["\n display: flex;\n min-width: 675px;\n align-items: center;\n flex-direction: column;\n\n @media (max-width: 768px) {\n min-width: 100%;\n }\n"])));
|
|
19726
19726
|
var TableRow$3 = newStyled.tr(templateObject_10$8 || (templateObject_10$8 = __makeTemplateObject(["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"], ["\n &:last-child {\n td {\n border-bottom: none;\n }\n }\n\n &.background {\n background-color: ", ";\n }\n"])), function (props) { return props.backgroundColor; });
|
|
19727
|
-
var templateObject_1$M, templateObject_2$C, templateObject_3$A, templateObject_4$u, templateObject_5$o, templateObject_6$l, templateObject_7$j, templateObject_8$f, templateObject_9$
|
|
19727
|
+
var templateObject_1$M, templateObject_2$C, templateObject_3$A, templateObject_4$u, templateObject_5$o, templateObject_6$l, templateObject_7$j, templateObject_8$f, templateObject_9$a, templateObject_10$8;
|
|
19728
19728
|
|
|
19729
19729
|
var getIsOdd$2 = function (number) { return number % 2 !== 0; };
|
|
19730
19730
|
var getCellColor$2 = function (index, cell) {
|
|
@@ -20207,7 +20207,7 @@ var CheckpointStatusMessage = newStyled.span(templateObject_7$h || (templateObje
|
|
|
20207
20207
|
var ActiveCheckpointTrack$1 = newStyled.div(templateObject_8$d || (templateObject_8$d = __makeTemplateObject(["\n width: 13px;\n min-width: 13px;\n background-color: ", ";\n transform: ", ";\n position: relative;\n border-radius: ", ";\n margin-top: -1px;\n padding-bottom: ", ";\n margin-bottom: ", ";\n"], ["\n width: 13px;\n min-width: 13px;\n background-color: ", ";\n transform: ", ";\n position: relative;\n border-radius: ", ";\n margin-top: -1px;\n padding-bottom: ", ";\n margin-bottom: ", ";\n"])), function (props) { return props.trackColor; }, function (props) { return (props.firstElement ? 'translate(0, 22px)' : 'translate(0, 33px)'); }, function (props) {
|
|
20208
20208
|
return props.firstElement ? '8px 8px 0 0' : props.lastElement ? '0 0 8px 8px' : '';
|
|
20209
20209
|
}, function (props) { return (props.firstElement ? '20px' : '0'); }, function (props) { return (props.firstElement ? '-20px' : '0'); });
|
|
20210
|
-
var ActiveCheckpointDot$1 = newStyled.div(templateObject_9$
|
|
20210
|
+
var ActiveCheckpointDot$1 = newStyled.div(templateObject_9$9 || (templateObject_9$9 = __makeTemplateObject(["\n &:after {\n content: ' ';\n position: absolute;\n width: 13px;\n height: 13px;\n background-color: #e5e5e5;\n z-index: 2;\n border-radius: 50%;\n transform: ", ";\n left: 0;\n }\n"], ["\n &:after {\n content: ' ';\n position: absolute;\n width: 13px;\n height: 13px;\n background-color: #e5e5e5;\n z-index: 2;\n border-radius: 50%;\n transform: ", ";\n left: 0;\n }\n"])), function (props) { return (props.firstElement ? 'translate(0, -0.5px)' : 'translate(0, -6.5px)'); });
|
|
20211
20211
|
var LastActiveCheckpointDot = newStyled.div(templateObject_10$7 || (templateObject_10$7 = __makeTemplateObject(["\n width: 13px;\n min-width: 13px;\n background-color: ", ";\n transform: translate(0, 33px);\n position: relative;\n border-radius: 0 0 8px 8px;\n margin-top: -1px;\n height: 8px;\n"], ["\n width: 13px;\n min-width: 13px;\n background-color: ", ";\n transform: translate(0, 33px);\n position: relative;\n border-radius: 0 0 8px 8px;\n margin-top: -1px;\n height: 8px;\n"])), function (props) { return props.trackColor; });
|
|
20212
20212
|
var WarningIconWrapper = newStyled.div(templateObject_11$5 || (templateObject_11$5 = __makeTemplateObject(["\n > svg {\n height: 28px;\n padding-bottom: 10px;\n }\n"], ["\n > svg {\n height: 28px;\n padding-bottom: 10px;\n }\n"])));
|
|
20213
20213
|
var TrackingProgressV2 = function (_a) {
|
|
@@ -20243,7 +20243,7 @@ var TrackingProgressV2 = function (_a) {
|
|
|
20243
20243
|
return (jsxs$1(CheckpointContainer$1, __assign$1({ "data-testid": "empty-checkpoint-track" }, { children: [jsxs$1(CheckpointDate$1, __assign$1({ currentSpace: "90px" }, { children: [jsx$1(CheckpointDateLabel$1, { lastElement: index + 1 === emptySpaces.length }, void 0), jsx$1(CheckpointDateLabel$1, { lastElement: index + 1 === emptySpaces.length }, void 0)] }), void 0), index + 1 !== emptySpaces.length && (jsx$1(ActiveCheckpointTrack$1, __assign$1({ trackColor: theme.colors.shades['200'].color }, { children: jsx$1(ActiveCheckpointDot$1, { firstElement: false }, void 0) }), void 0)), index + 1 === emptySpaces.length && (jsx$1(LastActiveCheckpointDot, __assign$1({ trackColor: theme.colors.shades['200'].color }, { children: jsx$1(ActiveCheckpointDot$1, { firstElement: false }, void 0) }), void 0)), jsx$1(CheckpointStatus$1, __assign$1({ finishedTrack: false }, { children: statusMessage }), void 0)] }), index));
|
|
20244
20244
|
})] }), void 0));
|
|
20245
20245
|
};
|
|
20246
|
-
var templateObject_1$z, templateObject_2$s, templateObject_3$r, templateObject_4$n, templateObject_5$l, templateObject_6$i, templateObject_7$h, templateObject_8$d, templateObject_9$
|
|
20246
|
+
var templateObject_1$z, templateObject_2$s, templateObject_3$r, templateObject_4$n, templateObject_5$l, templateObject_6$i, templateObject_7$h, templateObject_8$d, templateObject_9$9, templateObject_10$7, templateObject_11$5;
|
|
20247
20247
|
|
|
20248
20248
|
var Container$p = newStyled.div(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
20249
20249
|
var CheckpointContainer = newStyled.div(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
@@ -20532,7 +20532,7 @@ var SubscriptionHeader$2 = newStyled.div(templateObject_6$c || (templateObject_6
|
|
|
20532
20532
|
}, PrimaryColor$1);
|
|
20533
20533
|
var BenefitsContainer$2 = newStyled.div(templateObject_7$b || (templateObject_7$b = __makeTemplateObject(["\n margin-bottom: 5px;\n"], ["\n margin-bottom: 5px;\n"])));
|
|
20534
20534
|
var Benefit = newStyled.div(templateObject_8$9 || (templateObject_8$9 = __makeTemplateObject(["\n display: flex;\n padding: 8px 0;\n svg {\n overflow: visible;\n }\n a {\n text-decoration: underline;\n color: ", ";\n }\n"], ["\n display: flex;\n padding: 8px 0;\n svg {\n overflow: visible;\n }\n a {\n text-decoration: underline;\n color: ", ";\n }\n"])), Shades700Color$1);
|
|
20535
|
-
var BenefitText$1 = newStyled(Text$7)(templateObject_9$
|
|
20535
|
+
var BenefitText$1 = newStyled(Text$7)(templateObject_9$8 || (templateObject_9$8 = __makeTemplateObject(["\n line-height: 20px;\n margin-left: 9px;\n"], ["\n line-height: 20px;\n margin-left: 9px;\n"])));
|
|
20536
20536
|
var StyledPrice$2 = newStyled(PriceLabelV2$1)(templateObject_10$6 || (templateObject_10$6 = __makeTemplateObject(["\n div p {\n color: ", ";\n }\n"], ["\n div p {\n color: ", ";\n }\n"])), function (_a) {
|
|
20537
20537
|
var selected = _a.selected, isNoMember = _a.isNoMember;
|
|
20538
20538
|
return selected
|
|
@@ -20544,7 +20544,7 @@ var StyledPrice$2 = newStyled(PriceLabelV2$1)(templateObject_10$6 || (templateOb
|
|
|
20544
20544
|
: Shades200Color$1;
|
|
20545
20545
|
});
|
|
20546
20546
|
var Container$n = newStyled.div(templateObject_11$4 || (templateObject_11$4 = __makeTemplateObject(["\n margin-top: 20px;\n"], ["\n margin-top: 20px;\n"])));
|
|
20547
|
-
var templateObject_1$s, templateObject_2$l, templateObject_3$l, templateObject_4$h, templateObject_5$f, templateObject_6$c, templateObject_7$b, templateObject_8$9, templateObject_9$
|
|
20547
|
+
var templateObject_1$s, templateObject_2$l, templateObject_3$l, templateObject_4$h, templateObject_5$f, templateObject_6$c, templateObject_7$b, templateObject_8$9, templateObject_9$8, templateObject_10$6, templateObject_11$4;
|
|
20548
20548
|
|
|
20549
20549
|
var ClubOfferSelector = function (_a) {
|
|
20550
20550
|
var pricing = _a.pricing, clubOfferBenefits = _a.clubOfferBenefits, benefits = _a.benefits, onChange = _a.onChange, singlePurchaseLabel = _a.singlePurchaseLabel, subscriptionLabel = _a.subscriptionLabel, className = _a.className, _b = _a.currencySymbol, currencySymbol = _b === void 0 ? '$' : _b, discountLabel = _a.discountLabel, disabledInputs = _a.disabledInputs;
|
|
@@ -20635,7 +20635,7 @@ var SubscriptionHeader$1 = newStyled.div(templateObject_6$b || (templateObject_6
|
|
|
20635
20635
|
}, PrimaryColor);
|
|
20636
20636
|
var BenefitsContainer$1 = newStyled.div(templateObject_7$a || (templateObject_7$a = __makeTemplateObject(["\n margin-bottom: 5px;\n"], ["\n margin-bottom: 5px;\n"])));
|
|
20637
20637
|
newStyled.div(templateObject_8$8 || (templateObject_8$8 = __makeTemplateObject(["\n display: flex;\n padding: 8px 0;\n svg {\n overflow: visible;\n }\n a {\n text-decoration: underline;\n color: ", ";\n }\n"], ["\n display: flex;\n padding: 8px 0;\n svg {\n overflow: visible;\n }\n a {\n text-decoration: underline;\n color: ", ";\n }\n"])), Shades700Color);
|
|
20638
|
-
var BenefitText = newStyled(Text$7)(templateObject_9$
|
|
20638
|
+
var BenefitText = newStyled(Text$7)(templateObject_9$7 || (templateObject_9$7 = __makeTemplateObject(["\n line-height: 20px;\n margin-left: 9px;\n"], ["\n line-height: 20px;\n margin-left: 9px;\n"])));
|
|
20639
20639
|
var StyledPrice$1 = newStyled(PriceLabelV2$1)(templateObject_10$5 || (templateObject_10$5 = __makeTemplateObject(["\n div p {\n color: ", ";\n }\n"], ["\n div p {\n color: ", ";\n }\n"])), function (_a) {
|
|
20640
20640
|
var selected = _a.selected, isNoMember = _a.isNoMember;
|
|
20641
20641
|
return selected
|
|
@@ -20648,7 +20648,7 @@ var StyledPrice$1 = newStyled(PriceLabelV2$1)(templateObject_10$5 || (templateOb
|
|
|
20648
20648
|
});
|
|
20649
20649
|
var Container$m = newStyled.div(templateObject_11$3 || (templateObject_11$3 = __makeTemplateObject(["\n margin-top: 20px;\n"], ["\n margin-top: 20px;\n"])));
|
|
20650
20650
|
var TermsText = newStyled(Text$7)(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n font-size: 10px;\n line-height: 10px;\n margin-bottom: 8px;\n\n a {\n color: #292929;\n text-decoration: underline;\n }\n"], ["\n font-size: 10px;\n line-height: 10px;\n margin-bottom: 8px;\n\n a {\n color: #292929;\n text-decoration: underline;\n }\n"])));
|
|
20651
|
-
var templateObject_1$r, templateObject_2$k, templateObject_3$k, templateObject_4$g, templateObject_5$e, templateObject_6$b, templateObject_7$a, templateObject_8$8, templateObject_9$
|
|
20651
|
+
var templateObject_1$r, templateObject_2$k, templateObject_3$k, templateObject_4$g, templateObject_5$e, templateObject_6$b, templateObject_7$a, templateObject_8$8, templateObject_9$7, templateObject_10$5, templateObject_11$3, templateObject_12$2;
|
|
20652
20652
|
|
|
20653
20653
|
var ClubOfferSelector2 = function (_a) {
|
|
20654
20654
|
var pricing = _a.pricing, clubOfferBenefits = _a.clubOfferBenefits, benefits = _a.benefits, onChange = _a.onChange, singlePurchaseLabel = _a.singlePurchaseLabel, subscriptionLabel = _a.subscriptionLabel, className = _a.className, _b = _a.currencySymbol, currencySymbol = _b === void 0 ? '$' : _b, discountLabel = _a.discountLabel, disabledInputs = _a.disabledInputs, termsTextLink = _a.termsTextLink;
|
|
@@ -20717,13 +20717,13 @@ var StyledButton = newStyled.button(templateObject_1$p || (templateObject_1$p =
|
|
|
20717
20717
|
return customStyle && __assign$1({}, customStyle);
|
|
20718
20718
|
});
|
|
20719
20719
|
var JoinClubCard = function (_a) {
|
|
20720
|
-
var onCheckToggle = _a.onCheckToggle, isChecked = _a.isChecked, icon = _a.icon, link = _a.link, bodyCopy = _a.bodyCopy, titleCopy = _a.titleCopy, style = _a.style, _b = _a.showButton, showButton = _b === void 0 ? false : _b, _c = _a.buttonText, buttonText = _c === void 0 ? 'ADD' : _c, _d = _a.buttonStyle, buttonStyle = _d === void 0 ? {} : _d, termsText = _a.termsText;
|
|
20720
|
+
var onCheckToggle = _a.onCheckToggle, isChecked = _a.isChecked, icon = _a.icon, link = _a.link, bodyCopy = _a.bodyCopy, titleCopy = _a.titleCopy, style = _a.style, _b = _a.showButton, showButton = _b === void 0 ? false : _b, _c = _a.buttonText, buttonText = _c === void 0 ? 'ADD' : _c, _d = _a.buttonStyle, buttonStyle = _d === void 0 ? {} : _d, termsText = _a.termsText, toggleColor = _a.toggleColor;
|
|
20721
20721
|
var _e = useState(isChecked), checked = _e[0], setChecked = _e[1];
|
|
20722
20722
|
var handleToggleValue = function (value) {
|
|
20723
20723
|
setChecked(value);
|
|
20724
20724
|
onCheckToggle(value);
|
|
20725
20725
|
};
|
|
20726
|
-
return (jsx$1(Card, __assign$1({ link: link, icon: icon, isChecked: checked, bodyCopy: bodyCopy, titleCopy: titleCopy, style: style, termsText: termsText }, { children: showButton ? (jsx$1(StyledButton, __assign$1({ onClick: function () { return handleToggleValue(!checked); }, customStyle: buttonStyle }, { children: buttonText }), void 0)) : (jsx$1(ToggleComponent, { onToggle: handleToggleValue, isChecked: checked }, void 0)) }), void 0));
|
|
20726
|
+
return (jsx$1(Card, __assign$1({ link: link, icon: icon, isChecked: checked, bodyCopy: bodyCopy, titleCopy: titleCopy, style: style, termsText: termsText }, { children: showButton ? (jsx$1(StyledButton, __assign$1({ onClick: function () { return handleToggleValue(!checked); }, customStyle: buttonStyle }, { children: buttonText }), void 0)) : (jsx$1(ToggleComponent, { onToggle: handleToggleValue, isChecked: checked, color: toggleColor }, void 0)) }), void 0));
|
|
20727
20727
|
};
|
|
20728
20728
|
var templateObject_1$p;
|
|
20729
20729
|
|
|
@@ -20842,8 +20842,9 @@ var QuatityLabel = newStyled.div(templateObject_4$b || (templateObject_4$b = __m
|
|
|
20842
20842
|
newStyled.div(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n font-size: 14px;\n font-weight: 700;\n color: #292929;\n line-height: 20px;\n margin-top: 10px;\n"], ["\n font-size: 14px;\n font-weight: 700;\n color: #292929;\n line-height: 20px;\n margin-top: 10px;\n"])));
|
|
20843
20843
|
var OfferTitle = newStyled(Text$7)(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n font-size: 20px;\n margin-top: 10px;\n @media (max-width: 768px) {\n font-size: 14px;\n }\n"], ["\n font-size: 20px;\n margin-top: 10px;\n @media (max-width: 768px) {\n font-size: 14px;\n }\n"])));
|
|
20844
20844
|
var OfferText = newStyled(Text$7)(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject(["\n font-size: 12px;\n line-height: 16px;\n display: inline;\n max-width: 190px;\n"], ["\n font-size: 12px;\n line-height: 16px;\n display: inline;\n max-width: 190px;\n"])));
|
|
20845
|
-
var
|
|
20846
|
-
var
|
|
20845
|
+
var DiscountValueText = newStyled.span(templateObject_8$7 || (templateObject_8$7 = __makeTemplateObject(["\n font-weight: bold;\n"], ["\n font-weight: bold;\n"])));
|
|
20846
|
+
var OfferButton = newStyled(ButtonSecondary)(templateObject_9$6 || (templateObject_9$6 = __makeTemplateObject(["\n font-size: 0.75rem;\n padding: 0.875rem 2rem;\n"], ["\n font-size: 0.75rem;\n padding: 0.875rem 2rem;\n"])));
|
|
20847
|
+
var templateObject_1$l, templateObject_2$f, templateObject_3$f, templateObject_4$b, templateObject_5$a, templateObject_6$a, templateObject_7$9, templateObject_8$7, templateObject_9$6;
|
|
20847
20848
|
|
|
20848
20849
|
var VariantType;
|
|
20849
20850
|
(function (VariantType) {
|
|
@@ -20854,7 +20855,7 @@ var VariantType;
|
|
|
20854
20855
|
var OfferAtPDP = function (_a) {
|
|
20855
20856
|
var title = _a.title, image = _a.image, ctaText = _a.ctaText, onAddToCart = _a.onAddToCart, variant = _a.variant, discountText = _a.discountText, discountValue = _a.discountValue, _b = _a.quantity, quantity = _b === void 0 ? '2X' : _b;
|
|
20856
20857
|
var _c = image !== null && image !== void 0 ? image : {}, src = _c.src, _d = _c.alt, alt = _d === void 0 ? 'Product image' : _d, _e = _c.width, width = _e === void 0 ? '116px' : _e, _f = _c.height, height = _f === void 0 ? '100%' : _f, _g = _c.borderRadius, borderRadius = _g === void 0 ? '8px' : _g;
|
|
20857
|
-
return variant == VariantType.V1 ? (jsxs$1(Container$j, { children: [src && (jsxs$1(ProductImageContainer, { children: [jsx$1(Image$3, { src: src, alt: alt, width: width, height: height, borderRadius: borderRadius }, void 0), jsxs$1(QuatityLabel, { children: [" ", quantity] }, void 0)] }, void 0)), jsxs$1(Body, { children: [jsx$1(OfferTitle, __assign$1({ variant: "body", weight: "bold" }, { children: title }), void 0), jsxs$1(OfferText, __assign$1({ variant: "body" }, { children: [discountText,
|
|
20858
|
+
return variant == VariantType.V1 ? (jsxs$1(Container$j, { children: [src && (jsxs$1(ProductImageContainer, { children: [jsx$1(Image$3, { src: src, alt: alt, width: width, height: height, borderRadius: borderRadius }, void 0), jsxs$1(QuatityLabel, { children: [" ", quantity] }, void 0)] }, void 0)), jsxs$1(Body, { children: [jsx$1(OfferTitle, __assign$1({ variant: "body", weight: "bold" }, { children: title }), void 0), jsxs$1(OfferText, __assign$1({ variant: "body" }, { children: [discountText, " ", jsx$1(DiscountValueText, { children: discountValue }, void 0)] }), void 0), jsx$1(OfferButton, { text: ctaText, size: ComponentSize.Medium, onClick: onAddToCart }, void 0)] }, void 0)] }, void 0)) : (jsx$1(ButtonSecondary, { onClick: onAddToCart, wide: true, size: ComponentSize.Large, text: ctaText }, void 0));
|
|
20858
20859
|
};
|
|
20859
20860
|
|
|
20860
20861
|
var ImageContainer$1 = newStyled.div(function (_a) {
|