4b: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"RegistryDependencies"] 4c: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/3upr08c9vtj8w.js","/_next/static/immutable/chunks/2rwy6tq861e-y.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/2hlz_ivp-qrnh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2zoahorp76dll.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1d0aij627lbx2.js","/_next/static/immutable/chunks/1ud4fi_ghnsx-.js"],"FilesView"] 4d:T239e,"use client"; // www.agentui.pro/components/agents/streaming-response import { Check, ChevronDown, Copy, RotateCcw, ThumbsDown, ThumbsUp, } from "lucide-react"; import { AnimatePresence, motion, useReducedMotion } from "motion/react"; import { type ReactNode, useCallback, useEffect, useId, useRef, useState, } from "react"; import { type CitationItem, CitationList, CitationStack, } from "@/components/agents/citations"; import { AgentDisclosure } from "@/components/agents/agent-disclosure"; import { EASE_OUT, SPRING_PRESS, SPRING_SWAP } from "@/lib/ease"; import { cn } from "@/lib/utils"; export type StreamingResponseStatus = "streaming" | "complete" | "error"; export type StreamingResponseFeedback = "up" | "down" | null; export interface StreamingResponseProps { /** Rendered response content. Pass plain text or the output of a Markdown renderer. */ children: ReactNode; status?: StreamingResponseStatus; /** Plain-text value copied by the built-in copy action. */ copyText?: string; /** Overrides the built-in clipboard action. */ onCopy?: () => void | Promise; onRetry?: () => void; /** Optional sources shown as a compact footer disclosure after streaming. */ sources?: CitationItem[]; sourcesOpen?: boolean; defaultSourcesOpen?: boolean; onSourcesOpenChange?: (open: boolean) => void; sourceIdPrefix?: string; feedback?: StreamingResponseFeedback; defaultFeedback?: StreamingResponseFeedback; onFeedbackChange?: (feedback: StreamingResponseFeedback) => void; /** Set false when a surrounding conversation log announces streamed text. */ announce?: boolean; /** Hides the built-in completion actions without changing response status. */ showActions?: boolean; className?: string; contentClassName?: string; actionsClassName?: string; } function ResponseAction({ label, active = false, onClick, children, }: { label: string; active?: boolean; onClick: () => void; children: ReactNode; }) { const reduce = useReducedMotion() ?? false; return ( {children} ); } export function StreamingResponse({ children, status = "streaming", copyText, onCopy, onRetry, sources = [], sourcesOpen, defaultSourcesOpen = false, onSourcesOpenChange, sourceIdPrefix, feedback, defaultFeedback = null, onFeedbackChange, announce = true, showActions = true, className, contentClassName, actionsClassName, }: StreamingResponseProps) { const reduce = useReducedMotion() ?? false; const baseId = useId(); const [copied, setCopied] = useState(false); const [internalFeedback, setInternalFeedback] = useState(defaultFeedback); const [internalSourcesOpen, setInternalSourcesOpen] = useState(defaultSourcesOpen); const copyTimer = useRef(undefined); const currentFeedback = feedback ?? internalFeedback; const currentSourcesOpen = sourcesOpen ?? internalSourcesOpen; const streaming = status === "streaming"; const complete = status === "complete"; const canCopy = Boolean(copyText || onCopy); const hasSources = sources.length > 0; const shouldShowActions = showActions && !streaming && (canCopy || onRetry || complete || hasSources); const sourcesContentId = `${baseId}-sources`; const resolvedSourcePrefix = sourceIdPrefix ?? `response-source-${baseId.replace(/:/g, "")}`; useEffect( () => () => { if (copyTimer.current) window.clearTimeout(copyTimer.current); }, [], ); const handleCopy = useCallback(async () => { if (onCopy) await onCopy(); else if (copyText) await navigator.clipboard?.writeText(copyText); setCopied(true); if (copyTimer.current) window.clearTimeout(copyTimer.current); copyTimer.current = window.setTimeout(() => setCopied(false), 1600); }, [copyText, onCopy]); const setFeedback = (next: Exclude) => { const value = currentFeedback === next ? null : next; if (feedback === undefined) setInternalFeedback(value); onFeedbackChange?.(value); }; const setSourcesOpen = useCallback( (next: boolean) => { if (sourcesOpen === undefined) setInternalSourcesOpen(next); onSourcesOpenChange?.(next); }, [onSourcesOpenChange, sourcesOpen], ); return (

{children}

{shouldShowActions ? (

{canCopy ? ( {copied ? ( ) : ( )} ) : null} {onRetry ? ( ) : null} {complete ? ( <> setFeedback("up")} > setFeedback("down")} > ) : null} {hasSources ? ( ) : null}

{hasSources ? ( ) : null} ) : null}

); } 4e:T549,"use client"; import { motion, type HTMLMotionProps, useReducedMotion } from "motion/react"; import type { CSSProperties } from "react"; import { EASE_OUT } from "@/lib/ease"; import { cn } from "@/lib/utils"; export interface AgentDisclosureProps extends Omit, "animate" | "initial"> { open: boolean; openHeight?: CSSProperties["height"]; } /** Shared transform-only reveal for collapsible agent content. */ export function AgentDisclosure({ open, openHeight = "auto", className, style, transition, ...props }: AgentDisclosureProps) { const reduce = useReducedMotion() ?? false; return ( ); } 4f:T1e6d,"use client"; import { BookOpenText, ChevronDown, ExternalLink, Globe2 } from "lucide-react"; import { AnimatePresence, motion, useReducedMotion } from "motion/react"; import { type ReactNode, useCallback, useId, useState, } from "react"; import { AgentDisclosure } from "@/components/agents/agent-disclosure"; import { EASE_OUT, SPRING_LAYOUT, SPRING_SWAP } from "@/lib/ease"; import { useFavicon } from "@/lib/hooks/use-favicon"; import { cn } from "@/lib/utils"; export interface CitationItem { id: string; title: ReactNode; domain?: ReactNode; url?: string; } export interface CitationsProps { citations: CitationItem[]; title?: ReactNode; open?: boolean; defaultOpen?: boolean; onOpenChange?: (open: boolean) => void; idPrefix?: string; className?: string; } export interface CitationProps { citationId: string; index: number; /** Must match the related Citations idPrefix. */ idPrefix: string; className?: string; } export interface CitationListProps { citations: CitationItem[]; idPrefix?: string; className?: string; } export interface CitationStackProps { citations: CitationItem[]; limit?: number; className?: string; } function citationTargetId(prefix: string, citationId: string) { return `${prefix}-${citationId.replace(/[^a-zA-Z0-9_-]/g, "-")}`; } export function Citation({ citationId, index, idPrefix, className, }: CitationProps) { return ( {index} ); } export function CitationFavicon({ url, className, }: { url?: string; className?: string; }) { const favicon = useFavicon(url); return ( ); } export function CitationStack({ citations, limit = 3, className, }: CitationStackProps) { return ( ); } function CitationRow({ citation, index, idPrefix, }: { citation: CitationItem; index: number; idPrefix: string; }) { const content = ( <> {citation.title} {citation.domain ? ( {citation.domain} ) : null} {index} {citation.url ? ( ) : null} ); const className = "group/citation flex items-center gap-2 rounded-md px-1.5 py-1 outline-none focus-visible:ring-2 focus-visible:ring-ring"; const id = citationTargetId(idPrefix, citation.id); return citation.url ? ( {content} ) : (

{content}

); } export function CitationList({ citations, idPrefix, className, }: CitationListProps) { const reduce = useReducedMotion() ?? false; const baseId = useId(); const resolvedPrefix = idPrefix ?? `citation-list-${baseId.replace(/:/g, "")}`; return (

{citations.map((citation, index) => ( ))}

); } export function Citations({ citations, title = "Sources", open, defaultOpen = false, onOpenChange, idPrefix, className, }: CitationsProps) { const reduce = useReducedMotion() ?? false; const baseId = useId(); const contentId = `${baseId}-content`; const resolvedPrefix = idPrefix ?? `citation-${baseId.replace(/:/g, "")}`; const [internalOpen, setInternalOpen] = useState(defaultOpen); const currentOpen = open ?? internalOpen; const setOpen = useCallback( (next: boolean) => { if (open === undefined) setInternalOpen(next); onOpenChange?.(next); }, [onOpenChange, open], ); return (

); } 50:T686,// Shared motion tokens. Easing curves mirror the CSS custom properties in // globals.css; springs are the canonical physics used across components. // Strong custom variants — defaults like `ease-in`/`ease-out` feel weak. export const EASE_OUT = [0.16, 1, 0.3, 1] as const; export const EASE_IN_OUT = [0.77, 0, 0.175, 1] as const; export const EASE_DRAWER = [0.32, 0.72, 0, 1] as const; /** CSS string form of EASE_OUT for inline style transitions. */ export const EASE_OUT_CSS = "cubic-bezier(0.16, 1, 0.3, 1)"; /** Press feedback on buttons and other tappable surfaces. */ export const SPRING_PRESS = { type: "spring", stiffness: 500, damping: 30, mass: 0.6, } as const; /** Content swaps — label/icon slots trading places inside a control. */ export const SPRING_SWAP = { type: "spring", stiffness: 460, damping: 30, mass: 0.55, } as const; /** Overlay panel entrances — modals and sheets summoned by pointer. */ export const SPRING_PANEL = { type: "spring", stiffness: 420, damping: 40, mass: 0.5, } as const; /** Shared-layout glides — pills, indicators and panels morphing between positions. */ export const SPRING_LAYOUT = { type: "spring", stiffness: 360, damping: 32, mass: 0.6, } as const; /** Cursor-follow physics for decorative mouse tracking (magnetic, tilt, dock). */ export const SPRING_MOUSE = { stiffness: 200, damping: 15, mass: 0.3, } as const; /** Dragged handles and fills (sliders) — critically damped `useSpring` config, * so the value follows the pointer butterily and never rebounds off an end. */ export const SPRING_GLIDE = { stiffness: 700, damping: 50, mass: 0.5, } as const; 51:T512,"use client"; import { useCallback, useState } from "react"; import { getFaviconUrl } from "@/lib/favicon"; /** * Resolves a site favicon and drops it once it is known to be unusable, so * callers can draw their own glyph instead of a broken image. Plenty of sites * answer `/favicon.ico` with a 403 or 404, and `onError` is not enough to catch * it: an image the browser starts loading from server-rendered HTML usually * fails before React attaches a handler, and that event is never replayed. * `decode()` settles on the image's final state instead of relying on an event * firing at the right moment. */ export function useFavicon(url?: string) { const resolved = url ? getFaviconUrl(url) : null; const [failedSrc, setFailedSrc] = useState(null); const src = resolved && resolved !== failedSrc ? resolved : null; const ref = useCallback( (img: HTMLImageElement | null) => { if (!img || !src) return; let released = false; img.decode().catch(() => { if (!released) setFailedSrc(src); }); // The node is going away or the source changed; a late rejection then // describes an image we are no longer showing. return () => { released = true; }; }, [src], ); return { src, ref }; } 4a:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[["$","ul",null,{"className":"flex min-w-0 flex-wrap gap-2","aria-label":"Package dependencies","children":[["$","li","clsx",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/clsx","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"clsx"}]]}]}],["$","li","lucide-react",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/lucide-react","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"lucide-react"}]]}]}],["$","li","motion",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/motion","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"motion"}]]}]}],["$","li","tailwind-merge",{"className":"min-w-0 max-w-full","children":["$","a",null,{"href":"https://www.npmjs.com/package/tailwind-merge","target":"_blank","rel":"noopener noreferrer","className":"flex max-w-full min-w-0 items-center gap-1.5 rounded-md border px-2 py-1.5 text-xs","children":[["$","svg",null,{"viewBox":"0 0 24 24","className":"size-3 shrink-0","children":["$","path",null,{"d":"M1.763 0C.786 0 0 .786 0 1.763v20.474C0 23.214.786 24 1.763 24h20.474c.977 0 1.763-.786 1.763-1.763V1.763C24 .786 23.214 0 22.237 0zM5.13 5.323l13.837.019-.009 13.836h-3.464l.01-10.382h-3.456L12.04 19.17H5.113z","fill":"currentColor"}]}],["$","span",null,{"className":"min-w-0 break-all text-xs font-medium","children":"tailwind-merge"}]]}]}]]}],["$","$L4b",null,{"namespace":"@agentui","registryDependencies":[]}]]}],null]}],["$","$L4c",null,{"files":[{"path":"components/agents/streaming-response.tsx","content":"$4d","type":"registry:component","target":"@components/agents/streaming-response.tsx"},{"path":"components/agents/agent-disclosure.tsx","content":"$4e","type":"registry:component","target":"@components/agents/agent-disclosure.tsx"},{"path":"components/agents/citations.tsx","content":"$4f","type":"registry:component","target":"@components/agents/citations.tsx"},{"path":"lib/ease.ts","content":"$50","type":"registry:lib","target":"@lib/ease.ts"},{"path":"lib/utils.ts","content":"import { clsx, type ClassValue } from \"clsx\"\nimport { twMerge } from \"tailwind-merge\"\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","type":"registry:lib","target":"@lib/utils.ts"},{"path":"lib/hooks/use-favicon.ts","content":"$51","type":"registry:hook","target":"@lib/hooks/use-favicon.ts"},{"path":"lib/favicon.ts","content":"/** Resolve a website URL to its conventional root favicon location. */\nexport function getFaviconUrl(value: string) {\n try {\n return new URL(\"/favicon.ico\", value).toString();\n } catch {\n return null;\n }\n}\n","type":"registry:lib","target":"@lib/favicon.ts"}],"className":"h-[70svh] min-h-80"}]]}]