mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-30 03:38:54 +01:00
feat(CommandPalette): add autofocus prop (#2942)
This commit is contained in:
@@ -68,6 +68,11 @@ export interface CommandPaletteProps<G, T> extends Pick<ListboxRootProps, 'multi
|
|||||||
* @defaultValue 'Type a command or search...'
|
* @defaultValue 'Type a command or search...'
|
||||||
*/
|
*/
|
||||||
placeholder?: InputProps['placeholder']
|
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).
|
* Display a close button in the input (useful when inside a Modal for example).
|
||||||
* `{ size: 'md', color: 'neutral', variant: 'ghost' }`{lang="ts-type"}
|
* `{ 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>>(), {
|
const props = withDefaults(defineProps<CommandPaletteProps<G, T>>(), {
|
||||||
modelValue: '',
|
modelValue: '',
|
||||||
placeholder: 'Type a command or search...',
|
placeholder: 'Type a command or search...',
|
||||||
labelKey: 'label'
|
labelKey: 'label',
|
||||||
|
autofocus: true
|
||||||
})
|
})
|
||||||
const emits = defineEmits<CommandPaletteEmits<T>>()
|
const emits = defineEmits<CommandPaletteEmits<T>>()
|
||||||
const slots = defineSlots<CommandPaletteSlots<G, T>>()
|
const slots = defineSlots<CommandPaletteSlots<G, T>>()
|
||||||
@@ -239,7 +245,7 @@ const groups = computed(() => {
|
|||||||
<ListboxFilter v-model="searchTerm" as-child>
|
<ListboxFilter v-model="searchTerm" as-child>
|
||||||
<UInput
|
<UInput
|
||||||
variant="none"
|
variant="none"
|
||||||
autofocus
|
:autofocus="autofocus"
|
||||||
size="lg"
|
size="lg"
|
||||||
v-bind="inputProps"
|
v-bind="inputProps"
|
||||||
:icon="icon || appConfig.ui.icons.search"
|
:icon="icon || appConfig.ui.icons.search"
|
||||||
|
|||||||
Reference in New Issue
Block a user