{"version":3,"file":"ScrollProgress.DdYWweCG.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/bd6GTPnb9DvUxdRhIGei/qUkOirAfDNYOjO7rYnFQ/ScrollProgress.js"],"sourcesContent":["// Scroll progress component with percentage indicator that moves smoothly as user scrolls\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useState,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";import{motion,useSpring,useTransform}from\"framer-motion\";/**\n * Scroll Progress\n *\n * @framerIntrinsicWidth 1200\n * @framerIntrinsicHeight 80\n *\n * @framerSupportedLayoutWidth fixed\n * @framerSupportedLayoutHeight auto\n */export default function ScrollProgress(props){const{barHeight=4,barColor=\"#FF5733\",trackColor=\"#333333\",percentageColor=\"#FF5733\",showPercentage=true,labelText=\"SCROLL\",labelGap=8,labelColor=\"#FF5733\",labelFont,font,gap=12}=props;const[scrollProgress,setScrollProgress]=useState(0);const smoothProgress=useSpring(0,{stiffness:100,damping:30,restDelta:.001});useEffect(()=>{if(typeof window===\"undefined\")return;const handleScroll=()=>{const windowHeight=window.innerHeight;const documentHeight=document.documentElement.scrollHeight;const scrollTop=window.scrollY;const totalScrollableHeight=documentHeight-windowHeight;const progress=totalScrollableHeight>0?scrollTop/totalScrollableHeight*100:0;startTransition(()=>{setScrollProgress(Math.min(100,Math.max(0,progress)));});};handleScroll();window.addEventListener(\"scroll\",handleScroll,{passive:true});window.addEventListener(\"resize\",handleScroll,{passive:true});return()=>{window.removeEventListener(\"scroll\",handleScroll);window.removeEventListener(\"resize\",handleScroll);};},[]);useEffect(()=>{smoothProgress.set(scrollProgress);},[scrollProgress,smoothProgress]);const progressWidth=useTransform(smoothProgress,value=>`${value}%`);return /*#__PURE__*/_jsxs(\"div\",{style:{width:\"100%\",display:\"flex\",flexDirection:\"column\",justifyContent:\"center\",alignItems:\"flex-start\",gap:gap,position:\"relative\"},children:[showPercentage&&/*#__PURE__*/_jsxs(motion.div,{style:{width:\"100%\",display:\"flex\",alignItems:\"baseline\",justifyContent:\"space-between\"},children:[/*#__PURE__*/_jsxs(\"span\",{style:{color:percentageColor,...font||{}},children:[Math.round(scrollProgress),\"%\"]}),/*#__PURE__*/_jsx(\"span\",{style:{color:labelColor,...labelFont||{}},children:labelText})]}),/*#__PURE__*/_jsx(\"div\",{style:{width:\"100%\",height:barHeight,backgroundColor:trackColor,borderRadius:barHeight/2,overflow:\"hidden\"},children:/*#__PURE__*/_jsx(motion.div,{style:{height:\"100%\",backgroundColor:barColor,borderRadius:barHeight/2,width:progressWidth,transformOrigin:\"left center\"}})})]});}addPropertyControls(ScrollProgress,{showPercentage:{type:ControlType.Boolean,title:\"Show Percentage\",defaultValue:true,enabledTitle:\"Show\",disabledTitle:\"Hide\"},labelText:{type:ControlType.String,title:\"Label\",defaultValue:\"SCROLL\",hidden:({showPercentage})=>!showPercentage},labelGap:{type:ControlType.Number,title:\"Label Gap\",defaultValue:8,min:0,max:100,step:1,unit:\"px\",hidden:({showPercentage})=>!showPercentage},labelColor:{type:ControlType.Color,title:\"Label Color\",defaultValue:\"#FF5733\",hidden:({showPercentage})=>!showPercentage},labelFont:{type:ControlType.Font,title:\"Label Font\",defaultValue:{fontSize:\"14px\",variant:\"Semibold\",letterSpacing:\"-0.01em\",lineHeight:\"1em\"},controls:\"extended\",defaultFontType:\"sans-serif\",hidden:({showPercentage})=>!showPercentage},percentageColor:{type:ControlType.Color,title:\"Percentage Color\",defaultValue:\"#FF5733\",hidden:({showPercentage})=>!showPercentage},font:{type:ControlType.Font,title:\"Percentage Font\",defaultValue:{fontSize:\"32px\",variant:\"Semibold\",letterSpacing:\"-0.03em\",lineHeight:\"1em\"},controls:\"extended\",defaultFontType:\"sans-serif\",hidden:({showPercentage})=>!showPercentage},gap:{type:ControlType.Number,title:\"Gap\",defaultValue:12,min:0,max:100,step:1,unit:\"px\",hidden:({showPercentage})=>!showPercentage},barHeight:{type:ControlType.Number,title:\"Bar Height\",defaultValue:4,min:1,max:20,step:1,unit:\"px\"},barColor:{type:ControlType.Color,title:\"Bar Color\",defaultValue:\"#FF5733\"},trackColor:{type:ControlType.Color,title:\"Track Color\",defaultValue:\"#333333\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ScrollProgress\",\"slots\":[],\"annotations\":{\"framerIntrinsicHeight\":\"80\",\"framerIntrinsicWidth\":\"1200\",\"framerSupportedLayoutWidth\":\"fixed\",\"framerSupportedLayoutHeight\":\"auto\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ScrollProgress.map"],"mappings":"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"}