{"version":3,"file":"NumberCounter.CWttTCVh.mjs","names":["useRef","useState","separator"],"sources":["https:/framerusercontent.com/modules/uIeSTYzWfS8Lvm21YuQa/j6s1Pz8H80n18q0ng1Q5/NumberCounter.js"],"sourcesContent":["// Animated number counter with 100% customization options using Manrope typeface\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,useMotionValue,useSpring,useTransform}from\"framer-motion\";/**\n * Animated Number Counter\n * \n * @framerSupportedLayoutWidth auto\n * @framerSupportedLayoutHeight auto\n */export default function NumberCounter(props){const{targetNumber=1e3,startNumber=0,duration=2,delay=0,easing=\"easeOut\",springConfig={stiffness:100,damping:30,mass:1},prefix=\"\",suffix=\"\",separator=\",\",decimalPlaces=0,font,fontSize=32,textColor=\"#000000\",backgroundColor=\"transparent\",padding=16,borderRadius=8,shadow=false,autoStart=true,triggerOnView=false,bold=false,style}=props;const isStatic=useIsStaticRenderer();const ref=useRef(null);const isInView=useInView(ref,{once:true});const[hasStarted,setHasStarted]=useState(false);const motionValue=useMotionValue(startNumber);const springValue=useSpring(motionValue,springConfig);// Transform the motion value to display value\nconst displayValue=useTransform(springValue,latest=>{const formatted=formatNumber(latest,decimalPlaces,separator);return`${prefix}${formatted}${suffix}`;});// Format number with separators and decimal places\nfunction formatNumber(num,decimals,separator){const fixed=num.toFixed(decimals);const parts=fixed.split(\".\");// Add thousand separators\nif(separator){parts[0]=parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g,separator);}return parts.join(\".\");}// Animation trigger logic\nuseEffect(()=>{if(isStatic)return;const shouldStart=autoStart&&(!triggerOnView||isInView);if(shouldStart&&!hasStarted){const timer=setTimeout(()=>{startTransition(()=>{setHasStarted(true);if(easing===\"spring\"){motionValue.set(targetNumber);}else{// Use different easing curves\nconst easingMap={linear:[0,0,1,1],easeIn:[.4,0,1,1],easeOut:[0,0,.2,1],easeInOut:[.4,0,.2,1]};motionValue.set(targetNumber);}});},delay*1e3);return()=>clearTimeout(timer);}},[autoStart,triggerOnView,isInView,hasStarted,targetNumber,delay,motionValue,easing,isStatic]);// Reset animation when target changes\nuseEffect(()=>{if(isStatic)return;startTransition(()=>{setHasStarted(false);motionValue.set(startNumber);});},[targetNumber,startNumber,motionValue,isStatic]);const containerStyle={display:\"inline-block\",padding:`${padding}px`,backgroundColor,borderRadius:`${borderRadius}px`,boxShadow:shadow?\"0 4px 12px rgba(0, 0, 0, 0.1)\":\"none\",color:textColor,...font,fontSize:`${fontSize}px`,fontFamily:\"Manrope, \"+(font?.fontFamily||\"sans-serif\"),fontWeight:bold?700:font?.fontWeight,position:\"relative\",...style};if(isStatic){const staticValue=formatNumber(targetNumber,decimalPlaces,separator);return /*#__PURE__*/_jsxs(\"div\",{ref:ref,style:containerStyle,children:[/*#__PURE__*/_jsx(\"link\",{href:\"https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap\",rel:\"stylesheet\"}),`${prefix}${staticValue}${suffix}`]});}return /*#__PURE__*/_jsxs(\"div\",{ref:ref,style:containerStyle,children:[/*#__PURE__*/_jsx(\"link\",{href:\"https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap\",rel:\"stylesheet\"}),/*#__PURE__*/_jsx(motion.span,{children:displayValue})]});}addPropertyControls(NumberCounter,{targetNumber:{type:ControlType.Number,title:\"Target Number\",defaultValue:1e3},startNumber:{type:ControlType.Number,title:\"Start Number\",defaultValue:0},duration:{type:ControlType.Number,title:\"Duration\",defaultValue:2,min:.1,max:10,step:.1,unit:\"s\"},delay:{type:ControlType.Number,title:\"Delay\",defaultValue:0,min:0,max:5,step:.1,unit:\"s\"},easing:{type:ControlType.Enum,title:\"Easing\",options:[\"linear\",\"easeIn\",\"easeOut\",\"easeInOut\",\"spring\"],optionTitles:[\"Linear\",\"Ease In\",\"Ease Out\",\"Ease In Out\",\"Spring\"],defaultValue:\"easeOut\",displaySegmentedControl:true},springConfig:{type:ControlType.Object,title:\"Spring Config\",controls:{stiffness:{type:ControlType.Number,title:\"Stiffness\",defaultValue:100,min:1,max:1e3,step:1},damping:{type:ControlType.Number,title:\"Damping\",defaultValue:30,min:1,max:100,step:1},mass:{type:ControlType.Number,title:\"Mass\",defaultValue:1,min:.1,max:10,step:.1}},hidden:({easing})=>easing!==\"spring\"},prefix:{type:ControlType.String,title:\"Prefix\",defaultValue:\"\",placeholder:\"$\"},suffix:{type:ControlType.String,title:\"Suffix\",defaultValue:\"\",placeholder:\"+\"},separator:{type:ControlType.String,title:\"Separator\",defaultValue:\",\",placeholder:\",\"},decimalPlaces:{type:ControlType.Number,title:\"Decimal Places\",defaultValue:0,min:0,max:5,step:1,displayStepper:true},font:{type:ControlType.Font,title:\"Font\",defaultValue:{fontSize:\"32px\",variant:\"Bold\",letterSpacing:\"-0.02em\",lineHeight:\"1em\"},controls:\"extended\",defaultFontType:\"sans-serif\"},fontSize:{type:ControlType.Number,title:\"Font Size\",defaultValue:32,min:8,max:200,step:1,unit:\"px\"},bold:{type:ControlType.Boolean,title:\"Bold\",defaultValue:false,enabledTitle:\"On\",disabledTitle:\"Off\"},textColor:{type:ControlType.Color,title:\"Text Color\",defaultValue:\"#000000\"},backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"rgba(0,0,0,0)\"},padding:{type:ControlType.Number,title:\"Padding\",defaultValue:16,min:0,max:50,step:1,unit:\"px\"},borderRadius:{type:ControlType.Number,title:\"Border Radius\",defaultValue:8,min:0,max:50,step:1,unit:\"px\"},shadow:{type:ControlType.Boolean,title:\"Shadow\",defaultValue:false,enabledTitle:\"On\",disabledTitle:\"Off\"},autoStart:{type:ControlType.Boolean,title:\"Auto Start\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\"},triggerOnView:{type:ControlType.Boolean,title:\"Trigger on View\",defaultValue:false,enabledTitle:\"On\",disabledTitle:\"Off\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"NumberCounter\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutWidth\":\"auto\",\"framerSupportedLayoutHeight\":\"auto\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./NumberCounter.map"],"mappings":"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"}