@props(['type' => 'default'])

@php
    $classes = match($type) {
        'success'        => 'bg-green-100 text-green-800',
        'danger', 'error'=> 'bg-red-100 text-red-800',
        'warning'        => 'bg-amber-100 text-amber-800',
        'info'           => 'bg-blue-100 text-blue-800',
        'primary'        => 'bg-indigo-100 text-indigo-800',
        default          => 'bg-slate-100 text-slate-700',
    };
@endphp

<span {{ $attributes->merge(['class' => "inline-flex items-center px-2 py-0.5 rounded-full text-xs font-medium {$classes}"]) }}>
    {{ $slot }}
</span>