@canopy-iiif/app 1.4.2 → 1.4.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@canopy-iiif/app",
-  "version": "1.4.2",
+  "version": "1.4.3",
   "private": false,
   "license": "MIT",
   "author": "Mat Jordan <mat@northwestern.edu>",

package/ui/dist/index.mjs

@@ -3029,30 +3029,38 @@ function renderPopup(marker) {
   if (!marker || typeof document === "undefined") return null;
   const container = document.createElement("div");
   let root = null;
-  try {
-    root = createRoot(container);
-    root.render(/* @__PURE__ */ React35.createElement(MapPopupContent, { marker }));
-  } catch (error) {
-    if (root) {
-      try {
-        root.unmount();
-      } catch (_) {
+  let hadError = false;
+  const render = () => {
+    if (hadError) return;
+    try {
+      if (!root) root = createRoot(container);
+      root.render(/* @__PURE__ */ React35.createElement(MapPopupContent, { marker }));
+    } catch (error) {
+      hadError = true;
+      if (root) {
+        try {
+          root.unmount();
+        } catch (_) {
+        }
+        root = null;
       }
-      root = null;
+      const fallbackTitle = marker.title || marker.summary || marker.href || "Location";
+      container.innerHTML = `<div class="canopy-map__popup"><div class="canopy-map__popup-body"><span class="canopy-map__popup-title">${escapeHtml(fallbackTitle)}</span></div></div>`;
     }
-    const fallbackTitle = marker.title || marker.summary || marker.href || "Location";
-    container.innerHTML = `<div class="canopy-map__popup"><div class="canopy-map__popup-body"><span class="canopy-map__popup-title">${escapeHtml(fallbackTitle)}</span></div></div>`;
-  }
+  };
+  const destroy = () => {
+    if (!root) return;
+    try {
+      root.unmount();
+    } catch (_) {
+    }
+    root = null;
+  };
+  render();
   return {
     element: container,
-    destroy() {
-      if (!root) return;
-      try {
-        root.unmount();
-      } catch (_) {
-      }
-      root = null;
-    }
+    render,
+    destroy
   };
 }
 function normalizeCustomMarkers(points) {
@@ -3339,6 +3347,7 @@ function Map2({
     } catch (_) {
     }
     const bounds = [];
+    const popupCleanups = [];
     allMarkers.forEach((marker) => {
       if (!marker || !Number.isFinite(marker.lat) || !Number.isFinite(marker.lng)) return;
       const latlng = leafletLib.latLng(marker.lat, marker.lng);
@@ -3349,23 +3358,20 @@ function Map2({
       if (popup && popup.element) {
         try {
           leafletMarker.bindPopup(popup.element);
-          if (typeof popup.destroy === "function") {
-            let disposed = false;
-            const cleanup = () => {
-              if (disposed) return;
-              disposed = true;
+          if (typeof popup.render === "function") {
+            leafletMarker.on("popupopen", popup.render);
+          }
+          popupCleanups.push(() => {
+            if (typeof popup.render === "function") {
               try {
-                leafletMarker.off("popupclose", cleanup);
-                leafletMarker.off("popupremove", cleanup);
-                leafletMarker.off("remove", cleanup);
+                leafletMarker.off("popupopen", popup.render);
               } catch (_) {
               }
+            }
+            if (typeof popup.destroy === "function") {
               popup.destroy();
-            };
-            leafletMarker.on("popupclose", cleanup);
-            leafletMarker.on("popupremove", cleanup);
-            leafletMarker.on("remove", cleanup);
-          }
+            }
+          });
         } catch (_) {
           if (typeof popup.destroy === "function") {
             popup.destroy();
@@ -3415,6 +3421,14 @@ function Map2({
       } catch (_) {
       }
     }
+    return () => {
+      popupCleanups.forEach((cleanup) => {
+        try {
+          cleanup();
+        } catch (_) {
+        }
+      });
+    };
   }, [allMarkers, defaultCenter, defaultZoom, leafletLib]);
   const isLoadingMarkers = iiifTargets.loading || navState.loading;
   const hasMarkers = allMarkers.length > 0;