@trafilea/afrodita-components 7.27.9 → 7.27.10
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/es/components/review/Review.js +1 -1
- package/build/es/components/review-detail/ReviewDetail.js +1 -1
- package/build/es/components/reviews-header/ReviewsHeader.js +1 -1
- package/build/index.d.ts +5 -2
- package/build/lib/components/review/Review.js +1 -1
- package/build/lib/components/review-detail/ReviewDetail.js +1 -1
- package/build/lib/components/reviews-header/ReviewsHeader.js +1 -1
- package/package.json +1 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__makeTemplateObject as n,__assign as i}from"tslib";import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"@emotion/styled";import{useState as r,useEffect as l}from"react";import{ComponentSize as a}from"../../types/enums.js";import{DateFormat as d,formatDate as p}from"../../utils/dateFormatter/dateFormatter.js";import{Image as h}from"../atoms/Image/Image.js";import"@emotion/react/jsx-runtime";import"../../core/theme/Theme.js";import"../cta/styled.js";import s from"../cta/secondary/ButtonSecondary.js";import{StarList as
|
|
1
|
+
import{__makeTemplateObject as n,__assign as i}from"tslib";import{jsxs as e,jsx as t}from"react/jsx-runtime";import o from"@emotion/styled";import{useState as r,useEffect as l}from"react";import{ComponentSize as a}from"../../types/enums.js";import{DateFormat as d,formatDate as p}from"../../utils/dateFormatter/dateFormatter.js";import{Image as h}from"../atoms/Image/Image.js";import"@emotion/react/jsx-runtime";import"../../core/theme/Theme.js";import"../cta/styled.js";import s from"../cta/secondary/ButtonSecondary.js";import{StarList as m}from"../rating/starList/StarList.js";var c,x,f,g,w,v,u,y,z,b,j,k,S,M,T,C,I,L,A,D=o.div(c||(c=n(["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"],["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"]))),E=o.div(x||(x=n(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n font-size: 14px;\n line-height: 22px;\n text-align: right;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"],["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n font-size: 14px;\n line-height: 22px;\n text-align: right;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"]))),_=o.div(f||(f=n(["\n display: flex;\n justify-content: space-between;\n"],["\n display: flex;\n justify-content: space-between;\n"]))),F=o.div(g||(g=n(["\n display: flex;\n flex-direction: column;\n"],["\n display: flex;\n flex-direction: column;\n"]))),H=o.span(w||(w=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"],["\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=o.div(v||(v=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"],["\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"]))),Y=o.h2(u||(u=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"],["\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"]))),q=o.h3(y||(y=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"],["\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"]))),B=o.div(z||(z=n(["\n display: none;\n\n @media (min-width: 768px) {\n display: block;\n font-weight: normal;\n font-size: 16px;\n line-height: 24px;\n margin: 0;\n white-space: pre-wrap;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n }\n"],["\n display: none;\n\n @media (min-width: 768px) {\n display: block;\n font-weight: normal;\n font-size: 16px;\n line-height: 24px;\n margin: 0;\n white-space: pre-wrap;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n }\n"]))),V=o.div(b||(b=n(["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n display: none;\n }\n"],["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n display: none;\n }\n"]))),W=o.div(j||(j=n(["\n margin-left: 10px;\n text-align: right;\n"],["\n margin-left: 10px;\n text-align: right;\n"]))),G=o.div(k||(k=n(["\n display: flex;\n justify-content: end;\n"],["\n display: flex;\n justify-content: end;\n"]))),J=o.div(S||(S=n(["\n width: 7.5rem;\n height: 4.125rem;\n"],["\n width: 7.5rem;\n height: 4.125rem;\n"]))),K=o.div(M||(M=n(["\n cursor: zoom-in;\n display: none;\n margin-right: 4px;\n\n &:first-child {\n display: inline-block;\n }\n\n & img {\n object-fit: cover;\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 & img {\n object-fit: cover;\n }\n\n @media (min-width: 1024px) {\n display: inline-block;\n }\n"]))),O=o.div(T||(T=n(["\n display: flex;\n margin-top: ",";\n\n @media (max-width: 768px) {\n display: none;\n }\n"],["\n display: flex;\n margin-top: ",";\n\n @media (max-width: 768px) {\n display: none;\n }\n"])),(function(n){return n.showMoreDesktop?"12px":"50px"})),P=o.div(C||(C=n(["\n display: none;\n\n @media (max-width: 768px) {\n margin-top: 10px;\n display: flex;\n }\n"],["\n display: none;\n\n @media (max-width: 768px) {\n margin-top: 10px;\n display: flex;\n }\n"]))),Q=o.div(I||(I=n(["\n font-size: 14px;\n line-height: 34px;\n font-weight: 600;\n color: #d4605b;\n"],["\n font-size: 14px;\n line-height: 34px;\n font-weight: 600;\n color: #d4605b;\n"]))),R=o.i(L||(L=n(["\n content: '\f164';\n"],["\n content: '\\f164';\n"]))),U=o(s)(A||(A=n(["\n margin-right: 15px;\n"],["\n margin-right: 15px;\n"]))),X=function(n){var o=n.reviewId,s=n.reviewerName,c=n.reviewerNameAs,x=void 0===c?"h2":c,f=n.reviewTitleAs,g=void 0===f?"h3":f,w=n.date,v=n.dateFormat,u=void 0===v?d.DDMMYY:v,y=n.rating,z=n.stars,b=n.title,j=n.description,k=n.images,S=n.reviewVariant,M=n.onClickImage,T=n.helpfulActionText,C=n.helpfulAction,I=n.helpfulCount,L=n.hasTextWhenHelpfulCount0,A=void 0!==L&&L,X=n.seeMoreText,Z=void 0===X?"See more":X,$=n.helpfulSuffixText,nn=void 0===$?" people found this helpful":$,en=n.locale,tn=Math.random().toString(36).substring(7),on=r(j.length>168),rn=on[0],ln=on[1],an=r(j.length>500),dn=an[0],pn=an[1];return l((function(){var n=document.querySelectorAll("#see-more-".concat(tn)),i=function(){ln(!1),pn(!1)};return n.forEach((function(n){n.addEventListener("click",i)})),function(){n.forEach((function(n){n.removeEventListener("click",i)}))}}),[tn]),e(D,{children:[e(E,{children:[t(Y,i({as:x},{children:s}),void 0),t(H,{children:p(w,u,en)},void 0)]},void 0),t(m,{starsNumber:5,rating:y,fill:z.color,size:z.size},void 0),e(_,i({"data-testid":"review-content"},{children:[e(F,{children:[b?t(q,i({as:g},{children:b}),void 0):null,t(V,{dangerouslySetInnerHTML:{__html:rn?"".concat(j.slice(0,168),'... <a id="see-more-').concat(tn,'" class="see-more">').concat(Z,"</a>"):j}},void 0),t(B,{dangerouslySetInnerHTML:{__html:dn?"".concat(j.slice(0,500),'... <a id="see-more-').concat(tn,'" class="see-more">').concat(Z,"</a>"):j}},void 0),e(O,i({showMoreDesktop:j.length>500},{children:[T&&C&&t(U,{onClick:function(){return C(o)},text:T,size:a.Small},void 0),(I||A&&0===I)&&e(Q,{children:[I,nn]},void 0)]}),void 0)]},void 0),e(W,{children:[e(G,{children:[null==k?void 0:k.map((function(n){return t(K,i({onClick:function(){return null==M?void 0:M(n.src)}},{children:t(h,{src:n.src,alt:n.alt,height:"10rem",width:"7.5rem"},void 0)}),n.src)})),!k||0===k.length&&t(J,{},void 0)]},void 0),t(N,{children:S},void 0)]},void 0)]}),void 0),t(R,{},void 0),e(P,{children:[T&&C&&t(U,{onClick:function(){return C(o)},text:T,size:a.Small},void 0),(I||A&&0===I)&&e(Q,{children:[I,nn]},void 0)]},void 0)]},void 0)};export{X as default};
|
|
2
2
|
//# sourceMappingURL=Review.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__makeTemplateObject as n,__assign as i}from"tslib";import{jsx as t,jsxs as e}from"react/jsx-runtime";import o from"@emotion/styled";import{useRef as d,useEffect as r}from"react";import{DateFormat as a,formatDate as l}from"../../utils/dateFormatter/dateFormatter.js";import{Image as p}from"../atoms/Image/Image.js";import{Icon as h}from"../icons/index.js";import{useModal as c,Modal as x}from"../modal/Modal.js";import{StarList as m}from"../rating/starList/StarList.js";var g,s,f,u,w,v,b,y,k,z,j,C,I,F,L,M,S,T,D,H,A,N,Y,_=o.div(g||(g=n(["\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"]))),B=o.div(s||(s=n(["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"],["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"]))),U=o.div(f||(f=n(["\n display: flex;\n justify-content: space-between;\n"],["\n display: flex;\n justify-content: space-between;\n"]))),V=o.div(u||(u=n(["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"],["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"]))),X=o.span(w||(w=n(["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"],["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"]))),q=o.h1(v||(v=n(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"]))),E=o.h1(b||(b=n(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"]))),G=o.h2(y||(y=n(["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"],["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"]))),J=o.div(k||(k=n(["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"],["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"]))),K=o.div(z||(z=n(["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"],["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"]))),O=o(p)(j||(j=n(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),P=o.video(C||(C=n(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),Q=o.div(I||(I=n(["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"],["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"]))),R=o.div(F||(F=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"],["\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"]))),W=o(p)(L||(L=n(["\n max-height: 100px;\n height: auto;\n width: auto;\n"],["\n max-height: 100px;\n height: auto;\n width: auto;\n"]))),Z=o.div(M||(M=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"],["\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"]))),$=o.div(S||(S=n(["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"],["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"]))),nn=o.div(T||(T=n(["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"],["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"]))),tn=o.div(D||(D=n(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),en=o.div(H||(H=n(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),on=o.span(A||(A=n(["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"]))),dn=o.span(N||(N=n(["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"]))),rn=o.span(Y||(Y=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"],["\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"]))),an=function(n){var o=n.reviewId,p=n.reviewerName,g=n.date,s=n.rating,f=n.stars,u=n.title,w=n.description,v=n.image,b=n.modalId,y=n.maxFullScreen,k=void 0!==y&&y,z=n.verified,j=n.productImage,C=n.productTitle,I=n.productLink,F=n.helpfulCount,L=void 0===F?0:F,M=n.helpfulAction,S=n.notHelpfulCount,T=void 0===S?0:S,D=n.notHelpfulAction,H=n.dateFormat,A=void 0===H?a.DDMMYY:H,N=null==v?void 0:v.src.includes("/video"),Y=d(null),an=c(b),ln=an.opened,pn=an.close;return r((function(){Y.current&&(ln?Y.current.play():Y.current.pause())}),[ln]),t(x,i({id:b,maxFullScreen:k,padding:"0"},{children:e(_,{children:[t(rn,i({onClick:pn},{children:"X"}),void 0),t(K,{children:v&&(N?t(P,{ref:Y,src:v.src,width:"100%",controls:!0},void 0):t(O,{src:v.src,alt:v.alt},void 0))},void 0),e($,{children:[ln&&e(q,{children:[p,z&&t(E,{children:"Verified Buyer"},void 0)]},void 0),e(B,i({"data-testid":"review-detail-content"},{children:[e(U,{children:[t(m,{starsNumber:5,rating:s,fill:f.color,size:f.size},void 0),t(X,{children:l(g,A)},void 0)]},void 0),e(V,{children:[t(G,{children:u},void 0),t(J,{dangerouslySetInnerHTML:{__html:w}},void 0)]},void 0),e(nn,{children:[e(tn,i({"data-testid":"helpful-action",onClick:function(){return M?M(o):void 0}},{children:[t(h.Custom.ThumbsUp,{width:1,height:1,fill:"#000"},void 0),t(on,{children:L},void 0)]}),void 0),e(en,i({"data-testid":"not-helpful-action",onClick:function(){return D?D(o):void 0}},{children:[t(h.Custom.ThumbsDown,{width:1,height:1,fill:"#000"},void 0),t(dn,{children:T},void 0)]}),void 0)]},void 0)]}),void 0),j&&I&&e(Q,i({onClick:function(){return window.location.href=I}},{children:[t(Z,{children:t(W,{src:j,alt:"productImage"},void 0)},void 0),t(R,{children:C},void 0)]}),void 0)]},void 0)]},void 0)}),void 0)};export{an as default};
|
|
1
|
+
import{__makeTemplateObject as n,__assign as i}from"tslib";import{jsx as t,jsxs as e}from"react/jsx-runtime";import o from"@emotion/styled";import{useRef as d,useEffect as r}from"react";import{DateFormat as a,formatDate as l}from"../../utils/dateFormatter/dateFormatter.js";import{Image as p}from"../atoms/Image/Image.js";import{Icon as h}from"../icons/index.js";import{useModal as c,Modal as x}from"../modal/Modal.js";import{StarList as m}from"../rating/starList/StarList.js";var g,s,f,u,w,v,b,y,k,z,j,C,I,F,L,M,S,T,D,H,A,N,Y,_=o.div(g||(g=n(["\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"]))),B=o.div(s||(s=n(["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"],["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"]))),U=o.div(f||(f=n(["\n display: flex;\n justify-content: space-between;\n"],["\n display: flex;\n justify-content: space-between;\n"]))),V=o.div(u||(u=n(["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"],["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"]))),X=o.span(w||(w=n(["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"],["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"]))),q=o.h1(v||(v=n(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"]))),E=o.h1(b||(b=n(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"]))),G=o.h2(y||(y=n(["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"],["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"]))),J=o.div(k||(k=n(["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"],["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"]))),K=o.div(z||(z=n(["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"],["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"]))),O=o(p)(j||(j=n(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),P=o.video(C||(C=n(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),Q=o.div(I||(I=n(["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"],["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"]))),R=o.div(F||(F=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"],["\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"]))),W=o(p)(L||(L=n(["\n max-height: 100px;\n height: auto;\n width: auto;\n"],["\n max-height: 100px;\n height: auto;\n width: auto;\n"]))),Z=o.div(M||(M=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"],["\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"]))),$=o.div(S||(S=n(["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"],["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"]))),nn=o.div(T||(T=n(["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"],["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"]))),tn=o.div(D||(D=n(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),en=o.div(H||(H=n(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),on=o.span(A||(A=n(["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"]))),dn=o.span(N||(N=n(["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"]))),rn=o.span(Y||(Y=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"],["\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"]))),an=function(n){var o=n.reviewId,p=n.reviewerName,g=n.date,s=n.rating,f=n.stars,u=n.title,w=n.description,v=n.image,b=n.modalId,y=n.maxFullScreen,k=void 0!==y&&y,z=n.verified,j=n.productImage,C=n.productTitle,I=n.productLink,F=n.helpfulCount,L=void 0===F?0:F,M=n.helpfulAction,S=n.notHelpfulCount,T=void 0===S?0:S,D=n.notHelpfulAction,H=n.dateFormat,A=void 0===H?a.DDMMYY:H,N=null==v?void 0:v.src.includes("/video"),Y=d(null),an=c(b),ln=an.opened,pn=an.close;return r((function(){Y.current&&(ln?Y.current.play():Y.current.pause())}),[ln]),t(x,i({id:b,maxFullScreen:k,padding:"0"},{children:e(_,{children:[t(rn,i({onClick:pn},{children:"X"}),void 0),t(K,{children:v&&(N?t(P,{ref:Y,src:v.src,width:"100%",controls:!0},void 0):t(O,{src:v.src,alt:v.alt},void 0))},void 0),e($,{children:[ln&&e(q,{children:[p,z&&t(E,{children:"Verified Buyer"},void 0)]},void 0),e(B,i({"data-testid":"review-detail-content"},{children:[e(U,{children:[t(m,{starsNumber:5,rating:s,fill:f.color,size:f.size},void 0),t(X,{children:l(g,A)},void 0)]},void 0),e(V,{children:[u?t(G,{children:u},void 0):null,t(J,{dangerouslySetInnerHTML:{__html:w}},void 0)]},void 0),e(nn,{children:[e(tn,i({"data-testid":"helpful-action",onClick:function(){return M?M(o):void 0}},{children:[t(h.Custom.ThumbsUp,{width:1,height:1,fill:"#000"},void 0),t(on,{children:L},void 0)]}),void 0),e(en,i({"data-testid":"not-helpful-action",onClick:function(){return D?D(o):void 0}},{children:[t(h.Custom.ThumbsDown,{width:1,height:1,fill:"#000"},void 0),t(dn,{children:T},void 0)]}),void 0)]},void 0)]}),void 0),j&&I&&e(Q,i({onClick:function(){return window.location.href=I}},{children:[t(Z,{children:t(W,{src:j,alt:"productImage"},void 0)},void 0),t(R,{children:C},void 0)]}),void 0)]},void 0)]},void 0)}),void 0)};export{an as default};
|
|
2
2
|
//# sourceMappingURL=ReviewDetail.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{__makeTemplateObject as n,__assign as i}from"tslib";import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"@emotion/styled";import{Text as o}from"../text/Text.js";import{useTheme as a}from"../../core/theme/Theme.js";import{ComponentSize as d}from"../../types/enums.js";import{StarList as p}from"../rating/starList/StarList.js";var m,
|
|
1
|
+
import{__makeTemplateObject as n,__assign as i}from"tslib";import{jsxs as e,jsx as t}from"react/jsx-runtime";import r from"@emotion/styled";import{Text as o}from"../text/Text.js";import{useTheme as a}from"../../core/theme/Theme.js";import{ComponentSize as d}from"../../types/enums.js";import{StarList as p}from"../rating/starList/StarList.js";var l,m,x,c,s,g,h,u=r.div(l||(l=n(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"],["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"]))),f=r.div(m||(m=n(["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"],["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"]))),w=r.div(x||(x=n(["\n display: block;\n\n @media (min-width: 768px) {\n display: flex;\n flex-direction: column;\n }\n"],["\n display: block;\n\n @media (min-width: 768px) {\n display: flex;\n flex-direction: column;\n }\n"]))),v=r.div(c||(c=n(["\n display: flex;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n margin-bottom: 0;\n }\n"],["\n display: flex;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n margin-bottom: 0;\n }\n"]))),b=r(o)(s||(s=n(["\n margin-right: 5px;\n padding-top: 6px;\n line-height: 32px;\n\n @media (min-width: 768px) {\n font-size: 42px;\n line-height: 46px;\n }\n"],["\n margin-right: 5px;\n padding-top: 6px;\n line-height: 32px;\n\n @media (min-width: 768px) {\n font-size: 42px;\n line-height: 46px;\n }\n"]))),y=r.div(g||(g=n(["\n display: flex;\n flex-wrap: wrap;\n max-width: 348px;\n gap: 4px;\n justify-content: center;\n\n @media (min-width: 768px) {\n gap: 8px;\n max-width: 360px;\n }\n"],["\n display: flex;\n flex-wrap: wrap;\n max-width: 348px;\n gap: 4px;\n justify-content: center;\n\n @media (min-width: 768px) {\n gap: 8px;\n max-width: 360px;\n }\n"]))),k=r.div(h||(h=n(["\n width: 84px;\n height: 68px;\n background: ",";\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n cursor: zoom-in;\n"],["\n width: 84px;\n height: 68px;\n background: ",";\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n cursor: zoom-in;\n"])),(function(n){var i=n.backgroundUrl;return"url(".concat(i,")")})),z=function(n){var r=n.title,l=void 0===r?"Reviews":r,m=n.titleVariant,x=void 0===m?"heading3":m,c=n.rating,s=n.reviews,g=n.reviewsText,h=n.reviewsSummary,z=n.onClickReview,j=a();return e(u,{children:[t(o,i({variant:x,weight:"bold",style:{margin:"10px 0"}},{children:l}),void 0),e(f,{children:[e(w,{children:[e(v,{children:[t(b,i({variant:"heading3",weight:"bold"},{children:c}),void 0),t(p,{rating:c,size:d.Medium,starsNumber:5,fill:j.component.stars.element.color},void 0)]},void 0),e(o,i({variant:"body",size:"small",weight:"regular",style:{marginBottom:"20px"}},{children:[s," ",g]}),void 0)]},void 0),t(y,{children:h.map((function(n){return t(k,{onClick:function(){return z(n)},backgroundUrl:n,"data-testid":"summary-review-item"},n)}))},void 0)]},void 0)]},void 0)};export{z as default};
|
|
2
2
|
//# sourceMappingURL=ReviewsHeader.js.map
|
package/build/index.d.ts
CHANGED
|
@@ -4002,6 +4002,8 @@ declare const Review$1: ({ reviewId, reviewerName, date, rating, stars, title, d
|
|
|
4002
4002
|
interface ReviewProps {
|
|
4003
4003
|
reviewId: string;
|
|
4004
4004
|
reviewerName: string;
|
|
4005
|
+
reviewerNameAs?: 'h2' | 'h3';
|
|
4006
|
+
reviewTitleAs?: 'h3' | 'strong';
|
|
4005
4007
|
date: Date;
|
|
4006
4008
|
dateFormat?: DateFormatType;
|
|
4007
4009
|
rating: number;
|
|
@@ -4025,17 +4027,18 @@ interface ReviewProps {
|
|
|
4025
4027
|
helpfulSuffixText?: string;
|
|
4026
4028
|
locale?: string;
|
|
4027
4029
|
}
|
|
4028
|
-
declare const Review: ({ reviewId, reviewerName, date, dateFormat, rating, stars, title, description, images, reviewVariant, onClickImage, helpfulActionText, helpfulAction, helpfulCount, hasTextWhenHelpfulCount0, seeMoreText, helpfulSuffixText, locale, }: ReviewProps) => JSX.Element;
|
|
4030
|
+
declare const Review: ({ reviewId, reviewerName, reviewerNameAs, reviewTitleAs, date, dateFormat, rating, stars, title, description, images, reviewVariant, onClickImage, helpfulActionText, helpfulAction, helpfulCount, hasTextWhenHelpfulCount0, seeMoreText, helpfulSuffixText, locale, }: ReviewProps) => JSX.Element;
|
|
4029
4031
|
|
|
4030
4032
|
interface ReviewsHeaderProps {
|
|
4031
4033
|
title?: string;
|
|
4034
|
+
titleVariant?: 'heading2' | 'heading3';
|
|
4032
4035
|
rating: number;
|
|
4033
4036
|
reviews: number;
|
|
4034
4037
|
reviewsText: string;
|
|
4035
4038
|
reviewsSummary: string[];
|
|
4036
4039
|
onClickReview: (reveiw: string) => void;
|
|
4037
4040
|
}
|
|
4038
|
-
declare const ReviewsHeader: ({ title, rating, reviews, reviewsText, reviewsSummary, onClickReview, }: ReviewsHeaderProps) => JSX.Element;
|
|
4041
|
+
declare const ReviewsHeader: ({ title, titleVariant, rating, reviews, reviewsText, reviewsSummary, onClickReview, }: ReviewsHeaderProps) => JSX.Element;
|
|
4039
4042
|
|
|
4040
4043
|
interface ScrollToTopProps {
|
|
4041
4044
|
scrollToTopText: string;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var n=require("tslib"),e=require("react/jsx-runtime"),i=require("@emotion/styled"),t=require("react"),o=require("../../types/enums.js"),a=require("../../utils/dateFormatter/dateFormatter.js"),l=require("../atoms/Image/Image.js");require("@emotion/react/jsx-runtime"),require("../../core/theme/Theme.js"),require("../cta/styled.js");var r=require("../cta/secondary/ButtonSecondary.js"),s=require("../rating/starList/StarList.js");function d(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var p,c,
|
|
1
|
+
"use strict";var n=require("tslib"),e=require("react/jsx-runtime"),i=require("@emotion/styled"),t=require("react"),o=require("../../types/enums.js"),a=require("../../utils/dateFormatter/dateFormatter.js"),l=require("../atoms/Image/Image.js");require("@emotion/react/jsx-runtime"),require("../../core/theme/Theme.js"),require("../cta/styled.js");var r=require("../cta/secondary/ButtonSecondary.js"),s=require("../rating/starList/StarList.js");function d(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var p,m,c,h,x,f,u,g,w,v,j,_,y,b,z,k,T,O,S,q=d(i),C=q.default.div(p||(p=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"],["\n display: flex;\n flex-direction: column;\n width: auto;\n color: #292929;\n"]))),M=q.default.div(m||(m=n.__makeTemplateObject(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n font-size: 14px;\n line-height: 22px;\n text-align: right;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"],["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n width: 100%;\n font-size: 14px;\n line-height: 22px;\n text-align: right;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n font-size: 16px;\n line-height: 24px;\n }\n"]))),I=q.default.div(c||(c=n.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n"],["\n display: flex;\n justify-content: space-between;\n"]))),L=q.default.div(h||(h=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"],["\n display: flex;\n flex-direction: column;\n"]))),D=q.default.span(x||(x=n.__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"]))),A=q.default.div(f||(f=n.__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"]))),E=q.default.h2(u||(u=n.__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"]))),F=q.default.h3(g||(g=n.__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"]))),H=q.default.div(w||(w=n.__makeTemplateObject(["\n display: none;\n\n @media (min-width: 768px) {\n display: block;\n font-weight: normal;\n font-size: 16px;\n line-height: 24px;\n margin: 0;\n white-space: pre-wrap;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n }\n"],["\n display: none;\n\n @media (min-width: 768px) {\n display: block;\n font-weight: normal;\n font-size: 16px;\n line-height: 24px;\n margin: 0;\n white-space: pre-wrap;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n }\n"]))),N=q.default.div(v||(v=n.__makeTemplateObject(["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n display: none;\n }\n"],["\n font-weight: normal;\n font-size: 14px;\n line-height: 22px;\n margin: 0;\n\n a.see-more {\n color: var(--colors-semantic-informative-color);\n text-decoration: underline;\n cursor: pointer;\n font-weight: 600;\n white-space: nowrap;\n }\n\n @media (min-width: 768px) {\n display: none;\n }\n"]))),Y=q.default.div(j||(j=n.__makeTemplateObject(["\n margin-left: 10px;\n text-align: right;\n"],["\n margin-left: 10px;\n text-align: right;\n"]))),B=q.default.div(_||(_=n.__makeTemplateObject(["\n display: flex;\n justify-content: end;\n"],["\n display: flex;\n justify-content: end;\n"]))),V=q.default.div(y||(y=n.__makeTemplateObject(["\n width: 7.5rem;\n height: 4.125rem;\n"],["\n width: 7.5rem;\n height: 4.125rem;\n"]))),W=q.default.div(b||(b=n.__makeTemplateObject(["\n cursor: zoom-in;\n display: none;\n margin-right: 4px;\n\n &:first-child {\n display: inline-block;\n }\n\n & img {\n object-fit: cover;\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 & img {\n object-fit: cover;\n }\n\n @media (min-width: 1024px) {\n display: inline-block;\n }\n"]))),G=q.default.div(z||(z=n.__makeTemplateObject(["\n display: flex;\n margin-top: ",";\n\n @media (max-width: 768px) {\n display: none;\n }\n"],["\n display: flex;\n margin-top: ",";\n\n @media (max-width: 768px) {\n display: none;\n }\n"])),(function(n){return n.showMoreDesktop?"12px":"50px"})),J=q.default.div(k||(k=n.__makeTemplateObject(["\n display: none;\n\n @media (max-width: 768px) {\n margin-top: 10px;\n display: flex;\n }\n"],["\n display: none;\n\n @media (max-width: 768px) {\n margin-top: 10px;\n display: flex;\n }\n"]))),K=q.default.div(T||(T=n.__makeTemplateObject(["\n font-size: 14px;\n line-height: 34px;\n font-weight: 600;\n color: #d4605b;\n"],["\n font-size: 14px;\n line-height: 34px;\n font-weight: 600;\n color: #d4605b;\n"]))),P=q.default.i(O||(O=n.__makeTemplateObject(["\n content: '\f164';\n"],["\n content: '\\f164';\n"]))),Q=q.default(r)(S||(S=n.__makeTemplateObject(["\n margin-right: 15px;\n"],["\n margin-right: 15px;\n"])));module.exports=function(i){var r=i.reviewId,d=i.reviewerName,p=i.reviewerNameAs,m=void 0===p?"h2":p,c=i.reviewTitleAs,h=void 0===c?"h3":c,x=i.date,f=i.dateFormat,u=void 0===f?a.DateFormat.DDMMYY:f,g=i.rating,w=i.stars,v=i.title,j=i.description,_=i.images,y=i.reviewVariant,b=i.onClickImage,z=i.helpfulActionText,k=i.helpfulAction,T=i.helpfulCount,O=i.hasTextWhenHelpfulCount0,S=void 0!==O&&O,q=i.seeMoreText,R=void 0===q?"See more":q,U=i.helpfulSuffixText,X=void 0===U?" people found this helpful":U,Z=i.locale,$=Math.random().toString(36).substring(7),nn=t.useState(j.length>168),en=nn[0],tn=nn[1],on=t.useState(j.length>500),an=on[0],ln=on[1];return t.useEffect((function(){var n=document.querySelectorAll("#see-more-".concat($)),e=function(){tn(!1),ln(!1)};return n.forEach((function(n){n.addEventListener("click",e)})),function(){n.forEach((function(n){n.removeEventListener("click",e)}))}}),[$]),e.jsxs(C,{children:[e.jsxs(M,{children:[e.jsx(E,n.__assign({as:m},{children:d}),void 0),e.jsx(D,{children:a.formatDate(x,u,Z)},void 0)]},void 0),e.jsx(s.StarList,{starsNumber:5,rating:g,fill:w.color,size:w.size},void 0),e.jsxs(I,n.__assign({"data-testid":"review-content"},{children:[e.jsxs(L,{children:[v?e.jsx(F,n.__assign({as:h},{children:v}),void 0):null,e.jsx(N,{dangerouslySetInnerHTML:{__html:en?"".concat(j.slice(0,168),'... <a id="see-more-').concat($,'" class="see-more">').concat(R,"</a>"):j}},void 0),e.jsx(H,{dangerouslySetInnerHTML:{__html:an?"".concat(j.slice(0,500),'... <a id="see-more-').concat($,'" class="see-more">').concat(R,"</a>"):j}},void 0),e.jsxs(G,n.__assign({showMoreDesktop:j.length>500},{children:[z&&k&&e.jsx(Q,{onClick:function(){return k(r)},text:z,size:o.ComponentSize.Small},void 0),(T||S&&0===T)&&e.jsxs(K,{children:[T,X]},void 0)]}),void 0)]},void 0),e.jsxs(Y,{children:[e.jsxs(B,{children:[null==_?void 0:_.map((function(i){return e.jsx(W,n.__assign({onClick:function(){return null==b?void 0:b(i.src)}},{children:e.jsx(l.Image,{src:i.src,alt:i.alt,height:"10rem",width:"7.5rem"},void 0)}),i.src)})),!_||0===_.length&&e.jsx(V,{},void 0)]},void 0),e.jsx(A,{children:y},void 0)]},void 0)]}),void 0),e.jsx(P,{},void 0),e.jsxs(J,{children:[z&&k&&e.jsx(Q,{onClick:function(){return k(r)},text:z,size:o.ComponentSize.Small},void 0),(T||S&&0===T)&&e.jsxs(K,{children:[T,X]},void 0)]},void 0)]},void 0)};
|
|
2
2
|
//# sourceMappingURL=Review.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var n=require("tslib"),i=require("react/jsx-runtime"),e=require("@emotion/styled"),t=require("react"),a=require("../../utils/dateFormatter/dateFormatter.js"),o=require("../atoms/Image/Image.js"),d=require("../icons/index.js"),l=require("../modal/Modal.js"),r=require("../rating/starList/StarList.js");function p(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var c,h,x,m,s,g,f,u,w,b,v,j,_,k,y,z,T,O,I,q,C,F,M,D=p(e),L=D.default.div(c||(c=n.__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"]))),S=D.default.div(h||(h=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"],["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"]))),H=D.default.div(x||(x=n.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n"],["\n display: flex;\n justify-content: space-between;\n"]))),A=D.default.div(m||(m=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"],["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"]))),N=D.default.span(s||(s=n.__makeTemplateObject(["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"],["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"]))),Y=D.default.h1(g||(g=n.__makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"]))),B=D.default.h1(f||(f=n.__makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"]))),E=D.default.h2(u||(u=n.__makeTemplateObject(["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"],["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"]))),R=D.default.div(w||(w=n.__makeTemplateObject(["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"],["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"]))),U=D.default.div(b||(b=n.__makeTemplateObject(["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"],["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"]))),V=D.default(o.Image)(v||(v=n.__makeTemplateObject(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),X=D.default.video(j||(j=n.__makeTemplateObject(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),G=D.default.div(_||(_=n.__makeTemplateObject(["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"],["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"]))),J=D.default.div(k||(k=n.__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"]))),K=D.default(o.Image)(y||(y=n.__makeTemplateObject(["\n max-height: 100px;\n height: auto;\n width: auto;\n"],["\n max-height: 100px;\n height: auto;\n width: auto;\n"]))),P=D.default.div(z||(z=n.__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"]))),Q=D.default.div(T||(T=n.__makeTemplateObject(["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"],["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"]))),W=D.default.div(O||(O=n.__makeTemplateObject(["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"],["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"]))),Z=D.default.div(I||(I=n.__makeTemplateObject(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),$=D.default.div(q||(q=n.__makeTemplateObject(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),nn=D.default.span(C||(C=n.__makeTemplateObject(["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"]))),en=D.default.span(F||(F=n.__makeTemplateObject(["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"]))),tn=D.default.span(M||(M=n.__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"])));module.exports=function(e){var o=e.reviewId,p=e.reviewerName,c=e.date,h=e.rating,x=e.stars,m=e.title,s=e.description,g=e.image,f=e.modalId,u=e.maxFullScreen,w=void 0!==u&&u,b=e.verified,v=e.productImage,j=e.productTitle,_=e.productLink,k=e.helpfulCount,y=void 0===k?0:k,z=e.helpfulAction,T=e.notHelpfulCount,O=void 0===T?0:T,I=e.notHelpfulAction,q=e.dateFormat,C=void 0===q?a.DateFormat.DDMMYY:q,F=null==g?void 0:g.src.includes("/video"),M=t.useRef(null),D=l.useModal(f),an=D.opened,on=D.close;return t.useEffect((function(){M.current&&(an?M.current.play():M.current.pause())}),[an]),i.jsx(l.Modal,n.__assign({id:f,maxFullScreen:w,padding:"0"},{children:i.jsxs(L,{children:[i.jsx(tn,n.__assign({onClick:on},{children:"X"}),void 0),i.jsx(U,{children:g&&(F?i.jsx(X,{ref:M,src:g.src,width:"100%",controls:!0},void 0):i.jsx(V,{src:g.src,alt:g.alt},void 0))},void 0),i.jsxs(Q,{children:[an&&i.jsxs(Y,{children:[p,b&&i.jsx(B,{children:"Verified Buyer"},void 0)]},void 0),i.jsxs(S,n.__assign({"data-testid":"review-detail-content"},{children:[i.jsxs(H,{children:[i.jsx(r.StarList,{starsNumber:5,rating:h,fill:x.color,size:x.size},void 0),i.jsx(N,{children:a.formatDate(c,C)},void 0)]},void 0),i.jsxs(A,{children:[i.jsx(E,{children:m},void 0),i.jsx(R,{dangerouslySetInnerHTML:{__html:s}},void 0)]},void 0),i.jsxs(W,{children:[i.jsxs(Z,n.__assign({"data-testid":"helpful-action",onClick:function(){return z?z(o):void 0}},{children:[i.jsx(d.Icon.Custom.ThumbsUp,{width:1,height:1,fill:"#000"},void 0),i.jsx(nn,{children:y},void 0)]}),void 0),i.jsxs($,n.__assign({"data-testid":"not-helpful-action",onClick:function(){return I?I(o):void 0}},{children:[i.jsx(d.Icon.Custom.ThumbsDown,{width:1,height:1,fill:"#000"},void 0),i.jsx(en,{children:O},void 0)]}),void 0)]},void 0)]}),void 0),v&&_&&i.jsxs(G,n.__assign({onClick:function(){return window.location.href=_}},{children:[i.jsx(P,{children:i.jsx(K,{src:v,alt:"productImage"},void 0)},void 0),i.jsx(J,{children:j},void 0)]}),void 0)]},void 0)]},void 0)}),void 0)};
|
|
1
|
+
"use strict";var n=require("tslib"),i=require("react/jsx-runtime"),e=require("@emotion/styled"),t=require("react"),a=require("../../utils/dateFormatter/dateFormatter.js"),o=require("../atoms/Image/Image.js"),d=require("../icons/index.js"),l=require("../modal/Modal.js"),r=require("../rating/starList/StarList.js");function p(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var c,h,x,m,s,g,f,u,w,b,v,j,_,k,y,z,T,O,I,q,C,F,M,D=p(e),L=D.default.div(c||(c=n.__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"]))),S=D.default.div(h||(h=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"],["\n display: flex;\n flex-direction: column;\n padding: 20px;\n padding-top: 0;\n"]))),H=D.default.div(x||(x=n.__makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n"],["\n display: flex;\n justify-content: space-between;\n"]))),A=D.default.div(m||(m=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"],["\n display: flex;\n flex-direction: column;\n margin-top: 15px;\n margin-bottom: 5px;\n\n @media (min-width: 768px) {\n margin-top: 10px;\n }\n"]))),N=D.default.span(s||(s=n.__makeTemplateObject(["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"],["\n font-weight: 400;\n font-size: 14px;\n line-height: 22px;\n"]))),Y=D.default.h1(g||(g=n.__makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n padding: 20px;\n display: flex;\n"]))),B=D.default.h1(f||(f=n.__makeTemplateObject(["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"],["\n font-weight: 600;\n margin: 0;\n font-size: 18px;\n color: #1cc286;\n margin-left: 6px;\n\n @media (min-width: 768px) {\n font-size: 18px;\n }\n"]))),E=D.default.h2(u||(u=n.__makeTemplateObject(["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"],["\n font-size: 18px;\n line-height: 20px;\n font-weight: 600;\n margin: 0;\n"]))),R=D.default.div(w||(w=n.__makeTemplateObject(["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"],["\n font-weight: normal;\n font-size: 16px;\n margin: 0;\n line-height: 25px;\n word-break: break-word;\n margin-top: 5px;\n white-space: pre-wrap;\n"]))),U=D.default.div(b||(b=n.__makeTemplateObject(["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"],["\n width: 100% !important;\n min-width: 100%;\n height: initial !important;\n min-height: 250px;\n background-size: contain !important;\n margin: 0 !important;\n line-height: 0;\n\n @media (min-width: 768px) {\n width: unset;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n padding: 20px;\n }\n"]))),V=D.default(o.Image)(v||(v=n.__makeTemplateObject(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),X=D.default.video(j||(j=n.__makeTemplateObject(["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"],["\n width: 100%;\n min-width: 50%;\n max-width: 100%;\n background-color: #fff;\n display: inline-block;\n vertical-align: middle;\n max-height: calc(100vh - 100px);\n max-height: calc(100dvh - 100px);\n"]))),G=D.default.div(_||(_=n.__makeTemplateObject(["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"],["\n padding: 20px;\n border-top: 1px solid #eee;\n cursor: pointer;\n"]))),J=D.default.div(k||(k=n.__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"]))),K=D.default(o.Image)(y||(y=n.__makeTemplateObject(["\n max-height: 100px;\n height: auto;\n width: auto;\n"],["\n max-height: 100px;\n height: auto;\n width: auto;\n"]))),P=D.default.div(z||(z=n.__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"]))),Q=D.default.div(T||(T=n.__makeTemplateObject(["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"],["\n @media (min-width: 768px) {\n min-width: 40%;\n }\n"]))),W=D.default.div(O||(O=n.__makeTemplateObject(["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"],["\n display: flex;\n justify-content: end;\n margin-top: 20px;\n"]))),Z=D.default.div(I||(I=n.__makeTemplateObject(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),$=D.default.div(q||(q=n.__makeTemplateObject(["\n display: flex;\n cursor: pointer;\n"],["\n display: flex;\n cursor: pointer;\n"]))),nn=D.default.span(C||(C=n.__makeTemplateObject(["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-right: 15px;\n margin-left: 4px;\n"]))),en=D.default.span(F||(F=n.__makeTemplateObject(["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"],["\n font-size: 15px;\n text-align: right;\n margin-left: 4px;\n"]))),tn=D.default.span(M||(M=n.__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"])));module.exports=function(e){var o=e.reviewId,p=e.reviewerName,c=e.date,h=e.rating,x=e.stars,m=e.title,s=e.description,g=e.image,f=e.modalId,u=e.maxFullScreen,w=void 0!==u&&u,b=e.verified,v=e.productImage,j=e.productTitle,_=e.productLink,k=e.helpfulCount,y=void 0===k?0:k,z=e.helpfulAction,T=e.notHelpfulCount,O=void 0===T?0:T,I=e.notHelpfulAction,q=e.dateFormat,C=void 0===q?a.DateFormat.DDMMYY:q,F=null==g?void 0:g.src.includes("/video"),M=t.useRef(null),D=l.useModal(f),an=D.opened,on=D.close;return t.useEffect((function(){M.current&&(an?M.current.play():M.current.pause())}),[an]),i.jsx(l.Modal,n.__assign({id:f,maxFullScreen:w,padding:"0"},{children:i.jsxs(L,{children:[i.jsx(tn,n.__assign({onClick:on},{children:"X"}),void 0),i.jsx(U,{children:g&&(F?i.jsx(X,{ref:M,src:g.src,width:"100%",controls:!0},void 0):i.jsx(V,{src:g.src,alt:g.alt},void 0))},void 0),i.jsxs(Q,{children:[an&&i.jsxs(Y,{children:[p,b&&i.jsx(B,{children:"Verified Buyer"},void 0)]},void 0),i.jsxs(S,n.__assign({"data-testid":"review-detail-content"},{children:[i.jsxs(H,{children:[i.jsx(r.StarList,{starsNumber:5,rating:h,fill:x.color,size:x.size},void 0),i.jsx(N,{children:a.formatDate(c,C)},void 0)]},void 0),i.jsxs(A,{children:[m?i.jsx(E,{children:m},void 0):null,i.jsx(R,{dangerouslySetInnerHTML:{__html:s}},void 0)]},void 0),i.jsxs(W,{children:[i.jsxs(Z,n.__assign({"data-testid":"helpful-action",onClick:function(){return z?z(o):void 0}},{children:[i.jsx(d.Icon.Custom.ThumbsUp,{width:1,height:1,fill:"#000"},void 0),i.jsx(nn,{children:y},void 0)]}),void 0),i.jsxs($,n.__assign({"data-testid":"not-helpful-action",onClick:function(){return I?I(o):void 0}},{children:[i.jsx(d.Icon.Custom.ThumbsDown,{width:1,height:1,fill:"#000"},void 0),i.jsx(en,{children:O},void 0)]}),void 0)]},void 0)]}),void 0),v&&_&&i.jsxs(G,n.__assign({onClick:function(){return window.location.href=_}},{children:[i.jsx(P,{children:i.jsx(K,{src:v,alt:"productImage"},void 0)},void 0),i.jsx(J,{children:j},void 0)]}),void 0)]},void 0)]},void 0)}),void 0)};
|
|
2
2
|
//# sourceMappingURL=ReviewDetail.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var n=require("tslib"),e=require("react/jsx-runtime"),i=require("@emotion/styled"),t=require("../text/Text.js"),a=require("../../core/theme/Theme.js"),r=require("../../types/enums.js"),d=require("../rating/starList/StarList.js");function l(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,p,m,x,s,c,u,g=l(i),h=g.default.div(o||(o=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"],["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"]))),f=g.default.div(p||(p=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"],["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"]))),w=g.default.div(m||(m=n.__makeTemplateObject(["\n display: block;\n\n @media (min-width: 768px) {\n display: flex;\n flex-direction: column;\n }\n"],["\n display: block;\n\n @media (min-width: 768px) {\n display: flex;\n flex-direction: column;\n }\n"]))),v=g.default.div(x||(x=n.__makeTemplateObject(["\n display: flex;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n margin-bottom: 0;\n }\n"],["\n display: flex;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n margin-bottom: 0;\n }\n"]))),b=g.default(t.Text)(s||(s=n.__makeTemplateObject(["\n margin-right: 5px;\n padding-top: 6px;\n line-height: 32px;\n\n @media (min-width: 768px) {\n font-size: 42px;\n line-height: 46px;\n }\n"],["\n margin-right: 5px;\n padding-top: 6px;\n line-height: 32px;\n\n @media (min-width: 768px) {\n font-size: 42px;\n line-height: 46px;\n }\n"]))),j=g.default.div(c||(c=n.__makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n max-width: 348px;\n gap: 4px;\n justify-content: center;\n\n @media (min-width: 768px) {\n gap: 8px;\n max-width: 360px;\n }\n"],["\n display: flex;\n flex-wrap: wrap;\n max-width: 348px;\n gap: 4px;\n justify-content: center;\n\n @media (min-width: 768px) {\n gap: 8px;\n max-width: 360px;\n }\n"]))),y=g.default.div(u||(u=n.__makeTemplateObject(["\n width: 84px;\n height: 68px;\n background: ",";\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n cursor: zoom-in;\n"],["\n width: 84px;\n height: 68px;\n background: ",";\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n cursor: zoom-in;\n"])),(function(n){var e=n.backgroundUrl;return"url(".concat(e,")")}));module.exports=function(i){var l=i.title,o=void 0===l?"Reviews":l,p=i.
|
|
1
|
+
"use strict";var n=require("tslib"),e=require("react/jsx-runtime"),i=require("@emotion/styled"),t=require("../text/Text.js"),a=require("../../core/theme/Theme.js"),r=require("../../types/enums.js"),d=require("../rating/starList/StarList.js");function l(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,p,m,x,s,c,u,g=l(i),h=g.default.div(o||(o=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"],["\n display: flex;\n flex-direction: column;\n align-items: center;\n width: auto;\n"]))),f=g.default.div(p||(p=n.__makeTemplateObject(["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"],["\n display: flex;\n flex-direction: column;\n text-align: center;\n align-items: center;\n\n @media (min-width: 768px) {\n flex-direction: row;\n gap: 30px;\n }\n"]))),w=g.default.div(m||(m=n.__makeTemplateObject(["\n display: block;\n\n @media (min-width: 768px) {\n display: flex;\n flex-direction: column;\n }\n"],["\n display: block;\n\n @media (min-width: 768px) {\n display: flex;\n flex-direction: column;\n }\n"]))),v=g.default.div(x||(x=n.__makeTemplateObject(["\n display: flex;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n margin-bottom: 0;\n }\n"],["\n display: flex;\n margin-bottom: 10px;\n\n @media (min-width: 768px) {\n margin-bottom: 0;\n }\n"]))),b=g.default(t.Text)(s||(s=n.__makeTemplateObject(["\n margin-right: 5px;\n padding-top: 6px;\n line-height: 32px;\n\n @media (min-width: 768px) {\n font-size: 42px;\n line-height: 46px;\n }\n"],["\n margin-right: 5px;\n padding-top: 6px;\n line-height: 32px;\n\n @media (min-width: 768px) {\n font-size: 42px;\n line-height: 46px;\n }\n"]))),j=g.default.div(c||(c=n.__makeTemplateObject(["\n display: flex;\n flex-wrap: wrap;\n max-width: 348px;\n gap: 4px;\n justify-content: center;\n\n @media (min-width: 768px) {\n gap: 8px;\n max-width: 360px;\n }\n"],["\n display: flex;\n flex-wrap: wrap;\n max-width: 348px;\n gap: 4px;\n justify-content: center;\n\n @media (min-width: 768px) {\n gap: 8px;\n max-width: 360px;\n }\n"]))),y=g.default.div(u||(u=n.__makeTemplateObject(["\n width: 84px;\n height: 68px;\n background: ",";\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n cursor: zoom-in;\n"],["\n width: 84px;\n height: 68px;\n background: ",";\n background-repeat: no-repeat;\n background-size: cover;\n background-position: center;\n cursor: zoom-in;\n"])),(function(n){var e=n.backgroundUrl;return"url(".concat(e,")")}));module.exports=function(i){var l=i.title,o=void 0===l?"Reviews":l,p=i.titleVariant,m=void 0===p?"heading3":p,x=i.rating,s=i.reviews,c=i.reviewsText,u=i.reviewsSummary,g=i.onClickReview,k=a.useTheme();return e.jsxs(h,{children:[e.jsx(t.Text,n.__assign({variant:m,weight:"bold",style:{margin:"10px 0"}},{children:o}),void 0),e.jsxs(f,{children:[e.jsxs(w,{children:[e.jsxs(v,{children:[e.jsx(b,n.__assign({variant:"heading3",weight:"bold"},{children:x}),void 0),e.jsx(d.StarList,{rating:x,size:r.ComponentSize.Medium,starsNumber:5,fill:k.component.stars.element.color},void 0)]},void 0),e.jsxs(t.Text,n.__assign({variant:"body",size:"small",weight:"regular",style:{marginBottom:"20px"}},{children:[s," ",c]}),void 0)]},void 0),e.jsx(j,{children:u.map((function(n){return e.jsx(y,{onClick:function(){return g(n)},backgroundUrl:n,"data-testid":"summary-review-item"},n)}))},void 0)]},void 0)]},void 0)};
|
|
2
2
|
//# sourceMappingURL=ReviewsHeader.js.map
|
package/package.json
CHANGED