@props(['field' => null, 'value' => null, 'label' => null, 'color' => null, 'dot' => false, 'size' => 'md'])

@php
    $resolvedLabel = $label ?? ($field ? \App\Support\Lookup::label($field, $value) : (string) $value);
    $resolvedColor = $color ?? ($field ? \App\Support\Lookup::color($field, $value) : 'gray');

    $palette = [
        'gray' => 'bg-slate-100 text-slate-700 ring-slate-200',
        'slate' => 'bg-slate-100 text-slate-700 ring-slate-200',
        'red' => 'bg-red-50 text-red-700 ring-red-200',
        'orange' => 'bg-orange-50 text-orange-700 ring-orange-200',
        'amber' => 'bg-amber-50 text-amber-800 ring-amber-200',
        'yellow' => 'bg-yellow-50 text-yellow-800 ring-yellow-200',
        'green' => 'bg-emerald-50 text-emerald-700 ring-emerald-200',
        'emerald' => 'bg-emerald-50 text-emerald-700 ring-emerald-200',
        'teal' => 'bg-teal-50 text-teal-700 ring-teal-200',
        'cyan' => 'bg-cyan-50 text-cyan-700 ring-cyan-200',
        'blue' => 'bg-blue-50 text-blue-700 ring-blue-200',
        'indigo' => 'bg-indigo-50 text-indigo-700 ring-indigo-200',
        'purple' => 'bg-purple-50 text-purple-700 ring-purple-200',
        'violet' => 'bg-violet-50 text-violet-700 ring-violet-200',
        'pink' => 'bg-pink-50 text-pink-700 ring-pink-200',
        'rose' => 'bg-rose-50 text-rose-700 ring-rose-200',
    ];

    $dotPalette = [
        'gray' => 'bg-slate-400', 'slate' => 'bg-slate-400', 'red' => 'bg-red-500', 'orange' => 'bg-orange-500',
        'amber' => 'bg-amber-500', 'yellow' => 'bg-yellow-500', 'green' => 'bg-emerald-500', 'emerald' => 'bg-emerald-500',
        'teal' => 'bg-teal-500', 'cyan' => 'bg-cyan-500', 'blue' => 'bg-blue-500', 'indigo' => 'bg-indigo-500',
        'purple' => 'bg-purple-500', 'violet' => 'bg-violet-500', 'pink' => 'bg-pink-500', 'rose' => 'bg-rose-500',
    ];

    $sizeClass = $size === 'sm' ? 'px-2 py-0.5 text-[11px]' : 'px-2.5 py-1 text-xs';
@endphp

<span {{ $attributes->merge(['class' => "inline-flex items-center gap-1.5 whitespace-nowrap rounded-full font-medium ring-1 ring-inset {$sizeClass} ".($palette[$resolvedColor] ?? $palette['gray'])]) }}>
    @if ($dot)
        <span class="h-1.5 w-1.5 rounded-full {{ $dotPalette[$resolvedColor] ?? $dotPalette['gray'] }}"></span>
    @endif
    {{ $resolvedLabel }}
</span>