@props(['type' => 'button', 'color' => 'bg-indigo-600 hover:bg-indigo-500 focus-visible:outline-indigo-600'])

<button type="{{ $type }}" {{ $attributes->merge(['class' => "inline-flex items-center gap-x-1.5 rounded-md px-3 py-2 text-sm font-semibold text-white shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 $color"]) }}>
    {{ $slot }}
</button>