"use client"; import * as React from "react"; import { ContextMenu as CtxPrimitive } from "radix-ui"; import { cn } from "@kineticui/core"; import { ChevronRightIcon } from "@kineticui/icons"; export const ContextMenu = CtxPrimitive.Root; export const ContextMenuTrigger = CtxPrimitive.Trigger; export const ContextMenuSub = CtxPrimitive.Sub; const panel = "z-50 min-w-52 rounded-xl border border-border-strong bg-surface-raised p-1.5 text-sm text-foreground shadow-overlay data-[state=open]:animate-[kn-pop_0.14s_var(--ease-kn-out)]"; const item = "relative flex cursor-default select-none items-center gap-2.5 rounded-lg px-2.5 py-2 outline-none data-[highlighted]:bg-surface-overlay data-[disabled]:opacity-50 [&_svg]:size-4 [&_svg]:text-muted"; export const ContextMenuContent = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( )); ContextMenuContent.displayName = "ContextMenuContent"; export const ContextMenuItem = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef & { shortcut?: string; destructive?: boolean } >(({ className, shortcut, destructive, children, ...props }, ref) => ( {children} {shortcut ? {shortcut} : null} )); ContextMenuItem.displayName = "ContextMenuItem"; export function ContextMenuSeparator() { return ; } export function ContextMenuLabel({ children }: { children: React.ReactNode }) { return {children}; } export const ContextMenuSubTrigger = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef >(({ className, children, ...props }, ref) => ( {children} )); ContextMenuSubTrigger.displayName = "ContextMenuSubTrigger"; export const ContextMenuSubContent = React.forwardRef< React.ElementRef, React.ComponentPropsWithoutRef >(({ className, ...props }, ref) => ( )); ContextMenuSubContent.displayName = "ContextMenuSubContent";

Context Menu

Installation

Exports