fix(CommandPalette): activate next option on mounted

nuxt · Nov 16, 2023 · 0837039 · 0837039
1 parent a989dab
commit 0837039
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/src/runtime/components/navigation/CommandPalette.vue b/src/runtime/components/navigation/CommandPalette.vue
@@ -189,7 +189,7 @@ export default defineComponent({
 
     onMounted(() => {
       if (props.autoselect) {
-        activateFirstOption()
+        activateNextOption()
       }
     })
 
@@ -319,6 +319,13 @@ export default defineComponent({
       }, 0)
     }
 
+    function activateNextOption () {
+      setTimeout(() => {
+        // https://github.com/tailwindlabs/headlessui/blob/6fa6074cd5d3a96f78a2d965392aa44101f5eede/packages/%40headlessui-vue/src/components/combobox/combobox.ts#L769
+        comboboxInput.value?.$el.dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }))
+      }, 0)
+    }
+
     function onSelect (option: Command | Command[]) {
       emit('update:modelValue', option, { query: query.value })