rename ComboboxItem -> ComboboxOption

src/lib/PhoneInput.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import Label from './Label.svelte';
 	import { Country, type ICountry } from 'country-state-city';
-	import Combobox, { type ComboboxItem } from './Combobox.svelte';
+	import Combobox, { type ComboboxOption } from './Combobox.svelte';
 	import StyledRawInput from './StyledRawInput.svelte';
 	import { AsYouType, type PhoneNumber, type CountryCode } from 'libphonenumber-js';
 	import { generateIdentifier } from './util';
@@ -32,7 +32,7 @@
 	const id = $derived(generateIdentifier('phone-input', name));
 	let lastRawValue = $state('');
 	let country = $state<ICountry | undefined>();
-	let selectedCountryItem = $state<ComboboxItem | undefined>();
+	let selectedCountryItem = $state<ComboboxOption | undefined>();
 	let countriesOpen = $state<boolean>(false);
 	let countriesValid = $state<boolean>(true);
 	let numberValid = $state<boolean>(true);
@@ -45,7 +45,7 @@
 		},
 		{} as Record<string, ICountry>
 	);
-	const options: ComboboxItem[] = countries.map((country) => ({
+	const options: ComboboxOption[] = countries.map((country) => ({
 		value: country.isoCode,
 		label: `${country.name} (+${country.phonecode})`,
 		preview: `+${country.phonecode}`,
@@ -103,7 +103,7 @@
 	});
 </script>
 
-{#snippet renderIcon(item: ComboboxItem)}
+{#snippet renderIcon(item: ComboboxOption)}
 	{#if countrycodeMap[item.value]?.flag}
 		{countrycodeMap[item.value].flag}
 	{/if}
@@ -133,6 +133,7 @@
 				onvalidate={(e) => {
 					countriesValid = e.detail.valid;
 				}}
+				invalidMessage={null}
 			/>
 		</div>