Resultado de herramienta.

<section class="ui-sample ui-ai" data-tool-result="true"><header><strong>Resultado de buscar_datos</strong><span class="badge">842 filas</span></header><pre><code>{&quot;region&quot;:&quot;Valparaíso&quot;,&quot;tasa&quot;:8.4}</code></pre><p>Fuente: INE · huella 4e2a…78bd</p></section>

<section class="ui-sample ui-ai border border-slate-300 bg-white p-4 text-slate-950 grid gap-3" data-tool-result="true"><header class="flex flex-wrap items-center justify-between gap-3"><strong>Resultado de buscar_datos</strong><span class="badge">842 filas</span></header><pre class="overflow-x-auto border border-slate-300 bg-slate-50 p-3"><code>{&quot;region&quot;:&quot;Valparaíso&quot;,&quot;tasa&quot;:8.4}</code></pre><p>Fuente: INE · huella 4e2a…78bd</p></section>

export interface ToolResultProps {
  /** Qué herramienta devolvió el resultado («Resultado de buscar_datos»). */
  title?: string;
  /** Tamaño del resultado o error («842 filas», «Error 503»); se muestra como etiqueta y vacío lo oculta. */
  status?: string;
  /** Tono de la etiqueta de estado; por defecto se deduce del texto (error o falló: `err`; parcial o truncado: `warn`; tamaño u otro: `neutral`). */
  statusTone?: "ok" | "warn" | "err" | "neutral";
  /** Respuesta de la herramienta, o un extracto, tal como llegó; vacía oculta el bloque de código. */
  code?: string;
  /** Fuente y huella del resultado, o si se puede reintentar («Fuente: INE · huella 4e2a…78bd»); vacío lo oculta. */
  description?: string;
  className?: string;
}

const TOOL_RESULT_TONOS: [string, "ok" | "warn" | "err" | "neutral"][] = [
  ["error", "err"],
  ["falló", "err"],
  ["parcial", "warn"],
  ["truncad", "warn"],
];

function claseEstado(status: string, tone?: "ok" | "warn" | "err" | "neutral") {
  const texto = status.toLowerCase();
  const tono = tone ?? TOOL_RESULT_TONOS.find(([clave]) => texto.startsWith(clave))?.[1] ?? "neutral";
  return tono === "neutral" ? "badge" : `badge badge--${tono}`;
}

/**
 * Resultado que una herramienta devuelve a un agente de IA, con su tamaño o error, la respuesta recibida y la fuente que la respalda; se usa después de `ToolCall` para mostrar qué devolvió.
 *
 * El tamaño o el error va en texto dentro de una etiqueta con tono (`badge`), con el mismo criterio que `ToolCall`: un error se ve en `err`, no igual que un tamaño.
 *
 * @example <ToolResult status="842 filas" code={'{"region":"Valparaíso","tasa":8.4}'} description="Fuente: INE · huella 4e2a…78bd" />
 * @example <ToolResult status="Error 503" code={'{"error":"origen_no_disponible"}'} description="Fuente: API del INE · reintento disponible" />
 */
export function ToolResult({
  title = "Resultado de buscar_datos",
  status = "842 filas",
  statusTone,
  code = '{"region":"Valparaíso","tasa":8.4}',
  description = "Fuente: INE · huella 4e2a…78bd",
  className,
}: ToolResultProps) {
  return (
    <section className={["ui-ai", className].filter(Boolean).join(" ")} data-tool-result>
      <header>
        <strong>{title}</strong>
        {status ? <span className={claseEstado(status, statusTone)}>{status}</span> : null}
      </header>
      {code ? <pre><code>{code}</code></pre> : null}
      {description ? <p>{description}</p> : null}
    </section>
  );
}