react-gsap-animation-library
Version:
A comprehensive React component library that leverages GSAP for animations with official GSAP-React integration
3 lines (2 loc) • 30.9 kB
JavaScript
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("gsap"),n=require("@gsap/react"),r=require("gsap/ScrollTrigger");function o(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=Array(t);n<t;n++)r[n]=e[n];return r}function i(e,t,n){return(t=function(e){var t=function(e,t){if("object"!=typeof e||!e)return e;var n=e[Symbol.toPrimitive];if(void 0!==n){var r=n.call(e,t||"default");if("object"!=typeof r)return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:t+""}(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function a(){return a=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var r in n)({}).hasOwnProperty.call(n,r)&&(e[r]=n[r])}return e},a.apply(null,arguments)}function c(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);t&&(r=r.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,r)}return n}function l(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?c(Object(n),!0).forEach((function(t){i(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):c(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function s(e,t){if(null==e)return{};var n,r,o=function(e,t){if(null==e)return{};var n={};for(var r in e)if({}.hasOwnProperty.call(e,r)){if(-1!==t.indexOf(r))continue;n[r]=e[r]}return n}(e,t);if(Object.getOwnPropertySymbols){var i=Object.getOwnPropertySymbols(e);for(r=0;r<i.length;r++)n=i[r],-1===t.indexOf(n)&&{}.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}function u(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null!=n){var r,o,i,a,c=[],l=!0,s=!1;try{if(i=(n=n.call(e)).next,0===t){if(Object(n)!==n)return;l=!1}else for(;!(l=(r=i.call(n)).done)&&(c.push(r.value),c.length!==t);l=!0);}catch(e){s=!0,o=e}finally{try{if(!l&&null!=n.return&&(a=n.return(),Object(a)!==a))return}finally{if(s)throw o}}return c}}(e,t)||function(e,t){if(e){if("string"==typeof e)return o(e,t);var n={}.toString.call(e).slice(8,-1);return"Object"===n&&e.constructor&&(n=e.constructor.name),"Map"===n||"Set"===n?Array.from(e):"Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)?o(e,t):void 0}}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}if("undefined"!=typeof window)try{t.registerPlugin(n.useGSAP,r)}catch(e){console.warn("GSAP plugin registration failed:",e)}var d="undefined"!=typeof window?e.useLayoutEffect:e.useEffect,f={defaultDuration:.8,defaultEase:"power3.out",defaultDelay:0,defaultStagger:.1,disableAllAnimations:!1,disableScrollAnimations:!1,animationQuality:"high"},p=e.createContext(f),m=function(o){var i=o.children,a=o.settings,c=void 0===a?{}:a,s=u(e.useState(l(l({},f),c)),2),m=s[0],v=s[1],y=function(e){v((function(t){return l(l({},t),e)}))};d((function(){if("undefined"!=typeof window)try{t.registerPlugin(n.useGSAP,r),t.defaults({ease:m.defaultEase,duration:m.defaultDuration,overwrite:"auto"})}catch(e){console.warn("GSAP initialization failed:",e)}}),[m.defaultEase,m.defaultDuration]),e.useEffect((function(){if("undefined"!=typeof window){var e=window.matchMedia("(prefers-reduced-motion: reduce)");e.matches&&y({disableAllAnimations:!0,disableScrollAnimations:!0});var t=function(e){y({disableAllAnimations:e.matches,disableScrollAnimations:e.matches})};try{return e.addEventListener("change",t),function(){return e.removeEventListener("change",t)}}catch(n){try{return e.addListener(t),function(){return e.removeListener(t)}}catch(e){}}}}),[]),e.useEffect((function(){if("undefined"!=typeof navigator&&"getBattery"in navigator)try{navigator.getBattery().then((function(e){e.level<.2&&!e.charging&&y({animationQuality:"low"}),e.addEventListener("levelchange",(function(){e.level<.2&&!e.charging?y({animationQuality:"low"}):(e.level>.5||e.charging)&&y({animationQuality:"high"})}))}))}catch(e){console.warn("Battery status detection failed:",e)}}),[]);var g=l(l({},m),{},{updateSettings:y});return e.createElement(p.Provider,{value:g},i)},v=function(){var t=e.useContext(p);if(void 0===t)throw new Error("useAnimationSettings must be used within an AnimationProvider");return t};if("undefined"!=typeof window)try{t.registerPlugin(n.useGSAP,r)}catch(e){console.warn("GSAP plugin registration failed:",e)}var y=function(){var r=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},o=v().disableAllAnimations,i=r.scope||e.useRef(null),a=n.useGSAP({scope:i}),c=a.contextSafe,l=a.context,s=a.revert,u=a.kill;return{containerRef:i,contextSafe:c,timeline:function(){var e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return o?t.timeline():t.timeline(e,l)},tween:function(e,n){return o?{kill:function(){}}:t.to(e,n,l)},add:function(e,t,n){return o?e:e.add(t,n)},context:l,revert:s,kill:u}},g=function(e){var o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=o.effect,a=void 0===i?"fadeIn":i,c=o.direction,s=void 0===c?"up":c,u=o.distance,d=void 0===u?30:u,f=o.duration,p=void 0===f?.8:f,m=o.delay,y=void 0===m?0:m,g=o.ease,b=void 0===g?"power3.out":g,h=o.trigger,w=void 0===h?"scroll":h,A=o.threshold,x=void 0===A?.2:A,S=o.onComplete,k=v(),C=k.disableAllAnimations,O=k.disableScrollAnimations;return n.useGSAP((function(){if(!(null==e||!e.current||C||"scroll"===w&&O)){var n;switch(a){case"fadeIn":var o={opacity:0};"up"===s?o.y=d:"down"===s?o.y=-d:"left"===s?o.x=d:"right"===s&&(o.x=-d),n=t.from(e.current,l(l({},o),{},{duration:p,delay:y,ease:b,onComplete:S,clearProps:"all"}));break;case"fadeOut":var i={opacity:0};"up"===s?i.y=-d:"down"===s?i.y=d:"left"===s?i.x=-d:"right"===s&&(i.x=d),n=t.to(e.current,l(l({},i),{},{duration:p,delay:y,ease:b,onComplete:S}));break;case"slideIn":var c={};"up"===s?c.y=d:"down"===s?c.y=-d:"left"===s?c.x=-d:"right"===s&&(c.x=d),t.set(e.current,l(l({},c),{},{opacity:0})),n=t.to(e.current,l(l({},{opacity:1}),{},{x:0,y:0,duration:p,delay:y,ease:b,onComplete:S,clearProps:"all"}));break;default:return void console.warn("Unknown animation effect: ".concat(a))}"scroll"!==w||O||(n.pause(),r.create({trigger:e.current,start:"top bottom-=".concat(100*x,"%"),onEnter:function(){return n.play()},once:!0}))}}),{scope:e,dependencies:[a,s,d,p,y,b,w,x,C,O]}),{ref:e}},b=function(e){var o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=o.animation,a=o.initial,c=o.start,l=void 0===c?"top bottom-=10%":c,s=o.end,u=void 0===s?"bottom top+=10%":s,d=o.scrub,f=void 0!==d&&d,p=o.markers,m=void 0!==p&&p,y=o.pin,g=void 0!==y&&y,b=o.toggleActions,h=void 0===b?"play none none reset":b,w=o.onEnter,A=o.onLeave,x=o.onEnterBack,S=o.onLeaveBack,k=v(),C=k.disableAllAnimations,O=k.disableScrollAnimations;return n.useGSAP((function(){var n;null==e||!e.current||C||O||(a&&t.set(e.current,a),n="function"==typeof i?i(e.current):i?t.to(e.current,i):t.to(e.current,{opacity:1,y:0,duration:1}),f||n.pause(),r.create({trigger:e.current,start:l,end:u,markers:m,scrub:f,pin:g,toggleActions:h,onEnter:w||(f?null:function(){return n.play()}),onLeave:A,onEnterBack:x,onLeaveBack:S}))}),{scope:e,dependencies:[JSON.stringify(i),JSON.stringify(a),l,u,f,m,g,h,C,O]}),{ref:e}},h=["children","duration","delay","ease","direction","trigger","threshold","onStart","onComplete","className","style"],w=function(o){var i=o.children,a=o.duration,c=void 0===a?.8:a,u=o.delay,d=void 0===u?0:u,f=o.ease,p=void 0===f?"power3.out":f,m=o.direction,y=void 0===m?"up":m,g=o.trigger,b=void 0===g?"scroll":g,w=o.threshold,A=void 0===w?.2:w,x=o.onStart,S=void 0===x?function(){}:x,k=o.onComplete,C=void 0===k?function(){}:k,O=o.className,E=void 0===O?"":O,P=o.style,z=void 0===P?{}:P,I=s(o,h),j=e.useRef(null),N=v(),T=N.disableAllAnimations,R=N.disableScrollAnimations,G=function(){var e={opacity:0};switch(y){case"up":default:return l(l({},e),{},{y:30});case"down":return l(l({},e),{},{y:-30});case"left":return l(l({},e),{},{x:30});case"right":return l(l({},e),{},{x:-30});case"none":return e}},L=(0,n.useGSAP((function(){if(j.current){if(!(T||"scroll"===b&&R)){if("load"===b||"scroll"===b){var e=G(),n=t.from(j.current,l(l({},e),{},{duration:c,delay:d,ease:p,onStart:S,onComplete:C,paused:"scroll"===b}));"scroll"!==b||R?"load"===b&&n.play():r.create({trigger:j.current,start:"top bottom-=".concat(100*A,"%"),onEnter:function(){return n.play()}})}return function(){"scroll"===b&&r.getAll().filter((function(e){return e.vars.trigger===j.current})).forEach((function(e){return e.kill()}))}}t.set(j.current,{opacity:1,x:0,y:0})}}),{scope:j,dependencies:[y,c,d,p,b,A,T,R]}).contextSafe)((function(){if(!T){var e=G();t.fromTo(j.current,e,{opacity:1,x:0,y:0,duration:c,ease:p,onStart:S,onComplete:C})}})),B=l(l({ref:j,className:"react-gsap-fadein ".concat(E),style:z,"data-animation-direction":y},T?{}:"hover"===b?{onMouseEnter:L}:"click"===b?{onClick:L}:{}),I);return e.createElement("div",B,"function"==typeof i?i({play:L}):i)},A=["children","duration","delay","ease","direction","distance","fade","bounce","trigger","threshold","onStart","onComplete","className","style"],x=function(o){var i=o.children,a=o.duration,c=void 0===a?.8:a,u=o.delay,d=void 0===u?0:u,f=o.ease,p=o.direction,m=void 0===p?"up":p,y=o.distance,g=void 0===y?100:y,b=o.fade,h=void 0===b||b,w=o.bounce,x=void 0!==w&&w,S=o.trigger,k=void 0===S?"scroll":S,C=o.threshold,O=void 0===C?.2:C,E=o.onStart,P=void 0===E?function(){}:E,z=o.onComplete,I=void 0===z?function(){}:z,j=o.className,N=void 0===j?"":j,T=o.style,R=void 0===T?{}:T,G=s(o,A),L=e.useRef(null),B=v(),D=B.disableAllAnimations,M=B.disableScrollAnimations;f||(f=x?"back.out(1.7)":"power3.out");var X=function(){var e=h?{opacity:0}:{};switch(m){case"up":default:return l(l({},e),{},{y:g});case"down":return l(l({},e),{},{y:-g});case"left":return l(l({},e),{},{x:-g});case"right":return l(l({},e),{},{x:g})}},_=(0,n.useGSAP((function(){if(L.current){if(!(D||"scroll"===k&&M)){if("load"===k||"scroll"===k){var e=X(),n=t.from(L.current,l(l({},e),{},{duration:c,delay:d,ease:f,onStart:P,onComplete:I,paused:"scroll"===k}));"scroll"!==k||M?"load"===k&&n.play():r.create({trigger:L.current,start:"top bottom-=".concat(100*O,"%"),onEnter:function(){return n.play()}})}return function(){"scroll"===k&&r.getAll().filter((function(e){return e.vars.trigger===L.current})).forEach((function(e){return e.kill()}))}}t.set(L.current,{opacity:1,x:0,y:0})}}),{scope:L,dependencies:[m,g,c,d,f,k,O,h,x,D,M]}).contextSafe)((function(){if(!D){var e=X();t.fromTo(L.current,e,{opacity:h?1:void 0,x:0,y:0,duration:c,ease:f,onStart:P,onComplete:I})}})),q=l(l({ref:L,className:"react-gsap-slidein ".concat(N),style:R,"data-animation-direction":m,"data-fade":h.toString(),"data-bounce":x.toString()},D?{}:"hover"===k?{onMouseEnter:_}:"click"===k?{onClick:_}:{}),G);return e.createElement("div",q,"function"==typeof i?i({play:_}):i)},S=function(){return{none:"linear","power1.in":"cubic-bezier(0.550, 0.085, 0.680, 0.530)","power1.out":"cubic-bezier(0.250, 0.460, 0.450, 0.940)","power1.inOut":"cubic-bezier(0.455, 0.030, 0.515, 0.955)","power2.in":"cubic-bezier(0.550, 0.055, 0.675, 0.190)","power2.out":"cubic-bezier(0.215, 0.610, 0.355, 1.000)","power2.inOut":"cubic-bezier(0.645, 0.045, 0.355, 1.000)","power3.in":"cubic-bezier(0.895, 0.030, 0.685, 0.220)","power3.out":"cubic-bezier(0.165, 0.840, 0.440, 1.000)","power3.inOut":"cubic-bezier(0.770, 0.000, 0.175, 1.000)","power4.in":"cubic-bezier(0.895, 0.030, 0.685, 0.220)","power4.out":"cubic-bezier(0.165, 0.840, 0.440, 1.000)","power4.inOut":"cubic-bezier(0.770, 0.000, 0.175, 1.000)","back.in":"cubic-bezier(0.600, -0.280, 0.735, 0.045)","back.out":"cubic-bezier(0.175, 0.885, 0.320, 1.275)","back.inOut":"cubic-bezier(0.680, -0.550, 0.265, 1.550)","elastic.in":"cubic-bezier(0.700, 0.000, 0.835, 0.000)","elastic.out":"cubic-bezier(0.165, 0.840, 0.440, 1.000)","elastic.inOut":"cubic-bezier(0.770, 0.000, 0.175, 1.000)","circ.in":"cubic-bezier(0.600, 0.040, 0.980, 0.335)","circ.out":"cubic-bezier(0.075, 0.820, 0.165, 1.000)","circ.inOut":"cubic-bezier(0.785, 0.135, 0.150, 0.860)","expo.in":"cubic-bezier(0.950, 0.050, 0.795, 0.035)","expo.out":"cubic-bezier(0.190, 1.000, 0.220, 1.000)","expo.inOut":"cubic-bezier(1.000, 0.000, 0.000, 1.000)","sine.in":"cubic-bezier(0.470, 0.000, 0.745, 0.715)","sine.out":"cubic-bezier(0.390, 0.575, 0.565, 1.000)","sine.inOut":"cubic-bezier(0.445, 0.050, 0.550, 0.950)"}[arguments.length>0&&void 0!==arguments[0]?arguments[0]:"power2.out"]||"ease-out"},k=["children","animationType","duration","delay","threshold","ease","repeat","yoyo","trigger","onStart","onComplete","className","style"],C=function(t){var n=t.children,r=t.animationType,o=void 0===r?"fadeIn":r,i=t.duration,a=void 0===i?.8:i,c=t.delay,d=void 0===c?0:c,f=t.threshold,p=void 0===f?.2:f,m=t.ease,y=void 0===m?"power3.out":m,g=t.repeat,b=void 0===g?0:g,h=t.yoyo,w=void 0!==h&&h,A=t.trigger,x=void 0===A?"scroll":A,C=t.onStart,O=void 0===C?function(){}:C,E=t.onComplete,P=void 0===E?function(){}:E,z=t.className,I=void 0===z?"":z,j=t.style,N=void 0===j?{}:j,T=s(t,k),R=e.useRef(null),G=u(e.useState({hasAnimated:!1,isAnimating:!1}),2),L=G[0],B=G[1],D=v(),M=D.disableAllAnimations,X=D.disableScrollAnimations;e.useEffect((function(){!function(){if("undefined"!=typeof document&&!document.getElementById("react-gsap-keyframes")){var e=document.createElement("style");e.id="react-gsap-keyframes",e.textContent="\n @keyframes fadeIn {\n from { opacity: 0; }\n to { opacity: 1; }\n }\n \n @keyframes fadeInUp {\n from {\n opacity: 0;\n transform: translate3d(0, 30px, 0);\n }\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes fadeInDown {\n from {\n opacity: 0;\n transform: translate3d(0, -30px, 0);\n }\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes fadeInLeft {\n from {\n opacity: 0;\n transform: translate3d(-30px, 0, 0);\n }\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes fadeInRight {\n from {\n opacity: 0;\n transform: translate3d(30px, 0, 0);\n }\n to {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes slideInUp {\n from {\n transform: translate3d(0, 100%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes slideInDown {\n from {\n transform: translate3d(0, -100%, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes slideInLeft {\n from {\n transform: translate3d(-100%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes slideInRight {\n from {\n transform: translate3d(100%, 0, 0);\n visibility: visible;\n }\n to {\n transform: translate3d(0, 0, 0);\n }\n }\n \n @keyframes zoomIn {\n from {\n opacity: 0;\n transform: scale3d(0.3, 0.3, 0.3);\n }\n 50% {\n opacity: 1;\n }\n }\n \n @keyframes pulse {\n from {\n transform: scale3d(1, 1, 1);\n }\n 50% {\n transform: scale3d(1.05, 1.05, 1.05);\n }\n to {\n transform: scale3d(1, 1, 1);\n }\n }\n \n @keyframes typewriter {\n from { width: 0; }\n to { width: 100%; }\n }\n \n @keyframes blinkCursor {\n from { border-right-color: rgba(0,0,0,.75); }\n to { border-right-color: transparent; }\n }\n\n @keyframes reveal {\n from { clip-path: inset(0 100% 0 0); }\n to { clip-path: inset(0 0 0 0); }\n }\n\n @keyframes revealUp {\n from { clip-path: inset(100% 0 0 0); }\n to { clip-path: inset(0 0 0 0); }\n }\n\n @keyframes revealDown {\n from { clip-path: inset(0 0 100% 0); }\n to { clip-path: inset(0 0 0 0); }\n }\n\n @keyframes bounce {\n from, 20%, 53%, 80%, to {\n animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);\n transform: translate3d(0, 0, 0);\n }\n 40%, 43% {\n animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);\n transform: translate3d(0, -30px, 0);\n }\n 70% {\n animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);\n transform: translate3d(0, -15px, 0);\n }\n 90% {\n transform: translate3d(0, -4px, 0);\n }\n }\n\n @keyframes ripple {\n 0% {\n transform: scale(0);\n opacity: 1;\n }\n 100% {\n transform: scale(1);\n opacity: 0;\n }\n }\n\n @keyframes shine {\n from {\n background-position: -200% 0;\n }\n to {\n background-position: 200% 0;\n }\n }\n ",document.head.appendChild(e)}}()}),[]);var _=function(){if(!(M||L.hasAnimated||L.isAnimating)){B(l(l({},L),{},{isAnimating:!0})),O();var e=function(){B({hasAnimated:!0,isAnimating:-1===b}),P(),-1!==b&&R.current.removeEventListener("animationend",e)};R.current.addEventListener("animationend",e)}},q=function(){M||(B({hasAnimated:!1,isAnimating:!1}),R.current&&R.current.removeEventListener("animationend",(function(){})))};e.useEffect((function(){if(R.current){if(!(M||"scroll"===x&&X)){var e,t;switch(x){case"scroll":!function(){if(X)return;(e=new IntersectionObserver((function(t){if(u(t,1)[0].isIntersecting){if(_(),-1===b)return;e.disconnect()}}),{threshold:p})).observe(R.current)}();break;case"load":t=setTimeout(_,10)}return function(){e&&e.disconnect(),t&&clearTimeout(t),R.current.removeEventListener("animationend",(function(){}))}}R.current&&(R.current.style.visibility="visible")}}),[x,p,M,X,b]);var U=l(l({},N),{animation:"".concat(L.isAnimating?o:"none"," ").concat(a,"s ").concat(S(y)," ").concat(d,"s ").concat(-1===b?"infinite":b," ").concat(w?"alternate":"normal"," both"),visibility:L.hasAnimated||L.isAnimating?"visible":"hidden"}),Y=l(l({ref:R,className:"react-simple-animated ".concat(o," ").concat(I),style:U,"data-animation-state":L.hasAnimated?"completed":L.isAnimating?"running":"initial","data-animation-type":o},M?{}:"hover"===x?{onMouseEnter:_,onMouseLeave:q}:"click"===x?{onClick:_}:{}),T);return e.createElement("div",Y,"function"==typeof n?n({play:_,reset:q,state:L}):n)},O=["children","duration","delay","ease","direction","backgroundColor","textColor","maskStyle","trigger","threshold","onStart","onComplete","className","style"],E=function(o){var c=o.children,u=o.duration,d=void 0===u?1.2:u,f=o.delay,p=void 0===f?0:f,m=o.ease,y=void 0===m?"power4.inOut":m,g=o.direction,b=void 0===g?"left":g,h=o.backgroundColor,w=void 0===h?"#000":h,A=o.textColor,x=void 0===A?"inherit":A,S=o.maskStyle,k=void 0===S?"solid":S,C=o.trigger,E=void 0===C?"scroll":C,P=o.threshold,z=void 0===P?.2:P,I=o.onStart,j=void 0===I?function(){}:I,N=o.onComplete,T=void 0===N?function(){}:N,R=o.className,G=void 0===R?"":R,L=o.style,B=void 0===L?{}:L,D=s(o,O),M=e.useRef(null),X=e.useRef(null),_=e.useRef(null),q=v(),U=q.disableAllAnimations,Y=q.disableScrollAnimations,Q=(0,n.useGSAP((function(){if(M.current&&X.current&&_.current){if(U||"scroll"===E&&Y)return t.set(X.current,{opacity:1}),void t.set(_.current,{display:"none"});if("load"===E||"scroll"===E){t.set(X.current,{opacity:0});var e="left"===b||"right"===b,n=t.timeline({paused:"scroll"===E,onStart:j,onComplete:T});return"split"===k?n.to(_.current,i(i(i({},e?"x":"y",e?"left"===b?"100%":"-100%":"top"===b?"100%":"-100%"),"duration",.6*d),"ease",y)):n.to(_.current,i(i(i(i({},e?"scaleX":"scaleY",0),"duration",.6*d),"ease",y),"transformOrigin","left"===b?"right center":"right"===b?"left center":"top"===b?"center bottom":"center top")),n.to(X.current,{opacity:1,duration:.4*d,ease:"power2.out"},"-=0.25"),"scroll"!==E||Y?"load"===E&&n.play():r.create({trigger:M.current,start:"top bottom-=".concat(100*z,"%"),onEnter:function(){return n.play()}}),function(){"scroll"===E&&r.getAll().filter((function(e){return e.vars.trigger===M.current})).forEach((function(e){return e.kill()}))}}}}),{scope:M,dependencies:[d,p,y,b,k,E,z,U,Y]}).contextSafe)((function(){if(!U&&M.current&&X.current&&_.current){t.set(X.current,{opacity:0}),t.set(_.current,{display:"block",scaleX:"left"===b||"right"===b?1:void 0,scaleY:"top"===b||"bottom"===b?1:void 0,x:0,y:0});var e=t.timeline({onStart:j,onComplete:function(){T(),t.set(_.current,{display:"none"})}}),n="left"===b||"right"===b;"split"===k?e.to(_.current,i(i(i({},n?"x":"y",n?"left"===b?"100%":"-100%":"top"===b?"100%":"-100%"),"duration",.6*d),"ease",y)):e.to(_.current,i(i(i(i({},n?"scaleX":"scaleY",0),"duration",.6*d),"ease",y),"transformOrigin","left"===b?"right center":"right"===b?"left center":"top"===b?"center bottom":"center top")),e.to(X.current,{opacity:1,duration:.4*d,ease:"power2.out"},"-=0.25"),e.play()}})),F=l({position:"relative",overflow:"hidden",display:"inline-block"},B);return e.createElement("div",a({ref:M,className:"react-gsap-textreveal ".concat(G),style:F},U?{}:"hover"===E?{onMouseEnter:Q}:"click"===E?{onClick:Q}:{},D),e.createElement("div",{ref:_,className:"react-gsap-textreveal-mask",style:function(){var e={position:"absolute",background:w,zIndex:1,top:0,right:0,bottom:0,left:0},t="left"===b?"right center":"right"===b?"left center":"top"===b?"center bottom":"center top";if("gradient"===k){var n="left"===b?"to right":"right"===b?"to left":"top"===b?"to bottom":"to top";return l(l({},e),{},{transformOrigin:t,background:"linear-gradient(".concat(n,", ").concat(w," 0%, ").concat(w,"CC 70%, ").concat(w,"00 100%)")})}return l(l({},e),{},{transformOrigin:t})}()}),e.createElement("div",{ref:X,className:"react-gsap-textreveal-text",style:{position:"relative",zIndex:2,color:x,opacity:0}},"function"==typeof c?c({play:Q}):c))},P=["text","typingSpeed","deleteSpeed","delayBetweenTexts","startDelay","cursorBlink","cursorChar","cursorColor","trigger","threshold","loop","onComplete","className","style"],z=function(r){var o=r.text,i=void 0===o?"":o,c=r.typingSpeed,l=void 0===c?10:c,u=r.deleteSpeed,d=void 0===u?5:u,f=r.delayBetweenTexts,p=void 0===f?1.5:f,m=r.startDelay,y=void 0===m?.5:m,g=r.cursorBlink,b=void 0===g||g,h=r.cursorChar,w=void 0===h?"|":h,A=r.cursorColor,x=void 0===A?"inherit":A,S=r.trigger,k=void 0===S?"load":S,C=r.threshold,O=void 0===C?.2:C,E=r.loop,z=void 0===E?0:E,I=r.onComplete,j=void 0===I?function(){}:I,N=r.className,T=void 0===N?"":N,R=r.style,G=void 0===R?{}:R,L=s(r,P),B=e.useRef(null),D=e.useRef(null),M=e.useRef(null),X=v(),_=X.disableAllAnimations,q=X.disableScrollAnimations,U=Array.isArray(i)?i:[i];n.useGSAP((function(){if(B.current&&D.current&&M.current){if(_||"scroll"===k&&q)return D.current.textContent=U[U.length-1]||"",void(M.current.style.opacity=0);if("load"===k||"scroll"===k){var e=function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:0,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:0,o=arguments.length>2&&void 0!==arguments[2]&&arguments[2],i=U[n%U.length]||"";if(!o&&r<=i.length)D.current.textContent=i.substring(0,r),r++,t.delayedCall(1/l,(function(){e(n,r,o)}));else if(o&&r>=0)D.current.textContent=i.substring(0,r),r--,t.delayedCall(1/d,(function(){e(n,r,o)}));else if(!o&&r>i.length)U.length>1||0!==z?t.delayedCall(p,(function(){e(n,r,!0)})):"function"==typeof j&&j();else if(o&&r<0){var a=n+1;a<U.length||z===1/0||a<U.length*(z+1)?t.delayedCall(y,(function(){e(a,0,!1)})):"function"==typeof j&&j()}};if(b&&t.to(M.current,{opacity:0,duration:.5,repeat:-1,yoyo:!0}),t.delayedCall(y,(function(){e(0,0,!1)})),"scroll"===k){var n=t.timeline({paused:!0});ScrollTrigger.create({trigger:B.current,start:"top bottom-=".concat(100*O,"%"),onEnter:function(){return n.play()}})}return function(){t.killTweensOf(D.current),t.killTweensOf(M.current),"scroll"===k&&ScrollTrigger.getAll().filter((function(e){return e.vars.trigger===B.current})).forEach((function(e){return e.kill()}))}}}}),{scope:B,dependencies:[JSON.stringify(U),l,d,p,y,b,k,O,z,_,q]});var Y={color:x,display:"inline-block",marginLeft:"0.1em",fontWeight:"normal"};return e.createElement("div",a({ref:B,className:"react-gsap-typing-text ".concat(T),style:G},L),e.createElement("span",{ref:D}),e.createElement("span",{ref:M,style:Y},w))},I=["children","effect","effectColor","duration","ease","onClick","className","style","asChild"],j=function(r){var o=r.children,i=r.effect,a=void 0===i?"ripple":i,c=r.effectColor,u=void 0===c?"rgba(255, 255, 255, 0.4)":c,d=r.duration,f=void 0===d?.6:d,p=r.ease,m=void 0===p?"power2.out":p,y=r.onClick,g=void 0===y?function(){}:y,b=r.className,h=void 0===b?"":b,w=r.style,A=void 0===w?{}:w,x=r.asChild,S=void 0!==x&&x,k=s(r,I),C=e.useRef(null),O=e.useRef(null),E=v().disableAllAnimations,P=n.useGSAP((function(){if(!E){if(["ripple","shine"].includes(a)&&C.current&&!O.current){var e=document.createElement("span");e.className="animated-button-effect ".concat(a,"-effect"),"ripple"===a?Object.assign(e.style,{position:"absolute",borderRadius:"50%",backgroundColor:u,transform:"scale(0)",pointerEvents:"none",zIndex:"1"}):"shine"===a&&Object.assign(e.style,{position:"absolute",top:"0",left:"-100%",width:"60%",height:"100%",background:"linear-gradient(to right, transparent 0%, ".concat(u," 50%, transparent 100%)"),transform:"skewX(-25deg)",pointerEvents:"none",zIndex:"1"}),C.current.style.position="relative",C.current.style.overflow="hidden",C.current.appendChild(e),O.current=e}return function(){if(O.current&&C.current)try{C.current.removeChild(O.current),O.current=null}catch(e){}}}}),{scope:C,dependencies:[a,u,E]}).contextSafe,z=P((function(e){if(!E&&C.current&&O.current){var n=C.current.getBoundingClientRect(),r=e?e.clientX-n.left:n.width/2,o=e?e.clientY-n.top:n.height/2,i=2*Math.max(n.width,n.height);t.set(O.current,{x:r-i/2,y:o-i/2,width:i,height:i,opacity:.5,scale:0}),t.to(O.current,{scale:1,opacity:0,duration:f,ease:m})}})),j=P((function(){!E&&O.current&&t.fromTo(O.current,{left:"-100%"},{left:"100%",duration:f,ease:m,onComplete:function(){t.set(O.current,{left:"-100%"})}})})),N=P((function(){!E&&C.current&&t.to(C.current,{scale:1.05,duration:f/2,ease:"power1.out",onComplete:function(){t.to(C.current,{scale:1,duration:f/2,ease:"power1.in"})}})})),T=P((function(){!E&&C.current&&t.to(C.current,{scale:.95,duration:f/3,ease:"power2.out",onComplete:function(){t.to(C.current,{scale:1,duration:f/2,ease:"elastic.out(1, 0.3)"})}})})),R=P((function(){if(!E&&C.current){var e=window.getComputedStyle(C.current).backgroundColor;t.to(C.current,{backgroundColor:u,duration:f,ease:m,onComplete:function(){t.to(C.current,{backgroundColor:e,duration:f,ease:m})}})}})),G=P((function(e){if(E)g(e);else{switch(a){case"ripple":z(e);break;case"shine":j();break;case"pulse":N();break;case"scale":T();break;case"fill":R()}g(e)}})),L=l({ref:C,className:"react-gsap-button ".concat(a,"-button ").concat(h),onClick:G,style:l({position:"relative",overflow:"hidden"},A)},k);return S&&1===e.Children.count(o)?e.cloneElement(e.Children.only(o),L):e.createElement("button",L,o)},N=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=n.duration,o=void 0===r?.8:r,i=n.delay,a=void 0===i?0:i,c=n.ease,s=void 0===c?"power3.out":c,u=n.direction,d=void 0===u?"up":u,f=n.distance,p=void 0===f?30:f,m=n.onComplete,v={opacity:0};return"up"===d?v.y=p:"down"===d?v.y=-p:"left"===d?v.x=-p:"right"===d&&(v.x=p),t.from(e,l(l({},v),{},{duration:o,delay:a,ease:s,onComplete:m,clearProps:"all"}))},T=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=n.duration,o=void 0===r?.8:r,i=n.delay,a=void 0===i?0:i,c=n.ease,s=void 0===c?"power3.out":c,u=n.direction,d=void 0===u?"down":u,f=n.distance,p=void 0===f?30:f,m=n.onComplete,v={opacity:0};return"up"===d?v.y=-p:"down"===d?v.y=p:"left"===d?v.x=-p:"right"===d&&(v.x=p),t.to(e,l(l({},v),{},{duration:o,delay:a,ease:s,onComplete:m}))},R=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=n.duration,o=void 0===r?.8:r,i=n.delay,a=void 0===i?0:i,c=n.ease,s=void 0===c?"power3.out":c,u=n.direction,d=void 0===u?"up":u,f=n.distance,p=void 0===f?100:f,m=n.fade,v=void 0===m||m,y=n.onComplete,g=v?{opacity:0}:{};return"up"===d?g.y=p:"down"===d?g.y=-p:"left"===d?g.x=-p:"right"===d&&(g.x=p),t.from(e,l(l({},g),{},{duration:o,delay:a,ease:s,onComplete:y,clearProps:"all"}))},G=function(e){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},r=n.duration,o=void 0===r?1.2:r,a=n.delay,c=void 0===a?0:a,l=n.ease,s=void 0===l?"power4.inOut":l,u=n.direction,d=void 0===u?"left":u,f=n.maskStyle,p=void 0===f?"solid":f,m=n.onComplete,v=e.container,y=e.text,g=e.mask;if(!v||!y||!g)return console.error("textReveal: All elements (container, text, mask) are required"),null;var b=t.timeline({delay:c,onComplete:m}),h="left"===d||"right"===d;return t.set(y,{opacity:0}),"split"===p?b.to(g,i(i(i({},h?"x":"y",h?"left"===d?"100%":"-100%":"top"===d?"100%":"-100%"),"duration",.6*o),"ease",s)):b.to(g,i(i(i(i({},h?"scaleX":"scaleY",0),"duration",.6*o),"ease",s),"transformOrigin","left"===d?"right center":"right"===d?"left center":"top"===d?"center bottom":"center top")),b.to(y,{opacity:1,duration:.4*o,ease:"power2.out"},"-=0.25"),b},L={fadeIn:N,fadeOut:T,slideIn:R,textReveal:G},B=Object.freeze({__proto__:null,default:L,fadeIn:N,fadeOut:T,slideIn:R,textReveal:G}),D="2.0.0",M={name:"react-gsap-animation-library",version:D,description:"A comprehensive React component library that leverages GSAP for animations with official GSAP-React integration",author:"Itamar Zand",license:"MIT",repository:"https://github.com/ItamarZand88/react-gsap-animation-library"};if("undefined"!=typeof window)try{t.registerPlugin(n.useGSAP,r)}catch(e){console.warn("Failed to register GSAP plugins:",e.message)}var X={AnimationProvider:m,useAnimationSettings:v,useAnimation:y,useAnimationEffect:g,useScrollTrigger:b,FadeIn:w,SlideIn:x,SimpleAnimated:C,TextReveal:E,TypingText:z,AnimatedButton:j,animations:B,version:D,info:M};exports.AnimatedButton=j,exports.AnimationProvider=m,exports.FadeIn=w,exports.SimpleAnimated=C,exports.SlideIn=x,exports.TextReveal=E,exports.TypingText=z,exports.animations=B,exports.default=X,exports.info=M,exports.useAnimation=y,exports.useAnimationEffect=g,exports.useAnimationSettings=v,exports.useScrollTrigger=b,exports.version=D;
//# sourceMappingURL=index.js.map