From 9bef2a074ed8499d94d57538fb9dcc459b00fbed Mon Sep 17 00:00:00 2001
From: Sean Morley <mail@seanmorley.com>
Date: Fri, 2 Jan 2026 11:30:46 -0500
Subject: [PATCH] fix: improve dropdown close behavior by handling multiple
 event types

---
 frontend/src/lib/components/CategoryDropdown.svelte | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/lib/components/CategoryDropdown.svelte b/frontend/src/lib/components/CategoryDropdown.svelte
index 62f5f1ab..61b2a779 100644
--- a/frontend/src/lib/components/CategoryDropdown.svelte
+++ b/frontend/src/lib/components/CategoryDropdown.svelte
@@ -101,9 +101,10 @@
 
 		loadData();
 
-		const handlePointerDown = (event: PointerEvent) => {
+		const handleOutside = (event: Event) => {
 			if (!dropdownRef) return;
-			if (!dropdownRef.contains(event.target as Node)) {
+			const target = event.target as Node | null;
+			if (target && !dropdownRef.contains(target)) {
 				closeDropdown();
 			}
 		};
@@ -114,17 +115,18 @@
 			}
 		};
 
-		document.addEventListener('pointerdown', handlePointerDown);
+		const outsideEvents: Array<keyof DocumentEventMap> = ['pointerdown', 'mousedown', 'touchstart'];
+		outsideEvents.forEach((eventName) => document.addEventListener(eventName, handleOutside));
 		document.addEventListener('keydown', handleKeyDown);
 
 		return () => {
-			document.removeEventListener('pointerdown', handlePointerDown);
+			outsideEvents.forEach((eventName) => document.removeEventListener(eventName, handleOutside));
 			document.removeEventListener('keydown', handleKeyDown);
 		};
 	});
 </script>
 
-<div class="dropdown w-full" bind:this={dropdownRef}>
+<div class="dropdown w-full" class:dropdown-open={isOpen} bind:this={dropdownRef}>
 	<button
 		type="button"
 		class="btn btn-outline w-full justify-between sm:h-auto h-12"