@props([
    'data' => [],
    'model' => '',
    'valueModel' => null
])

@if(count($data))
<ul class="dropdown-menu p-0 mt-1" x-bind:class="{'show': focus}">
    @foreach($data as $category => $results)
        @if($category)
        <li class="dropdown-item bg-light" style="border-bottom: 1px solid #dadada">
            {{ $category }}
        </li>
        @endif
        @foreach($results as $result)
        <li>
            <a 
                @class(["dropdown-item py-1", "ps-4" => $category])
                x-on:click="focus=false"
                wire:click="setAutocompleteResult(
                    '{{ $model }}',
                    '{{ $result['id']?? '' }}',
                    '{{ $valueModel }}',
                    '{{ $result['value']?? '' }}',
                    '{{ $result['label']?? '' }}')"
            >
                {{ $result['label']?? $result['value']?? '' }}
            </a>
        </li>
        @endforeach
    @endforeach
</ul>
@endif