125 lines
3.5 KiB
Vue
125 lines
3.5 KiB
Vue
<script setup lang="ts">
|
|
import {
|
|
Cloud,
|
|
CreditCard,
|
|
Github,
|
|
Keyboard,
|
|
LifeBuoy,
|
|
LogOut,
|
|
Mail,
|
|
MessageSquare,
|
|
Plus,
|
|
PlusCircle,
|
|
Settings,
|
|
User,
|
|
UserPlus,
|
|
Users,
|
|
} from 'lucide-vue-next'
|
|
|
|
import { Button } from '@/lib/registry/default/ui/button'
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuGroup,
|
|
DropdownMenuItem,
|
|
DropdownMenuLabel,
|
|
DropdownMenuPortal,
|
|
DropdownMenuSeparator,
|
|
DropdownMenuShortcut,
|
|
DropdownMenuSub,
|
|
DropdownMenuSubContent,
|
|
DropdownMenuSubTrigger,
|
|
DropdownMenuTrigger,
|
|
} from '@/lib/registry/default/ui/dropdown-menu'
|
|
</script>
|
|
|
|
<template>
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger as-child>
|
|
<Button variant="outline">
|
|
Open
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent class="w-56">
|
|
<DropdownMenuLabel>My Account</DropdownMenuLabel>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuGroup>
|
|
<DropdownMenuItem>
|
|
<User class="mr-2 h-4 w-4" />
|
|
<span>Profile</span>
|
|
<DropdownMenuShortcut>⇧⌘P</DropdownMenuShortcut>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem>
|
|
<CreditCard class="mr-2 h-4 w-4" />
|
|
<span>Billing</span>
|
|
<DropdownMenuShortcut>⌘B</DropdownMenuShortcut>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem>
|
|
<Settings class="mr-2 h-4 w-4" />
|
|
<span>Settings</span>
|
|
<DropdownMenuShortcut>⌘S</DropdownMenuShortcut>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem>
|
|
<Keyboard class="mr-2 h-4 w-4" />
|
|
<span>Keyboard shortcuts</span>
|
|
<DropdownMenuShortcut>⌘K</DropdownMenuShortcut>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuGroup>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuGroup>
|
|
<DropdownMenuItem>
|
|
<Users class="mr-2 h-4 w-4" />
|
|
<span>Team</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuSub>
|
|
<DropdownMenuSubTrigger>
|
|
<UserPlus class="mr-2 h-4 w-4" />
|
|
<span>Invite users</span>
|
|
</DropdownMenuSubTrigger>
|
|
<DropdownMenuPortal>
|
|
<DropdownMenuSubContent>
|
|
<DropdownMenuItem>
|
|
<Mail class="mr-2 h-4 w-4" />
|
|
<span>Email</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem>
|
|
<MessageSquare class="mr-2 h-4 w-4" />
|
|
<span>Message</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem>
|
|
<PlusCircle class="mr-2 h-4 w-4" />
|
|
<span>More...</span>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuSubContent>
|
|
</DropdownMenuPortal>
|
|
</DropdownMenuSub>
|
|
<DropdownMenuItem>
|
|
<Plus class="mr-2 h-4 w-4" />
|
|
<span>New Team</span>
|
|
<DropdownMenuShortcut>⌘+T</DropdownMenuShortcut>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuGroup>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem>
|
|
<Github class="mr-2 h-4 w-4" />
|
|
<span>GitHub</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem>
|
|
<LifeBuoy class="mr-2 h-4 w-4" />
|
|
<span>Support</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuItem disabled>
|
|
<Cloud class="mr-2 h-4 w-4" />
|
|
<span>API</span>
|
|
</DropdownMenuItem>
|
|
<DropdownMenuSeparator />
|
|
<DropdownMenuItem>
|
|
<LogOut class="mr-2 h-4 w-4" />
|
|
<span>Log out</span>
|
|
<DropdownMenuShortcut>⇧⌘Q</DropdownMenuShortcut>
|
|
</DropdownMenuItem>
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
</template>
|