mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 20:19:34 +01:00
feat(ContextMenu/DropdownMenu): handle checkbox items type
Resolves #2144
This commit is contained in:
@@ -0,0 +1,40 @@
|
||||
<script setup lang="ts">
|
||||
const showSidebar = ref(true)
|
||||
const showToolbar = ref(false)
|
||||
|
||||
const items = computed(() => [{
|
||||
label: 'View',
|
||||
type: 'label' as const
|
||||
}, {
|
||||
type: 'separator' as const
|
||||
}, {
|
||||
label: 'Show Sidebar',
|
||||
type: 'checkbox' as const,
|
||||
checked: showSidebar.value,
|
||||
onUpdateChecked(checked: boolean) {
|
||||
showSidebar.value = checked
|
||||
},
|
||||
onSelect(e?: Event) {
|
||||
e?.preventDefault()
|
||||
}
|
||||
}, {
|
||||
label: 'Show Toolbar',
|
||||
type: 'checkbox' as const,
|
||||
checked: showToolbar.value,
|
||||
onUpdateChecked(checked: boolean) {
|
||||
showToolbar.value = checked
|
||||
}
|
||||
}, {
|
||||
label: 'Collapse Pinned Tabs',
|
||||
type: 'checkbox' as const,
|
||||
disabled: true
|
||||
}])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<UContextMenu :items="items" class="w-48">
|
||||
<div class="flex items-center justify-center rounded-md border border-dashed border-[var(--ui-border-accented)] text-sm aspect-video w-72">
|
||||
Right click here
|
||||
</div>
|
||||
</UContextMenu>
|
||||
</template>
|
||||
Reference in New Issue
Block a user