UNPKG

use-count-up

Version:

React/React Native component and hook to animate counting up or down to a number

2 lines (1 loc) 3.81 kB
var Q=Object.create;var F=Object.defineProperty;var W=Object.getOwnPropertyDescriptor;var X=Object.getOwnPropertyNames,I=Object.getOwnPropertySymbols,Y=Object.getPrototypeOf,S=Object.prototype.hasOwnProperty,Z=Object.prototype.propertyIsEnumerable;var h=e=>F(e,"__esModule",{value:!0});var q=(e,t)=>{var r={};for(var n in e)S.call(e,n)&&t.indexOf(n)<0&&(r[n]=e[n]);if(e!=null&&I)for(var n of I(e))t.indexOf(n)<0&&Z.call(e,n)&&(r[n]=e[n]);return r};var _=(e,t)=>{h(e);for(var r in t)F(e,r,{get:t[r],enumerable:!0})},ee=(e,t,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of X(t))!S.call(e,n)&&n!=="default"&&F(e,n,{get:()=>t[n],enumerable:!(r=W(t,n))||r.enumerable});return e},V=e=>ee(h(F(e!=null?Q(Y(e)):{},"default",e&&e.__esModule&&"default"in e?{get:()=>e.default,enumerable:!0}:{value:e,enumerable:!0})),e);_(exports,{CountUp:()=>T,useCountUp:()=>x});var s=V(require("react")),O=V(require("react")),te=Object.defineProperty,re=Object.defineProperties,ne=Object.getOwnPropertyDescriptors,L=Object.getOwnPropertySymbols,ue=Object.prototype.hasOwnProperty,oe=Object.prototype.propertyIsEnumerable,$=(e,t,r)=>t in e?te(e,t,{enumerable:!0,configurable:!0,writable:!0,value:r}):e[t]=r,A=(e,t)=>{for(var r in t||(t={}))ue.call(t,r)&&$(e,r,t[r]);if(L)for(var r of L(t))oe.call(t,r)&&$(e,r,t[r]);return e},D=(e,t)=>re(e,ne(t)),k=typeof window=="undefined"?O.useEffect:O.useLayoutEffect,B=({isPlaying:e,duration:t,startAt:r=0,updateInterval:n=0,onComplete:p,onUpdate:y})=>{let[m,g]=(0,s.useState)(r),v=(0,s.useRef)(r*-1e3),i=(0,s.useRef)(null),c=(0,s.useRef)(null),b=(0,s.useRef)(null),o=(0,s.useRef)({elapsedTimeRef:0,startAtRef:r,durationRef:t,updateIntervalRef:n});o.current=D(A({},o.current),{durationRef:t,updateIntervalRef:n});let l=a=>{let u=a/1e3;if(c.current===null){c.current=u,i.current=requestAnimationFrame(l);return}let{durationRef:f,elapsedTimeRef:U,updateIntervalRef:C,startAtRef:d}=o.current,w=u-c.current,E=U+w;c.current=u,o.current=D(A({},o.current),{elapsedTimeRef:E});let H=d+(C===0?E:(E/C|0)*C),K=d+E,j=typeof f=="number"&&K>=f;g(j?f:H),j||(i.current=requestAnimationFrame(l))},R=()=>{i.current&&cancelAnimationFrame(i.current),b.current&&clearTimeout(b.current),c.current=null},P=(0,s.useCallback)(a=>{let u=typeof a=="number"?a:r;R(),o.current=D(A({},o.current),{elapsedTimeRef:0,startAtRef:u}),g(u),e&&(i.current=requestAnimationFrame(l))},[e,r]);return k(()=>{if(y==null||y(m),t&&m>=t){v.current+=t*1e3;let{shouldRepeat:a=!1,delay:u=0,newStartAt:f}=(p==null?void 0:p(v.current/1e3))||{};a&&(b.current=setTimeout(()=>P(f),u*1e3))}},[m,t]),k(()=>(e&&(i.current=requestAnimationFrame(l)),R),[e]),{elapsedTime:m,reset:P}};var M={easeInCubic:(e,t,r,n)=>(e/=n,r*e*e*e+t),easeOutCubic:(e,t,r,n)=>(e/=n,e--,r*(e*e*e+1)+t),linear:(e,t,r,n)=>r*e/n+t},N=M.easeOutCubic,z=e=>typeof e=="function"?e:M[e];var ae=(e,t)=>{if(typeof e=="number")return typeof t=="number"?t:2},G=(e,t)=>e.replace(/\B(?=(\d{3})+(?!\d))/g,t),J=e=>(e.toString().split(".")[1]||"").length,se=(e,t)=>{let r=J(e),n=J(t||1);return r>=n?r:n},x=({isCounting:e=!1,start:t=0,end:r,duration:n,decimalPlaces:p=se(t,r),decimalSeparator:y=".",thousandsSeparator:m="",onComplete:g,easing:v=N,formatter:i,updateInterval:c,onUpdate:b})=>{let o=ae(r,n),l=a=>{let u;if(o===0&&typeof r=="number")u=r;else if(typeof r=="number"&&typeof o=="number"){let d=z(v),w=a<o?a:o;u=d(w,t,r-t,o)}else u=t+a;if(typeof i=="function")return i(u);if(p===0){let d=Math.round(u).toString();return G(d,m)}let[f,U]=u.toFixed(p).split(".");return`${G(f,m)}${y}${U}`},{elapsedTime:R,reset:P}=B({isPlaying:e,duration:o,onComplete:g,updateInterval:c,onUpdate:typeof b=="function"?a=>b(l(a)):void 0});return{value:l(R),reset:P}};var T=r=>{var n=r,{children:e}=n,t=q(n,["children"]);let p=x(t);return typeof e=="function"?e(p):p.value};T.displayName="CountUp";