{"version":3,"file":"CircularScrollprogress.DNvbRfap.mjs","names":["React.useId"],"sources":["https:/framerusercontent.com/modules/98QywUBnB7yeRTfxG0Ra/xA6tXIJDwWyVvJgqO3a5/CircularScrollprogress.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import*as React from\"react\";import{motion,useScroll,useSpring,useTransform}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";const defaultArrowUpIcon=`\n<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 256 256\"><rect width=\"256\" height=\"256\" fill=\"none\"/><line x1=\"128\" y1=\"216\" x2=\"128\" y2=\"40\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"16\"/><polyline points=\"56 112 128 40 200 112\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"16\"/></svg>\n`;/**\n * By Noman (https://framercrafts.com/)\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n *\n * @framerDisableUnlink\n\n */export default function CircularScrollProgress(props){const{backgroundColor,progressColorStart,progressColorEnd,size,thickness,springConfig,reverse,useGradient,isScrollToTopButton,icon,iconColor,iconVisiblePercentage}=props;const{scrollYProgress}=useScroll();const progress=useSpring(scrollYProgress,springConfig);const range=reverse?[1,0]:[0,1];const progressValue=useTransform(progress,range,[0,1]);const center=50;const radius=45-thickness/2;const circumference=2*Math.PI*radius;const handleClick=()=>{if(isScrollToTopButton){window.scrollTo({top:0,behavior:\"smooth\"});}};const gradientId=React.useId();const iconToUse=icon||`data:image/svg+xml;charset=utf-8,${encodeURIComponent(defaultArrowUpIcon.replace(/currentColor/g,iconColor))}`;return /*#__PURE__*/_jsxs(\"div\",{style:{width:size,height:size,cursor:isScrollToTopButton?\"pointer\":\"default\"},onClick:handleClick,children:[/*#__PURE__*/_jsxs(\"svg\",{width:\"100%\",height:\"100%\",viewBox:\"0 0 100 100\",style:{transform:\"rotate(-90deg)\"},children:[useGradient&&/*#__PURE__*/_jsx(\"defs\",{children:/*#__PURE__*/_jsxs(\"linearGradient\",{id:gradientId,x1:\"0%\",y1:\"0%\",x2:\"100%\",y2:\"0%\",children:[/*#__PURE__*/_jsx(\"stop\",{offset:\"0%\",stopColor:progressColorStart}),/*#__PURE__*/_jsx(\"stop\",{offset:\"100%\",stopColor:progressColorEnd})]})}),/*#__PURE__*/_jsx(\"circle\",{cx:center,cy:center,r:radius,fill:\"none\",stroke:backgroundColor,strokeWidth:thickness}),/*#__PURE__*/_jsx(motion.circle,{cx:center,cy:center,r:radius,fill:\"none\",stroke:useGradient?`url(#${gradientId})`:progressColorStart,strokeWidth:thickness,strokeDasharray:circumference,strokeDashoffset:useTransform(progressValue,value=>circumference*(1-value)),strokeLinecap:\"round\"})]}),isScrollToTopButton&&/*#__PURE__*/_jsx(motion.div,{style:{position:\"absolute\",top:\"50%\",left:\"50%\",transform:\"translate(-50%, -50%)\",opacity:useTransform(progressValue,[0,iconVisiblePercentage/100],[0,1])},children:/*#__PURE__*/_jsx(\"img\",{src:iconToUse,alt:\"Scroll to top\",style:{width:size/2,height:size/2}})})]});}CircularScrollProgress.defaultProps={backgroundColor:\"#e0e0e0\",progressColorStart:\"#000000\",progressColorEnd:\"#00000\",size:100,thickness:4,springConfig:{stiffness:100,damping:30},reverse:false,useGradient:false,isScrollToTopButton:false,icon:null,iconColor:\"#ffffff\",iconVisiblePercentage:50};addPropertyControls(CircularScrollProgress,{backgroundColor:{type:ControlType.Color,title:\"Background Color\"},useGradient:{type:ControlType.Boolean,title:\"Use Gradient\"},progressColorStart:{type:ControlType.Color,title:\"Progress Color Start\"},progressColorEnd:{type:ControlType.Color,title:\"Progress Color End\",hidden:props=>!props.useGradient},size:{type:ControlType.Number,title:\"Size\",min:50,max:500,step:1,displayStepper:true},thickness:{type:ControlType.Number,title:\"Thickness\",min:1,max:20,step:1,displayStepper:true},springConfig:{type:ControlType.Object,title:\"Spring\",controls:{stiffness:{type:ControlType.Number,title:\"Stiffness\",min:0,max:1e3,step:10},damping:{type:ControlType.Number,title:\"Damping\",min:0,max:100,step:1}}},reverse:{type:ControlType.Boolean,title:\"Reverse\"},isScrollToTopButton:{type:ControlType.Boolean,title:\"Scroll to Top Button\"},icon:{type:ControlType.Image,title:\"Custom Icon\",hidden:props=>!props.isScrollToTopButton},iconColor:{type:ControlType.Color,title:\"Icon Color\",hidden:props=>!props.isScrollToTopButton||props.icon!==null}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"CircularScrollProgress\",\"slots\":[],\"annotations\":{\"framerDisableUnlink\":\"\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any\",\"framerSupportedLayoutHeight\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./CircularScrollprogress.map"],"mappings":"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"}