dropdown-menu
accelya-ui-lib/dropdown-menuFreeComponent
shadcn/ui publishes no description for this item.
Live preview
live · rendered by the registry
Rendered by shadcn/ui on their own page — this is the component running, not a screenshot of it.Install it
npx shadcn@latest add https://raw.githubusercontent.com/ramsaoji/Accelya-UI-Lib/main/public/r/styles/default/dropdown-menu.jsonSource
1"use client"23import * as React from "react"4import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"5import { Check, ChevronRight, Circle } from "lucide-react"67import { cn } from "@/lib/utils"89const DropdownMenu = DropdownMenuPrimitive.Root1011const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger1213const DropdownMenuGroup = DropdownMenuPrimitive.Group1415const DropdownMenuPortal = DropdownMenuPrimitive.Portal1617const DropdownMenuSub = DropdownMenuPrimitive.Sub1819const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup2021const DropdownMenuSubTrigger = React.forwardRef<22 React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,23 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {24 inset?: boolean25 }26>(({ className, inset, children, ...props }, ref) => (27 <DropdownMenuPrimitive.SubTrigger28 ref={ref}29 className={cn(30 "flex cursor-default select-none items-center gap-2 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 className33 )}34 {...props}35 >36 {children}37 <ChevronRight className="ml-auto" />38 </DropdownMenuPrimitive.SubTrigger>39))40DropdownMenuSubTrigger.displayName =41 DropdownMenuPrimitive.SubTrigger.displayName4243const DropdownMenuSubContent = React.forwardRef<44 React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,45 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>46>(({ className, ...props }, ref) => (47 <DropdownMenuPrimitive.SubContent48 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 origin-[--radix-dropdown-menu-content-transform-origin]",51 className52 )}53 {...props}54 />55))56DropdownMenuSubContent.displayName =57 DropdownMenuPrimitive.SubContent.displayName5859const DropdownMenuContent = React.forwardRef<60 React.ElementRef<typeof DropdownMenuPrimitive.Content>,61 React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>62>(({ className, sideOffset = 4, ...props }, ref) => (63// … truncated
What it pulls in
npm packages
Files it writes
More from shadcn/ui
All 357 items| Component | Registry | Kind | Access | Installs | Command |
|---|---|---|---|---|---|
| accordionaccordion | shadcn/ui | Components | Free | 1 dep | |
| alertalert | shadcn/ui | Components | Free | no deps | |
| alert-dialogalert-dialog | shadcn/ui | Components | Free | 1 dep | |
| aspect-ratioaspect-ratio | shadcn/ui | Components | Free | 1 dep | |
| avataravatar | shadcn/ui | Components | Free | 1 dep | |
| badgebadge | shadcn/ui | Components | Free | 1 dep | |
| breadcrumbbreadcrumb | shadcn/ui | Components | Free | 1 dep | |
| buttonbutton | shadcn/ui | Components | Free | 1 dep |
