From 9f19a369942c374de65a06164ca88a7a4ded2fc2 Mon Sep 17 00:00:00 2001
From: Elijah Duffy <elijah@thatoneguy.ca>
Date: Wed, 15 Apr 2026 17:04:49 -0700
Subject: [PATCH] Combobox: allow null value

---
 src/lib/Combobox.svelte | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/lib/Combobox.svelte b/src/lib/Combobox.svelte
index 806a2ef..a026914 100644
--- a/src/lib/Combobox.svelte
+++ b/src/lib/Combobox.svelte
@@ -29,10 +29,11 @@
 	};
 
 	/** returns option label, falling back to value or 'Undefined Option' if no option provided */
-	const getLabel = (opt: ComboboxOption | undefined): string =>
+	const getLabel = (opt: ComboboxOption | undefined | null): string =>
 		opt ? (opt.label ?? opt.value) : 'Undefined Option';
 	/** returns option preview, falling back to getLabel if missing */
-	const getPreview = (opt: ComboboxOption | undefined): string => opt?.preview ?? getLabel(opt);
+	const getPreview = (opt: ComboboxOption | undefined | null): string =>
+		opt?.preview ?? getLabel(opt);
 </script>
 
 <script lang="ts">
@@ -78,7 +79,7 @@
 		stateless?: boolean;
 
 		/** Bindable value of the combobox, the currently selected option */
-		value?: ComboboxOption;
+		value?: ComboboxOption | null;
 		/** Array of ComboboxOptions for the picker */
 		options: ComboboxOption[];
 		/**
@@ -271,7 +272,7 @@
 	});
 
 	/** currently highlighted option, updated by keyboard navigation or defaults to first item */
-	let highlighted = $derived.by((): ComboboxOption | undefined => {
+	let highlighted = $derived.by((): ComboboxOption | undefined | null => {
 		if (!searching) return undefined; // otherwise, the first item is highlighted on first open
 		if (filteredItems.length === 0) return undefined;
 		if (value !== undefined && filteredItems.find((v) => v.value === value?.value)) return value;