Fork of atp.tools as a universal profile for people on the ATmosphere
at main 200 lines 7.4 kB view raw
1"use client" 2 3import * as React from "react" 4import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu" 5import { Check, ChevronRight, Circle } from "lucide-react" 6 7import { cn } from "@/lib/utils" 8 9const DropdownMenu = DropdownMenuPrimitive.Root 10 11const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger 12 13const DropdownMenuGroup = DropdownMenuPrimitive.Group 14 15const DropdownMenuPortal = DropdownMenuPrimitive.Portal 16 17const DropdownMenuSub = DropdownMenuPrimitive.Sub 18 19const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup 20 21const DropdownMenuSubTrigger = React.forwardRef< 22 React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>, 23 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & { 24 inset?: boolean 25 } 26>(({ className, inset, children, ...props }, ref) => ( 27 <DropdownMenuPrimitive.SubTrigger 28 ref={ref} 29 className={cn( 30 "flex cursor-default gap-2 select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", 31 inset && "pl-8", 32 className 33 )} 34 {...props} 35 > 36 {children} 37 <ChevronRight className="ml-auto" /> 38 </DropdownMenuPrimitive.SubTrigger> 39)) 40DropdownMenuSubTrigger.displayName = 41 DropdownMenuPrimitive.SubTrigger.displayName 42 43const DropdownMenuSubContent = React.forwardRef< 44 React.ElementRef<typeof DropdownMenuPrimitive.SubContent>, 45 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent> 46>(({ className, ...props }, ref) => ( 47 <DropdownMenuPrimitive.SubContent 48 ref={ref} 49 className={cn( 50 "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", 51 className 52 )} 53 {...props} 54 /> 55)) 56DropdownMenuSubContent.displayName = 57 DropdownMenuPrimitive.SubContent.displayName 58 59const DropdownMenuContent = React.forwardRef< 60 React.ElementRef<typeof DropdownMenuPrimitive.Content>, 61 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> 62>(({ className, sideOffset = 4, ...props }, ref) => ( 63 <DropdownMenuPrimitive.Portal> 64 <DropdownMenuPrimitive.Content 65 ref={ref} 66 sideOffset={sideOffset} 67 className={cn( 68 "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", 69 className 70 )} 71 {...props} 72 /> 73 </DropdownMenuPrimitive.Portal> 74)) 75DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName 76 77const DropdownMenuItem = React.forwardRef< 78 React.ElementRef<typeof DropdownMenuPrimitive.Item>, 79 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & { 80 inset?: boolean 81 } 82>(({ className, inset, ...props }, ref) => ( 83 <DropdownMenuPrimitive.Item 84 ref={ref} 85 className={cn( 86 "relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0", 87 inset && "pl-8", 88 className 89 )} 90 {...props} 91 /> 92)) 93DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName 94 95const DropdownMenuCheckboxItem = React.forwardRef< 96 React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>, 97 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem> 98>(({ className, children, checked, ...props }, ref) => ( 99 <DropdownMenuPrimitive.CheckboxItem 100 ref={ref} 101 className={cn( 102 "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", 103 className 104 )} 105 checked={checked} 106 {...props} 107 > 108 <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> 109 <DropdownMenuPrimitive.ItemIndicator> 110 <Check className="h-4 w-4" /> 111 </DropdownMenuPrimitive.ItemIndicator> 112 </span> 113 {children} 114 </DropdownMenuPrimitive.CheckboxItem> 115)) 116DropdownMenuCheckboxItem.displayName = 117 DropdownMenuPrimitive.CheckboxItem.displayName 118 119const DropdownMenuRadioItem = React.forwardRef< 120 React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>, 121 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem> 122>(({ className, children, ...props }, ref) => ( 123 <DropdownMenuPrimitive.RadioItem 124 ref={ref} 125 className={cn( 126 "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", 127 className 128 )} 129 {...props} 130 > 131 <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center"> 132 <DropdownMenuPrimitive.ItemIndicator> 133 <Circle className="h-2 w-2 fill-current" /> 134 </DropdownMenuPrimitive.ItemIndicator> 135 </span> 136 {children} 137 </DropdownMenuPrimitive.RadioItem> 138)) 139DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName 140 141const DropdownMenuLabel = React.forwardRef< 142 React.ElementRef<typeof DropdownMenuPrimitive.Label>, 143 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & { 144 inset?: boolean 145 } 146>(({ className, inset, ...props }, ref) => ( 147 <DropdownMenuPrimitive.Label 148 ref={ref} 149 className={cn( 150 "px-2 py-1.5 text-sm font-semibold", 151 inset && "pl-8", 152 className 153 )} 154 {...props} 155 /> 156)) 157DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName 158 159const DropdownMenuSeparator = React.forwardRef< 160 React.ElementRef<typeof DropdownMenuPrimitive.Separator>, 161 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator> 162>(({ className, ...props }, ref) => ( 163 <DropdownMenuPrimitive.Separator 164 ref={ref} 165 className={cn("-mx-1 my-1 h-px bg-muted", className)} 166 {...props} 167 /> 168)) 169DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName 170 171const DropdownMenuShortcut = ({ 172 className, 173 ...props 174}: React.HTMLAttributes<HTMLSpanElement>) => { 175 return ( 176 <span 177 className={cn("ml-auto text-xs tracking-widest opacity-60", className)} 178 {...props} 179 /> 180 ) 181} 182DropdownMenuShortcut.displayName = "DropdownMenuShortcut" 183 184export { 185 DropdownMenu, 186 DropdownMenuTrigger, 187 DropdownMenuContent, 188 DropdownMenuItem, 189 DropdownMenuCheckboxItem, 190 DropdownMenuRadioItem, 191 DropdownMenuLabel, 192 DropdownMenuSeparator, 193 DropdownMenuShortcut, 194 DropdownMenuGroup, 195 DropdownMenuPortal, 196 DropdownMenuSub, 197 DropdownMenuSubContent, 198 DropdownMenuSubTrigger, 199 DropdownMenuRadioGroup, 200}