mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-28 10:50:40 +01:00
chore(CommandPalette): improve component
This commit is contained in:
@@ -2,7 +2,6 @@
|
|||||||
<Combobox
|
<Combobox
|
||||||
:model-value="modelValue"
|
:model-value="modelValue"
|
||||||
:multiple="multiple"
|
:multiple="multiple"
|
||||||
:nullable="nullable"
|
|
||||||
@update:model-value="onSelect"
|
@update:model-value="onSelect"
|
||||||
>
|
>
|
||||||
<div class="flex flex-col flex-1 min-h-0 divide-y divide-gray-100 dark:divide-gray-800">
|
<div class="flex flex-col flex-1 min-h-0 divide-y divide-gray-100 dark:divide-gray-800">
|
||||||
@@ -43,7 +42,6 @@ import { defu } from 'defu'
|
|||||||
import type { UseFuseOptions } from '@vueuse/integrations/useFuse'
|
import type { UseFuseOptions } from '@vueuse/integrations/useFuse'
|
||||||
import type { Group, Command } from '../../types/command-palette'
|
import type { Group, Command } from '../../types/command-palette'
|
||||||
import CommandPaletteGroup from './CommandPaletteGroup.vue'
|
import CommandPaletteGroup from './CommandPaletteGroup.vue'
|
||||||
import { useRouter } from '#imports'
|
|
||||||
|
|
||||||
const props = defineProps({
|
const props = defineProps({
|
||||||
modelValue: {
|
modelValue: {
|
||||||
@@ -54,10 +52,6 @@ const props = defineProps({
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
},
|
},
|
||||||
nullable: {
|
|
||||||
type: Boolean,
|
|
||||||
default: false
|
|
||||||
},
|
|
||||||
groups: {
|
groups: {
|
||||||
type: Array as PropType<Group[]>,
|
type: Array as PropType<Group[]>,
|
||||||
default: () => []
|
default: () => []
|
||||||
@@ -124,16 +118,14 @@ function activateFirstOption () {
|
|||||||
}, 0)
|
}, 0)
|
||||||
}
|
}
|
||||||
|
|
||||||
function onSelect (option: Command) {
|
function onSelect (option: Command | Command[]) {
|
||||||
if (option.disabled) {
|
|
||||||
return
|
|
||||||
}
|
|
||||||
|
|
||||||
emit('update:modelValue', option)
|
emit('update:modelValue', option)
|
||||||
|
|
||||||
// waiting for modal to be closed
|
// Clear input after selection
|
||||||
if (!option.prevent) {
|
if (!props.multiple) {
|
||||||
query.value = ''
|
setTimeout(() => {
|
||||||
|
query.value = ''
|
||||||
|
}, 0)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
1
src/runtime/types/command-palette.d.ts
vendored
1
src/runtime/types/command-palette.d.ts
vendored
@@ -9,7 +9,6 @@ export interface Command {
|
|||||||
avatar?: string
|
avatar?: string
|
||||||
chip?: string
|
chip?: string
|
||||||
disabled?: boolean
|
disabled?: boolean
|
||||||
prevent?: boolean
|
|
||||||
shortcuts?: string[]
|
shortcuts?: string[]
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user