your personal website on atproto - mirror blento.app

fix ios bug (needs testing)

+22
+22
src/lib/components/qr/qrOverlay.svelte.ts
··· 18 18 const LONG_PRESS_DURATION = 500; 19 19 let longPressTimer: ReturnType<typeof setTimeout> | null = null; 20 20 let isLongPress = false; 21 + let touchActive = false; 22 + 23 + // Prevent iOS link preview on long-press 24 + const originalCallout = node.style.getPropertyValue('-webkit-touch-callout'); 25 + node.style.setProperty('-webkit-touch-callout', 'none'); 21 26 22 27 function getHref() { 23 28 return params.href || (node as HTMLAnchorElement).href || ''; ··· 27 32 if (params.disabled) return; 28 33 // Only start long press for primary button (touch/left-click), not right-click 29 34 if (e.button !== 0) return; 35 + touchActive = e.pointerType === 'touch'; 30 36 isLongPress = false; 31 37 longPressTimer = setTimeout(() => { 32 38 isLongPress = true; ··· 39 45 clearTimeout(longPressTimer); 40 46 longPressTimer = null; 41 47 } 48 + touchActive = false; 42 49 } 43 50 44 51 function handleClick(e: MouseEvent) { ··· 55 62 } 56 63 } 57 64 65 + function handleContextMenu(e: Event) { 66 + // Prevent context menu during touch to avoid iOS preview 67 + if (touchActive || isLongPress) { 68 + e.preventDefault(); 69 + } 70 + } 71 + 58 72 node.addEventListener('pointerdown', startLongPress); 59 73 node.addEventListener('pointerup', cancelLongPress); 60 74 node.addEventListener('pointercancel', cancelLongPress); 61 75 node.addEventListener('pointerleave', cancelLongPress); 62 76 node.addEventListener('click', handleClick); 77 + node.addEventListener('contextmenu', handleContextMenu); 63 78 64 79 return { 65 80 update(newParams: { href?: string; context?: QRContext; disabled?: boolean }) { ··· 71 86 node.removeEventListener('pointercancel', cancelLongPress); 72 87 node.removeEventListener('pointerleave', cancelLongPress); 73 88 node.removeEventListener('click', handleClick); 89 + node.removeEventListener('contextmenu', handleContextMenu); 74 90 cancelLongPress(); 91 + // Restore original style 92 + if (originalCallout) { 93 + node.style.setProperty('-webkit-touch-callout', originalCallout); 94 + } else { 95 + node.style.removeProperty('-webkit-touch-callout'); 96 + } 75 97 } 76 98 }; 77 99 }