https://www.tesa.com/relaunch2020/build/rating-slider.3929eb9b.js

1"use strict";(globalThis.webpackChunktesa_2016=globalThis.webpackChunktesa_2016||[]).push([[6396],{4061:(e,t,l)=>{l.r(t),l.d(t,{default:()=>o});var a=l(5166),i=l(7105),n=l(7651);const r=["aria-describedby","aria-label"],s=["id"],o=Object.assign({name:"FormTooltip"},{__name:"FormTooltip",props:{inline:{type:Boolean,default:!1},inlineToggle:{type:Boolean,default:!0}},setup(e){const t=(0,a.iH)(null),{labelStore:l}=(0,i.b)({labelsRequired:["global"]}),o=(0,a.iH)(`tooltip-${(0,n.Rl)()}`),c=(0,a.iH)(!1),d=(0,a.iH)(0),u=(0,a.iH)(!1);function _(){c.value||(d.value=function(){const e=t.value.getBoundingClientRect();return e.left-24<0?-1*(e.left-24):e.right>document.body.clientWidth-24?document.body.clientWidth-24-e.right:0}(),c.value=!0),u.value=!u.value}function p(){u.value=!1}return(0,a.bv)(()=>{window.addEventListener("resize",()=>{c.value=!1,d.value=0,u.value=!1})}),(i,n)=>{const g=(0,a.up)("icon"),v=(0,a.Q2)("click-outside"),m=(0,a.Q2)("focus-outside");return(0,a.wy)(((0,a.wg)(),(0,a.iD)("span",{class:(0,a.C_)(["form-tooltip",{"form-tooltip--init":c.value,"form-tooltip--inline":e.inline,"form-tooltip--inline-button":e.inlineToggle,"form-tooltip--open":u.value}])},[(0,a.WI)(i.$slots,"toggle",{},()=>[(0,a._)("button",{class:"form-tooltip__button",type:"button","aria-describedby":o.value,"aria-label":(0,a.SU)(l)["global.more_information"],onClick:_,onKeydown:(0,a.D2)(p,["esc"])},[(0,a.Wm)(g,{name:"tooltip"})],40,r)]),n[1]||(n[1]=(0,a.Uk)()),(0,a._)("span",{ref_key:"content",ref:t,id:o.value,role:"tooltip",class:"form-tooltip__content",style:(0,a.j5)({marginLeft:`${d.value}px`})},[(0,a._)("span",{class:"form-tooltip__triangle",ref:"triangle",style:(0,a.j5)({marginLeft:-1*d.value+"px"})},null,4),n[0]||(n[0]=(0,a.Uk)()),(0,a.WI)(i.$slots,"default")],12,s)],2)),[[v,p],[m,p]])}}})},4981:(e,t,l)=>{l.r(t),l.d(t,{default:()=>re});var a=l(5166),i=l(7105),n=l(3635),r=l(4061),s=l(3076);const o={class:"review"},c={class:"copy copy--stage marg-t--3"},d={key:0,class:"copy copy--small c--text-grey marg-t--1"},u={class:"review__byline marg-t--1"},_={class:"marg-t--2 t--keep-line-breaks"},p={key:1,class:"review__comment"},g={class:"t--semibold"},v={class:"marg-t--2 t--keep-line-breaks"},m=Object.assign({name:"RatingSingleReview"},{__name:"RatingSingleReview",props:{title:{type:String,default:null},externalUser:{type:String,default:null},points:{type:Number,default:null},content:{type:String,default:null},comment:{type:String,default:null},createdAt:{type:String,default:null}},setup(e){const{labelStore:t}=(0,i.t)();return(l,i)=>

1((0,a.wg)(),(0,a.iD)("div",o,[(0,a._)("p",c,(0,a.zw)(e.title),1),i[2]||(i[2]=(0,a.Uk)()),e.externalUser?((0,a.wg)(),(0,a.iD)("p",d,(0,a.zw)(e.externalUser),1)):(0,a.kq)("v-if",!0),i[3]||(i[3]=(0,a.Uk)()),(0,a._)("div",u,[(0,a.Wm)((0,a.SU)(n.Z),{rating:e.points,rateable:!1,"show-rating-text":!1,class:"review__stars"},null,8,["rating"]),i[0]||(i[0]=(0,a.Uk)()),(0,a._)("div",null,(0,a.zw)((0,a.SU)(s.qU)(e.createdAt)),1)]),i[4]||(i[4]=(0,a.Uk)()),(0,a._)("div",_,(0,a.zw)(e.content.trim()),1),i[5]||(i[5]=(0,a.Uk)()),e.comment?((0,a.wg)(),(0,a.iD)("div",p,[(0,a._)("span",g,(0,a.zw)((0,a.SU)(t).product_review_customer_service_answer),1),i[1]||(i[1]=(0,a.Uk)()),(0,a._)("p",v,(0,a.zw)(e.comment.trim()),1)])):(0,a.kq)("v-if",!0)]))}});var w=l(3744);const f=(0,w.Z)(m,[["__scopeId","data-v-26503656"]]);var b=l(4328);const U={class:"rating-slide"},k={class:"rating-slide__rating-thumbnail"},y={class:"rating-slide__title copy copy--stage"},S={key:0,class:"copy copy--small c--text-black marg-t--1"},h={class:"rating-slide__byline marg-t--1"},x={class:"rating-slide__date"},z={class:"rating-slide__content marg-t--2"},R={key:1,class:"rating-slide__content rating-slide__content--comment"},q={class:"link link--small"},W={class:"rating-slide__comment-excerpt marg-t--1"},D={class:"rating-slide-layer"},C={class:"rating-slide-layer__note"},H={class:"label"},I=Object.assign({name:"RatingSlide"},{__name:"RatingSlide",props:{comment:{type:String,default:"lorLorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium harum maxime provident quidem ratione sapiente sint! Aliquam debitis fugiat nesciunt praesentium quibusdam! Excepturi fugiat ipsum mollitia nulla quisquam tempora voluptates.em"},content:{type:String,default:null},createdAt:{type:String,default:null},externalUser:{type:String,default:null},maxChar:{type:Number,default:100},points:{type:Number,default:null},title:{type:String,default:null}},setup(e){const t=e,{labelStore:l}=(0,i.b)({labelsRequired:["global","apps.shop"],labelKeyReplaceFn:e=>e.replace("apps.shop.","")}),o=(0,a.iH)(!1),c=(0,a.Fl)(()=>{var e;let l=(null===(e=t.content)||void 0===e?void 0:e.slice(0,t.maxChar).trim())??"";return t.content.length>t.maxChar&&"."!==l[l.length-1]&&(l+="..."),l}),d=(0,a.Fl)(()=>t.content.length>c.value.length);return(t,i)=>((0,a.wg)(),(0,a.iD)("article",U,[(0,a._)("div",k,[(0,a._)("p",y,(0,a.zw)(e.title),

11),i[5]||(i[5]=(0,a.Uk)()),e.externalUser?((0,a.wg)(),(0,a.iD)("p",S,(0,a.zw)(e.externalUser),1)):(0,a.kq)("v-if",!0),i[6]||(i[6]=(0,a.Uk)()),(0,a._)("div",h,[(0,a.Wm)((0,a.SU)(n.Z),{rating:e.points,rateable:!1,"show-rating-text":!1},null,8,["rating"]),i[3]||(i[3]=(0,a.Uk)()),(0,a._)("div",x,(0,a.zw)((0,a.SU)(s.qU)(e.createdAt)),1)]),i[7]||(i[7]=(0,a.Uk)()),(0,a._)("div",z,[(0,a.Uk)((0,a.zw)(c.value)+" ",1),d.value?((0,a.wg)(),(0,a.iD)("button",{key:0,type:"button",class:"link link--small",onClick:i[0]||(i[0]=e=>o.value=!0)},(0,a.zw)((0,a.SU)(l)["global.read_more"]),1)):(0,a.kq)("v-if",!0)]),i[8]||(i[8]=(0,a.Uk)()),e.comment?((0,a.wg)(),(0,a.iD)("div",R,[(0,a._)("button",{onClick:i[1]||(i[1]=e=>o.value=!0)},[(0,a._)("span",q,(0,a.zw)((0,a.SU)(l).product_review_customer_service_answer),1)]),i[4]||(i[4]=(0,a.Uk)()),(0,a._)("span",W,(0,a.zw)(e.comment),1)])):(0,a.kq)("v-if",!0)]),i[11]||(i[11]=(0,a.Uk)()),(0,a.Wm)((0,a.SU)(b.Z),{open:o.value,class:"modal--fit-content",onModalShowChange:i[2]||(i[2]=e=>o.value=e)},{default:(0,a.w5)(()=>[(0,a._)("div",D,[(0,a._)("div",C,[(0,a._)("span",H,(0,a.zw)((0,a.SU)(l).product_verified_user_review),1),i[9]||(i[9]=(0,a.Uk)()),(0,a.Wm)((0,a.SU)(r.default),{class:"rating-slide-layer__tooltip"},{default:(0,a.w5)(()=>[(0,a.Uk)((0,a.zw)((0,a.SU)(l).product_verified_user_review_tooltip_text),1)]),_:1})]),i[10]||(i[10]=(0,a.Uk)()),(0,a.Wm)((0,a.SU)(f),{points:e.points,title:e.title,content:e.content,"external-user":e.externalUser,"created-at":e.createdAt,comment:e.comment},null,8,["points","title","content","external-user","created-at","comment"])])]),_:1},8,["open"])]))}}),A=(0,w.Z)(I,[["__scopeId","data-v-748f8de7"]]);var B=l(9353),N=l(2684),j=l(7651);const F={class:"ratings-layer"},P={class:"headline headline--3 c--brand-blue"},Z={class:"ratings-layer__note marg-t--2"},O={class:"label"},T=Object.assign({name:"RatingsLayer"},{__name:"RatingsLayer",props:{ratingAverage:{type:Number,default:null},reviews:{type:Array,default:()=>[]}},setup(e){const{labelStore:t}=(0,i.b)({labelsRequired:["global","apps.shop"],labelKeyReplaceFn:e=>e.replace("apps.shop.","")}),l=(0,a.iH)(!1);function s(){l.value=!0,j.Ng.trackGa4Event({name:"product_rating_expand"})}return(i,o)=>((0,a.wg)(),(0,a.iD)("div",null,[(0,a._)("button",{class:"button button--cta-3 button--inline",onClick:s},(0,a.zw)((0,a.SU)(t).product_show_all_reviews),1),o[5]||(o[5]=(0,a.Uk)()),(0,a.Wm)((0,a.SU)(b.Z),{open:l.value,class:"modal--fit-content",onModalShowChange:o[0]||(o[0]=e=>l.value=e)},{default:(0,a.w5)(()=>[(0,a._)("div",F,[(0,a._)("h3",P,(0,a.zw)((0,a.SU)(t).product_user_review)+" ("+(0,a.zw)(e.reviews.length)+")\n        ",1),o[2]||(o[2]=(0,a.Uk)()),e.ratingAverage?((0,a.wg)(),(0,a.j4)((0,a.SU)(n.Z),{key:0,rating:e.ratingAverage,rateable:!1,"show-rating-text":!0,suffix:"/ 5",class:"ratings-layer__stars marg-t--2"},null,8,["rating"])):(0,a.kq)("v-if",!0),o[3]||(o[3]=(0,a.Uk)()),(0,a._)("div",Z,[(0,a._)("span",O,(0,a.zw)((0,a.SU)(t).product_verified_user_review),1),o[1]||(o[1]=(0,a.Uk)()),(0,a.Wm)((0,a.SU)(r.default),{class:"ratings-layer__tooltip"},{default:(0,a.w5)(()=>[(0,a.Uk)((0,a.zw)((0,a.SU)(t).product_verified_user_review_tooltip_text),1)]),_:1})]),o[4]||(o[4]=(0,a.Uk)()),((0,a.wg)(!0),(0,a.iD)(a.HY,null,(0,a.Ko)(e.reviews,e=>((0,a.wg)(),(0,a.iD)("div",{key:`review-${e.id}`,class:"ratings-layer__review-wrapper"},[(0,a.Wm)((0,a.SU)(f),{points:e.points,title:e.title,"external-user":e.externalUser,content:e.content,"created-at":e.createdAt,comment:e.comment},null,8,["points","title","external-user","content","created-at","comment"])]))),128))])]),_:1},8,["open"])]))}}),L=(0,w.Z)(T,[["__scopeId","data-v-9c707f18"]]);var E=l(2596);const K=["id"],Y={class:"rating-slider__header container"},$={class:"headline headline--2 d--inline-block"},G={class:"rating-slider__note"},M={class:"label"},V={class:"rating-slider__ratings container marg-t--1 marg-t-sm--4",ref:"ratings"},Q=["onClick"],J={key:0,class:"container marg-t--4"},X={class:"container"},ee={class:"content-slider-controls"},te={class:"content-slider-controls__button-wrapper"},le=["aria-label"],ae=["aria-label"],ie={class:"content-slider-control

1s__indicator-container"},ne=Object.assign({name:"RatingSlider"},{__name:"RatingSlider",props:{anchorId:{type:String,default:null},reviewProductNumber:{type:String,default:null},filterOutForeignLanguagesReviews:{type:Boolean,default:!0}},emits:["show-slider-controls","swiperInitialized"],setup(e,t){let{emit:l}=t;const s=e,o=l,c=(0,a.iH)({slidesPerView:1.2,spaceBetween:24,watchOverflow:!0,threshold:10,watchSlidesProgress:!0,breakpoints:{768:{slidesPerView:2.4,spaceBetween:24},1024:{slidesPerView:2.4,spaceBetween:32}},loop:!1}),d=(0,a.iH)(null),u=(0,a.iH)(null),_=(0,a.iH)(null),p=(0,a.iH)(null),g=(0,a.iH)(!1),{ratingAverage:v,reviews:m}=(0,N.D)(s),{activeIndex:w,indicatorStyle:f,showSliderControls:b,swiper:U}=(0,B.M)({emit:o,initialSwiperOptions:c,sliderNextButton:p,sliderPrevButton:_,swiperElement:u});let k,y;(0,a.YP)(m,()=>s.anchorId&&(0,a.Y3)(()=>(0,E.nY)(s.anchorId))),(0,a.YP)(w,e=>{e<=0||g.value||(g.value=!0,j.Ng.trackGa4Event({name:"product_rating_browse"}))}),(0,a.bv)(()=>{k=new IntersectionObserver(e=>{let[t]=e;clearTimeout(y),t.isIntersecting&&(y=setTimeout(()=>{j.Ng.trackGa4Event({name:"product_rating_view"}),k.disconnect()},1e4))},{threshold:.8}),k.observe(d.value)}),(0,a.Jd)(()=>{var e;clearTimeout(y),null===(e=k)||void 0===e||e.disconnect()});const{labelStore:S}=(0,i.b)({labelsRequired:["global","apps.shop"],labelKeyReplaceFn:e=>e.replace("apps.shop.","")});return(e,t)=>{const l=(0,a.up)("icon");return(0,a.wy)(((0,a.wg)(),(0,a.iD)("section",{ref_key:"ratingRoot",ref:d,id:(0,a.SU)(m).length?"consumer-user-reviews":"",class:"rating-slider marg-t--component"},[(0,a._)("header",Y,[(0,a.WI)(e.$slots,"default"),t[1]||(t[1]=(0,a.Uk)()),(0,a._)("span",$," ("+(0,a.zw)((0,a.SU)(m).length)+")",1),t[2]||(t[2]=(0,a.Uk)()),(0,a.SU)(v)?((0,a.wg)(),(0,a.j4)((0,a.SU)(n.Z),{key:0,rating:(0,a.SU)(v),rateable:!1,"show-rating-text":!0,suffix:"/ 5",class:"rating-slider__stars"},null,8,["rating"])):(0,a.kq)("v-if",!0),t[3]||(t[3]=(0,a.Uk)()),(0,a._)("div",G,[(0,a._)("span",M,

1(0,a.zw)((0,a.SU)(S).product_verified_user_review),1),t[0]||(t[0]=(0,a.Uk)()),(0,a.Wm)((0,a.SU)(r.default),{class:"rating-slider__tooltip"},{default:(0,a.w5)(()=>[(0,a.Uk)((0,a.zw)((0,a.SU)(S).product_verified_user_review_tooltip_text),1)]),_:1})])]),t[12]||(t[12]=(0,a.Uk)()),(0,a._)("div",null,[(0,a._)("div",V,[t[4]||(t[4]=(0,a._)("div",{class:"rating-slider__ratings__gradient rating-slider__ratings__gradient--left"},null,-1)),t[5]||(t[5]=(0,a.Uk)()),(0,a._)("swiper-container",{ref_key:"swiperElement",ref:u,class:"swiper-container",init:"false"},[((0,a.wg)(!0),(0,a.iD)(a.HY,null,(0,a.Ko)((0,a.SU)(m),(e,t)=>((0,a.wg)(),(0,a.iD)("swiper-slide",{ref_for:!0,ref:"slide",class:"rating-slider__slide swiper-slide",key:t,onClick:e=>(e=>{var t;const l=null===(t=U.value)||void 0===t?void 0:t.slides[e];l&&!l.classList.contains("swiper-slide-visible")&&(l.matches(".swiper-slide-visible + .swiper-slide")?U.value.slideNext():U.value.slidePrev())})(t)},[(0,a.Wm)((0,a.SU)(A),(0,a.dG)({ref_for:!0},e),null,16)],8,Q))),128))],512),t[6]||(t[6]=(0,a.Uk)()),t[7]||(t[7]=(0,a._)("div",{class:"rating-slider__ratings__gradient rating-slider__ratings__gradient--right"},null,-1))],512),t[10]||(t[10]=(0,a.Uk)()),(0,a.SU)(m).length>5?((0,a.wg)(),(0,a.iD)("div",J,[(0,a.Wm)((0,a.SU)(L),{"rating-average":(0,a.SU)(v),reviews:(0,a.SU)(m)},null,8,["rating-average","reviews"])])):(0,a.kq)("v-if",!0),t[11]||(t[11]=(0,a.Uk)()),(0,a.wy)((0,a._)("div",X,[(0,a._)("div",ee,[(0,a._)("div",te,[(0,a._)("button",{type:"button",ref_key:"sliderPrevButton",ref:_,class:"content-slider-controls__button","aria-label":(0,a.SU)(S)["global.previous"]},[(0,a.Wm)(l,{name:"angle-left"})],8,le),t[8]||(t[8]=(0,a.Uk)()),(0,a._)("button",{type:"button",ref_key:"sliderNextButton",ref:p,class:"content-slider-controls__button","aria-label":(0,a.SU)(S)["global.next"]},[(0,a.Wm)(l,{name:"angle-right"})],8,ae)]),t[9]||(t[9]=(0,a.Uk)()),(0,a._)("div",ie,[(0,a._)("div",{class:"content-slider-controls__indicator",style:(0,a.j5)((0,a.SU)(f))},null,4)])])],512),[[a.F8,(0,a.SU)(b)]])])],8,K)),[[a.F8,(0,a.SU)(m).length]])}}}),re=(0,w.Z)(ne,[["__scopeId","data-v-72d29a01"]])}}]);