{"version":3,"file":"Text_Color_Animation.D3e3I0jT.mjs","names":[],"sources":["https:/framerusercontent.com/modules/eT6X4zbeldagtApVHdPN/GpAb0pMNnDMhnWdmlux2/Text_Color_Animation.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{useEffect,useRef}from\"react\";import{motion,useAnimation}from\"framer-motion\";import{addPropertyControls,ControlType}from\"framer\";export default function TextColorAnimation({text,fontSize,fontFamily,fontWeight,textAlign,color01,color02,Duration,delay,replays}){const controls=useAnimation();const textRef=useRef();useEffect(()=>{const observer=new IntersectionObserver(async([entry])=>{if(entry.isIntersecting){await new Promise(resolve=>setTimeout(resolve,delay*1e3)) // delay before animation starts\n;controls.start(\"visible\");}else if(!entry.isIntersecting&&replays){controls.start(\"hidden\");}});observer.observe(textRef.current);return()=>observer.disconnect();},[Duration,controls,color01,delay,replays]);return /*#__PURE__*/ _jsx(\"div\",{style:{fontSize:`${fontSize}px`,fontFamily:fontFamily,fontWeight:fontWeight,width:\"100%\",whiteSpace:\"nowrap\",color:color01,textAlign:textAlign},ref:textRef,children:/*#__PURE__*/ _jsxs(\"span\",{style:{position:\"relative\",display:\"inline-block\"},children:[text,/*#__PURE__*/ _jsx(motion.span,{style:{position:\"absolute\",overflow:\"hidden\",whiteSpace:\"nowrap\",color:color02,top:0,left:0,width:\"0%\"},animate:controls,initial:{width:\"0%\"},variants:{visible:{width:\"100%\"},hidden:{width:\"0%\"}},transition:{duration:Duration},children:text})]})});};addPropertyControls(TextColorAnimation,{text:{type:ControlType.String,defaultValue:\"Hello, World!\"},fontSize:{type:ControlType.Number,defaultValue:16,min:1,max:200,unit:\"px\"},fontFamily:{type:ControlType.String,defaultValue:\"Arial\"},fontWeight:{type:ControlType.Enum,defaultValue:\"400\",options:[\"100\",\"200\",\"300\",\"400\",\"500\",\"600\",\"700\",\"800\",\"900\",]},textAlign:{title:\"Text Align\",type:ControlType.Enum,displaySegmentedControl:true,optionTitles:[\"Left\",\"Center\",\"Right\"],options:[\"left\",\"center\",\"right\"]},color01:{title:\"Color 01\",type:ControlType.Color,defaultValue:\"#333\"},color02:{title:\"Color 02\",type:ControlType.Color,defaultValue:\"#fff\"},Duration:{type:ControlType.Number,defaultValue:1,min:.1,max:10,step:.1},delay:{title:\"Delay\",type:ControlType.Number,defaultValue:0,min:0,max:10,step:.1},replays:{title:\"Replays\",type:ControlType.Boolean,defaultValue:true}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TextColorAnimation\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Text_Color_Animation.map"],"mappings":"mXAAgM,SAAwB,EAAmB,CAAC,OAAK,WAAS,aAAW,aAAW,YAAU,UAAQ,UAAQ,WAAS,QAAM,UAAQ,CAAC,CAAC,IAAM,EAAS,GAAc,CAAO,EAAQ,GAAQ,CACvK,MADwK,GAAU,IAAI,CAAC,IAAM,EAAS,IAAI,qBAAqB,MAAM,CAAC,EAAM,GAAG,CAAC,AAAG,EAAM,gBAAgB,MAAM,IAAI,QAAQ,GAAS,WAAW,EAAQ,EAAM,IAAI,EAChhB,EAAS,MAAM,UAAU,GAAW,EAAM,gBAAgB,GAAS,EAAS,MAAM,SAAS,AAAG,GAAoC,MAAlC,GAAS,QAAQ,EAAQ,QAAQ,CAAO,IAAI,EAAS,YAAY,AAAE,EAAC,CAAC,EAAS,EAAS,EAAQ,EAAM,CAAQ,EAAC,CAAsB,EAAK,MAAM,CAAC,MAAM,CAAC,YAAY,EAAS,IAAe,aAAsB,aAAW,MAAM,OAAO,WAAW,SAAS,MAAM,EAAkB,WAAU,EAAC,IAAI,EAAQ,SAAuB,EAAM,OAAO,CAAC,MAAM,CAAC,SAAS,WAAW,QAAQ,cAAe,EAAC,SAAS,CAAC,EAAmB,EAAK,EAAO,KAAK,CAAC,MAAM,CAAC,SAAS,WAAW,SAAS,SAAS,WAAW,SAAS,MAAM,EAAQ,IAAI,EAAE,KAAK,EAAE,MAAM,IAAK,EAAC,QAAQ,EAAS,QAAQ,CAAC,MAAM,IAAK,EAAC,SAAS,CAAC,QAAQ,CAAC,MAAM,MAAO,EAAC,OAAO,CAAC,MAAM,IAAK,CAAC,EAAC,WAAW,CAAC,SAAS,CAAS,EAAC,SAAS,CAAK,EAAC,AAAC,CAAC,EAAC,AAAC,EAAC,AAAE,cAAC,AAD9wB,GAAyD,IAAoC,IAA+C,IAAoD,CAC8kB,EAAoB,EAAmB,CAAC,KAAK,CAAC,KAAK,EAAY,OAAO,aAAa,eAAgB,EAAC,SAAS,CAAC,KAAK,EAAY,OAAO,aAAa,GAAG,IAAI,EAAE,IAAI,IAAI,KAAK,IAAK,EAAC,WAAW,CAAC,KAAK,EAAY,OAAO,aAAa,OAAQ,EAAC,WAAW,CAAC,KAAK,EAAY,KAAK,aAAa,MAAM,QAAQ,CAAC,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,MAAM,KAAO,CAAC,EAAC,UAAU,CAAC,MAAM,aAAa,KAAK,EAAY,KAAK,yBAAwB,EAAK,aAAa,CAAC,OAAO,SAAS,OAAQ,EAAC,QAAQ,CAAC,OAAO,SAAS,OAAQ,CAAC,EAAC,QAAQ,CAAC,MAAM,WAAW,KAAK,EAAY,MAAM,aAAa,MAAO,EAAC,QAAQ,CAAC,MAAM,WAAW,KAAK,EAAY,MAAM,aAAa,MAAO,EAAC,SAAS,CAAC,KAAK,EAAY,OAAO,aAAa,EAAE,IAAI,GAAG,IAAI,GAAG,KAAK,EAAG,EAAC,MAAM,CAAC,MAAM,QAAQ,KAAK,EAAY,OAAO,aAAa,EAAE,IAAI,EAAE,IAAI,GAAG,KAAK,EAAG,EAAC,QAAQ,CAAC,MAAM,UAAU,KAAK,EAAY,QAAQ,cAAa,CAAK,CAAC,EAAC"}