{"version":3,"file":"TextAnimation.DEquAtdr.mjs","names":["useState","useRef"],"sources":["https:/framerusercontent.com/modules/iV3iM3tBJ9ZS0AyTr4B6/mvhcL2ubF4sBrTvINHnB/TextAnimation.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{motion}from\"framer-motion\";import{useState,useEffect,useRef}from\"react\";/**\n * @framerDisableUnlink\n */export default function AnimatedText(props){const{text=\"This is a [test] tile. we can [do] it.\",normalColor=\"#FFFFFF\",highlightColor=\"#60A5FA\",frameColor=\"#FFFFFF\",delay=200,extendDuration=200,revealDuration=200,font,textTransform=\"none\"}=props;const[showHighlights,setShowHighlights]=useState(false);const[isInView,setIsInView]=useState(false);const containerRef=useRef(null);useEffect(()=>{const observer=new IntersectionObserver(entries=>{entries.forEach(entry=>{if(entry.isIntersecting&&!isInView){setIsInView(true);}});},{threshold:.1});if(containerRef.current){observer.observe(containerRef.current);}return()=>{if(containerRef.current){observer.unobserve(containerRef.current);}};},[isInView]);useEffect(()=>{if(!isInView)return;// Start the animation after component is in view + delay\nconst timer=setTimeout(()=>{setShowHighlights(true);},delay);return()=>clearTimeout(timer);},[delay,text,isInView]);// Parse the text to extract normal and highlighted parts\nconst parseText=input=>{const parts=[];const regex=/\\[([^\\]]+)\\]|([^\\[]+)/g;let match;while((match=regex.exec(input))!==null){if(match[1]){// Highlighted text (inside brackets)\nparts.push({text:match[1],isHighlight:true});}else if(match[2]){// Normal text\nparts.push({text:match[2],isHighlight:false});}}return parts;};const textParts=parseText(text);return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"center\",justifyContent:\"center\"},children:/*#__PURE__*/_jsx(\"p\",{style:{fontSize:font?.fontSize,fontFamily:font?.fontFamily,fontWeight:font?.fontWeight,lineHeight:font?.lineHeight,letterSpacing:font?.letterSpacing,margin:0,textAlign:font?.textAlign,textTransform:textTransform,display:\"inline\",whiteSpace:\"pre-wrap\"},children:textParts.map((part,index)=>{if(!part.isHighlight){return /*#__PURE__*/_jsx(\"span\",{style:{color:normalColor},children:part.text},index);}return /*#__PURE__*/_jsxs(\"span\",{style:{position:\"relative\",display:\"inline-block\"},children:[/*#__PURE__*/_jsx(\"span\",{style:{visibility:\"hidden\"},children:part.text}),/*#__PURE__*/_jsxs(\"span\",{style:{position:\"absolute\",top:0,left:0,width:\"100%\",height:\"100%\",overflow:\"hidden\"},children:[/*#__PURE__*/_jsx(motion.span,{style:{position:\"absolute\",top:0,left:0,color:highlightColor,whiteSpace:\"nowrap\"},initial:{clipPath:\"inset(0 100% 0 0)\"},animate:showHighlights?{clipPath:[\"inset(0 100% 0 0)\",\"inset(0 0% 0 0)\"]}:{},transition:{duration:(extendDuration+revealDuration)/1e3,ease:\"linear\"},children:part.text}),showHighlights&&/*#__PURE__*/_jsx(motion.span,{style:{position:\"absolute\",top:0,left:0,height:\"100%\",backgroundColor:frameColor,transformOrigin:\"left\"},initial:{width:0},animate:{width:[\"0%\",\"100%\",\"100%\",\"0%\"],left:[\"0%\",\"0%\",\"0%\",\"100%\"]},transition:{duration:(extendDuration+revealDuration)/1e3,times:[0,extendDuration/(extendDuration+revealDuration),extendDuration/(extendDuration+revealDuration),1],ease:\"linear\"}})]})]},index);})})});}AnimatedText.defaultProps={text:\"This is a [test] tile. we can [do] it.\",normalColor:\"#FFFFFF\",highlightColor:\"#60A5FA\",frameColor:\"#FFFFFF\",delay:200,extendDuration:200,revealDuration:200,textTransform:\"none\"};addPropertyControls(AnimatedText,{text:{type:ControlType.String,title:\"Text\",defaultValue:\"This is a [test] tile. we can [do] it.\",displayTextArea:true},normalColor:{type:ControlType.Color,title:\"Normal Color\",defaultValue:\"#FFFFFF\"},highlightColor:{type:ControlType.Color,title:\"Highlight Color\",defaultValue:\"#60A5FA\"},frameColor:{type:ControlType.Color,title:\"Frame Color\",defaultValue:\"#FFFFFF\"},delay:{type:ControlType.Number,title:\"Delay (ms)\",defaultValue:200,min:0,max:5e3,step:50},extendDuration:{type:ControlType.Number,title:\"Extend Duration (ms)\",defaultValue:200,min:50,max:2e3,step:50},revealDuration:{type:ControlType.Number,title:\"Reveal Duration (ms)\",defaultValue:200,min:50,max:2e3,step:50},font:{type:ControlType.Font,controls:\"extended\"},textTransform:{type:ControlType.Enum,title:\"Text Transform\",options:[\"none\",\"uppercase\",\"lowercase\",\"capitalize\"],optionTitles:[\"None\",\"Uppercase\",\"Lowercase\",\"Capitalize\"],defaultValue:\"none\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"AnimatedText\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerDisableUnlink\":\"\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TextAnimation.map"],"mappings":"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"}