{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/57StV1MQ4xnxFySEVbuw/KJLhbkF4OtdyDfMJ73ZN/ScrollProgress.js"],
  "sourcesContent": ["import{jsx as _jsx}from\"react/jsx-runtime\";import{useScroll,motion}from\"framer\";import{addPropertyControls,ControlType}from\"framer\";import{useEffect,useState}from\"react\";/**\n *\n * @framerDisableUnlink\n *\n */export function ScrollProgressBar(props){const{thickness,useGradient,gradientColors=[\"#894AFF\",\"#00ff00\"],multiColorMode,multiColors=[\"#894AFF\",\"#00ff00\",\"#0000ff\",\"#64C57D\",\"#FFC229\"],solidColor=\"#aefa1d\"}=props;// Hook to track scroll progress\nconst{scrollYProgress}=useScroll();// State for current scroll progress\nconst[progress,setProgress]=useState(0);useEffect(()=>{const unsubscribe=scrollYProgress.onChange(latest=>{setProgress(latest*100)// Convert progress to percentage\n;});return()=>unsubscribe();},[scrollYProgress]);let backgroundStyle;if(multiColorMode){// Multi-color segmented logic\nconst numColors=multiColors.filter(Boolean).length// Ensure only valid colors are counted\n;const segmentSize=100/numColors// Percentage range per color\n;const background=multiColors.filter(Boolean).map((color,index)=>{const segmentStart=index*segmentSize;const segmentEnd=(index+1)*segmentSize;// If progress is beyond this segment, the color is fully revealed\nif(progress>=segmentEnd){return`${color} ${segmentStart}%, ${color} ${segmentEnd}%`;}// If progress is within this segment, progressively reveal the color\nif(progress>segmentStart){return`${color} ${segmentStart}%, ${color} ${progress}%, transparent ${progress}%, transparent ${segmentEnd}%`;}// For segments beyond the current progress, keep them transparent\nreturn`transparent ${segmentStart}%, transparent ${segmentEnd}%`;}).join(\", \");backgroundStyle={background:`linear-gradient(to right, ${background})`};}else if(useGradient){// Gradient background\nbackgroundStyle={background:`linear-gradient(to right, ${gradientColors.filter(Boolean).join(\", \")})`};}else{// Default solid color\nbackgroundStyle={background:solidColor};}return /*#__PURE__*/_jsx(motion.div,{style:{position:\"fixed\",top:0,left:0,height:thickness,width:\"100%\",transformOrigin:\"0% 0%\",scaleX:scrollYProgress,zIndex:9999,...backgroundStyle}});}// Property controls for customization\naddPropertyControls(ScrollProgressBar,{thickness:{type:ControlType.Number,title:\"Thickness\",min:1,max:100,defaultValue:4},useGradient:{type:ControlType.Boolean,title:\"Use Gradient\",defaultValue:false,hidden:props=>props.multiColorMode},gradientColors:{type:ControlType.Array,title:\"Gradient Colors\",propertyControl:{type:ControlType.Color},defaultValue:[\"#894AFF\",\"#FF9900\"],hidden:props=>!props.useGradient||props.multiColorMode},multiColorMode:{type:ControlType.Boolean,title:\"Multi-Color Mode\",defaultValue:false,hidden:props=>props.useGradient},multiColors:{type:ControlType.Array,title:\"Multi Colors\",propertyControl:{type:ControlType.Color},defaultValue:[\"#894AFF\",\"#FF9900\",\"#0000ff\",\"#64C57D\",\"#FFC229\"],hidden:props=>!props.multiColorMode||props.useGradient},solidColor:{type:ControlType.Color,title:\"Solid Color\",defaultValue:\"#aefa1d\",hidden:props=>props.useGradient||props.multiColorMode}});\nexport const __FramerMetadata__ = {\"exports\":{\"ScrollProgressBar\":{\"type\":\"reactComponent\",\"name\":\"ScrollProgressBar\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerDisableUnlink\":\"*\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ScrollProgress.map"],
  "mappings": "qHAIU,SAASA,EAAkBC,EAAM,CAAC,GAAK,CAAC,UAAAC,EAAU,YAAAC,EAAY,eAAAC,EAAe,CAAC,UAAU,SAAS,EAAE,eAAAC,EAAe,YAAAC,EAAY,CAAC,UAAU,UAAU,UAAU,UAAU,SAAS,EAAE,WAAAC,EAAW,SAAS,EAAEN,EAC7M,CAAC,gBAAAO,CAAe,EAAEC,EAAU,EAC5B,CAACC,EAASC,CAAW,EAAEC,EAAS,CAAC,EAAEC,EAAU,IAAI,CAAC,IAAMC,EAAYN,EAAgB,SAASO,GAAQ,CAACJ,EAAYI,EAAO,GAAG,CAChI,CAAC,EAAE,MAAM,IAAID,EAAY,CAAE,EAAE,CAACN,CAAe,CAAC,EAAE,IAAIQ,EAAgB,GAAGX,EAAe,CAEtF,IAAMY,EAAY,IADHX,EAAY,OAAO,OAAO,EAAE,OAKmCU,EAAgB,CAAC,WAAW,6BAHzFV,EAAY,OAAO,OAAO,EAAE,IAAI,CAACY,EAAMC,IAAQ,CAAC,IAAMC,EAAaD,EAAMF,EAAkBI,GAAYF,EAAM,GAAGF,EAClI,OAAGP,GAAUW,EAAkB,GAAGH,CAAK,IAAIE,CAAY,MAAMF,CAAK,IAAIG,CAAU,IAC7EX,EAASU,EAAoB,GAAGF,CAAK,IAAIE,CAAY,MAAMF,CAAK,IAAIR,CAAQ,kBAAkBA,CAAQ,kBAAkBW,CAAU,IAC/H,eAAeD,CAAY,kBAAkBC,CAAU,GAAI,CAAC,EAAE,KAAK,IAAI,CAAqE,GAAG,CAAE,MAASlB,EAChKa,EAAgB,CAAC,WAAW,6BAA6BZ,EAAe,OAAO,OAAO,EAAE,KAAK,IAAI,CAAC,GAAG,EACrGY,EAAgB,CAAC,WAAWT,CAAU,EAAG,OAAoBe,EAAKC,EAAO,IAAI,CAAC,MAAM,CAAC,SAAS,QAAQ,IAAI,EAAE,KAAK,EAAE,OAAOrB,EAAU,MAAM,OAAO,gBAAgB,QAAQ,OAAOM,EAAgB,OAAO,KAAK,GAAGQ,CAAe,CAAC,CAAC,CAAE,CAClOQ,EAAoBxB,EAAkB,CAAC,UAAU,CAAC,KAAKyB,EAAY,OAAO,MAAM,YAAY,IAAI,EAAE,IAAI,IAAI,aAAa,CAAC,EAAE,YAAY,CAAC,KAAKA,EAAY,QAAQ,MAAM,eAAe,aAAa,GAAM,OAAOxB,GAAOA,EAAM,cAAc,EAAE,eAAe,CAAC,KAAKwB,EAAY,MAAM,MAAM,kBAAkB,gBAAgB,CAAC,KAAKA,EAAY,KAAK,EAAE,aAAa,CAAC,UAAU,SAAS,EAAE,OAAOxB,GAAO,CAACA,EAAM,aAAaA,EAAM,cAAc,EAAE,eAAe,CAAC,KAAKwB,EAAY,QAAQ,MAAM,mBAAmB,aAAa,GAAM,OAAOxB,GAAOA,EAAM,WAAW,EAAE,YAAY,CAAC,KAAKwB,EAAY,MAAM,MAAM,eAAe,gBAAgB,CAAC,KAAKA,EAAY,KAAK,EAAE,aAAa,CAAC,UAAU,UAAU,UAAU,UAAU,SAAS,EAAE,OAAOxB,GAAO,CAACA,EAAM,gBAAgBA,EAAM,WAAW,EAAE,WAAW,CAAC,KAAKwB,EAAY,MAAM,MAAM,cAAc,aAAa,UAAU,OAAOxB,GAAOA,EAAM,aAAaA,EAAM,cAAc,CAAC,CAAC",
  "names": ["ScrollProgressBar", "props", "thickness", "useGradient", "gradientColors", "multiColorMode", "multiColors", "solidColor", "scrollYProgress", "useScroll", "progress", "setProgress", "ye", "ue", "unsubscribe", "latest", "backgroundStyle", "segmentSize", "color", "index", "segmentStart", "segmentEnd", "p", "motion", "addPropertyControls", "ControlType"]
}