50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/3j06ow7w40nxu.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:T1a4b,'use client'; import { Fragment, useEffect, useMemo, useRef, useState, useSyncExternalStore } from 'react'; import { cn } from '@/lib/utils'; import { FooterBar, type FooterSocial } from './footer-kit'; const KEYFRAMES = ` @keyframes su-token-in { from { opacity: 0; transform: translateY(6px); filter: blur(4px) } to { opacity: 1; transform: none; filter: blur(0) } } @keyframes su-token-caret { 0%, 49% { opacity: 1 } 50%, 100% { opacity: 0 } } `; export type TokenStreamFooterVariant = 'Stream' | 'Instant'; export interface TokenStreamFooterProps { links?: { label: string; href: string }[]; socials?: FooterSocial[]; brand: string; manifesto: string; groups?: { title: string; links: { label: string; href: string }[] }[]; meta?: { label: string; value: string }[]; copyright?: string; tokenDelay?: number; variant?: TokenStreamFooterVariant; className?: string; } const REDUCED_MOTION = '(prefers-reduced-motion: reduce)'; function subscribeToMotionPreference(onChange: () => void) { const query = window.matchMedia(REDUCED_MOTION); query.addEventListener('change', onChange); return () => query.removeEventListener('change', onChange); } function usePrefersReducedMotion() { return useSyncExternalStore( subscribeToMotionPreference, () => window.matchMedia(REDUCED_MOTION).matches, () => false, ); } export function TokenStreamFooter({ links, socials, brand, manifesto, groups = [], meta = [], copyright, tokenDelay = 55, variant = 'Stream', className, }: TokenStreamFooterProps) { const tokens = useMemo(() => manifesto.split(/(\s+)/), [manifesto]); const reduced = usePrefersReducedMotion(); const immediate = variant === 'Instant' || reduced; const [started, setStarted] = useState(false); const [count, setCount] = useState(0); const [renderedFor, setRenderedFor] = useState(manifesto); const root = useRef(null); if (renderedFor !== manifesto) { setRenderedFor(manifesto); setStarted(false); setCount(0); } useEffect(() => { if (immediate || started) return; const node = root.current; if (!node) return; const observer = new IntersectionObserver( (entries) => { if (entries.some((entry) => entry.isIntersecting)) { setStarted(true); observer.disconnect(); } }, { rootMargin: '0px 0px -15% 0px' }, ); observer.observe(node); return () => observer.disconnect(); }, [immediate, started]); useEffect(() => { if (immediate || !started || count >= tokens.length) return; const timer = setTimeout(() => setCount((current) => current + 1), tokenDelay); return () => clearTimeout(timer); }, [count, immediate, started, tokenDelay, tokens.length]); const shown = immediate ? tokens.length : count; const streaming = !immediate && started && count < tokens.length; return (