{"version":3,"file":"Text_Color_Animation.DMR-Q1jS.mjs","names":["React.useContext","React.useMemo","React.Fragment","useRef","React.useId","RichText","useRef"],"sources":["https:/framerusercontent.com/modules/uBbdJPb6MWIInBcdUi2j/o0h2wZxJNTpz7qIRRpbw/ht49QL7bM.js","https:/framerusercontent.com/modules/GL0GPLh03ALL0S9iKStd/vcr1WrWuoujdsNH6cAFf/Text_Color_Animation.js"],"sourcesContent":["// Generated by Framer (af3ebb8)\nimport{jsx as _jsx}from\"react/jsx-runtime\";import{addFonts,cx,RichText,useComponentViewport,useLocaleInfo,useVariantState,withCSS,withFX}from\"framer\";import{LayoutGroup,motion,MotionConfigContext}from\"framer-motion\";import*as React from\"react\";import{useRef}from\"react\";const MotionDivWithFX=withFX(motion.div);const serializationHash=\"framer-rwEWD\";const variantClassNames={CYgAT9cHw:\"framer-v-j2uagk\"};function addPropertyOverrides(overrides,...variants){const nextOverrides={};variants?.forEach(variant=>variant&&Object.assign(nextOverrides,overrides[variant]));return nextOverrides;}const transition1={delay:0,duration:.3,ease:[.44,0,.56,1],type:\"tween\"};const animation={opacity:1,rotate:45,rotateX:0,rotateY:0,scale:1,skewX:0,skewY:0,x:0,y:0};const transition2={delay:0,duration:.2,ease:[.44,0,.56,1],type:\"tween\"};const Transition=({value,children})=>{const config=React.useContext(MotionConfigContext);const transition=value??config.transition;const contextValue=React.useMemo(()=>({...config,transition}),[JSON.stringify(transition)]);return /*#__PURE__*/_jsx(MotionConfigContext.Provider,{value:contextValue,children:children});};const Variants=motion.create(React.Fragment);const getProps=({height,id,width,...props})=>{return{...props};};const createLayoutDependency=(props,variants)=>{if(props.layoutDependency)return variants.join(\"-\")+props.layoutDependency;return variants.join(\"-\");};const Component=/*#__PURE__*/React.forwardRef(function(props,ref){const fallbackRef=useRef(null);const refBinding=ref??fallbackRef;const defaultLayoutId=React.useId();const{activeLocale,setLocale}=useLocaleInfo();const componentViewport=useComponentViewport();const{style,className,layoutId,variant,...restProps}=getProps(props);const{baseVariant,classNames,clearLoadingGesture,gestureHandlers,gestureVariant,isLoading,setGestureState,setVariant,variants}=useVariantState({defaultVariant:\"CYgAT9cHw\",ref:refBinding,variant,variantClassNames});const layoutDependency=createLayoutDependency(props,variants);const sharedStyleClassNames=[];const scopingClassNames=cx(serializationHash,...sharedStyleClassNames);return /*#__PURE__*/_jsx(LayoutGroup,{id:layoutId??defaultLayoutId,children:/*#__PURE__*/_jsx(Variants,{animate:variants,initial:false,children:/*#__PURE__*/_jsx(Transition,{value:transition2,children:/*#__PURE__*/_jsx(MotionDivWithFX,{...restProps,...gestureHandlers,__framer__loop:animation,__framer__loopEffectEnabled:true,__framer__loopPauseOffscreen:true,__framer__loopRepeatDelay:0,__framer__loopRepeatType:\"mirror\",__framer__loopTransition:transition1,__perspectiveFX:false,__smartComponentFX:true,__targetOpacity:1,className:cx(scopingClassNames,\"framer-j2uagk\",className,classNames),\"data-framer-name\":\"Variant 1\",layoutDependency:layoutDependency,layoutId:\"CYgAT9cHw\",ref:refBinding,style:{...style},children:/*#__PURE__*/_jsx(RichText,{__fromCanvasComponent:true,children:/*#__PURE__*/_jsx(React.Fragment,{children:/*#__PURE__*/_jsx(motion.h2,{style:{\"--font-selector\":\"RlM7UG9wcGlucy1saWdodA==\",\"--framer-font-family\":'\"Poppins\", \"Poppins Placeholder\", sans-serif',\"--framer-font-size\":\"32px\",\"--framer-font-weight\":\"300\",\"--framer-line-height\":\"150%\",\"--framer-text-alignment\":\"left\"},children:\"👋\"})}),className:\"framer-1i54jsu\",fonts:[\"FS;Poppins-light\"],layoutDependency:layoutDependency,layoutId:\"y3R2KwQbn\",verticalAlignment:\"top\",withExternalLayout:true})})})})});});const css=[\"@supports (aspect-ratio: 1) { body { --framer-aspect-ratio-supported: auto; } }\",\".framer-rwEWD.framer-u9jgqj, .framer-rwEWD .framer-u9jgqj { display: block; }\",\".framer-rwEWD.framer-j2uagk { align-content: center; align-items: center; display: flex; flex-direction: row; flex-wrap: nowrap; gap: 10px; height: min-content; justify-content: center; overflow: hidden; padding: 0px 6px 0px 6px; position: relative; width: min-content; }\",\".framer-rwEWD .framer-1i54jsu { -webkit-user-select: none; flex: none; height: auto; pointer-events: auto; position: relative; user-select: none; white-space: pre; width: auto; }\",\"@supports (background: -webkit-named-image(i)) and (not (font-palette:dark)) { .framer-rwEWD.framer-j2uagk { gap: 0px; } .framer-rwEWD.framer-j2uagk > * { margin: 0px; margin-left: calc(10px / 2); margin-right: calc(10px / 2); } .framer-rwEWD.framer-j2uagk > :first-child { margin-left: 0px; } .framer-rwEWD.framer-j2uagk > :last-child { margin-right: 0px; } }\"];/**\n * This is a generated Framer component.\n * @framerIntrinsicHeight 48\n * @framerIntrinsicWidth 44\n * @framerCanvasComponentVariantDetails {\"propertyName\":\"variant\",\"data\":{\"default\":{\"layout\":[\"auto\",\"auto\"]}}}\n * @framerImmutableVariables true\n * @framerDisplayContentsDiv false\n * @framerComponentViewportWidth true\n */const Framerht49QL7bM=withCSS(Component,css,\"framer-rwEWD\");export default Framerht49QL7bM;Framerht49QL7bM.displayName=\"shake hands\";Framerht49QL7bM.defaultProps={height:48,width:44};addFonts(Framerht49QL7bM,[{explicitInter:true,fonts:[{family:\"Poppins\",source:\"fontshare\",style:\"normal\",url:\"https://framerusercontent.com/third-party-assets/fontshare/wf/SC7QJW6HNT3W42YFCVAWB3GI66BMNCKY/Q4ANQB6YZL7K35IAB3IPAE75W7PRJSDF/3HCNXVAKPOHOEI7LK7TGC54FOZT77SNM.woff2\",weight:\"300\"}]}],{supportsExplicitInterCodegen:true});\nexport const __FramerMetadata__ = {\"exports\":{\"Props\":{\"type\":\"tsType\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"default\":{\"type\":\"reactComponent\",\"name\":\"Framerht49QL7bM\",\"slots\":[],\"annotations\":{\"framerCanvasComponentVariantDetails\":\"{\\\"propertyName\\\":\\\"variant\\\",\\\"data\\\":{\\\"default\\\":{\\\"layout\\\":[\\\"auto\\\",\\\"auto\\\"]}}}\",\"framerIntrinsicWidth\":\"44\",\"framerComponentViewportWidth\":\"true\",\"framerImmutableVariables\":\"true\",\"framerIntrinsicHeight\":\"48\",\"framerDisplayContentsDiv\":\"false\",\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./ht49QL7bM.map","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":"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"}