menubar

1"use client"
2 
3import * as React from "react"
4import { Menu as MenuPrimitive } from "@base-ui/react/menu"
5import { Menubar as MenubarPrimitive } from "@base-ui/react/menubar"
6import { CheckIcon } from "lucide-react"
7 
8import { cn } from "@/lib/utils"
9import {
10  DropdownMenu,
11  DropdownMenuContent,
12  DropdownMenuGroup,
13  DropdownMenuItem,
14  DropdownMenuLabel,
15  DropdownMenuPortal,
16  DropdownMenuRadioGroup,
17  DropdownMenuSeparator,
18  DropdownMenuShortcut,
19  DropdownMenuSub,
20  DropdownMenuSubContent,
21  DropdownMenuSubTrigger,
22  DropdownMenuTrigger,
23} from "@/components/ui/dropdown-menu"
24 
25function Menubar({ className, ...props }: MenubarPrimitive.Props) {
26  return (
27    <MenubarPrimitive
28      data-slot="menubar"
29      className={cn(
30        "flex h-8 items-center gap-0.5 rounded border-2 bg-background p-[3px] shadow-md",
31        className
32      )}
33      {...props}
34    />
35  )
36}
37 
38function MenubarMenu({ ...props }: React.ComponentProps<typeof DropdownMenu>) {
39  return <DropdownMenu data-slot="menubar-menu" {...props} />
40}
41 
42function MenubarGroup({
43  ...props
44}: React.ComponentProps<typeof DropdownMenuGroup>) {
45  return <DropdownMenuGroup data-slot="menubar-group" {...props} />
46}
47 
48function MenubarPortal({
49  ...props
50}: React.ComponentProps<typeof DropdownMenuPortal>) {
51  return <DropdownMenuPortal data-slot="menubar-portal" {...props} />
52}
53 
54function MenubarTrigger({
55  className,
56  ...props
57}: React.ComponentProps<typeof DropdownMenuTrigger>) {
58  return (
59    <DropdownMenuTrigger
60      data-slot="menubar-trigger"
61      className={cn(
62        "flex items-center rounded-sm px-1.5 py-[2px] text-sm font-medium outline-none select-none hover:bg-accent hover:text-accent-foreground aria-expanded:bg-accent aria-expanded:text-accent-foreground",
63        className
64      )}
65      {...props}
66    />
67  )
68}
69 
70function MenubarContent({
71  className,
72  align = "start",
73  alignOffset = -4,
74  sideOffset = 8,
75  ...props
76}: React.ComponentProps<typeof DropdownMenuContent>) {
77  return (
78    <DropdownMenuContent
79      data-slot="menubar-content"
80      align={align}
81      alignOffset={alignOffset}
82      sideOffset={sideOffset}
83      className={cn(
84// … truncated