https://www.bvmw.de/assets/javascripts/chunks/ab5cc53f3daeb1cb9a66.survey.js

1"use strict";(self.webpackChunk=self.webpackChunk||[]).push([[653],{2122:(e,t,n)=>{n.d(t,{A:()=>s});var a=n(9812);const s=class{constructor(e,t){this.id=t,this.elements={self:e},this.setInitialized()}setInitialized(){this.elements.self&&this.elements.self.setAttribute("data-js-module-initialized",!0)}setUnInitialized(){this.elements.self&&this.elements.self.removeAttribute("data-js-module-initialized")}getElements(e){const t=e.map((e=>({...e,selector:`${this.id}__${e.selector}`}))),n=(0,a.A)("[data-js-element]",this.elements.self);for(let e=0;e<n.length;e+=1){const a=n[e],s=t.filter((e=>a.getAttribute("data-js-element")===e.selector)),[i]=s;i&&(void 0===this.elements[i.id]?this.elements[i.id]=a:(void 0===this.elements[i.id].push&&(this.elements[i.id]=[this.elements[i.id]]),this.elements[i.id].push(a)))}Object.values(this.elements).forEach((e=>{e.asList=(e=>void 0===e.push?[e]:e)(e)}))}}},3756:(e,t,n)=>{n.d(t,{A:()=>r});var a=n(4842),s=n.n(a),i=n(2950);const l=({className:e,size:t,id:n})=>i.createElement("svg",{className:`icon icon--${n}  ${t?`icon--${t}`:""} ${e}`},i.createElement("use",{xlinkHref:`#${n}`}));l.propTypes={className:s().string,size:s().string,id:s().string.isRequired},l.defaultProps={className:"",size:"small"};const r=l},4096:(e,t,n)=>{n.d(t,{default:()=>J});var a=n(2950),s=n(4924),i=n(2122),l=n(1521),r=n(6133),c=n(6817),o=n(8842),u=n(7409),m=n(2380),d=n(15);const v=e=>{const[t,n]=a.useState((()=>{const t=localStorage.getItem(e);return t?JSON.parse(t):null}));return[t,t=>{try{localStorage.setItem(e,JSON.stringify(t))}catch(e){}n(t)}]},p=({columnConfig:e,col1:t,col2:n})=>a.createElement("div",{className:"survey-columns"},a.createElement("div",{className:"survey-columns__col",style:{"--grid-column":e[0]}},t),a.createElement("div",{className:"survey-columns__col",style:{"--grid-column":e[1]}},n));var h=n(5812);const E=({headline:e,prevButton:t,nextButton:n,children:s})=>a.createElement(m.P.div,{className:"survey-container",layout:!0},a.createElement(m.P.div,{className:"survey-container__prev-button",layout:"position"},t),a.createElement(m.P.div,{className:"survey-container__inner",layout:"position"},a.createElement(h.A,{className:"survey-container__headline",variant:"headline-3",tag:"h2"},e),a.createElement("div",{className:"survey-container__content"},s)),n&&a.createElement(m.P.div,{className:"survey-container__next-button",layout:"position"},n)),y=({headline:e,topline:t,buttonLabel:n,onButtonClick:s,duration:i})=>a.createElement("div",{className:"survey-cover"},a.createElement(h.A,{className:"survey-cover__topline",variant:"copy",tag:"h4"},t),a.createElement(h.A,{className:"survey-cover__headline",variant:"headline-3",tag:"h3"},e),a.createElement("button",{className:"survey-cover__button",type:"button",onClick:s},a.createElement(h.A,{variant:"button",tag:"span"},n),a.createElement("svg",{width:"70",height:"9",xmlns:"http://www.w3.org/2000/svg"},a.createElement("path",{d:"m61 0 9 4.5L61 9V5H0V4h61z"}))),i&&a.createElement(h.A,{variant:"copy-small"},i));var f=n(3756);function g(){return g=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)({}).hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},g.apply(null,arguments)}const b=({iconId:e,label:t,...n})=>a.createElement("button",g({className:"survey-nav-button",type:"button"},n),a.createElement(f.A,{className:"survey-nav-button__icon",id:e,size:"large"}),t&&a.createElement(h.A,{className:"survey-nav-button__label",variant:"copy-label",tag:"div"},t));var N=n(8209),_=n(8407);const A=[["#fff","#e30613"],["#4a4a4a","#e3061333"],["#fff","#878787"],["#fff","#4a4a4a"],["#4a4a4a","#e7e7e7"]],x=()=>null,w=({headline:e,questionResults:t})=>{const n=a.useMemo((()=>t.results.filter((e=>e.count>0)).map(((e,t)=>({x:e.answer.label,y:e.count,percent:e.percent,fg:A[t%A.length][0]})))),[t]),s=(e=>{const t=window.matchMedia(e),[n,s]=a.useState(t.matches);return t.addEventListener("change",(e=>{s(e.matches)})),n})("(min-width: 960px)"),i={fontSize:s?"14px":"12px",fontWeight:500,fontFamily:"Roboto, sans-serif",fill:"#4a4a4a"},l=s?450:375;return a.createElement("div",{className:"survey-result"},e&&a.createElement(h.A,{className:"survey-result__headline",variant:"copy-bold",tag:"h4"},e),a.createElement(N._,{width:l,height:300,style:{aspectRatio:`${l} / 300`,maxWidth:l,margin:"auto"}},a.createElement(_.l,{standalone:!1,data:n,colorScale:A.map((([,e])=>e)),innerRadius:50,padAngle:2,height:300,width:l,labelRadius:65,labels:({datum:e})=>`${e.percent}%`,style:{labels:{...i,fill:({datum:e})=>e.fg}}}),a.createElement(_.l,{standalone:!1,data:n,height:300,width:l,labels:({datum:e})=>e.x.split("­"),dataComponent:a.createElement(x,null),style:{labels:{...i}}})))},q=({topline:e,headline:t,children:n})=>a.createElement("div",{className:"survey-result-container"},a.createElement(h.A,{className:"survey-result-container__topline",variant:"copy",tag:"h4"},e),a.createElement(h.A,{className:"survey-result-container__headline",variant:"copy-bold"},t),n);var k=n(9711);const S=({headline:e,left:t,right:n})=>a.createElement("div",{className:(0,k.A)("survey-start-container",{"survey-start-container--single":!t})},a.createElement(h.A,{className:"survey-start-container__headline",variant:"headline-3-sans",tag:"h2"},e),t&&a.createElement("div",{className:"survey-start-container__left"},t),a.createElement("div",{className:"survey-start-container__right"},n));var T=n(126);var C=n(8460);const j=()=>a.createElement("div",{className:"survey-start-slide-placeholder"},a.createElement(C.A,null));var O=n(4440);const R=({topline:e,prevButtonTitle:t,nextButtonTitle:n,children:s})=>{const i=a.Children.count(s)>2,[l,r]=(0,O.E)({loop:i});return a.useLayoutEffect((()=>

1{r.current?.update()}),[s]),a.createElement("div",{className:"survey-start-teaser"},a.createElement(h.A,{className:"survey-start-teaser__topline",variant:"copy",tag:"h4"},e),a.createElement("div",{className:"survey-start-teaser__slider keen-slider",ref:l},s),i&&a.createElement(a.Fragment,null,a.createElement("div",{className:"survey-start-teaser__prev"},a.createElement(b,{iconId:"btn-prev",title:t,onClick:()=>r.current?.prev()})),a.createElement("div",{className:"survey-start-teaser__next"},a.createElement(b,{iconId:"btn-next",title:n,onClick:()=>r.current?.next()}))))},L=({headline:e,children:t})=>a.createElement("div",{className:"survey-start-teaser-slide keen-slider__slide"},a.createElement(h.A,{className:"survey-start-teaser-slide__headline",variant:"headline-5",tag:"h3"},e),t),$=e=>fetch(e,{headers:{Accept:"application/json","X-Requested-With":"XMLHttpRequest"}}).then((e=>e.json())),B=({formatSlideHeadline:e,startTeaser:t,surveyUid:n,...s})=>{const i=a.useRef(null),l=(e=>{const[t,n]=a.useState(!1);return a.useEffect((()=>{const t=e?.current;if(!t)return;const a=new IntersectionObserver((e=>{n(e[0].isIntersecting)}));return a.observe(t),()=>{a.unobserve(t)}}),[]),t})(i),[r,c]=a.useState(!1);a.useEffect((()=>{l&&!r&&c(!0)}),[l,r,c]);const{data:o}=(0,T.Ay)(r?`/api/surveys/${n}/teaser/${t.uid}/results`:null,$),u=a.useMemo((()=>Object.fromEntries(t.questions.map((e=>[e.uid,e])))),[t]);return a.createElement(R,s,a.createElement("div",{ref:i}),o?o?.surveyResults.questions.map((t=>a.createElement(L,{key:t.uid,headline:e(u[t.uid].question)},a.createElement(w,{questionResults:t})))):a.createElement(j,null))};var I=n(5056);const P=({delay:e})=>{const t=(0,I.j7)();return a.useEffect((()=>{const n=window.setTimeout(t.submitForm,e);return()=>window.clearTimeout(n)}),[e,t.values]),null},H=({children:e})=>a.createElement("div",{className:"survey-loading-inline"},a.createElement(C.A,null),e);function Q(){return Q=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var a in n)({}).hasOwnProperty.call(n,a)&&(e[a]=n[a])}return e},Q.apply(null,arguments)}const M=({id:e,children:t,...n})=>a.createElement("label",{className:(0,k.A)("survey-option",{"survey-option--checked":n.checked}),htmlFor:e},a.createElement(h.A,{className:"survey-option__label",variant:"button",tag:"div"},t),a.createElement("input",Q({className:"survey-option__input",id:e},n)),a.createElement("div",{className:"survey-option__input-check"},a.createElement(f.A,{size:"large",id:"check"}))),z=({subline:e,children:t,hint:n})=>a.createElement("div",{className:"survey-question"},a.createElement(h.A,{className:"survey-question__subline",variant:"headline-4",tag:"h3"},e),a.createElement("div",{className:"survey-question__options"},t),a.createElement(h.A,{className:"survey-question__hint",variant:"copy",modifiers:["bold"],tag:"div"},n)),U=({currentQuestion:e,formatHint:t,onSubmit:n})=>a.createElement(I.l1,{initialValues:{answerUid:""},validate:e=>{const t={};return""===e.answerUid&&(t.answerUid="Required"),t},validateOnMount:!0,onSubmit:async e=>{await n(e.answerUid)}},(({isValid:n,isSubmitting:s})=>a.createElement(I.lV,null,a.createElement(P,{delay:1e3}),a.createElement(z,{subline:e.question,hint:s?a.createElement(H,null,t(s,n)):t(s,n)},e.answerOptions.map((e=>a.createElement(I.D0,{as:M,id:e.uid,key:e.uid,name:"answerUid",type:"radio",value:e.uid,required:!0},e.label))))))),F={initial:e=>({opacity:0,x:"prev"===e?"-100%":"100%"}),visible:{opacity:1,x:0},exit:e=>({opacity:0,x:"prev"===e?"100%":"-100%"})},V={initial:{opacity:0}

1,visible:{opacity:1,transition:{duration:.5}},exit:{opacity:0}},X=({config:e})=>{const t=(0,o.A)(),[[n,s],i]=a.useState(["start","next"]),l=(()=>{const[e,t]=v("submitter-uid");if(null===e){const e=crypto.randomUUID();return t(e),e}return e})(),{currentQuestion:c,currentQuestionIdx:f,hasNextQuestion:g,goToPrevQuestion:N,goToNextQuestion:_}=(e=>{const t=a.useMemo((()=>Object.fromEntries(e.questions.map(((e,t)=>[e.uid,{...e,idx:t}])))),[e]),[n,s]=a.useState(e.questions[0].uid),i=t[n],l=t[n].idx,r=e.questions.length,c=l>0,o=l+1<r,u=a.useCallback((()=>{if(c){const t=e.questions[l-1].uid;s(t)}}),[c,e,l,s]),m=a.useCallback((()=>{if(o){const t=e.questions[l+1].uid;s(t)}}),[o,e,l,s]);return{currentQuestion:i,currentQuestionIdx:l,totalQuestions:r,hasPrevQuestion:c,hasNextQuestion:o,goToPrevQuestion:u,goToNextQuestion:m}})(e),{data:A,submitAnswer:x,reset:k}=((e,t,n)=>{const[s,i]=a.useState(null),[l,r]=a.useState(!1);return{data:s,isLoading:l,submitAnswer:a.useCallback((async a=>{r(!0);const s=`/api/surveys/${t}/questions/${n}/submissions`;try{const t=await(async(e,t,n)=>{const a=await fetch("/actions/users/session-info",{headers:{Accept:"application/json","X-Requested-With":"XMLHttpRequest"}}).then((e=>e.json()));return fetch(e,{method:"POST",headers:{Accept:"application/json","BVMW-Survey-Submitter-UID":t,"Content-Type":"application/json","X-CSRF-Token":a.csrfTokenValue,"X-Requested-With":"XMLHttpRequest"},body:JSON.stringify({answerUid:n})}).then((e=>e.json()))})(s,e,a);i(t)}catch(e){}r(!1)}),[t,n,e,r,i]),reset:()=>{i(null),r(!1)}}})(l,e.uid,c.uid),T=((e,t)=>{const[n,s]=v("question-results"),i=n||{};return a.useEffect((()=>{if(!t)return;const n=t.surveyResults.questions.find((t=>t.uid===e));n&&!{}.hasOwnProperty.call(i,n.uid)&&s({...i,[n.uid]:n})}),[i,t,s]),i})(c.uid,A),C=a.useCallback((()=>{k(),i(["question","prev"]),N()}),[k,i,N]),j=a.useCallback((()=>{k(),i(["question","next"]),_()}),[k,i,_]),O=a.useCallback((async e=>{await x(e),i(["question","next"])}),[x,i]),R=a.useMemo((()=>T[c.uid]),[T,c]);if("start"===n)return a.createElement(m.P.div,{key:"start",initial:"initial",animate:"visible",exit:"exit",variants:V},a.createElement(S,{headline:a.createElement(u.A,{id:"startHeadline"}),left:e.startTeaser&&a.createElement(B,{formatSlideHeadline:e=>a.createElement(u.A,{id:"startSlideHeadline",values:{question:e}}),nextButtonTitle:t.formatMessage({id:"startSliderNextButtonLabel"}),prevButtonTitle:t.formatMessage({id:"startSliderPrevButtonLabel"}),startTeaser:e.startTeaser,surveyUid:e.uid,topline:e.startTeaser.topline}),right:a.createElement(y,{headline:e.title,topline:e.topline,buttonLabel:a.createElement(u.A,{id:"startCtaLabel"}),onButtonClick:()=>i(["question","next"]),duration:e.readingTime})}));let L=null,$=null,I=null;return"question"===n&&(L=0===f?a.createElement(b,{iconId:"btn-prev",label:a.createElement(u.A,{id:"backButtonLabel"}),onClick:()=>i(["start","prev"])}):a.createElement(b,{iconId:"btn-prev",label:a.createElement(u.A,{id:"prevQuestionButtonLabel"}),onClick:C}),$=g?a.createElement(b,{iconId:"btn-next",label:a.createElement(u.A,{id:"nextQuestionButtonLabel"}),onClick:j}):null,I=R?!g&&e.endTeaser?a.createElement(p,{columnConfig:["1 / span 5","6 / span 4"],col1:a.createElement(q,{topline:a.createElement(u.A,{id:"resultTopline",values:{question:c.question}}),headline:a.createElement(u.A,{id:"resultHeadline"})},a.createElement(w,{questionResults:R})),col2:a.createElement(y,{topline:e.endTeaser?.topline,headline:e.endTeaser?.title,buttonLabel:e.endTeaser?.action.label,onButtonClick:()=>{window.open(e.endTeaser?.action.href,e.endTeaser?.action.target||"_self")}})}):a.createElement(p,{columnConfig:["1 / span 3","4 / span 5"],col1:a.createElement(h.A,{variant:"copy"},c.question),col2:a.createElement(w,{headline:a.createElement(u.A,{id:"resultHeadline"}),questionResults:R})}):a.createElement(U,{currentQuestion:c,formatHint:(e,t)=>e?a.createElement(u.A,{id:"questionLoading"}):a.createElement(u.A,{id:"questionHint",values:{isValid:t}}),onSubmit:O})),a.createElement(m.P.div,{key:"survey",initial:"initial",animate:"visible",exit:"exit",variants:V},a.createElement(d.o,null,a.createElement(E,{headline:a.createElement(u.A,{id:"questions

1Headline"}),prevButton:L,nextButton:$},a.createElement(r.N,{initial:!1,mode:"wait",custom:s},a.createElement(m.P.div,{key:[n,!!R,c.uid].join(""),initial:"initial",animate:"visible",exit:"exit",custom:s,variants:F},I)))))},W=({config:e})=>a.createElement(c.A,{locale:e.i18n.locale,messages:e.i18n.messages},a.createElement(l.x,{transition:{type:"tween"}},a.createElement(r.N,null,a.createElement(X,{config:e}))));class J extends i.A{constructor(e){super(e,"survey"),this.getElements([{id:"config",selector:"config"},{id:"app",selector:"app"}]);const t=JSON.parse(this.elements.config.textContent);(0,s.H)(this.elements.app).render(a.createElement(W,{config:t}))}}},5602:(e,t,n)=>{function a(e,t){const n=e=>e.reduce(((e,t)=>Array.isArray(t)?e.concat(n(t)):e.concat(t)),[]);let a=[e];const s=n(t||[]),i=s.filter(((e,t)=>s.indexOf(e)===t));return a=[...a,...i.filter((e=>e)).map((t=>`${e}--${t}`))],a.join(" ")}n.d(t,{A:()=>a})},5812:(e,t,n)=>{n.d(t,{A:()=>c});var a=n(4842),s=n.n(a),i=n(2950),l=n(5602);const r=i.forwardRef((({className:e,modifiers:t=[],children:n,html:a,tag:s,variant:r},c)=>{const o=s;return a?i.createElement(o,{ref:c,className:`${(0,l.A)("text",[...t,r])} ${e}`,dangerouslySetInnerHTML:{__html:a}}):i.createElement(o,{ref:c,className:`${(0,l.A)("text",[...t,r])} ${e}`},n)}));r.propTypes={className:s().string,modifiers:s().arrayOf(s().string),children:s().node,html:s().string,variant:s().string,tag:s().oneOf(["p","h1","h2","h3","h4","h5","h5","h6","span","figcaption","cite","label","legend","small","div"])},r.defaultProps={className:"",modifiers:[],children:null,html:null,variant:"copy",tag:"p"};const c=r},8460:(e,t,n)=>{n.d(t,{A:()=>l});var a=n(2950),s=n(4842);const i=({className:e})=>a.createElement("div",{className:`spinner ${e}`},a.createElement("svg",{width:"52",height:"52",xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 52 52"},a.createElement("g",{fill:"none"},a.createElement("path",{d:"m5.486 10.05-.078.077c.164-.23.58-.729 1.246-1.498.999-1.154 2.134-2.437 3.507-3.466 4.319-3.235 9.56-5.179 15.754-5.2 13.834-.046 25.82 11.648 26.08 25.566.27 14.468-11.584 26.815-26.448 26.425a4.526 4.526 0 0 1-4.414-4.637 4.528 4.528 0 0 1 4.652-4.4c9.59.251 17.32-7.8 17.144-17.22-.168-8.98-8.105-16.723-16.983-16.693-4.128.013-7.422 1.406-10.251 3.525-.912.683-1.69 1.42-2.408 2.193l-.248.295-1.044 1.197-.123.132c-1.77 1.765-4.773 1.633-6.544-.132-1.77-1.765-1.612-4.4.158-6.165Z",fill:"#e30613"}),a.createElement("path",{d:"M25.915-.037a24.626 24.626 0 0 1 5.294.56C43.072 2.933 52 13.424 52 26l-.001.253-.002.141L52 26a26.463 26.463 0 0 1-.049 1.6c-.452 7.447-4.038 14.048-9.457 18.5a25.535 25.535 0 0 1-10.634 5.238 14.438 14.438 0 0 1-.342.075A26.073 26.073 0 0 1 26 52C11.64 52 0 40.36 0 26a25.88 25.88 0 0 1 4.616-14.794c.188-.347.425-.68.709-.989l.065-.07.018-.02.076-.076-.094.096c-.266.347-.524.7-.774 1.06-.886 1.632-.702 3.597.712 5.007 1.77 1.765 4.774 1.897 6.544.132l.123-.132.765-.878a17.008 17.008 0 0 1 9.118-5.833l.132-.032c.467-.114.948-.209 1.441-.282l.102-.014A17.198 17.198 0 0 1 26 9c9.389 0 17 7.611 17 17s-7.611 17-17 17c-.346 0-.69-.01-1.03-.03.265-.043.537-.06.815-.053 9.59.251 17.32-7.8 17.144-17.22-.168-8.98-8.105-16.723-16.983-16.693a17.504 17.504 0 0 0-2.495.185l.102-.014a16.922 16.922 0 0 0-1.675.328l.132-.032-.235.058.103-.026c-2.323.586-4.35 1.654-6.183 3.026-.912.683-1.69 1.42-2.408 2.193l-.248.295-.279.319A16.929 16.929 0 0 0 9 26c0 9.043 7.06 16.436 15.97 16.97a4.524 4.524 0 0 0-3.837 4.347 4.526 4.526 0 0 0 4.414 4.637 25.581 25.581 0 0 0 6.258-.604l-.287.063.342-.075-.055.012a25.909 25.909 0 0 0 10.689-5.25c5.434-4.488 9.005-11.143 9.457-18.5a25.26 25.26 0 0 0 .036-.775l.01-.395.002-.177c.002-.241.001-.482-.004-.724C51.77 13.425 42.675 3.004 31.21.522A26.083 26.083 0 0 0 26 0C18.295 0 11.372 3.352 6.611 8.677c-.408.472-.718.84-.932 1.102l-.18.228-.091.12a26.075 26.075 0 0 1 1.203-1.45l.043-.048c.999-1.154 2.134-2.437 3.507-3.466 4.319-3.235 9.56-5.179 15.754-5.2Z",fill:"#F3F3F3"}))));i.propTypes={className:n.n(s)().string},i.defaultProps={className:""};const l=i},9812:(e,t,n)=>{n.d(t,{A:()=>a});const a=(e,t=window.document)=>[].slice.call(t.querySelectorAll(e))}}]);
2//# sourceMappingURL=ab5cc53f3daeb1cb9a66.survey.js.map