@props([
    'icon' => null,
    'label' => '',
    'value' => '',
    'variant' => 'default',
    'progress' => null,
])

@php
    $badgeClasses = [
        'info-badge',
        'info-badge--' . $variant,
    ];
@endphp

<div {{ $attributes->merge(['class' => implode(' ', $badgeClasses)]) }}>
    @if($icon)
        <div class="info-badge-icon">
            <x-ui.nicon :name="$icon" />
        </div>
    @endif
    
    <div class="info-badge-content">
        @if($label)
            <div class="info-badge-label">{{ $label }}</div>
        @endif
        
        @if($value)
            <div class="info-badge-value">{{ $value }}</div>
        @endif
        
        @if($progress !== null)
            <div class="quality-progress">
                <div class="quality-progress-bar" style="width: {{ $progress }}%"></div>
            </div>
        @endif
        
        {{ $slot }}
    </div>
    
    @isset($editButton)
        {{ $editButton }}
    @endisset
</div>