{"version":3,"file":"TextAnimation.BsZBdBvV.mjs","names":["useState","useRef","React"],"sources":["https:/framerusercontent.com/modules/k5mvighkJjmWy4gGepsF/uuZ7wJ7UajpY4ZhWaTxX/TextAnimation.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import React,{useState,useEffect,useRef}from\"react\";import{motion}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";// Breakpoints\nconst MOBILE_BREAKPOINT=640;const TABLET_BREAKPOINT=1024;function getResponsiveFontSize(width,desktopSize,tabletSize,mobileSize){if(width<=MOBILE_BREAKPOINT){return mobileSize;}if(width<=TABLET_BREAKPOINT){return tabletSize;}return desktopSize;}// Optional: avoid widows by merging the final two words with a non-breaking space\nfunction avoidWidows(str){const words=str.split(\" \");if(words.length>2){words[words.length-2]=words[words.length-2]+\"\\xa0\"+words[words.length-1];words.pop();}return words;}export function AnimatedHeadline({text,fontSize,fontFamily,fontWeight,color,letterSpacing,lineHeight,paddingTop,paddingRight,paddingBottom,paddingLeft,textAlign,staggerDuration,letterDuration,initialDelay,// Responsive\ntabletFontSize,mobileFontSize,// Word spacing\nwordSpacing,// Intersection props\nscrollRootSelector,intersectionThreshold,intersectionRootMargin}){const[isVisible,setIsVisible]=useState(false);const[windowWidth,setWindowWidth]=useState(1920);const containerRef=useRef(null);// IntersectionObserver for reveal\nuseEffect(()=>{let rootElement=null;if(scrollRootSelector){rootElement=document.querySelector(scrollRootSelector);}const observer=new IntersectionObserver(([entry])=>{if(entry.isIntersecting){const timer=setTimeout(()=>{setIsVisible(true);},initialDelay);observer.unobserve(entry.target);return()=>clearTimeout(timer);}},{root:rootElement||null,threshold:intersectionThreshold,rootMargin:intersectionRootMargin});if(containerRef.current){observer.observe(containerRef.current);}return()=>{if(containerRef.current){observer.unobserve(containerRef.current);}};},[initialDelay,scrollRootSelector,intersectionThreshold,intersectionRootMargin]);// Listen for window size changes for responsive text.\nuseEffect(()=>{function handleResize(){setWindowWidth(window.innerWidth);}handleResize();window.addEventListener(\"resize\",handleResize);return()=>window.removeEventListener(\"resize\",handleResize);},[]);// Compute the effective font size\nconst effectiveFontSize=getResponsiveFontSize(windowWidth,fontSize,tabletFontSize,mobileFontSize);// Split text into words (with widow avoidance)\nconst words=avoidWidows(text);// Container variants with staggered children\nconst containerVariants={hidden:{},visible:{transition:{staggerChildren:staggerDuration}}};// Animation variants for each letter\nconst letterVariants={hidden:{opacity:0,y:20},visible:{opacity:1,y:0,transition:{duration:letterDuration,ease:\"easeOut\"}}};return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{padding:`${paddingTop}px ${paddingRight}px ${paddingBottom}px ${paddingLeft}px`,width:\"100%\",textAlign:textAlign,whiteSpace:\"normal\",// Change to \"visible\" so descenders aren’t clipped.\noverflow:\"visible\"},children:/*#__PURE__*/_jsx(motion.div,{variants:containerVariants,initial:\"hidden\",animate:isVisible?\"visible\":\"hidden\",style:{display:\"inline-block\",fontSize:`${effectiveFontSize}px`,fontFamily:fontFamily,fontWeight:fontWeight,color:color,letterSpacing:`${letterSpacing}px`,lineHeight:lineHeight,// Ensure the text container also does not clip overflow\noverflow:\"visible\"},children:words.map((word,wIndex)=>{const letters=Array.from(word);return /*#__PURE__*/_jsxs(React.Fragment,{children:[/*#__PURE__*/_jsx(\"span\",{style:{display:\"inline-block\",whiteSpace:\"nowrap\",overflow:\"visible\"},children:letters.map((char,lIndex)=>/*#__PURE__*/_jsx(motion.span,{variants:letterVariants,style:{display:\"inline-block\",whiteSpace:\"pre\",overflow:\"visible\"},children:char},`letter-${wIndex}-${lIndex}`))}),wIndex