diff --git a/assets/js/component.loader.js b/assets/js/component.loader.js
index 0a8c558..9f481aa 100644
--- a/assets/js/component.loader.js
+++ b/assets/js/component.loader.js
@@ -38,6 +38,61 @@
         document.head.appendChild(s);
       });
 
+    // --- Map-Story Widget Helper ---
+    const loadMapStoryWidget = () => {
+      loadMapStoryWidget.cache ??= null;
+      if (loadMapStoryWidget.cache) return loadMapStoryWidget.cache;
+
+      loadMapStoryWidget.cache = new Promise((resolve, reject) => {
+        const container = document.querySelector('[data-script-loader="component.map-box"]');
+        if (!container) return resolve();
+
+        const src =
+          "https://static.solcast.com/2025-global-interactive-story/js/map-story-widget.iife.js";
+
+        // Prevent double-injection
+        if (document.querySelector(`script[src="${src}"]`)) {
+          return resolve();
+        }
+
+        const mapboxToken = container.getAttribute("component-data-mapbox-token");
+
+        // Fill in component-data-container from the dynamically set ID
+        if (container.id) {
+          container.setAttribute("component-data-container", `#${container.id}`);
+        }
+
+        const dataContainer = container.getAttribute("component-data-container");
+
+        if (!mapboxToken || !dataContainer) {
+          console.warn("[MapStory] Missing mapbox token or container selector", {
+            mapboxToken,
+            dataContainer,
+          });
+        }
+
+        const s = document.createElement("script");
+        s.src = src;
+        s.async = true;
+
+        if (dataContainer) {
+          s.setAttribute("data-container", dataContainer);
+        }
+
+        if (mapboxToken) {
+          s.setAttribute("data-mapbox-token", mapboxToken);
+        }
+
+        s.onload = resolve;
+        s.onerror = () => reject(new Error("Failed to load Map Story widget"));
+
+        document.head.appendChild(s);
+      });
+
+      return loadMapStoryWidget.cache;
+    };
+
+
     // Function to allow loading of External JS
     const loadExternalScript = (src, label) => {
       loadExternalScript.cache ??= new Map();
@@ -267,6 +322,11 @@
     if (has(".embed-graph")) {
       tasks.push(loadModule("component.dw-graph.js", "graph"));
     }
+       
+    // ---------- Map-box Solar Anomaly ----------
+    if (has('[data-script-loader="component.map-box"]')) {
+      tasks.push(loadMapStoryWidget());
+    }
 
     // ---------- Per-page modules ----------