feat: click-outside deselects a selected marker

Esc was already wired but nobody stumbles onto it. A capture-phase
pointerdown listener is installed while selectedMarkerId is set; any
click that doesn't land on a .timeline-marker (or on an open
dialog/menu) clears the selection. Listener is torn down automatically
when selection clears or the component unmounts.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
thandClaude Opus 4.7 committed 2026-04-20 22:20:58 +02:00
1 parent 4cb3a74dfb
commit 616973b0fa
1 file changed
+18
+18
View File
@@ -412,6 +412,23 @@ function onOutBracketPointerUp(e: PointerEvent) {
const selectedMarkerId = ref<string | null>(null) const selectedMarkerId = ref<string | null>(null)
const markerDrag = ref<{ id: string; startX: number; moved: boolean } | null>(null) const markerDrag = ref<{ id: string; startX: number; moved: boolean } | null>(null)
function onOutsideMarkerPointerDown(e: PointerEvent) {
const el = e.target as HTMLElement | null
// Leave selection alone when the click lands on the marker itself
// (or any menu/dialog — treat anything inside a popup as "not outside").
if (el?.closest('.timeline-marker')) return
if (el?.closest('.dialog, .kf-menu, .track-menu')) return
selectedMarkerId.value = null
}
watch(selectedMarkerId, (id) => {
if (id) {
document.addEventListener('pointerdown', onOutsideMarkerPointerDown, true)
} else {
document.removeEventListener('pointerdown', onOutsideMarkerPointerDown, true)
}
})
function markerTimeFromEvent(e: PointerEvent, markerEl: HTMLElement): number { function markerTimeFromEvent(e: PointerEvent, markerEl: HTMLElement): number {
const ruler = markerEl.parentElement as HTMLElement | null const ruler = markerEl.parentElement as HTMLElement | null
if (!ruler) return 0 if (!ruler) return 0
@@ -1878,6 +1895,7 @@ onBeforeUnmount(() => {
ro?.disconnect() ro?.disconnect()
ro = null ro = null
document.removeEventListener('pointerdown', onDocumentPointerDown, true) document.removeEventListener('pointerdown', onDocumentPointerDown, true)
document.removeEventListener('pointerdown', onOutsideMarkerPointerDown, true)
document.removeEventListener('keydown', onKeyDown) document.removeEventListener('keydown', onKeyDown)
document.removeEventListener('keydown', onDocumentKeyDown) document.removeEventListener('keydown', onDocumentKeyDown)
}) })