@loidolt/theme-maps 0.8.1 → 0.9.1

package/dist/components/MapView.svelte

@@ -150,6 +150,8 @@
   let styleVersion = $state(0);
   let failure = $state<string | null>(null);
   let layers = $state.raw<LayerEntry[]>([]);
+  /** The last `bounds` box fitted, as JSON; `null` when none has been. Not reactive. */
+  let fittedBounds: string | null = null;
   /** A style chosen through `setBasemap` with a document of its own. */
   let customBasemap = $state.raw<string | StyleSpecification | null>(null);
 
@@ -315,7 +317,10 @@
         styleVersion += 1;
         if (loaded) return;
         loaded = true;
+        // Record the box only when one was fitted, so a first `bounds` that arrives after
+        // load is still fitted by the effect below.
         const box = untrack(() => bounds);
+        fittedBounds = box ? JSON.stringify(box) : null;
         if (box) created.fitBounds(box, { padding: boundsPadding, animate: false });
         untrack(() => onLoad?.(created));
       });
@@ -396,6 +401,8 @@
   });
 
   // Props into the map. A move the map made itself comes back equal, so it is a no-op.
+  // Declared before the bounds effect on purpose: when `center`/`zoom` and `bounds` change in
+  // the same tick, the ease starts first and the fit then replaces it, so `bounds` wins.
   $effect(() => {
     const target = instance;
     if (!target || !loaded) return;
@@ -412,16 +419,16 @@
     else target.easeTo(next);
   });
 
-  let fittedBounds: string | null = null;
+  // `bounds` into the map: fit whenever the box differs from the last one fitted, including
+  // the first box to arrive after load. Clearing `bounds` forgets it, so the same box fits again.
   $effect(() => {
     const target = instance;
-    const key = bounds ? JSON.stringify(bounds) : null;
-    if (!target || !loaded || !bounds) return;
-    if (fittedBounds === null) {
-      // The load handler made the first fit.
-      fittedBounds = key;
+    if (!bounds) {
+      fittedBounds = null;
       return;
     }
+    if (!target || !loaded) return;
+    const key = JSON.stringify(bounds);
     if (key === fittedBounds) return;
     fittedBounds = key;
     target.fitBounds(bounds, {

package/dist/components/MapView.svelte.d.ts

@@ -71,6 +71,6 @@ interface Props extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'oncli
     class?: string;
     ref?: HTMLDivElement | null;
 }
-declare const MapView: import("svelte").Component<Props, {}, "map" | "ref" | "zoom" | "center" | "basemap">;
+declare const MapView: import("svelte").Component<Props, {}, "ref" | "map" | "zoom" | "center" | "basemap">;
 type MapView = ReturnType<typeof MapView>;
 export default MapView;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loidolt/theme-maps",
-  "version": "0.8.1",
+  "version": "0.9.1",
   "description": "Accessible, themed MapLibre maps for Loidolt applications",
   "license": "MIT",
   "type": "module",
@@ -38,8 +38,8 @@
     "clean": "rimraf dist"
   },
   "dependencies": {
-    "@loidolt/theme-svelte": "^0.8.1",
-    "@loidolt/theme-tokens": "^0.8.1",
+    "@loidolt/theme-svelte": "^0.9.1",
+    "@loidolt/theme-tokens": "^0.9.1",
     "rbush": "^4.0.1"
   },
   "peerDependencies": {