@trafilea/afrodita-components 1.0.3 → 1.0.4

package/build/index.esm.js

@@ -5935,7 +5935,7 @@ var Container$e = newStyled.div(templateObject_1$e || (templateObject_1$e = __ma
     var size = _a.size;
     return (_b = getStylesBySize$8(size)) === null || _b === void 0 ? void 0 : _b.height;
 });
-var H3 = newStyled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n  color: ", ";\n  font-weight: bold;\n  text-transform: uppercase;\n  margin: 0;\n  font-size: ", ";\n  line-height: ", ";\n"], ["\n  color: ", ";\n  font-weight: bold;\n  text-transform: uppercase;\n  margin: 0;\n  font-size: ", ";\n  line-height: ", ";\n"])), function (_a) {
+var H3 = newStyled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n  color: ", ";\n  font-weight: bold;\n  margin: 0;\n  font-size: ", ";\n  line-height: ", ";\n"], ["\n  color: ", ";\n  font-weight: bold;\n  margin: 0;\n  font-size: ", ";\n  line-height: ", ";\n"])), function (_a) {
     var textColor = _a.textColor;
     return textColor;
 }, function (_a) {
@@ -5950,7 +5950,7 @@ var H3 = newStyled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplate
 var DiscountTag = function (_a) {
     var discount = _a.discount, offText = _a.offText, disabled = _a.disabled, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#fff' : _b, _c = _a.borderColor, borderColor = _c === void 0 ? 'transparent' : _c, _d = _a.textColor, textColor = _d === void 0 ? '#fff' : _d, _e = _a.size, size = _e === void 0 ? ComponentSize.Medium : _e;
     var theme = useTheme();
-    return (jsx$1(Container$e, __assign({ backgroundColor: disabled ? theme.shades.gray050 : backgroundColor, borderColor: disabled ? theme.shades.gray050 : borderColor, size: size, "data-testid": "discount-container" }, { children: jsxs$1(H3, __assign({ textColor: disabled ? theme.shades.gray250 : textColor, size: size }, { children: [discount, "% ", offText.toUpperCase()] }), void 0) }), void 0));
+    return (jsx$1(Container$e, __assign({ backgroundColor: disabled ? theme.shades.gray050 : backgroundColor, borderColor: disabled ? theme.shades.gray050 : borderColor, size: size, "data-testid": "discount-container" }, { children: jsxs$1(H3, __assign({ textColor: disabled ? theme.shades.gray250 : textColor, size: size }, { children: [discount, "% ", offText] }), void 0) }), void 0));
 };
 var templateObject_1$e, templateObject_2$a;
 
@@ -6179,6 +6179,9 @@ var ProductGallery = function (_a) {
     var images = _a.images, selectedValue = _a.selectedValue, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, productImageDataTestId = _a.productImageDataTestId, previewListDataTestId = _a.previewListDataTestId;
     var initialValue = selectedValue && images.includes(selectedValue) ? selectedValue : images[0];
     var _b = useState(initialValue), selectedImage = _b[0], setSelectedImage = _b[1];
+    useEffect(function () {
+        setSelectedImage(initialValue);
+    }, [initialValue]);
     return (jsxs$1(Container$a, { children: [jsx$1(ImagePreviewList, { images: images, selectedImage: selectedImage, dataTestId: previewListDataTestId, onClick: function (value) {
                     setSelectedImage(value);
                 } }, void 0), jsx$1(ImageProductWithTags, { image: selectedImage, DiscountTagElement: DiscountTagElement, BestSellerTagElement: BestSellerTagElement, dataTestId: productImageDataTestId }, void 0)] }, void 0));
@@ -6269,7 +6272,7 @@ var Rating = function (_a) {
                 } }, { children: [reviews, " ", reviewsText] }), void 0)] }), void 0));
 };
 
-var Container$9 = newStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n  display: flex;\n  font-size: 0.88rem;\n"], ["\n  display: flex;\n  font-size: 0.88rem;\n"])));
+var Container$9 = newStyled.div(templateObject_1$7 || (templateObject_1$7 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"], ["\n  display: flex;\n  align-items: center;\n  font-size: 0.88rem;\n"])));
 var P = newStyled.p(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n  margin: 0 0.25rem;\n  font-weight: 700;\n  color: ", ";\n"], ["\n  margin: 0 0.25rem;\n  font-weight: 700;\n  color: ", ";\n"])), function (props) { return props.theme.shades.gray550; });
 var textButtonStyles = function (theme) { return ({
     border: 'none',
@@ -6283,7 +6286,7 @@ var textButtonStyles = function (theme) { return ({
 var FitPredictor = function (_a) {
     var onClick = _a.onClick;
     var theme = useTheme();
-    return (jsxs(Container$9, __assign({ theme: theme }, { children: [jsx("span", { children: jsx(Icon.FitPredictor, { width: 1.125, height: 1.125, fill: theme.shades.gray550 }, void 0) }, void 0), jsx(P, __assign({ theme: theme }, { children: "FIT PREDICTOR" }), void 0), jsx(BaseButton, __assign({ css: textButtonStyles(theme), onClick: onClick }, { children: "Calculate your size" }), void 0)] }), void 0));
+    return (jsxs(Container$9, __assign({ theme: theme }, { children: [jsx(Container$9, { children: jsx(Icon.FitPredictor, { width: 1.125, height: 1.125, fill: theme.shades.gray550 }, void 0) }, void 0), jsx(P, __assign({ theme: theme }, { children: "FIT PREDICTOR" }), void 0), jsx(BaseButton, __assign({ css: textButtonStyles(theme), onClick: onClick }, { children: "Calculate your size" }), void 0)] }), void 0));
 };
 var templateObject_1$7, templateObject_2$5;
 
@@ -6879,7 +6882,7 @@ var Text = newStyled.h4(templateObject_3$1 || (templateObject_3$1 = __makeTempla
 var Minimalistic = function (_a) {
     var _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#FCFAF7' : _b, _c = _a.borderColor, borderColor = _c === void 0 ? '#E7C9B2' : _c, originalPrice = _a.originalPrice, price = _a.price, getMorePayLessText = _a.getMorePayLessText, youAreSavingText = _a.youAreSavingText, getQtyForText = _a.getQtyForText, discount = _a.discount, offText = _a.offText, _d = _a.widthAuto, widthAuto = _d === void 0 ? false : _d;
     var theme = useTheme();
-    return (jsx$1(Card$1, __assign({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxs$1(Wrapper, { children: [jsxs$1(Container$2, __assign({ "data-testid": "TopSection" }, { children: [jsx$1(Text, __assign({ color: theme.palette.secondary.default, weight: "600", margin: "0 1.25rem 0 0" }, { children: getMorePayLessText }), void 0), jsx$1(PriceLabel, { finalPrice: price, originalPrice: originalPrice, color: "#3A3A3A", size: ComponentSize.Small }, void 0)] }), void 0), jsxs$1(Container$2, __assign({ "data-testid": "BottomSection" }, { children: [jsxs$1(Text, __assign({ color: "#d3373c", weight: "600", margin: "0 1.25rem 0 0" }, { children: [getQtyForText, " ", discount, "% ", offText.toUpperCase()] }), void 0), jsxs$1(Text, __assign({ color: theme.palette.secondary.default }, { children: [youAreSavingText, ": $", decimalFormat(originalPrice - price)] }), void 0)] }), void 0)] }, void 0) }), void 0));
+    return (jsx$1(Card$1, __assign({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxs$1(Wrapper, { children: [jsxs$1(Container$2, __assign({ "data-testid": "TopSection" }, { children: [jsx$1(Text, __assign({ color: theme.palette.secondary.default, weight: "600", margin: "0 1.25rem 0 0" }, { children: getMorePayLessText }), void 0), jsx$1(PriceLabel, { finalPrice: price, originalPrice: originalPrice, color: "#3A3A3A", size: ComponentSize.Small }, void 0)] }), void 0), jsxs$1(Container$2, __assign({ "data-testid": "BottomSection" }, { children: [jsxs$1(Text, __assign({ color: "#d3373c", weight: "600", margin: "0 1.25rem 0 0" }, { children: [getQtyForText, " ", discount, "% ", offText] }), void 0), jsxs$1(Text, __assign({ color: theme.palette.secondary.default }, { children: [youAreSavingText, ": $", decimalFormat(originalPrice - price)] }), void 0)] }), void 0)] }, void 0) }), void 0));
 };
 var templateObject_1$2, templateObject_2$1, templateObject_3$1;
 
@@ -6972,7 +6975,7 @@ var getStylesBySize = function (size) {
 var SeasonOfferTag = function (_a) {
     var text = _a.text, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#C64844' : _b, size = _a.size, className = _a.className;
     var stylesBySize = getStylesBySize(size);
-    return (jsx(Tag, { css: __assign({ backgroundColor: backgroundColor, fontWeight: 700, textTransform: 'uppercase', color: '#FFFFFF' }, stylesBySize), text: text, className: className }, void 0));
+    return (jsx(Tag, { css: __assign({ backgroundColor: backgroundColor, fontWeight: 700, color: '#FFFFFF' }, stylesBySize), text: text, className: className }, void 0));
 };
 
 export { Accordion$1 as Accordion, AccordionBox, AccordionIcon, Bundle, ButtonPrimary, ButtonSecondary, ButtonSecondaryOutline, Card$1 as Card, CardSectionType, CategoryTag, Checkbox, ComponentPosition, ComponentSize, DiscountTag, Dropdown, FitPredictor, Icon, IconButton, MultiColorPicker, PriceLabel, ProductGallery, ProgressBar, RadioGroupInput, Rating, SeasonOfferTag, SingleColorPicker, SizeFitGuide, SizeSelector, TextButton, ThemeProvider, Tooltip };