51: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"] 52: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"] 53:T751,.cr-tool-card { display: grid; /* minmax(0, …): long input or output scrolls inside its block instead of widening the card. */ grid-template-columns: minmax(0, 1fr); gap: var(--cr-space-2); padding: var(--cr-space-4); border-radius: var(--cr-radius-lg); color: var(--cr-color-text-default); font-family: var(--cr-font-family-sans); font-size: var(--cr-font-size-md); } .cr-tool-card[data-status='error'] { border-color: var(--cr-color-status-failed-fg); } .cr-tool-card__section > summary { width: fit-content; padding: 2px var(--cr-space-2); border-radius: var(--cr-radius-full); color: var(--cr-color-text-muted); font-size: var(--cr-font-size-sm); cursor: pointer; } .cr-tool-card__section > summary:hover { background: var(--cr-color-bg-subtle); } .cr-tool-card__section > summary:focus-visible { outline: var(--cr-focus-width) solid var(--cr-color-focus); outline-offset: var(--cr-focus-offset); } .cr-tool-card__section[open] > summary { margin-bottom: var(--cr-space-2); } .cr-tool-card__section .cr-code-block { max-height: 240px; } .cr-tool-card__note { display: flex; align-items: center; gap: var(--cr-space-2); margin: 0; color: var(--cr-color-text-muted); font-size: var(--cr-font-size-sm); } .cr-tool-card__error { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--cr-space-2); padding: var(--cr-space-2) var(--cr-space-3); border-radius: var(--cr-radius-md); background: var(--cr-color-status-failed-bg); color: var(--cr-color-status-failed-fg); font-size: var(--cr-font-size-sm); } .cr-tool-card__error p { margin: 0; overflow-wrap: anywhere; } .cr-tool-card__attempts { margin: 0; padding: 0; list-style: none; color: var(--cr-color-text-muted); font-size: var(--cr-font-size-sm); overflow-wrap: anywhere; } 54:Te42,'use client'; import { Button } from '@/components/creance/button/Button'; import { Code } from '@/components/creance/code/Code'; import { Spinner } from '@/components/creance/spinner/Spinner'; import { ToolCallHeader, type ToolCallStatus } from '@/components/creance/tool-call-header/ToolCallHeader'; import { cx } from '@/lib/creance/cx'; import { AlertIcon, RetryIcon } from '@/lib/creance/icons'; import { LiveRegion } from '@/lib/creance/LiveRegion'; import './ToolCallCard.css'; export interface ToolCallCardProps { tool: string; status: ToolCallStatus; /** Arguments the agent passed. Shown as collapsible JSON. */ input?: unknown; output?: unknown; error?: string | undefined; startedAt?: number | undefined; endedAt?: number | undefined; attempt?: number; /** Earlier attempts that failed, oldest first, so a retried call still shows what went wrong. */ previousAttempts?: Array<{ attempt: number; error?: string | undefined }>; /** Shows a Retry button on error. Omit it when the agent retries on its own. */ onRetry?: () => void; /** Hide Retry when the backend says the failure is permanent. Default true. */ retryable?: boolean | undefined; /** Open the input section initially. */ defaultOpen?: boolean; headingLevel?: 2 | 3 | 4 | 5 | 6; /** Announce failures in a live region. Turn off when a parent (like RunTimeline) already announces them. */ announce?: boolean; className?: string; } function json(value: unknown): string { return typeof value === 'string' ? value : JSON.stringify(value, null, 2); } export function ToolCallCard({ tool, status, input, output, error, startedAt, endedAt, attempt = 1, previousAttempts = [], onRetry, retryable = true, defaultOpen = false, headingLevel = 3, announce = true, className, }: ToolCallCardProps) { return (

{previousAttempts.length > 0 && (

Attempt {a.attempt} failed{a.error ? `: ${a.error}` : ''}

)} {input !== undefined && (

Input

{json(input)}

)} {status === 'pending' &&

Waiting to start

} {status === 'running' && (

Running

)} {status === 'success' && output !== undefined && (

Result

{json(output)}

)} {status === 'error' && (

Error: {error ?? 'The tool call failed.'}

{onRetry && retryable && ( )}

)} {announce && }

); } 50:["$","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":[null,["$","$L51",null,{"namespace":"@creance","registryDependencies":["https://creance.pages.dev/r/button.json","https://creance.pages.dev/r/code.json","https://creance.pages.dev/r/creance-base.json","https://creance.pages.dev/r/spinner.json","https://creance.pages.dev/r/tool-call-header.json"]}]]}],null]}],["$","$L52",null,{"files":[{"path":"tool-call-card/ToolCallCard.css","content":"$53","type":"registry:file","target":"@components/creance/tool-call-card/ToolCallCard.css"},{"path":"tool-call-card/ToolCallCard.tsx","content":"$54","type":"registry:ui","target":"@components/creance/tool-call-card/ToolCallCard.tsx"}],"className":"h-[70svh] min-h-80"}]]}]