diff options
Diffstat (limited to 'frontend/src/components/ContextMenu.tsx')
| -rw-r--r-- | frontend/src/components/ContextMenu.tsx | 32 |
1 files changed, 32 insertions, 0 deletions
diff --git a/frontend/src/components/ContextMenu.tsx b/frontend/src/components/ContextMenu.tsx new file mode 100644 index 0000000..459641b --- /dev/null +++ b/frontend/src/components/ContextMenu.tsx @@ -0,0 +1,32 @@ +import React from 'react'; + +interface ContextMenuProps { + x: number; + y: number; + items: { label: string; onClick: () => void; danger?: boolean }[]; + onClose: () => void; +} + +export const ContextMenu: React.FC<ContextMenuProps> = ({ x, y, items, onClose }) => { + return ( + <div + className="fixed z-50 bg-white border border-gray-200 shadow-lg rounded-md py-1 min-w-[150px]" + style={{ top: y, left: x }} + onClick={(e) => e.stopPropagation()} // Prevent click through + > + {items.map((item, idx) => ( + <button + key={idx} + className={`w-full text-left px-4 py-2 text-sm hover:bg-gray-100 ${item.danger ? 'text-red-600 hover:bg-red-50' : 'text-gray-700'}`} + onClick={() => { + item.onClick(); + onClose(); + }} + > + {item.label} + </button> + ))} + </div> + ); +}; + |
