taggedjs-animate-css
Version:
HTML and CSS animations for TaggedJs brought to us by animate-css
6 lines • 3.68 kB
JavaScript
var t={d:(e,n)=>{for(var o in n)t.o(n,o)&&!t.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:n[o]})},o:(t,e)=>Object.prototype.hasOwnProperty.call(t,e),r:t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})}},e={};t.d(e,{_z:()=>O,mi:()=>I,qG:()=>c,Ce:()=>d,tE:()=>f,Xn:()=>x,rf:()=>r,MV:()=>l,fx:()=>p,WT:()=>m});var n={};function o({fxIn:t,fxOut:e,outPositionAbsolute:n=!0}){return{in:(e,n)=>i({fxName:t,...e},n),out:(t,o)=>a({fxName:e,outPositionAbsolute:n,...t},o)}}t.r(n),t.d(n,{_z:()=>O,mi:()=>I,qG:()=>c,Ce:()=>d,tE:()=>f,Xn:()=>x,rf:()=>r,MV:()=>l,fx:()=>p,WT:()=>m});const i=async({target:t,fxName:e="fadeInUp"},n)=>(t.style.opacity="0",n&&await u(n),t.style.opacity="1",s(e,t)),a=async({target:t,outPositionAbsolute:e=!0,fxName:n="fadeOutUp"},o)=>(e&&function(t){t.style.zIndex=t.style.zIndex||1;const e=t.offsetTop+"px",n=t.offsetLeft+"px",o=t.clientWidth+(t.offsetWidth-t.clientWidth)+1+"px",i=t.clientHeight+(t.offsetHeight-t.clientHeight)+1+"px";setTimeout((()=>{t.style.top=e,t.style.left=n,t.style.width=o,t.style.height=i,t.style.position="absolute"}),0)}(t),o&&await u(o),s(n,t));function s(t,e){let n;const o=new Promise((function(t){n=t}));return e.classList.add("animate__animated","animate__"+t),e.addEventListener("animationend",(function o(i){i.target===e&&(e.classList.remove("animate__animated","animate__"+t),e.removeEventListener("animationend",o),n(void 0))})),o}function u(t){return new Promise((e=>{setTimeout(e,t)}))}const{in:f,out:r}=o({fxIn:"fadeInUp",fxOut:"fadeOutDown"}),{in:d,out:l}=o({fxIn:"fadeInDown",fxOut:"fadeOutUp"}),{in:c,out:x}=o({fxIn:"fadeIn",fxOut:"fadeOut"}),m=({stagger:t=100,fxIn:e,fxOut:o,duration:i="2s",inName:a="fadeInUp",outName:s="fadeOutDown",outPositionAbsolute:u=!1}={})=>{let f=0;const r=y((function(e){e.style.setProperty("--animate-duration",i);const n=t*f++;return r.fxIn({target:e},n).then((()=>{--f}))}),(function(e){e.style.setProperty("--animate-duration",i);const o=t*f++,a=r.fxOut({target:e},o).then((()=>{--f}));return(0,n.addPaintRemoveAwait)(a),a}),e,o,a,s,u);return r.host},p=({fxIn:t,fxOut:e,stagger:o,inName:i="fadeInUp",outName:a="fadeOutDown",duration:s=".2s",outPositionAbsolute:u=!1}={})=>{const f=y((t=>(t.style.setProperty("--animate-duration",s),f.fxIn({target:t},o))),(t=>{t.style.setProperty("--animate-duration",s);const e=f.fxOut({target:t},o);return(0,n.addPaintRemoveAwait)(e),e}),t,e,i,a,u);return f.host};function y(t,e,i,a,s,u,f){if(!i||!a){const t=o({fxIn:s,fxOut:u,outPositionAbsolute:f});i||(i=t.in),a||(a=t.out)}return{fxIn:i,fxOut:a,host:(0,n.host)((()=>{}),{onInit:t,onDestroy:e})}}function I({fxIn:t,fxOut:e,duration:i=".2s",outPositionAbsolute:a=!1}={duration:".2s",outPositionAbsolute:!1}){if(!t||!e){const n=o({fxIn:"fadeInUp",fxOut:"fadeOutDown",outPositionAbsolute:a});t||(t=n.in),e||(e=n.out)}const s=(0,n.getInnerHTML)();return n.html`
<div oninit=${t} ondestroy=${e} style.--animate-duration=${i}>${s}</div>
`.acceptInnerHTML(s)}function O({fxIn:t,fxOut:e,duration:i=".2s",outPositionAbsolute:a=!0}={duration:".2s",outPositionAbsolute:!0}){if(!t||!e){const n=o({fxIn:"fadeInUp",fxOut:"fadeOutDown",outPositionAbsolute:a});t||(t=n.in),e||(e=n.out)}const s=(0,n.getInnerHTML)();return n.html`
<div oninit=${t} ondestroy=${e} style.--animate-duration=${i}>${s}</div>
`.acceptInnerHTML(s)}var P=e._z,g=e.mi,b=e.qG,h=e.Ce,v=e.tE,w=e.Xn,A=e.rf,_=e.MV,T=e.fx,L=e.WT;export{P as animateLoop,g as animateWrap,b as fadeIn,h as fadeInDown,v as fadeInUp,w as fadeOut,A as fadeOutDown,_ as fadeOutUp,T as fx,L as fxGroup};
//# sourceMappingURL=bundle.js.map