@props(['type' => 'info'])
@php
$icon= [
    'info' => 'fa-solid fa-check text-white/40',
    'error' => 'fa-solid fa-triangle-exclamation text-white/40',
][$type];
$base = [
    'info' => 'bg-primary-700 ',
    'error' => 'bg-danger-800',
][$type];
$text = [
    'info' => '00border-primary-800/40 text-primary-800',
    'error' => '00border-danger-800/40 text-danger-800',
][$type];
@endphp
{{--
<div {{ $attributes->merge(['class' => "flex items-center justify-start "]) }}>
    <div class="rounded-l-md {{$mark}} p-2.5">
        <i class="{{$icon}}"></i>
    </div>
    <div class="flex-1 rounded-r-md bg-white test-sm {{$text}} p-2 border-l-0">
	{{$slot}}
    </div>
</div>
--}}
<div {{ $attributes->merge(['class' => "message-wrap flex items-center justify-start rounded-md max-w-fit {$base}"]) }}>
    <div class="w-12 text-center">
        <i class="text-lg {{$icon}}"></i>
    </div>
    <div class="message-contents flex-1 rounded-r-md bg-white text-sm py-2 pl-4 pr-10 border {{$text}} m-[0.0625rem] border-l-0">
	{{$slot}}
    </div>
</div>