{"version":3,"file":"AnimatedCounter.aHDAX0AI.mjs","names":["useRef","useState","__esmMin","init_ssg_sandbox_shims","init_npm_react_18_3_1","window","te","ce","init_jsx_runtime","p","_e","de","useInView","addPropertyControls","init_framer_BWFVvmND","ControlType","AnimatedCounter","props","ref","isInView","display","setDisplay","hasAnimated","setHasAnimated","target","number","timeout","frame","start","animate","ts","elapsed","t","duration","eased","val","delay","style","numberFont","numberColor","symbolFont","symbolColor","symbol","init_AnimatedCounter"],"sources":["https:/framerusercontent.com/modules/tVuuUAaKaWqkGOseqwTI/jgyFR9JrrQlQbTaC0YFp/AnimatedCounter.js"],"sourcesContent":["// Animated Number Counter\n// Counts from 0 to a target number with optional symbol (e.g. +, %, etc). Animation starts when visible, supports delay and ease-in-out. Multiple counters can be placed on one page.\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useRef,useState,startTransition}from\"react\";import{addPropertyControls,ControlType,useInView}from\"framer\";/**\n * Animated Number Counter\n *\n * @framerSupportedLayoutWidth auto\n * @framerSupportedLayoutHeight auto\n */export default function AnimatedCounter(props){const{number=\"86\",numberFont,numberColor,symbol=\"+\",symbolFont,symbolColor,duration=1.2,delay=0,style}=props;const ref=useRef(null);const isInView=useInView(ref,{amount:.5,once:true});const[display,setDisplay]=useState(\"0\");const[hasAnimated,setHasAnimated]=useState(false);// Only digits for number\nconst target=parseInt(number.replace(/[^0-9]/g,\"\"),10)||0;useEffect(()=>{if(!isInView||hasAnimated)return;let timeout;let frame;let start=null;function animate(ts){if(start===null)start=ts;const elapsed=(ts-start)/1e3;const t=Math.min(1,elapsed/duration);// ease-in-out cubic\nconst eased=t<.5?4*t*t*t:1-Math.pow(-2*t+2,3)/2;const val=Math.round(target*eased);startTransition(()=>setDisplay(val.toLocaleString()));if(t<1){frame=requestAnimationFrame(animate);}else{startTransition(()=>setDisplay(target.toLocaleString()));setHasAnimated(true);}}timeout=window.setTimeout(()=>{frame=requestAnimationFrame(animate);},delay*1e3);return()=>{if(timeout)clearTimeout(timeout);if(frame)cancelAnimationFrame(frame);};},[isInView,hasAnimated,target,duration,delay]);return /*#__PURE__*/_jsxs(\"div\",{ref:ref,style:{...style,width:\"max-content\",minWidth:1,minHeight:1,display:\"inline-block\",position:\"relative\",userSelect:\"none\"},\"aria-live\":\"polite\",children:[/*#__PURE__*/_jsx(\"span\",{style:{...numberFont,color:numberColor},children:display}),/*#__PURE__*/_jsx(\"span\",{style:{...symbolFont,color:symbolColor},children:symbol})]});}addPropertyControls(AnimatedCounter,{number:{type:ControlType.String,title:\"Number text input\",defaultValue:\"86\",placeholder:\"e.g. 100\"},numberFont:{type:ControlType.Font,title:\"Number style\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:\"40px\",variant:\"Bold\",letterSpacing:\"-0.04em\",lineHeight:\"1em\"},useGlobalTextStyles:true},numberColor:{type:ControlType.Color,title:\"Font Color\",defaultValue:\"#000000\"},symbol:{type:ControlType.String,title:\"Symbol text input\",defaultValue:\"+\",placeholder:\"+, %, etc.\"},symbolFont:{type:ControlType.Font,title:\"Symbol text style\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:\"40px\",variant:\"Bold\",letterSpacing:\"-0.04em\",lineHeight:\"1em\"},useGlobalTextStyles:true},symbolColor:{type:ControlType.Color,title:\"Font color\",defaultValue:\"#000000\"},duration:{type:ControlType.Number,title:\"Duration\",defaultValue:1.2,min:.2,max:10,step:.1,unit:\"s\"},delay:{type:ControlType.Number,title:\"Delay\",defaultValue:0,min:0,max:5,step:.1,unit:\"s\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"AnimatedCounter\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"auto\",\"framerSupportedLayoutHeight\":\"auto\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./AnimatedCounter.map"],"mappings":"A,yPAOG,SAAwBgB,EAAgB,EAAM,CAAC,GAAK,CAAC,SAAO,KAAK,aAAW,cAAY,SAAO,IAAI,aAAW,cAAY,WAAS,IAAI,QAAM,EAAE,SAAOC,EAAYC,EAAIlB,EAAO,IAAI,EAAQmB,EAASP,EAAUM,EAAI,CAAC,OAAO,GAAG,KAAK,EAAI,CAAC,EAAO,CAACE,EAAQC,GAAYpB,EAAS,GAAG,EAAO,CAACqB,EAAYC,GAAgBtB,EAAS,EAAK,EAC5TuB,EAAO,SAASC,EAAO,QAAQ,UAAU,EAAE,EAAE,EAAE,GAAG,EACwa,OADtalB,MAAc,CAAC,GAAG,CAACY,GAAUG,EAAY,OAAO,IAAII,EAAYC,EAAUC,EAAM,KAAK,SAASC,EAAQ,EAAG,CAAID,IAAQ,OAAK,EAAME,GAAG,IAAMC,GAASD,EAAGF,GAAO,IAAUI,EAAE,KAAK,IAAI,EAAED,EAAQE,CAAQ,EACvPC,EAAMF,EAAE,GAAG,EAAEA,EAAEA,EAAEA,EAAE,GAAW,GAAGA,EAAE,IAAE,EAAG,EAAQG,EAAI,KAAK,MAAMX,EAAOU,CAAK,EAAE5B,MAAoBe,EAAWc,EAAI,eAAe,CAAC,CAAC,EAAKH,EAAE,EAAG,EAAM,sBAAsBH,CAAO,GAAQvB,MAAoBe,EAAWG,EAAO,eAAe,CAAC,CAAC,EAAED,EAAe,EAAI,EAAG,CAAkF,MAAjF,GAAQlB,EAAO,eAAe,CAAC,EAAM,sBAAsBwB,CAAO,CAAE,EAAEO,EAAM,GAAG,MAAY,CAAIV,GAAQ,aAAaA,CAAO,EAAKC,GAAM,qBAAqBA,CAAK,CAAE,CAAE,EAAE,CAACR,EAASG,EAAYE,EAAOS,EAASG,CAAK,CAAC,EAAsB,gBAAM,MAAM,CAAK,MAAI,MAAM,CAAC,GAAGC,EAAM,MAAM,cAAc,SAAS,EAAE,UAAU,EAAE,QAAQ,eAAe,SAAS,WAAW,WAAW,MAAM,EAAE,YAAY,SAAS,SAAS,CAAc,gBAAK,OAAO,CAAC,MAAM,CAAC,GAAGC,EAAW,MAAMC,CAAW,EAAE,SAASnB,CAAO,CAAC,EAAe,gBAAK,OAAO,CAAC,MAAM,CAAC,GAAGoB,EAAW,MAAMC,CAAW,EAAE,SAASC,CAAM,CAAC,CAAC,CAAC,CAAC,CAAE,C,8CAAC7B,EAAoBG,EAAgB,CAAC,OAAO,CAAC,KAAKD,EAAY,OAAO,MAAM,oBAAoB,aAAa,KAAK,YAAY,UAAU,EAAE,WAAW,CAAC,KAAKA,EAAY,KAAK,MAAM,eAAe,SAAS,WAAW,gBAAgB,aAAa,aAAa,CAAC,SAAS,OAAO,QAAQ,OAAO,cAAc,UAAU,WAAW,KAAK,EAAE,oBAAoB,EAAI,EAAE,YAAY,CAAC,KAAKA,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,EAAE,OAAO,CAAC,KAAKA,EAAY,OAAO,MAAM,oBAAoB,aAAa,IAAI,YAAY,YAAY,EAAE,WAAW,CAAC,KAAKA,EAAY,KAAK,MAAM,oBAAoB,SAAS,WAAW,gBAAgB,aAAa,aAAa,CAAC,SAAS,OAAO,QAAQ,OAAO,cAAc,UAAU,WAAW,KAAK,EAAE,oBAAoB,EAAI,EAAE,YAAY,CAAC,KAAKA,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,EAAE,SAAS,CAAC,KAAKA,EAAY,OAAO,MAAM,WAAW,aAAa,IAAI,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,KAAK,GAAG,EAAE,MAAM,CAAC,KAAKA,EAAY,OAAO,MAAM,QAAQ,aAAa,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC,C"}