@gamelearn/arcade-components 3.34.2 → 3.34.3

package/dist/arcade-components.cjs

@@ -271,5 +271,5 @@ For more info see: https://github.com/konvajs/react-konva/issues/194
           ${l.thinkful?"speech-bubble--italic":""}
       `,children:[jsxRuntimeExports.jsxs("div",{className:`speech-bubble__header ${l.thinkful?"speech-bubble__header--thinking":""}`,children:[l.thinkful?jsxRuntimeExports.jsx("div",{className:"thinking-icon-wrap",children:jsxRuntimeExports.jsx("div",{className:"icon-bubble-thinkful-black"})}):null,l.avatar?jsxRuntimeExports.jsx("div",{className:"speech-bubble__avatar",children:jsxRuntimeExports.jsx("img",{src:o(),alt:l.name})}):null,l.voiceOver?jsxRuntimeExports.jsx("div",{className:"speech-bubble__avatar",children:jsxRuntimeExports.jsx("div",{className:"icon-narrator"})}):null,jsxRuntimeExports.jsxs("div",{className:"speech-bubble__name",children:[jsxRuntimeExports.jsx("span",{children:l.name}),l.thinkful?jsxRuntimeExports.jsxs("span",{children:["[ ",e("emotion.thinking")," ]"]}):null]})]}),l.text?jsxRuntimeExports.jsx("div",{className:"speech-bubble__text",children:HTMLReactParser$1(l.text)}):null]})}const SpeechBubbleComponent$1=React$2.forwardRef(SpeechBubbleComponent);function BubbleWrapper({currentMessage:l,translate:e}){const n=document.querySelector(".screens--container");return jsxRuntimeExports.jsx("group",{children:jsxRuntimeExports.jsx(arcadeThreeCore.HtmlPro,{wrapperClass:"htmlpro-wrap-100-h",onOcclude:()=>null,zIndexRange:[5,5],portal:n?{current:n}:void 0,style:{width:"100%",height:"100%",position:"static"},calculatePosition:()=>[0,0],children:jsxRuntimeExports.jsx(SpeechBubbleComponent$1,{translate:e,message:l})})})}const cache={},loader=new GLTFLoader,MIX_TIME=.25;function useStateMachine(l){const e=fiber.useThree(p=>p.scene),n=React$2.useMemo(()=>{var x;const p={};for(const R of l)if(R.slots)for(const _ of R.slots){if(!_.uid)continue;const S=(x=_.character)==null?void 0:x.resource.animations;S&&(p[_.uid]||(p[_.uid]=Object.keys(S).reduce((g,v)=>(g[v]=S[v].url,g),{})))}return p},[l]),t=React$2.useMemo(()=>{const p=new Set;for(const x of l)if(x.slots)for(const R of x.slots)R.uid&&p.add(R.uid);return Array.from(p)},[l]),s=async(p,x)=>{if(p&&!cache[p]){const{animations:R}=await loader.loadAsync(p);R[0].name=x,cache[p]=R[0]}},o=async p=>{const x=n[p],R=x.talking,_=x["talking-short"];await Promise.all([s(_,"talking-short"),s(R,"talking")])},d=()=>{t.forEach(p=>{u(p,"idle")})},h=()=>{t.forEach(p=>{const x=e.getObjectByProperty("uid",p);x&&(delete x.userData._active,u(p,"idle"))})},f=async(p,x,R=!1,_=!1)=>{const S=getCurrentVisible(p,e);if(cache[p]||(cache[p]={}),!S)return new Promise(v=>v(!1));const g=S.userData.animator;if(x){const v=n[p],b=v["talking-short"]||v.talking;let T=cache[b],y=x,w=cache[x];if(!w){const{animations:C}=await loader.loadAsync(x);w=cache[x]=C[0]}if(R&&b!==x&&(T?(w=mixWithTalkingClip(T,w),y+="_talking"):o(p).then(()=>{T=cache[b],w=mixWithTalkingClip(T,w),y+="_talking"})),!S.userData._active||S.userData._active!==y){S.userData._active=y;const C=g.register(y,w,S);return new Promise(D=>{_&&g.setTime(0),g.mix(y,MIX_TIME).then(N=>D(N?C:!1))})}}return new Promise(v=>v(!1))},u=async(p,x)=>{const R=getCurrentVisible(p,e);if(cache[p]||(cache[p]={}),!R)return new Promise(S=>S(!1));const _=R.userData.animator;if(x==="idle")return _.mix("idle",MIX_TIME),_.getAction("idle");{const S=n[p],g=x.split("_")[0],v=S[g],b=x.includes("talking");if(v){const T=`${v}${b?"_talking":""}`;let y=cache[T];if(!y){let w=cache[v];if(!w){const{animations:C}=await loader.loadAsync(v);w=cache[v]=C[0],w.name=g}if(y=w.clone(),b&&x!=="talking"){const C=S["talking-short"]||S.talking,D=cache[C];D&&(y=mixWithTalkingClip(D,w))}cache[T]=y}if(!R.userData._active||R.userData._active!==x){R.userData._active=x;const w=_.register(x,y,R);return new Promise(C=>{_.mix(x,MIX_TIME).then(D=>C(D?w:!1))})}}}return new Promise(S=>S(!1))};return{startAnimation:u,startAnimationUrl:f,preloadTalking:o,resetActives:d,unmountActives:h}}const characterMs=75,minMs=1400,headSize=2,raycast=new three.Raycaster,animationTarget=new three.Object3D,maxCharacterToSwitch=70;raycast.firstHitOnly=!0;function DialogComponent({keyboardControl:l,emitEvent:e,getEvent:n,lines:t,actors:s,edges:o,soundActions:d,zoomInActor:h,autoPlay:f,autoEnd:u,pause:p,progress:x}){var Et;const R=t.length-1<=(x==null?void 0:x.line)?t.length-1:(x==null?void 0:x.line)||0,[_,S]=React$2.useState(R),[g,v]=React$2.useState(!!f),[b,T]=React$2.useState(!1),[y,w]=React$2.useState(!1),C=fiber.useThree(Te=>Te.scene),D=fiber.useThree(Te=>Te.camera),{start:N,stop:P}=useTimeout(),k=React$2.useRef([]),F=React$2.useMemo(()=>D.clone(),[]),M=React$2.useRef({pos:[0,0,0],child:null}),j=t[_],U=t[_-1],B=React$2.useRef(!1),X=!!o,{voiceOver:re,decision:se}=j||{},Z=React$2.useRef({}),K=(Et=j==null?void 0:j.slots)==null?void 0:Et.find(Te=>Te.talking),te=React$2.useRef(!1),{startAnimation:ue,startAnimationUrl:me,resetActives:J,preloadTalking:H,unmountActives:W}=useStateMachine(t),V=React$2.useRef(),z=Object.keys((j==null?void 0:j.audio)||{}).length,Y=Object.keys((j==null?void 0:j.voice)||{}).length,ie=re||(j==null?void 0:j.type)==="conversationalNarration",le=se||(j==null?void 0:j.type)==="conversationalDecision",fe=(j==null?void 0:j.type)==="conversationalCamera",ce=g&&!le&&!fe,[ge,Se]=React$2.useState({text:"",name:"",inScene:!1,thinkful:!1,voiceOver:!1,avatar:"",show:!1}),Ae=React$2.useMemo(()=>t.reduce((Te,at)=>(at.slots&&at.slots.filter(ve=>ve.uid).forEach(ve=>{Te.includes(ve.uid)||Te.push(ve.uid)}),Te),[]),[t]),Fe=React$2.useCallback(Te=>n({type:"translate",payload:Te}),[n]),[De,Je]=React$2.useState([]),ut=React$2.useMemo(()=>De[De.length-1],[De]),et=React$2.useCallback(()=>{const Te=o.find(rt=>rt.fromId===ut)||o.find(rt=>rt.toId===ut),at=t.find(rt=>rt.id===(Te==null?void 0:Te.fromId));return!ut&&(x==null?void 0:x.line)>=0?{decision:!0}:at},[o,t,ut]),xt=React$2.useCallback(()=>{if(X){const Te=t.filter(at=>!o.find(rt=>rt.toId===at.id));if(Te.length){const at=Te[0],rt=t.indexOf(at);if(rt>=0)return rt}}return-1},[X,t,o]),Ve=React$2.useCallback(()=>{if(X){const at=et();return at==null?void 0:at.decision}const Te=t[_-1]?t[_-1]:{};return _>0&&(Te==null?void 0:Te.decision)},[j,X,t,ut,o]),Me=React$2.useCallback(()=>{if(X){const at=et();return(at==null?void 0:at.type)==="conversationalCamera"}const Te=t[_-1]?t[_-1]:{};return _>0&&(Te==null?void 0:Te.type)==="conversationalCamera"},[j,X,t,ut,o]),Le=React$2.useCallback(Te=>{var rt,ve;const at=s.find(ee=>(ee==null?void 0:ee.uid)===(Te==null?void 0:Te.uid)?ee:"");return((ve=(rt=Te==null?void 0:Te.character)==null?void 0:rt.resource)==null?void 0:ve.url)||(at==null?void 0:at.completeUrl)||""},[s]),Ye=(Te=()=>{})=>{if(te.current)te.current&&(te.current=!1);else{D.updateProjectionMatrix(),D.updateMatrixWorld(!0);const at=M.current.child?M.current.pos:F.position.toArray();if(animationTarget.position.fromArray(at),M.current.parent){animationTarget.quaternion.equals(D.quaternion)||animationTarget.applyQuaternion(D.quaternion);const rt=M.current.isLeft?-1:1,ve=headSize*rt;animationTarget.translateX(-10*rt+ve),animationTarget.translateY(-2),animationTarget.translateZ(30)}gsapWithCSS.to(D.position,{duration:.9,ease:"power3.easeInOut",onStart:()=>{te.current=!0},onUpdate:()=>{k.current.length&&k.current.forEach(rt=>{const{object:ve}=rt;ve.material.visible=!0})},onComplete:()=>{Te(),raycast.set(D.getWorldPosition(new three.Vector3(0,0,0)),D.getWorldDirection(new three.Vector3));const rt=raycast.intersectObjects(C.children,!0);k.current=rt.filter(ve=>ve.distance<10),k.current.length&&k.current.forEach(ve=>{const{object:ee}=ve;ee.material.side=0}),te.current=!1,B.current&&e({type:"success"}),M.current.child||D.copy(F)},...animationTarget.position})}},ke=React$2.useCallback(()=>{M.current.child=null,M.current.parent=null,h&&Ye()},[h]),Qe=(Te,at,rt,ve=!1)=>{const ee=at.includes("seated");if(rt){const pe=BASIC_ACTIONS_TYPES_WHITELIST.includes(rt.animationId);pe&&at.includes("talking")&&(V.current=Te),me(Te,rt.url,at.includes("talking"),pe).then(Ee=>{if(Ee&&pe)if(B.current)ue(Te,"idle");else{const we=V.current===Te?"neutral_talking":"neutral";ue(Te,we)}})}else{const pe=ve&&!ee?`${at}-seated`:at;ue(Te,pe)}},bt=()=>{if(!(K!=null&&K.uid)||!(K!=null&&K.emotion)||B.current)return;const{emotion:Te,uid:at,animation:rt}=K,ve=getCurrentVisible(at,C);if(ve){const{isSeated:ee}=ve;H(at).then(()=>{Qe(at,ee&&!Te.includes("seated")?`${Te}-seated_talking`:`${Te}_talking`,rt,ee)}).catch(pe=>{console.error(pe)})}},qe=()=>{if(!(K!=null&&K.uid)||B.current)return;const{emotion:Te,uid:at,animation:rt}=K,ve=getCurrentVisible(at,C);if(ve){delete ve.userData._active;const{isSeated:ee}=ve;if(V.current===at)Qe(at,"neutral",null,ee),V.current=null;else{const pe=Te.includes("talking");Qe(at,pe?"neutral":Te,pe?null:rt,ee)}}},ct=React$2.useCallback(()=>{B.current=!0,Se({show:!1}),ke(),J(),h||e({type:"success"})},[D,e,ke,h]);React$2.useEffect(()=>()=>{Z.current={},W()},[]);const Be=Te=>{Se({show:!1}),S(Te),e({type:"notifyProgress",payload:{line:Te}})},ot=React$2.useCallback((Te=!0)=>{const at=Te?["fromId","toId"]:["toId","fromId"],rt=o.filter(pe=>pe[at[0]]===j.id),ve=rt.length===1?rt[0]:rt.find(pe=>pe[at[1]]===ut);if(!(ve!=null&&ve[at[0]])){ct();return}Te||Je(De.slice(0,De.length-1));const ee=t.findIndex(pe=>pe.id===ve[at[1]]);ee>=0?Be(ee):ct()},[j==null?void 0:j.id,e,o,ct,t]),ft=React$2.useCallback((Te,at)=>{const rt=[3,2,1][Te.id],ee=o.filter(Ee=>Ee.fromId===(j==null?void 0:j.id)).find(Ee=>parseInt(Ee.fromPointIndex)===rt),pe=t.findIndex(Ee=>Ee.id===(ee==null?void 0:ee.toId));pe>=0?(ee==null?void 0:ee.fromId)===(ee==null?void 0:ee.toId)?at():Be(pe):ct()},[j==null?void 0:j.id,o,ct,t]),Ge=React$2.useCallback(()=>{if(Z.current={...K},w(!1),qe(),X)ot(!1);else if(!Ve()){const Te=_-1;Se({show:!1}),S(Te),e({type:"notifyProgress",payload:{line:Te}})}},[ot,e,X,U,_,K]),Ne=React$2.useCallback(Te=>{if(X){if(Te){const at=[3,2,1][Te.id],ve=o.filter(ee=>ee.fromId===j.id).find(ee=>parseInt(ee.fromPointIndex)===at);if(ve){const ee=t.findIndex(pe=>pe.id===ve.toId);ee>=0&&e({type:"notifyProgress",payload:{line:ee}})}else e({type:"saveNode"})}}else if(_<t.length-1){const at=_+1;e({type:"notifyProgress",payload:{line:at}})}else e({type:"saveNode"})},[o,_,t,e,j==null?void 0:j.id,X]),Re=React$2.useCallback((Te,at)=>{if(Z.current={...K},w(!1),qe(),X)Je([...De,j.id]),Te?ft(Te,at):ot();else if(_<t.length-1){const rt=_+1;Be(rt)}else(u||le||fe)&&ct()},[e,j==null?void 0:j.id,X,le,fe,_,t.length,ft,ot,ct,K]),_e=()=>{v(!1),Ge()},Oe=()=>X?j&&j.type!=="conversationalDecision"&&!o.find(Te=>Te.fromId===j.id):_===t.length-1,Ke=()=>{Oe()?ct():(v(!1),Re())};React$2.useEffect(()=>{if(X&&!b){const Te=x==null?void 0:x.line;if(Te>=0){T(!0),S(Te);return}const at=xt();at>=0&&(T(!0),S(at))}},[o,X,t,b,xt]);const Ft=Te=>{if(Z.current.uid===Te.uid||M.current.parent===Te)return;const at=new three.Object3D,rt=Te.getObjectByName("Head_M");rt.updateMatrixWorld(!0),at.applyMatrix4(rt.matrixWorld),at.applyQuaternion(D.quaternion);const ve=h?2.5:2,ee=h?1.2:1.5;at.translateY(ve),at.translateX(ee);const pe=new three.Vector3;pe.setFromMatrixPosition(rt.matrixWorld);const we=pe.project(D).x<0;M.current={pos:at.position.toArray(),child:rt,parent:Te,isLeft:we}},Nt=Te=>{e({type:"resetZIndexUIContainer",payload:Te})};React$2.useEffect(()=>{var Te;if(ie)ke(),Se({text:j==null?void 0:j.text,name:(j==null?void 0:j.alias)||(j==null?void 0:j.name)||`[ ${Fe("storylines.misc.voiceOver")} ]`,inScene:!1,voiceOver:!0,thinkful:!1,top:!1,avatar:Le(K),show:!0});else if(!B.current&&!le&&!fe){const at=j==null?void 0:j.slots.filter(ee=>ee.uid&&!ee.talking),rt=[...at.map(ee=>ee.uid)||[],K==null?void 0:K.uid];if(Ae.filter(ee=>!rt.includes(ee)).forEach(ee=>{ue(ee,"idle")}),at.forEach(ee=>{const pe=getCurrentVisible(ee.uid,C);if(pe){const{isSeated:Ee}=pe;Qe(ee.uid,ee.emotion,ee.animation,Ee)}}),K){const ee=getCurrentVisible(K.uid,C),pe=s.find(Ee=>Ee.uid===K.uid);ee&&!B.current?setTimeout(()=>{var Ee,we;if(K.uid===ee.uid){Ft(ee);const{isSeated:de,userData:be}=ee,{emotion:Ue,animation:tt}=K;!((Ee=be._active)!=null&&Ee.includes("talking"))&&!((we=be._active)!=null&&we.includes(Ue))&&Qe(K.uid,Ue,tt,de);const gt=()=>{var Dt;Se({text:K.text,name:K.alias||((Dt=K.character)==null?void 0:Dt.name),inScene:!0,thinkful:K.emotion.includes("think"),avatar:Le(K),show:!0})};h?(te.current=!1,Ye(gt)):gt()}},150):(ke(),Se({text:K.text,name:K.alias||((Te=K.character)==null?void 0:Te.name)||(pe==null?void 0:pe.name),left:!1,top:K.text.length>maxCharacterToSwitch,inScene:!1,thinkful:K.emotion.includes("think"),avatar:Le(K),show:!0}))}else ke(),Se({show:!0})}},[s,j,h,C,Fe,Le,ke,le,ie,Ae]);const je=cleanTextOfHtmlTags(ge==null?void 0:ge.text),[vt,Pt]=useEkho({audioType:j==null?void 0:j.audioType,volume:j==null?void 0:j.audioVolume,voice:j==null?void 0:j.voice,started:ge.show,text:je,audio:j==null?void 0:j.audio,soundActions:d,getEvent:n,pauseTTS:p,onStart:()=>{var Te;(Te=K==null?void 0:K.emotion)!=null&&Te.includes("think")||bt()},onError:()=>{w(!0)},onFinish:()=>{qe(),ce&&!p&&Re()}});React$2.useEffect(()=>(Pt(),()=>{Pt()}),[_,Pt]),React$2.useEffect(()=>{var Te;if(((j==null?void 0:j.audioType)==="none"||y)&&(ge!=null&&ge.show)&&!(K!=null&&K.emotion.includes("think"))){bt();const at=characterMs*(((Te=ge==null?void 0:ge.text)==null?void 0:Te.length)||0);setTimeout(()=>{qe()},at<minMs?minMs:at)}},[y,j==null?void 0:j.audioType,qe,bt,K==null?void 0:K.emotion,ge]),React$2.useEffect(()=>{var Te;if(ce&&ge.show&&((j==null?void 0:j.audioType)==="none"||y)&&!p){const at=characterMs*(((Te=ge==null?void 0:ge.text)==null?void 0:Te.length)||0);(!Oe()||Oe()&&u)&&N(Re,at<minMs?minMs:at)}return()=>{P()}},[ge,Re,N,u,P,j==null?void 0:j.audioType,ce,z,Y,y]);const lt=React$2.useMemo(()=>xt()>=0&&De.length===0&&X||!X&&_===0||Ve()||Me(),[_,Ve,Me,xt,De]),ze=l({disabled:le||!ge.show,repeat:!1,forward:Ke,rewind:lt?null:_e});React$2.useEffect(()=>ze(),[ze]);const Ze=document.querySelector(".screens--container");if(fe)return jsxRuntimeExports.jsx(ChangeCamera,{...j,emitEvent:e,success:!1,onFinish:Re},`change-camera-${_}`);if(le){const Te=j.id?t.filter(rt=>rt.decision).findIndex(rt=>rt.id===j.id)+1:t.filter(rt=>rt.decision).findIndex(rt=>rt===j)+1,at={...j.payload,decisionNumber:Te,inheritProps:{slots:[],disableBackground:!0},required:!X,branched:X,onAddPoints:Ne,onFinish:Re,emitEvent:e,getEvent:n,pause:p,soundActions:d,keyboardControl:l};return jsxRuntimeExports.jsx(HtmlWrap,{onMount:()=>{ke(),Nt(!0)},onUnMount:()=>{te.current=!1,Nt(!1)},children:jsxRuntimeExports.jsx(DecisionComponent,{inScene:!0,...at})})}return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[ge.text?jsxRuntimeExports.jsx(BubbleWrapper,{translate:Fe,currentMessage:ge}):null,jsxRuntimeExports.jsx(arcadeThreeCore.HtmlPro,{wrapperClass:"htmlpro-wrap-100-h",style:{width:"100%",height:"100%",position:"static"},portal:Ze?{current:Ze}:void 0,zIndexRange:[6,6],onOcclude:()=>{},calculatePosition:()=>[0,0],children:jsxRuntimeExports.jsxs("div",{dir:LangIsRtl()?"rtl":"ltr",className:"dialog-component-controls",children:[jsxRuntimeExports.jsx("button",{type:"button",onClick:_e,disabled:lt||!ge.show,className:`gat--btn__round ${lt||!ge.show?"disabled":""}`,"aria-label":LangIsRtl()?Fe("storylines.misc.forward"):Fe("storylines.misc.rewind"),children:jsxRuntimeExports.jsx("span",{className:LangIsRtl()?"icon-next":"icon-back"})}),jsxRuntimeExports.jsx("button",{type:"button",onClick:Ke,disabled:!ge.show,className:`gat--btn__round 
               ${ge.show?"":"disabled"}
-              ${g&&Oe()?"glowing-animation":""}`,"aria-label":LangIsRtl()?Fe("storylines.misc.rewind"):Fe("storylines.misc.forward"),children:jsxRuntimeExports.jsx("span",{className:LangIsRtl()?"icon-back":"icon-next"})})]})})]})}const activeCache=arcadeThreeCore.ProgressManager.request("AssetLoader").cache,assetLoader=new arcadeThreeCore.AssetLoader(void 0,activeCache);function Animation({animation:l,loopTimes:e,onAnimationFinish:n,onAnimationSave:t,resource:s,makeDefault:o}){const[d,h]=React$2.useState(!1),f=fiber.useThree(p=>p.scene),u=React$2.useRef(0);return React$2.useEffect(()=>{h(!1)},[s.uid,l==null?void 0:l.url]),React$2.useEffect(()=>{if(!d){const p=f.getObjectByProperty("uid",s.uid);if(p&&l&&l.url&&p.skeletonId===(l==null?void 0:l.skeletonId))if(o)t({uid:s.uid,animation:l==null?void 0:l.id,index:p.index}),n();else{const x=p.userData.animator,R=()=>{const _=x.getAction(l.url);_.setLoop(three.LoopRepeat,1/0),_.reset();function S(){u.current+=1,u.current>=e&&g()}function g(){x.mix("idle"),n(),x.removeEventListener("loop",S)}x.mix(l==null?void 0:l.url).then(v=>{v&&(u.current=1,u.current>=e?g():x.addEventListener("loop",S))}),h(!0)};x.getAction(l==null?void 0:l.url)?(x.setTime(0),R()):assetLoader.load(l==null?void 0:l.url,_=>{x.register(l==null?void 0:l.url,_.animations[0]),x.setTime(0),R()},void 0,_=>{console.error(`Asset loader failed with: ${l.url}`,_),n()})}else n()}},[f,l==null?void 0:l.url,e,d,s.uid,o,l,s,n,t]),null}function MultipleAnimation({animations:l=[],enableInteraction:e,emitEvent:n}){const t=l.length,s=React$2.useRef(0),o=()=>{s.current+=1,s.current>=t&&e&&n({type:"success"})},d=h=>{n({type:"saveAnimation",payload:h})};return React$2.useEffect(()=>{s.current=0},[l]),React$2.useEffect(()=>{e||n({type:"success"})},[n,e]),l.map(({animation:h,...f},u)=>{var p;return jsxRuntimeExports.jsx(Animation,{animation:h,...f,onAnimationFinish:o,onAnimationSave:d},(h==null?void 0:h.id)||((p=f.resource)==null?void 0:p.uid)||u)})}function EmailPill({text:l,error:e,handleClick:n}){return jsxRuntimeExports.jsxs("div",{"data-testid":`${e?" pill--error":"pill--ok"}`,className:`email-pill ${e?" email-pill--error":""}`,children:[jsxRuntimeExports.jsx("div",{children:l}),jsxRuntimeExports.jsx("div",{className:"email-pill__delete",children:jsxRuntimeExports.jsx("button",{type:"button",onClick:n,className:"icon-close unset-button","aria-label":"icon click"})})]})}function StepOne({handleContinue:l,handleCancel:e,translate:n,text:t}){const[s,o]=React$2.useState([]),[d,h]=React$2.useState(0),[f,u]=React$2.useState(0),p=React$2.useRef(null),x=(g,v,b)=>{g.stopPropagation(),o(s.filter(T=>T!==s[b])),v.error&&h(d-1),v.isRepeat&&u(f-1)},R=()=>{p.current&&p.current.focus()},_=()=>{[" ",",",";","."].includes(p.current.value)&&(p.current.value="")},S=g=>{const v=p.current.value,b=["Space","Comma","Period","Enter"],T=["Space","Comma","Enter","Tab"];v===""&&(b.includes(g.code)||g.keyCode==="186"||g.key==="Enter"||g.key===" ")?g.preventDefault():p.current.value.length>1&&(T.includes(g.code)||g.type==="blur")&&(g.preventDefault(),/[A-Za-z0-9._%+-]{3,}@[A-Za-z0-9_+-]{2,}([.]{1}[a-zA-Z]{2,}|[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,})/.test(v)?s.find(w=>w.text===v)?(u(f+1),o([...s,{text:v,error:!0,isRepeat:!0}])):o([...s,{text:v}]):(o([...s,{text:v,error:!0}]),h(d+1)),p.current.value="")};return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__body",children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__title",children:n("puzzles.referrals.inviter.titleStep1")}),jsxRuntimeExports.jsx("div",{className:"referrals-piece__subtitle",children:t}),jsxRuntimeExports.jsxs("div",{className:"referrals-piece__form",children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__instructions",children:[jsxRuntimeExports.jsx("div",{dir:"auto",children:n("puzzles.referrals.inviter.instructions")}),jsxRuntimeExports.jsx("div",{dir:"auto",children:n("puzzles.referrals.inviter.limit")})]}),jsxRuntimeExports.jsx("div",{className:"referrals-piece__faketextarea",onKeyUp:()=>{},role:"button",tabIndex:"-1",onClick:R,"aria-labelledby":"list of emails",children:jsxRuntimeExports.jsxs("div",{className:"referrals-piece__scrollarea",id:"list of emails",children:[s&&s.map((g,v)=>jsxRuntimeExports.jsx(EmailPill,{text:g.text,error:g.error,handleClick:b=>x(b,g,v),emailPillIndex:v},`${s.indexOf(g)}`)),s.length<=9?jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsx("input",{id:"email",ref:p,className:"referrals-piece__inputemail",onChange:_,onKeyDown:S,onBlur:S,type:"email",autoComplete:"off"}),jsxRuntimeExports.jsx("label",{className:"referrals-piece__emaillabel",htmlFor:"email",children:jsxRuntimeExports.jsx("span",{children:n("puzzles.referrals.inviter.skipButton")})})]}):null]})}),jsxRuntimeExports.jsxs("div",{dir:LangIsRtl()?"rtl":"auto",className:"referrals-piece__footervalidation",children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__errormessage",children:[jsxRuntimeExports.jsx("div",{children:f>0?n("puzzles.referrals.inviter.errorEmailRepeat"):null}),jsxRuntimeExports.jsx("div",{children:d>0?n("puzzles.referrals.inviter.errorMessage"):null})]}),jsxRuntimeExports.jsxs("div",{className:"referrals-piece__counter","data-testid":"pillcounter",children:[s.length,"/10"]})]})]})]}),jsxRuntimeExports.jsxs("div",{className:"referrals-piece__buttons",children:[jsxRuntimeExports.jsx("button",{"data-testid":"cancelButton",className:"gat--btn gat--btn__secondary",type:"button",onClick:e,children:n("puzzles.referrals.inviter.skipButton")}),jsxRuntimeExports.jsx("button",{className:`gat--btn gat--btn__primary ${f>0||d>0||s.length===0?" disabled":""}`,type:"button",disabled:d>0||s.length===0,onClick:()=>l(s),children:n("puzzles.referrals.inviter.inviteButton")})]})]})}function StepTwo({handleFinish:l,translate:e,valid:n,invalid:t}){const[s,o]=React$2.useState(!1),d=()=>{o(!s)},h=n.current===1?"invitationSend":"invitationsSend",f=t===1?"invitationNotSend":"invitationsNotSend";return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__body",dir:"auto",children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__title",children:e("puzzles.referrals.inviter.titleStep2")}),jsxRuntimeExports.jsxs("ul",{className:"referrals-piece__feedback",children:[n.current!==0&&jsxRuntimeExports.jsxs("li",{children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__feedbackicon icon-check-circle-black color--success"}),jsxRuntimeExports.jsxs("div",{children:[jsxRuntimeExports.jsx("strong",{children:n.current})," ",e(`puzzles.referrals.inviter.${h}`)]})]}),!!t.current&&jsxRuntimeExports.jsxs("li",{children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__feedbackicon icon-error-circle-black color--error"}),jsxRuntimeExports.jsxs("div",{children:[jsxRuntimeExports.jsx("strong",{children:t.current})," ",e(`puzzles.referrals.inviter.${f}`)]}),jsxRuntimeExports.jsx("button",{className:"un-button",type:"button",onClick:d,children:e("puzzles.referrals.inviter.whyFail")})]})]}),s?jsxRuntimeExports.jsxs("ul",{className:"referrals-piece__failsreasons",children:[jsxRuntimeExports.jsx("li",{children:e("puzzles.referrals.inviter.failReasons1")}),jsxRuntimeExports.jsx("li",{children:e("puzzles.referrals.inviter.failReasons2")}),jsxRuntimeExports.jsx("li",{children:e("puzzles.referrals.inviter.failReasons3")})]}):null]}),jsxRuntimeExports.jsx("div",{className:"referrals-piece__buttons",children:jsxRuntimeExports.jsx("button",{className:"gat--btn gat--btn__primary",type:"button",onClick:l,children:e("puzzles.referrals.inviter.continueButton")})})]})}function ReferralComponent({emitEvent:l,getEvent:e,text:n,rewards:t,referrals:s}){const o=_=>e({type:"translate",payload:_}),[d,h]=React$2.useState("step1"),f=React$2.useRef(0),u=React$2.useRef(0),p=async _=>{const S=_.map(v=>v.text),g=await l({type:"sendReferrals",payload:S});f.current=g&&g.data?g.data.valid.length:0,u.current=S.length-f.current,h("step2")};if(!s)return l({type:"success"}),null;const x=()=>{l({type:"success"})},R=()=>{if(f.current){const _=t.map(S=>(S.points*=f.current,S));l({type:"addPoints",complex:!0,finish:!0,payload:_})}else l({type:"success"})};return jsxRuntimeExports.jsx("div",{className:"referrals-piece",children:jsxRuntimeExports.jsxs("div",{className:"referrals-piece__center",children:[d==="step1"&&jsxRuntimeExports.jsx(StepOne,{translate:o,handleContinue:p,handleCancel:x,text:n}),d==="step2"&&jsxRuntimeExports.jsx(StepTwo,{translate:o,handleFinish:R,valid:f,invalid:u})]})})}function PseudoNoEvaluationEvent({onPass:l}){return React$2.useEffect(()=>{const e=setTimeout(l,0);return()=>clearTimeout(e)},[l]),null}function DragToSceneComponent({itemResolver:l,consume:e,hasComplexNotResolvers:n,hasComplexResolvers:t,resolverObjects:s,feedback:o,emitEvent:d,getEvent:h,soundActions:f,keyboardControl:u,noEvaluation:p}){const[x]=f,[R,_]=React$2.useState(!1),[S,g]=React$2.useState(!1),[v,b]=React$2.useState(!1),T=N=>h({type:"translate",payload:N}),y=React$2.useCallback(()=>{d({type:"addPoints",complex:!0,finish:R.success,onFinish:()=>{R.success?d({type:"success"}):d({type:"closeScreen"})},payload:R.rewards})},[d,R]),w=React$2.useCallback(()=>{if(s.find(P=>P===l.uid)){let P;t?(P=o.resolvers.rights.find(k=>k.uidObject===l.uid),P||(P=o.resolvers.rights[0])):P=o.resolvers.rights[0],e&&d({type:"consumeItem",payload:{uid:l.uid,targetId:l.uid,name:l.name}}),_({...P,success:!0})}else{let P;n?(P=o.notResolvers.wrongs.find(k=>k.uidObject===l.uid),P||(P=o.notResolvers.wrongs[0])):P=o.notResolvers.wrongs[0],_({...P,success:!1})}},[s,l,t,e,o,d,n]),C=React$2.useCallback(()=>{if(s.find(P=>P===(l==null?void 0:l.uid))){let P;t?P=[...o.resolvers.rights.find(M=>M.uidObject===(l==null?void 0:l.uid)).rewards.filter(M=>M.type==="var")]:P=[...o.resolvers.rights[0].rewards.filter(F=>F.type==="var")],e&&d({type:"consumeItem",payload:{uid:l==null?void 0:l.uid,targetId:l==null?void 0:l.uid,name:l==null?void 0:l.name}}),b({varsPoints:[...P],success:!0})}else{let P;n?P=[...o.notResolvers.wrongs.find(M=>M.uidObject===(l==null?void 0:l.uid)).rewards.filter(M=>M.type==="var")]:P=[...o.notResolvers.wrongs[0].rewards.filter(F=>F.type==="var")],b({varsPoints:[...P],success:!1})}},[e,d,o.notResolvers.wrongs,o.resolvers.rights,n,t,l==null?void 0:l.name,l==null?void 0:l.uid,s]),D=React$2.useCallback(()=>{d({type:"addPoints",complex:!0,finish:v==null?void 0:v.success,onFinish:()=>{v!=null&&v.success?d({type:"success"}):d({type:"closeScreen"})},payload:v!=null&&v.varsPoints?v==null?void 0:v.varsPoints:[]}),g(!1)},[d,v==null?void 0:v.success,v==null?void 0:v.varsPoints]);return React$2.useEffect(()=>{l?p?C():w():d({type:"closeScreen"})},[w,C,d,l,p]),React$2.useEffect(()=>{v&&(v!=null&&v.success?g(!0):d({type:"closeScreen"}))},[d,v]),S?jsxRuntimeExports.jsx(PseudoNoEvaluationEvent,{onPass:D}):R?jsxRuntimeExports.jsx(FeedbackComponent$1,{text:R.desc,success:R.success,playSound:x,hasTimeout:!R.desc,delay:2e3,translate:T,keyboardControl:u,functionOnClose:y}):null}function MatchItem({item:l,viewMode:e}){var n,t;return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[e==="text"&&jsxRuntimeExports.jsx("div",{className:"match-item-text",children:HTMLReactParser$1(l==null?void 0:l.content)}),e==="card"&&jsxRuntimeExports.jsx("div",{className:"match-item-image",children:jsxRuntimeExports.jsxs("figure",{children:[((n=l==null?void 0:l.img)==null?void 0:n.url)&&jsxRuntimeExports.jsx("img",{src:(t=l==null?void 0:l.img)==null?void 0:t.url,alt:l==null?void 0:l.imgName}),(l==null?void 0:l.content)&&jsxRuntimeExports.jsx("figcaption",{children:HTMLReactParser$1(l==null?void 0:l.content)})]})})]})}function CountDownDialog({translate:l,onClose:e,buttonLabel:n}){return jsxRuntimeExports.jsx("div",{className:"timer-dialog",children:jsxRuntimeExports.jsxs("div",{className:"timer-dialog__container",children:[jsxRuntimeExports.jsx("div",{className:"timer-dialog__title",children:l("storylines.misc.ready")}),jsxRuntimeExports.jsx("button",{type:"button",className:"gat--btn gat--btn__primary",onClick:e,children:jsxRuntimeExports.jsx("span",{children:l(`${n}`)})})]})})}function CountdownTimer({initialSeconds:l=10,isPaused:e,shouldStart:n,shouldReset:t,onTimeOver:s}){const[o,d]=React$2.useState(l),[h,f]=React$2.useState(!1),u=React$2.useRef();React$2.useEffect(()=>{t&&(d(l),f(!1))},[t,l]),React$2.useEffect(()=>{e&&f(!1)},[e]),React$2.useEffect(()=>{n&&f(!0)},[n]),React$2.useEffect(()=>(h&&o>0?u.current=setInterval(()=>{d(x=>x-1),o===1&&s()},1e3):o===0&&(clearInterval(u.current),f(!1)),()=>clearInterval(u.current)),[h,s,o]);const p=x=>{const R=Math.floor(x/60),_=x%60,S=String(R).padStart(2,"0"),g=String(_).padStart(2,"0");return`${S}:${g}`};return jsxRuntimeExports.jsx("div",{className:`count-down ${o<10&&"count-down--finalseconds"}`,children:jsxRuntimeExports.jsx("div",{children:p(o)})})}function MatchPuzzleComponent({emitEvent:l,soundActions:e=[()=>{},()=>{}],getEvent:n,info:t,specificFeedbacks:s,setResolveAction:o,nodeId:d,viewMode:h,title:f,sources:u,destinations:p,correctPairings:x,timer:R=0,keyboardControl:_,backgroundImage:S}){const g=ke=>n({type:"translate",payload:ke}),v=`match-puzzle_${d}`,[b,T]=React$2.useState([]),[y,w]=React$2.useState(null),[C,D]=React$2.useState(!1),[N,P]=React$2.useState(!1),[k,F]=React$2.useState(""),[M,j]=React$2.useState(!1),[U,B]=React$2.useState([]),[X]=e;useEkho({soundActions:e});const re=ke=>{X("click-ui");const Qe=ft=>ft==null?void 0:ft.startsWith("source-item"),bt=ft=>ft==null?void 0:ft.startsWith("destination-item");if(ke.id===y){w(null);return}const qe=Qe(ke.id),ct=Qe(y),Be=bt(ke.id),ot=bt(y);if(qe&&ot||Be&&ct){K(ke);return}w(ke.id)},se=ke=>{let Qe;return ke.startsWith("destination-item")?Qe={[y]:ke}:Qe={[ke]:y},x.some(bt=>{const qe=JSON.stringify(bt),ct=JSON.stringify(Qe);return qe===ct})},Z=(ke,Qe)=>{const bt=new Map(ke.map(qe=>[qe.id,{...qe}]));return Qe.forEach(qe=>{bt.has(qe.id)?bt.get(qe.id).points+=qe.points:bt.set(qe.id,{...qe})}),Array.from(bt.values())},K=ke=>{var Qe,bt;if(X("click-ui"),se(ke.id)){const qe=ke.id.startsWith("source-item")?ke.id:y,ct=ke.id.startsWith("destination-item")?ke.id:y,Be=[...b,{[qe]:ct}];if(T(Be),s.specificCorrectFeedbacks){const ot=s==null?void 0:s.correctFeedbacks.find(Ne=>Ne.id===`${qe}-${ct}`),ft=Z(U,ot.rewards);B([...ft]),te(Be)&&(et(),j(!0)),ot.desc&&(F(ot==null?void 0:ot.desc),P(!0),D(!0),et());const Ge=te(Be);!ot.desc&&Ge&&ue(ft)}else if(te(Be)&&(et(),j(!0)),te(Be)){P(!0),t.solution.right.desc&&(et(),F(t.solution.right.desc)),D(!0),j(!0);const ft=Z(U,t.solution.right.rewards);B([...ft]),t.solution.right.desc===""&&setTimeout(()=>{ue(ft)},3e3)}w(null)}else if(document.querySelector(`#${ke.id}`).classList.add("match-button--error"),document.querySelector(`#${y}`).classList.add("match-button--error"),setTimeout(()=>{document.querySelector(`#${ke.id}`).classList.remove("match-button--error"),document.querySelector(`#${y}`).classList.remove("match-button--error"),w(null)},1e3),s.specificWrongFeedbacks){const qe=ke.id.startsWith("destination-item")?ke.id:y,ct=s==null?void 0:s.wrongFeedbacks.find(ot=>ot.id===qe),Be=Z(U,ct.rewards);B([...Be]),ct!=null&&ct.desc&&(F(ct.desc),P(!1),D(!0),et())}else{const qe=Z(U,t.solution.wrong.rewards);B([...qe]),(bt=(Qe=t.solution)==null?void 0:Qe.wrong)!=null&&bt.desc&&(F(t.solution.wrong.desc),D(!0),et())}},te=ke=>{if(x.length!==ke.length)return!1;const Qe=new Set(x.map(qe=>JSON.stringify(qe))),bt=new Set(ke.map(qe=>JSON.stringify(qe)));for(const qe of bt)if(!Qe.has(qe))return!1;return!0},ue=ke=>{X("score");const Qe=ke?[...ke]:[...U];l({type:"addPoints",complex:!0,finish:!0,payload:Qe}),l({type:"passPuzzle"})},me=()=>{D(!1),P(!1),F(""),le&&(Ve(),z(!0)),!le&&!M&&xt(),M&&ue()},J=React$2.useMemo(()=>Object.assign({},...b),[b]),H=(ke,Qe)=>J[ke]===Qe;React$2.useEffect(()=>{o(()=>{X("score"),et(),P(!0),F(t.solution.right.desc);const ke=[...U,...t.resolve.rewards],Qe=[...x];T(Qe),setTimeout(()=>{P(!1),D(!1),l({type:"hidePuzzleButtons",payload:!1}),l({type:"puzzleAction",action:"resolve",payload:{element:v,rewards:ke,finish:!0}})},5e3)})},[U,x,l,t.resolve.rewards,t.solution.right.desc,X,v,o]);const W=(ke,Qe)=>b.findIndex(bt=>{const qe=Object.keys(bt)[0],ct=Object.values(bt)[0];return qe===ke&&ct===Qe}),[V,z]=React$2.useState(!0),[Y,ie]=React$2.useState("storylines.misc.start"),[le,fe]=React$2.useState(!1),ce=()=>{ie("storylines.misc.retry"),z(!1),fe(!1),xt()},[ge,Se]=React$2.useState(!1),[Ae,Fe]=React$2.useState(!1),[De,Je]=React$2.useState(!1),ut=()=>{let ke=Z(U,t.timerFeedback.rewards);if(s.specificCorrectFeedbacks){const Qe=new Map(ke.map(bt=>[bt.id,{...bt}]));b.forEach(bt=>{const qe=Object.keys(bt)[0],ct=bt[qe],Be=s.correctFeedbacks.find(ot=>ot.id===`${qe}-${ct}`);Be!=null&&Be.rewards&&Be.rewards.forEach(ot=>{if(Qe.has(ot.id)){const ft=Qe.get(ot.id);ft.points-=ot.points,Qe.set(ot.id,ft)}})}),ke=Array.from(Qe.values())}B(ke),T([]),fe(!0),F(t.timerFeedback.desc),D(!0)},et=()=>{Se(!0),Fe(!1),Je(!1)},xt=()=>{Se(!1),Fe(!0),Je(!1)},Ve=()=>{Se(!1),Fe(!1),Je(!0)},Me=React$2.useCallback(()=>{const ke=document.querySelector('button[id^="source-item"]'),Qe=document.querySelector('button[id^="destination-item"]'),bt=ke.getBoundingClientRect().right,ct=Qe.getBoundingClientRect().left+6-bt;u.items.forEach((Be,ot)=>{if(Be.matchDestinationId!==void 0&&Be.matchDestinationId!==null){const ft=document.querySelector(`#${Be.id}`),Ge=document.querySelector(`#${Be.matchDestinationId}`),Ne=ft.getBoundingClientRect().top,Re=Ge.getBoundingClientRect().top,_e=Re>Ne,Oe=Math.abs(Re-Ne),Ke=Math.sqrt(ct*ct+Oe*Oe),Ft=ft.querySelector(".match-line__hipotenuse");Ft.style.setProperty("width",`${Ke}px`);const Nt=Math.atan(Oe/ct),je=_e?Nt*(180/Math.PI):-Nt*(180/Math.PI);Ft.style.setProperty("transform",`rotate(${je}deg)`)}})},[u.items]);React$2.useEffect(()=>(Me(),window.addEventListener("resize",Me),()=>{window.removeEventListener("resize",Me)}),[Me]);const Le=React$2.useMemo(()=>{let ke="";return ke="match ",S!=null&&S.url&&(ke+="match--with-custom-bg"),ke},[S==null?void 0:S.url]),Ye={backgroundImage:S!=null&&S.url?`url('${S.url}')`:""};return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsxs("div",{className:Le,style:Ye,children:[(f||R>0)&&jsxRuntimeExports.jsxs("header",{className:"match__header",children:[jsxRuntimeExports.jsx("div",{}),f&&jsxRuntimeExports.jsx("div",{className:"match__title","data-testid":"match__title",children:HTMLReactParser$1(f)}),R>0&&jsxRuntimeExports.jsx(CountdownTimer,{initialSeconds:R,isPaused:ge,shouldStart:Ae,shouldReset:De,onTimeOver:ut})]}),jsxRuntimeExports.jsx("div",{className:"match__columns",children:jsxRuntimeExports.jsxs("div",{className:"match__columns-scroll",children:[jsxRuntimeExports.jsxs("div",{className:"match__column-wrap",children:[u.title&&jsxRuntimeExports.jsx("div",{className:"match__subtitle",children:HTMLReactParser$1(u.title)}),jsxRuntimeExports.jsx("div",{className:"match__column",children:u.items.map(ke=>jsxRuntimeExports.jsxs("button",{id:ke.id,"data-testid":ke.id,className:["unset-button match-button",y===ke.id&&"match-button--marked",H(ke.id,ke.matchDestinationId)&&"match-button--success",W(ke.id,ke.matchDestinationId)+1&&"match-button--matched"].filter(Boolean).join(" "),style:{"--matched-color":`var(--matched-color-${W(ke.id,ke.matchDestinationId)+1})`},disabled:H(ke.id,ke.matchDestinationId),type:"button",onClick:()=>re(ke),children:[jsxRuntimeExports.jsx(MatchItem,{item:ke,viewMode:h}),jsxRuntimeExports.jsx("div",{className:"icon-check-circle-black color--success"}),jsxRuntimeExports.jsx("div",{className:"icon-error-circle-black color--error"}),jsxRuntimeExports.jsx("div",{className:"match-line__hipotenuse"})]},ke.id))})]}),jsxRuntimeExports.jsxs("div",{className:"match__column-wrap",children:[p.title&&jsxRuntimeExports.jsx("div",{className:"match__subtitle",children:HTMLReactParser$1(p.title)}),jsxRuntimeExports.jsx("div",{className:"match__column",children:p.items.map(ke=>jsxRuntimeExports.jsxs("button",{id:ke.id,"data-testid":ke.id,className:["unset-button match-button",y===ke.id&&"match-button--marked",H(ke.matchSourceId,ke.id)&&"match-button--success",W(ke.matchSourceId,ke.id)+1&&"match-button--matched"].filter(Boolean).join(" "),style:{"--matched-color":`var(--matched-color-${W(ke.matchSourceId,ke.id)+1})`},disabled:H(ke.matchSourceId,ke.id),type:"button",onClick:()=>re(ke),children:[jsxRuntimeExports.jsx(MatchItem,{item:ke,viewMode:h}),jsxRuntimeExports.jsx("div",{className:"icon-check-circle-black color--success"}),jsxRuntimeExports.jsx("div",{className:"icon-error-circle-black color--error"})]},ke.id))})]})]})})]}),R>0&&V&&jsxRuntimeExports.jsx(CountDownDialog,{buttonLabel:Y,translate:g,onClose:ce}),C&&jsxRuntimeExports.jsx(FeedbackComponent$1,{success:N,text:k,hasTimeout:!k,translate:g,timeExpired:le,functionOnClose:me,keyboardControl:_})]})}function SortPuzzleComponent({emitEvent:l,soundActions:e=[()=>{},()=>{}],getEvent:n,info:t,specificFeedbacks:s,setResolveAction:o,nodeId:d,destinationAreas:h,draggableItems:f,noDraggableItems:u,background:p,showDestinationAreas:x,timer:R,viewMode:_,keyboardControl:S}){var Pt,lt;const g=ze=>n({type:"translate",payload:ze}),v=`sort-puzzle_${d}`,[b,T]=React$2.useState(!1),[y,w]=React$2.useState(!1),[C,D]=React$2.useState(""),[N,P]=React$2.useState(!1),[k,F]=React$2.useState([]),[M]=e;useEkho({soundActions:e});const j=(ze,Ze)=>{const Et=rt=>rt.current.flatMap(ee=>{const pe=ee.acceptedItems;return pe||[]}).sort(),Te=Et(ze),at=Et(Ze);return Te.length!==at.length?!1:Te.join(",")===at.join(",")},U=React$2.useRef(0),B=React$2.useRef([]),X=React$2.useRef([]);React$2.useEffect(()=>{_==="matchMode"&&!U.current&&h.forEach(ze=>{U.current+=1,B.current.push({id:ze.id,acceptedItems:ze.acceptedItems}),X.current.push({id:ze.id,acceptedItems:[]})})},[h,_]);const re=React$2.useRef(null),se=React$2.useRef(null),[Z,K]=React$2.useState(),te=React$2.useCallback(()=>{const ze=re.current.clientHeight,Ze=se.current.clientHeight;K(ze/Ze),se.current.style.transform=`scale(${ze/Ze})`},[]);React$2.useEffect(()=>(te(),window.addEventListener("resize",te),()=>{window.removeEventListener("resize",te)}),[te]);const ue=React$2.useRef([]),me=React$2.useCallback(()=>{const ze=document.querySelectorAll(".sort-destination-area");ue.current=[],ze&&ze.forEach(Ze=>{ue.current.push({id:Ze.id,top:Ze.getBoundingClientRect().top,left:Ze.getBoundingClientRect().left,right:Ze.getBoundingClientRect().right,bottom:Ze.getBoundingClientRect().bottom})})},[]);React$2.useEffect(()=>(me(),window.addEventListener("resize",me),()=>{window.removeEventListener("resize",me)}),[me]);const J=(ze,Ze)=>{const Et=new Map(ze.map(Te=>[Te.id,{...Te}]));return Ze.forEach(Te=>{Et.has(Te.id)?Et.get(Te.id).points+=Te.points:Et.set(Te.id,{...Te})}),Array.from(Et.values())},H=ze=>{M("score");const Ze=ze?[...ze]:[...k];l({type:"addPoints",complex:!0,finish:!0,payload:Ze}),l({type:"passPuzzle"})},W=()=>{t.solution.right.desc&&(Ke(),D(t.solution.right.desc));const ze=J(k,t.solution.right.rewards);F([...ze]),ie(null,!0),t.solution.right.desc===""&&setTimeout(()=>{Y(),H(ze)},3e3)},V=(ze,Ze)=>{const Et=s==null?void 0:s.correctFeedbacks.find(at=>at.id===ze.id),Te=J(k,Et.rewards);F([...Te]),Et.desc&&ie(Et.desc,!0),!Et.desc&&Ze&&(ie(null,!0),setTimeout(()=>{Y(),H(Te)},3e3))},z=()=>{var Ze;const ze=J(k,t.solution.wrong.rewards);F([...ze]),t.solution.wrong.desc&&ie((Ze=t.solution.wrong)==null?void 0:Ze.desc,!1)},Y=React$2.useCallback(()=>{D(""),w(!1),T(!1),l({type:"hidePuzzleButtons",payload:!1})},[l]),ie=(ze,Ze=!1)=>{ze&&D(ze),Ze&&w(!0),T(!0),l({type:"hidePuzzleButtons",payload:!0}),Ke()},le=(ze,Ze)=>{setTimeout(()=>{Ze.classList.remove("sort-draggable-item--error"),Ze.classList.add("sort-draggable-item--resetting"),Ze.style.setProperty("transform",ze.transform),setTimeout(()=>Ze.classList.remove("sort-draggable-item--resetting"),1e3)},1e3)},fe=ze=>{if(ze==="none")return{x:0,y:0};const Et=ze.replace("matrix(","").replace("matrix3d(","").replace(")","").split(", ");return Et.length===6?{x:parseFloat(Et[4]),y:parseFloat(Et[5])}:Et.length===16?{x:parseFloat(Et[12]),y:parseFloat(Et[13])}:{x:0,y:0}},ce=React$2.useRef(!1),[ge,Se]=React$2.useState(),[Ae,Fe]=React$2.useState(),[De,Je]=React$2.useState(),ut=(ze,Ze)=>{ce.current=Ze,Se(ze.nativeEvent.x||ze.touches[0].pageX),Fe(ze.nativeEvent.y||ze.touches[0].pageY);const Et=document.querySelector(`#${Ze}`),at=window.getComputedStyle(Et).getPropertyValue("transform");Et.classList.add("sort-draggable-item--dragging"),Je(fe(at))},et=(ze,Ze)=>{const Et=document.querySelector(`#${Ze}`),Te=Et.getBoundingClientRect().width,at=Et.getBoundingClientRect().height,rt=Et.offsetLeft,ve=Et.offsetTop,ee=Et.parentElement.getBoundingClientRect().width,pe=Et.parentElement.getBoundingClientRect().height,Ee=Et.parentElement.getBoundingClientRect().left,we=Et.parentElement.getBoundingClientRect().right,de=Et.parentElement.getBoundingClientRect().top,be=Et.parentElement.getBoundingClientRect().bottom;if(ce&&ge&&Ae&&(ze.nativeEvent.x||ze.touches[0].pageX)>Ee&&(ze.nativeEvent.x||ze.touches[0].pageX)<we){const Ue=(ze.nativeEvent.x||ze.touches[0].pageX)-ge,tt=(ze.nativeEvent.y||ze.touches[0].pageY)-Ae;Et.style.transform=`translate(${De.x+Ue/Z}px, ${De.y+tt/Z}px)`,Et.getBoundingClientRect().left>=Ee&&Et.getBoundingClientRect().right<=we&&Et.getBoundingClientRect().top>=de&&Et.getBoundingClientRect().bottom<=be&&(Et.style.transform=`translate(${De.x+Ue/Z}px, ${De.y+tt/Z}px)`),Et.getBoundingClientRect().left<=Ee&&(Et.style.transform=`translate(${-rt}px, ${De.y+tt/Z}px)`),Et.getBoundingClientRect().right>=we&&(Et.style.transform=`translate(${(ee-Te)/Z-rt}px, ${De.y+tt/Z}px)`),Et.getBoundingClientRect().top<=de&&(Et.style.transform=`translate(${De.x+Ue/Z}px, ${-ve}px)`),Et.getBoundingClientRect().bottom>=be&&(Et.style.transform=`translate(${De.x+Ue/Z}px, ${(pe-at)/Z-ve}px)`)}},xt=(ze,Ze)=>{const Te=document.querySelector(`#${ze}`).getBoundingClientRect(),at=ue.current.find(ve=>ve.id===Ze&&!(Te.left>=ve.right||Te.right<=ve.left||Te.top>=ve.bottom||Te.bottom<=ve.top)),rt=ue.current.find(ve=>ve.id!==Ze&&!(Te.left>=ve.right||Te.right<=ve.left||Te.top>=ve.bottom||Te.bottom<=ve.top));return at?"correctArea":rt?"incorrectArea":"neutral"},Ve=(ze,Ze)=>{if(ce.current===Ze){M("click-ui");const Et=document.querySelector(`#${Ze}`),Te=f.find(at=>Ze===at.id);if(Et.classList.remove("sort-draggable-item--dragging"),ce.current=null,Se(null),Fe(null),Je(null),_!=="resolveMode"){const at=xt(Ze,Te.destination.id);if(at==="correctArea"){if(_==="anyItemResolver"&&(M("score"),Ke(),Et.classList.add("sort-draggable-item--success"),s.specificCorrectFeedbacks?(P(!0),V(Te,!0)):W()),_==="matchMode")if(M("score"),Et.classList.add("sort-draggable-item--success"),X.current.find(ve=>ve.id===Te.destination.id).acceptedItems.push(Te.id),s.specificCorrectFeedbacks){const ve=j(X,B);ve&&P(!0),V(Te,ve)}else j(X,B)&&W();return}else if(at==="incorrectArea"){if(_==="anyItemResolver"||_==="matchMode"){if(M("fail"),Et.classList.add("sort-draggable-item--error"),s.specificWrongFeedbacks){const rt=s==null?void 0:s.wrongFeedbacks.find(ee=>ee.id===Te.id),ve=J(k,rt.rewards);F([...ve]),rt.desc&&ie(rt.desc,!1)}else z();le(Te,Et)}return}}}},Me=()=>{let ze=!1;Ke(),f.forEach(Ze=>{const Et=document.querySelector(`#${Ze.id}`);if(Ze.destination.id)xt(Ze.id,Ze.destination.id)!=="correctArea"?(ze=!0,Et.classList.add("sort-draggable-item--error"),le(Ze,Et)):Et.classList.add("sort-draggable-item--success");else if(!Ze.destination.id){const Te=document.querySelector(`#${Ze.id}`),at=Te.getBoundingClientRect();ue.current.find(ve=>!(at.left>=ve.right||at.right<=ve.left||at.top>=ve.bottom||at.bottom<=ve.top))&&(ze=!0,Te.classList.add("sort-draggable-item--error"),le(Ze,Te))}}),ze?(M("fail"),z()):(M("score"),W())},Le=()=>{f.forEach(ze=>{const Ze=document.querySelector(`#${ze.id}`);Ze.classList.remove("sort-draggable-item--error"),Ze.classList.remove("sort-draggable-item--success"),Ze.classList.add("sort-draggable-item--resetting"),Ze.style.setProperty("transform",ze.transform),setTimeout(()=>Ze.classList.remove("sort-draggable-item--resetting"),1e3)})},Ye=()=>{Y(),ct&&(Nt(),Le(),Qe(!0)),!ct&&!N&&Ft(),N&&H()},[ke,Qe]=React$2.useState(!0),[bt,qe]=React$2.useState("storylines.misc.start"),[ct,Be]=React$2.useState(!1),[ot,ft]=React$2.useState(!1),[Ge,Ne]=React$2.useState(!1),[Re,_e]=React$2.useState(!1),Oe=()=>{let ze=J(k,t.timerFeedback.rewards);if(s.specificCorrectFeedbacks){const Ze=new Map(ze.map(Et=>[Et.id,{...Et}]));ze=Array.from(Ze.values())}_==="matchMode"&&X.current.forEach(Ze=>{Ze.acceptedItems=[]}),F(ze),Be(!0),ie(t.timerFeedback.desc,!1)},Ke=()=>{ft(!0),Ne(!1),_e(!1)},Ft=()=>{ft(!1),Ne(!0),_e(!1)},Nt=()=>{ft(!1),Ne(!1),_e(!0)},je=()=>{qe("storylines.misc.retry"),Qe(!1),Be(!1),Ft()};React$2.useEffect(()=>{o(()=>{M("score"),Ke(),w(!0),D(t.solution.right.desc);const ze=[...k,...t.resolve.rewards];Y(),l({type:"puzzleAction",action:"resolve",payload:{element:v,rewards:ze,finish:!0}})})},[k,l,t.resolve.rewards,t.solution.right.desc,M,v,Y,o]);const vt={backgroundImage:(Pt=p==null?void 0:p.img)!=null&&Pt.url?`url('${(lt=p==null?void 0:p.img)==null?void 0:lt.url}')`:""};return jsxRuntimeExports.jsxs("div",{ref:re,className:"sort-wrapper",children:[jsxRuntimeExports.jsxs("div",{ref:se,className:"sort-puzzle",style:vt,children:[u.map(ze=>jsxRuntimeExports.jsxs("div",{id:`${ze.id}`,className:"sort-no-draggable-item",style:{"--height":`${ze.heightInPercentage}%`,"--width":`${ze.widthInPercentage}%`,"--transform":`${ze.transform}`,"--backgroundColor":`${ze.backgroundColor}`},children:[ze.imgId&&jsxRuntimeExports.jsx("img",{src:ze.img.url,alt:ze.img.name}),ze.text&&HTMLReactParser$1(ze.text)]},ze.id)),h.map(ze=>jsxRuntimeExports.jsx("div",{id:ze.id,className:`sort-destination-area ${x?"sort-destination-area--revelable":""}`,style:{"--height":`${ze.heightInPercentage}%`,"--width":`${ze.widthInPercentage}%`,"--transform":`${ze.transform}`}},ze.id)),f.map(ze=>jsxRuntimeExports.jsxs("div",{id:`${ze.id}`,className:"sort-draggable-item",onMouseDown:Ze=>ut(Ze,ze.id),onTouchStart:Ze=>ut(Ze,ze.id),onMouseMove:Ze=>et(Ze,ze.id),onTouchMove:Ze=>et(Ze,ze.id),onMouseUp:Ze=>Ve(Ze,ze.id),onMouseLeave:Ze=>Ve(Ze,ze.id),onTouchEnd:Ze=>Ve(Ze,ze.id),style:{"--height":`${ze.heightInPercentage}%`,"--width":`${ze.widthInPercentage}%`,"--transform":`${ze.transform}`,"--backgroundColor":`${ze.backgroundColor}`},children:[ze.imgId&&jsxRuntimeExports.jsx("img",{src:ze.img.url,alt:ze.img.name}),ze.text&&HTMLReactParser$1(ze.text)]},ze.id))]}),_==="resolveMode"&&jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>{Me()},className:"gat--btn gat--btn__primary sort-resolve-button",children:jsxRuntimeExports.jsx("span",{children:g("storylines.misc.check")})}),R>0&&ke&&jsxRuntimeExports.jsx(CountDownDialog,{buttonLabel:bt,translate:g,onClose:je}),b&&jsxRuntimeExports.jsx(FeedbackComponent$1,{success:y,text:C,hasTimeout:!C,translate:g,timeExpired:ct,functionOnClose:Ye,keyboardControl:S}),R>0&&jsxRuntimeExports.jsx("div",{className:"sort-timer",children:jsxRuntimeExports.jsx(CountdownTimer,{initialSeconds:R,isPaused:ot,shouldStart:Ge,shouldReset:Re,onTimeOver:Oe})})]})}exports.AnimationComponent=MultipleAnimation;exports.AutoEvaluationComponent=AutoEvaluation;exports.CardsSelectorPuzzleComponent=CardsSelectorPuzzleComponent;exports.CartelComponent=CartelComponent;exports.ChainedImageClickPuzzleComponent=ChainedImageClickPuzzleComponent;exports.ChangeCamera=ChangeCamera;exports.ComicComponent=ComicComponent;exports.ConversationalComponent=ConversationalComponent;exports.ConversationalProComponent=ConversationalProComponent;exports.CrackerPuzzleComponent=CrackerPuzzleComponent;exports.DecisionComponent=DecisionComponent;exports.DialogComponent=DialogComponent;exports.DragItemPuzzleComponent=DragItemPuzzleComponent;exports.DragToSceneComponent=DragToSceneComponent;exports.FrameImageClickComponent=FrameImageClickComponent;exports.HackerPuzzleComponent=HackerPuzzleComponent;exports.HangedPuzzleComponent=HangedPuzzleComponent;exports.ImageClickPuzzleComponent=ImageClickPuzzleComponent;exports.ImageComponent=ImageComponent;exports.InventoryItem=InventoryItem;exports.KeyboardPuzzleComponent=KeyboardPuzzleComponent;exports.LecturesComponent=LecturesComponent;exports.LoginPuzzleComponent=LoginPuzzleComponent;exports.MatchPuzzleComponent=MatchPuzzleComponent;exports.NoticeComponent=NoticeComponent;exports.PatternComponent=PatternComponent;exports.PdfComponent=PdfComponent;exports.PdfVisor=PdfVisor;exports.ReferralComponent=ReferralComponent;exports.SortPuzzleComponent=SortPuzzleComponent;exports.SurveyComponent=SurveyComponent;exports.TerminalPuzzleComponent=TerminalPuzzleComponent;exports.TestComponent=TestComponent;exports.TextClickPuzzleComponent=TextClickPuzzleComponent;exports.UrlComponent=UrlComponent;exports.VideoComponent=VideoComponent;exports.VideoVisor=VideoVisor;exports.WebBuilderPuzzleComponent=WebBuilderPuzzleComponent;exports.WriterPuzzleComponent=WriterPuzzleComponent;
+              ${g&&Oe()?"glowing-animation":""}`,"aria-label":LangIsRtl()?Fe("storylines.misc.rewind"):Fe("storylines.misc.forward"),children:jsxRuntimeExports.jsx("span",{className:LangIsRtl()?"icon-back":"icon-next"})})]})})]})}const activeCache=arcadeThreeCore.ProgressManager.request("AssetLoader").cache,assetLoader=new arcadeThreeCore.AssetLoader(void 0,activeCache);function Animation({animation:l,loopTimes:e,onAnimationFinish:n,onAnimationSave:t,resource:s,makeDefault:o}){const[d,h]=React$2.useState(!1),f=fiber.useThree(p=>p.scene),u=React$2.useRef(0);return React$2.useEffect(()=>{h(!1)},[s.uid,l==null?void 0:l.url]),React$2.useEffect(()=>{if(!d){const p=f.getObjectByProperty("uid",s.uid);if(p&&l&&l.url&&p.skeletonId===(l==null?void 0:l.skeletonId))if(o)t({uid:s.uid,animation:l==null?void 0:l.id,index:p.index}),n();else{const x=p.userData.animator,R=()=>{const _=x.getAction(l.url);_.setLoop(three.LoopRepeat,1/0),_.reset();function S(){u.current+=1,u.current>=e&&g()}function g(){x.mix("idle"),n(),x.removeEventListener("loop",S)}x.mix(l==null?void 0:l.url).then(v=>{v&&(u.current=1,u.current>=e?g():x.addEventListener("loop",S))}),h(!0)};x.getAction(l==null?void 0:l.url)?(x.setTime(0),R()):assetLoader.load(l==null?void 0:l.url,_=>{x.register(l==null?void 0:l.url,_.animations[0]),x.setTime(0),R()},void 0,_=>{console.error(`Asset loader failed with: ${l.url}`,_),n()})}else n()}},[f,l==null?void 0:l.url,e,d,s.uid,o,l,s,n,t]),null}function MultipleAnimation({animations:l=[],enableInteraction:e,emitEvent:n}){const t=l.length,s=React$2.useRef(0),o=()=>{s.current+=1,s.current>=t&&e&&n({type:"success"})},d=h=>{n({type:"saveAnimation",payload:h})};return React$2.useEffect(()=>{s.current=0},[l]),React$2.useEffect(()=>{e||n({type:"success"})},[n,e]),l.map(({animation:h,...f},u)=>{var p;return jsxRuntimeExports.jsx(Animation,{animation:h,...f,onAnimationFinish:o,onAnimationSave:d},(h==null?void 0:h.id)||((p=f.resource)==null?void 0:p.uid)||u)})}function EmailPill({text:l,error:e,handleClick:n}){return jsxRuntimeExports.jsxs("div",{"data-testid":`${e?" pill--error":"pill--ok"}`,className:`email-pill ${e?" email-pill--error":""}`,children:[jsxRuntimeExports.jsx("div",{children:l}),jsxRuntimeExports.jsx("div",{className:"email-pill__delete",children:jsxRuntimeExports.jsx("button",{type:"button",onClick:n,className:"icon-close unset-button","aria-label":"icon click"})})]})}function StepOne({handleContinue:l,handleCancel:e,translate:n,text:t}){const[s,o]=React$2.useState([]),[d,h]=React$2.useState(0),[f,u]=React$2.useState(0),p=React$2.useRef(null),x=(g,v,b)=>{g.stopPropagation(),o(s.filter(T=>T!==s[b])),v.error&&h(d-1),v.isRepeat&&u(f-1)},R=()=>{p.current&&p.current.focus()},_=()=>{[" ",",",";","."].includes(p.current.value)&&(p.current.value="")},S=g=>{const v=p.current.value,b=["Space","Comma","Period","Enter"],T=["Space","Comma","Enter","Tab"];v===""&&(b.includes(g.code)||g.keyCode==="186"||g.key==="Enter"||g.key===" ")?g.preventDefault():p.current.value.length>1&&(T.includes(g.code)||g.type==="blur")&&(g.preventDefault(),/[A-Za-z0-9._%+-]{3,}@[A-Za-z0-9_+-]{2,}([.]{1}[a-zA-Z]{2,}|[.]{1}[a-zA-Z]{2,}[.]{1}[a-zA-Z]{2,})/.test(v)?s.find(w=>w.text===v)?(u(f+1),o([...s,{text:v,error:!0,isRepeat:!0}])):o([...s,{text:v}]):(o([...s,{text:v,error:!0}]),h(d+1)),p.current.value="")};return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__body",children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__title",children:n("puzzles.referrals.inviter.titleStep1")}),jsxRuntimeExports.jsx("div",{className:"referrals-piece__subtitle",children:t}),jsxRuntimeExports.jsxs("div",{className:"referrals-piece__form",children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__instructions",children:[jsxRuntimeExports.jsx("div",{dir:"auto",children:n("puzzles.referrals.inviter.instructions")}),jsxRuntimeExports.jsx("div",{dir:"auto",children:n("puzzles.referrals.inviter.limit")})]}),jsxRuntimeExports.jsx("div",{className:"referrals-piece__faketextarea",onKeyUp:()=>{},role:"button",tabIndex:"-1",onClick:R,"aria-labelledby":"list of emails",children:jsxRuntimeExports.jsxs("div",{className:"referrals-piece__scrollarea",id:"list of emails",children:[s&&s.map((g,v)=>jsxRuntimeExports.jsx(EmailPill,{text:g.text,error:g.error,handleClick:b=>x(b,g,v),emailPillIndex:v},`${s.indexOf(g)}`)),s.length<=9?jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsx("input",{id:"email",ref:p,className:"referrals-piece__inputemail",onChange:_,onKeyDown:S,onBlur:S,type:"email",autoComplete:"off"}),jsxRuntimeExports.jsx("label",{className:"referrals-piece__emaillabel",htmlFor:"email",children:jsxRuntimeExports.jsx("span",{children:n("puzzles.referrals.inviter.skipButton")})})]}):null]})}),jsxRuntimeExports.jsxs("div",{dir:LangIsRtl()?"rtl":"auto",className:"referrals-piece__footervalidation",children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__errormessage",children:[jsxRuntimeExports.jsx("div",{children:f>0?n("puzzles.referrals.inviter.errorEmailRepeat"):null}),jsxRuntimeExports.jsx("div",{children:d>0?n("puzzles.referrals.inviter.errorMessage"):null})]}),jsxRuntimeExports.jsxs("div",{className:"referrals-piece__counter","data-testid":"pillcounter",children:[s.length,"/10"]})]})]})]}),jsxRuntimeExports.jsxs("div",{className:"referrals-piece__buttons",children:[jsxRuntimeExports.jsx("button",{"data-testid":"cancelButton",className:"gat--btn gat--btn__secondary",type:"button",onClick:e,children:n("puzzles.referrals.inviter.skipButton")}),jsxRuntimeExports.jsx("button",{className:`gat--btn gat--btn__primary ${f>0||d>0||s.length===0?" disabled":""}`,type:"button",disabled:d>0||s.length===0,onClick:()=>l(s),children:n("puzzles.referrals.inviter.inviteButton")})]})]})}function StepTwo({handleFinish:l,translate:e,valid:n,invalid:t}){const[s,o]=React$2.useState(!1),d=()=>{o(!s)},h=n.current===1?"invitationSend":"invitationsSend",f=t===1?"invitationNotSend":"invitationsNotSend";return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsxs("div",{className:"referrals-piece__body",dir:"auto",children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__title",children:e("puzzles.referrals.inviter.titleStep2")}),jsxRuntimeExports.jsxs("ul",{className:"referrals-piece__feedback",children:[n.current!==0&&jsxRuntimeExports.jsxs("li",{children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__feedbackicon icon-check-circle-black color--success"}),jsxRuntimeExports.jsxs("div",{children:[jsxRuntimeExports.jsx("strong",{children:n.current})," ",e(`puzzles.referrals.inviter.${h}`)]})]}),!!t.current&&jsxRuntimeExports.jsxs("li",{children:[jsxRuntimeExports.jsx("div",{className:"referrals-piece__feedbackicon icon-error-circle-black color--error"}),jsxRuntimeExports.jsxs("div",{children:[jsxRuntimeExports.jsx("strong",{children:t.current})," ",e(`puzzles.referrals.inviter.${f}`)]}),jsxRuntimeExports.jsx("button",{className:"un-button",type:"button",onClick:d,children:e("puzzles.referrals.inviter.whyFail")})]})]}),s?jsxRuntimeExports.jsxs("ul",{className:"referrals-piece__failsreasons",children:[jsxRuntimeExports.jsx("li",{children:e("puzzles.referrals.inviter.failReasons1")}),jsxRuntimeExports.jsx("li",{children:e("puzzles.referrals.inviter.failReasons2")}),jsxRuntimeExports.jsx("li",{children:e("puzzles.referrals.inviter.failReasons3")})]}):null]}),jsxRuntimeExports.jsx("div",{className:"referrals-piece__buttons",children:jsxRuntimeExports.jsx("button",{className:"gat--btn gat--btn__primary",type:"button",onClick:l,children:e("puzzles.referrals.inviter.continueButton")})})]})}function ReferralComponent({emitEvent:l,getEvent:e,text:n,rewards:t,referrals:s}){const o=_=>e({type:"translate",payload:_}),[d,h]=React$2.useState("step1"),f=React$2.useRef(0),u=React$2.useRef(0),p=async _=>{const S=_.map(v=>v.text),g=await l({type:"sendReferrals",payload:S});f.current=g&&g.data?g.data.valid.length:0,u.current=S.length-f.current,h("step2")};if(!s)return l({type:"success"}),null;const x=()=>{l({type:"success"})},R=()=>{if(f.current){const _=t.map(S=>(S.points*=f.current,S));l({type:"addPoints",complex:!0,finish:!0,payload:_})}else l({type:"success"})};return jsxRuntimeExports.jsx("div",{className:"referrals-piece",children:jsxRuntimeExports.jsxs("div",{className:"referrals-piece__center",children:[d==="step1"&&jsxRuntimeExports.jsx(StepOne,{translate:o,handleContinue:p,handleCancel:x,text:n}),d==="step2"&&jsxRuntimeExports.jsx(StepTwo,{translate:o,handleFinish:R,valid:f,invalid:u})]})})}function PseudoNoEvaluationEvent({onPass:l}){return React$2.useEffect(()=>{const e=setTimeout(l,0);return()=>clearTimeout(e)},[l]),null}function DragToSceneComponent({itemResolver:l,consume:e,hasComplexNotResolvers:n,hasComplexResolvers:t,resolverObjects:s,feedback:o,emitEvent:d,getEvent:h,soundActions:f,keyboardControl:u,noEvaluation:p}){const[x]=f,[R,_]=React$2.useState(!1),[S,g]=React$2.useState(!1),[v,b]=React$2.useState(!1),T=N=>h({type:"translate",payload:N}),y=React$2.useCallback(()=>{d({type:"addPoints",complex:!0,finish:R.success,onFinish:()=>{R.success?d({type:"success"}):d({type:"closeScreen"})},payload:R.rewards})},[d,R]),w=React$2.useCallback(()=>{if(s.find(P=>P===l.uid)){let P;t?(P=o.resolvers.rights.find(k=>k.uidObject===l.uid),P||(P=o.resolvers.rights[0])):P=o.resolvers.rights[0],e&&d({type:"consumeItem",payload:{uid:l.uid,targetId:l.uid,name:l.name}}),_({...P,success:!0})}else{let P;n?(P=o.notResolvers.wrongs.find(k=>k.uidObject===l.uid),P||(P=o.notResolvers.wrongs[0])):P=o.notResolvers.wrongs[0],_({...P,success:!1})}},[s,l,t,e,o,d,n]),C=React$2.useCallback(()=>{if(s.find(P=>P===(l==null?void 0:l.uid))){let P;t?P=[...o.resolvers.rights.find(M=>M.uidObject===(l==null?void 0:l.uid)).rewards.filter(M=>M.type==="var")]:P=[...o.resolvers.rights[0].rewards.filter(F=>F.type==="var")],e&&d({type:"consumeItem",payload:{uid:l==null?void 0:l.uid,targetId:l==null?void 0:l.uid,name:l==null?void 0:l.name}}),b({varsPoints:[...P],success:!0})}else{let P;n?P=[...o.notResolvers.wrongs.find(M=>M.uidObject===(l==null?void 0:l.uid)).rewards.filter(M=>M.type==="var")]:P=[...o.notResolvers.wrongs[0].rewards.filter(F=>F.type==="var")],b({varsPoints:[...P],success:!1})}},[e,d,o.notResolvers.wrongs,o.resolvers.rights,n,t,l==null?void 0:l.name,l==null?void 0:l.uid,s]),D=React$2.useCallback(()=>{d({type:"addPoints",complex:!0,finish:v==null?void 0:v.success,onFinish:()=>{v!=null&&v.success?d({type:"success"}):d({type:"closeScreen"})},payload:v!=null&&v.varsPoints?v==null?void 0:v.varsPoints:[]}),g(!1)},[d,v==null?void 0:v.success,v==null?void 0:v.varsPoints]);return React$2.useEffect(()=>{l?p?C():w():d({type:"closeScreen"})},[w,C,d,l,p]),React$2.useEffect(()=>{v&&(v!=null&&v.success?g(!0):d({type:"closeScreen"}))},[d,v]),S?jsxRuntimeExports.jsx(PseudoNoEvaluationEvent,{onPass:D}):R?jsxRuntimeExports.jsx(FeedbackComponent$1,{text:R.desc,success:R.success,playSound:x,hasTimeout:!R.desc,delay:2e3,translate:T,keyboardControl:u,functionOnClose:y}):null}function MatchItem({item:l,viewMode:e}){var n,t;return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[e==="text"&&jsxRuntimeExports.jsx("div",{className:"match-item-text",children:HTMLReactParser$1(l==null?void 0:l.content)}),e==="card"&&jsxRuntimeExports.jsx("div",{className:"match-item-image",children:jsxRuntimeExports.jsxs("figure",{children:[((n=l==null?void 0:l.img)==null?void 0:n.url)&&jsxRuntimeExports.jsx("img",{src:(t=l==null?void 0:l.img)==null?void 0:t.url,alt:l==null?void 0:l.imgName}),(l==null?void 0:l.content)&&jsxRuntimeExports.jsx("figcaption",{children:HTMLReactParser$1(l==null?void 0:l.content)})]})})]})}function CountDownDialog({translate:l,onClose:e,buttonLabel:n}){return jsxRuntimeExports.jsx("div",{className:"timer-dialog",children:jsxRuntimeExports.jsxs("div",{className:"timer-dialog__container",children:[jsxRuntimeExports.jsx("div",{className:"timer-dialog__title",children:l("storylines.misc.ready")}),jsxRuntimeExports.jsx("button",{type:"button",className:"gat--btn gat--btn__primary",onClick:e,children:jsxRuntimeExports.jsx("span",{children:l(`${n}`)})})]})})}function CountdownTimer({initialSeconds:l=10,isPaused:e,shouldStart:n,shouldReset:t,onTimeOver:s}){const[o,d]=React$2.useState(l),[h,f]=React$2.useState(!1),u=React$2.useRef();React$2.useEffect(()=>{t&&(d(l),f(!1))},[t,l]),React$2.useEffect(()=>{e&&f(!1)},[e]),React$2.useEffect(()=>{n&&f(!0)},[n]),React$2.useEffect(()=>(h&&o>0?u.current=setInterval(()=>{d(x=>x-1),o===1&&s()},1e3):o===0&&(clearInterval(u.current),f(!1)),()=>clearInterval(u.current)),[h,s,o]);const p=x=>{const R=Math.floor(x/60),_=x%60,S=String(R).padStart(2,"0"),g=String(_).padStart(2,"0");return`${S}:${g}`};return jsxRuntimeExports.jsx("div",{className:`count-down ${o<10&&"count-down--finalseconds"}`,children:jsxRuntimeExports.jsx("div",{children:p(o)})})}function MatchPuzzleComponent({emitEvent:l,soundActions:e=[()=>{},()=>{}],getEvent:n,info:t,specificFeedbacks:s,setResolveAction:o,nodeId:d,viewMode:h,title:f,sources:u,destinations:p,correctPairings:x,timer:R=0,keyboardControl:_,backgroundImage:S}){const g=ke=>n({type:"translate",payload:ke}),v=`match-puzzle_${d}`,[b,T]=React$2.useState([]),[y,w]=React$2.useState(null),[C,D]=React$2.useState(!1),[N,P]=React$2.useState(!1),[k,F]=React$2.useState(""),[M,j]=React$2.useState(!1),[U,B]=React$2.useState([]),[X]=e;useEkho({soundActions:e});const re=ke=>{X("click-ui");const Qe=ft=>ft==null?void 0:ft.startsWith("source-item"),bt=ft=>ft==null?void 0:ft.startsWith("destination-item");if(ke.id===y){w(null);return}const qe=Qe(ke.id),ct=Qe(y),Be=bt(ke.id),ot=bt(y);if(qe&&ot||Be&&ct){K(ke);return}w(ke.id)},se=ke=>{let Qe;return ke.startsWith("destination-item")?Qe={[y]:ke}:Qe={[ke]:y},x.some(bt=>{const qe=JSON.stringify(bt),ct=JSON.stringify(Qe);return qe===ct})},Z=(ke,Qe)=>{const bt=new Map(ke.map(qe=>[qe.id,{...qe}]));return Qe.forEach(qe=>{bt.has(qe.id)?bt.get(qe.id).points+=qe.points:bt.set(qe.id,{...qe})}),Array.from(bt.values())},K=ke=>{var Qe,bt;if(X("click-ui"),se(ke.id)){const qe=ke.id.startsWith("source-item")?ke.id:y,ct=ke.id.startsWith("destination-item")?ke.id:y,Be=[...b,{[qe]:ct}];if(T(Be),s.specificCorrectFeedbacks){const ot=s==null?void 0:s.correctFeedbacks.find(Ne=>Ne.id===`${qe}-${ct}`),ft=Z(U,ot.rewards);B([...ft]),te(Be)&&(et(),j(!0)),ot.desc&&(F(ot==null?void 0:ot.desc),P(!0),D(!0),et());const Ge=te(Be);!ot.desc&&Ge&&ue(ft)}else if(te(Be)&&(et(),j(!0)),te(Be)){P(!0),t.solution.right.desc&&(et(),F(t.solution.right.desc)),D(!0),j(!0);const ft=Z(U,t.solution.right.rewards);B([...ft]),t.solution.right.desc===""&&setTimeout(()=>{ue(ft)},3e3)}w(null)}else if(document.querySelector(`#${ke.id}`).classList.add("match-button--error"),document.querySelector(`#${y}`).classList.add("match-button--error"),setTimeout(()=>{document.querySelector(`#${ke.id}`).classList.remove("match-button--error"),document.querySelector(`#${y}`).classList.remove("match-button--error"),w(null)},1e3),s.specificWrongFeedbacks){const qe=ke.id.startsWith("destination-item")?ke.id:y,ct=s==null?void 0:s.wrongFeedbacks.find(ot=>ot.id===qe),Be=Z(U,ct.rewards);B([...Be]),ct!=null&&ct.desc&&(F(ct.desc),P(!1),D(!0),et())}else{const qe=Z(U,t.solution.wrong.rewards);B([...qe]),(bt=(Qe=t.solution)==null?void 0:Qe.wrong)!=null&&bt.desc&&(F(t.solution.wrong.desc),D(!0),et())}},te=ke=>{if(x.length!==ke.length)return!1;const Qe=new Set(x.map(qe=>JSON.stringify(qe))),bt=new Set(ke.map(qe=>JSON.stringify(qe)));for(const qe of bt)if(!Qe.has(qe))return!1;return!0},ue=ke=>{X("score");const Qe=ke?[...ke]:[...U];l({type:"addPoints",complex:!0,finish:!0,payload:Qe}),l({type:"passPuzzle"})},me=()=>{D(!1),P(!1),F(""),le&&(Ve(),z(!0)),!le&&!M&&xt(),M&&ue()},J=React$2.useMemo(()=>Object.assign({},...b),[b]),H=(ke,Qe)=>J[ke]===Qe;React$2.useEffect(()=>{o(()=>{X("score"),et(),P(!0),F(t.solution.right.desc);const ke=[...U,...t.resolve.rewards],Qe=[...x];T(Qe),setTimeout(()=>{P(!1),D(!1),l({type:"hidePuzzleButtons",payload:!1}),l({type:"puzzleAction",action:"resolve",payload:{element:v,rewards:ke,finish:!0}})},5e3)})},[U,x,l,t.resolve.rewards,t.solution.right.desc,X,v,o]);const W=(ke,Qe)=>b.findIndex(bt=>{const qe=Object.keys(bt)[0],ct=Object.values(bt)[0];return qe===ke&&ct===Qe}),[V,z]=React$2.useState(!0),[Y,ie]=React$2.useState("storylines.misc.start"),[le,fe]=React$2.useState(!1),ce=()=>{ie("storylines.misc.retry"),z(!1),fe(!1),xt()},[ge,Se]=React$2.useState(!1),[Ae,Fe]=React$2.useState(!1),[De,Je]=React$2.useState(!1),ut=()=>{let ke=Z(U,t.timerFeedback.rewards);if(s.specificCorrectFeedbacks){const Qe=new Map(ke.map(bt=>[bt.id,{...bt}]));b.forEach(bt=>{const qe=Object.keys(bt)[0],ct=bt[qe],Be=s.correctFeedbacks.find(ot=>ot.id===`${qe}-${ct}`);Be!=null&&Be.rewards&&Be.rewards.forEach(ot=>{if(Qe.has(ot.id)){const ft=Qe.get(ot.id);ft.points-=ot.points,Qe.set(ot.id,ft)}})}),ke=Array.from(Qe.values())}B(ke),T([]),fe(!0),F(t.timerFeedback.desc),D(!0)},et=()=>{Se(!0),Fe(!1),Je(!1)},xt=()=>{Se(!1),Fe(!0),Je(!1)},Ve=()=>{Se(!1),Fe(!1),Je(!0)},Me=React$2.useCallback(()=>{const ke=document.querySelector('button[id^="source-item"]'),Qe=document.querySelector('button[id^="destination-item"]'),bt=ke.getBoundingClientRect().right,ct=Qe.getBoundingClientRect().left+6-bt;u.items.forEach((Be,ot)=>{if(Be.matchDestinationId!==void 0&&Be.matchDestinationId!==null){const ft=document.querySelector(`#${Be.id}`),Ge=document.querySelector(`#${Be.matchDestinationId}`),Ne=ft.getBoundingClientRect().top,Re=Ge.getBoundingClientRect().top,_e=Re>Ne,Oe=Math.abs(Re-Ne),Ke=Math.sqrt(ct*ct+Oe*Oe),Ft=ft.querySelector(".match-line__hipotenuse");Ft.style.setProperty("width",`${Ke}px`);const Nt=Math.atan(Oe/ct),je=_e?Nt*(180/Math.PI):-Nt*(180/Math.PI);Ft.style.setProperty("transform",`rotate(${je}deg)`)}})},[u.items]);React$2.useEffect(()=>(Me(),window.addEventListener("resize",Me),()=>{window.removeEventListener("resize",Me)}),[Me]);const Le=React$2.useMemo(()=>{let ke="";return ke="match ",S!=null&&S.url&&(ke+="match--with-custom-bg"),ke},[S==null?void 0:S.url]),Ye={backgroundImage:S!=null&&S.url?`url('${S.url}')`:""};return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment,{children:[jsxRuntimeExports.jsxs("div",{className:Le,style:Ye,children:[(f||R>0)&&jsxRuntimeExports.jsxs("header",{className:"match__header",children:[jsxRuntimeExports.jsx("div",{}),f&&jsxRuntimeExports.jsx("div",{className:"match__title","data-testid":"match__title",children:HTMLReactParser$1(f)}),R>0&&jsxRuntimeExports.jsx(CountdownTimer,{initialSeconds:R,isPaused:ge,shouldStart:Ae,shouldReset:De,onTimeOver:ut})]}),jsxRuntimeExports.jsx("div",{className:"match__columns",children:jsxRuntimeExports.jsxs("div",{className:"match__columns-scroll",children:[jsxRuntimeExports.jsxs("div",{className:"match__column-wrap",children:[u.title&&jsxRuntimeExports.jsx("div",{className:"match__subtitle",children:HTMLReactParser$1(u.title)}),jsxRuntimeExports.jsx("div",{className:"match__column",children:u.items.map(ke=>jsxRuntimeExports.jsxs("button",{id:ke.id,"data-testid":ke.id,className:["unset-button match-button",y===ke.id&&"match-button--marked",H(ke.id,ke.matchDestinationId)&&"match-button--success",W(ke.id,ke.matchDestinationId)+1&&"match-button--matched"].filter(Boolean).join(" "),style:{"--matched-color":`var(--matched-color-${W(ke.id,ke.matchDestinationId)+1})`},disabled:H(ke.id,ke.matchDestinationId),type:"button",onClick:()=>re(ke),children:[jsxRuntimeExports.jsx(MatchItem,{item:ke,viewMode:h}),jsxRuntimeExports.jsx("div",{className:"icon-check-circle-black color--success"}),jsxRuntimeExports.jsx("div",{className:"icon-error-circle-black color--error"}),jsxRuntimeExports.jsx("div",{className:"match-line__hipotenuse"})]},ke.id))})]}),jsxRuntimeExports.jsxs("div",{className:"match__column-wrap",children:[p.title&&jsxRuntimeExports.jsx("div",{className:"match__subtitle",children:HTMLReactParser$1(p.title)}),jsxRuntimeExports.jsx("div",{className:"match__column",children:p.items.map(ke=>jsxRuntimeExports.jsxs("button",{id:ke.id,"data-testid":ke.id,className:["unset-button match-button",y===ke.id&&"match-button--marked",H(ke.matchSourceId,ke.id)&&"match-button--success",W(ke.matchSourceId,ke.id)+1&&"match-button--matched"].filter(Boolean).join(" "),style:{"--matched-color":`var(--matched-color-${W(ke.matchSourceId,ke.id)+1})`},disabled:H(ke.matchSourceId,ke.id),type:"button",onClick:()=>re(ke),children:[jsxRuntimeExports.jsx(MatchItem,{item:ke,viewMode:h}),jsxRuntimeExports.jsx("div",{className:"icon-check-circle-black color--success"}),jsxRuntimeExports.jsx("div",{className:"icon-error-circle-black color--error"})]},ke.id))})]})]})})]}),R>0&&V&&jsxRuntimeExports.jsx(CountDownDialog,{buttonLabel:Y,translate:g,onClose:ce}),C&&jsxRuntimeExports.jsx(FeedbackComponent$1,{success:N,text:k,hasTimeout:!k,translate:g,timeExpired:le,functionOnClose:me,keyboardControl:_})]})}function SortPuzzleComponent({emitEvent:l,soundActions:e=[()=>{},()=>{}],getEvent:n,info:t,specificFeedbacks:s,setResolveAction:o,nodeId:d,destinationAreas:h,draggableItems:f,noDraggableItems:u,background:p,showDestinationAreas:x,timer:R,viewMode:_,keyboardControl:S}){var Pt,lt;const g=ze=>n({type:"translate",payload:ze}),v=`sort-puzzle_${d}`,[b,T]=React$2.useState(!1),[y,w]=React$2.useState(!1),[C,D]=React$2.useState(""),[N,P]=React$2.useState(!1),[k,F]=React$2.useState([]),[M]=e;useEkho({soundActions:e});const j=(ze,Ze)=>{const Et=rt=>rt.current.flatMap(ee=>{const pe=ee.acceptedItems;return pe||[]}).sort(),Te=Et(ze),at=Et(Ze);return Te.length!==at.length?!1:Te.join(",")===at.join(",")},U=React$2.useRef(0),B=React$2.useRef([]),X=React$2.useRef([]);React$2.useEffect(()=>{_==="matchMode"&&!U.current&&h.forEach(ze=>{U.current+=1,B.current.push({id:ze.id,acceptedItems:ze.acceptedItems}),X.current.push({id:ze.id,acceptedItems:[]})})},[h,_]);const re=React$2.useRef(null),se=React$2.useRef(null),[Z,K]=React$2.useState(),te=React$2.useCallback(()=>{const ze=re.current.clientHeight,Ze=se.current.clientHeight;K(ze/Ze),se.current.style.transform=`scale(${ze/Ze})`},[]);React$2.useEffect(()=>(te(),window.addEventListener("resize",te),()=>{window.removeEventListener("resize",te)}),[te]);const ue=React$2.useRef([]),me=React$2.useCallback(()=>{const ze=document.querySelectorAll(".sort-destination-area");ue.current=[],ze&&ze.forEach(Ze=>{ue.current.push({id:Ze.id,top:Ze.getBoundingClientRect().top,left:Ze.getBoundingClientRect().left,right:Ze.getBoundingClientRect().right,bottom:Ze.getBoundingClientRect().bottom})})},[]);React$2.useEffect(()=>(me(),window.addEventListener("resize",me),()=>{window.removeEventListener("resize",me)}),[me]);const J=(ze,Ze)=>{const Et=new Map(ze.map(Te=>[Te.id,{...Te}]));return Ze.forEach(Te=>{Et.has(Te.id)?Et.get(Te.id).points+=Te.points:Et.set(Te.id,{...Te})}),Array.from(Et.values())},H=ze=>{M("score");const Ze=ze?[...ze]:[...k];l({type:"addPoints",complex:!0,finish:!0,payload:Ze}),l({type:"passPuzzle"})},W=()=>{t.solution.right.desc&&(Ke(),D(t.solution.right.desc));const ze=J(k,t.solution.right.rewards);F([...ze]),ie(null,!0),t.solution.right.desc===""&&setTimeout(()=>{Y(),H(ze)},3e3)},V=(ze,Ze)=>{const Et=s==null?void 0:s.correctFeedbacks.find(at=>at.id===ze.id),Te=J(k,Et.rewards);F([...Te]),Et.desc&&ie(Et.desc,!0),!Et.desc&&Ze&&(ie(null,!0),setTimeout(()=>{Y(),H(Te)},3e3))},z=()=>{var Ze;const ze=J(k,t.solution.wrong.rewards);F([...ze]),t.solution.wrong.desc&&ie((Ze=t.solution.wrong)==null?void 0:Ze.desc,!1)},Y=React$2.useCallback(()=>{D(""),w(!1),T(!1),l({type:"hidePuzzleButtons",payload:!1})},[l]),ie=(ze,Ze=!1)=>{ze&&D(ze),Ze&&w(!0),T(!0),l({type:"hidePuzzleButtons",payload:!0}),Ke()},le=(ze,Ze)=>{setTimeout(()=>{Ze.classList.remove("sort-draggable-item--error"),Ze.classList.add("sort-draggable-item--resetting"),Ze.style.setProperty("transform",ze.transform),setTimeout(()=>Ze.classList.remove("sort-draggable-item--resetting"),1e3)},1e3)},fe=ze=>{if(ze==="none")return{x:0,y:0};const Et=ze.replace("matrix(","").replace("matrix3d(","").replace(")","").split(", ");return Et.length===6?{x:parseFloat(Et[4]),y:parseFloat(Et[5])}:Et.length===16?{x:parseFloat(Et[12]),y:parseFloat(Et[13])}:{x:0,y:0}},ce=React$2.useRef(!1),[ge,Se]=React$2.useState(),[Ae,Fe]=React$2.useState(),[De,Je]=React$2.useState(),ut=(ze,Ze)=>{ce.current=Ze,Se(ze.nativeEvent.x||ze.touches[0].pageX),Fe(ze.nativeEvent.y||ze.touches[0].pageY);const Et=document.querySelector(`#${Ze}`),at=window.getComputedStyle(Et).getPropertyValue("transform");Et.classList.add("sort-draggable-item--dragging"),Je(fe(at))},et=(ze,Ze)=>{const Et=document.querySelector(`#${Ze}`),Te=Et.getBoundingClientRect().width,at=Et.getBoundingClientRect().height,rt=Et.offsetLeft,ve=Et.offsetTop,ee=Et.parentElement.getBoundingClientRect().width,pe=Et.parentElement.getBoundingClientRect().height,Ee=Et.parentElement.getBoundingClientRect().left,we=Et.parentElement.getBoundingClientRect().right,de=Et.parentElement.getBoundingClientRect().top,be=Et.parentElement.getBoundingClientRect().bottom;if(ce&&ge&&Ae&&(ze.nativeEvent.x||ze.touches[0].pageX)>Ee&&(ze.nativeEvent.x||ze.touches[0].pageX)<we){const Ue=(ze.nativeEvent.x||ze.touches[0].pageX)-ge,tt=(ze.nativeEvent.y||ze.touches[0].pageY)-Ae;Et.style.transform=`translate(${De.x+Ue/Z}px, ${De.y+tt/Z}px)`,Et.getBoundingClientRect().left>=Ee&&Et.getBoundingClientRect().right<=we&&Et.getBoundingClientRect().top>=de&&Et.getBoundingClientRect().bottom<=be&&(Et.style.transform=`translate(${De.x+Ue/Z}px, ${De.y+tt/Z}px)`),Et.getBoundingClientRect().left<=Ee&&(Et.style.transform=`translate(${-rt}px, ${De.y+tt/Z}px)`),Et.getBoundingClientRect().right>=we&&(Et.style.transform=`translate(${(ee-Te)/Z-rt}px, ${De.y+tt/Z}px)`),Et.getBoundingClientRect().top<=de&&(Et.style.transform=`translate(${De.x+Ue/Z}px, ${-ve}px)`),Et.getBoundingClientRect().bottom>=be&&(Et.style.transform=`translate(${De.x+Ue/Z}px, ${(pe-at)/Z-ve}px)`)}},xt=(ze,Ze)=>{const Te=document.querySelector(`#${ze}`).getBoundingClientRect(),at=ue.current.find(ve=>ve.id===Ze&&!(Te.left>=ve.right||Te.right<=ve.left||Te.top>=ve.bottom||Te.bottom<=ve.top)),rt=ue.current.find(ve=>ve.id!==Ze&&!(Te.left>=ve.right||Te.right<=ve.left||Te.top>=ve.bottom||Te.bottom<=ve.top));return at?"correctArea":rt?"incorrectArea":"neutral"},Ve=(ze,Ze)=>{if(ce.current===Ze){M("click-ui");const Et=document.querySelector(`#${Ze}`),Te=f.find(at=>Ze===at.id);if(Et.classList.remove("sort-draggable-item--dragging"),ce.current=null,Se(null),Fe(null),Je(null),_!=="resolveMode"){const at=xt(Ze,Te.destination.id);if(at==="correctArea"){if(_==="anyItemResolver"&&(M("score"),Ke(),Et.classList.add("sort-draggable-item--success"),s.specificCorrectFeedbacks?(P(!0),V(Te,!0)):W()),_==="matchMode")if(M("score"),Et.classList.add("sort-draggable-item--success"),X.current.find(ve=>ve.id===Te.destination.id).acceptedItems.push(Te.id),s.specificCorrectFeedbacks){const ve=j(X,B);ve&&P(!0),V(Te,ve)}else j(X,B)&&W();return}else if(at==="incorrectArea"){if(_==="anyItemResolver"||_==="matchMode"){if(M("fail"),Et.classList.add("sort-draggable-item--error"),s.specificWrongFeedbacks){const rt=s==null?void 0:s.wrongFeedbacks.find(ee=>ee.id===Te.id),ve=J(k,rt.rewards);F([...ve]),rt.desc&&ie(rt.desc,!1)}else z();le(Te,Et)}return}}}},Me=()=>{let ze=!1;Ke(),f.forEach(Ze=>{const Et=document.querySelector(`#${Ze.id}`);if(Ze.destination.id)xt(Ze.id,Ze.destination.id)!=="correctArea"?(ze=!0,Et.classList.add("sort-draggable-item--error"),le(Ze,Et)):Et.classList.add("sort-draggable-item--success");else if(!Ze.destination.id){const Te=document.querySelector(`#${Ze.id}`),at=Te.getBoundingClientRect();ue.current.find(ve=>!(at.left>=ve.right||at.right<=ve.left||at.top>=ve.bottom||at.bottom<=ve.top))&&(ze=!0,Te.classList.add("sort-draggable-item--error"),le(Ze,Te))}}),ze?(M("fail"),z()):(M("score"),P(!0),W())},Le=()=>{f.forEach(ze=>{const Ze=document.querySelector(`#${ze.id}`);Ze.classList.remove("sort-draggable-item--error"),Ze.classList.remove("sort-draggable-item--success"),Ze.classList.add("sort-draggable-item--resetting"),Ze.style.setProperty("transform",ze.transform),setTimeout(()=>Ze.classList.remove("sort-draggable-item--resetting"),1e3)})},Ye=()=>{Y(),ct&&(Nt(),Le(),Qe(!0)),!ct&&!N&&Ft(),N&&H()},[ke,Qe]=React$2.useState(!0),[bt,qe]=React$2.useState("storylines.misc.start"),[ct,Be]=React$2.useState(!1),[ot,ft]=React$2.useState(!1),[Ge,Ne]=React$2.useState(!1),[Re,_e]=React$2.useState(!1),Oe=()=>{let ze=J(k,t.timerFeedback.rewards);if(s.specificCorrectFeedbacks){const Ze=new Map(ze.map(Et=>[Et.id,{...Et}]));ze=Array.from(Ze.values())}_==="matchMode"&&X.current.forEach(Ze=>{Ze.acceptedItems=[]}),F(ze),Be(!0),ie(t.timerFeedback.desc,!1)},Ke=()=>{ft(!0),Ne(!1),_e(!1)},Ft=()=>{ft(!1),Ne(!0),_e(!1)},Nt=()=>{ft(!1),Ne(!1),_e(!0)},je=()=>{qe("storylines.misc.retry"),Qe(!1),Be(!1),Ft()};React$2.useEffect(()=>{o(()=>{M("score"),Ke(),w(!0),D(t.solution.right.desc);const ze=[...k,...t.resolve.rewards];Y(),l({type:"puzzleAction",action:"resolve",payload:{element:v,rewards:ze,finish:!0}})})},[k,l,t.resolve.rewards,t.solution.right.desc,M,v,Y,o]);const vt={backgroundImage:(Pt=p==null?void 0:p.img)!=null&&Pt.url?`url('${(lt=p==null?void 0:p.img)==null?void 0:lt.url}')`:""};return jsxRuntimeExports.jsxs("div",{ref:re,className:"sort-wrapper",children:[jsxRuntimeExports.jsxs("div",{ref:se,className:"sort-puzzle",style:vt,children:[u.map(ze=>jsxRuntimeExports.jsxs("div",{id:`${ze.id}`,className:"sort-no-draggable-item",style:{"--height":`${ze.heightInPercentage}%`,"--width":`${ze.widthInPercentage}%`,"--transform":`${ze.transform}`,"--backgroundColor":`${ze.backgroundColor}`},children:[ze.imgId&&jsxRuntimeExports.jsx("img",{src:ze.img.url,alt:ze.img.name}),ze.text&&HTMLReactParser$1(ze.text)]},ze.id)),h.map(ze=>jsxRuntimeExports.jsx("div",{id:ze.id,className:`sort-destination-area ${x?"sort-destination-area--revelable":""}`,style:{"--height":`${ze.heightInPercentage}%`,"--width":`${ze.widthInPercentage}%`,"--transform":`${ze.transform}`}},ze.id)),f.map(ze=>jsxRuntimeExports.jsxs("div",{id:`${ze.id}`,className:"sort-draggable-item",onMouseDown:Ze=>ut(Ze,ze.id),onTouchStart:Ze=>ut(Ze,ze.id),onMouseMove:Ze=>et(Ze,ze.id),onTouchMove:Ze=>et(Ze,ze.id),onMouseUp:Ze=>Ve(Ze,ze.id),onMouseLeave:Ze=>Ve(Ze,ze.id),onTouchEnd:Ze=>Ve(Ze,ze.id),style:{"--height":`${ze.heightInPercentage}%`,"--width":`${ze.widthInPercentage}%`,"--transform":`${ze.transform}`,"--backgroundColor":`${ze.backgroundColor}`},children:[ze.imgId&&jsxRuntimeExports.jsx("img",{src:ze.img.url,alt:ze.img.name}),ze.text&&HTMLReactParser$1(ze.text)]},ze.id))]}),_==="resolveMode"&&jsxRuntimeExports.jsx("button",{type:"button",onClick:()=>{Me()},className:"gat--btn gat--btn__primary sort-resolve-button",children:jsxRuntimeExports.jsx("span",{children:g("storylines.misc.check")})}),R>0&&ke&&jsxRuntimeExports.jsx(CountDownDialog,{buttonLabel:bt,translate:g,onClose:je}),b&&jsxRuntimeExports.jsx(FeedbackComponent$1,{success:y,text:C,hasTimeout:!C,translate:g,timeExpired:ct,functionOnClose:Ye,keyboardControl:S}),R>0&&jsxRuntimeExports.jsx("div",{className:"sort-timer",children:jsxRuntimeExports.jsx(CountdownTimer,{initialSeconds:R,isPaused:ot,shouldStart:Ge,shouldReset:Re,onTimeOver:Oe})})]})}exports.AnimationComponent=MultipleAnimation;exports.AutoEvaluationComponent=AutoEvaluation;exports.CardsSelectorPuzzleComponent=CardsSelectorPuzzleComponent;exports.CartelComponent=CartelComponent;exports.ChainedImageClickPuzzleComponent=ChainedImageClickPuzzleComponent;exports.ChangeCamera=ChangeCamera;exports.ComicComponent=ComicComponent;exports.ConversationalComponent=ConversationalComponent;exports.ConversationalProComponent=ConversationalProComponent;exports.CrackerPuzzleComponent=CrackerPuzzleComponent;exports.DecisionComponent=DecisionComponent;exports.DialogComponent=DialogComponent;exports.DragItemPuzzleComponent=DragItemPuzzleComponent;exports.DragToSceneComponent=DragToSceneComponent;exports.FrameImageClickComponent=FrameImageClickComponent;exports.HackerPuzzleComponent=HackerPuzzleComponent;exports.HangedPuzzleComponent=HangedPuzzleComponent;exports.ImageClickPuzzleComponent=ImageClickPuzzleComponent;exports.ImageComponent=ImageComponent;exports.InventoryItem=InventoryItem;exports.KeyboardPuzzleComponent=KeyboardPuzzleComponent;exports.LecturesComponent=LecturesComponent;exports.LoginPuzzleComponent=LoginPuzzleComponent;exports.MatchPuzzleComponent=MatchPuzzleComponent;exports.NoticeComponent=NoticeComponent;exports.PatternComponent=PatternComponent;exports.PdfComponent=PdfComponent;exports.PdfVisor=PdfVisor;exports.ReferralComponent=ReferralComponent;exports.SortPuzzleComponent=SortPuzzleComponent;exports.SurveyComponent=SurveyComponent;exports.TerminalPuzzleComponent=TerminalPuzzleComponent;exports.TestComponent=TestComponent;exports.TextClickPuzzleComponent=TextClickPuzzleComponent;exports.UrlComponent=UrlComponent;exports.VideoComponent=VideoComponent;exports.VideoVisor=VideoVisor;exports.WebBuilderPuzzleComponent=WebBuilderPuzzleComponent;exports.WriterPuzzleComponent=WriterPuzzleComponent;
 //# sourceMappingURL=arcade-components.cjs.map