feat: make selectables clearable (#572)

Former-commit-id: db16d3fb23
This commit is contained in:
Hayden 2023-10-06 16:32:49 -05:00 committed by GitHub
parent bd9ea571aa
commit 6ed1893bed

View file

@ -10,6 +10,14 @@
class="w-full input input-bordered" class="w-full input input-bordered"
@change="search = $event.target.value" @change="search = $event.target.value"
/> />
<button
v-if="!!value"
type="button"
class="absolute inset-y-0 right-6 flex items-center rounded-r-md px-2 focus:outline-none"
@click="clear"
>
<Icon name="mdi-close" class="w-5 h-5" />
</button>
<ComboboxButton class="absolute inset-y-0 right-0 flex items-center rounded-r-md px-2 focus:outline-none"> <ComboboxButton class="absolute inset-y-0 right-0 flex items-center rounded-r-md px-2 focus:outline-none">
<Icon name="mdi-chevron-down" class="w-5 h-5" /> <Icon name="mdi-chevron-down" class="w-5 h-5" />
</ComboboxButton> </ComboboxButton>
@ -86,6 +94,10 @@
multiple: false, multiple: false,
}); });
function clear() {
emit("update:modelValue", null);
}
const search = ref(""); const search = ref("");
const value = useVModel(props, "modelValue", emit); const value = useVModel(props, "modelValue", emit);