@szum-tech/design-system
Version:
Szum-Tech design system with tailwindcss support
1 lines • 805 B
JavaScript
import {a}from'./chunk-JUNHRB4B.js';import*as n from'react';import {useInView,useMotionValue,animate,motion}from'motion/react';import {jsx}from'react/jsx-runtime';function x({from:t=0,to:e=100,duration:o=2,delay:s=0,className:l,startOnView:p=true,once:i=false,inViewMargin:f,onComplete:b,format:r,...g}){let a$1=n.useRef(null),d=useInView(a$1,{once:i,margin:f}),[V,w]=n.useState(false),[u,R]=n.useState(t),N=useMotionValue(t),m=!p||d&&(!i||!V);return n.useEffect(function(){if(!m)return;w(true);let y=setTimeout(function(){let C=animate(N,e,{duration:o,onUpdate:I=>R(I),onComplete:b});return function(){C.stop();}},s);return function(){clearTimeout(y);}},[m,t,e,o,s]),jsx(motion.span,{ref:a$1,"data-slot":"counting-number",className:a("inline-block",l),...g,children:r?r(u):Math.round(u)})}export{x as a};