{{--
    Dropdown Item Component - LucentUI Theme
    Migrated from AdminLTE to Tailwind
--}}

@props([
    'href' => null,
    'icon' => null,
    'variant' => 'default',
    'disabled' => false,
])

@php
    $tag = $href ? 'a' : 'button';
    
    $baseClasses = 'flex items-center gap-2.5 w-full px-3 py-2 text-sm text-left no-underline bg-transparent border-0 rounded-md cursor-pointer transition-colors duration-200';
    
    $variantClasses = match($variant) {
        'danger' => 'text-error hover:bg-error/10 focus:bg-error/10',
        'success' => 'text-success hover:bg-success/10 focus:bg-success/10',
        default => 'text-primary hover:bg-primary/5 hover:text-primary-hover focus:bg-primary/5 focus:text-primary-hover dark:text-base/80 dark:hover:bg-white/5',
    };
    
    $disabledClasses = $disabled ? 'pointer-events-none opacity-50' : '';
@endphp

<{{ $tag }}
    @if($href) href="{{ $href }}" @endif
    @if($tag === 'button') type="button" @endif
    @if($disabled) disabled @endif
    {{ $attributes->class([
        $baseClasses,
        $variantClasses,
        $disabledClasses,
    ]) }}
>
    @if($icon)
        <x-dynamic-component :component="$icon" class="shrink-0 w-4.5 h-4.5" />
    @endif
    <span class="flex-1">{{ $slot }}</span>
</{{ $tag }}>