How can Laravel livewire hide the list when no input is active?

Question

Laravel

Using livewire in Laravel 7

<input type="text" wire:model="query">
        <ul>
            @foreach($tops as $top)
                <li>
                    <p>
                        {{ $top->Name }}
                    </p>
                </li>
            @endforeach
        </ul>

How to hide the list while there is no focus on the input. Display the list when there is focus and values ​​are being entered, and hide again when the input is no longer focused?

Answer 1

Jquery to help you - https://basicweb.ru/jquery/jquery_event_focus.php