shentao / vue-multiselect

Universal select/multiselect/tagging component for Vue.js
https://vue-multiselect.js.org/
MIT License
6.66k stars 989 forks source link

Issue: Keyboard navigation broken when using `v-slot:beforeList` #1783

Open LeGoffMael opened 1 month ago

LeGoffMael commented 1 month ago

Thank you for building this great component !

Reproduction Link

vue 3.3.4, vue-multiselect 3.0.0

The v-slot:beforeList slot is actually not displayed in jsfiddle (no idea why), so it doesn't reproduce the error. But the code to reproduce the error on local is the same https://jsfiddle.net/mlegoff10/Lu4t9xzh/

In the following video v-slot:beforeList's height is fixed to 40px and :option-height is kept to default.

https://github.com/user-attachments/assets/0a063885-3304-4822-a9f9-1bb1142f33ba

Steps to reproduce

Add a v-slot:beforeList into the multiselect component. When navigating through the options list using the keyboard the bottom is cut-out.

Expected behaviour

The library should take into account the v-slot:beforeList height (maybe by considering it to be equal to :option-height value) The keyboard navigation should works properly even with a v-slot:beforeList.

Actual behaviour

The keyboard navigation does not work properly when using v-slot:beforeList.