From 7386bff7bedbb8cb387ac028432f904df7f46ac9 Mon Sep 17 00:00:00 2001
From: Elijah Duffy <elijah@thatoneguy.ca>
Date: Wed, 6 May 2026 19:06:41 -0700
Subject: [PATCH] fix PhoneInput combobox icon override

---
 src/lib/PhoneInput.svelte | 17 ++++++++---------
 1 file changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/lib/PhoneInput.svelte b/src/lib/PhoneInput.svelte
index 3f87c91..10269f9 100644
--- a/src/lib/PhoneInput.svelte
+++ b/src/lib/PhoneInput.svelte
@@ -50,8 +50,7 @@
 	const options: ComboboxOption[] = countries.map((country) => ({
 		value: country.isoCode,
 		label: `${country.name} (+${country.phonecode})`,
-		preview: `+${country.phonecode}`,
-		icon: renderIcon
+		preview: `+${country.phonecode}`
 	}));
 
 	let phonecode: string = $derived.by(() => {
@@ -118,12 +117,6 @@
 	});
 </script>
 
-{#snippet renderIcon(item: ComboboxOption)}
-	{#if countrycodeMap[item.value]?.flag}
-		{countrycodeMap[item.value].flag}
-	{/if}
-{/snippet}
-
 <div class={classValue}>
 	{#if label}
 		<Label for={id}>{label}</Label>
@@ -149,7 +142,13 @@
 					countriesValid = e.detail.valid;
 				}}
 				invalidMessage={null}
-			/>
+			>
+				{#snippet iconRender(opt)}
+					{#if countrycodeMap[opt.value]?.flag}
+						{countrycodeMap[opt.value].flag}
+					{/if}
+				{/snippet}
+			</Combobox>
 		</div>
 
 		<div class="w-full">