alrdy-animate/dist/chunks/gsap-modal.66d1a48ad92781f996d0.js

A library to handle animations on scroll with GSAP integration.

"use strict";(this.webpackChunkAlrdyAnimate=this.webpackChunkAlrdyAnimate||[]).push([[297],{558(t,e,a){a.r(e),a.d(e,{createModalAnimations:()=>r});var i=a(543);class s{constructor(t,e=1){this.group=t,this.defaultDuration=e,this.backdrop=null,this.modals=[],this.triggers=[],this.modalMap=new Map,this.initializeElements()}initializeElements(){this.backdrop=this.group.querySelector("[aa-modal-backdrop]"),this.modals=Array.from(this.group.querySelectorAll("[aa-modal-name]")),this.triggers=Array.from(document.querySelectorAll("[aa-modal-target]")),this.modals.forEach(t=>{const e=t.getAttribute("aa-modal-name"),a=this.triggers.filter(t=>t.getAttribute("aa-modal-target")===e),i=parseFloat(t.getAttribute("aa-duration"))||this.defaultDuration,s=parseFloat(t.getAttribute("aa-delay"))||0,o=[...t.hasAttribute("aa-animate")?[t]:[],...t.querySelectorAll("[aa-animate]")];o.forEach(t=>{t.setAttribute("aa-event-trigger","")}),this.modalMap.set(e,{modal:t,triggers:a,duration:i,delay:s,animatedElements:o})})}getModalByName(t){return this.modalMap.get(t)}getActiveModal(){return this.group.querySelector('[aa-modal-name][aa-modal-status="active"]')}getAllModals(){return this.modals}getBackdrop(){return this.backdrop}}class o{constructor(t,e,a,i=1){this.group=t,this.state=e,this.lenis=a,this.defaultDuration=i,this.activeModal=null,this.removeTabTrap=null,this.setupEventDelegation()}setupEventDelegation(){this.state.triggers.forEach(t=>{t.addEventListener("click",()=>{const e=t.getAttribute("aa-modal-target"),a=this.state.getModalByName(e);this.activeModal&&this.closeModal(),a&&this.openModal(e)})}),document.querySelectorAll("[aa-modal-close]").forEach(t=>{t.addEventListener("click",()=>{this.activeModal&&this.closeModal()})}),document.addEventListener("keydown",t=>{"Escape"===t.key&&this.activeModal&&this.closeModal()})}lockScroll(){this.lenis?this.lenis.stop():document.body.style.overflow="hidden"}unlockScroll(){this.lenis?this.lenis.start():document.body.style.overflow=""}openModal(t){const e=this.state.getModalByName(t);if(!e)return;const{modal:a}=e;this.group.style.visibility="visible",this.group.setAttribute("aa-modal-group-status","active"),a.style.visibility="visible",a.style.display="flex",a.setAttribute("aa-modal-status","active"),this.lockScroll(),this.activeModal=a;const i=l(a,"play",this.defaultDuration,this.state.getBackdrop());window.gsap.delayedCall(i,()=>{const t=a.querySelector('input, select, textarea, [tabindex]:not([tabindex="-1"])');t&&t.focus()}),this.removeTabTrap=function(t){function e(e){const a=t.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');if(!a.length)return;const i=a[0],s=a[a.length-1];"Tab"===e.key&&(e.shiftKey&&document.activeElement===i?(e.preventDefault(),s.focus()):e.shiftKey||document.activeElement!==s||(e.preventDefault(),i.focus()))}return document.addEventListener("keydown",e),()=>document.removeEventListener("keydown",e)}(a)}closeModal(){if(!this.activeModal)return;const t=this.activeModal,e=t.getAttribute("aa-modal-name");if(!this.state.getModalByName(e))return;const a=l(t,"reverse",this.defaultDuration,this.state.getBackdrop());window.gsap.delayedCall(a,()=>{t.style.visibility="hidden",t.style.display="none",t.setAttribute("aa-modal-status","not-active"),this.group.style.visibility="hidden",this.group.setAttribute("aa-modal-group-status","not-active"),this.unlockScroll(),this.removeTabTrap&&this.removeTabTrap(),this.activeModal=null})}}function l(t,e,a=1,s=null){const o=[...t.hasAttribute("aa-animate")?[t]:[],...t.querySelectorAll("[aa-animate]")];(0,i.I)(o,e);const l=((parseFloat(t.getAttribute("aa-duration"))||a)+(parseFloat(t.getAttribute("aa-delay"))||0))/("reverse"===e?2:1);return s&&window.gsap&&("play"===e?window.gsap.fromTo(s,{autoAlpha:0},{autoAlpha:1,duration:.4,ease:"none"}):window.gsap.to(s,{autoAlpha:0,duration:.4,delay:l-.4,ease:"none"})),l}function r(t,e,a,i,l=1){return{modal:t=>function(t=null,e=null,a=null,i=null,l=1){i.style.display="flex",i.style.visibility="hidden",i.setAttribute("aa-modal-group-status","not-active");const r=new s(i,l),n=new o(i,r,t,l);return r.getAllModals().forEach(t=>{t.style.visibility="hidden",t.style.display="none",t.setAttribute("aa-modal-status","not-active")}),{open:t=>n.openModal(t),close:()=>n.closeModal()}}(e,a,i,t,l)}}}}]);