@trafilea/afrodita-components 5.0.0-beta.159 → 5.0.0-beta.160
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 -10
- package/build/index.esm.js.map +1 -1
- package/build/index.js +9 -10
- package/build/index.js.map +1 -1
- package/package.json +1 -1
package/build/index.js
CHANGED
|
@@ -4802,7 +4802,7 @@ var TAGS = {
|
|
|
4802
4802
|
heading5: newStyled.h5(templateObject_10$3 || (templateObject_10$3 = __makeTemplateObject([""], [""]))),
|
|
4803
4803
|
heading6: newStyled.h6(templateObject_11$2 || (templateObject_11$2 = __makeTemplateObject([""], [""]))),
|
|
4804
4804
|
body: newStyled.p(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject([""], [""]))),
|
|
4805
|
-
link: newStyled.a(templateObject_13$
|
|
4805
|
+
link: newStyled.a(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject(["\n cursor: pointer;\n color: inherit;\n text-decoration: ", ";\n "], ["\n cursor: pointer;\n color: inherit;\n text-decoration: ", ";\n "])), function (props) { return (props.underline ? 'underline' : 'none'); }),
|
|
4806
4806
|
button: newStyled.span(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n display: inline-block;\n "], ["\n display: inline-block;\n "]))),
|
|
4807
4807
|
pricing: newStyled.span(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n display: inline-block;\n font-weight: ", ";\n text-decoration: ", ";\n "], ["\n display: inline-block;\n font-weight: ", ";\n text-decoration: ", ";\n "])), function (props) { return (props.original ? 'normal' : 'bold'); }, function (props) { return (props.original ? 'line-through' : 'bold'); }),
|
|
4808
4808
|
label: newStyled.label(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n color: ", " !important;\n "], ["\n color: ", " !important;\n "])), function (_a) {
|
|
@@ -4916,7 +4916,7 @@ var DEFAULTS = {
|
|
|
4916
4916
|
size: 'regular',
|
|
4917
4917
|
},
|
|
4918
4918
|
};
|
|
4919
|
-
var templateObject_1$1f, templateObject_2$Q, templateObject_3$E, templateObject_4$s, templateObject_5$h, templateObject_6$d, templateObject_7$8, templateObject_8$6, templateObject_9$3, templateObject_10$3, templateObject_11$2, templateObject_12$2, templateObject_13$
|
|
4919
|
+
var templateObject_1$1f, templateObject_2$Q, templateObject_3$E, templateObject_4$s, templateObject_5$h, templateObject_6$d, templateObject_7$8, templateObject_8$6, templateObject_9$3, templateObject_10$3, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1;
|
|
4920
4920
|
|
|
4921
4921
|
var ButtonsContainer = newStyled.div(templateObject_1$1e || (templateObject_1$1e = __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;
|
|
@@ -12633,21 +12633,20 @@ var Heading = newStyled.div(templateObject_2$o || (templateObject_2$o = __makeTe
|
|
|
12633
12633
|
var Content$1 = newStyled.div(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n"], ["\n display: flex;\n justify-content: space-between;\n"])));
|
|
12634
12634
|
var ReviewContainer$1 = newStyled.div(templateObject_4$f || (templateObject_4$f = __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"])));
|
|
12635
12635
|
var DateText$1 = newStyled.span(templateObject_5$a || (templateObject_5$a = __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"])));
|
|
12636
|
-
var VariantText = newStyled.div(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n
|
|
12636
|
+
var VariantText = newStyled.div(templateObject_6$9 || (templateObject_6$9 = __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"])));
|
|
12637
12637
|
var ReviewerName$1 = newStyled.h2(templateObject_7$5 || (templateObject_7$5 = __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"])));
|
|
12638
12638
|
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"])));
|
|
12639
12639
|
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\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\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"])));
|
|
12640
12640
|
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"])));
|
|
12641
|
-
var
|
|
12642
|
-
var
|
|
12641
|
+
var Images = newStyled.div(templateObject_11$1 || (templateObject_11$1 = __makeTemplateObject(["\n display: flex;\n justify-content: end;\n"], ["\n display: flex;\n justify-content: end;\n"])));
|
|
12642
|
+
var ImageSpace = newStyled.div(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n width: 7.5rem;\n height: 4.125rem;\n"], ["\n width: 7.5rem;\n height: 4.125rem;\n"])));
|
|
12643
|
+
var ImageWrapper$2 = newStyled.div(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject(["\n cursor: zoom-in;\n display: none;\n margin-right: 4px;\n\n &:first-child {\n display: inline-block;\n }\n\n @media (min-width: 1024px) {\n display: inline-block;\n }\n"], ["\n cursor: zoom-in;\n display: none;\n margin-right: 4px;\n\n &:first-child {\n display: inline-block;\n }\n\n @media (min-width: 1024px) {\n display: inline-block;\n }\n"])));
|
|
12643
12644
|
var Review$1 = function (_a) {
|
|
12644
12645
|
var 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;
|
|
12645
12646
|
var theme = useTheme();
|
|
12646
|
-
return (jsxRuntime.jsxs(Container$r, { children: [jsxRuntime.jsxs(Heading, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(ReviewerName$1, __assign$1({ theme: theme }, { children: reviewerName }), void 0), jsxRuntime.jsx(DateText$1, { children: formatDate(date) }, void 0)] }), void 0), jsxRuntime.jsx(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsxRuntime.jsxs(Content$1, __assign$1({ "data-testid": "review-content", theme: theme }, { children: [jsxRuntime.jsxs(ReviewContainer$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(ReviewTitle$1, __assign$1({ theme: theme }, { children: title }), void 0), jsxRuntime.jsx(ReviewDescription$1, { dangerouslySetInnerHTML: { __html: description } }, void 0)] }), void 0), jsxRuntime.jsxs(ImagesContainer, { children: [images &&
|
|
12647
|
-
images.length > 0 &&
|
|
12648
|
-
images.map(function (image) { return (jsxRuntime.jsx(ImageWrapper$2, __assign$1({ onClick: function () { return onClickImage && onClickImage(image.src); } }, { children: jsxRuntime.jsx(Image, { src: image.src, alt: image.alt, width: "7.5rem", height: "10rem" }, void 0) }), image.src)); }), !images || (images.length === 0 && jsxRuntime.jsx(ImageSpace, {}, void 0)), jsxRuntime.jsx(VariantText, { children: reviewVariant }, void 0)] }, void 0)] }), void 0)] }, void 0));
|
|
12647
|
+
return (jsxRuntime.jsxs(Container$r, { children: [jsxRuntime.jsxs(Heading, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(ReviewerName$1, __assign$1({ theme: theme }, { children: reviewerName }), void 0), jsxRuntime.jsx(DateText$1, { children: formatDate(date) }, void 0)] }), void 0), jsxRuntime.jsx(StarList, { starsNumber: 5, rating: rating, fill: stars.color, size: stars.size }, void 0), jsxRuntime.jsxs(Content$1, __assign$1({ "data-testid": "review-content", theme: theme }, { children: [jsxRuntime.jsxs(ReviewContainer$1, __assign$1({ theme: theme }, { children: [jsxRuntime.jsx(ReviewTitle$1, __assign$1({ theme: theme }, { children: title }), void 0), jsxRuntime.jsx(ReviewDescription$1, { dangerouslySetInnerHTML: { __html: description } }, void 0)] }), void 0), jsxRuntime.jsxs(ImagesContainer, { children: [jsxRuntime.jsxs(Images, { children: [images === null || images === void 0 ? void 0 : images.map(function (image) { return (jsxRuntime.jsx(ImageWrapper$2, __assign$1({ onClick: function () { return onClickImage && onClickImage(image.src); } }, { children: jsxRuntime.jsx(Image, { src: image.src, alt: image.alt, width: "7.5rem", height: "10rem" }, void 0) }), image.src)); }), !images || (images.length === 0 && jsxRuntime.jsx(ImageSpace, {}, void 0))] }, void 0), jsxRuntime.jsx(VariantText, { children: reviewVariant }, void 0)] }, void 0)] }), void 0)] }, void 0));
|
|
12649
12648
|
};
|
|
12650
|
-
var templateObject_1$A, templateObject_2$o, templateObject_3$m, templateObject_4$f, templateObject_5$a, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2, templateObject_10$2, templateObject_11$1, templateObject_12$1;
|
|
12649
|
+
var templateObject_1$A, templateObject_2$o, templateObject_3$m, templateObject_4$f, templateObject_5$a, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2, templateObject_10$2, templateObject_11$1, templateObject_12$1, templateObject_13$1;
|
|
12651
12650
|
|
|
12652
12651
|
var List = newStyled.ul(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n display: flex;\n margin: 0;\n padding: 0;\n"], ["\n display: flex;\n margin: 0;\n padding: 0;\n"])));
|
|
12653
12652
|
var Item$1 = newStyled.li(templateObject_2$n || (templateObject_2$n = __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"])));
|
|
@@ -17853,7 +17852,7 @@ var ProductContainer = newStyled.div(templateObject_13 || (templateObject_13 = _
|
|
|
17853
17852
|
var ProductTitle = newStyled.div(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n align-items: center;\n margin-top: 10px;\n margin-bottom: 15px;\n font-size: 12px;\n line-height: 16px;\n text-align: center;\n max-width: 192px;\n"], ["\n align-items: center;\n margin-top: 10px;\n margin-bottom: 15px;\n font-size: 12px;\n line-height: 16px;\n text-align: center;\n max-width: 192px;\n"])));
|
|
17854
17853
|
var ProductImage = newStyled(Image)(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n max-height: 100px;\n height: auto;\n width: auto;\n"], ["\n max-height: 100px;\n height: auto;\n width: auto;\n"])));
|
|
17855
17854
|
var ProductImageWrapper = newStyled.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n display: inline-block;\n padding: 10px;\n border: 1px solid #ececec;\n line-height: 0;\n text-align: center;\n width: 100%;\n box-sizing: border-box !important;\n max-width: 192px;\n"], ["\n display: inline-block;\n padding: 10px;\n border: 1px solid #ececec;\n line-height: 0;\n text-align: center;\n width: 100%;\n box-sizing: border-box !important;\n max-width: 192px;\n"])));
|
|
17856
|
-
var DescriptionContainer = newStyled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject([""], [""])));
|
|
17855
|
+
var DescriptionContainer = newStyled.div(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"], ["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"])));
|
|
17857
17856
|
var CloseButton = newStyled.span(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n cursor: pointer;\n display: inline-block;\n position: absolute;\n background: #fff;\n color: #000;\n box-shadow: none;\n opacity: 0.8;\n top: 0;\n right: 0;\n z-index: 3;\n font-size: 0;\n line-height: 30px;\n text-align: center;\n width: 45px;\n height: 50px;\n font-weight: 400;\n float: right;\n\n &::before {\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n top: 50%;\n left: 0;\n margin-top: -1px;\n background: #000;\n transform: rotate(-45deg);\n }\n\n &::after {\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n top: 50%;\n left: 0;\n margin-top: -1px;\n background: #000;\n transform: rotate(45deg);\n }\n"], ["\n cursor: pointer;\n display: inline-block;\n position: absolute;\n background: #fff;\n color: #000;\n box-shadow: none;\n opacity: 0.8;\n top: 0;\n right: 0;\n z-index: 3;\n font-size: 0;\n line-height: 30px;\n text-align: center;\n width: 45px;\n height: 50px;\n font-weight: 400;\n float: right;\n\n &::before {\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n top: 50%;\n left: 0;\n margin-top: -1px;\n background: #000;\n transform: rotate(-45deg);\n }\n\n &::after {\n content: '';\n position: absolute;\n height: 1px;\n width: 100%;\n top: 50%;\n left: 0;\n margin-top: -1px;\n background: #000;\n transform: rotate(45deg);\n }\n"])));
|
|
17858
17857
|
var Review = function (_a) {
|
|
17859
17858
|
var reviewerName = _a.reviewerName, date = _a.date, rating = _a.rating, stars = _a.stars, title = _a.title, description = _a.description, image = _a.image, modalId = _a.modalId, _b = _a.maxFullScreen, maxFullScreen = _b === void 0 ? false : _b, verified = _a.verified, productImage = _a.productImage, productTitle = _a.productTitle, productLink = _a.productLink;
|