{"version":3,"file":"NumberAnimator.DxH76ESF.mjs","names":[],"sources":["https:/framerusercontent.com/modules/fONf9xpEnRB5fhZ36jxV/PFQw4hQn5StRPC8BS3iZ/NumberAnimator.js"],"sourcesContent":["import{jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{motion,animate,useInView}from\"framer-motion\";import{useEffect,useState,useRef}from\"react\";/**\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export default function NumberAnimator(props){const ref=useRef(null);const isInView=useInView(ref,{once:!props.animation.replay,amount:\"some\"});const[numberText,setNumberText]=useState(\"\");const{start,end,decimals,commas,rounding,fontColor,animation}=props;const[currentAnimation,setCurrentAnimation]=useState(null);const isCanvas=RenderTarget.current()===RenderTarget.canvas;function formatNumber(value){let number=value;let numberString=number.toFixed(decimals);if(commas){numberString=numberString.replace(/\\B(?=(\\d{3})+(?!\\d))/g,\",\");}return numberString;}function runAnimation(){if(!isCanvas){if(currentAnimation){currentAnimation.stop();}setCurrentAnimation(animate(start,end,{...animation.transition,onUpdate:latest=>{setNumberText(formatNumber(latest));}}));}}useEffect(()=>{if(animation.trigger==\"appear\"){runAnimation();}setNumberText(formatNumber(start));},[]);useEffect(()=>{if(isInView&&animation.trigger==\"layerInView\"){runAnimation();}},[isInView]);useEffect(()=>{if(animation.trigger==\"layerInView\"){if(isInView){runAnimation();}else{if(currentAnimation){currentAnimation.stop();}setNumberText(formatNumber(start));}}},[isInView]);return /*#__PURE__*/_jsxs(motion.p,{ref:ref,style:{userSelect:props.textSelect?\"auto\":\"none\",fontVariantNumeric:`${props.monospace?\"tabular-nums \":\"\"}${props.slashedZeros?\"slashed-zero\":\"\"}`,margin:0,...fontColor.mode==\"solid\"?{color:fontColor.color}:{WebkitBackgroundClip:\"text\",WebkitTextFillColor:\"transparent\",backgroundImage:`linear-gradient(${fontColor.angle}deg, ${fontColor.startColor}, ${fontColor.endColor})`},...props.font,...props.style},children:[props.prefix,isCanvas?formatNumber(end):numberText,props.suffix]});}NumberAnimator.displayName=\"Animated Number Counter\";addPropertyControls(NumberAnimator,{start:{type:ControlType.Number,defaultValue:0},end:{type:ControlType.Number,defaultValue:100},decimals:{type:ControlType.Number,defaultValue:0,min:0,max:3,step:1},commas:{type:ControlType.Boolean,defaultValue:true},fontColor:{type:ControlType.Object,controls:{mode:{type:ControlType.Enum,defaultValue:\"solid\",options:[\"solid\",\"gradient\"],optionTitles:[\"Solid\",\"Gradient\"],displaySegmentedControl:true},color:{type:ControlType.Color,defaultValue:\"#000\",hidden:props=>props.mode!=\"solid\"},startColor:{type:ControlType.Color,defaultValue:\"#000\",hidden:props=>props.mode!=\"gradient\"},endColor:{type:ControlType.Color,defaultValue:\"#FFF\",hidden:props=>props.mode!=\"gradient\"},angle:{type:ControlType.Number,defaultValue:180,min:-360,max:360,unit:\"\\xb0\",hidden:props=>props.mode!=\"gradient\"}}},font:{type:\"font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:16,lineHeight:1}},animation:{type:ControlType.Object,icon:\"effect\",controls:{trigger:{type:ControlType.Enum,defaultValue:\"layerInView\",options:[\"appear\",\"layerInView\"],optionTitles:[\"Appear\",\"Layer in View\"],displaySegmentedControl:true,segmentedControlDirection:\"vertical\"},replay:{type:ControlType.Boolean,defaultValue:true,hidden(props){return props.trigger!==\"layerInView\";}},transition:{type:ControlType.Transition}}},prefix:{type:ControlType.String},suffix:{type:ControlType.String},textSelect:{type:ControlType.Boolean,defaultValue:true},display:{type:ControlType.Object,buttonTitle:\"Options\",controls:{monospace:{type:ControlType.Boolean,defaultValue:false,description:\"Monospaced number characters.\"},slashedZeros:{type:ControlType.Boolean,defaultValue:false,description:\"Adds a diagonal slash through zeros if your font supports it.\"}}}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"NumberAnimator\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"any\",\"framerSupportedLayoutWidth\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./NumberAnimator.map"],"mappings":"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"}