From 9d925382b3805456011de55aeb96dad636cc2e51 Mon Sep 17 00:00:00 2001
From: root <root@opencode.lan>
Date: Mon, 6 Apr 2026 16:32:25 +0500
Subject: [PATCH] fix(player): register touchmove with passive:false via
 $effect

Svelte 5 has no |nonpassive modifier. Register the touchmove listener
manually so e.preventDefault() can suppress page scroll during the
pull-down gesture.
---
 ui/src/lib/components/ListeningMode.svelte | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/ui/src/lib/components/ListeningMode.svelte b/ui/src/lib/components/ListeningMode.svelte
index 9155d0d..d20a754 100644
--- a/ui/src/lib/components/ListeningMode.svelte
+++ b/ui/src/lib/components/ListeningMode.svelte
@@ -31,6 +31,15 @@
 	let isDragging = $state(false);
 	let dragStartY = 0;
 	let dragStartTime = 0;
+	let overlayEl = $state<HTMLDivElement | null>(null);
+
+	// Register ontouchmove with passive:false so e.preventDefault() works.
+	// Svelte 5 does not support the |nonpassive modifier, so we use $effect.
+	$effect(() => {
+		if (!overlayEl) return;
+		overlayEl.addEventListener('touchmove', onTouchMove, { passive: false });
+		return () => overlayEl!.removeEventListener('touchmove', onTouchMove);
+	});
 
 	function onTouchStart(e: TouchEvent) {
 		// Don't hijack touches that start inside a scrollable element
@@ -238,6 +247,7 @@
 <!-- Full-screen listening mode overlay -->
 <!-- svelte-ignore a11y_no_static_element_interactions -->
 <div
+	bind:this={overlayEl}
 	class="fixed inset-0 z-60 flex flex-col overflow-hidden"
 	style="
 		background: var(--color-surface);
@@ -248,7 +258,6 @@
 		touch-action: pan-x;
 	"
 	ontouchstart={onTouchStart}
-	ontouchmove|nonpassive={onTouchMove}
 	ontouchend={onTouchEnd}
 >