65 lines
1.9 KiB
Vue
65 lines
1.9 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import {
|
||
|
|
Avatar,
|
||
|
|
AvatarFallback,
|
||
|
|
AvatarImage,
|
||
|
|
} from '@/lib/registry/new-york/ui/avatar'
|
||
|
|
import { Button } from '@/lib/registry/new-york/ui/button'
|
||
|
|
import {
|
||
|
|
DropdownMenu,
|
||
|
|
DropdownMenuContent,
|
||
|
|
DropdownMenuGroup,
|
||
|
|
DropdownMenuItem,
|
||
|
|
DropdownMenuLabel,
|
||
|
|
DropdownMenuSeparator,
|
||
|
|
DropdownMenuShortcut,
|
||
|
|
DropdownMenuTrigger,
|
||
|
|
} from '@/lib/registry/new-york/ui/dropdown-menu'
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<DropdownMenu>
|
||
|
|
<DropdownMenuTrigger as-child>
|
||
|
|
<Button variant="ghost" class="relative h-8 w-8 rounded-full">
|
||
|
|
<Avatar class="h-9 w-9">
|
||
|
|
<AvatarImage src="/avatars/03.png" alt="@shadcn" />
|
||
|
|
<AvatarFallback>SC</AvatarFallback>
|
||
|
|
</Avatar>
|
||
|
|
</Button>
|
||
|
|
</DropdownMenuTrigger>
|
||
|
|
<DropdownMenuContent class="w-56" align="end">
|
||
|
|
<DropdownMenuLabel class="font-normal flex">
|
||
|
|
<div class="flex flex-col space-y-1">
|
||
|
|
<p class="text-sm font-medium leading-none">
|
||
|
|
shadcn
|
||
|
|
</p>
|
||
|
|
<p class="text-xs leading-none text-muted-foreground">
|
||
|
|
m@example.com
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</DropdownMenuLabel>
|
||
|
|
<DropdownMenuSeparator />
|
||
|
|
<DropdownMenuGroup>
|
||
|
|
<DropdownMenuItem>
|
||
|
|
Profile
|
||
|
|
<DropdownMenuShortcut>⇧⌘P</DropdownMenuShortcut>
|
||
|
|
</DropdownMenuItem>
|
||
|
|
<DropdownMenuItem>
|
||
|
|
Billing
|
||
|
|
<DropdownMenuShortcut>⌘B</DropdownMenuShortcut>
|
||
|
|
</DropdownMenuItem>
|
||
|
|
<DropdownMenuItem>
|
||
|
|
Settings
|
||
|
|
<DropdownMenuShortcut>⌘S</DropdownMenuShortcut>
|
||
|
|
</DropdownMenuItem>
|
||
|
|
<DropdownMenuItem>New Team</DropdownMenuItem>
|
||
|
|
</DropdownMenuGroup>
|
||
|
|
<DropdownMenuSeparator />
|
||
|
|
<DropdownMenuItem>
|
||
|
|
Log out
|
||
|
|
<DropdownMenuShortcut>⇧⌘Q</DropdownMenuShortcut>
|
||
|
|
</DropdownMenuItem>
|
||
|
|
</DropdownMenuContent>
|
||
|
|
</DropdownMenu>
|
||
|
|
</template>
|