diff --git a/packages/core/src/Combobox/ComboboxInput.vue b/packages/core/src/Combobox/ComboboxInput.vue index 6675af13b..c68841a2f 100644 --- a/packages/core/src/Combobox/ComboboxInput.vue +++ b/packages/core/src/Combobox/ComboboxInput.vue @@ -13,6 +13,7 @@ export interface ComboboxInputProps extends ListboxFilterProps { @@ -33,7 +36,7 @@ const nonce = useNonce(propNonce) // `selectedItem.offsetTop` in calculations, the offset is relative to the viewport // (independent of the scrollUpButton). position: 'relative', - flex: 1, + flex: rootContext.isVirtual.value ? undefined : 1, overflow: 'auto', }" > diff --git a/packages/core/src/Combobox/ComboboxVirtualizer.vue b/packages/core/src/Combobox/ComboboxVirtualizer.vue index af5fa0af8..5e9d775fe 100644 --- a/packages/core/src/Combobox/ComboboxVirtualizer.vue +++ b/packages/core/src/Combobox/ComboboxVirtualizer.vue @@ -3,17 +3,14 @@ export interface ComboboxVirtualizerProps { /> - - - - + + + - - - - - - {{ option.label }} - - - - + + + + {{ option.label }} + + + diff --git a/packages/core/src/Listbox/ListboxRoot.vue b/packages/core/src/Listbox/ListboxRoot.vue index 19fa80798..68a10c1bc 100644 --- a/packages/core/src/Listbox/ListboxRoot.vue +++ b/packages/core/src/Listbox/ListboxRoot.vue @@ -179,8 +179,12 @@ function highlightItem(value: T) { } function onKeydownEnter(event: KeyboardEvent) { - if (highlightedElement.value) + if (highlightedElement.value) { + event.preventDefault() + event.stopPropagation() + highlightedElement.value.click() + } } function onKeydownTypeAhead(event: KeyboardEvent) { @@ -293,14 +297,12 @@ function handleMultipleReplace(event: KeyboardEvent, targetEl: HTMLElement) { } async function highlightSelected(event?: Event) { + await nextTick() if (isVirtual.value) { - nextTick(() => { - // Trigger on nextTick for Virtualizer to be mounted - virtualFocusHook.trigger(event) - }) + // Trigger on nextTick for Virtualizer to be mounted + virtualFocusHook.trigger(event) } else { - await nextTick() const collection = getCollectionItem() const item = collection.find(i => i.dataset.state === 'checked') if (item) diff --git a/packages/core/src/Listbox/ListboxVirtualizer.vue b/packages/core/src/Listbox/ListboxVirtualizer.vue index caefdcf41..c1e008623 100644 --- a/packages/core/src/Listbox/ListboxVirtualizer.vue +++ b/packages/core/src/Listbox/ListboxVirtualizer.vue @@ -7,11 +7,18 @@ export interface ListboxVirtualizerProps string } + +export interface ListboxVirtualizerSlots { + option: T + virtualizer: Virtualizer + virtualItem: VirtualItem + +}