@lynksen/react-gsap-utils/dist/cjs/bundle.js

Collection of zero-config, drop-in utilities to animate React elements and components using GSAP Tween animation props.

"use strict";var e=require("react"),t=require("gsap"),r=require("gsap/ScrollTrigger");!function(e,t){void 0===t&&(t={});var r=t.insertAt;if(e&&"undefined"!=typeof document){var n=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===r&&n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}(".ScrollTriggerRevealContainer {\n  width: fit-content;\n  height: fit-content;\n  overflow: hidden;\n}\n"),exports.AnimateOnMount=function({children:r,mounted:n,className:o,fromTo:s=[{opacity:0,y:200},{opacity:1,y:0,duration:.5,ease:"sine.out"}]}){const[a,i]=e.useState(n),c=e.useRef(null);return e.useEffect((()=>{const e=c.current;e&&(!0===n?(i(!0),t.fromTo(e,s[0],s[1])):!1===n&&t.to(e,Object.assign(Object.assign({},s[0]),{duration:s[1].duration})).then((()=>i(!1))))}),[n]),e.createElement("div",{className:o,ref:c},a&&r)},exports.AnimateOnScroll=function({children:n,YOffset:o=80,from:s={opacity:0,y:"60%",duration:.6,ease:"power2.out"},className:a="",childClassName:i="",onComplete:c=(()=>{}),onStart:l=(()=>{}),debug:u=!1}){const d=e.useRef(null),g=e.useRef(null),f=s;return s.duration||(f.duration=.6),s.ease||(f.ease="power2.out"),e.useEffect((()=>{const e=t.gsap.context((()=>{if(t.gsap.registerPlugin(r.ScrollTrigger),!g.current||!d.current)return;let e={};c&&(e.onComplete=c),l&&(e.onStart=l),t.gsap.from(g.current,Object.assign(Object.assign(Object.assign({},f),{scrollTrigger:{trigger:d.current,start:`top ${o}%`,end:`top ${o-5}%`,markers:!!u,toggleActions:"play none none reverse"}}),e))}));return()=>e.revert()}),[]),e.createElement("div",{ref:d,className:`ScrollTriggerRevealContainer ${a||""}`},e.createElement("div",{className:i||"",ref:g},n))};
//# sourceMappingURL=bundle.js.map