diff --git a/components/src/maplibre/GeocoderControl/GeocoderControl.svelte b/components/src/maplibre/GeocoderControl/GeocoderControl.svelte
index 157916b1..9864406c 100644
--- a/components/src/maplibre/GeocoderControl/GeocoderControl.svelte
+++ b/components/src/maplibre/GeocoderControl/GeocoderControl.svelte
@@ -55,9 +55,9 @@
 	const typesArr = $derived(Array.isArray(types) ? types : [types]);
 
 	// Future: initialise a different GeocoderAPI depending on "service"
-	let geocoderAPI: MaplibreGeocoderApi = new MaptilerGeocoderAPI(key);
+	let geocoderAPI: MaplibreGeocoderApi = $derived(new MaptilerGeocoderAPI(key));
 
-	const geocoder = new MaplibreGeocoder(geocoderAPI, {
+	const geocoder = $derived(new MaplibreGeocoder(geocoderAPI, {
 		maplibregl: maplibre,
 		language: languagesArr.join(','),
 		countries: countriesArr.join(','),
@@ -67,7 +67,7 @@
 		debounceSearch: 25,
 		placeholder,
 		limit
-	});
+	}));
 </script>
 
 <MapControl control={geocoder} {position} />