{"version":3,"file":"Scroll_Text_Reveal.Capuc_KS.mjs","names":["useRef","useState","useMemo","useCallback"],"sources":["https:/framerusercontent.com/modules/JKwWuYLTd2rgjen2bg9f/spd9DXyyA8hnU5moYARy/Scroll_Text_Reveal.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useRef,useEffect,useState,useMemo,startTransition,useCallback}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{useInView}from\"framer-motion\";/**\n * Scroll Text Animation\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight auto\n */export default function TextReveal(props){const{text=\"This is a sample text that will animate as you scroll. Each word or letter will activate and change color based on your scroll position.\",animationType=\"word\",inactiveColor=\"#666666\",activeColor=\"#FFFFFF\",font,animationSpeed=50,triggerOffset=.8,smoothTransition=true,blurAmount=4,easing=\"cubic-bezier(0.4, 0, 0.2, 1)\",animationTransition,style}=props;const containerRef=useRef(null);const isInView=useInView(containerRef,{margin:\"0px 0px -20% 0px\"});const isStatic=useIsStaticRenderer();const[scrollProgress,setScrollProgress]=useState(0);const rafRef=useRef();const lastScrollTime=useRef(0);const{transitionDuration,transitionEasing}=useMemo(()=>{let durationMs=animationSpeed;let easingCss=easing;if(animationTransition&&typeof animationTransition===\"object\"){const maybeDuration=animationTransition.duration;const maybeEase=animationTransition.ease;if(typeof maybeDuration===\"number\"&&isFinite(maybeDuration)&&maybeDuration>0){durationMs=maybeDuration*1e3;}if(Array.isArray(maybeEase)&&maybeEase.length===4){const[x1,y1,x2,y2]=maybeEase;if([x1,y1,x2,y2].every(v=>typeof v===\"number\"&&isFinite(v))){easingCss=`cubic-bezier(${x1}, ${y1}, ${x2}, ${y2})`;}}else if(typeof maybeEase===\"string\"&&maybeEase.trim().length>0){easingCss=maybeEase;}}return{transitionDuration:durationMs,transitionEasing:easingCss};},[animationSpeed,easing,animationTransition]);const textSegments=useMemo(()=>{if(animationType===\"word\"){// Split by spaces while preserving whitespace and line breaks\nreturn text.split(/(\\s+)/).filter(segment=>segment.length>0);}else if(animationType===\"letter\"){// For letter mode, split each character including line breaks\nreturn text.split(\"\");}else{// For line mode, split by manual line breaks and keep line breaks attached\nconst lines=text.split(\"\\n\");return lines.map((line,index)=>index<lines.length-1?`${line}\n`:line);}},[text,animationType]);const updateScrollProgress=useCallback(()=>{if(!containerRef.current)return;const rect=containerRef.current.getBoundingClientRect();const windowHeight=window.innerHeight;const elementTop=rect.top;// Calculate scroll progress based on element position\nconst startTrigger=windowHeight*triggerOffset;const endTrigger=windowHeight*.2;let progress=0;if(elementTop<=startTrigger&&elementTop>=endTrigger){progress=(startTrigger-elementTop)/(startTrigger-endTrigger);}else if(elementTop<endTrigger){progress=1;}// Apply easing function for smoother animation\nif(smoothTransition){progress=progress*progress*(3-2*progress)// Smoothstep function\n;}progress=Math.max(0,Math.min(1,progress));startTransition(()=>setScrollProgress(progress));},[triggerOffset,smoothTransition]);useEffect(()=>{if(isStatic||!isInView)return;const handleScroll=()=>{const now=Date.now();if(now-lastScrollTime.current<16)return;// Throttle to ~60fps\nlastScrollTime.current=now;if(rafRef.current){cancelAnimationFrame(rafRef.current);}rafRef.current=requestAnimationFrame(updateScrollProgress);};updateScrollProgress();window.addEventListener(\"scroll\",handleScroll,{passive:true});window.addEventListener(\"resize\",updateScrollProgress,{passive:true});return()=>{window.removeEventListener(\"scroll\",handleScroll);window.removeEventListener(\"resize\",updateScrollProgress);if(rafRef.current){cancelAnimationFrame(rafRef.current);}};},[isInView,isStatic,updateScrollProgress]);const activeSegmentCount=Math.floor(scrollProgress*textSegments.length);if(isStatic){return /*#__PURE__*/_jsxs(\"div\",{ref:containerRef,style:{...style,position:\"relative\",width:\"100%\",whiteSpace:\"pre-wrap\",wordWrap:\"break-word\",...font},children:[/*#__PURE__*/_jsx(\"span\",{style:{color:activeColor,filter:\"blur(0px)\",transition:`color ${transitionDuration}ms ${transitionEasing}, filter ${transitionDuration}ms ${transitionEasing}`},children:text.substring(0,Math.floor(text.length*.3))}),/*#__PURE__*/_jsx(\"span\",{style:{color:inactiveColor,filter:`blur(${blurAmount}px)`,transition:`color ${transitionDuration}ms ${transitionEasing}, filter ${transitionDuration}ms ${transitionEasing}`},children:text.substring(Math.floor(text.length*.3))})]});}return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{...style,position:\"relative\",width:\"100%\",whiteSpace:\"pre-wrap\",wordWrap:\"break-word\",...font},children:textSegments.map((segment,index)=>{const isActive=index<activeSegmentCount;const segmentColor=isActive?activeColor:inactiveColor;const segmentBlur=isActive?0:blurAmount;const transition=smoothTransition?`color ${transitionDuration}ms ${transitionEasing}, filter ${transitionDuration}ms ${transitionEasing}`:`color ${transitionDuration}ms ${transitionEasing}, filter ${transitionDuration}ms ${transitionEasing}`;return /*#__PURE__*/_jsx(\"span\",{style:{color:segmentColor,filter:`blur(${segmentBlur}px)`,transition,whiteSpace:\"pre-wrap\",willChange:\"color, filter\"},children:segment},index);})});}addPropertyControls(TextReveal,{text:{type:ControlType.String,title:\"Text\",defaultValue:\"This is a sample text that will animate as you scroll. Each word or letter will activate and change color based on your scroll position.\",displayTextArea:true},animationType:{type:ControlType.Enum,title:\"Animation Type\",options:[\"word\",\"letter\",\"line\"],defaultValue:\"word\",displaySegmentedControl:true},inactiveColor:{type:ControlType.Color,title:\"Inactive Color\",defaultValue:\"#666666\"},activeColor:{type:ControlType.Color,title:\"Active Color\",defaultValue:\"#FFFFFF\"},font:{type:ControlType.Font,title:\"Font\",defaultValue:{fontSize:\"24px\",variant:\"Medium\",letterSpacing:\"-0.01em\",lineHeight:\"1.4em\"},controls:\"extended\",defaultFontType:\"sans-serif\"},animationSpeed:{type:ControlType.Number,title:\"Animation Speed\",defaultValue:50,min:10,max:500,step:10,unit:\"ms\"},triggerOffset:{type:ControlType.Number,title:\"Trigger Offset\",defaultValue:.8,min:.1,max:1,step:.1,unit:\"\"},smoothTransition:{type:ControlType.Boolean,title:\"Smooth Transition\",defaultValue:true,enabledTitle:\"On\",disabledTitle:\"Off\"},blurAmount:{type:ControlType.Number,title:\"Blur Amount\",defaultValue:4,min:0,max:20,step:1,unit:\"px\"},easing:{type:ControlType.String,title:\"Easing\",defaultValue:\"cubic-bezier(0.4, 0, 0.2, 1)\",placeholder:\"CSS timing (e.g. ease, linear, cubic-bezier(...))\",hidden:()=>true},animationTransition:{type:ControlType.Transition,title:\"Transition\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TextReveal\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutHeight\":\"auto\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Scroll_Text_Reveal.map"],"mappings":"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"}