[v1.0.23] Multi select with tooltip: only opens on click between 'options selected' and the chevron down icon.

[lotje-kinable]

Hi!

I want to display the selected options with a tooltip. It works, but I need to click in between the 'options selected' and the chevron down icon, while without the tooltip, I can click anywhere to open the multi select. I've provided a screencast and a Volt component, for easy copy-paste.

multi.select.with.tooltip.mov

<?php
use Livewire\Attributes\{Layout, Title};
use Livewire\Volt\Component;

new
class extends Component {
    public $options;
    public $optionIds;

    public function mount()
    {

    $this->options = collect([
            (object)['id' => 1, 'name' => 'foo', 'price' => '10,0'],
            (object)['id' => 2, 'name' => 'bar', 'price' => '20,0'],
            (object)['id' => 3, 'name' => 'baz', 'price' => '30,0'],
        ]);
    }

}; ?>

<div class="space-y-28">

    <div>
        <flux:select wire:model='optionIds' variant="listbox" placeholder='Select option' multiple >
            @foreach($options as $option)
                <flux:option  wire:key="select-option-{{ $option->id }}" value="{{ $option->id }}">{{ $option->name }}</flux:option>
            @endforeach
        </flux:select>
    </div>

    <div>
        <flux:tooltip content="selected values">
            <flux:select wire:model='optionIds' variant="listbox" placeholder='Select options with tooltip' multiple >
                @foreach($options as $option)
                    <flux:option  wire:key="select-option-{{ $option->id }}" value="{{ $option->id }}">{{ $option->name }}</flux:option>
                @endforeach
            </flux:select>
        </flux:tooltip>
    </div>

</div>

Thanks in advance!