{"version":3,"file":"Counter.DcDPcbIO.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/i1DuX9u4NKLb6PrLkajP/ZeEQJa7Y3R6C5CoPfRYJ/Counter.js"],"sourcesContent":["// import React, { useState, useEffect, useRef } from \"react\"\n// import { motion } from \"framer-motion\"\n// import { addPropertyControls, ControlType } from \"framer\"\n// export function Counter({\n//     start = 0,\n//     end = 100,\n//     speed = 100,\n//     gapSize = 4,\n//     prefixText = \"\",\n//     suffixText = \"\",\n//     prefixFont,\n//     suffixFont,\n//     prefixColor,\n//     suffixColor,\n//     loop = false,\n//     decimalSeparatorType = \"comma\",\n//     textSize = 36,\n//     selectedFont = { fontFamily: \"Inter\", fontWeight: 500, systemFont: true },\n//     textColor = \"#D3D3D3\",\n//     startOnViewport = false,\n//     restartOnViewport = false,\n//     incrementType = \"integer\",\n// }) {\n//     const [count, setCount] = useState(start)\n//     const [isVisible, setIsVisible] = useState(false)\n//     const containerRef = useRef(null)\n//     useEffect(() => {\n//         const observer = new IntersectionObserver(([entry]) => {\n//             setIsVisible(entry.isIntersecting)\n//         })\n//         if (containerRef.current) observer.observe(containerRef.current)\n//         return () => observer.disconnect()\n//     }, [])\n//     useEffect(() => {\n//         if (!(isVisible || !startOnViewport) || start === end) return\n//         const increment = incrementType === \"integer\" ? 1 : 0.1\n//         const intervalId = setInterval(() => {\n//             setCount((prev) =>\n//                 prev + increment >= end\n//                     ? end\n//                     : parseFloat((prev + increment).toFixed(2))\n//             )\n//         }, speed)\n//         return () => clearInterval(intervalId)\n//     }, [isVisible, start, end, speed, startOnViewport, incrementType])\n//     useEffect(() => {\n//         if (restartOnViewport && isVisible) setCount(start)\n//     }, [isVisible, restartOnViewport, start])\n//     const formatNumber = (number) => {\n//         if (decimalSeparatorType === \"comma\")\n//             return number.toLocaleString(\"en-US\")\n//         if (decimalSeparatorType === \"period\")\n//             return number.toLocaleString(\"en-US\").replace(/,/g, \".\")\n//         return number.toFixed(incrementType === \"integer\" ? 0 : 1)\n//     }\n//     return (\n//         <motion.div\n//             ref={containerRef}\n//             style={{\n//                 display: \"flex\",\n//                 gap: `${gapSize}px`,\n//                 alignItems: \"center\",\n//                 fontSize: `${textSize}px`,\n//                 fontFamily: selectedFont.fontFamily,\n//                 fontWeight: selectedFont.fontWeight,\n//                 color: textColor,\n//                 letterSpacing: \"-0.07em\",\n//             }}\n//         >\n//             {prefixText && (\n//                 <span\n//                     style={{\n//                         fontFamily: prefixFont?.fontFamily,\n//                         fontWeight: prefixFont?.fontWeight,\n//                         color: prefixColor,\n//                     }}\n//                 >\n//                     {prefixText}\n//                 </span>\n//             )}\n//             <span>{formatNumber(count)}</span>\n//             {suffixText && (\n//                 <span\n//                     style={{\n//                         fontFamily: suffixFont?.fontFamily,\n//                         fontWeight: suffixFont?.fontWeight,\n//                         color: suffixColor,\n//                     }}\n//                 >\n//                     {suffixText}\n//                 </span>\n//             )}\n//         </motion.div>\n//     )\n// }\n// addPropertyControls(Counter, {\n//     startOnViewport: {\n//         type: ControlType.Boolean,\n//         title: \"Viewport\",\n//         defaultValue: false,\n//     },\n//     restartOnViewport: {\n//         type: ControlType.Boolean,\n//         title: \"Replay\",\n//         defaultValue: false,\n//     },\n//     selectedFont: {\n//         title: \"Font\",\n//         type: ControlType.Font,\n//         defaultValue: {\n//             fontFamily: \"Inter\",\n//             fontWeight: 500,\n//             systemFont: true,\n//         },\n//     },\n//     textSize: {\n//         title: \"Font Size\",\n//         type: ControlType.Number,\n//         min: 8,\n//         max: 240,\n//         step: 1,\n//     },\n//     textColor: { type: ControlType.Color, title: \"Font Color\" },\n//     start: { type: ControlType.Number, title: \"Start Number\", defaultValue: 0 },\n//     end: { type: ControlType.Number, title: \"End Number\", defaultValue: 10 },\n//     decimalSeparatorType: {\n//         type: ControlType.Enum,\n//         title: \"Separator\",\n//         defaultValue: \"comma\",\n//         options: [\"comma\", \"period\", \"none\"],\n//     },\n//     incrementType: {\n//         type: ControlType.Enum,\n//         title: \"Increment Type\",\n//         defaultValue: \"integer\",\n//         options: [\"integer\", \"decimal\"],\n//     },\n//     prefixText: { type: ControlType.String, title: \"Prefix\", defaultValue: \"\" },\n//     prefixFont: { title: \"Prefix Font\", type: ControlType.Font },\n//     prefixColor: { type: ControlType.Color, title: \"Prefix Color\" },\n//     suffixText: { type: ControlType.String, title: \"Suffix\", defaultValue: \"\" },\n//     suffixFont: { title: \"Suffix Font\", type: ControlType.Font },\n//     suffixColor: { type: ControlType.Color, title: \"Suffix Color\" },\n//     gapSize: {\n//         type: ControlType.Number,\n//         title: \"Gap Size\",\n//         defaultValue: 4,\n//         min: 0,\n//         max: 100,\n//     },\n//     speed: {\n//         type: ControlType.Number,\n//         title: \"Speed (ms)\",\n//         defaultValue: 100,\n//         min: 0,\n//         max: 2000,\n//     },\n//     loop: {\n//         type: ControlType.Boolean,\n//         title: \"Loop Animation\",\n//         defaultValue: false,\n//     },\n// })\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useState,useEffect,useRef}from\"react\";import{motion}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";export function Counter({start=0,end=100,speed=100,gapSize=4,prefixText=\"\",suffixText=\"\",suffixText2=\"\",prefixFont,suffixFont,suffixFont2,prefixColor,suffixColor,suffixColor2,suffixInnerGap=4,loop=false,decimalSeparatorType=\"comma\",textSize=36,selectedFont={fontFamily:\"Inter\",fontWeight:500,systemFont:true},textColor=\"#D3D3D3\",startOnViewport=false,restartOnViewport=false,incrementType=\"integer\"}){const[count,setCount]=useState(start);const[isVisible,setIsVisible]=useState(false);const containerRef=useRef(null);useEffect(()=>{const observer=new IntersectionObserver(([entry])=>{setIsVisible(entry.isIntersecting);});if(containerRef.current)observer.observe(containerRef.current);return()=>observer.disconnect();},[]);useEffect(()=>{if(!(isVisible||!startOnViewport))return;const isInteger=incrementType===\"integer\";const increment=isInteger?1:.1;let current=start;setCount(current);const id=setInterval(()=>{current=parseFloat((current+increment).toFixed(isInteger?0:2));if(current>=end){current=end;setCount(current);if(loop){// brief snap then restart\nsetTimeout(()=>{current=start;setCount(current);},50);}else{clearInterval(id);}}else{setCount(current);}},speed);return()=>clearInterval(id);},[isVisible,startOnViewport,start,end,speed,incrementType,loop]);useEffect(()=>{if(restartOnViewport&&isVisible)setCount(start);},[isVisible,restartOnViewport,start]);const formatNumber=number=>{if(decimalSeparatorType===\"comma\")return number.toLocaleString(\"en-US\");if(decimalSeparatorType===\"period\")return number.toLocaleString(\"en-US\").replace(/,/g,\".\");// \"none\"\nreturn number.toFixed(incrementType===\"integer\"?0:1);};const textBase={fontSize:`${textSize}px`,fontFamily:selectedFont.fontFamily,fontWeight:selectedFont.fontWeight,color:textColor,letterSpacing:\"-0.07em\"};return /*#__PURE__*/_jsxs(motion.div,{ref:containerRef,style:{display:\"flex\",gap:`${gapSize}px`,alignItems:\"center\",...textBase},children:[prefixText?/*#__PURE__*/_jsx(\"span\",{style:{fontFamily:prefixFont?.fontFamily??selectedFont.fontFamily,fontWeight:prefixFont?.fontWeight??selectedFont.fontWeight,color:prefixColor??textColor},children:prefixText}):null,/*#__PURE__*/_jsx(\"span\",{children:formatNumber(count)}),suffixText?/*#__PURE__*/_jsx(\"span\",{style:{marginLeft:suffixText2?`${suffixInnerGap}px`:0,fontFamily:suffixFont?.fontFamily??selectedFont.fontFamily,fontWeight:suffixFont?.fontWeight??selectedFont.fontWeight,color:suffixColor??textColor},children:suffixText}):null,suffixText2?/*#__PURE__*/_jsx(\"span\",{style:{marginLeft:suffixText?`${suffixInnerGap}px`:0,fontFamily:suffixFont2?.fontFamily??selectedFont.fontFamily,fontWeight:suffixFont2?.fontWeight??selectedFont.fontWeight,color:suffixColor2??textColor},children:suffixText2}):null]});}addPropertyControls(Counter,{startOnViewport:{type:ControlType.Boolean,title:\"Viewport\",defaultValue:false},restartOnViewport:{type:ControlType.Boolean,title:\"Replay\",defaultValue:false},selectedFont:{title:\"Font\",type:ControlType.Font,defaultValue:{fontFamily:\"Inter\",fontWeight:500,systemFont:true}},textSize:{title:\"Font Size\",type:ControlType.Number,min:8,max:240,step:1},textColor:{type:ControlType.Color,title:\"Font Color\"},start:{type:ControlType.Number,title:\"Start Number\",defaultValue:0},end:{type:ControlType.Number,title:\"End Number\",defaultValue:10},decimalSeparatorType:{type:ControlType.Enum,title:\"Separator\",defaultValue:\"comma\",options:[\"comma\",\"period\",\"none\"]},incrementType:{type:ControlType.Enum,title:\"Increment\",defaultValue:\"integer\",options:[\"integer\",\"decimal\"]},prefixText:{type:ControlType.String,title:\"Prefix\",defaultValue:\"\"},prefixFont:{title:\"Prefix Font\",type:ControlType.Font},prefixColor:{type:ControlType.Color,title:\"Prefix Color\"},suffixText:{type:ControlType.String,title:\"Suffix #1\",defaultValue:\"\"},suffixFont:{title:\"Suffix #1 Font\",type:ControlType.Font},suffixColor:{type:ControlType.Color,title:\"Suffix #1 Color\"},suffixText2:{type:ControlType.String,title:\"Suffix #2\",defaultValue:\"\"},suffixFont2:{title:\"Suffix #2 Font\",type:ControlType.Font},suffixColor2:{type:ControlType.Color,title:\"Suffix #2 Color\"},suffixInnerGap:{type:ControlType.Number,title:\"Suffix Gap\",defaultValue:4,min:0,max:40},gapSize:{type:ControlType.Number,title:\"Group Gap\",defaultValue:4,min:0,max:100},speed:{type:ControlType.Number,title:\"Speed (ms)\",defaultValue:100,min:0,max:2e3},loop:{type:ControlType.Boolean,title:\"Loop\",defaultValue:false}});\nexport const __FramerMetadata__ = {\"exports\":{\"Counter\":{\"type\":\"reactComponent\",\"name\":\"Counter\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Counter.map"],"mappings":"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"}