docs(dropdown-menu): update

docs/app/components/content/examples/breadcrumb/BreadcrumbCustomSlotExample.vue

@@ -3,7 +3,7 @@ const items = [{
   label: 'Home',
   to: '/'
 }, {
-  slot: 'dropdown' as const,
+  slot: 'dropdown',
   icon: 'i-heroicons-ellipsis-horizontal',
   children: [{
     label: 'Documentation'

docs/app/components/content/examples/dropdown-menu/DropdownMenuCustomSlotExample.vue

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+const items = [{
+  label: 'Profile',
+  icon: 'i-heroicons-user',
+  slot: 'profile'
+}, {
+  label: 'Billing',
+  icon: 'i-heroicons-credit-card'
+}, {
+  label: 'Settings',
+  icon: 'i-heroicons-cog'
+}]
+</script>
+
+<template>
+  <UDropdownMenu :items="items" class="w-48">
+    <UButton label="Open" color="gray" variant="outline" icon="i-heroicons-bars-3" />
+
+    <template #profile-trailing>
+      <UIcon name="i-heroicons-check-badge" class="shrink-0 size-5 text-primary-500 dark:text-primary-400" />
+    </template>
+  </UDropdownMenu>
+</template>

docs/app/components/content/examples/dropdown-menu/DropdownMenuOpenExample.vue

@@ -0,0 +1,24 @@
+<script setup lang="ts">
+const open = ref(true)
+
+defineShortcuts({
+  o: () => open.value = !open.value
+})
+
+const items = [{
+  label: 'Profile',
+  icon: 'i-heroicons-user'
+}, {
+  label: 'Billing',
+  icon: 'i-heroicons-credit-card'
+}, {
+  label: 'Settings',
+  icon: 'i-heroicons-cog'
+}]
+</script>
+
+<template>
+  <UDropdownMenu v-model:open="open" :items="items" class="w-48">
+    <UButton label="Open" color="gray" variant="outline" icon="i-heroicons-bars-3" />
+  </UDropdownMenu>
+</template>