{"version":3,"file":"NumberCounter.MSf9xOu5.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/nfxZGBzocXtdBTRAfqga/6Bc9qItk1NbgwFsPG0tS/NumberCounter.js"],"sourcesContent":["// Number counter component with customizable start/end values and animation\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useState,useEffect,useRef,startTransition}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{motion,useInView}from\"framer-motion\";/**\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function NumberCounter(props){const{startValue=0,endValue=100,duration=2,prefix=\"\",suffix=\"\",separator=\",\",decimals=0,autoStart=true,triggerOnView=true,autoplayOnView=false,font,color=\"#000000\",prefixColor=\"#000000\",suffixColor=\"#000000\",style}=props;const[currentValue,setCurrentValue]=useState(startValue);const[hasStarted,setHasStarted]=useState(false);const ref=useRef(null);const isInView=useInView(ref,{once:!autoplayOnView});const isStatic=useIsStaticRenderer();const shouldAnimate=isStatic?false:triggerOnView?isInView:autoStart;useEffect(()=>{if(!shouldAnimate)return;// Reset hasStarted if autoplayOnView is enabled and we're using triggerOnView\nif(autoplayOnView&&triggerOnView){startTransition(()=>setHasStarted(false));}if(hasStarted&&!autoplayOnView)return;startTransition(()=>setHasStarted(true));const startTime=Date.now();const difference=endValue-startValue;const animate=()=>{const elapsed=Date.now()-startTime;const progress=Math.min(elapsed/(duration*1e3),1);// Easing function for smooth animation\nconst easeOutQuart=1-Math.pow(1-progress,4);const newValue=startValue+difference*easeOutQuart;startTransition(()=>setCurrentValue(newValue));if(progress<1){requestAnimationFrame(animate);}else{startTransition(()=>setCurrentValue(endValue));}};requestAnimationFrame(animate);},[shouldAnimate,hasStarted,startValue,endValue,duration,autoplayOnView,triggerOnView]);// Show end value on canvas (static renderer) or when not started\nuseEffect(()=>{if(isStatic){startTransition(()=>setCurrentValue(endValue));}},[isStatic,endValue]);const formatNumber=value=>{const rounded=Number(value.toFixed(decimals));const parts=rounded.toString().split(\".\");// Add thousand separators\nif(separator){parts[0]=parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g,separator);}return parts.join(\".\");};const displayValue=isStatic?formatNumber(endValue):formatNumber(currentValue);return /*#__PURE__*/_jsx(motion.div,{ref:ref,style:{...style,position:\"relative\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\",width:\"100%\",height:\"100%\",color,...font},initial:{opacity:isStatic?1:0,scale:isStatic?1:.8},animate:{opacity:1,scale:1},transition:{duration:.3},children:/*#__PURE__*/_jsxs(\"span\",{children:[/*#__PURE__*/_jsx(\"span\",{style:{color:prefixColor},children:prefix}),displayValue,/*#__PURE__*/_jsx(\"span\",{style:{color:suffixColor},children:suffix})]})});}addPropertyControls(NumberCounter,{startValue:{type:ControlType.Number,title:\"Start Value\",defaultValue:0,step:1},endValue:{type:ControlType.Number,title:\"End Value\",defaultValue:100,step:1},duration:{type:ControlType.Number,title:\"Duration\",defaultValue:2,min:.1,max:10,step:.1,unit:\"s\"},prefix:{type:ControlType.String,title:\"Prefix\",defaultValue:\"\",placeholder:\"$\"},suffix:{type:ControlType.String,title:\"Suffix\",defaultValue:\"\",placeholder:\"%\"},separator:{type:ControlType.String,title:\"Thousand Separator\",defaultValue:\",\",placeholder:\",\"},decimals:{type:ControlType.Number,title:\"Decimal Places\",defaultValue:0,min:0,max:4,step:1},autoStart:{type:ControlType.Boolean,title:\"Auto Start\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\",hidden:({triggerOnView})=>triggerOnView},triggerOnView:{type:ControlType.Boolean,title:\"Trigger on View\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\"},autoplayOnView:{type:ControlType.Boolean,title:\"Autoplay on View\",defaultValue:false,enabledTitle:\"On\",disabledTitle:\"Off\",hidden:({triggerOnView})=>!triggerOnView},font:{type:ControlType.Font,title:\"Font\",defaultValue:{fontSize:\"32px\",variant:\"Bold\",letterSpacing:\"-0.03em\",lineHeight:\"1em\"},controls:\"extended\",defaultFontType:\"sans-serif\"},color:{type:ControlType.Color,title:\"Color\",defaultValue:\"#000000\"},prefixColor:{type:ControlType.Color,title:\"Prefix Color\",defaultValue:\"#000000\"},suffixColor:{type:ControlType.Color,title:\"Suffix Color\",defaultValue:\"#000000\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"NumberCounter\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./NumberCounter.map"],"mappings":"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"}