(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[7724],{67724:function(e,t,i){"use strict";i.r(t),i.d(t,{default:function(){return f}});var n=i(22678),a=i(48564),o=i(2267),r=i(18007),s=i(53304),l=i(85893),c=i(93967),h=i.n(c),u=i(67294),d=i(70131),p=i(3998),m=i.n(p),f=function(e){(0,r._)(i,e);var t=(0,s._)(i);function i(e){var o;return(0,a._)(this,i),(o=t.call(this,e)).handleClick=function(e){o.emoji=e.target.innerText;for(var t=o.amount[Math.floor(Math.random()*o.amount.length)],i=0;i<t;i++)o.createParticle(e);requestAnimationFrame(o.loop.bind((0,n._)(o)))},o.ftux=function(){var e;if(null===(e=window)||void 0===e?void 0:e.matchMedia("(prefers-reduced-motion: no-preference)").matches){o.emoji="\uD83D\uDE0D";for(var t=0;t<5;t++)o.createParticle(event)}requestAnimationFrame(o.loop.bind((0,n._)(o)))},o.particlesRef=u.createRef(),o.heartEmojiRef=u.createRef(),o.particles=[],o.height=document.documentElement.clientHeight,o.sizes=[35,45,55],o.amount=[3,4,5],o.emoji="",o.handleClick=o.handleClick.bind((0,n._)(o)),o.ftux=o.ftux.bind((0,n._)(o)),o.loop(),o}return(0,o._)(i,[{key:"loop",value:function(){this.updateParticles(),this.particles.length?requestAnimationFrame(this.loop.bind(this)):cancelAnimationFrame(this.loop.bind(this))}},{key:"createParticle",value:function(e){var t=this.sizes[Math.floor(Math.random()*this.sizes.length)],i=360*Math.random(),n=-t/2+200,a=e?e.target.getBoundingClientRect().x-this.particlesRef.current.getBoundingClientRect().x+16-t/2:this.heartEmojiRef.current.getBoundingClientRect().x-this.particlesRef.current.getBoundingClientRect().x+16-t/2,o=document.createElement("span");o.innerHTML=this.emoji,o.classList.add("absolute","leading-none"),o.setAttribute("style","\n        font-size: ".concat(t,"px;\n        top: ").concat(n,"px;\n        left: ").concat(a,"px;\n        transform: rotate(").concat(i,"deg);\n      ")),this.particlesRef.current.appendChild(o),this.particles.push({element:o,size:t,speedHorz:5*Math.random(),speedUp:30*Math.random(),spinVal:i,spinSpeed:10*Math.random()*(.5>=Math.random()?-1:1),top:n,left:a,direction:.5>=Math.random()?-1:1})}},{key:"updateParticles",value:function(){var e=this;this.particles.forEach(function(t){t.left=t.left-t.speedHorz*t.direction,t.top=t.top-t.speedUp/2.5,t.speedUp=Math.min(t.size,t.speedUp-1),t.spinVal=t.spinVal+t.spinSpeed,t.top>=e.height+t.size&&(e.particles=e.particles.filter(function(e){return e!==t}),t.element.remove()),t.element.setAttribute("style","\n          top: ".concat(t.top,"px;\n          left: ").concat(t.left,"px;\n          font-size: ").concat(t.size,"px;\n          transform:rotate(").concat(t.spinVal,"deg);\n        "))})}},{key:"render",value:function(){return(0,l.jsxs)(d.df,{as:"div",onChange:this.ftux,threshold:1,triggerOnce:!0,children:[(0,l.jsxs)("div",{className:"flex gap-[.5em]",children:[(0,l.jsx)("button",{className:h()(m().emojiButton,"thd-focus-thick"),onClick:this.handleClick,type:"button",children:(0,l.jsx)("span",{"aria-label":"Face with tears of joy emoji",role:"img",children:"\uD83D\uDE02"})}),(0,l.jsx)("button",{className:h()(m().emojiButton,"thd-focus-thick"),onClick:this.handleClick,type:"button",children:(0,l.jsx)("span",{"aria-label":"Smiling Face With Heart-Shaped Eyes emoji",ref:this.heartEmojiRef,role:"img",children:"\uD83D\uDE0D"})}),(0,l.jsx)("button",{className:h()(m().emojiButton,"thd-focus-thick"),onClick:this.handleClick,type:"button",children:(0,l.jsx)("span",{"aria-label":"Face with open mouth emoji",role:"img",children:"\uD83D\uDE2E"})}),(0,l.jsx)("button",{className:h()(m().emojiButton,"thd-focus-thick"),onClick:this.handleClick,type:"button",children:(0,l.jsx)("span",{"aria-label":"Raising hands emoji",role:"img",children:"\uD83D\uDE4C"})}),(0,l.jsx)("button",{className:h()(m().emojiButton,"thd-focus-thick"),onClick:this.handleClick,type:"button",children:(0,l.jsx)("span",{"aria-label":"Thumbs up emoji",role:"img",children:"\uD83D\uDC4D"})}),(0,l.jsx)("button",{className:h()(m().emojiButton,"thd-focus-thick"),onClick:this.handleClick,type:"button",children:(0,l.jsx)("span",{"aria-label":"Thumbs down emoji",role:"img",children:"\uD83D\uDC4E"})})]}),(0,l.jsx)("div",{className:m().particlesWrapper,id:"particles",ref:this.particlesRef})]})}}]),i}(u.Component)},3998:function(e){e.exports={emojiButton:"InteractiveEmojiBelt_emojiButton__LtB__",particlesWrapper:"InteractiveEmojiBelt_particlesWrapper__wHRvQ"}}}]);