50:I[707087,["/_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"],"RegistryDependencies"] 51: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"] 52:T26ee,'use client'; import { useEffect, useRef, useState } from 'react'; import { Input } from '@/components/ui/input'; import { cn } from '@/lib/utils'; import { IconArrowUp, IconSparkle, FooterBar, type FooterSocial } from './footer-kit'; const KEYFRAMES = ` @keyframes su-ask-caret { 0%, 49% { opacity: 1 } 50%, 100% { opacity: 0 } } @keyframes su-ask-in { from { opacity: 0; transform: translateY(6px) } to { opacity: 1; transform: none } } @keyframes su-ask-dot { 0%, 100% { opacity: 0.25 } 50% { opacity: 1 } } `; export type AskDocsFooterVariant = 'Inline' | 'Expanded'; export interface AskCitation { index: number; title: string; href: string; } export interface AskDocsFooterProps { socials?: FooterSocial[]; brand: string; headline?: string; placeholder?: string; suggestions?: string[]; /** Link columns under the ask surface. Without them this is a search box. */ groups?: { title: string; links: { label: string; href: string }[] }[]; answer: string; citations?: AskCitation[]; chunk?: number; links?: { label: string; href: string }[]; copyright?: string; variant?: AskDocsFooterVariant; className?: string; } type Phase = 'idle' | 'thinking' | 'streaming'; export function AskDocsFooter({ socials, brand, headline = 'Ask the docs anything.', placeholder = 'How do I stream a completion?', suggestions = [], groups = [], answer, citations = [], chunk = 3, links, copyright, variant = 'Inline', className, }: AskDocsFooterProps) { const [question, setQuestion] = useState(''); const [asked, setAsked] = useState(''); const [phase, setPhase] = useState(variant === 'Expanded' ? 'streaming' : 'idle'); const [revealed, setRevealed] = useState(variant === 'Expanded' ? answer.length : 0); const inputRef = useRef(null); const complete = phase === 'streaming' && revealed >= answer.length; useEffect(() => { if (phase !== 'thinking') return; const timer = setTimeout(() => setPhase('streaming'), 700); return () => clearTimeout(timer); }, [phase]); useEffect(() => { if (phase !== 'streaming' || revealed >= answer.length) return; const timer = setTimeout(() => setRevealed((current) => current + chunk), 16); return () => clearTimeout(timer); }, [answer.length, chunk, phase, revealed]); function ask(value: string) { const trimmed = value.trim(); if (!trimmed) return; setAsked(trimmed); setQuestion(''); setRevealed(0); setPhase('thinking'); } const showPanel = phase !== 'idle'; return (