@trafilea/afrodita-components 6.8.10 → 6.8.12
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 +2 -1
- package/build/index.esm.js +31 -23
- package/build/index.esm.js.map +1 -1
- package/build/index.js +31 -23
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.d.ts
CHANGED
|
@@ -2903,6 +2903,7 @@ interface ReviewProps {
|
|
|
2903
2903
|
reviewId: string;
|
|
2904
2904
|
reviewerName: string;
|
|
2905
2905
|
date: Date;
|
|
2906
|
+
dateFormat?: 'DDMMYY' | 'MMDDYY' | 'YYMMDD';
|
|
2906
2907
|
rating: number;
|
|
2907
2908
|
stars: {
|
|
2908
2909
|
color: string;
|
|
@@ -2921,7 +2922,7 @@ interface ReviewProps {
|
|
|
2921
2922
|
helpfulCount?: number;
|
|
2922
2923
|
hasTextWhenHelpfulCount0?: boolean;
|
|
2923
2924
|
}
|
|
2924
|
-
declare const Review: ({ reviewId, reviewerName, date, rating, stars, title, description, images, reviewVariant, onClickImage, helpfulActionText, helpfulAction, helpfulCount, hasTextWhenHelpfulCount0, }: ReviewProps) => JSX.Element;
|
|
2925
|
+
declare const Review: ({ reviewId, reviewerName, date, dateFormat, rating, stars, title, description, images, reviewVariant, onClickImage, helpfulActionText, helpfulAction, helpfulCount, hasTextWhenHelpfulCount0, }: ReviewProps) => JSX.Element;
|
|
2925
2926
|
|
|
2926
2927
|
interface ReviewsHeaderProps {
|
|
2927
2928
|
title?: string;
|
package/build/index.esm.js
CHANGED
|
@@ -4090,7 +4090,7 @@ var TAGS = {
|
|
|
4090
4090
|
hero2: newStyled.h2(templateObject_2$1f || (templateObject_2$1f = __makeTemplateObject([""], [""]))),
|
|
4091
4091
|
hero3: newStyled.h3(templateObject_3$Y || (templateObject_3$Y = __makeTemplateObject([""], [""]))),
|
|
4092
4092
|
display1: newStyled.h1(templateObject_4$I || (templateObject_4$I = __makeTemplateObject([""], [""]))),
|
|
4093
|
-
display2: newStyled.h2(templateObject_5$
|
|
4093
|
+
display2: newStyled.h2(templateObject_5$t || (templateObject_5$t = __makeTemplateObject([""], [""]))),
|
|
4094
4094
|
display3: newStyled.h3(templateObject_6$o || (templateObject_6$o = __makeTemplateObject([""], [""]))),
|
|
4095
4095
|
heading1: newStyled.h1(templateObject_7$g || (templateObject_7$g = __makeTemplateObject([""], [""]))),
|
|
4096
4096
|
heading2: newStyled.h2(templateObject_8$d || (templateObject_8$d = __makeTemplateObject([""], [""]))),
|
|
@@ -4222,13 +4222,13 @@ var DEFAULTS = {
|
|
|
4222
4222
|
size: 'regular',
|
|
4223
4223
|
},
|
|
4224
4224
|
};
|
|
4225
|
-
var templateObject_1$1U, templateObject_2$1f, templateObject_3$Y, templateObject_4$I, templateObject_5$
|
|
4225
|
+
var templateObject_1$1U, templateObject_2$1f, templateObject_3$Y, templateObject_4$I, templateObject_5$t, templateObject_6$o, templateObject_7$g, templateObject_8$d, templateObject_9$6, templateObject_10$5, templateObject_11$4, templateObject_12$3, templateObject_13$3, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2, templateObject_18$2, templateObject_19$2, templateObject_20$1;
|
|
4226
4226
|
|
|
4227
4227
|
var Container$19 = newStyled.div(templateObject_1$1T || (templateObject_1$1T = __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"])));
|
|
4228
4228
|
var Card$3 = newStyled.div(templateObject_2$1e || (templateObject_2$1e = __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"])));
|
|
4229
4229
|
var Tag$2 = newStyled.div(templateObject_3$X || (templateObject_3$X = __makeTemplateObject(["\n position: absolute;\n width: 100%;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background-color: var(--component-packSelector-tagColor);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1px 0;\n\n [aria-checked='true'] & {\n background-color: var(--component-packSelector-selectedColor);\n\n & * {\n color: var(--component-packSelector-selectedContrast) !important;\n }\n }\n"], ["\n position: absolute;\n width: 100%;\n left: 50%;\n top: 0;\n transform: translateX(-50%);\n background-color: var(--component-packSelector-tagColor);\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1px 0;\n\n [aria-checked='true'] & {\n background-color: var(--component-packSelector-selectedColor);\n\n & * {\n color: var(--component-packSelector-selectedContrast) !important;\n }\n }\n"])));
|
|
4230
4230
|
var Label$4 = newStyled.div(templateObject_4$H || (templateObject_4$H = __makeTemplateObject(["\n position: relative;\n width: fit-content;\n margin: 0 auto;\n"], ["\n position: relative;\n width: fit-content;\n margin: 0 auto;\n"])));
|
|
4231
|
-
var Check$1 = newStyled.div(templateObject_5$
|
|
4231
|
+
var Check$1 = newStyled.div(templateObject_5$s || (templateObject_5$s = __makeTemplateObject(["\n position: absolute;\n width: 20px;\n height: 20px;\n background-color: var(--color);\n border-radius: 50%;\n left: 100%;\n top: 50%;\n transform: translate(6px, -50%) scale(0.5);\n opacity: 0;\n transition: opacity 0.3s, transform 0.3s;\n\n &[data-visible='true'] {\n transform: translate(6px, -50%) scale(1);\n opacity: 1;\n }\n"], ["\n position: absolute;\n width: 20px;\n height: 20px;\n background-color: var(--color);\n border-radius: 50%;\n left: 100%;\n top: 50%;\n transform: translate(6px, -50%) scale(0.5);\n opacity: 0;\n transition: opacity 0.3s, transform 0.3s;\n\n &[data-visible='true'] {\n transform: translate(6px, -50%) scale(1);\n opacity: 1;\n }\n"])));
|
|
4232
4232
|
var DiscountContainer$1 = newStyled.div(templateObject_6$n || (templateObject_6$n = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n flex-wrap: wrap;\n"], ["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n flex-wrap: wrap;\n"])));
|
|
4233
4233
|
var PackSelectorV2 = function (_a) {
|
|
4234
4234
|
var packs = _a.packs, selectedValue = _a.selectedValue, onChange = _a.onChange, currencyCode = _a.currencyCode;
|
|
@@ -4254,7 +4254,7 @@ var PackCard$1 = function (_a) {
|
|
|
4254
4254
|
currency: currencyCode || 'USD',
|
|
4255
4255
|
}), ' ', "each", ')'] }), void 0)) : null] }, void 0)] }), void 0));
|
|
4256
4256
|
};
|
|
4257
|
-
var templateObject_1$1T, templateObject_2$1e, templateObject_3$X, templateObject_4$H, templateObject_5$
|
|
4257
|
+
var templateObject_1$1T, templateObject_2$1e, templateObject_3$X, templateObject_4$H, templateObject_5$s, templateObject_6$n;
|
|
4258
4258
|
|
|
4259
4259
|
var Container$18 = newStyled.div(templateObject_1$1S || (templateObject_1$1S = __makeTemplateObject(["\n height: 32px;\n display: flex;\n align-items: center;\n"], ["\n height: 32px;\n display: flex;\n align-items: center;\n"])));
|
|
4260
4260
|
var DropContainer = newStyled.div(templateObject_2$1d || (templateObject_2$1d = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
@@ -5122,14 +5122,14 @@ var TooltipText = newStyled.div(templateObject_4$G || (templateObject_4$G = __ma
|
|
|
5122
5122
|
var color = _a.color;
|
|
5123
5123
|
return color;
|
|
5124
5124
|
});
|
|
5125
|
-
var TopSection = newStyled.div(templateObject_5$
|
|
5125
|
+
var TopSection = newStyled.div(templateObject_5$r || (templateObject_5$r = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 0.688rem;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 0.688rem;\n"])));
|
|
5126
5126
|
var Title$7 = newStyled.h1(templateObject_6$m || (templateObject_6$m = __makeTemplateObject(["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n"], ["\n font-size: 0.875rem;\n font-weight: 600;\n line-height: 1.375rem;\n margin: 0;\n color: ", ";\n"])), function (_a) {
|
|
5127
5127
|
var color = _a.color;
|
|
5128
5128
|
return color;
|
|
5129
5129
|
});
|
|
5130
5130
|
var IconContainer$5 = newStyled.div(templateObject_7$f || (templateObject_7$f = __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"])));
|
|
5131
5131
|
var CloseToolTip = newStyled.button(templateObject_8$c || (templateObject_8$c = __makeTemplateObject(["\n position: absolute;\n background: none;\n border: none;\n cursor: pointer;\n right: 0.3rem;\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: 0.3rem;\n top: 0.25rem;\n padding: 0px;\n z-index: 2;\n"])));
|
|
5132
|
-
var templateObject_1$1I, templateObject_2$17, templateObject_3$U, templateObject_4$G, templateObject_5$
|
|
5132
|
+
var templateObject_1$1I, templateObject_2$17, templateObject_3$U, templateObject_4$G, templateObject_5$r, templateObject_6$m, templateObject_7$f, templateObject_8$c;
|
|
5133
5133
|
|
|
5134
5134
|
var useOnClickOutside = function (ref, handler) {
|
|
5135
5135
|
useEffect(function () {
|
|
@@ -5650,7 +5650,7 @@ var SinglePurchaseContainer = newStyled(ContainerBase)(templateObject_3$R || (te
|
|
|
5650
5650
|
return (onClick ? 'cursor: pointer;' : '');
|
|
5651
5651
|
});
|
|
5652
5652
|
var SubscriptionContainer = newStyled(ContainerBase)(templateObject_4$F || (templateObject_4$F = __makeTemplateObject(["\n padding: 16px;\n"], ["\n padding: 16px;\n"])));
|
|
5653
|
-
var SubscriptionHeader = newStyled.div(templateObject_5$
|
|
5653
|
+
var SubscriptionHeader = newStyled.div(templateObject_5$q || (templateObject_5$q = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n border-bottom: 1px solid ", ";\n padding-bottom: 10px;\n margin-bottom: 8px;\n cursor: pointer;\n\n & input:checked + div {\n border-color: ", ";\n }\n"], ["\n display: flex;\n justify-content: space-between;\n border-bottom: 1px solid ", ";\n padding-bottom: 10px;\n margin-bottom: 8px;\n cursor: pointer;\n\n & input:checked + div {\n border-color: ", ";\n }\n"])), function (_a) {
|
|
5654
5654
|
var theme = _a.theme;
|
|
5655
5655
|
return theme.colors.shades[200].color;
|
|
5656
5656
|
}, function (_a) {
|
|
@@ -5668,7 +5668,7 @@ var StyledPrice = newStyled(PriceLabelV2)(templateObject_12$2 || (templateObject
|
|
|
5668
5668
|
return selected ? theme.colors.shades[700].color : theme.colors.shades[200].color;
|
|
5669
5669
|
});
|
|
5670
5670
|
var Container$$ = newStyled.div(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject([""], [""])));
|
|
5671
|
-
var templateObject_1$1C, templateObject_2$12, templateObject_3$R, templateObject_4$F, templateObject_5$
|
|
5671
|
+
var templateObject_1$1C, templateObject_2$12, templateObject_3$R, templateObject_4$F, templateObject_5$q, templateObject_6$l, templateObject_7$e, templateObject_8$b, templateObject_9$5, templateObject_10$4, templateObject_11$3, templateObject_12$2, templateObject_13$2;
|
|
5672
5672
|
|
|
5673
5673
|
var radioIds = {
|
|
5674
5674
|
oneTime: {
|
|
@@ -5747,9 +5747,9 @@ var CustomerDetails = newStyled.div(templateObject_1$1A || (templateObject_1$1A
|
|
|
5747
5747
|
var CustomerInfo = newStyled.div(templateObject_2$11 || (templateObject_2$11 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: center;\n"])));
|
|
5748
5748
|
var Name = newStyled.h4(templateObject_3$Q || (templateObject_3$Q = __makeTemplateObject(["\n font-size: 22px;\n line-height: 20px;\n font-weight: 400;\n margin: 0;\n"], ["\n font-size: 22px;\n line-height: 20px;\n font-weight: 400;\n margin: 0;\n"])));
|
|
5749
5749
|
var StarIconContainer = newStyled.div(templateObject_4$E || (templateObject_4$E = __makeTemplateObject(["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 5px;\n"], ["\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 5px;\n"])));
|
|
5750
|
-
var Description$2 = newStyled.p(templateObject_5$
|
|
5750
|
+
var Description$2 = newStyled.p(templateObject_5$p || (templateObject_5$p = __makeTemplateObject(["\n font-size: 16px;\n font-weight: 300;\n line-height: normal;\n"], ["\n font-size: 16px;\n font-weight: 300;\n line-height: normal;\n"])));
|
|
5751
5751
|
var ReviewDays = newStyled.span(templateObject_6$k || (templateObject_6$k = __makeTemplateObject(["\n display: block;\n font-size: 14px;\n font-style: italic;\n font-weight: 300;\n"], ["\n display: block;\n font-size: 14px;\n font-style: italic;\n font-weight: 300;\n"])));
|
|
5752
|
-
var templateObject_1$1A, templateObject_2$11, templateObject_3$Q, templateObject_4$E, templateObject_5$
|
|
5752
|
+
var templateObject_1$1A, templateObject_2$11, templateObject_3$Q, templateObject_4$E, templateObject_5$p, templateObject_6$k;
|
|
5753
5753
|
|
|
5754
5754
|
var NameWithStars = function (_a) {
|
|
5755
5755
|
var name = _a.name, size = _a.size;
|
|
@@ -6013,7 +6013,7 @@ var Container$V = newStyled.div(templateObject_1$1n || (templateObject_1$1n = __
|
|
|
6013
6013
|
var MobileContainer = newStyled(Container$V)(templateObject_2$Y || (templateObject_2$Y = __makeTemplateObject(["\n padding: 2px 2px;\n gap: 3px;\n"], ["\n padding: 2px 2px;\n gap: 3px;\n"])));
|
|
6014
6014
|
var DollarPart = newStyled.span(templateObject_3$L || (templateObject_3$L = __makeTemplateObject(["\n color: #fff;\n font-family: 'Avenir Next', sans-serif;\n font-weight: 700;\n line-height: 14px; /* 116.667% */\n"], ["\n color: #fff;\n font-family: 'Avenir Next', sans-serif;\n font-weight: 700;\n line-height: 14px; /* 116.667% */\n"])));
|
|
6015
6015
|
var ClubMembersText = newStyled.span(templateObject_4$A || (templateObject_4$A = __makeTemplateObject(["\n color: #fff;\n font-family: 'Avenir Next', sans-serif;\n font-weight: 500;\n line-height: 14px; /* 116.667% */\n"], ["\n color: #fff;\n font-family: 'Avenir Next', sans-serif;\n font-weight: 500;\n line-height: 14px; /* 116.667% */\n"])));
|
|
6016
|
-
var MobileDollarPart = newStyled(DollarPart)(templateObject_5$
|
|
6016
|
+
var MobileDollarPart = newStyled(DollarPart)(templateObject_5$o || (templateObject_5$o = __makeTemplateObject(["\n font-size: 10px;\n"], ["\n font-size: 10px;\n"])));
|
|
6017
6017
|
var MobileClubMembersText = newStyled(ClubMembersText)(templateObject_6$j || (templateObject_6$j = __makeTemplateObject(["\n font-size: 10px;\n"], ["\n font-size: 10px;\n"])));
|
|
6018
6018
|
var DesktopDollarPart = newStyled(DollarPart)(templateObject_7$d || (templateObject_7$d = __makeTemplateObject(["\n font-size: 13px;\n"], ["\n font-size: 13px;\n"])));
|
|
6019
6019
|
var DesktopClubMembersText = newStyled(ClubMembersText)(templateObject_8$a || (templateObject_8$a = __makeTemplateObject(["\n font-size: 13px;\n"], ["\n font-size: 13px;\n"])));
|
|
@@ -6022,7 +6022,7 @@ var ClubPriceLabel = function (_a) {
|
|
|
6022
6022
|
var isMobile = useWindowDimensions().isMobile;
|
|
6023
6023
|
return (jsx$1(Fragment$2, { children: isMobile ? (jsxs$1(MobileContainer, { children: [jsx$1(MobileDollarPart, { children: clubPrice }, void 0), jsx$1(MobileClubMembersText, { children: "FOR CLUB MEMBERS" }, void 0)] }, void 0)) : (jsxs$1(Container$V, { children: [jsx$1(DesktopDollarPart, { children: clubPrice }, void 0), jsx$1(DesktopClubMembersText, { children: "FOR CLUB MEMBERS" }, void 0)] }, void 0)) }, void 0));
|
|
6024
6024
|
};
|
|
6025
|
-
var templateObject_1$1n, templateObject_2$Y, templateObject_3$L, templateObject_4$A, templateObject_5$
|
|
6025
|
+
var templateObject_1$1n, templateObject_2$Y, templateObject_3$L, templateObject_4$A, templateObject_5$o, templateObject_6$j, templateObject_7$d, templateObject_8$a;
|
|
6026
6026
|
|
|
6027
6027
|
var Spacing = function (_a) {
|
|
6028
6028
|
var size = _a.size, _b = _a.type, type = _b === void 0 ? 'block' : _b, children = _a.children, styleProp = _a.style;
|
|
@@ -6155,7 +6155,8 @@ var templateObject_1$1i;
|
|
|
6155
6155
|
var RegularPriceTagSpan = newStyled.span(templateObject_1$1h || (templateObject_1$1h = __makeTemplateObject(["\n background-color: #e5e5e5;\n padding: 3px 4px;\n border-radius: 4px;\n gap: 10px;\n align-items: center;\n justify-content: center;\n color: #5a5a5a;\n font-weight: 600;\n font-size: 0.6rem;\n line-height: 1rem;\n text-align: center;\n margin-bottom: 0.5rem;\n"], ["\n background-color: #e5e5e5;\n padding: 3px 4px;\n border-radius: 4px;\n gap: 10px;\n align-items: center;\n justify-content: center;\n color: #5a5a5a;\n font-weight: 600;\n font-size: 0.6rem;\n line-height: 1rem;\n text-align: center;\n margin-bottom: 0.5rem;\n"])));
|
|
6156
6156
|
var ClubPriceTagSpan = newStyled.span(templateObject_2$W || (templateObject_2$W = __makeTemplateObject(["\n background-color: #c64844;\n padding: 3px 4px;\n border-radius: 4px;\n gap: 10px;\n align-items: center;\n justify-content: center;\n color: white;\n font-weight: 600;\n font-size: 0.6rem;\n line-height: 1rem;\n text-align: center;\n margin-bottom: 0.5rem;\n"], ["\n background-color: #c64844;\n padding: 3px 4px;\n border-radius: 4px;\n gap: 10px;\n align-items: center;\n justify-content: center;\n color: white;\n font-weight: 600;\n font-size: 0.6rem;\n line-height: 1rem;\n text-align: center;\n margin-bottom: 0.5rem;\n"])));
|
|
6157
6157
|
var PriceContainer$1 = newStyled.span(templateObject_3$J || (templateObject_3$J = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
6158
|
-
var
|
|
6158
|
+
var PriceContainerV2 = newStyled.span(templateObject_4$y || (templateObject_4$y = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
6159
|
+
var PriceWithTagContainer = newStyled.span(templateObject_5$n || (templateObject_5$n = __makeTemplateObject(["\n display: flex;\n gap: 8px;\n"], ["\n display: flex;\n gap: 8px;\n"])));
|
|
6159
6160
|
var RegularPriceTag = function () {
|
|
6160
6161
|
return jsx$1(RegularPriceTagSpan, { children: "REGULAR PRICE" }, void 0);
|
|
6161
6162
|
};
|
|
@@ -6204,11 +6205,11 @@ var PriceLabelV4 = function (_a) {
|
|
|
6204
6205
|
: ComponentSize.XSmall;
|
|
6205
6206
|
return (jsx$1(Price, __assign$1({ size: sizeProp, color: theme.component.pricing.priceLabel.price.originalPriceColor, underlined: originalPriceUnderlined, "data-testid": getTestId(testId, 'original-product-price'), theme: theme }, { children: originalPrice }), void 0));
|
|
6206
6207
|
};
|
|
6207
|
-
return (jsxs$1(Container$10, __assign$1({}, rest, { children: [clubStyle && !styledPrice ? (jsxs$1(PriceContainer$1, { children: [jsxs$1(PriceWithTagContainer, { children: [jsx$1(OriginalPrice, {}, void 0), jsx$1(RegularPriceTag, {}, void 0)] }, void 0), jsxs$1(PriceWithTagContainer, { children: [jsx$1(Price, __assign$1({ margin: true, "data-testid": getTestId(testId, 'final-product-price') }, priceCommonProps, { style: finalPriceStyle, size: size }, { children: clubPrice }), void 0), jsx$1(ClubPriceTag, {}, void 0)] }, void 0)] }, void 0)) : (jsxs$1(PriceContainer$1, { children: [jsxs$1(PriceWithTagContainer, { children: [jsx$1(OriginalPrice, {}, void 0), jsx$1(RegularPriceTag, {}, void 0)] }, void 0), jsxs$1(PriceWithTagContainer, { children: [jsx$1(Price, __assign$1({ margin: true, finalPriceStyledSmall: true, style: { marginTop: '-5px', color: '#c64844' } }, priceCommonProps, { size: size, "data-testid": getTestId(testId, 'final-product-price') }, { children: currencySymbol }), void 0), jsxs$1(Price, __assign$1({ finalPriceStyled: true }, priceCommonProps, { size: size, style: { color: '#c64844' } }, { children: [finalPriceArray[0]
|
|
6208
|
-
|
|
6209
|
-
|
|
6208
|
+
return (jsxs$1(Container$10, __assign$1({}, rest, { children: [clubStyle && !styledPrice ? (jsxs$1(PriceContainer$1, { children: [jsxs$1(PriceWithTagContainer, { children: [jsx$1(OriginalPrice, {}, void 0), jsx$1(RegularPriceTag, {}, void 0)] }, void 0), jsxs$1(PriceWithTagContainer, { children: [jsx$1(Price, __assign$1({ margin: true, "data-testid": getTestId(testId, 'final-product-price') }, priceCommonProps, { style: finalPriceStyle, size: size }, { children: clubPrice }), void 0), jsx$1(ClubPriceTag, {}, void 0)] }, void 0)] }, void 0)) : (jsxs$1(PriceContainer$1, { children: [jsxs$1(PriceWithTagContainer, { children: [jsx$1(OriginalPrice, {}, void 0), jsx$1(RegularPriceTag, {}, void 0)] }, void 0), jsxs$1(PriceWithTagContainer, { children: [jsxs$1(PriceContainerV2, { children: [jsx$1(Price, __assign$1({ margin: true, finalPriceStyledSmall: true, style: { marginTop: '-5px', color: '#c64844' } }, priceCommonProps, { size: size, "data-testid": getTestId(testId, 'final-product-price') }, { children: currencySymbol }), void 0), jsxs$1(Price, __assign$1({ finalPriceStyled: true }, priceCommonProps, { size: size, style: { color: '#c64844' } }, { children: [finalPriceArray[0]
|
|
6209
|
+
? finalPriceArray[0]
|
|
6210
|
+
: (_b = "".concat(productFinalPrice)) === null || _b === void 0 ? void 0 : _b.split(currencySymbol)[1], "."] }), void 0), jsx$1(Price, __assign$1({ finalPriceStyledSmall: true, style: { marginTop: '-6px', color: '#c64844' } }, priceCommonProps, { size: size }, { children: finalPriceArray[1] ? finalPriceArray[1] : '00' }), void 0)] }, void 0), jsx$1(ClubPriceTag, {}, void 0)] }, void 0)] }, void 0)), discount && (jsx$1(TagContainer, __assign$1({ size: size }, { children: jsx$1(DiscountTag, __assign$1({}, discount, { size: size }), void 0) }), void 0))] }), void 0));
|
|
6210
6211
|
};
|
|
6211
|
-
var templateObject_1$1h, templateObject_2$W, templateObject_3$J, templateObject_4$y;
|
|
6212
|
+
var templateObject_1$1h, templateObject_2$W, templateObject_3$J, templateObject_4$y, templateObject_5$n;
|
|
6212
6213
|
|
|
6213
6214
|
var ImageContainer$4 = newStyled.div(function (_a) {
|
|
6214
6215
|
var width = _a.width, height = _a.height;
|
|
@@ -18666,11 +18667,18 @@ var ClubRadioGroupInput = function (_a) {
|
|
|
18666
18667
|
}) }), void 0));
|
|
18667
18668
|
};
|
|
18668
18669
|
|
|
18669
|
-
function formatDate(date) {
|
|
18670
|
+
function formatDate(date, format) {
|
|
18670
18671
|
var day = date.getDate();
|
|
18671
18672
|
var month = date.getMonth() + 1;
|
|
18672
18673
|
var year = date.getFullYear();
|
|
18673
|
-
|
|
18674
|
+
switch (format !== null && format !== void 0 ? format : 'DDMMYY') {
|
|
18675
|
+
case 'DDMMYY':
|
|
18676
|
+
return "".concat(day < 10 ? "0".concat(day) : day, "/").concat(month < 10 ? "0".concat(month) : month, "/").concat(year);
|
|
18677
|
+
case 'MMDDYY':
|
|
18678
|
+
return "".concat(month < 10 ? "0".concat(month) : month, "/").concat(day < 10 ? "0".concat(day) : day, "/").concat(year);
|
|
18679
|
+
case 'YYMMDD':
|
|
18680
|
+
return "".concat(year, "/").concat(month < 10 ? "0".concat(month) : month, "/").concat(day < 10 ? "0".concat(day) : day);
|
|
18681
|
+
}
|
|
18674
18682
|
}
|
|
18675
18683
|
|
|
18676
18684
|
var Container$h = newStyled.div(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n\n @media (min-width: 768px) {\n flex-direction: row;\n }\n"], ["\n display: flex;\n flex-direction: column;\n\n @media (min-width: 768px) {\n flex-direction: row;\n }\n"])));
|
|
@@ -18741,10 +18749,10 @@ var HelpfulText = newStyled.div(templateObject_17 || (templateObject_17 = __make
|
|
|
18741
18749
|
var HelpfulTexti = newStyled.i(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n content: '\f164';\n"], ["\n content: '\\f164';\n"])));
|
|
18742
18750
|
var ButtonSecondaryWrapper = newStyled(ButtonSecondary)(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n margin-right: 15px;\n"], ["\n margin-right: 15px;\n"])));
|
|
18743
18751
|
var Review = function (_a) {
|
|
18744
|
-
var reviewId = _a.reviewId, reviewerName = _a.reviewerName, date = _a.date, rating = _a.rating, stars = _a.stars, title = _a.title, description = _a.description, images = _a.images, reviewVariant = _a.reviewVariant, onClickImage = _a.onClickImage, helpfulActionText = _a.helpfulActionText, helpfulAction = _a.helpfulAction, helpfulCount = _a.helpfulCount,
|
|
18752
|
+
var reviewId = _a.reviewId, reviewerName = _a.reviewerName, date = _a.date, _b = _a.dateFormat, dateFormat = _b === void 0 ? 'DDMMYY' : _b, rating = _a.rating, stars = _a.stars, title = _a.title, description = _a.description, images = _a.images, reviewVariant = _a.reviewVariant, onClickImage = _a.onClickImage, helpfulActionText = _a.helpfulActionText, helpfulAction = _a.helpfulAction, helpfulCount = _a.helpfulCount, _c = _a.hasTextWhenHelpfulCount0, hasTextWhenHelpfulCount0 = _c === void 0 ? false : _c;
|
|
18745
18753
|
var randomId = Math.random().toString(36).substring(7);
|
|
18746
|
-
var
|
|
18747
|
-
var
|
|
18754
|
+
var _d = useState(description.length > REVIEWS_DESCRIPTION_MAX_LENGTH_MOBILE), showMoreMobile = _d[0], setShowMoreMobile = _d[1];
|
|
18755
|
+
var _e = useState(description.length > REVIEWS_DESCRIPTION_MAX_LENGTH_DESKTOP), showMoreDesktop = _e[0], setShowMoreDesktop = _e[1];
|
|
18748
18756
|
useEffect(function () {
|
|
18749
18757
|
var seeMoreElements = document.querySelectorAll("#see-more-".concat(randomId));
|
|
18750
18758
|
var showAllDescription = function () {
|
|
@@ -18760,7 +18768,7 @@ var Review = function (_a) {
|
|
|
18760
18768
|
});
|
|
18761
18769
|
};
|
|
18762
18770
|
}, [randomId]);
|
|
18763
|
-
return (jsxs$1(Container$g, { children: [jsxs$1(Heading, { children: [jsx$1(ReviewerName, { children: reviewerName }, void 0), jsx$1(DateText, { children: formatDate(date) }, void 0)] }, void 0), jsx$1(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsxs$1(Content, __assign$1({ "data-testid": "review-content" }, { children: [jsxs$1(ReviewContainer, { children: [jsx$1(ReviewTitle, { children: title }, void 0), jsx$1(ReviewDescriptionMobile, { dangerouslySetInnerHTML: {
|
|
18771
|
+
return (jsxs$1(Container$g, { children: [jsxs$1(Heading, { children: [jsx$1(ReviewerName, { children: reviewerName }, void 0), jsx$1(DateText, { children: formatDate(date, dateFormat) }, void 0)] }, void 0), jsx$1(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsxs$1(Content, __assign$1({ "data-testid": "review-content" }, { children: [jsxs$1(ReviewContainer, { children: [jsx$1(ReviewTitle, { children: title }, void 0), jsx$1(ReviewDescriptionMobile, { dangerouslySetInnerHTML: {
|
|
18764
18772
|
__html: showMoreMobile
|
|
18765
18773
|
? "".concat(description.slice(0, REVIEWS_DESCRIPTION_MAX_LENGTH_MOBILE), "... <a id=\"see-more-").concat(randomId, "\" class=\"see-more\">See more</a>")
|
|
18766
18774
|
: description,
|