{"version":3,"file":"ScrollProgressBar.DoOSQLhy.mjs","names":["useState"],"sources":["https:/framerusercontent.com/modules/JevAyI4XXtedzQdujINM/6zR3S0v4dfLNyWR3PZHc/ScrollProgressBar.js"],"sourcesContent":["// Simple scroll progress bar with customizable colors and radius\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{useEffect,useState,startTransition}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";/**\n * Scroll Progress Bar\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight fixed\n */export default function ScrollProgressBar(props){const{backgroundColor,progressColor,borderRadius,height,style}=props;const[progress,setProgress]=useState(0);const isStatic=useIsStaticRenderer();useEffect(()=>{if(isStatic)return;function onScroll(){const scrollTop=window.scrollY||window.pageYOffset;const docHeight=document.documentElement.scrollHeight-window.innerHeight;const percent=docHeight>0?Math.min(1,Math.max(0,scrollTop/docHeight)):0;startTransition(()=>setProgress(percent));}window.addEventListener(\"scroll\",onScroll,{passive:true});onScroll();return()=>window.removeEventListener(\"scroll\",onScroll);},[isStatic]);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:progressColor,borderRadius,transition:\"width 0.2s cubic-bezier(.4,1,.4,1)\"},\"aria-valuenow\":Math.round(progress*100),\"aria-valuemin\":0,\"aria-valuemax\":100,role:\"progressbar\"})});}addPropertyControls(ScrollProgressBar,{backgroundColor:{type:ControlType.Color,title:\"Background\",defaultValue:\"#EEEEEE\"},progressColor:{type:ControlType.Color,title:\"Progress\",defaultValue:\"#0099FF\"},borderRadius:{type:ControlType.Number,title:\"Radius\",defaultValue:8,min:0,max:32},height:{type:ControlType.Number,title:\"Height\",defaultValue:8,min:2,max:32,unit:\"px\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"ScrollProgressBar\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"fixed\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ScrollProgressBar.map"],"mappings":"8MAMG,SAAwB,EAAkB,EAAM,CAAC,GAAK,CAAC,kBAAgB,gBAAc,eAAa,SAAO,SAAO,EAAW,CAAC,EAAS,GAAaA,EAAS,EAAE,CAAO,EAAS,GAAqB,CAAib,OAAhb,MAAc,CAAC,GAAG,EAAS,OAAO,SAAS,GAAU,CAAC,IAAM,EAAU,EAAO,SAAS,EAAO,YAAkB,EAAU,SAAS,gBAAgB,aAAa,EAAO,YAAkB,EAAQ,EAAU,EAAE,KAAK,IAAI,EAAE,KAAK,IAAI,EAAE,EAAU,EAAU,CAAC,CAAC,EAAE,MAAoB,EAAY,EAAQ,CAAC,CAAuE,OAArE,EAAO,iBAAiB,SAAS,EAAS,CAAC,QAAQ,GAAK,CAAC,CAAC,GAAU,KAAW,EAAO,oBAAoB,SAAS,EAAS,EAAG,CAAC,EAAS,CAAC,CAAqB,EAAK,MAAM,CAAC,MAAM,CAAC,GAAG,EAAM,MAAM,OAAO,SAAO,WAAW,EAAgB,eAAa,SAAS,SAAS,SAAS,WAAW,CAAC,SAAsB,EAAK,MAAM,CAAC,MAAM,CAAC,OAAO,OAAO,MAAM,GAAG,EAAS,IAAI,GAAG,WAAW,EAAc,eAAa,WAAW,qCAAqC,CAAC,gBAAgB,KAAK,MAAM,EAAS,IAAI,CAAC,gBAAgB,EAAE,gBAAgB,IAAI,KAAK,cAAc,CAAC,CAAC,CAAC,sBAL1+B,IAAsD,IAAwE,CAK82B,EAAoB,EAAkB,CAAC,gBAAgB,CAAC,KAAK,EAAY,MAAM,MAAM,aAAa,aAAa,UAAU,CAAC,cAAc,CAAC,KAAK,EAAY,MAAM,MAAM,WAAW,aAAa,UAAU,CAAC,aAAa,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,CAAC,OAAO,CAAC,KAAK,EAAY,OAAO,MAAM,SAAS,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,KAAK,CAAC,CAAC"}