@szum-tech/design-system
Version:
Szum-Tech design system with tailwindcss support
1 lines • 2.53 kB
JavaScript
;var chunkD5PAWOAZ_cjs=require('./chunk-D5PAWOAZ.cjs'),t=require('react'),react=require('motion/react'),jsxRuntime=require('react/jsx-runtime');function _interopNamespace(e){if(e&&e.__esModule)return e;var n=Object.create(null);if(e){Object.keys(e).forEach(function(k){if(k!=='default'){var d=Object.getOwnPropertyDescriptor(e,k);Object.defineProperty(n,k,d.get?d:{enumerable:true,get:function(){return e[k]}});}})}n.default=e;return Object.freeze(n)}var t__namespace=/*#__PURE__*/_interopNamespace(t);function P({words:e,duration:l=1500,animationStyle:m="fade",loop:i=true,className:I,containerClassName:b,pauseDuration:n=300,startOnView:h=true,once:a=false,inViewMargin:w,...V}){let c=t__namespace.useRef(null),v=react.useInView(c,{once:a,margin:w}),[u,S]=t__namespace.useState(false),[d,T]=t__namespace.useState(0),[W,y]=t__namespace.useState(true),O={fade:{initial:{opacity:0},animate:{opacity:1,transition:{duration:.4,ease:[.4,0,.2,1]}},exit:{opacity:0,transition:{duration:.3,ease:[.4,0,1,1]}}},"slide-up":{initial:{opacity:0,y:24},animate:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:25,mass:.8}},exit:{opacity:0,y:-24,transition:{duration:.25,ease:[.4,0,1,1]}}},"slide-down":{initial:{opacity:0,y:-24},animate:{opacity:1,y:0,transition:{type:"spring",stiffness:300,damping:25,mass:.8}},exit:{opacity:0,y:24,transition:{duration:.25,ease:[.4,0,1,1]}}},scale:{initial:{opacity:0,scale:.8},animate:{opacity:1,scale:1,transition:{type:"spring",stiffness:400,damping:30,mass:.6}},exit:{opacity:0,scale:.9,transition:{duration:.2,ease:[.4,0,1,1]}}},flip:{initial:{opacity:0,rotateX:90},animate:{opacity:1,rotateX:0,transition:{type:"spring",stiffness:200,damping:20,mass:1}},exit:{opacity:0,rotateX:-90,transition:{duration:.3,ease:[.4,0,1,1]}}}},f=!h||v&&(!a||!u);return t__namespace.useEffect(()=>{if(!f||e.length===0)return;let o,s;return o=setInterval(()=>{y(false),s=setTimeout(()=>{T(g=>{let r=g+1;return !i&&r>=e.length?(clearInterval(o),clearTimeout(s),g):i?r%e.length:r}),y(true),S(true);},n);},l+n),()=>{clearInterval(o),clearTimeout(s);}},[f,l,n,e.length,i,a,u]),jsxRuntime.jsx(react.motion.span,{ref:c,"data-slot":"word-rotate",className:chunkD5PAWOAZ_cjs.a("inline-block overflow-hidden align-bottom leading-none",b),...V,children:jsxRuntime.jsx(react.motion.span,{initial:"initial",animate:W?"animate":"exit",exit:"exit",variants:O[m],transition:{duration:.5},style:{perspective:m==="flip"?1e3:void 0},className:chunkD5PAWOAZ_cjs.a("inline-block",I),children:e[d]},d)})}exports.a=P;