@deck.gl/widgets 9.3.0-alpha.5 → 9.3.0-beta.1

package/dist/compass-widget.d.ts

@@ -9,6 +9,18 @@ export type CompassWidgetProps = WidgetProps & {
     label?: string;
     /** Bearing and pitch reset transition duration in ms. */
     transitionDuration?: number;
+    /**
+     * Callback when the compass reset button is clicked.
+     * Called for each viewport that will be reset.
+     */
+    onReset?: (params: {
+        /** The view being reset */
+        viewId: string;
+        /** The new bearing value (0) */
+        bearing: number;
+        /** The new pitch value (0 if bearing was already 0) */
+        pitch: number;
+    }) => void;
 };
 export declare class CompassWidget extends Widget<CompassWidgetProps> {
     static defaultProps: Required<CompassWidgetProps>;

package/dist/compass-widget.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"compass-widget.d.ts","sourceRoot":"","sources":["../src/compass-widget.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAC,MAAM,EAAyD,MAAM,eAAe,CAAC;AAC7F,OAAO,KAAK,EAAC,QAAQ,EAAE,eAAe,EAAE,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1E,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG;IAC7C,8DAA8D;IAC9D,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,+EAA+E;IAC/E,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yDAAyD;IACzD,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,qBAAa,aAAc,SAAQ,MAAM,CAAC,kBAAkB,CAAC;IAC3D,MAAM,CAAC,YAAY,EAAE,QAAQ,CAAC,kBAAkB,CAAC,CAO/C;IAEF,SAAS,SAAyB;IAClC,SAAS,EAAE,eAAe,CAAc;IACxC,SAAS,EAAE;QAAC,CAAC,EAAE,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAC,CAAM;gBAE7B,KAAK,GAAE,kBAAuB;IAK1C,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,kBAAkB,CAAC;IAM3C,YAAY,CAAC,WAAW,EAAE,WAAW,GAAG,IAAI;IAoC5C,gBAAgB,CAAC,QAAQ,EAAE,QAAQ;IAQnC,WAAW,CAAC,QAAQ,CAAC,EAAE,QAAQ;IAS/B,kBAAkB,CAAC,QAAQ,EAAE,QAAQ;CActC"}
+{"version":3,"file":"compass-widget.d.ts","sourceRoot":"","sources":["../src/compass-widget.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAC,MAAM,EAAyD,MAAM,eAAe,CAAC;AAC7F,OAAO,KAAK,EAAC,QAAQ,EAAE,eAAe,EAAE,WAAW,EAAC,MAAM,eAAe,CAAC;AAG1E,MAAM,MAAM,kBAAkB,GAAG,WAAW,GAAG;IAC7C,8DAA8D;IAC9D,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,+EAA+E;IAC/E,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,uBAAuB;IACvB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,yDAAyD;IACzD,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;;OAGG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE;QACjB,2BAA2B;QAC3B,MAAM,EAAE,MAAM,CAAC;QACf,gCAAgC;QAChC,OAAO,EAAE,MAAM,CAAC;QAChB,uDAAuD;QACvD,KAAK,EAAE,MAAM,CAAC;KACf,KAAK,IAAI,CAAC;CACZ,CAAC;AAEF,qBAAa,aAAc,SAAQ,MAAM,CAAC,kBAAkB,CAAC;IAC3D,MAAM,CAAC,YAAY,EAAE,QAAQ,CAAC,kBAAkB,CAAC,CAQ/C;IAEF,SAAS,SAAyB;IAClC,SAAS,EAAE,eAAe,CAAc;IACxC,SAAS,EAAE;QAAC,CAAC,EAAE,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAC,CAAM;gBAE7B,KAAK,GAAE,kBAAuB;IAK1C,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,kBAAkB,CAAC;IAM3C,YAAY,CAAC,WAAW,EAAE,WAAW,GAAG,IAAI;IAoC5C,gBAAgB,CAAC,QAAQ,EAAE,QAAQ;IAQnC,WAAW,CAAC,QAAQ,CAAC,EAAE,QAAQ;IAS/B,kBAAkB,CAAC,QAAQ,EAAE,QAAQ;CAqBtC"}

package/dist/compass-widget.js

@@ -48,10 +48,15 @@ export class CompassWidget extends Widget {
         const viewId = this.viewId || viewport.id;
         if (viewport instanceof WebMercatorViewport) {
             const viewState = this.getViewState(viewId);
+            const resetPitch = this.getRotation(viewport)[0] === 0;
+            const nextBearing = 0;
+            const nextPitch = resetPitch ? 0 : viewport.pitch;
+            // Call callback
+            this.props.onReset?.({ viewId, bearing: nextBearing, pitch: nextPitch });
             const nextViewState = {
                 ...viewState,
-                bearing: 0,
-                ...(this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {}),
+                bearing: nextBearing,
+                ...(resetPitch ? { pitch: nextPitch } : {}),
                 transitionDuration: this.props.transitionDuration,
                 transitionInterpolator: new FlyToInterpolator()
             };
@@ -65,6 +70,7 @@ CompassWidget.defaultProps = {
     placement: 'top-left',
     viewId: null,
     label: 'Reset Compass',
-    transitionDuration: 200
+    transitionDuration: 200,
+    onReset: () => { }
 };
 //# sourceMappingURL=compass-widget.js.map

package/dist/compass-widget.js.map

@@ -1 +1 @@
-{"version":3,"file":"compass-widget.js","sourceRoot":"","sources":["../src/compass-widget.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"compass-widget.js","sourceRoot":"","sources":["../src/compass-widget.tsx"],"names":[],"mappings":"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"}

package/dist/dist.dev.js

@@ -659,7 +659,7 @@ var __exports__ = (() => {
       ] });
       B(ui, rootElement);
     }
-    handleZoom(viewId, nextZoom) {
+    handleZoom(viewId, nextZoom, delta) {
       const viewState = this.getViewState(viewId);
       if (viewState) {
         const { minZoom, maxZoom } = viewState;
@@ -670,6 +670,7 @@ var __exports__ = (() => {
           nextZoom = Math.min(maxZoom, nextZoom);
         }
       }
+      this.props.onZoom?.({ viewId, delta, zoom: nextZoom });
       const nextViewState = {
         ...viewState,
         zoom: nextZoom
@@ -686,14 +687,14 @@ var __exports__ = (() => {
       const viewIds = this.viewId ? [this.viewId] : this.deck?.getViews().map((v3) => v3.id) ?? [];
       for (const viewId of viewIds) {
         const viewState = this.getViewState(viewId);
-        this.handleZoom(viewId, viewState.zoom + 1);
+        this.handleZoom(viewId, viewState.zoom + 1, 1);
       }
     }
     handleZoomOut() {
       const viewIds = this.viewId ? [this.viewId] : this.deck?.getViews().map((v3) => v3.id) ?? [];
       for (const viewId of viewIds) {
         const viewState = this.getViewState(viewId);
-        this.handleZoom(viewId, viewState.zoom - 1);
+        this.handleZoom(viewId, viewState.zoom - 1, -1);
       }
     }
   };
@@ -705,7 +706,9 @@ var __exports__ = (() => {
     transitionDuration: 200,
     zoomInLabel: "Zoom In",
     zoomOutLabel: "Zoom Out",
-    viewId: null
+    viewId: null,
+    onZoom: () => {
+    }
   };
 
   // src/reset-view-widget.tsx
@@ -748,6 +751,7 @@ var __exports__ = (() => {
           // transitionDuration: this.props.transitionDuration,
           // transitionInterpolator: new FlyToInterpolator()
         };
+        this.props.onReset?.({ viewId, viewState: nextViewState });
         this.setViewState(viewId, nextViewState);
       }
     }
@@ -758,7 +762,9 @@ var __exports__ = (() => {
     placement: "top-left",
     label: "Reset View",
     initialViewState: void 0,
-    viewId: null
+    viewId: null,
+    onReset: () => {
+    }
   };
 
   // src/gimbal-widget.tsx
@@ -857,6 +863,7 @@ var __exports__ = (() => {
       const viewId = this.viewId || viewport?.id || "OrbitView";
       const viewState = this.getViewState(viewId);
       if ("rotationOrbit" in viewState || "rotationX" in viewState) {
+        this.props.onReset?.({ viewId, rotationOrbit: 0, rotationX: 0 });
         const nextViewState = {
           ...viewState,
           rotationOrbit: 0,
@@ -891,7 +898,9 @@ var __exports__ = (() => {
     viewId: null,
     label: "Gimbal",
     strokeWidth: 1.5,
-    transitionDuration: 200
+    transitionDuration: 200,
+    onReset: () => {
+    }
   };
   function normalizeAndClampAngle(angle) {
     let normalized = ((angle + 180) % 360 + 360) % 360 - 180;
@@ -975,10 +984,14 @@ var __exports__ = (() => {
       const viewId = this.viewId || viewport.id;
       if (viewport instanceof import_core5.WebMercatorViewport) {
         const viewState = this.getViewState(viewId);
+        const resetPitch = this.getRotation(viewport)[0] === 0;
+        const nextBearing = 0;
+        const nextPitch = resetPitch ? 0 : viewport.pitch;
+        this.props.onReset?.({ viewId, bearing: nextBearing, pitch: nextPitch });
         const nextViewState = {
           ...viewState,
-          bearing: 0,
-          ...this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {},
+          bearing: nextBearing,
+          ...resetPitch ? { pitch: nextPitch } : {},
           transitionDuration: this.props.transitionDuration,
           transitionInterpolator: new import_core5.FlyToInterpolator()
         };
@@ -992,7 +1005,9 @@ var __exports__ = (() => {
     placement: "top-left",
     viewId: null,
     label: "Reset Compass",
-    transitionDuration: 200
+    transitionDuration: 200,
+    onReset: () => {
+    }
   };
 
   // src/scale-widget.tsx
@@ -1506,6 +1521,16 @@ var __exports__ = (() => {
     flyTo(viewState) {
       const viewIds = this.viewId ? [this.viewId] : this.deck?.getViews().map((v3) => v3.id) ?? [];
       for (const viewId of viewIds) {
+        if ("longitude" in viewState && "latitude" in viewState) {
+          this.props.onGeocode?.({
+            viewId,
+            coordinates: {
+              longitude: viewState.longitude,
+              latitude: viewState.latitude,
+              zoom: viewState.zoom
+            }
+          });
+        }
         const currentViewState = this.getViewState(viewId);
         const nextViewState = {
           ...currentViewState,
@@ -1529,7 +1554,9 @@ var __exports__ = (() => {
     geocoder: "coordinates",
     customGeocoder: CoordinatesGeocoder,
     apiKey: "",
-    _geolocation: false
+    _geolocation: false,
+    onGeocode: () => {
+    }
   };
   function getGeocoder(props) {
     switch (props.geocoder) {
@@ -1568,6 +1595,7 @@ var __exports__ = (() => {
       document.removeEventListener("fullscreenchange", this.onFullscreenChange.bind(this));
     }
     onRenderHTML(rootElement) {
+      const isFullscreen = this.getFullscreen();
       B(
         /* @__PURE__ */ u2(
           IconButton,
@@ -1575,8 +1603,8 @@ var __exports__ = (() => {
             onClick: () => {
               this.handleClick().catch((err) => import_core9.log.error(err)());
             },
-            label: this.fullscreen ? this.props.exitLabel : this.props.enterLabel,
-            className: this.fullscreen ? "deck-widget-fullscreen-exit" : "deck-widget-fullscreen-enter"
+            label: isFullscreen ? this.props.exitLabel : this.props.enterLabel,
+            className: isFullscreen ? "deck-widget-fullscreen-exit" : "deck-widget-fullscreen-enter"
           }
         ),
         rootElement
@@ -1590,21 +1618,24 @@ var __exports__ = (() => {
     getContainer() {
       return this.props.container || this.deck?.props.parent || this.deck?.getCanvas()?.parentElement;
     }
+    getFullscreen() {
+      return this.fullscreen;
+    }
     onFullscreenChange() {
-      const prevFullscreen = this.fullscreen;
       const fullscreen = document.fullscreenElement === this.getContainer();
-      if (prevFullscreen !== fullscreen) {
-        this.fullscreen = !this.fullscreen;
+      if (fullscreen !== this.fullscreen) {
+        this.fullscreen = fullscreen;
+        this.props.onFullscreenChange?.(fullscreen);
+        this.updateHTML();
       }
-      this.updateHTML();
     }
     async handleClick() {
-      if (this.fullscreen) {
+      const isFullscreen = this.getFullscreen();
+      if (isFullscreen) {
         await this.exitFullscreen();
       } else {
         await this.requestFullscreen();
       }
-      this.updateHTML();
     }
     async requestFullscreen() {
       const container = this.getContainer();
@@ -1623,6 +1654,9 @@ var __exports__ = (() => {
     }
     togglePseudoFullscreen() {
       this.getContainer()?.classList.toggle("deck-pseudo-fullscreen");
+      this.fullscreen = !this.fullscreen;
+      this.props.onFullscreenChange?.(this.fullscreen);
+      this.updateHTML();
     }
   };
   FullscreenWidget.defaultProps = {
@@ -1632,7 +1666,9 @@ var __exports__ = (() => {
     viewId: null,
     enterLabel: "Enter Fullscreen",
     exitLabel: "Exit Fullscreen",
-    container: void 0
+    container: void 0,
+    onFullscreenChange: () => {
+    }
   };
 
   // src/splitter-widget.tsx
@@ -4429,20 +4465,27 @@ var __exports__ = (() => {
       this.id = "timeline";
       this.className = "deck-widget-timeline";
       this.placement = "fill";
-      this.playing = false;
+      this._playing = false;
       this.timerId = null;
       this.handlePlayPause = () => {
-        if (this.playing) {
-          this.stop();
-        } else {
-          this.play();
+        const isPlaying = this.getPlaying();
+        const nextPlaying = !isPlaying;
+        this.props.onPlayingChange?.(nextPlaying);
+        if (this.props.playing === void 0) {
+          if (nextPlaying) {
+            this.play();
+          } else {
+            this.stop();
+          }
         }
       };
       this.handleTimeChange = ([value]) => {
-        this.currentTime = value;
-        this.props.timeline?.setTime(value);
         this.props.onTimeChange(value);
-        this.updateHTML();
+        if (this.props.time === void 0) {
+          this.currentTime = value;
+          this.props.timeline?.setTime(value);
+          this.updateHTML();
+        }
       };
       this.tick = () => {
         const {
@@ -4451,51 +4494,90 @@ var __exports__ = (() => {
           loop
         } = this.props;
         if (step > 0) {
-          let next = Math.round(this.currentTime / step) * step + step;
+          const currentTime = this.getTime();
+          let next = Math.round(currentTime / step) * step + step;
           if (next > max2) {
-            if (this.currentTime < max2) {
+            if (currentTime < max2) {
               next = max2;
             } else if (loop) {
               next = min2;
             } else {
               next = max2;
-              this.playing = false;
+              this._playing = false;
+              this.props.onPlayingChange?.(false);
             }
           }
-          this.currentTime = next;
           this.props.onTimeChange(next);
+          if (this.props.time === void 0) {
+            this.currentTime = next;
+            this.props.timeline?.setTime(next);
+          }
           this.updateHTML();
         }
-        if (this.playing) {
+        if (this._playing) {
           this.timerId = window.setTimeout(this.tick, this.props.playInterval);
         } else {
           this.timerId = null;
         }
       };
       this.currentTime = this.props.initialTime ?? this.props.timeRange[0];
-      this.props.timeline?.setTime(this.currentTime);
+      const syncTime = this.props.time ?? this.currentTime;
+      this.props.timeline?.setTime(syncTime);
       this.setProps(this.props);
     }
+    /**
+     * Returns the current time value.
+     * In controlled mode, returns the time prop.
+     * In uncontrolled mode, returns the internal state.
+     */
+    getTime() {
+      return this.props.time ?? this.currentTime;
+    }
+    /**
+     * Returns the current playing state.
+     * In controlled mode, returns the playing prop.
+     * In uncontrolled mode, returns the internal state.
+     */
+    getPlaying() {
+      return this.props.playing ?? this._playing;
+    }
     setProps(props) {
+      const { playing: prevPlaying, time: prevTime } = this.props;
       this.viewId = props.viewId ?? this.viewId;
       super.setProps(props);
+      if (props.time !== void 0 && props.time !== prevTime) {
+        this.props.timeline?.setTime(props.time);
+      }
+      if (props.playing !== void 0 && props.playing !== prevPlaying) {
+        if (props.playing && !this._playing) {
+          this._startTimer();
+        } else if (!props.playing && this._playing) {
+          this._stopTimer();
+        }
+      }
     }
     onAdd() {
-      this.playing = false;
+      this._playing = false;
       this.timerId = null;
-      if (this.props.autoPlay)
-        this.play();
+      if (this.props.autoPlay) {
+        if (this.props.playing !== void 0) {
+          this.props.onPlayingChange?.(true);
+        } else {
+          this.play();
+        }
+      }
     }
     onRemove() {
       this.stop();
     }
     onRenderHTML(rootElement) {
       const { timeRange, step, formatLabel } = this.props;
-      const currentTime = this.currentTime;
+      const isPlaying = this.getPlaying();
+      const currentTime = this.getTime();
       rootElement.dataset.placement = this.props.placement;
       B(
         /* @__PURE__ */ u2("div", { className: "deck-widget-button-group", children: [
-          this.playing ? /* @__PURE__ */ u2(
+          isPlaying ? /* @__PURE__ */ u2(
             IconButton,
             {
               label: "Pause",
@@ -4532,24 +4614,34 @@ var __exports__ = (() => {
       );
     }
     play() {
-      this.playing = true;
+      this._playing = true;
       const {
         timeRange: [min2, max2]
       } = this.props;
-      if (this.currentTime >= max2) {
+      if (this.props.time === void 0 && this.getTime() >= max2) {
         this.currentTime = min2;
         this.props.onTimeChange(min2);
+        this.props.timeline?.setTime(min2);
       }
       this.updateHTML();
       this.tick();
     }
     stop() {
-      this.playing = false;
+      this._stopTimer();
+      this.updateHTML();
+    }
+    /** Start the playback timer (used internally) */
+    _startTimer() {
+      this._playing = true;
+      this.tick();
+    }
+    /** Stop the playback timer (used internally) */
+    _stopTimer() {
+      this._playing = false;
       if (this.timerId !== null) {
         window.clearTimeout(this.timerId);
         this.timerId = null;
       }
-      this.updateHTML();
     }
   };
   TimelineWidget.defaultProps = {
@@ -4561,11 +4653,15 @@ var __exports__ = (() => {
     timeRange: [0, 100],
     step: 1,
     initialTime: void 0,
+    time: void 0,
     onTimeChange: () => {
     },
     autoPlay: false,
     loop: false,
     playInterval: 1e3,
+    playing: void 0,
+    onPlayingChange: () => {
+    },
     formatLabel: String
   };
 
@@ -4760,53 +4856,72 @@ var __exports__ = (() => {
     }
     // eslint-disable-next-line complexity
     setProps(props) {
-      const { lightModeTheme, darkModeTheme } = this.props;
+      const { lightModeTheme, darkModeTheme, themeMode: prevThemeMode } = this.props;
       this.placement = props.placement ?? this.placement;
       this.viewId = props.viewId ?? this.viewId;
       super.setProps(props);
-      switch (this.themeMode) {
+      const currentMode = this.getThemeMode();
+      if (props.themeMode !== void 0 && props.themeMode !== prevThemeMode) {
+        this._applyTheme(props.themeMode);
+        return;
+      }
+      switch (currentMode) {
         case "light":
           if (props.lightModeTheme && !(0, import_core21._deepEqual)(props.lightModeTheme, lightModeTheme, 1)) {
-            this._setThemeMode("light");
+            this._applyTheme("light");
           }
           break;
         case "dark":
           if (props.darkModeTheme && !(0, import_core21._deepEqual)(props.darkModeTheme, darkModeTheme, 1)) {
-            this._setThemeMode("dark");
+            this._applyTheme("dark");
           }
           break;
         default:
-          import_core21.log.warn(`Invalid theme mode ${this.themeMode}`)();
+          import_core21.log.warn(`Invalid theme mode ${currentMode}`)();
       }
     }
     onRenderHTML(rootElement) {
       const { lightModeLabel, darkModeLabel } = this.props;
+      const currentMode = this.getThemeMode();
       B(
         /* @__PURE__ */ u2(
           IconButton,
           {
             onClick: this._handleClick.bind(this),
-            label: this.themeMode === "dark" ? darkModeLabel : lightModeLabel,
-            className: this.themeMode === "dark" ? "deck-widget-moon" : "deck-widget-sun"
+            label: currentMode === "dark" ? darkModeLabel : lightModeLabel,
+            className: currentMode === "dark" ? "deck-widget-moon" : "deck-widget-sun"
           }
         ),
         rootElement
       );
     }
     onAdd() {
-      this._setThemeMode(this.themeMode);
+      this._applyTheme(this.getThemeMode());
+    }
+    /**
+     * Returns the current theme mode.
+     * In controlled mode, returns the themeMode prop.
+     * In uncontrolled mode, returns the internal state.
+     */
+    getThemeMode() {
+      return this.props.themeMode ?? this.themeMode;
     }
     _handleClick() {
-      const newThemeMode = this.themeMode === "dark" ? "light" : "dark";
-      this._setThemeMode(newThemeMode);
+      const currentMode = this.getThemeMode();
+      const nextMode = currentMode === "dark" ? "light" : "dark";
+      this.props.onThemeModeChange?.(nextMode);
+      if (this.props.themeMode === void 0) {
+        this.themeMode = nextMode;
+        this._applyTheme(nextMode);
+      }
     }
-    _setThemeMode(themeMode) {
-      this.themeMode = themeMode;
+    /** Apply theme styling without changing internal state */
+    _applyTheme(themeMode) {
       const container = this.rootElement?.closest(".deck-widget-container");
       if (container) {
         const themeStyle = themeMode === "dark" ? this.props.darkModeTheme : this.props.lightModeTheme;
         (0, import_core21._applyStyles)(container, themeStyle);
-        const label = this.themeMode === "dark" ? this.props.darkModeLabel : this.props.lightModeLabel;
+        const label = themeMode === "dark" ? this.props.darkModeLabel : this.props.lightModeLabel;
         import_core21.log.log(1, `Switched theme to ${label}`, themeStyle)();
         this.updateHTML();
       }
@@ -4832,7 +4947,10 @@ var __exports__ = (() => {
     lightModeTheme: LightGlassTheme,
     darkModeLabel: "Dark Mode",
     darkModeTheme: DarkGlassTheme,
-    initialThemeMode: "auto"
+    initialThemeMode: "auto",
+    themeMode: void 0,
+    onThemeModeChange: () => {
+    }
   };
 
   // src/loading-widget.tsx
@@ -4868,6 +4986,7 @@ var __exports__ = (() => {
       const loading = layers.some((layer) => !layer.isLoaded);
       if (loading !== this.loading) {
         this.loading = loading;
+        this.props.onLoadingChange?.(loading);
         this.updateHTML();
       }
     }
@@ -4880,7 +4999,9 @@ var __exports__ = (() => {
     id: "loading",
     placement: "top-left",
     viewId: null,
-    label: "Loading layer data"
+    label: "Loading layer data",
+    onLoadingChange: () => {
+    }
   };
 
   // src/stats-widget.tsx
@@ -4907,19 +5028,31 @@ var __exports__ = (() => {
       this.className = "deck-widget-stats";
       this.placement = "top-left";
       this._counter = 0;
-      this.collapsed = true;
-      this._toggleCollapsed = () => {
-        this.collapsed = !this.collapsed;
-        this.updateHTML();
+      this._expanded = false;
+      this._toggleExpanded = () => {
+        const nextExpanded = !this.getExpanded();
+        this.props.onExpandedChange?.(nextExpanded);
+        if (this.props.expanded === void 0) {
+          this._expanded = nextExpanded;
+          this.updateHTML();
+        }
       };
       this._getFps = () => {
         return Math.round(this.deck?.metrics.fps ?? 0);
       };
       this._formatters = { ...DEFAULT_FORMATTERS };
       this._resetOnUpdate = { ...this.props.resetOnUpdate };
-      this.collapsed = !props.defaultIsExpanded;
+      this._expanded = Boolean(props.initialExpanded);
       this.setProps(props);
     }
+    /**
+     * Returns the current expanded state.
+     * In controlled mode, returns the expanded prop.
+     * In uncontrolled mode, returns the internal state.
+     */
+    getExpanded() {
+      return this.props.expanded ?? this._expanded;
+    }
     setProps(props) {
       this.placement = props.placement ?? this.placement;
       this.viewId = props.viewId ?? this.viewId;
@@ -4940,9 +5073,9 @@ var __exports__ = (() => {
       }
     }
     onRenderHTML(rootElement) {
-      const collapsed = this.collapsed;
-      if (collapsed) {
-        B(/* @__PURE__ */ u2(FpsIcon, { getFps: this._getFps, onClick: this._toggleCollapsed }), rootElement);
+      const isExpanded = this.getExpanded();
+      if (!isExpanded) {
+        B(/* @__PURE__ */ u2(FpsIcon, { getFps: this._getFps, onClick: this._toggleExpanded }), rootElement);
         return;
       }
       const stats = this._getStats();
@@ -4969,7 +5102,7 @@ var __exports__ = (() => {
             {
               className: "deck-widget-stats-header",
               style: { cursor: "pointer", pointerEvents: "auto" },
-              onClick: this._toggleCollapsed,
+              onClick: this._toggleExpanded,
               children: [
                 /* @__PURE__ */ u2("b", { children: title }),
                 deviceLabel && /* @__PURE__ */ u2("span", { className: "deck-widget-stats-device", children: deviceLabel }),
@@ -4983,7 +5116,7 @@ var __exports__ = (() => {
       );
     }
     onRedraw() {
-      if (!this.collapsed) {
+      if (this.getExpanded()) {
         const framesPerUpdate = Math.max(1, this.props.framesPerUpdate || 1);
         if (this._counter++ % framesPerUpdate === 0) {
           this.updateHTML();
@@ -5036,13 +5169,16 @@ var __exports__ = (() => {
     type: "deck",
     placement: "top-left",
     viewId: null,
-    defaultIsExpanded: false,
+    initialExpanded: false,
     stats: void 0,
     title: "Stats",
     framesPerUpdate: 1,
     formatters: {},
     resetOnUpdate: {},
-    id: "stats"
+    id: "stats",
+    expanded: void 0,
+    onExpandedChange: () => {
+    }
   };
   function FpsIcon({ getFps, onClick }) {
     const [fps, setFps] = h2(getFps());