{
  "version": 3,
  "sources": ["ssg:https://framerusercontent.com/modules/rofp3mS0LNY15cjhHzia/38VAsjA9XQxFqtnMmScT/BlurGradient_Prod.js"],
  "sourcesContent": ["import{jsx as _jsx}from\"react/jsx-runtime\";import*as React from\"react\";import{motion}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";function useSmoothValue(value,transition){const[smoothValue,setSmoothValue]=React.useState(value);const prevValue=React.useRef(value);React.useEffect(()=>{let animationFrame;const startTime=Date.now();const duration=transition.duration;const animate=()=>{const now=Date.now();const elapsed=(now-startTime)/1e3;const progress=Math.min(elapsed/duration,1);setSmoothValue(prevValue.current+(value-prevValue.current)*progress);if(progress<1){animationFrame=requestAnimationFrame(animate);}else{prevValue.current=value;}};animate();return()=>cancelAnimationFrame(animationFrame);},[value,transition]);return smoothValue;}/**\n * @framerDisableUnlink\n *\n * @framerIntrinsicWidth 240\n * @framerIntrinsicHeight 240\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */function BlurGradient({blur,borderRadius,direction,transition}){const smoothBlur=useSmoothValue(blur,transition);const getGradientDirection=direction=>{switch(direction){case\"toBottom\":return\"to bottom\";case\"toTop\":return\"to top\";case\"toLeft\":return\"to left\";case\"toRight\":return\"to right\";default:return\"to bottom\";}};const blurSteps=React.useMemo(()=>[{blur:`${smoothBlur/2/2/2/2/2/2/2}px`,gradient:`rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 12.5%, rgba(0, 0, 0, 1) 25%, rgba(0, 0, 0, 0) 37.5%`},{blur:`${smoothBlur/2/2/2/2/2/2}px`,gradient:`rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 1) 25%, rgba(0, 0, 0, 1) 37.5%, rgba(0, 0, 0, 0) 50%`},{blur:`${smoothBlur/2/2/2/2/2}px`,gradient:`rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 1) 37.5%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 0) 62.5%`},{blur:`${smoothBlur/2/2/2/2}px`,gradient:`rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 1) 62.5%, rgba(0, 0, 0, 0) 75%`},{blur:`${smoothBlur/2/2/2}px`,gradient:`rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 1) 62.5%, rgba(0, 0, 0, 1) 75%, rgba(0, 0, 0, 0) 87.5%`},{blur:`${smoothBlur/2/2}px`,gradient:`rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 1) 75%, rgba(0, 0, 0, 1) 87.5%, rgba(0, 0, 0, 0) 100%`},{blur:`${smoothBlur/2}px`,gradient:`rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 1) 87.5%, rgba(0, 0, 0, 1) 100%`},{blur:`${smoothBlur}px`,gradient:`rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 1) 100%`}],[smoothBlur]);return /*#__PURE__*/_jsx(\"div\",{style:{position:\"absolute\",inset:0,overflow:\"hidden\"},children:blurSteps.map((step,index)=>/*#__PURE__*/_jsx(motion.div,{style:{position:\"absolute\",inset:0,zIndex:index+1,backdropFilter:`blur(${step.blur})`,WebkitBackdropFilter:`blur(${step.blur})`,maskImage:`linear-gradient(${getGradientDirection(direction)}, ${step.gradient})`,WebkitMaskImage:`linear-gradient(${getGradientDirection(direction)}, ${step.gradient})`,borderRadius:borderRadius,pointerEvents:\"none\"},transition:transition},index))});}BlurGradient.defaultProps={blur:10,borderRadius:\"0px\",direction:\"toBottom\",transition:{duration:.3}};addPropertyControls(BlurGradient,{blur:{title:\"Blur\",type:ControlType.Number,defaultValue:10,min:0,max:100,step:1,description:\"Large blur values (10<) can impact performance.\"},borderRadius:{title:\"Radius\",type:ControlType.BorderRadius,defaultValue:\"0px\",description:\"Blur Gradient component's parent frame can't have border radius (it will break the component). If you need corner radius, apply it directly to the Blur Gradient component here.\"},direction:{title:\"Direction\",type:ControlType.SegmentedEnum,options:[\"toBottom\",\"toTop\",\"toLeft\",\"toRight\"],optionTitles:[\"\u2193\",\"\u2191\",\"\u2190\",\"\u2192\"],defaultValue:\"toBottom\"},transition:{type:ControlType.Transition,defaultValue:{duration:.3},title:\"Transition\",description:\"Control how the blur animates when used on hover states or any othe interaction.\\n\\nMore components at [Framer University](https://frameruni.link/cc).\"}});BlurGradient.displayName=\"Blur Gradient\";export default BlurGradient;\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"BlurGradient\",\"slots\":[],\"annotations\":{\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerIntrinsicHeight\":\"240\",\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\",\"framerDisableUnlink\":\"*\",\"framerIntrinsicWidth\":\"240\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./BlurGradient_Prod.map"],
  "mappings": "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",
  "names": ["useSmoothValue", "value", "transition", "smoothValue", "setSmoothValue", "ye", "prevValue", "pe", "ue", "animationFrame", "startTime", "duration", "animate", "elapsed", "progress", "BlurGradient", "blur", "borderRadius", "direction", "smoothBlur", "getGradientDirection", "blurSteps", "se", "p", "step", "index", "motion", "addPropertyControls", "ControlType", "BlurGradient_Prod_default"]
}
