@trafilea/afrodita-components 1.0.3 → 1.0.4
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 +9 -6
- package/build/index.esm.js.map +1 -1
- package/build/index.js +9 -6
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -5943,7 +5943,7 @@ var Container$e = newStyled.div(templateObject_1$e || (templateObject_1$e = __ma
|
|
|
5943
5943
|
var size = _a.size;
|
|
5944
5944
|
return (_b = getStylesBySize$8(size)) === null || _b === void 0 ? void 0 : _b.height;
|
|
5945
5945
|
});
|
|
5946
|
-
var H3 = newStyled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n color: ", ";\n font-weight: bold;\n
|
|
5946
|
+
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) {
|
|
5947
5947
|
var textColor = _a.textColor;
|
|
5948
5948
|
return textColor;
|
|
5949
5949
|
}, function (_a) {
|
|
@@ -5958,7 +5958,7 @@ var H3 = newStyled.h3(templateObject_2$a || (templateObject_2$a = __makeTemplate
|
|
|
5958
5958
|
var DiscountTag = function (_a) {
|
|
5959
5959
|
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 ? exports.ComponentSize.Medium : _e;
|
|
5960
5960
|
var theme = useTheme();
|
|
5961
|
-
return (jsxRuntime.jsx(Container$e, __assign({ backgroundColor: disabled ? theme.shades.gray050 : backgroundColor, borderColor: disabled ? theme.shades.gray050 : borderColor, size: size, "data-testid": "discount-container" }, { children: jsxRuntime.jsxs(H3, __assign({ textColor: disabled ? theme.shades.gray250 : textColor, size: size }, { children: [discount, "% ", offText
|
|
5961
|
+
return (jsxRuntime.jsx(Container$e, __assign({ backgroundColor: disabled ? theme.shades.gray050 : backgroundColor, borderColor: disabled ? theme.shades.gray050 : borderColor, size: size, "data-testid": "discount-container" }, { children: jsxRuntime.jsxs(H3, __assign({ textColor: disabled ? theme.shades.gray250 : textColor, size: size }, { children: [discount, "% ", offText] }), void 0) }), void 0));
|
|
5962
5962
|
};
|
|
5963
5963
|
var templateObject_1$e, templateObject_2$a;
|
|
5964
5964
|
|
|
@@ -6187,6 +6187,9 @@ var ProductGallery = function (_a) {
|
|
|
6187
6187
|
var images = _a.images, selectedValue = _a.selectedValue, DiscountTagElement = _a.DiscountTagElement, BestSellerTagElement = _a.BestSellerTagElement, productImageDataTestId = _a.productImageDataTestId, previewListDataTestId = _a.previewListDataTestId;
|
|
6188
6188
|
var initialValue = selectedValue && images.includes(selectedValue) ? selectedValue : images[0];
|
|
6189
6189
|
var _b = React.useState(initialValue), selectedImage = _b[0], setSelectedImage = _b[1];
|
|
6190
|
+
React.useEffect(function () {
|
|
6191
|
+
setSelectedImage(initialValue);
|
|
6192
|
+
}, [initialValue]);
|
|
6190
6193
|
return (jsxRuntime.jsxs(Container$a, { children: [jsxRuntime.jsx(ImagePreviewList, { images: images, selectedImage: selectedImage, dataTestId: previewListDataTestId, onClick: function (value) {
|
|
6191
6194
|
setSelectedImage(value);
|
|
6192
6195
|
} }, void 0), jsxRuntime.jsx(ImageProductWithTags, { image: selectedImage, DiscountTagElement: DiscountTagElement, BestSellerTagElement: BestSellerTagElement, dataTestId: productImageDataTestId }, void 0)] }, void 0));
|
|
@@ -6277,7 +6280,7 @@ var Rating = function (_a) {
|
|
|
6277
6280
|
} }, { children: [reviews, " ", reviewsText] }), void 0)] }), void 0));
|
|
6278
6281
|
};
|
|
6279
6282
|
|
|
6280
|
-
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"])));
|
|
6283
|
+
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"])));
|
|
6281
6284
|
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; });
|
|
6282
6285
|
var textButtonStyles = function (theme) { return ({
|
|
6283
6286
|
border: 'none',
|
|
@@ -6291,7 +6294,7 @@ var textButtonStyles = function (theme) { return ({
|
|
|
6291
6294
|
var FitPredictor = function (_a) {
|
|
6292
6295
|
var onClick = _a.onClick;
|
|
6293
6296
|
var theme = useTheme();
|
|
6294
|
-
return (jsxs(Container$9, __assign({ theme: theme }, { children: [jsx(
|
|
6297
|
+
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));
|
|
6295
6298
|
};
|
|
6296
6299
|
var templateObject_1$7, templateObject_2$5;
|
|
6297
6300
|
|
|
@@ -6887,7 +6890,7 @@ var Text = newStyled.h4(templateObject_3$1 || (templateObject_3$1 = __makeTempla
|
|
|
6887
6890
|
var Minimalistic = function (_a) {
|
|
6888
6891
|
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;
|
|
6889
6892
|
var theme = useTheme();
|
|
6890
|
-
return (jsxRuntime.jsx(Card$1, __assign({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxRuntime.jsxs(Wrapper, { children: [jsxRuntime.jsxs(Container$2, __assign({ "data-testid": "TopSection" }, { children: [jsxRuntime.jsx(Text, __assign({ color: theme.palette.secondary.default, weight: "600", margin: "0 1.25rem 0 0" }, { children: getMorePayLessText }), void 0), jsxRuntime.jsx(PriceLabel, { finalPrice: price, originalPrice: originalPrice, color: "#3A3A3A", size: exports.ComponentSize.Small }, void 0)] }), void 0), jsxRuntime.jsxs(Container$2, __assign({ "data-testid": "BottomSection" }, { children: [jsxRuntime.jsxs(Text, __assign({ color: "#d3373c", weight: "600", margin: "0 1.25rem 0 0" }, { children: [getQtyForText, " ", discount, "% ", offText
|
|
6893
|
+
return (jsxRuntime.jsx(Card$1, __assign({ backgroundColor: backgroundColor, widthAuto: widthAuto, border: { borderColor: borderColor, borderWidth: '0.063rem' }, flex: false }, { children: jsxRuntime.jsxs(Wrapper, { children: [jsxRuntime.jsxs(Container$2, __assign({ "data-testid": "TopSection" }, { children: [jsxRuntime.jsx(Text, __assign({ color: theme.palette.secondary.default, weight: "600", margin: "0 1.25rem 0 0" }, { children: getMorePayLessText }), void 0), jsxRuntime.jsx(PriceLabel, { finalPrice: price, originalPrice: originalPrice, color: "#3A3A3A", size: exports.ComponentSize.Small }, void 0)] }), void 0), jsxRuntime.jsxs(Container$2, __assign({ "data-testid": "BottomSection" }, { children: [jsxRuntime.jsxs(Text, __assign({ color: "#d3373c", weight: "600", margin: "0 1.25rem 0 0" }, { children: [getQtyForText, " ", discount, "% ", offText] }), void 0), jsxRuntime.jsxs(Text, __assign({ color: theme.palette.secondary.default }, { children: [youAreSavingText, ": $", decimalFormat(originalPrice - price)] }), void 0)] }), void 0)] }, void 0) }), void 0));
|
|
6891
6894
|
};
|
|
6892
6895
|
var templateObject_1$2, templateObject_2$1, templateObject_3$1;
|
|
6893
6896
|
|
|
@@ -6980,7 +6983,7 @@ var getStylesBySize = function (size) {
|
|
|
6980
6983
|
var SeasonOfferTag = function (_a) {
|
|
6981
6984
|
var text = _a.text, _b = _a.backgroundColor, backgroundColor = _b === void 0 ? '#C64844' : _b, size = _a.size, className = _a.className;
|
|
6982
6985
|
var stylesBySize = getStylesBySize(size);
|
|
6983
|
-
return (jsx(Tag, { css: __assign({ backgroundColor: backgroundColor, fontWeight: 700,
|
|
6986
|
+
return (jsx(Tag, { css: __assign({ backgroundColor: backgroundColor, fontWeight: 700, color: '#FFFFFF' }, stylesBySize), text: text, className: className }, void 0));
|
|
6984
6987
|
};
|
|
6985
6988
|
|
|
6986
6989
|
exports.Accordion = Accordion$1;
|