{"version":3,"file":"TextScramble.BNEdltKB.mjs","names":["useRef","useState"],"sources":["https:/framerusercontent.com/modules/3RoD6Pif1jcAwEUaXU08/MtwUbcgMe27AK3Dk2EuJ/TextScramble.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{addPropertyControls,ControlType,RenderTarget}from\"framer\";import{useEffect,useRef,useState}from\"react\";import{useInView,easeInOut}from\"framer-motion\";/**\n * @framerDisableUnlink\n *\n * @framerSupportedLayoutWidth any-prefer-fixed\n * @framerSupportedLayoutHeight any-prefer-fixed\n */export default function TextScramble({text,speed,delay,randomOrder,font,opacity,color,characters}){const animationFrameId=useRef(null);const lastTimeRef=useRef(0);const lastSwitchTimeRef=useRef(performance.now());const scrambledIndicesRef=useRef(new Set)// Ref to track scrambled positions\n;const ref=useRef(null);const isInView=useInView(ref);const[scrambledText,setScrambledText]=useState();const[letterIndex,setLetterIndex]=useState(0);const[currentIndex,setCurrentIndex]=useState(0);const isCanvas=RenderTarget.current()===RenderTarget.canvas;const currentText=text[currentIndex]||\"\";characters=characters.split(\",\");const scrambleText=text=>{const chars=text.split(\"\");return chars.map((char,index)=>{// If the index is already unscrambled or char is white space, keep the original character\nif(scrambledIndicesRef.current.has(index)||/^\\s$/.test(char)){return char;}else{const randomIndex=Math.floor(Math.random()*characters.length);return /*#__PURE__*/_jsx(\"span\",{style:{opacity},children:characters[randomIndex]},index);}});};const updateText=timestamp=>{const timeSinceLastFrame=timestamp-lastTimeRef.current;const progress=Math.min(timeSinceLastFrame/speed,1);const easedProgress=easeInOut(progress);if(easedProgress>=1){//if (timestamp - lastTimeRef.current > speed) {\nconst scrambled=scrambleText(currentText);setScrambledText(scrambled);// Add the current letterIndex to the set of scrambledIndices\nscrambledIndicesRef.current.add(letterIndex);const availableIndices=[];for(let i=0;i<currentText.length;i++){if(!scrambledIndicesRef.current.has(i)){availableIndices.push(i);}}// If there are any remaining unscrambled positions, choose one randomly\nif(availableIndices.length>0){if(randomOrder){const randomIndex=Math.floor(Math.random()*availableIndices.length);setLetterIndex(availableIndices[randomIndex]);}else{setLetterIndex(availableIndices[0])// Move to the next unscrambled character\n;}}lastTimeRef.current=timestamp;}// Handle text switching based on delay\nif(text.length>1&&timestamp-lastSwitchTimeRef.current>delay){setCurrentIndex(prevIndex=>(prevIndex+1)%text.length);setLetterIndex(0);scrambledIndicesRef.current.clear()// Clear scrambled indices when switching text\n;lastSwitchTimeRef.current=timestamp;}animationFrameId.current=requestAnimationFrame(updateText);};useEffect(()=>{if(isInView&&!isCanvas){animationFrameId.current=requestAnimationFrame(updateText);return()=>cancelAnimationFrame(animationFrameId.current);}},[isInView,letterIndex]);return /*#__PURE__*/_jsx(\"div\",{ref:ref,style:{...font,fontVariant:\"tabular-nums\",color},children:isCanvas?currentText:scrambledText});}addPropertyControls(TextScramble,{text:{type:ControlType.Array,control:{type:ControlType.String},defaultValue:[\"Hello World\"]},speed:{type:ControlType.Number,defaultValue:50,min:10,max:300,step:1,unit:\"ms\",displayStepper:true},delay:{type:ControlType.Number,defaultValue:3e3,min:0,max:5e3,step:100,unit:\"ms\",displayStepper:true,hidden(props){return props.text.length<=1;}},randomOrder:{type:ControlType.Boolean},font:{type:ControlType.Font,controls:\"extended\",displayFontSize:true,displayTextAlignment:false,defaultFontType:\"sans-serif\",defaultValue:{fontSize:16,lineHeight:1}},color:{type:ControlType.Color,defaultValue:\"#000\"},opacity:{type:ControlType.Number,defaultValue:.5,min:0,max:1,step:.1},characters:{type:ControlType.String,defaultValue:\"a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,-,.,+,*,!,?,@,&,%,/,=\",description:\"Comma-separated list of characters.\",displayTextArea:true}});TextScramble.displayName=\"008 Text Scramble\";\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"TextScramble\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\",\"framerDisableUnlink\":\"*\",\"framerSupportedLayoutHeight\":\"any-prefer-fixed\",\"framerSupportedLayoutWidth\":\"any-prefer-fixed\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./TextScramble.map"],"mappings":"kPAKG,SAAwB,EAAa,CAAC,OAAK,QAAM,QAAM,cAAY,OAAK,UAAQ,QAAM,cAAY,CAAC,IAAM,EAAiBA,EAAO,IAAI,EAAQ,EAAYA,EAAO,CAAC,EAAQ,EAAkBA,EAAO,YAAY,IAAI,CAAC,EAAQ,EAAoBA,EAAO,IAAI,GAAG,EACzP,EAAIA,EAAO,IAAI,EAAQ,EAAS,EAAU,CAAG,EAAO,CAAC,EAAc,GAAkBC,EAAS,EAAO,CAAC,EAAY,GAAgBA,EAAS,CAAC,EAAO,CAAC,EAAa,GAAiBA,EAAS,CAAC,EAAQ,EAAS,EAAa,QAAQ,IAAI,EAAa,OAAa,EAAY,EAAK,IAAe,GAAG,EAAW,EAAW,MAAM,GAAG,EAAE,IAAM,EAAa,GAAmB,EAAK,MAAM,EAAe,CAAC,CAAC,KAAK,EAAK,IAAQ,CAC/Z,GAAG,EAAoB,QAAQ,IAAI,CAAK,GAAG,OAAO,KAAK,CAAI,EAAG,OAAO,EAAU,CAAC,IAAM,EAAY,KAAK,MAAM,KAAK,OAAO,EAAE,EAAW,MAAM,EAAE,OAAoB,EAAK,OAAO,CAAC,MAAM,CAAC,SAAO,EAAE,SAAS,EAAW,EAAY,EAAE,CAAK,CAAE,CAAC,CAAC,EAAU,EAAW,GAAW,CAAC,IAAM,EAAmB,EAAU,EAAY,QAAoG,GAApB,EAAzD,KAAK,IAAI,EAAmB,EAAM,CAAwC,CAAkB,GAAG,EAAE,CAClb,IAAM,EAAU,EAAa,CAAW,EAAE,EAAiB,CAAS,EACpE,EAAoB,QAAQ,IAAI,CAAW,EAAE,IAAM,EAAiB,CAAC,EAAE,IAAI,IAAI,EAAE,EAAE,EAAE,EAAY,OAAO,IAAS,EAAoB,QAAQ,IAAI,CAAC,GAAG,EAAiB,KAAK,CAAC,EAC5K,GAAG,EAAiB,OAAO,EAAG,GAAG,EAAY,CAAC,IAAM,EAAY,KAAK,MAAM,KAAK,OAAO,EAAE,EAAiB,MAAM,EAAE,EAAe,EAAiB,EAAY,CAAE,MAAM,EAAe,EAAiB,EAAE,EACrM,EAAY,QAAQ,CAAU,CAC9B,EAAK,OAAO,GAAG,EAAU,EAAkB,QAAQ,IAAO,EAAgB,IAAY,EAAU,GAAG,EAAK,MAAM,EAAE,EAAe,CAAC,EAAE,EAAoB,QAAQ,MAAM,EACtK,EAAkB,QAAQ,GAAW,EAAiB,QAAQ,sBAAsB,CAAU,CAAE,EAAwL,OAAtL,MAAc,CAAC,GAAG,GAAU,CAAC,EAAqE,MAA3D,GAAiB,QAAQ,sBAAsB,CAAU,MAAY,qBAAqB,EAAiB,OAAO,CAAG,EAAE,CAAC,EAAS,CAAW,CAAC,EAAsB,EAAK,MAAM,CAAK,MAAI,MAAM,CAAC,GAAG,EAAK,YAAY,eAAe,OAAK,EAAE,SAAS,EAAS,EAAY,CAAa,CAAC,CAAE,iBAbtX,IAAiE,IAA6C,IAA+C,EAa0N,EAAoB,EAAa,CAAC,KAAK,CAAC,KAAK,EAAY,MAAM,QAAQ,CAAC,KAAK,EAAY,MAAM,EAAE,aAAa,CAAC,aAAa,CAAC,EAAE,MAAM,CAAC,KAAK,EAAY,OAAO,aAAa,GAAG,IAAI,GAAG,IAAI,IAAI,KAAK,EAAE,KAAK,KAAK,eAAe,EAAI,EAAE,MAAM,CAAC,KAAK,EAAY,OAAO,aAAa,IAAI,IAAI,EAAE,IAAI,IAAI,KAAK,IAAI,KAAK,KAAK,eAAe,GAAK,OAAO,EAAM,CAAC,OAAO,EAAM,KAAK,QAAQ,CAAE,CAAC,EAAE,YAAY,CAAC,KAAK,EAAY,OAAO,EAAE,KAAK,CAAC,KAAK,EAAY,KAAK,SAAS,WAAW,gBAAgB,GAAK,qBAAqB,GAAM,gBAAgB,aAAa,aAAa,CAAC,SAAS,GAAG,WAAW,CAAC,CAAC,EAAE,MAAM,CAAC,KAAK,EAAY,MAAM,aAAa,MAAM,EAAE,QAAQ,CAAC,KAAK,EAAY,OAAO,aAAa,GAAG,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,EAAE,WAAW,CAAC,KAAK,EAAY,OAAO,aAAa,4EAA4E,YAAY,sCAAsC,gBAAgB,EAAI,CAAC,CAAC,EAAE,EAAa,YAAY"}