{"version":3,"file":"Examples.DntIecV2.mjs","names":["useState","useCallback","useRef"],"sources":["https:/framerusercontent.com/modules/rsWJaPoDJpZPnSUvDQtO/TTFMR7wkzTGB4bDLbsna/Examples.js"],"sourcesContent":["import{jsx as _jsx}from\"react/jsx-runtime\";import{forwardRef,startTransition,useCallback,useEffect,useState,useRef}from\"react\";// Request: Update DragScrollRail override to keep current drag-scroll behavior and add slow looping auto-scroll that pauses on hover/drag/offscreen, then resumes after ~900ms.\n// Learn more: https://www.framer.com/developers/overrides/\nfunction randomColor(){const value=Math.floor(Math.random()*16777215).toString(16);return`#${value.padStart(6,\"0\")}`;}export function withRotate(Component){return /*#__PURE__*/forwardRef((props,ref)=>{return /*#__PURE__*/_jsx(Component,{ref:ref,...props,animate:{rotate:90},transition:{duration:2}});});}export function withHover(Component){return /*#__PURE__*/forwardRef((props,ref)=>{return /*#__PURE__*/_jsx(Component,{ref:ref,...props,whileHover:{scale:1.05}});});}export function withRandomColor(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const[background,setBackground]=useState(\"#0099FF\");return /*#__PURE__*/_jsx(Component,{ref:ref,...props,animate:{background},onClick:()=>{startTransition(()=>setBackground(randomColor()));}});});}export function DragScrollRail(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const elementRef=useRef(null);const pointerIdRef=useRef(null);const startXRef=useRef(0);const startYRef=useRef(0);const startScrollLeftRef=useRef(0);const draggedRef=useRef(false);const lockModeRef=useRef(\"pending\");const pendingScrollLeftRef=useRef(null);const dragRafIdRef=useRef(null);const previousCursorRef=useRef(\"\");// Auto-scroll state\nconst autoScrollRafIdRef=useRef(null);const autoScrollResumeTimeoutRef=useRef(null);const lastAutoFrameTimeRef=useRef(null);const isHoveredRef=useRef(false);const isDraggingRef=useRef(false);const isOffscreenRef=useRef(false);const isMountedRef=useRef(false);// Tune this value if you want the automatic movement faster/slower.\nconst AUTO_SCROLL_SPEED=18// pixels per second\n;const RESUME_DELAY=900;const flushDragScroll=useCallback(()=>{dragRafIdRef.current=null;const next=pendingScrollLeftRef.current;const element=elementRef.current;if(element&&typeof next===\"number\"){element.scrollLeft=next;}},[]);const scheduleDragScroll=useCallback(next=>{pendingScrollLeftRef.current=next;if(dragRafIdRef.current!==null)return;if(typeof window!==\"undefined\"){dragRafIdRef.current=window.requestAnimationFrame(flushDragScroll);}else{flushDragScroll();}},[flushDragScroll]);const resetGesture=useCallback(()=>{const element=elementRef.current;if(element){element.style.cursor=previousCursorRef.current||\"\";}pointerIdRef.current=null;lockModeRef.current=\"pending\";isDraggingRef.current=false;},[]);const clearAutoScrollFrame=useCallback(()=>{if(autoScrollRafIdRef.current!==null&&typeof window!==\"undefined\"){window.cancelAnimationFrame(autoScrollRafIdRef.current);}autoScrollRafIdRef.current=null;lastAutoFrameTimeRef.current=null;},[]);const clearAutoScrollResumeTimeout=useCallback(()=>{if(autoScrollResumeTimeoutRef.current!==null&&typeof window!==\"undefined\"){window.clearTimeout(autoScrollResumeTimeoutRef.current);autoScrollResumeTimeoutRef.current=null;}},[]);const shouldAutoScroll=useCallback(()=>{return isMountedRef.current&&!isHoveredRef.current&&!isDraggingRef.current&&!isOffscreenRef.current;},[]);const autoScrollFrame=useCallback(timestamp=>{if(typeof window===\"undefined\"||!shouldAutoScroll()){autoScrollRafIdRef.current=null;lastAutoFrameTimeRef.current=null;return;}const element=elementRef.current;if(!element){autoScrollRafIdRef.current=null;lastAutoFrameTimeRef.current=null;return;}const maxScroll=Math.max(0,element.scrollWidth-element.clientWidth);// Keep the loop alive so it starts naturally if the rail later\n// becomes wider than its viewport (responsive/layout changes).\nif(maxScroll>0){const previousTime=lastAutoFrameTimeRef.current;lastAutoFrameTimeRef.current=timestamp;if(previousTime!==null){// Clamp large frame gaps (tab throttling, resize, etc.) so\n// the rail never suddenly jumps forward.\nconst deltaSeconds=Math.min((timestamp-previousTime)/1e3,.05);const nextLeft=element.scrollLeft+AUTO_SCROLL_SPEED*deltaSeconds;// Restart smoothly from the beginning when the end is hit.\nif(nextLeft>=maxScroll-.5){element.scrollLeft=0;}else{element.scrollLeft=nextLeft;}}}else{lastAutoFrameTimeRef.current=timestamp;}autoScrollRafIdRef.current=window.requestAnimationFrame(autoScrollFrame);},[shouldAutoScroll]);const startAutoScroll=useCallback(()=>{if(typeof window===\"undefined\"||autoScrollRafIdRef.current!==null||!shouldAutoScroll()){return;}lastAutoFrameTimeRef.current=null;autoScrollRafIdRef.current=window.requestAnimationFrame(autoScrollFrame);},[autoScrollFrame,shouldAutoScroll]);const scheduleAutoScrollResume=useCallback(()=>{clearAutoScrollResumeTimeout();if(typeof window===\"undefined\")return;autoScrollResumeTimeoutRef.current=window.setTimeout(()=>{autoScrollResumeTimeoutRef.current=null;if(shouldAutoScroll()){startAutoScroll();}},RESUME_DELAY);},[clearAutoScrollResumeTimeout,shouldAutoScroll,startAutoScroll]);const pauseAutoScroll=useCallback(()=>{clearAutoScrollFrame();clearAutoScrollResumeTimeout();},[clearAutoScrollFrame,clearAutoScrollResumeTimeout]);useEffect(()=>{isMountedRef.current=true;startAutoScroll();return()=>{isMountedRef.current=false;clearAutoScrollFrame();clearAutoScrollResumeTimeout();if(dragRafIdRef.current!==null&&typeof window!==\"undefined\"){window.cancelAnimationFrame(dragRafIdRef.current);dragRafIdRef.current=null;}};},[clearAutoScrollFrame,clearAutoScrollResumeTimeout,startAutoScroll]);const handlePointerDown=useCallback(event=>{if(event.button!==0)return;const element=event.currentTarget;elementRef.current=element;pointerIdRef.current=event.pointerId;draggedRef.current=false;lockModeRef.current=\"pending\";startXRef.current=event.clientX;startYRef.current=event.clientY;startScrollLeftRef.current=element.scrollLeft;previousCursorRef.current=element.style.cursor;element.style.cursor=\"grabbing\";isDraggingRef.current=true;pauseAutoScroll();if(element.setPointerCapture){element.setPointerCapture(event.pointerId);}props.onPointerDown?.(event);},[pauseAutoScroll,props]);const handlePointerMove=useCallback(event=>{if(pointerIdRef.current!==event.pointerId){props.onPointerMove?.(event);return;}const deltaX=event.clientX-startXRef.current;const deltaY=event.clientY-startYRef.current;const absX=Math.abs(deltaX);const absY=Math.abs(deltaY);if(lockModeRef.current===\"pending\"){const movementThreshold=6;if(absX>movementThreshold||absY>movementThreshold){if(absX>absY*1.2){lockModeRef.current=\"horizontal\";}else if(absY>absX*1.2){lockModeRef.current=\"vertical\";}}}if(lockModeRef.current===\"horizontal\"){event.preventDefault();if(absX>4)draggedRef.current=true;scheduleDragScroll(startScrollLeftRef.current-deltaX);}props.onPointerMove?.(event);},[props,scheduleDragScroll]);const handlePointerEnd=useCallback(event=>{if(pointerIdRef.current!==null&&pointerIdRef.current!==event.pointerId){return;}const element=event.currentTarget;if(element.releasePointerCapture&&pointerIdRef.current!==null){try{element.releasePointerCapture(pointerIdRef.current);}catch{// Ignore capture release errors.\n}}resetGesture();scheduleAutoScrollResume();props.onPointerUp?.(event);},[props,resetGesture,scheduleAutoScrollResume]);const handlePointerCancel=useCallback(event=>{resetGesture();scheduleAutoScrollResume();props.onPointerCancel?.(event);},[props,resetGesture,scheduleAutoScrollResume]);const handleClickCapture=useCallback(event=>{if(draggedRef.current){event.preventDefault();event.stopPropagation();draggedRef.current=false;}props.onClickCapture?.(event);},[props]);const handlePointerEnter=useCallback(event=>{isHoveredRef.current=true;pauseAutoScroll();props.onPointerEnter?.(event);},[pauseAutoScroll,props]);const handlePointerLeave=useCallback(event=>{isHoveredRef.current=false;scheduleAutoScrollResume();props.onPointerLeave?.(event);},[props,scheduleAutoScrollResume]);useEffect(()=>{if(typeof window===\"undefined\"||typeof document===\"undefined\"){return;}const element=elementRef.current;if(!element)return;const observer=new window.IntersectionObserver(entries=>{const entry=entries[0];if(!entry)return;isOffscreenRef.current=!entry.isIntersecting;if(isOffscreenRef.current){pauseAutoScroll();}else{scheduleAutoScrollResume();}},{threshold:0});observer.observe(element);return()=>observer.disconnect();},[pauseAutoScroll,scheduleAutoScrollResume]);return /*#__PURE__*/_jsx(Component,{ref:node=>{elementRef.current=node;if(typeof ref===\"function\")ref(node);else if(ref&&\"current\"in ref)ref.current=node;},...props,onPointerDown:handlePointerDown,onPointerMove:handlePointerMove,onPointerUp:handlePointerEnd,onPointerCancel:handlePointerCancel,onLostPointerCapture:handlePointerCancel,onPointerEnter:handlePointerEnter,onPointerLeave:handlePointerLeave,onClickCapture:handleClickCapture,style:{...props.style}});});}export function AutoAdvanceRail(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const elementRef=useRef(null);const intervalIdRef=useRef(null);const resumeTimeoutRef=useRef(null);const isPausedRef=useRef(false);const clearIntervalTimer=useCallback(()=>{if(intervalIdRef.current!==null&&typeof window!==\"undefined\"){window.clearInterval(intervalIdRef.current);intervalIdRef.current=null;}},[]);const clearResumeTimeout=useCallback(()=>{if(resumeTimeoutRef.current!==null&&typeof window!==\"undefined\"){window.clearTimeout(resumeTimeoutRef.current);resumeTimeoutRef.current=null;}},[]);const getStepSize=useCallback(element=>{const firstChild=element.firstElementChild;if(!firstChild)return 0;const railStyles=window.getComputedStyle(element);const gapValue=Number.parseFloat(railStyles.columnGap||\"\")||Number.parseFloat(railStyles.gap||\"\")||0;return firstChild.offsetWidth+gapValue;},[]);const advance=useCallback(()=>{if(typeof window===\"undefined\")return;if(isPausedRef.current)return;const element=elementRef.current;if(!element)return;const step=getStepSize(element);if(step<=0)return;const maxScroll=Math.max(0,element.scrollWidth-element.clientWidth);if(maxScroll<=0)return;let nextLeft=element.scrollLeft+step;if(nextLeft>maxScroll-1){nextLeft=0;}element.scrollTo({left:nextLeft,behavior:\"smooth\"});},[getStepSize]);const startInterval=useCallback(()=>{if(typeof window===\"undefined\")return;if(intervalIdRef.current!==null)return;intervalIdRef.current=window.setInterval(()=>{advance();},4e3);},[advance]);const scheduleResume=useCallback(()=>{clearResumeTimeout();if(typeof window===\"undefined\")return;resumeTimeoutRef.current=window.setTimeout(()=>{resumeTimeoutRef.current=null;isPausedRef.current=false;startInterval();},1e3);},[clearResumeTimeout,startInterval]);useEffect(()=>{startInterval();return()=>{clearIntervalTimer();clearResumeTimeout();};},[clearIntervalTimer,clearResumeTimeout,startInterval]);const handlePointerEnter=useCallback(event=>{isPausedRef.current=true;clearResumeTimeout();props.onPointerEnter?.(event);},[clearResumeTimeout,props]);const handlePointerLeave=useCallback(event=>{scheduleResume();props.onPointerLeave?.(event);},[props,scheduleResume]);return /*#__PURE__*/_jsx(Component,{ref:node=>{elementRef.current=node;if(typeof ref===\"function\")ref(node);else if(ref&&\"current\"in ref)ref.current=node;},...props,onPointerEnter:handlePointerEnter,onPointerLeave:handlePointerLeave,style:{...props.style}});});}export function HoverPlayYouTube(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const[isHovered,setIsHovered]=useState(false);const handleMouseEnter=useCallback(event=>{startTransition(()=>setIsHovered(true));props.onMouseEnter?.(event);},[props]);const handleMouseLeave=useCallback(event=>{startTransition(()=>setIsHovered(false));props.onMouseLeave?.(event);},[props]);return /*#__PURE__*/_jsx(Component,{ref:ref,...props,autoplay:isHovered?\"Loop\":\"Off\",mute:true,onMouseEnter:handleMouseEnter,onMouseLeave:handleMouseLeave,style:{...props.style}});});}export function HoverPlayNativeVideo(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const[isPlaying,setIsPlaying]=useState(false);const handleMouseEnter=useCallback(event=>{startTransition(()=>setIsPlaying(true));props.onMouseEnter?.(event);},[props]);const handleMouseLeave=useCallback(event=>{startTransition(()=>setIsPlaying(false));props.onMouseLeave?.(event);},[props]);return /*#__PURE__*/_jsx(Component,{ref:ref,...props,playing:isPlaying,onMouseEnter:handleMouseEnter,onMouseLeave:handleMouseLeave,style:{...props.style}});});}let activeWorkPanelElement=null;function getWorkPanelGroup(element){const parent=element?.parentElement;if(!parent)return[];return Array.from(parent.children).filter(child=>child instanceof HTMLElement);}function resetWorkPanelGroup(element){const panels=getWorkPanelGroup(element);for(const panel of panels){panel.style.transition=\"transform 180ms ease, opacity 180ms ease, z-index 180ms ease\";panel.style.transform=\"scale(1)\";panel.style.opacity=\"1\";panel.style.zIndex=\"1\";}}export function WorkPanelFocus(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const elementRef=useRef(null);const activatePanel=useCallback(panel=>{if(activeWorkPanelElement&&activeWorkPanelElement!==panel){resetWorkPanelGroup(activeWorkPanelElement);}const panels=getWorkPanelGroup(panel);for(const sibling of panels){sibling.style.transition=\"transform 180ms ease, opacity 180ms ease, z-index 180ms ease\";sibling.style.transform=\"scale(1)\";sibling.style.opacity=\"1\";sibling.style.zIndex=\"1\";}for(const sibling of panels){if(sibling===panel){sibling.style.transform=\"scale(1.035)\";sibling.style.opacity=\"1\";sibling.style.zIndex=\"2\";}else{sibling.style.transform=\"scale(0.985)\";sibling.style.opacity=\"0.38\";sibling.style.zIndex=\"1\";}}activeWorkPanelElement=panel;},[]);useEffect(()=>{return()=>{if(activeWorkPanelElement===elementRef.current){resetWorkPanelGroup(activeWorkPanelElement);activeWorkPanelElement=null;}};},[]);const handleMouseEnter=useCallback(event=>{const current=elementRef.current;if(current){activatePanel(current);}props.onMouseEnter?.(event);},[activatePanel,props]);const handleMouseLeave=useCallback(event=>{if(activeWorkPanelElement&&activeWorkPanelElement===elementRef.current){resetWorkPanelGroup(activeWorkPanelElement);activeWorkPanelElement=null;}props.onMouseLeave?.(event);},[props]);return /*#__PURE__*/_jsx(Component,{ref:node=>{elementRef.current=node;if(typeof ref===\"function\")ref(node);else if(ref&&\"current\"in ref)ref.current=node;},...props,onMouseEnter:handleMouseEnter,onMouseLeave:handleMouseLeave,style:{...props.style}});});}export function CinematicScrollSequence(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const elementRef=useRef(null);useEffect(()=>{if(typeof window===\"undefined\"||typeof document===\"undefined\"){return;}const html=document.documentElement;const body=document.body;const root=elementRef.current;const previousHtmlSnapType=html.style.scrollSnapType;const previousBodySnapType=body.style.scrollSnapType;const previousHtmlScrollBehavior=html.style.scrollBehavior;const previousBodyScrollBehavior=body.style.scrollBehavior;html.style.scrollSnapType=\"y proximity\";body.style.scrollSnapType=\"y proximity\";html.style.scrollBehavior=\"smooth\";body.style.scrollBehavior=\"smooth\";const childStyleCache=[];if(root){const children=Array.from(root.children).filter(child=>child instanceof HTMLElement);for(const child of children){const childStyles=window.getComputedStyle(child);const isOutOfFlow=childStyles.position===\"fixed\"||childStyles.position===\"sticky\"||childStyles.position===\"absolute\";const hasZeroHeight=child.getBoundingClientRect().height<=0;if(isOutOfFlow||hasZeroHeight)continue;childStyleCache.push({element:child,scrollSnapAlign:child.style.scrollSnapAlign});child.style.scrollSnapAlign=\"start\";}}return()=>{html.style.scrollSnapType=previousHtmlSnapType;body.style.scrollSnapType=previousBodySnapType;html.style.scrollBehavior=previousHtmlScrollBehavior;body.style.scrollBehavior=previousBodyScrollBehavior;for(const item of childStyleCache){item.element.style.scrollSnapAlign=item.scrollSnapAlign;}};},[]);return /*#__PURE__*/_jsx(Component,{ref:node=>{elementRef.current=node;if(typeof ref===\"function\")ref(node);else if(ref&&\"current\"in ref)ref.current=node;},...props,style:{...props.style}});});}export function ActiveChapterTracker(Component){return /*#__PURE__*/forwardRef((props,ref)=>{const elementRef=useRef(null);useEffect(()=>{if(typeof window===\"undefined\"||typeof document===\"undefined\"){return;}const root=elementRef.current;if(!root)return;const previousRootOpacity=root.style.opacity;const previousRootTransform=root.style.transform;const previousRootTransition=root.style.transition;// Do not hide the sidebar behind a specific section such as #agency.\nroot.style.transition=\"opacity 220ms ease, transform 220ms ease\";root.style.opacity=\"1\";root.style.transform=\"translateY(0px)\";const linkCache=new Map;const signalCache=new Map;let targetToLinks=new Map;let trackedTargets=[];let allTrackedLinks=new Set;let activeTarget=null;let rafId=null;let lastTargetId=\"\";const cacheLink=link=>{if(linkCache.has(link))return;linkCache.set(link,{color:link.style.color,opacity:link.style.opacity,fontSize:link.style.fontSize,transform:link.style.transform,transition:link.style.transition});};// Find the smallest menu row that belongs to ONE navigation link.\n// This prevents a shared Framer wrapper from turning on the signals\n// for two neighbouring items at the same time.\nconst getLinkRow=link=>{let node=link.parentElement;while(node&&node!==root){const linksInside=node.querySelectorAll('a[href*=\"#\"]');const signalsInside=node.querySelectorAll('[aria-label=\"Active chapter signal\"]');if(linksInside.length===1&&signalsInside.length>0){return node;}node=node.parentElement;}return link.parentElement;};const cacheSignals=row=>{if(!row)return;const signals=Array.from(row.querySelectorAll('[aria-label=\"Active chapter signal\"]')).filter(signal=>signal instanceof HTMLElement);for(const signal of signals){if(signalCache.has(signal))continue;signalCache.set(signal,{element:signal,opacity:signal.style.opacity,transform:signal.style.transform,transition:signal.style.transition});}};const rebuildTargets=()=>{const nextTargetToLinks=new Map;const nextAllTrackedLinks=new Set;const links=Array.from(root.querySelectorAll('a[href*=\"#\"]')).filter(link=>link instanceof HTMLAnchorElement);for(const link of links){cacheLink(link);cacheSignals(getLinkRow(link));const href=link.getAttribute(\"href\")||\"\";const hashIndex=href.indexOf(\"#\");if(hashIndex===-1)continue;let targetId=href.slice(hashIndex+1);try{targetId=decodeURIComponent(targetId);}catch{// Keep the original hash if decoding fails.\n}if(!targetId)continue;const target=document.getElementById(targetId);if(!target)continue;const mappedLinks=nextTargetToLinks.get(target)||[];mappedLinks.push(link);nextTargetToLinks.set(target,mappedLinks);nextAllTrackedLinks.add(link);}targetToLinks=nextTargetToLinks;trackedTargets=Array.from(nextTargetToLinks.keys());allTrackedLinks=nextAllTrackedLinks;};const setLinkStyles=(link,isActive)=>{link.style.transition=\"color 180ms ease, opacity 180ms ease, font-size 180ms ease, transform 180ms ease\";link.style.color=isActive?\"#D8B58A\":\"#F4EEDD\";link.style.opacity=isActive?\"1\":\"0.48\";link.style.fontSize=isActive?\"21px\":\"16px\";link.style.transform=isActive?\"translateX(5px)\":\"translateX(0px)\";};const setRowSignalStyles=(row,isActive)=>{if(!row)return;const signals=Array.from(row.querySelectorAll('[aria-label=\"Active chapter signal\"]')).filter(signal=>signal instanceof HTMLElement);for(const signal of signals){signal.style.transition=\"opacity 180ms ease, transform 180ms ease\";signal.style.opacity=isActive?\"1\":\"0\";signal.style.transform=isActive?\"scale(1)\":\"scale(0.8)\";}};const applyActiveTarget=(target,force=false)=>{if(!target)return;// Re-apply when forced because Framer can repaint inline styles.\nif(!force&&target===activeTarget)return;activeTarget=target;// Always reset every tracked navigation item first.\nfor(const link of allTrackedLinks){setLinkStyles(link,false);setRowSignalStyles(getLinkRow(link),false);}const activeLinks=targetToLinks.get(target)||[];// Framer can render duplicate anchor elements for responsive\n// variants. Activate ONE visible link only, so two menu items\n// can never appear active at the same time.\nconst visibleActiveLinks=activeLinks.filter(link=>{const styles=window.getComputedStyle(link);const rect=link.getBoundingClientRect();return styles.display!==\"none\"&&styles.visibility!==\"hidden\"&&rect.width>0&&rect.height>0;});const activeLink=visibleActiveLinks[0]||activeLinks[0]||null;if(activeLink){setLinkStyles(activeLink,true);setRowSignalStyles(getLinkRow(activeLink),true);}};const chooseActiveTarget=()=>{if(trackedTargets.length===0)return null;// This is the visual point that decides when the next chapter\n// becomes active. 42% feels natural with the centered layout.\nconst triggerY=window.innerHeight*.42;const positions=trackedTargets.map(target=>{const rect=target.getBoundingClientRect();return{target,top:rect.top,bottom:rect.bottom,height:rect.height};}).sort((a,b)=>a.top-b.top);// Best case: the trigger line is physically inside a section.\nconst containing=positions.filter(item=>item.height>1&&item.top<=triggerY&&item.bottom>triggerY);if(containing.length>0){// If sections overlap/nest, choose the one whose start is\n// closest to the trigger line.\ncontaining.sort((a,b)=>Math.abs(triggerY-a.top)-Math.abs(triggerY-b.top));return containing[0].target;}// Works for zero-height Framer anchor targets too:\n// choose the most recent section top that crossed the line.\nconst passed=positions.filter(item=>item.top<=triggerY);if(passed.length>0){return passed[passed.length-1].target;}// We are above the first tracked section.\nreturn positions[0].target;};const update=(force=false)=>{// Rebuild if Framer replaced the sidebar links or sections.\nconst currentSignature=Array.from(root.querySelectorAll('a[href*=\"#\"]')).map(link=>link.getAttribute(\"href\")||\"\").join(\"|\");if(currentSignature!==lastTargetId||trackedTargets.some(target=>!target.isConnected)){lastTargetId=currentSignature;rebuildTargets();force=true;}const nextTarget=chooseActiveTarget();if(nextTarget){applyActiveTarget(nextTarget,force);}};rebuildTargets();lastTargetId=Array.from(root.querySelectorAll('a[href*=\"#\"]')).map(link=>link.getAttribute(\"href\")||\"\").join(\"|\");// Listen in capture mode so this also catches Framer/nested\n// scrolling containers, not just window scrolling.\nconst handleScroll=()=>update();const handleResize=()=>update(true);document.addEventListener(\"scroll\",handleScroll,true);window.addEventListener(\"scroll\",handleScroll,{passive:true});window.addEventListener(\"resize\",handleResize);// Framer smooth/snap animations can move sections between scroll\n// events, so keep a lightweight RAF tracker as a fallback.\nconst frame=()=>{update();rafId=window.requestAnimationFrame(frame);};update(true);rafId=window.requestAnimationFrame(frame);return()=>{document.removeEventListener(\"scroll\",handleScroll,true);window.removeEventListener(\"scroll\",handleScroll);window.removeEventListener(\"resize\",handleResize);if(rafId!==null){window.cancelAnimationFrame(rafId);}root.style.opacity=previousRootOpacity;root.style.transform=previousRootTransform;root.style.transition=previousRootTransition;for(const[link,previous]of linkCache.entries()){if(!link.isConnected)continue;link.style.color=previous.color;link.style.opacity=previous.opacity;link.style.fontSize=previous.fontSize;link.style.transform=previous.transform;link.style.transition=previous.transition;}for(const previous of signalCache.values()){if(!previous.element.isConnected)continue;previous.element.style.opacity=previous.opacity;previous.element.style.transform=previous.transform;previous.element.style.transition=previous.transition;}};},[]);return /*#__PURE__*/_jsx(Component,{ref:node=>{elementRef.current=node;if(typeof ref===\"function\")ref(node);else if(ref&&\"current\"in ref)ref.current=node;},...props,style:{...props.style}});});}\nexport const __FramerMetadata__ = {\"exports\":{\"withRandomColor\":{\"type\":\"reactHoc\",\"name\":\"withRandomColor\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"CinematicScrollSequence\":{\"type\":\"reactHoc\",\"name\":\"CinematicScrollSequence\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"ActiveChapterTracker\":{\"type\":\"reactHoc\",\"name\":\"ActiveChapterTracker\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"WorkPanelFocus\":{\"type\":\"reactHoc\",\"name\":\"WorkPanelFocus\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HoverPlayYouTube\":{\"type\":\"reactHoc\",\"name\":\"HoverPlayYouTube\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"DragScrollRail\":{\"type\":\"reactHoc\",\"name\":\"DragScrollRail\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"AutoAdvanceRail\":{\"type\":\"reactHoc\",\"name\":\"AutoAdvanceRail\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withRotate\":{\"type\":\"reactHoc\",\"name\":\"withRotate\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"HoverPlayNativeVideo\":{\"type\":\"reactHoc\",\"name\":\"HoverPlayNativeVideo\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"withHover\":{\"type\":\"reactHoc\",\"name\":\"withHover\",\"annotations\":{\"framerContractVersion\":\"1\"}},\"__FramerMetadata__\":{\"type\":\"variable\"}}}\n//# sourceMappingURL=./Examples.map"],"mappings":"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"}