arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-24 17:00:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

feat(DropdownMenu/ContextMenu): handle color field in items (#2510)

Browse Source 
Co-authored-by: Benjamin Canac <canacb1@gmail.com>
This commit is contained in:
Alex
2024-11-06 01:21:01 +05:00
committed by GitHub
parent 2d52834529
commit f66c96e277
16 changed files with 214 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
docs/app/components/content/examples/context-menu/ContextMenuColorItemsExample.vue Normal file
View File

@@ -0,0 +1,33 @@
<script setup lang="ts">
const items = [
[
{
label: 'View',
icon: 'i-heroicons-eye'
},
{
label: 'Copy',
icon: 'i-heroicons-document-duplicate'
},
{
label: 'Edit',
icon: 'i-heroicons-pencil'
}
],
[
{
label: 'Delete',
color: 'error' as const,
icon: 'i-heroicons-trash'
}
]
]
</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>

35
docs/app/components/content/examples/dropdown-menu/DropdownMenuColorItemsExample.vue Normal file
View File

@@ -0,0 +1,35 @@
<script setup lang="ts">
const items = [
[
{
label: 'View',
icon: 'i-heroicons-eye'
},
{
label: 'Copy',
icon: 'i-heroicons-document-duplicate'
},
{
label: 'Edit',
icon: 'i-heroicons-pencil'
}
],
[
{
label: 'Delete',
color: 'error' as const,
icon: 'i-heroicons-trash'
}
]
]
</script>
<template>
<UDropdownMenu :items="items" class="w-48">
<UButton label="Open" color="neutral" variant="outline" icon="i-heroicons-bars-3" />
<template #profile-trailing>
<UIcon name="i-heroicons-check-badge" class="shrink-0 size-5 text-[var(--ui-primary)]" />
</template>
</UDropdownMenu>
</template>