{"version":3,"file":"Randomizer.BSPWLas-.mjs","names":["useState","useRef","useCallback"],"sources":["https:/framerusercontent.com/modules/O7vIupU7rdCt6lBmS6Up/Wxl5dLwpEmcEghj7nnuZ/Randomizer.js"],"sourcesContent":["import{jsx as _jsx,jsxs as _jsxs}from\"react/jsx-runtime\";import{addPropertyControls,ControlType}from\"framer\";import{useState,useEffect,useRef,useCallback}from\"react\";// ─── Scramble engine — precisely reverse-engineered from video ────────────────\n//\n// How it works (confirmed across 3 reference videos):\n//\n//   START STATE: completely blank\n//\n//   DURING animation, at any given frame the visible text is:\n//     [resolved chars in text color] + [Letters window of orange scramble]\n//   Everything beyond the window is still blank/invisible.\n//\n//   The \"Letters\" param (default 25) = size of the orange noise window\n//   that leads ahead of the resolved front. Every frame, each char in\n//   that window cycles to a new random character.\n//\n//   The \"Speed\" param (0–100%) controls how fast the front advances.\n//   At 95% speed with Letters=25, a ~80-char string resolves in ~1.4s.\n//\n//   END STATE: all chars resolved in text color, orange window gone.\n//\nconst DEFAULT_CHARS=\"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+[]{}|;:,.<>?~\";function rndChar(chars){return chars[Math.floor(Math.random()*chars.length)];}function useScramble(text,active,speed,letters,chars){const[slots,setSlots]=useState([]);const rafRef=useRef(null);const stateRef=useRef({resolved:0,tick:0});const stop=useCallback(()=>{if(rafRef.current!=null){cancelAnimationFrame(rafRef.current);rafRef.current=null;}},[]);useEffect(()=>{stop();if(!active||!text){// Show final resolved state immediately\nsetSlots(text.split(\"\").map(c=>({char:c,resolved:true,visible:true})));return;}// Reset — start with all slots blank/invisible\nstateRef.current={resolved:0,tick:0};setSlots(text.split(\"\").map(()=>({char:\"\",resolved:false,visible:false})));// Speed → chars resolved per frame\n// At speed=95, letters=25: resolves ~2 chars/frame @ 60fps\n// Map 0–100% speed to 0.5–8 chars per frame\nconst charsPerFrame=Math.max(.3,speed/100*6);let resolvedFrac=0;let lastTime=performance.now();const tick=now=>{const dt=now-lastTime;lastTime=now;// Advance the resolved front proportionally to elapsed time\n// Base rate at 60fps: charsPerFrame per frame\nconst advance=charsPerFrame*(dt/(1e3/60));resolvedFrac=Math.min(resolvedFrac+advance,text.length);const resolvedInt=Math.floor(resolvedFrac);setSlots(text.split(\"\").map((targetChar,i)=>{if(i<resolvedInt){// Locked in — show real char\nreturn{char:targetChar,resolved:true,visible:true};}if(i<resolvedInt+letters){// Inside the noise window — show random scramble char\n// Spaces stay as spaces (preserve word shape)\nreturn{char:targetChar===\" \"?\" \":rndChar(chars),resolved:false,visible:true};}// Beyond the window — still blank\nreturn{char:\"\",resolved:false,visible:false};}));if(resolvedInt<text.length){rafRef.current=requestAnimationFrame(tick);}};rafRef.current=requestAnimationFrame(tick);return stop;},[text,active,speed,letters,chars,stop]);return slots;}// ─── ScrambleText ─────────────────────────────────────────────────────────────\nfunction ScrambleText({text,speed,letters,chars,scrambledColor,inView,style}){const[active,setActive]=useState(false);// Only start when both inView is true AND text is set.\n// Reset to blank whenever text changes so the animation replays on next inView.\nuseEffect(()=>{setActive(false);},[text]);useEffect(()=>{if(!inView){setActive(false);return;}const t=setTimeout(()=>setActive(true),60);return()=>clearTimeout(t);},[inView,text]);const slots=useScramble(text,active,speed,letters,chars);// Cursor sits at the leading edge of the scramble window (first unresolved visible slot).\n// Once all slots are resolved the cursor disappears naturally.\nconst allResolved=slots.length>0&&slots.every(s=>s.resolved);const cursorIdx=slots.findIndex(s=>s.visible&&!s.resolved);return /*#__PURE__*/_jsxs(\"span\",{style:{...style,display:\"block\",whiteSpace:\"pre-wrap\",wordBreak:\"break-word\"},children:[slots.map((slot,i)=>{const isCursorPos=!allResolved&&i===cursorIdx;return slot.visible?/*#__PURE__*/_jsxs(\"span\",{style:{color:slot.resolved?\"inherit\":scrambledColor},children:[isCursorPos&&/*#__PURE__*/_jsx(\"span\",{style:{display:\"inline-block\",width:\"0.55em\",height:\"1em\",backgroundColor:scrambledColor,verticalAlign:\"text-bottom\",marginRight:\"0.05em\",animation:\"cur-blink 0.5s step-start infinite\"}}),slot.char]},i):null;}),/*#__PURE__*/_jsx(\"style\",{children:`@keyframes cur-blink { 0%,100%{opacity:1} 50%{opacity:0} }`})]});}// ─── FadeText ─────────────────────────────────────────────────────────────────\nfunction FadeText({text,inView,style}){const[visible,setVisible]=useState(false);useEffect(()=>{setVisible(false);},[text]);useEffect(()=>{if(!inView){setVisible(false);return;}const t=setTimeout(()=>setVisible(true),60);return()=>clearTimeout(t);},[inView,text]);return /*#__PURE__*/_jsx(\"span\",{style:{...style,display:\"block\",whiteSpace:\"pre-wrap\",wordBreak:\"break-word\",opacity:visible?1:0,transition:visible?\"opacity 0.6s ease\":\"none\"},children:text});}// ─── Randomizer ───────────────────────────────────────────────────────────────\nexport default function Randomizer({items,animation,font,fontSize,fontWeight,color,textAlign,characters,scrambledColor,speed,letters,style}){const validItems=(items||[]).filter(s=>s?.trim().length>0);const[animKey,setAnimKey]=useState(0);const[idx,setIdx]=useState(()=>Math.floor(Math.random()*Math.max(validItems.length,1)));// Only fire animation when the element enters the viewport\nconst containerRef=useRef(null);const[inView,setInView]=useState(false);useEffect(()=>{const el=containerRef.current;if(!el||typeof IntersectionObserver===\"undefined\"){setInView(true);return;}const observer=new IntersectionObserver(([entry])=>{if(entry.isIntersecting){// Pick a new random item every time it comes back into view\nsetIdx(prev=>{if(validItems.length<=1)return prev;let next;do{next=Math.floor(Math.random()*validItems.length);}while(next===prev)return next;});setAnimKey(k=>k+1);}setInView(entry.isIntersecting);},{threshold:.1});observer.observe(el);return()=>observer.disconnect();},[]);useEffect(()=>{if(validItems.length===0)return;setIdx(Math.floor(Math.random()*validItems.length));setAnimKey(k=>k+1);},[(items||[]).join(\"||\")]);const currentText=validItems.length>0?validItems[idx]:\"Add text items in the panel →\";const textStyle={fontFamily:font||\"inherit\",fontSize:fontSize??32,fontWeight:fontWeight??700,color:color||\"#222222\",textAlign:textAlign||\"left\",lineHeight:1.25,margin:0,padding:0,width:\"100%\"};const cycle=()=>{if(validItems.length<=1)return;setIdx(i=>(i+1)%validItems.length);setAnimKey(k=>k+1);};const resolvedChars=(characters||\"\").trim()||DEFAULT_CHARS;const resolvedSpeed=speed??95;const resolvedLetters=letters??25;const renderText=()=>{if(animation===\"scramble\"){return /*#__PURE__*/_jsx(ScrambleText,{text:currentText,speed:resolvedSpeed,letters:resolvedLetters,chars:resolvedChars,scrambledColor:scrambledColor||\"#F23D01\",inView:inView,style:textStyle},animKey);}if(animation===\"fade\"){return /*#__PURE__*/_jsx(FadeText,{text:currentText,inView:inView,style:textStyle},animKey);}return /*#__PURE__*/_jsx(\"span\",{style:{...textStyle,display:\"block\",whiteSpace:\"pre-wrap\",wordBreak:\"break-word\"},children:currentText},animKey);};return /*#__PURE__*/_jsx(\"div\",{ref:containerRef,style:{width:\"100%\",height:\"100%\",display:\"flex\",alignItems:\"flex-start\",overflow:\"hidden\",cursor:validItems.length>1?\"pointer\":\"default\",...style},onClick:cycle,title:validItems.length>1?\"Click to cycle\":undefined,children:renderText()});}// ─── Framer property controls — matching the original Scramble Appear panel ───\naddPropertyControls(Randomizer,{items:{type:ControlType.Array,title:\"Text Items\",control:{type:ControlType.String,displayTextArea:true,placeholder:\"Enter text...\"},defaultValue:[\"I design with intent.\",\"10+ years of UX craft.\",\"Healthcare. SaaS. Real impact.\"],maxCount:20},animation:{type:ControlType.Enum,title:\"Animation\",options:[\"none\",\"fade\",\"scramble\"],optionTitles:[\"None\",\"Fade In\",\"Scramble Appear\"],defaultValue:\"scramble\"},// ── Typography ─────────────────────────────────────────────────────────\nfont:{type:ControlType.String,title:\"Font\",defaultValue:\"Chakra Petch, monospace\"},fontSize:{type:ControlType.Number,title:\"Font Size\",defaultValue:32,min:8,max:200,step:1,displayStepper:true},fontWeight:{type:ControlType.Number,title:\"Font Weight\",defaultValue:700,min:100,max:900,step:100,displayStepper:true},color:{type:ControlType.Color,title:\"Color\",defaultValue:\"#222222\"},textAlign:{type:ControlType.Enum,title:\"From\",options:[\"left\",\"center\",\"right\"],optionTitles:[\"Left\",\"Center\",\"Right\"],defaultValue:\"left\"},// ── Scramble controls — same names/layout as original Scramble Appear ──\ncharacters:{type:ControlType.String,title:\"Characters\",defaultValue:DEFAULT_CHARS,hidden:props=>props.animation!==\"scramble\"},scrambledColor:{type:ControlType.Color,title:\"Scrambled\",defaultValue:\"#F23D01\",hidden:props=>props.animation!==\"scramble\"},speed:{type:ControlType.Number,title:\"Speed\",defaultValue:95,min:0,max:100,step:1,displayStepper:true,hidden:props=>props.animation!==\"scramble\"},letters:{type:ControlType.Number,title:\"Letters\",defaultValue:25,min:1,max:60,step:1,displayStepper:true,hidden:props=>props.animation!==\"scramble\"}});\nexport const __FramerMetadata__ = {\"exports\":{\"default\":{\"type\":\"reactComponent\",\"name\":\"Randomizer\",\"slots\":[],\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Randomizer.map"],"mappings":"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"}