@props([
    'name' => null,
    'src' => null,
    'size' => 'md',
])

@php
    $sizes = [
        'sm' => 'h-8 w-8 text-xs',
        'md' => 'h-10 w-10 text-sm',
        'lg' => 'h-12 w-12 text-base',
    ];
    $sizeClass = $sizes[$size] ?? $sizes['md'];

    $initials = '';
    if ($name) {
        $parts = preg_split('/\s+/', trim($name)) ?: [];
        $initials = strtoupper(substr($parts[0] ?? '', 0, 1) . substr($parts[1] ?? '', 0, 1));
        if ($initials === '') {
            $initials = strtoupper(substr($name, 0, 2));
        }
    }
@endphp

@if ($src)
    <img
        src="{{ $src }}"
        alt="{{ $name ?? 'Avatar' }}"
        {{ $attributes->merge(['class' => "{$sizeClass} rounded-full object-cover bg-[var(--color-bg)]"]) }}
    >
@else
    <span
        aria-hidden="{{ $name ? 'false' : 'true' }}"
        {{ $attributes->merge([
            'class' => "{$sizeClass} inline-flex items-center justify-center rounded-full bg-[color-mix(in_srgb,var(--color-primary)_15%,transparent)] font-semibold text-[var(--color-primary)]",
        ]) }}
    >
        {{ $initials ?: '?' }}
    </span>
@endif