feat(web): add link to external map in leaflet popup (#3847)

* feat(web): add link to external map in leaflet popup

Sometimes it's useful to open a geo location to an external map
application to not have to copy the coordinates manually.
Here I put a link to OpenStreetMap because it's what I personally use.
But I known some people would want to use something different. We could
instead link to geohacks (eg. https://geohack.toolforge.org/geohack.php?params=048.861085_N_0002.313158_E_globe:Earth)
or make it a configurable param.

* chore: cleanup

---------

Co-authored-by: Jason Rasmussen <jrasm91@gmail.com>

web/src/lib/components/shared-components/leaflet/marker.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
   import { onDestroy, onMount } from 'svelte';
-  import { Marker, Icon, type LatLngExpression, type Content } from 'leaflet';
+  import { Marker, Icon, type LatLngExpression } from 'leaflet';
   import { getMapContext } from './map.svelte';
   import iconUrl from 'leaflet/dist/images/marker-icon.png';
   import iconRetinaUrl from 'leaflet/dist/images/marker-icon-2x.png';
   import shadowUrl from 'leaflet/dist/images/marker-shadow.png';
 
   export let latlng: LatLngExpression;
-  export let popupContent: Content | undefined = undefined;
+  let popupHTML: string;
   let marker: Marker;
 
   const defaultIcon = new Icon({
@@ -37,10 +37,14 @@
   $: if (marker) {
     marker.setLatLng(latlng);
 
-    if (popupContent) {
-      marker.bindPopup(popupContent);
+    if (popupHTML) {
+      marker.bindPopup(popupHTML);
     } else {
       marker.unbindPopup();
     }
   }
 </script>
+
+<span contenteditable="true" bind:innerHTML={popupHTML} class="hide">
+  <slot />
+</span>