Ai Tool Call code

@props([
    'label' => 'Tool call',
    'status' => 'complete',
    'detail' => null,
    'time' => null,
])

@php
    /*
    | Single agent tool invocation row for activity feeds.
    |
    | status: pending, running, complete, failed
    |
    | Usage:
    |   <x-ui.ai-tool-call label="Read tests/Feature/WorkflowComponentsTest.php" status="complete" time="4s" />
    */
    $statusStyles = [
        'pending' => 'bg-gray-200 dark:bg-gray-700',
        'running' => 'bg-brand-500 animate-pulse',
        'complete' => 'bg-brand-600',
        'failed' => 'bg-red-500',
    ];

    $statusLabels = [
        'pending' => 'Pending',
        'running' => 'Running',
        'complete' => 'Done',
        'failed' => 'Failed',
    ];
@endphp

<li {{ $attributes->merge(['class' => 'flex items-start gap-3 rounded-xl border border-gray-200 bg-white px-3 py-2.5 dark:border-gray-800 dark:bg-gray-900']) }}>
    <span class="mt-1.5 h-2 w-2 shrink-0 rounded-full {{ $statusStyles[$status] ?? $statusStyles['pending'] }}" aria-hidden="true"></span>

    <div class="min-w-0 flex-1">
        <div class="flex flex-col gap-1 sm:flex-row sm:items-start sm:justify-between sm:gap-3">
            <p @class([
                'min-w-0 break-words text-sm leading-6',
                'font-medium text-gray-900 dark:text-gray-100' => $status === 'running',
                'text-gray-800 dark:text-gray-200' => $status !== 'running',
            ])>
                {{ $label }}
            </p>

            <span class="shrink-0 text-xs text-gray-400 dark:text-gray-500">
                {{ $time ?: ($statusLabels[$status] ?? ucfirst($status)) }}
            </span>
        </div>

        @if ($detail)
            <p class="mt-1 text-xs leading-5 text-gray-500 dark:text-gray-400">{{ $detail }}</p>
        @endif

        @if (trim($slot) !== '')
            <div class="mt-2 text-sm text-gray-600 dark:text-gray-400">{{ $slot }}</div>
        @endif
    </div>
</li>