@props([
    'items' => [],
    'divider' => true,
])

<div class="fluent-list-group {{ $divider ? 'has-divider' : '' }}">
    @foreach($items as $item)
        @php
            // Resolve URL priority: route > url > action
            $url = null;

            if (!empty($item['route'])) {
                $url = isset($item['params'])
                    ? route($item['route'], $item['params'])
                    : route($item['route']);
            } elseif (!empty($item['url'])) {
                $url = $item['url'];
            }

            $isClickable = $url || !empty($item['action']);
        @endphp

        @if($url)
            <a href="{{ $url }}" class="fluent-list-item {{ $isClickable ? 'is-clickable' : '' }}">
        @else
            <div
                class="fluent-list-item {{ $isClickable ? 'is-clickable' : '' }}"
                @if(!empty($item['action']))
                    wire:click="{{ $item['action'] }}"
                @endif
            >
        @endif

            {{-- ICON --}}
            @if(!empty($item['icon']))
                <div class="fluent-list-icon">
                    <x-fluent-icon :name="$item['icon']" />
                </div>
            @endif

            {{-- CONTENT --}}
            <div class="fluent-list-content">
                <div class="fluent-list-title">
                    {{ $item['title'] ?? '-' }}
                </div>

                @if(!empty($item['subtitle']))
                    <div class="fluent-list-subtitle">
                        {{ $item['subtitle'] }}
                    </div>
                @endif
            </div>

            {{-- RIGHT SLOT --}}
            @if(!empty($item['right']))
                <div class="fluent-list-right">
                    {!! $item['right'] !!}
                </div>
            @endif

        @if($url)
            </a>
        @else
            </div>
        @endif

    @endforeach
</div>