{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"context-menu","type":"registry:ui","title":"Context Menu","description":"Tailark Base UI Context Menu component","dependencies":["@radix-ui/react-context-menu"],"registryDependencies":["@tailark/core-utils"],"files":[{"path":"components/ui/context-menu.tsx","type":"registry:ui","target":"@ui/context-menu.tsx","content":"'use client'\n\nimport * as React from 'react'\nimport * as ContextMenuPrimitive from '@radix-ui/react-context-menu'\nimport { CheckIcon, ChevronRightIcon, CircleIcon } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\n\nfunction ContextMenu({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Root>) {\n    return (\n        <ContextMenuPrimitive.Root\n            data-slot=\"context-menu\"\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuTrigger({\n    render,\n    children,\n    ...props\n}: React.ComponentProps<typeof ContextMenuPrimitive.Trigger> & {\n    /** Base UI-style composition — mapped to Radix `asChild` */\n    render?: React.ReactElement\n}) {\n    if (render) {\n        return (\n            <ContextMenuPrimitive.Trigger\n                data-slot=\"context-menu-trigger\"\n                asChild\n                {...props}\n            >\n                {React.cloneElement(\n                    render as React.ReactElement<{ children?: React.ReactNode }>,\n                    undefined,\n                    children\n                )}\n            </ContextMenuPrimitive.Trigger>\n        )\n    }\n\n    return (\n        <ContextMenuPrimitive.Trigger\n            data-slot=\"context-menu-trigger\"\n            {...props}\n        >\n            {children}\n        </ContextMenuPrimitive.Trigger>\n    )\n}\n\nfunction ContextMenuGroup({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Group>) {\n    return (\n        <ContextMenuPrimitive.Group\n            data-slot=\"context-menu-group\"\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuPortal({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Portal>) {\n    return (\n        <ContextMenuPrimitive.Portal\n            data-slot=\"context-menu-portal\"\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuSub({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Sub>) {\n    return (\n        <ContextMenuPrimitive.Sub\n            data-slot=\"context-menu-sub\"\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuRadioGroup({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.RadioGroup>) {\n    return (\n        <ContextMenuPrimitive.RadioGroup\n            data-slot=\"context-menu-radio-group\"\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuSubTrigger({\n    className,\n    inset,\n    children,\n    ...props\n}: React.ComponentProps<typeof ContextMenuPrimitive.SubTrigger> & {\n    inset?: boolean\n}) {\n    return (\n        <ContextMenuPrimitive.SubTrigger\n            data-slot=\"context-menu-sub-trigger\"\n            data-inset={inset}\n            className={cn(\"focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground outline-hidden flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm data-[inset]:pl-8 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\", className)}\n            {...props}>\n            {children}\n            <ChevronRightIcon className=\"ml-auto\" />\n        </ContextMenuPrimitive.SubTrigger>\n    )\n}\n\nfunction ContextMenuSubContent({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.SubContent>) {\n    return (\n        <ContextMenuPrimitive.SubContent\n            data-slot=\"context-menu-sub-content\"\n            className={cn(\n                'bg-popover text-popover-foreground 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-context-menu-content-transform-origin) z-50 min-w-[8rem] overflow-hidden rounded-md border p-1 shadow-lg',\n                className\n            )}\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuContent({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Content>) {\n    return (\n        <ContextMenuPrimitive.Portal>\n            <ContextMenuPrimitive.Content\n                data-slot=\"context-menu-content\"\n                className={cn(\n                    'bg-popover text-popover-foreground 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 max-h-(--radix-context-menu-content-available-height) origin-(--radix-context-menu-content-transform-origin) z-50 min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-md border p-1 shadow-md',\n                    className\n                )}\n                {...props}\n            />\n        </ContextMenuPrimitive.Portal>\n    )\n}\n\nfunction ContextMenuItem({\n    className,\n    inset,\n    variant = 'default',\n    ...props\n}: React.ComponentProps<typeof ContextMenuPrimitive.Item> & {\n    inset?: boolean\n    variant?: 'default' | 'destructive'\n}) {\n    return (\n        <ContextMenuPrimitive.Item\n            data-slot=\"context-menu-item\"\n            data-inset={inset}\n            data-variant={variant}\n            className={cn(\n                \"focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm data-[disabled]:pointer-events-none data-[inset]:pl-8 data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\",\n                className\n            )}\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>) {\n    return (\n        <ContextMenuPrimitive.CheckboxItem\n            data-slot=\"context-menu-checkbox-item\"\n            className={cn(\"focus:bg-accent focus:text-accent-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pl-8 pr-2 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\", className)}\n            checked={checked}\n            {...props}>\n            <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n                <ContextMenuPrimitive.ItemIndicator>\n                    <CheckIcon className=\"size-4\" />\n                </ContextMenuPrimitive.ItemIndicator>\n            </span>\n            {children}\n        </ContextMenuPrimitive.CheckboxItem>\n    )\n}\n\nfunction ContextMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.RadioItem>) {\n    return (\n        <ContextMenuPrimitive.RadioItem\n            data-slot=\"context-menu-radio-item\"\n            className={cn(\"focus:bg-accent focus:text-accent-foreground outline-hidden relative flex cursor-default select-none items-center gap-2 rounded-sm py-1.5 pl-8 pr-2 text-sm data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0\", className)}\n            {...props}>\n            <span className=\"pointer-events-none absolute left-2 flex size-3.5 items-center justify-center\">\n                <ContextMenuPrimitive.ItemIndicator>\n                    <CircleIcon className=\"size-2 fill-current\" />\n                </ContextMenuPrimitive.ItemIndicator>\n            </span>\n            {children}\n        </ContextMenuPrimitive.RadioItem>\n    )\n}\n\nfunction ContextMenuLabel({\n    className,\n    inset,\n    ...props\n}: React.ComponentProps<typeof ContextMenuPrimitive.Label> & {\n    inset?: boolean\n}) {\n    return (\n        <ContextMenuPrimitive.Label\n            data-slot=\"context-menu-label\"\n            data-inset={inset}\n            className={cn('text-foreground px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', className)}\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuSeparator({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Separator>) {\n    return (\n        <ContextMenuPrimitive.Separator\n            data-slot=\"context-menu-separator\"\n            className={cn('bg-border -mx-1 my-1 h-px', className)}\n            {...props}\n        />\n    )\n}\n\nfunction ContextMenuShortcut({ className, ...props }: React.ComponentProps<'span'>) {\n    return (\n        <span\n            data-slot=\"context-menu-shortcut\"\n            className={cn('text-muted-foreground ml-auto text-xs tracking-widest', className)}\n            {...props}\n        />\n    )\n}\n\nexport { ContextMenu, ContextMenuTrigger, ContextMenuContent, ContextMenuItem, ContextMenuCheckboxItem, ContextMenuRadioItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuShortcut, ContextMenuGroup, ContextMenuPortal, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuRadioGroup }\n"}]}