From 1b3c919222a4002d84dd968f93bcf9d615e412bc Mon Sep 17 00:00:00 2001
From: Bruno Belloni <14021404+brunobelloni@users.noreply.github.com>
Date: Fri, 20 Dec 2024 08:21:05 -0300
Subject: [PATCH] feat(CommandPalette): add `autofocus` prop (#2942)

---
 src/runtime/components/CommandPalette.vue | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/runtime/components/CommandPalette.vue b/src/runtime/components/CommandPalette.vue
index 7d5a0f4b..bba80e1c 100644
--- a/src/runtime/components/CommandPalette.vue
+++ b/src/runtime/components/CommandPalette.vue
@@ -68,6 +68,11 @@ export interface CommandPaletteProps<G, T> extends Pick<ListboxRootProps, 'multi
    * @defaultValue 'Type a command or search...'
    */
   placeholder?: InputProps['placeholder']
+  /**
+   * Automatically focus the input when component is mounted.
+   * @defaultValue true
+   */
+  autofocus?: boolean
   /**
    * Display a close button in the input (useful when inside a Modal for example).
    * `{ size: 'md', color: 'neutral', variant: 'ghost' }`{lang="ts-type"}
@@ -141,7 +146,8 @@ import UInput from './Input.vue'
 const props = withDefaults(defineProps<CommandPaletteProps<G, T>>(), {
   modelValue: '',
   placeholder: 'Type a command or search...',
-  labelKey: 'label'
+  labelKey: 'label',
+  autofocus: true
 })
 const emits = defineEmits<CommandPaletteEmits<T>>()
 const slots = defineSlots<CommandPaletteSlots<G, T>>()
@@ -239,7 +245,7 @@ const groups = computed(() => {
     <ListboxFilter v-model="searchTerm" as-child>
       <UInput
         variant="none"
-        autofocus
+        :autofocus="autofocus"
         size="lg"
         v-bind="inputProps"
         :icon="icon || appConfig.ui.icons.search"