@page-speed/maps 0.2.2 → 0.2.3

package/dist/index.js

@@ -1180,18 +1180,38 @@ function GeoMap({
   const viewStateRef = React3.useRef(uncontrolledViewState);
   React3.useEffect(() => {
     if (!viewState && !defaultViewState) {
-      setUncontrolledViewState({
-        latitude: firstCoordinate.latitude,
-        longitude: firstCoordinate.longitude,
-        zoom: calculatedZoom
+      setUncontrolledViewState((prev) => {
+        if (prev.latitude === firstCoordinate.latitude && prev.longitude === firstCoordinate.longitude && prev.zoom === calculatedZoom) {
+          return prev;
+        }
+        return {
+          latitude: firstCoordinate.latitude,
+          longitude: firstCoordinate.longitude,
+          zoom: calculatedZoom
+        };
       });
     }
-  }, [firstCoordinate, calculatedZoom, viewState, defaultViewState]);
+  }, [
+    // Use primitive values instead of objects to avoid reference changes
+    firstCoordinate.latitude,
+    firstCoordinate.longitude,
+    calculatedZoom,
+    viewState,
+    defaultViewState
+  ]);
   const isControlledViewState = viewState !== void 0;
   const resolvedViewState = isControlledViewState ? viewState : uncontrolledViewState;
   React3.useEffect(() => {
     viewStateRef.current = resolvedViewState || uncontrolledViewState;
-  }, [resolvedViewState, uncontrolledViewState]);
+  }, [
+    // Use primitive values to avoid reference changes
+    resolvedViewState?.latitude,
+    resolvedViewState?.longitude,
+    resolvedViewState?.zoom,
+    uncontrolledViewState.latitude,
+    uncontrolledViewState.longitude,
+    uncontrolledViewState.zoom
+  ]);
   const applyViewState = React3.useCallback(
     (nextState) => {
       if (!isControlledViewState) {
@@ -1230,7 +1250,13 @@ function GeoMap({
       setSelection({ type: "none" });
       onSelectionChange?.({ type: "none" });
     }
-  }, [onSelectionChange, selectedMarker, selection]);
+  }, [
+    // Use primitive values to avoid object reference issues
+    selection.type,
+    selection.markerId,
+    selectedMarker?.id,
+    onSelectionChange
+  ]);
   const emitSelectionChange = React3.useCallback(
     (nextSelection) => {
       if (nextSelection.type === "none") {