import { Copy, FileText, Pencil, Trash2 } from "lucide-react"import {  ContextMenu,  ContextMenuContent,  ContextMenuItem,  ContextMenuSeparator,  ContextMenuShortcut,  ContextMenuTrigger,} from "@/components/ui/context-menu"export default function ContextMenuDemo() {  return (    <ContextMenu>      <ContextMenuTrigger className="w-full max-w-sm">        <div className="flex cursor-context-menu items-center gap-4 border-2 border-foreground bg-card p-4 shadow-[4px_4px_0px_hsl(var(--foreground))]">          <div className="flex size-12 shrink-0 items-center justify-center border-2 border-foreground bg-primary text-primary-foreground">            <FileText className="size-6" />          </div>          <div className="min-w-0 text-left">            <p className="truncate font-semibold">project-notes.md</p>            <p className="text-sm text-muted-foreground">Right-click for options</p>          </div>        </div>      </ContextMenuTrigger>      <ContextMenuContent className="w-48">        <ContextMenuItem>          <Pencil />          Rename          <ContextMenuShortcut>⌘R</ContextMenuShortcut>        </ContextMenuItem>        <ContextMenuItem>          <Copy />          Make a copy          <ContextMenuShortcut>⌘D</ContextMenuShortcut>        </ContextMenuItem>        <ContextMenuSeparator />        <ContextMenuItem variant="destructive">          <Trash2 />          Move to trash        </ContextMenuItem>      </ContextMenuContent>    </ContextMenu>  )}