@props(['variant' => 'info', 'delay' => 2000])
@php

switch($variant) {
case 'success':
    $variant_classes = 'text-green-800 bg-green-200 border-green-300';
    break;
case 'warning':
    $variant_classes = 'text-yellow-800 bg-yellow-200 border-yellow-300';
    break;
case 'danger':
    $variant_classes = 'text-red-800 bg-red-200 border-red-300';
    break;
case 'info':
default:
    $variant_classes = 'text-blue-800 bg-blue-200 border-blue-300';
}

@endphp

<div x-data="{ show: true }"
    x-show="show"
    x-init="setTimeout(() => show = false, {{ $delay }})"
    {!! $attributes->merge(['class' => "w-full px-4 py-2 rounded border $variant_classes"]) !!}>

    {{ $slot }}
</div>