@props(['active'])

@php
$classes = ($active ?? false) ? 'group flex items-center p-2 text-base font-medium bg-primary-600 rounded-lg
text-white
hover:bg-primary-500
dark:hover:bg-primary-500 group' : 'flex items-center p-2 text-base font-medium text-gray-900 rounded-lg dark:text-white
hover:bg-gray-100
dark:hover:bg-gray-700 group';

$classes_svg = ($active ?? false) ? "w-6 h-6 text-white" : "w-6 h-6 text-gray-500 transition duration-75
dark:text-gray-400 group-hover:text-gray-900 dark:group-hover:text-white";
@endphp

<li>
    <a {{ $attributes->merge(['class' => $classes]) }}>
        <svg aria-hidden="true" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" {{
            $attributes->merge(['class' => $classes_svg]) }}>
            {{ $svg }}
        </svg>
        {{ $slot }}
    </a>
</li>