diff --git a/packages/web/src/components/ui/ContextMenu.tsx b/packages/web/src/components/ui/ContextMenu.tsx index c13a93ac..2ffbd811 100644 --- a/packages/web/src/components/ui/ContextMenu.tsx +++ b/packages/web/src/components/ui/ContextMenu.tsx @@ -1,4 +1,5 @@ import React, { useEffect, useRef, useState } from 'react'; +import { useUIStore } from '../../stores/uiStore'; interface ContextMenuItem { label: string; @@ -16,6 +17,7 @@ export function ContextMenu({ items, children }: ContextMenuProps) { const [isOpen, setIsOpen] = useState(false); const [position, setPosition] = useState({ x: 0, y: 0 }); const menuRef = useRef(null); + const isMobile = useUIStore((s) => s.isMobile); const handleContextMenu = (e: React.MouseEvent) => { e.preventDefault(); @@ -62,7 +64,38 @@ export function ContextMenu({ items, children }: ContextMenuProps) { return ( <>
{children}
- {isOpen && ( + {isOpen && isMobile && ( + <> + {/* Backdrop */} +
setIsOpen(false)} /> + {/* Bottom sheet menu */} +
+
+
+ {items.map((item, i) => ( + + ))} +
+
+ + )} + {isOpen && !isMobile && (
s.isMobile); + + // No tooltips on touch devices — return children unwrapped + if (isMobile) return <>{children}; const [isVisible, setIsVisible] = useState(false); const timeoutRef = useRef>(); const anchorRef = useRef(null);