{{--
Badge Component
Usage:
Default
Success
Warning
Error
Info
Small
Large
--}}
@props([
'type' => 'default',
'size' => 'md',
])
@php
$types = [
'default' => 'bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-200',
'success' => 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-200',
'warning' => 'bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-200',
'error' => 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-200',
'info' => 'bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-200',
'primary' => 'bg-primary-100 text-primary-800 dark:bg-primary-900/30 dark:text-primary-200',
];
$sizes = [
'sm' => 'px-2 py-0.5 text-xs',
'md' => 'px-2.5 py-0.5 text-sm',
'lg' => 'px-3 py-1 text-base'
];
$typeClasses = $types[$type] ?? $types['default'];
$sizeClasses = $sizes[$size] ?? $sizes['md'];
@endphp
merge(['class' => "inline-flex items-center rounded-full font-medium $typeClasses $sizeClasses"]) }}>
{{ $slot }}