@props(['color' => 'slate'])
@php
    $colors = [
        'slate' => 'bg-slate-100 text-slate-700 ring-slate-200',
        'indigo' => 'bg-indigo-50 text-indigo-700 ring-indigo-200',
        'emerald' => 'bg-emerald-50 text-emerald-700 ring-emerald-200',
        'amber' => 'bg-amber-50 text-amber-800 ring-amber-200',
        'red' => 'bg-red-50 text-red-700 ring-red-200',
        'violet' => 'bg-violet-50 text-violet-700 ring-violet-200',
    ];
@endphp
<span {{ $attributes->merge(['class' => 'inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium ring-1 ring-inset '.$colors[$color]]) }}>{{ $slot }}</span>