{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/QFkVHF9O7PgICwULYIDA/cQ5RVvUTE0pwl8Kf0Odv/ScrollProgressBar.js"],
  "sourcesContent": ["// Scroll Progress Bar with customizable colors and radius\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useState,useRef,startTransition}from\"react\";import{addPropertyControls,ControlType}from\"framer\";/**\n * Scroll Progress Bar\n *\n * @framerIntrinsicWidth 600\n * @framerIntrinsicHeight 8\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight fixed\n */export default function ScrollProgressBar(props){const{backgroundColor,fillColor,height,borderRadius,style}=props;const[progress,setProgress]=useState(0);const ticking=useRef(false);useEffect(()=>{function updateProgress(){if(typeof window===\"undefined\"||typeof document===\"undefined\")return;const scrollTop=window.scrollY||document.documentElement.scrollTop;const docHeight=document.documentElement.scrollHeight-window.innerHeight;const percent=docHeight>0?Math.min(1,Math.max(0,scrollTop/docHeight)):0;startTransition(()=>setProgress(percent));ticking.current=false;}function onScroll(){if(!ticking.current){window.requestAnimationFrame(updateProgress);ticking.current=true;}}window.addEventListener(\"scroll\",onScroll,{passive:true});updateProgress();return()=>window.removeEventListener(\"scroll\",onScroll);},[]);return /*#__PURE__*/_jsx(\"div\",{style:{...style,width:\"100%\",height,background:backgroundColor,borderRadius,overflow:\"hidden\",position:\"relative\"},children:/*#__PURE__*/_jsx(\"div\",{style:{height:\"100%\",width:`${progress*100}%`,background:fillColor,borderRadius,transition:\"width 0.15s cubic-bezier(.4,1,.4,1)\",position:\"absolute\",left:0,top:0},\"aria-valuenow\":Math.round(progress*100),\"aria-valuemin\":0,\"aria-valuemax\":100,role:\"progressbar\"})});}addPropertyControls(ScrollProgressBar,{backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#EEEEEE\"},fillColor:{type:ControlType.Color,title:\"Fill Color\",defaultValue:\"#0099FF\"},height:{type:ControlType.Number,title:\"Height\",defaultValue:8,min:2,max:32,unit:\"px\"},borderRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:8,min:0,max:32,unit:\"px\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ScrollProgressBar\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerIntrinsicWidth\":\"600\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerIntrinsicHeight\":\"8\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ScrollProgressBar.map"],
  "mappings": "8JASkB,SAARA,EAAmCC,EAAM,CAAC,GAAK,CAAC,gBAAAC,EAAgB,UAAAC,EAAU,OAAAC,EAAO,aAAAC,EAAa,MAAAC,CAAK,EAAEL,EAAW,CAACM,EAASC,CAAW,EAAEC,EAAS,CAAC,EAAQC,EAAQC,EAAO,EAAK,EAAE,OAAAC,EAAU,IAAI,CAAC,SAASC,GAAgB,CAAC,GAAG,OAAOC,EAAS,KAAa,OAAO,SAAW,IAAY,OAAO,IAAMC,EAAUD,EAAO,SAAS,SAAS,gBAAgB,UAAgBE,EAAU,SAAS,gBAAgB,aAAaF,EAAO,YAAkBG,EAAQD,EAAU,EAAE,KAAK,IAAI,EAAE,KAAK,IAAI,EAAED,EAAUC,CAAS,CAAC,EAAE,EAAEE,EAAgB,IAAIV,EAAYS,CAAO,CAAC,EAAEP,EAAQ,QAAQ,EAAM,CAAC,SAASS,GAAU,CAAKT,EAAQ,UAASI,EAAO,sBAAsBD,CAAc,EAAEH,EAAQ,QAAQ,GAAM,CAAC,OAAAI,EAAO,iBAAiB,SAASK,EAAS,CAAC,QAAQ,EAAI,CAAC,EAAEN,EAAe,EAAQ,IAAIC,EAAO,oBAAoB,SAASK,CAAQ,CAAE,EAAE,CAAC,CAAC,EAAsBC,EAAK,MAAM,CAAC,MAAM,CAAC,GAAGd,EAAM,MAAM,OAAO,OAAAF,EAAO,WAAWF,EAAgB,aAAAG,EAAa,SAAS,SAAS,SAAS,UAAU,EAAE,SAAsBe,EAAK,MAAM,CAAC,MAAM,CAAC,OAAO,OAAO,MAAM,GAAGb,EAAS,GAAG,IAAI,WAAWJ,EAAU,aAAAE,EAAa,WAAW,sCAAsC,SAAS,WAAW,KAAK,EAAE,IAAI,CAAC,EAAE,gBAAgB,KAAK,MAAME,EAAS,GAAG,EAAE,gBAAgB,EAAE,gBAAgB,IAAI,KAAK,aAAa,CAAC,CAAC,CAAC,CAAE,CAACc,EAAoBrB,EAAkB,CAAC,gBAAgB,CAAC,KAAKsB,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,EAAE,UAAU,CAAC,KAAKA,EAAY,MAAM,MAAM,aAAa,aAAa,SAAS,EAAE,OAAO,CAAC,KAAKA,EAAY,OAAO,MAAM,SAAS,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,IAAI,EAAE,aAAa,CAAC,KAAKA,EAAY,OAAO,MAAM,SAAS,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,IAAI,CAAC,CAAC",
  "names": ["ScrollProgressBar", "props", "backgroundColor", "fillColor", "height", "borderRadius", "style", "progress", "setProgress", "ye", "ticking", "pe", "ue", "updateProgress", "window", "scrollTop", "docHeight", "percent", "Z", "onScroll", "p", "addPropertyControls", "ControlType"]
}