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:T1173,"use client"; import { useEffect, useRef, useState } from "react"; import { ChevronDown, Sparkles } from "lucide-react"; import { cn } from "@/lib/utils"; import type { ReasoningStep } from "./types"; const KEYFRAMES = ` @keyframes su-shimmer-text { 0% { background-position: 200% 0 } 100% { background-position: -200% 0 } } @keyframes su-step-in { from { opacity: 0; transform: translateY(4px) } to { opacity: 1; transform: none } } `; export type ReasoningTraceVariant = "Steps" | "Reasoning"; export interface ReasoningTraceProps { steps: ReasoningStep[]; status: "thinking" | "complete"; durationMs?: number; variant?: ReasoningTraceVariant; defaultOpen?: boolean; className?: string; } function useThinkingClock(active: boolean) { const [ds, setDs] = useState(0); const wasActive = useRef(active); useEffect(() => { if (active && !wasActive.current) setDs(0); wasActive.current = active; if (!active) return; const t = setInterval(() => setDs((d) => d + 1), 100); return () => clearInterval(t); }, [active]); return ds / 10; } export function ReasoningTrace({ steps, status, durationMs, variant = "Steps", defaultOpen = false, className, }: ReasoningTraceProps) { const [open, setOpen] = useState(defaultOpen); const thinking = status === "thinking"; const elapsed = useThinkingClock(thinking); const seconds = thinking ? elapsed.toFixed(1) : ((durationMs ?? elapsed * 1000) / 1000).toFixed(1); return (