import * as React from "react"; import { cn } from "@/lib/utils"; /** * GrokTool — a Grok action line. * * Two captured forms: * 1. Compact: `read app/page.tsx` (dim verb, blue path) * 2. Card: `┃ ◆ Run Write … [hooks: 3]` (left gutter + diamond) */ const GREEN = "#00ff00"; // 38;5;10 — active Run tool cards const MUTED = "#8b8b90"; const DIM = "#6c6c6c"; const BLUE = "#8db0ff"; const SILVER = "#c0c0c0"; export function GrokTool({ verb, path, meta, variant = "line", title, hooks, className, children, }: { verb?: string; path?: string; meta?: string; variant?: "line" | "card"; /** Card title, e.g. "Run Write permission probe output file". */ title?: string; hooks?: number; className?: string; children?: React.ReactNode; }) { if (variant === "card") { const heading = title ?? [verb, path].filter(Boolean).join(" "); return (

◆ {heading} {hooks != null ? ( [hooks: {hooks}] ) : null}

{children ? (

{children}

) : null}

); } return (

{verb ? {verb} : null} {path ? ( {path} ) : null} {meta ? {meta} : null} {children}

); }