{"version":3,"file":"Animated_Text_Gradient_02.CDbb4qMA.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/Rd2QJWmtOqmIxWjlNGQE/XATTLFI5JMkv6HLEX7uI/Animated_Text_Gradient_02.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{useState,useEffect,useRef}from\"react\";export default function AnimatedGradientText(props){// Default props with Framer property controls\nconst{text=\"Beautiful Gradient Text\",fontSize=48,fontFamily=\"Inter\",fontWeight=\"200\",letterSpacing=\"-0.02em\",lineHeight=1.2,textAlign=\"center\",// Gradient colors (up to 5 colors)\ncolor1=\"#ff6b6b\",color2=\"#4ecdc4\",color3=\"#45b7d1\",color4=\"#96ceb4\",color5=\"#feca57\",useColor3=true,useColor4=false,useColor5=false,// Animation settings\nanimateOnViewport=true,animationSpeed=6,gradientDirection=45,gradientSize=200,// Advanced settings\npauseOnHover=false}=props;const[isVisible,setIsVisible]=useState(false);const[gradientPosition,setGradientPosition]=useState(0);const[isPaused,setIsPaused]=useState(false);const textRef=useRef(null);const animationRef=useRef(null);// Build gradient colors array\nconst gradientColors=[color1,color2];if(useColor3)gradientColors.push(color3);if(useColor4)gradientColors.push(color4);if(useColor5)gradientColors.push(color5);// Intersection Observer for viewport detection\nuseEffect(()=>{if(!animateOnViewport){setIsVisible(true);return;}const observer=new IntersectionObserver(([entry])=>{setIsVisible(entry.isIntersecting);},{threshold:.1});if(textRef.current){observer.observe(textRef.current);}return()=>{if(textRef.current){observer.unobserve(textRef.current);}};},[animateOnViewport]);// Gradient animation\nuseEffect(()=>{if(!isVisible||isPaused){if(animationRef.current){cancelAnimationFrame(animationRef.current);}return;}let startTime=null;const animate=currentTime=>{if(startTime===null)startTime=currentTime;const elapsed=currentTime-startTime;const progress=elapsed/(animationSpeed*1e3)%1;// Create smooth cyclical movement\nconst position=Math.sin(progress*Math.PI*2)*50;setGradientPosition(position);animationRef.current=requestAnimationFrame(animate);};animationRef.current=requestAnimationFrame(animate);return()=>{if(animationRef.current){cancelAnimationFrame(animationRef.current);}};},[isVisible,animationSpeed,isPaused]);// Create gradient CSS\nconst createGradient=()=>{const colorStops=gradientColors.map((color,index)=>{const position=index/(gradientColors.length-1)*100;return`${color} ${position}%`;}).join(\", \");return`linear-gradient(${gradientDirection}deg, ${colorStops})`;};// Handle mouse events for pause on hover\nconst handleMouseEnter=()=>{if(pauseOnHover){setIsPaused(true);}};const handleMouseLeave=()=>{if(pauseOnHover){setIsPaused(false);}};// Component styles\nconst containerStyle={display:\"inline-block\",position:\"relative\",textAlign:textAlign,width:textAlign===\"center\"?\"100%\":\"auto\"};const textStyle={fontSize:`${fontSize}px`,fontFamily:fontFamily,fontWeight:fontWeight,letterSpacing:letterSpacing,lineHeight:lineHeight,margin:0,padding:0,background:createGradient(),backgroundSize:`${gradientSize}% ${gradientSize}%`,backgroundPosition:`${50+gradientPosition}% ${50+gradientPosition}%`,backgroundClip:\"text\",WebkitBackgroundClip:\"text\",color:\"transparent\",display:\"inline-block\",transition:animateOnViewport&&!isVisible?\"opacity 0.6s ease-out\":\"none\",opacity:animateOnViewport?isVisible?1:.2:1,cursor:pauseOnHover?\"pointer\":\"default\"};return /*#__PURE__*/_jsx(\"div\",{ref:textRef,style:containerStyle,onMouseEnter:handleMouseEnter,onMouseLeave:handleMouseLeave,children:/*#__PURE__*/_jsx(\"div\",{style:textStyle,children:text})});}// Property Controls for Framer\nAnimatedGradientText.defaultProps={text:\"Beautiful Gradient Text\",fontSize:48,fontFamily:\"Inter\",fontWeight:\"550\",letterSpacing:\"-0.02em\",lineHeight:1.2,textAlign:\"center\",color1:\"#ff6b6b\",color2:\"#4ecdc4\",color3:\"#45b7d1\",color4:\"#96ceb4\",color5:\"#feca57\",useColor3:true,useColor4:false,useColor5:false,animateOnViewport:true,animationSpeed:6,gradientDirection:45,gradientSize:200,pauseOnHover:false};// Property Controls for Framer\nAnimatedGradientText.propertyControls={// Text Properties\ntext:{type:\"string\",title:\"Text\",placeholder:\"Enter your text...\",defaultValue:\"Beautiful Gradient Text\"},// Typography\nfontSize:{type:\"number\",title:\"Font Size\",min:12,max:200,step:1,defaultValue:48,unit:\"px\",displayStepper:true},fontFamily:{type:\"font\",title:\"Font Family\"},letterSpacing:{type:\"enum\",title:\"Letter Spacing\",options:[\"-0.05em\",\"-0.02em\",\"0em\",\"0.02em\",\"0.05em\",\"0.1em\"],optionTitles:[\"Tighter\",\"Tight\",\"Normal\",\"Wide\",\"Wider\",\"Widest\"],defaultValue:\"-0.02em\"},lineHeight:{type:\"number\",title:\"Line Height\",min:.8,max:2.5,step:.1,defaultValue:1.2,displayStepper:true},textAlign:{type:\"enum\",title:\"Text Align\",options:[\"left\",\"center\",\"right\"],optionTitles:[\"Left\",\"Center\",\"Right\"],defaultValue:\"center\"},// Gradient Colors\ncolor1:{type:\"color\",title:\"Color 1\",defaultValue:\"#ff6b6b\"},color2:{type:\"color\",title:\"Color 2\",defaultValue:\"#4ecdc4\"},useColor3:{type:\"boolean\",title:\"Use Color 3\",defaultValue:true,enabledTitle:\"Enabled\",disabledTitle:\"Disabled\"},color3:{type:\"color\",title:\"Color 3\",defaultValue:\"#45b7d1\",hidden:props=>!props.useColor3},useColor4:{type:\"boolean\",title:\"Use Color 4\",defaultValue:false,enabledTitle:\"Enabled\",disabledTitle:\"Disabled\"},color4:{type:\"color\",title:\"Color 4\",defaultValue:\"#96ceb4\",hidden:props=>!props.useColor4},useColor5:{type:\"boolean\",title:\"Use Color 5\",defaultValue:false,enabledTitle:\"Enabled\",disabledTitle:\"Disabled\"},color5:{type:\"color\",title:\"Color 5\",defaultValue:\"#feca57\",hidden:props=>!props.useColor5},// Animation Settings\nanimateOnViewport:{type:\"boolean\",title:\"Animate on Viewport\",defaultValue:true,enabledTitle:\"On Scroll Into View\",disabledTitle:\"Always Animate\"},animationSpeed:{type:\"number\",title:\"Animation Speed\",min:2,max:30,step:.5,defaultValue:6,unit:\"s\",displayStepper:true},gradientDirection:{type:\"number\",title:\"Gradient Angle\",min:0,max:360,step:15,defaultValue:45,unit:\"\\xb0\",displayStepper:true},gradientSize:{type:\"number\",title:\"Gradient Size\",min:100,max:400,step:10,defaultValue:200,unit:\"%\",displayStepper:true},// Advanced\npauseOnHover:{type:\"boolean\",title:\"Pause on Hover\",defaultValue:false,enabledTitle:\"Enabled\",disabledTitle:\"Disabled\"}};\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"AnimatedGradientText\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Animated_Text_Gradient_02.map"],"mappings":"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"}