feat(Kbd): add color prop & soft variant (#4549)

This commit is contained in:
Alex
2025-07-21 17:22:07 +05:00
committed by GitHub
parent 657ec228b5
commit f33660035f
15 changed files with 479 additions and 403 deletions

View File

@@ -12,9 +12,9 @@ exports[`DropdownMenu > renders with arrow correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -23,14 +23,14 @@ exports[`DropdownMenu > renders with arrow correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div><span style="position: absolute; top: 0px; transform-origin: center 0; transform: rotate(180deg); visibility: hidden;"><svg width="10" height="5" rounded="false" viewBox="0 0 12 6" preserveAspectRatio="none" class="fill-default" style="display: block;"><path d="M0 0L6 6L12 0"></path></svg></span>
@@ -54,9 +54,9 @@ exports[`DropdownMenu > renders with class correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -65,14 +65,14 @@ exports[`DropdownMenu > renders with class correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -96,9 +96,9 @@ exports[`DropdownMenu > renders with custom slot correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Custom slot</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Custom slot</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -107,14 +107,14 @@ exports[`DropdownMenu > renders with custom slot correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -138,9 +138,9 @@ exports[`DropdownMenu > renders with default slot correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-2" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -149,14 +149,14 @@ exports[`DropdownMenu > renders with default slot correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -180,9 +180,9 @@ exports[`DropdownMenu > renders with disabled correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -191,14 +191,14 @@ exports[`DropdownMenu > renders with disabled correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -222,9 +222,9 @@ exports[`DropdownMenu > renders with externalIcon correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -233,14 +233,14 @@ exports[`DropdownMenu > renders with externalIcon correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:external-link inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -296,9 +296,9 @@ exports[`DropdownMenu > renders with item-label slot correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -307,14 +307,14 @@ exports[`DropdownMenu > renders with item-label slot correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Item label slot<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -338,9 +338,9 @@ exports[`DropdownMenu > renders with item-leading slot correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed">Item leading slot<span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -349,14 +349,14 @@ exports[`DropdownMenu > renders with item-leading slot correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5">Item leading slot<span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10">Item leading slot<span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10">Item leading slot<span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -412,9 +412,9 @@ exports[`DropdownMenu > renders with items correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -423,14 +423,14 @@ exports[`DropdownMenu > renders with items correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -456,9 +456,9 @@ exports[`DropdownMenu > renders with labelKey correctly 1`] = `
<!--v-if--><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span>
</div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-user<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-credit-card<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-user<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-credit-card<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-cog<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-cog<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-user-plus<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -467,14 +467,14 @@ exports[`DropdownMenu > renders with labelKey correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-plus<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-plus<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-simple-icons-github<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-life-buoy<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-key-round<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">i-lucide-box<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">i-lucide-log-out<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">i-lucide-log-out<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -498,9 +498,9 @@ exports[`DropdownMenu > renders with size lg correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-2 text-sm gap-2"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -509,14 +509,14 @@ exports[`DropdownMenu > renders with size lg correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-sm gap-2"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-2 text-sm gap-2 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-2 text-sm gap-2 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -540,9 +540,9 @@ exports[`DropdownMenu > renders with size md correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -551,14 +551,14 @@ exports[`DropdownMenu > renders with size md correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -582,9 +582,9 @@ exports[`DropdownMenu > renders with size sm correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-xs gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-4 text-[8px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="16" height="16" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-4" aria-hidden="true"></span>
@@ -593,14 +593,14 @@ exports[`DropdownMenu > renders with size sm correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-xs gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-xs gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-4 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-xs gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-4 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -624,9 +624,9 @@ exports[`DropdownMenu > renders with size xl correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-2 text-base gap-2"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-6 text-xs shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="24" height="24" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-6" aria-hidden="true"></span>
@@ -635,14 +635,14 @@ exports[`DropdownMenu > renders with size xl correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-2 text-base gap-2"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-6" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-2 text-base gap-2 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-6 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-6 min-w-[24px] text-[12px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-2 text-base gap-2 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-6 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-1"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-6 min-w-[24px] text-[12px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -666,9 +666,9 @@ exports[`DropdownMenu > renders with size xs correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1 text-xs gap-1"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-4 text-[8px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="16" height="16" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-4" aria-hidden="true"></span>
@@ -677,14 +677,14 @@ exports[`DropdownMenu > renders with size xs correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1 text-xs gap-1"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1 text-xs gap-1 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-4 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-4 min-w-[16px] text-[10px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1 text-xs gap-1 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-4 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-4 min-w-[16px] text-[10px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -708,9 +708,9 @@ exports[`DropdownMenu > renders with ui correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -719,14 +719,14 @@ exports[`DropdownMenu > renders with ui correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">GitHub<span class="iconify i-lucide:arrow-up-right inline-block size-3 align-top text-dimmed" aria-hidden="true"></span></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-4" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error size-4" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error size-4" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>
@@ -750,9 +750,9 @@ exports[`DropdownMenu > renders without externalIcon correctly 1`] = `
<div role="group" class="p-1 isolate">
<div class="w-full flex items-center font-semibold text-highlighted p-1.5 text-sm gap-1.5"><span class="inline-flex items-center justify-center select-none rounded-full align-middle bg-elevated size-5 text-[10px] shrink-0"><img role="img" src="https://github.com/benjamincanac.png" width="20" height="20" class="h-full w-full rounded-[inherit] object-cover"></span><span class="truncate">My account<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></div>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">B</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:user shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Profile<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:credit-card shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Billing<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">B</kbd></span>
<!----></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">?</kbd></span>
</button><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:cog shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Settings<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">?</kbd></span>
<!----></span>
</button></div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:users shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button data-reka-collection-item="" role="menuitem" tabindex="-1" type="button" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5" id="reka-menu-sub-trigger-v-0-0-1" aria-haspopup="menu" aria-expanded="false" aria-controls="" data-state="closed"><span class="iconify i-lucide:user-plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Invite users<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="iconify i-lucide:chevron-right shrink-0 size-5" aria-hidden="true"></span>
@@ -761,14 +761,14 @@ exports[`DropdownMenu > renders without externalIcon correctly 1`] = `
<!---->
<!--teleport start-->
<!---->
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">N</kbd></span>
<!--teleport end--><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:plus shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">New team<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">N</kbd></span>
<!----></span>
</button>
</div>
<div role="group" class="p-1 isolate"><a href="https://github.com/nuxt/ui" role="menuitem" tabindex="-1" rel="noopener noreferrer" target="_blank" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-simple-icons:github shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">GitHub<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a><a href="/components/dropdown-menu" role="menuitem" tabindex="-1" data-reka-collection-item="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:life-buoy shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Support<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></a>
<div role="separator" aria-orientation="horizontal" class="-mx-1 my-1 h-px bg-border"></div><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:key-round shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">Keyboard Shortcuts<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button><button type="button" disabled="" data-reka-collection-item="" role="menuitem" tabindex="-1" aria-disabled="true" data-disabled="" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 text-default data-highlighted:text-highlighted data-[state=open]:text-highlighted data-highlighted:before:bg-elevated/50 data-[state=open]:before:bg-elevated/50 transition-colors before:transition-colors p-1.5 text-sm gap-1.5"><span class="iconify i-lucide:box shrink-0 text-dimmed group-data-highlighted:text-default group-data-[state=open]:text-default transition-colors size-5" aria-hidden="true"></span><span class="truncate">API<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><!--v-if--><!----></span></button>
</div>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans bg-default text-highlighted ring ring-inset ring-accented h-5 min-w-[20px] text-[11px]">Q</kbd></span>
<div role="group" class="p-1 isolate"><button type="button" data-reka-collection-item="" role="menuitem" tabindex="-1" class="group relative w-full flex items-center select-none outline-none before:absolute before:z-[-1] before:inset-px before:rounded-md data-disabled:cursor-not-allowed data-disabled:opacity-75 data-[state=open]:text-highlighted transition-colors before:transition-colors p-1.5 text-sm gap-1.5 text-error data-highlighted:text-error data-highlighted:before:bg-error/10 data-[state=open]:before:bg-error/10"><span class="iconify i-lucide:log-out shrink-0 transition-colors size-5 text-error/75 group-data-highlighted:text-error group-data-[state=open]:text-error" aria-hidden="true"></span><span class="truncate">Logout<!--v-if--></span><span class="ms-auto inline-flex gap-1.5 items-center"><span class="hidden lg:inline-flex items-center shrink-0 gap-0.5"><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">⇧</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Ctrl</kbd><kbd class="inline-flex items-center justify-center px-1 rounded-sm font-medium font-sans h-5 min-w-[20px] text-[11px] ring ring-inset ring-accented text-default bg-default">Q</kbd></span>
<!----></span>
</button></div>
</div>