{"version":3,"file":"TextStagger_1.CONysHUI.mjs","names":["useState","useRef","useMemo","useCallback","React"],"sources":["https:/framerusercontent.com/modules/mfQbQGHW4bABT6frTuMW/cArnx1vRvN1ldx2nvIQu/TextStagger_1.js"],"sourcesContent":["// Text stagger per line animation, editable text, BDO Grotesk font (simulated with sans-serif), variable setting\nimport{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useMemo,useState,startTransition,useRef,useCallback,useLayoutEffect}from\"react\";import{addPropertyControls,ControlType,useIsStaticRenderer}from\"framer\";import{motion,useAnimationControls,useInView}from\"framer-motion\";import React from\"react\";/**\n * Staggered text per line with editable text, BDO Grotesk (sans-serif), and variable toggle\n *\n * @framerSupportedLayoutWidth any\n * @framerSupportedLayoutHeight any\n */export default function TextStagger(props){const{text,delay,duration,font,color,variable,style,trigger=\"inView\",halfOpacity=false}=props;const[hasAnimated,setHasAnimated]=useState(false);const[clicked,setClicked]=useState(false);const isStatic=useIsStaticRenderer();const[wrappedLines,setWrappedLines]=useState([]);const[containerWidth,setContainerWidth]=useState(0);const measureRef=useRef(null);const controls=useAnimationControls();// Use useRef, not useState for a DOM ref\nconst containerRef=useRef(null);const inView=useInView(containerRef);const rawText=text??\"\";const leadingSpaceCount=useMemo(()=>{const match=rawText.match(/^ +/);return match?match[0].length:0;},[rawText]);const cleanedText=useMemo(()=>{const withoutLeadingRun=rawText.replace(/^ +/,\"\");return withoutLeadingRun.replace(/\\s+/g,\" \").trim();},[rawText]);const desktopIndentPx=useMemo(()=>{if(containerWidth<810)return 0;const estimated=leadingSpaceCount*10;const maxSafe=containerWidth*.45;return Math.max(0,Math.min(estimated,maxSafe));},[containerWidth,leadingSpaceCount]);const cleanedWords=useMemo(()=>{if(!cleanedText)return[];return cleanedText.split(\" \").filter(Boolean);},[cleanedText]);const updateContainerWidth=useCallback(()=>{const container=containerRef.current;if(!container)return;const width=Math.max(0,container.clientWidth);startTransition(()=>setContainerWidth(width));},[]);const measureLines=useCallback(()=>{if(typeof window===\"undefined\")return;const measureEl=measureRef.current;const container=containerRef.current;if(!measureEl||!container)return;const width=Math.max(0,container.clientWidth);if(containerWidth!==width){startTransition(()=>setContainerWidth(width));}if(!cleanedText||cleanedWords.length===0){startTransition(()=>setWrappedLines([]));return;}const wordElements=measureEl.querySelectorAll(\"[data-word-index]\");if(!wordElements.length){startTransition(()=>setWrappedLines([]));return;}const groupedByLine=new Map;const lineOrder=[];wordElements.forEach(wordElement=>{const top=Math.round(wordElement.offsetTop);const word=wordElement.dataset.word??\"\";if(!word)return;if(!groupedByLine.has(top)){groupedByLine.set(top,[]);lineOrder.push(top);}groupedByLine.get(top)?.push(word);});lineOrder.sort((a,b)=>a-b);const lines=lineOrder.map(top=>(groupedByLine.get(top)||[]).join(\" \").trim()).filter(line=>line.length>0);startTransition(()=>setWrappedLines(lines));},[cleanedText,cleanedWords,containerWidth]);useEffect(()=>{if(typeof window===\"undefined\")return;updateContainerWidth();const onResize=()=>measureLines();window.addEventListener(\"resize\",onResize);return()=>window.removeEventListener(\"resize\",onResize);},[updateContainerWidth,measureLines]);useEffect(()=>{if(typeof window===\"undefined\")return;if(typeof ResizeObserver===\"undefined\")return;const container=containerRef.current;if(!container)return;const observer=new ResizeObserver(()=>{measureLines();});observer.observe(container);return()=>observer.disconnect();},[measureLines]);useEffect(()=>{if(typeof document===\"undefined\")return;const fontSet=document.fonts;if(!fontSet)return;const remeasure=()=>measureLines();fontSet.ready.then(remeasure).catch(()=>{});fontSet.addEventListener?.(\"loadingdone\",remeasure);return()=>fontSet.removeEventListener?.(\"loadingdone\",remeasure);},[measureLines]);useLayoutEffect(()=>{measureLines();},[measureLines,cleanedText,desktopIndentPx,font]);// Determine whether to fire animation trigger\nconst shouldAnimate=useMemo(()=>{if(isStatic)return false;if(trigger===\"inView\")return inView;if(trigger===\"hover\")return hasAnimated;if(trigger===\"click\")return clicked;return false;},[isStatic,inView,hasAnimated,clicked,trigger]);useEffect(()=>{if(!isStatic&&shouldAnimate){if(!hasAnimated){controls.start(i=>({y:0,transition:{delay:i*delay,duration,ease:[.44,0,.34,.98]}}));startTransition(()=>setHasAnimated(true));}}},[controls,delay,duration,isStatic,hasAnimated,shouldAnimate]);// Simulate BDO Grotesk with sans-serif; for real, user must select it on font control if installed\nconst fontFamily=font&&font.fontFamily||\"'BDO Grotesk', 'Inter', 'Helvetica Neue', Arial, sans-serif\";const effectiveVariableWeight=variable?700:500;const effectiveVariationSettings=variable?'\"wght\" 700':'\"wght\" 500';const visibleLines=useMemo(()=>wrappedLines.filter(line=>line.trim().length>0),[wrappedLines]);// Event handlers for hover/click triggers\nconst handleMouseEnter=()=>{if(trigger===\"hover\"&&!hasAnimated)startTransition(()=>setHasAnimated(true));};const handleClick=()=>{if(trigger===\"click\"&&!clicked)startTransition(()=>setClicked(true));};return /*#__PURE__*/_jsxs(\"div\",{ref:containerRef,style:{...style,position:\"relative\",display:\"flex\",flexDirection:\"column\",justifyContent:\"center\",color,...font,fontFamily},onMouseEnter:trigger===\"hover\"?handleMouseEnter:undefined,onClick:trigger===\"click\"?handleClick:undefined,children:[/*#__PURE__*/_jsx(\"div\",{ref:measureRef,\"aria-hidden\":\"true\",style:{position:\"absolute\",visibility:\"hidden\",pointerEvents:\"none\",whiteSpace:\"normal\",boxSizing:\"border-box\",width:\"100%\",paddingRight:24,textIndent:desktopIndentPx,...font,fontFamily,fontVariationSettings:effectiveVariationSettings,fontWeight:effectiveVariableWeight,lineHeight:font.lineHeight||1.2},children:cleanedWords.map((word,index)=>/*#__PURE__*/_jsxs(React.Fragment,{children:[/*#__PURE__*/_jsx(\"span\",{\"data-word-index\":index,\"data-word\":word,style:{display:\"inline\",fontVariationSettings:effectiveVariationSettings,fontWeight:effectiveVariableWeight},children:word}),index<cleanedWords.length-1?\" \":null]},`${word}-${index}`))}),visibleLines.map((line,i)=>{const charCountBeforeLine=visibleLines.slice(0,i).reduce((sum,l)=>sum+l.length,0);const totalChars=cleanedText.length;const halfPoint=totalChars/2;const lineOpacity=halfOpacity&&charCountBeforeLine>=halfPoint?.5:1;return /*#__PURE__*/_jsx(\"span\",{style:{display:\"block\",overflowX:\"visible\",overflowY:\"hidden\",width:\"100%\",marginBottom:0,lineHeight:font.lineHeight||1.2},children:/*#__PURE__*/_jsx(motion.span,{custom:i,initial:isStatic?{y:0}:{y:70},animate:isStatic?undefined:controls,style:{display:\"inline-block\",width:\"100%\",boxSizing:\"border-box\",paddingRight:24,whiteSpace:\"normal\",textIndent:i===0?desktopIndentPx:0,...font,fontFamily,color,opacity:lineOpacity,fontVariationSettings:effectiveVariationSettings,fontWeight:effectiveVariableWeight,WebkitClipPath:\"inset(0 0 0 0)\",clipPath:\"inset(0 0 0 0)\",willChange:\"transform\",lineHeight:font.lineHeight||1.2},children:line})},i);})]});}addPropertyControls(TextStagger,{text:{type:ControlType.String,title:\"Text\",defaultValue:\"Editable\\nStaggered\\nText\",displayTextArea:true,placeholder:\"Type your text...\"},delay:{type:ControlType.Number,title:\"Delay\",defaultValue:.08,min:.01,max:1,step:.01,unit:\"s\"},duration:{type:ControlType.Number,title:\"Dur. per line\",defaultValue:.5,min:.05,max:2,step:.01,unit:\"s\"},color:{type:ControlType.Color,title:\"Color\",defaultValue:\"#000000\"},font:{type:ControlType.Font,title:\"Font\",controls:\"extended\",defaultFontType:\"sans-serif\",defaultValue:{fontSize:40,lineHeight:\"1em\",letterSpacing:\"-0.02em\",variant:\"Regular\",textAlign:\"left\"}},variable:{type:ControlType.Boolean,title:\"Variable Weight\",defaultValue:false,enabledTitle:\"Bold\",disabledTitle:\"Regular\"},trigger:{type:ControlType.Enum,title:\"Trigger\",options:[\"inView\",\"hover\",\"click\"],optionTitles:[\"When in view\",\"On hover\",\"On click\"],defaultValue:\"inView\",displaySegmentedControl:true},halfOpacity:{type:ControlType.Boolean,title:\"Half Opacity\",defaultValue:false,enabledTitle:\"On\",disabledTitle:\"Off\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TextStagger\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerSupportedLayoutWidth\":\"any\",\"framerSupportedLayoutHeight\":\"any\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TextStagger_1.map"],"mappings":"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"}