{"version":3,"file":"Count_UP.vHow-7Bh.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/UFm8FqbRWtO95QPwtUJM/bY9kcmKVj3EEL245DdsL/Count_UP.js"],"sourcesContent":["/**\n * @framerDisableUnlink\n * @framerIntrinsicWidth 220\n * @framerIntrinsicHeight 120\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight auto\n */import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{useEffect,useRef,useState}from\"react\";import{motion,useInView}from\"framer-motion\";function easeOutExpo(t){return t===1?1:1-Math.pow(2,-10*t);}function formatNumber(value,decimals,separator){const fixed=value.toFixed(decimals);if(!separator)return fixed;const[integer,decimal]=fixed.split(\".\");const formatted=integer.replace(/\\B(?=(\\d{3})+(?!\\d))/g,\",\");return decimal!==undefined?`${formatted}.${decimal}`:formatted;}const FONT_VARIANTS={\"System Default\":\"-apple-system, BlinkMacSystemFont, sans-serif\",\"DM Sans\":\"'DM Sans', sans-serif\",Inter:\"'Inter', sans-serif\",Sora:\"'Sora', sans-serif\",Poppins:\"'Poppins', sans-serif\",Manrope:\"'Manrope', sans-serif\",\"Space Grotesk\":\"'Space Grotesk', sans-serif\",Outfit:\"'Outfit', sans-serif\",\"Plus Jakarta Sans\":\"'Plus Jakarta Sans', sans-serif\",Geist:\"'Geist', sans-serif\"};export default function NumberCounter(props){const{value,startValue,duration,decimals,prefix,suffix,showTopLabel,topLabel,topLabelColor,topLabelSize,topLabelWeight,showBottomLabel,bottomLabel,bottomLabelColor,bottomLabelSize,bottomLabelWeight,thousandSeparator,valueColor,fontSize,fontWeight,numberFont,labelFont,alignment,style}=props;// ── Key fix: detect canvas/thumbnail edit mode ──\nconst isCanvas=RenderTarget.current()===RenderTarget.canvas||RenderTarget.current()===RenderTarget.thumbnail;const ref=useRef(null);const isInView=useInView(ref,{once:true,margin:\"0px 0px -40px 0px\"});// On canvas: show final value immediately, no animation\n// On preview/live: animate from startValue\nconst[displayed,setDisplayed]=useState(isCanvas?value:startValue);const rafRef=useRef(null);const startTimeRef=useRef(null);useEffect(()=>{// On canvas: always sync to final value instantly, no animation\nif(isCanvas){setDisplayed(value);return;}// On preview/live: wait for scroll into view, then animate\nif(!isInView)return;const from=startValue;const to=value;const durationMs=duration*1e3;startTimeRef.current=null;const animate=timestamp=>{if(!startTimeRef.current)startTimeRef.current=timestamp;const elapsed=timestamp-startTimeRef.current;const progress=Math.min(elapsed/durationMs,1);setDisplayed(from+(to-from)*easeOutExpo(progress));if(progress<1){rafRef.current=requestAnimationFrame(animate);}else{setDisplayed(to);}};rafRef.current=requestAnimationFrame(animate);return()=>{if(rafRef.current)cancelAnimationFrame(rafRef.current);};},[isInView,isCanvas,value,startValue,duration]);const displayStr=`${prefix}${formatNumber(displayed,decimals,thousandSeparator)}${suffix}`;const resolvedNumberFont=FONT_VARIANTS[numberFont]||FONT_VARIANTS[\"DM Sans\"];const resolvedLabelFont=FONT_VARIANTS[labelFont]||FONT_VARIANTS[\"DM Sans\"];const alignMap={Left:\"flex-start\",Center:\"center\",Right:\"flex-end\"};const textAlignMap={Left:\"left\",Center:\"center\",Right:\"right\"};const alignItems=alignMap[alignment]||\"flex-start\";const textAlign=textAlignMap[alignment]||\"left\";return /*#__PURE__*/_jsxs(motion.div,{ref:ref,style:{...style,display:\"flex\",flexDirection:\"column\",gap:4,alignItems,fontFamily:resolvedLabelFont},// On canvas: no fade-in, show instantly\ninitial:{opacity:isCanvas?1:0,y:isCanvas?0:8},animate:{opacity:1,y:0},transition:isCanvas?{duration:0}:{duration:.45,ease:[.22,1,.36,1]},children:[showTopLabel&&topLabel&&/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:resolvedLabelFont,fontSize:topLabelSize,fontWeight:topLabelWeight,color:topLabelColor,letterSpacing:\"0.03em\",textTransform:\"uppercase\",lineHeight:1,textAlign},children:topLabel}),/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:resolvedNumberFont,fontSize,fontWeight,color:valueColor,lineHeight:1,fontVariantNumeric:\"tabular-nums\",letterSpacing:\"-0.02em\",textAlign},children:displayStr}),showBottomLabel&&bottomLabel&&/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:resolvedLabelFont,fontSize:bottomLabelSize,fontWeight:bottomLabelWeight,color:bottomLabelColor,letterSpacing:\"0.02em\",lineHeight:1.3,textAlign},children:bottomLabel})]});}NumberCounter.defaultProps={value:24850,startValue:0,duration:2,decimals:0,prefix:\"\",suffix:\"\",thousandSeparator:true,valueColor:\"#0f0f0f\",fontSize:40,fontWeight:700,numberFont:\"DM Sans\",labelFont:\"DM Sans\",alignment:\"Left\",showTopLabel:true,topLabel:\"Total Revenue\",topLabelColor:\"#9ca3af\",topLabelSize:11,topLabelWeight:500,showBottomLabel:true,bottomLabel:\"vs last month ↑ 12%\",bottomLabelColor:\"#6b7280\",bottomLabelSize:12,bottomLabelWeight:400};const fontOptions=Object.keys(FONT_VARIANTS);addPropertyControls(NumberCounter,{value:{type:ControlType.Number,title:\"Target Value\",defaultValue:24850,step:1},startValue:{type:ControlType.Number,title:\"Start From\",defaultValue:0,step:1,description:\"Animates from this number to the target.\"},duration:{type:ControlType.Number,title:\"Duration (s)\",defaultValue:2,min:.1,max:10,step:.1,unit:\"s\",displayStepper:true},decimals:{type:ControlType.Number,title:\"Decimals\",defaultValue:0,min:0,max:4,step:1,displayStepper:true},thousandSeparator:{type:ControlType.Boolean,title:\"1,000 Separator\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\"},prefix:{type:ControlType.String,title:\"Prefix\",defaultValue:\"\",placeholder:\"e.g. $\"},suffix:{type:ControlType.String,title:\"Suffix\",defaultValue:\"\",placeholder:\"e.g. %\"},valueColor:{type:ControlType.Color,title:\"Number Color\",defaultValue:\"#0f0f0f\"},fontSize:{type:ControlType.Number,title:\"Number Size\",defaultValue:40,min:12,max:120,step:1,unit:\"px\",displayStepper:true},fontWeight:{type:ControlType.Enum,title:\"Number Weight\",options:[300,400,500,600,700,800,900],optionTitles:[\"Light\",\"Regular\",\"Medium\",\"SemiBold\",\"Bold\",\"ExtraBold\",\"Black\"],defaultValue:700},numberFont:{type:ControlType.Enum,title:\"Number Font\",options:fontOptions,defaultValue:\"DM Sans\"},labelFont:{type:ControlType.Enum,title:\"Label Font\",options:fontOptions,defaultValue:\"DM Sans\"},alignment:{type:ControlType.Enum,title:\"Alignment\",options:[\"Left\",\"Center\",\"Right\"],defaultValue:\"Left\",displaySegmentedControl:true},showTopLabel:{type:ControlType.Boolean,title:\"Top Label\",defaultValue:true,enabledTitle:\"Show\",disabledTitle:\"Hide\"},topLabel:{type:ControlType.String,title:\"↑ Text\",defaultValue:\"Total Revenue\",hidden:props=>!props.showTopLabel},topLabelColor:{type:ControlType.Color,title:\"↑ Color\",defaultValue:\"#9ca3af\",hidden:props=>!props.showTopLabel},topLabelSize:{type:ControlType.Number,title:\"↑ Size\",defaultValue:11,min:8,max:32,step:1,unit:\"px\",displayStepper:true,hidden:props=>!props.showTopLabel},topLabelWeight:{type:ControlType.Enum,title:\"↑ Weight\",options:[300,400,500,600,700],optionTitles:[\"Light\",\"Regular\",\"Medium\",\"SemiBold\",\"Bold\"],defaultValue:500,hidden:props=>!props.showTopLabel},showBottomLabel:{type:ControlType.Boolean,title:\"Bottom Label\",defaultValue:true,enabledTitle:\"Show\",disabledTitle:\"Hide\"},bottomLabel:{type:ControlType.String,title:\"↓ Text\",defaultValue:\"vs last month ↑ 12%\",hidden:props=>!props.showBottomLabel},bottomLabelColor:{type:ControlType.Color,title:\"↓ Color\",defaultValue:\"#6b7280\",hidden:props=>!props.showBottomLabel},bottomLabelSize:{type:ControlType.Number,title:\"↓ Size\",defaultValue:12,min:8,max:32,step:1,unit:\"px\",displayStepper:true,hidden:props=>!props.showBottomLabel},bottomLabelWeight:{type:ControlType.Enum,title:\"↓ Weight\",options:[300,400,500,600,700],optionTitles:[\"Light\",\"Regular\",\"Medium\",\"SemiBold\",\"Bold\"],defaultValue:400,hidden:props=>!props.showBottomLabel}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"NumberCounter\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Count_UP.map"],"mappings":"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"}