@trafilea/afrodita-components 5.0.0-beta.182 → 5.0.0-beta.183
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.esm.js +16 -15
- package/build/index.esm.js.map +1 -1
- package/build/index.js +16 -15
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.esm.js
CHANGED
|
@@ -4796,7 +4796,7 @@ var TAGS = {
|
|
|
4796
4796
|
display1: newStyled.h1(templateObject_4$u || (templateObject_4$u = __makeTemplateObject([""], [""]))),
|
|
4797
4797
|
display2: newStyled.h2(templateObject_5$i || (templateObject_5$i = __makeTemplateObject([""], [""]))),
|
|
4798
4798
|
heading1: newStyled.h1(templateObject_6$e || (templateObject_6$e = __makeTemplateObject([""], [""]))),
|
|
4799
|
-
heading2: newStyled.h2(templateObject_7$
|
|
4799
|
+
heading2: newStyled.h2(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject([""], [""]))),
|
|
4800
4800
|
heading3: newStyled.h3(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject([""], [""]))),
|
|
4801
4801
|
heading4: newStyled.h4(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject([""], [""]))),
|
|
4802
4802
|
heading5: newStyled.h5(templateObject_10$3 || (templateObject_10$3 = __makeTemplateObject([""], [""]))),
|
|
@@ -4916,7 +4916,7 @@ var DEFAULTS = {
|
|
|
4916
4916
|
size: 'regular',
|
|
4917
4917
|
},
|
|
4918
4918
|
};
|
|
4919
|
-
var templateObject_1$1l, templateObject_2$T, templateObject_3$H, templateObject_4$u, templateObject_5$i, templateObject_6$e, templateObject_7$
|
|
4919
|
+
var templateObject_1$1l, templateObject_2$T, templateObject_3$H, templateObject_4$u, templateObject_5$i, templateObject_6$e, templateObject_7$9, templateObject_8$6, templateObject_9$3, templateObject_10$3, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2;
|
|
4920
4920
|
|
|
4921
4921
|
var ButtonsContainer = newStyled.div(templateObject_1$1k || (templateObject_1$1k = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin: ", ";\n"], ["\n display: flex;\n flex-direction: row;\n flex-wrap: wrap;\n margin: ", ";\n"])), function (_a) {
|
|
4922
4922
|
var inline = _a.inline;
|
|
@@ -11674,8 +11674,8 @@ var Title$6 = newStyled.h1(templateObject_6$d || (templateObject_6$d = __makeTem
|
|
|
11674
11674
|
var color = _a.color;
|
|
11675
11675
|
return color;
|
|
11676
11676
|
});
|
|
11677
|
-
var IconContainer$5 = newStyled.div(templateObject_7$
|
|
11678
|
-
var templateObject_1$12, templateObject_2$K, templateObject_3$B, templateObject_4$q, templateObject_5$g, templateObject_6$d, templateObject_7$
|
|
11677
|
+
var IconContainer$5 = newStyled.div(templateObject_7$8 || (templateObject_7$8 = __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"])));
|
|
11678
|
+
var templateObject_1$12, templateObject_2$K, templateObject_3$B, templateObject_4$q, templateObject_5$g, templateObject_6$d, templateObject_7$8;
|
|
11679
11679
|
|
|
11680
11680
|
var Tooltip = function (_a) {
|
|
11681
11681
|
var children = _a.children, position = _a.position, content = _a.content, backgroundColor = _a.backgroundColor, _b = _a.align, align = _b === void 0 ? 'center' : _b, maxWidth = _a.maxWidth, onClick = _a.onClick, header = _a.header;
|
|
@@ -12499,7 +12499,7 @@ var SectionTitle = newStyled.h1(templateObject_6$b || (templateObject_6$b = __ma
|
|
|
12499
12499
|
var theme = _a.theme;
|
|
12500
12500
|
return theme.colors.shades['700'].color;
|
|
12501
12501
|
});
|
|
12502
|
-
var SectionDetails = newStyled.p(templateObject_7$
|
|
12502
|
+
var SectionDetails = newStyled.p(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n color: ", ";\n font-size: 1rem;\n line-height: 1.25rem;\n font-weight: 400;\n margin: 0;\n margin-top: 0.625rem;\n ", ";\n"], ["\n color: ", ";\n font-size: 1rem;\n line-height: 1.25rem;\n font-weight: 400;\n margin: 0;\n margin-top: 0.625rem;\n ", ";\n"])), function (props) { return props.color; }, function (_a) {
|
|
12503
12503
|
var theme = _a.theme;
|
|
12504
12504
|
return theme.component.deliveryDetails.SectionDetails
|
|
12505
12505
|
? mediaQueries({
|
|
@@ -12513,7 +12513,7 @@ var DeliveryDetails = function (_a) {
|
|
|
12513
12513
|
var theme = useTheme();
|
|
12514
12514
|
return (jsxs$1("div", __assign$1({ "data-testid": "DeliveryDetails" }, { children: [jsx$1(Title$4, __assign$1({ color: theme.colors.pallete.secondary.color }, { children: deliveryDetailsText }), void 0), jsx$1(Line, { backgroundColor: theme.colors.shades['100'].color }, void 0), note && jsx$1(Note, __assign$1({}, note), void 0), jsxs$1(Row$1, __assign$1({ "data-testid": "DD-row", theme: theme }, { children: [jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.PDP.Clock, {}, void 0) }), void 0), arrivingBy.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: arrivingBy.details }), void 0)] }), void 0), jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.Navigation.MapMarker, {}, void 0) }), void 0), shippingTo.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: shippingTo.details }), void 0)] }), void 0), jsxs$1(Col$1, __assign$1({ theme: theme }, { children: [jsxs$1(SectionTitle, __assign$1({ theme: theme }, { children: [jsx$1(IconContainer$2, __assign$1({ theme: theme }, { children: jsx$1(Icon.Messaging.Messenger, {}, void 0) }), void 0), instantOrderUpdate.title] }), void 0), jsx$1(SectionDetails, __assign$1({ color: theme.colors.shades['700'].color }, { children: instantOrderUpdate.details }), void 0), instantOrderUpdate.keepMeUpdated && (jsxs$1(KeepMeUpdated, __assign$1({ onClick: instantOrderUpdate.keepMeUpdated.onClick, borderColor: theme.colors.shades['150'].color }, { children: [jsx$1(Icon.Messaging.Messenger, { width: 1, height: 1, fill: "#0078FF" }, void 0), instantOrderUpdate.keepMeUpdated.title] }), void 0))] }), void 0)] }), void 0)] }), void 0));
|
|
12515
12515
|
};
|
|
12516
|
-
var templateObject_1$N, templateObject_2$x, templateObject_3$t, templateObject_4$k, templateObject_5$d, templateObject_6$b, templateObject_7$
|
|
12516
|
+
var templateObject_1$N, templateObject_2$x, templateObject_3$t, templateObject_4$k, templateObject_5$d, templateObject_6$b, templateObject_7$7, templateObject_8$5;
|
|
12517
12517
|
|
|
12518
12518
|
var Container$y = newStyled.div(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n"], ["\n display: inline-flex;\n align-items: center;\n cursor: pointer;\n user-select: none;\n"])));
|
|
12519
12519
|
var Text$3 = newStyled.p(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 700;\n color: ", ";\n margin-right: 0.313rem;\n"], ["\n margin: 0;\n font-size: 1rem;\n line-height: 1.5rem;\n font-weight: 700;\n color: ", ";\n margin-right: 0.313rem;\n"])), function (props) { return props.color; });
|
|
@@ -12647,7 +12647,7 @@ var Content$1 = newStyled.div(templateObject_3$p || (templateObject_3$p = __make
|
|
|
12647
12647
|
var ReviewContainer$1 = newStyled.div(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin: 0 0 8px 0;\n\n @media (min-width: 768px) {\n margin: 0 0 50px 0;\n }\n"], ["\n display: flex;\n flex-direction: column;\n margin: 0 0 8px 0;\n\n @media (min-width: 768px) {\n margin: 0 0 50px 0;\n }\n"])));
|
|
12648
12648
|
var DateText$1 = newStyled.span(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"], ["\n font-weight: 400;\n font-size: 12px;\n line-height: 16px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"])));
|
|
12649
12649
|
var VariantText = newStyled.div(templateObject_6$a || (templateObject_6$a = __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"])));
|
|
12650
|
-
var ReviewerName$1 = newStyled.h2(templateObject_7$
|
|
12650
|
+
var ReviewerName$1 = newStyled.h2(templateObject_7$6 || (templateObject_7$6 = __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"])));
|
|
12651
12651
|
var ReviewTitle$1 = newStyled.h3(templateObject_8$4 || (templateObject_8$4 = __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"])));
|
|
12652
12652
|
var ReviewDescription$1 = newStyled.p(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n white-space: pre-wrap;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"], ["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n white-space: pre-wrap;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"])));
|
|
12653
12653
|
var ImagesContainer = newStyled.div(templateObject_10$2 || (templateObject_10$2 = __makeTemplateObject(["\n margin-left: 10px;\n text-align: right;\n"], ["\n margin-left: 10px;\n text-align: right;\n"])));
|
|
@@ -12664,7 +12664,7 @@ var Review$1 = function (_a) {
|
|
|
12664
12664
|
var theme = useTheme();
|
|
12665
12665
|
return (jsxs$1(Container$v, { children: [jsxs$1(Heading, __assign$1({ theme: theme }, { children: [jsx$1(ReviewerName$1, __assign$1({ theme: theme }, { children: reviewerName }), void 0), jsx$1(DateText$1, { 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$1, __assign$1({ "data-testid": "review-content", theme: theme }, { children: [jsxs$1(ReviewContainer$1, __assign$1({ theme: theme }, { children: [jsx$1(ReviewTitle$1, __assign$1({ theme: theme }, { children: title }), void 0), jsx$1(ReviewDescription$1, { dangerouslySetInnerHTML: { __html: description } }, void 0), jsxs$1(HelpfulContainerDesktop, { children: [helpfulActionText && helpfulAction && (jsx$1(ButtonSecondaryWrapper, { onClick: function () { return helpfulAction(reviewId); }, text: helpfulActionText, size: ComponentSize.Small }, void 0)), helpfulCount && 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, { src: image.src, alt: image.alt, height: "10rem" }, 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 && jsxs$1(HelpfulText, { children: [helpfulCount, " people found this helpful"] }, void 0)] }, void 0)] }, void 0));
|
|
12666
12666
|
};
|
|
12667
|
-
var templateObject_1$G, templateObject_2$r, templateObject_3$p, templateObject_4$g, templateObject_5$b, templateObject_6$a, templateObject_7$
|
|
12667
|
+
var templateObject_1$G, templateObject_2$r, templateObject_3$p, templateObject_4$g, templateObject_5$b, templateObject_6$a, templateObject_7$6, templateObject_8$4, templateObject_9$2, templateObject_10$2, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1;
|
|
12668
12668
|
|
|
12669
12669
|
var List = newStyled.ul(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n display: flex;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n margin: 0;\n padding: 0;\n"])));
|
|
12670
12670
|
var Item$1 = newStyled.li(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n width: 1.25rem;\n list-style: none;\n margin-right: 1.5rem;\n position: relative;\n line-height: 0;\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n .dropdownWrapper {\n visibility: visible;\n }\n }\n"], ["\n width: 1.25rem;\n list-style: none;\n margin-right: 1.5rem;\n position: relative;\n line-height: 0;\n\n &:last-child {\n margin-right: 0;\n }\n\n &:hover {\n .dropdownWrapper {\n visibility: visible;\n }\n }\n"])));
|
|
@@ -12761,8 +12761,9 @@ var ImageContainer$3 = newStyled.div(function (_a) {
|
|
|
12761
12761
|
});
|
|
12762
12762
|
});
|
|
12763
12763
|
var ImageHoverContainer = newStyled.img(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"], ["\n opacity: 0;\n position: absolute;\n transition: all 0.4s ease-in-out;\n"])));
|
|
12764
|
-
var Container$t = newStyled.a(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width:
|
|
12765
|
-
var
|
|
12764
|
+
var Container$t = newStyled.a(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: 100%;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"])));
|
|
12765
|
+
var ProdCardContainer = newStyled.div(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"], ["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: min-content;\n text-decoration: none;\n\n &:hover .hover__image {\n opacity: 1;\n }\n"])));
|
|
12766
|
+
var Title$2 = newStyled.p(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n text-align: center;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"], ["\n font-size: 0.83rem;\n font-weight: normal;\n line-height: 1.375rem;\n min-height: 2.75rem;\n text-align: center;\n color: ", ";\n margin: 0.25rem 0;\n text-align: ", ";\n"])), function (props) { return props.theme.colors.pallete.secondary.color; }, function (props) { return props.align; });
|
|
12766
12767
|
var getStylesBySize$1 = function (size) {
|
|
12767
12768
|
switch (size) {
|
|
12768
12769
|
case ComponentSize.Medium:
|
|
@@ -12788,9 +12789,9 @@ var getStylesBySize$1 = function (size) {
|
|
|
12788
12789
|
};
|
|
12789
12790
|
}
|
|
12790
12791
|
};
|
|
12791
|
-
var TopTagContainer$2 = newStyled.div(
|
|
12792
|
-
var BottomTagContainer$2 = newStyled.div(
|
|
12793
|
-
var MarginTopContainer = newStyled.div(
|
|
12792
|
+
var TopTagContainer$2 = newStyled.div(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n position: absolute;\n left: 0;\n top: 0;\n width: inherit;\n z-index: 1;\n"], ["\n position: absolute;\n left: 0;\n top: 0;\n width: inherit;\n z-index: 1;\n"])));
|
|
12793
|
+
var BottomTagContainer$2 = newStyled.div(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n position: absolute;\n bottom: 15%;\n left: 0;\n width: inherit;\n z-index: 1;\n"], ["\n position: absolute;\n bottom: 15%;\n left: 0;\n width: inherit;\n z-index: 1;\n"])));
|
|
12794
|
+
var MarginTopContainer = newStyled.div(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n margin-top: 8px;\n"], ["\n margin-top: 8px;\n"])));
|
|
12794
12795
|
var ProductItemMobile = function (_a) {
|
|
12795
12796
|
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.colorPicker, colorPicker = _d === void 0 ? {
|
|
12796
12797
|
display: false,
|
|
@@ -12811,9 +12812,9 @@ var ProductItemMobile = function (_a) {
|
|
|
12811
12812
|
return priceDisplayType === 'styled' ? (jsx(PriceLabelV2, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: ComponentSize.Large, testId: "volume-discount" }, void 0)) : (jsx(PriceLabel, { finalPrice: price.finalPrice, originalPrice: price.originalPrice, finalPriceStyled: false, color: price.color, size: ComponentSize.Medium, testId: "volume-discount" }, void 0));
|
|
12812
12813
|
};
|
|
12813
12814
|
var RatingDisplay = function () { return (jsx(Rating, { size: size === ComponentSize.Large ? ComponentSize.Small : ComponentSize.XSmall, rating: rating.rating, reviews: rating.reviews, reviewsText: "", wrapWithParenthesis: true }, void 0)); };
|
|
12814
|
-
return (jsxs(Container$t, __assign$1({ as: url ? 'a' : 'div', href: url, className:
|
|
12815
|
+
return (jsxs(ProdCardContainer, __assign$1({ className: className, "data-testid": "product-card-container-div" }, { children: [jsxs(Container$t, __assign$1({ as: url ? 'a' : 'div', href: url, className: "picContainer", onClick: onClick }, { children: [!!topTag || !!bottomTag ? (jsxs(ImageContainer$3, __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, { src: image.src, alt: image.alt, width: "100%", height: "100%" }, void 0), jsx(TopTagContainer$2, { children: topTag }, void 0), jsx(BottomTagContainer$2, { children: bottomTag }, void 0)] }), void 0)) : (jsx(Image, { src: image.src, alt: image.alt, width: styles === null || styles === void 0 ? void 0 : styles.width, height: styles === null || styles === void 0 ? void 0 : styles.height }, void 0)), imageHover ? (jsx(ImageHoverContainer, { className: "hover__image", src: imageHover.src, 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$t, __assign$1({ as: url ? 'a' : 'div', href: url, onClick: onClick, className: "textContainer" }, { children: [jsx(Spacing, { size: space }, void 0), jsx(Title$2, __assign$1({ theme: theme, align: alignName }, { children: title }), void 0), jsx(Spacing, { size: space }, void 0), priceAtBottom ? (jsxs(Fragment, { children: [jsx(RatingDisplay, {}, void 0), jsx(Spacing, { size: space }, void 0), jsx(MarginTopContainer, { children: priceLoading ? jsx(SkeletonBox, { height: "20px", width: "140px" }, void 0) : jsx(PriceLabelDisplay, {}, void 0) }, void 0)] }, void 0)) : (jsxs(Fragment, { children: [priceLoading ? jsx(SkeletonBox, { height: "20px", width: "140px" }, void 0) : jsx(PriceLabelDisplay, {}, 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));
|
|
12815
12816
|
};
|
|
12816
|
-
var templateObject_1$B, templateObject_2$o, templateObject_3$m, templateObject_4$d, templateObject_5$8, templateObject_6$7;
|
|
12817
|
+
var templateObject_1$B, templateObject_2$o, templateObject_3$m, templateObject_4$d, templateObject_5$8, templateObject_6$7, templateObject_7$5;
|
|
12817
12818
|
|
|
12818
12819
|
var Container$s = newStyled.div(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n display: flex;\n row-gap: 1.875rem;\n column-gap: 1.875rem;\n flex-wrap: wrap;\n"], ["\n display: flex;\n row-gap: 1.875rem;\n column-gap: 1.875rem;\n flex-wrap: wrap;\n"])));
|
|
12819
12820
|
function withProductGrid(ProductItemComponent, data) {
|