@deck.gl/widgets 9.0.24 → 9.0.26

package/dist/compass-widget.d.ts

@@ -28,19 +28,21 @@ export declare class CompassWidget implements Widget<CompassWidgetProps> {
     props: CompassWidgetProps;
     placement: WidgetPlacement;
     viewId?: string | null;
-    viewport?: Viewport;
+    viewports: {
+        [id: string]: Viewport;
+    };
     deck?: Deck<any>;
     element?: HTMLDivElement;
     constructor(props: CompassWidgetProps);
     setProps(props: Partial<CompassWidgetProps>): void;
-    onViewportChange(viewport: any): void;
+    onViewportChange(viewport: Viewport): void;
     onAdd({ deck }: {
         deck: Deck<any>;
     }): HTMLDivElement;
-    getRotation(): number[];
+    getRotation(viewport?: Viewport): number[];
     update(): void;
     onRemove(): void;
-    handleCompassReset(): void;
+    handleCompassReset(viewport: Viewport): void;
 }
 export {};
 //# sourceMappingURL=compass-widget.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"compass-widget.d.ts","sourceRoot":"","sources":["../src/compass-widget.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAG3E,UAAU,kBAAkB;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,qBAAa,aAAc,YAAW,MAAM,CAAC,kBAAkB,CAAC;IAC9D,EAAE,SAAa;IACf,KAAK,EAAE,kBAAkB,CAAC;IAC1B,SAAS,EAAE,eAAe,CAAc;IACxC,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC9B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;gBAEb,KAAK,EAAE,kBAAkB;IAUrC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,kBAAkB,CAAC;IAI3C,gBAAgB,CAAC,QAAQ,KAAA;IAKzB,KAAK,CAAC,EAAC,IAAI,EAAC,EAAE;QAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAA;KAAC,GAAG,cAAc;IAchD,WAAW;IASX,MAAM;IAgCN,QAAQ;IAKR,kBAAkB;CAcnB"}
+{"version":3,"file":"compass-widget.d.ts","sourceRoot":"","sources":["../src/compass-widget.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAG3E,UAAU,kBAAkB;IAC1B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,qBAAa,aAAc,YAAW,MAAM,CAAC,kBAAkB,CAAC;IAC9D,EAAE,SAAa;IACf,KAAK,EAAE,kBAAkB,CAAC;IAC1B,SAAS,EAAE,eAAe,CAAc;IACxC,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC9B,SAAS,EAAE;QAAC,CAAC,EAAE,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAC,CAAM;IACzC,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;gBAEb,KAAK,EAAE,kBAAkB;IAUrC,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,kBAAkB,CAAC;IAI3C,gBAAgB,CAAC,QAAQ,EAAE,QAAQ;IAKnC,KAAK,CAAC,EAAC,IAAI,EAAC,EAAE;QAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAA;KAAC,GAAG,cAAc;IAchD,WAAW,CAAC,QAAQ,CAAC,EAAE,QAAQ;IAS/B,MAAM;IAsCN,QAAQ;IAKR,kBAAkB,CAAC,QAAQ,EAAE,QAAQ;CActC"}

package/dist/compass-widget.js

@@ -7,6 +7,7 @@ export class CompassWidget {
         this.id = 'compass';
         this.placement = 'top-left';
         this.viewId = null;
+        this.viewports = {};
         this.id = props.id || 'compass';
         this.viewId = props.viewId || null;
         this.placement = props.placement || 'top-left';
@@ -19,7 +20,7 @@ export class CompassWidget {
         Object.assign(this.props, props);
     }
     onViewportChange(viewport) {
-        this.viewport = viewport;
+        this.viewports[viewport.id] = viewport;
         this.update();
     }
     onAdd({ deck }) {
@@ -36,35 +37,41 @@ export class CompassWidget {
         this.update();
         return element;
     }
-    getRotation() {
-        if (this.viewport instanceof WebMercatorViewport) {
-            return [-this.viewport.bearing, this.viewport.pitch];
+    getRotation(viewport) {
+        if (viewport instanceof WebMercatorViewport) {
+            return [-viewport.bearing, viewport.pitch];
         }
-        else if (this.viewport instanceof _GlobeViewport) {
-            return [0, Math.max(-80, Math.min(80, this.viewport.latitude))];
+        else if (viewport instanceof _GlobeViewport) {
+            return [0, Math.max(-80, Math.min(80, viewport.latitude))];
         }
         return [0, 0];
     }
     update() {
-        const [rz, rx] = this.getRotation();
+        const viewId = this.viewId || Object.values(this.viewports)[0]?.id || 'default-view';
+        const viewport = this.viewports[viewId];
+        const [rz, rx] = this.getRotation(viewport);
         const element = this.element;
         if (!element) {
             return;
         }
-        const ui = (_jsx("div", { className: "deck-widget-button", style: { perspective: 100 }, children: _jsx("button", { type: "button", onClick: () => this.handleCompassReset(), label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: _jsx("svg", { fill: "none", width: "100%", height: "100%", viewBox: "0 0 26 26", children: _jsxs("g", { transform: `rotate(${rz},13,13)`, children: [_jsx("path", { d: "M10 13.0001L12.9999 5L15.9997 13.0001H10Z", fill: "var(--icon-compass-north-color, #F05C44)" }), _jsx("path", { d: "M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z", fill: "var(--icon-compass-south-color, #C2C2CC)" })] }) }) }) }));
+        const ui = (_jsx("div", { className: "deck-widget-button", style: { perspective: 100 }, children: _jsx("button", { type: "button", onClick: () => {
+                    for (const viewport of Object.values(this.viewports)) {
+                        this.handleCompassReset(viewport);
+                    }
+                }, label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: _jsx("svg", { fill: "none", width: "100%", height: "100%", viewBox: "0 0 26 26", children: _jsxs("g", { transform: `rotate(${rz},13,13)`, children: [_jsx("path", { d: "M10 13.0001L12.9999 5L15.9997 13.0001H10Z", fill: "var(--icon-compass-north-color, #F05C44)" }), _jsx("path", { d: "M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z", fill: "var(--icon-compass-south-color, #C2C2CC)" })] }) }) }) }));
         render(ui, element);
     }
     onRemove() {
         this.deck = undefined;
         this.element = undefined;
     }
-    handleCompassReset() {
-        const viewId = this.viewId || this.viewport?.id || 'default-view';
-        if (this.viewport instanceof WebMercatorViewport) {
+    handleCompassReset(viewport) {
+        const viewId = this.viewId || viewport.id || 'default-view';
+        if (viewport instanceof WebMercatorViewport) {
             const nextViewState = {
-                ...this.viewport,
+                ...viewport,
                 bearing: 0,
-                ...(this.getRotation()[0] === 0 ? { pitch: 0 } : {}),
+                ...(this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {}),
                 transitionDuration: this.props.transitionDuration,
                 transitionInterpolator: new FlyToInterpolator()
             };

package/dist/dist.dev.js

@@ -530,6 +530,7 @@ var __exports__ = (() => {
       this.id = "compass";
       this.placement = "top-left";
       this.viewId = null;
+      this.viewports = {};
       this.id = props.id || "compass";
       this.viewId = props.viewId || null;
       this.placement = props.placement || "top-left";
@@ -542,7 +543,7 @@ var __exports__ = (() => {
       Object.assign(this.props, props);
     }
     onViewportChange(viewport) {
-      this.viewport = viewport;
+      this.viewports[viewport.id] = viewport;
       this.update();
     }
     onAdd({ deck }) {
@@ -559,16 +560,18 @@ var __exports__ = (() => {
       this.update();
       return element;
     }
-    getRotation() {
-      if (this.viewport instanceof import_core3.WebMercatorViewport) {
-        return [-this.viewport.bearing, this.viewport.pitch];
-      } else if (this.viewport instanceof import_core3._GlobeViewport) {
-        return [0, Math.max(-80, Math.min(80, this.viewport.latitude))];
+    getRotation(viewport) {
+      if (viewport instanceof import_core3.WebMercatorViewport) {
+        return [-viewport.bearing, viewport.pitch];
+      } else if (viewport instanceof import_core3._GlobeViewport) {
+        return [0, Math.max(-80, Math.min(80, viewport.latitude))];
       }
       return [0, 0];
     }
     update() {
-      const [rz, rx] = this.getRotation();
+      const viewId = this.viewId || Object.values(this.viewports)[0]?.id || "default-view";
+      const viewport = this.viewports[viewId];
+      const [rz, rx] = this.getRotation(viewport);
       const element = this.element;
       if (!element) {
         return;
@@ -577,7 +580,11 @@ var __exports__ = (() => {
         "button",
         {
           type: "button",
-          onClick: () => this.handleCompassReset(),
+          onClick: () => {
+            for (const viewport2 of Object.values(this.viewports)) {
+              this.handleCompassReset(viewport2);
+            }
+          },
           label: this.props.label,
           style: { transform: `rotateX(${rx}deg)` },
           children: /* @__PURE__ */ u2("svg", { fill: "none", width: "100%", height: "100%", viewBox: "0 0 26 26", children: /* @__PURE__ */ u2("g", { transform: `rotate(${rz},13,13)`, children: [
@@ -604,13 +611,13 @@ var __exports__ = (() => {
       this.deck = void 0;
       this.element = void 0;
     }
-    handleCompassReset() {
-      const viewId = this.viewId || this.viewport?.id || "default-view";
-      if (this.viewport instanceof import_core3.WebMercatorViewport) {
+    handleCompassReset(viewport) {
+      const viewId = this.viewId || viewport.id || "default-view";
+      if (viewport instanceof import_core3.WebMercatorViewport) {
         const nextViewState = {
-          ...this.viewport,
+          ...viewport,
           bearing: 0,
-          ...this.getRotation()[0] === 0 ? { pitch: 0 } : {},
+          ...this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {},
           transitionDuration: this.props.transitionDuration,
           transitionInterpolator: new import_core3.FlyToInterpolator()
         };
@@ -627,6 +634,7 @@ var __exports__ = (() => {
       this.placement = "top-left";
       this.orientation = "vertical";
       this.viewId = null;
+      this.viewports = {};
       this.id = props.id || "zoom";
       this.viewId = props.viewId || null;
       this.placement = props.placement || "top-left";
@@ -677,12 +685,12 @@ var __exports__ = (() => {
       Object.assign(this.props, props);
     }
     onViewportChange(viewport) {
-      this.viewport = viewport;
+      this.viewports[viewport.id] = viewport;
     }
-    handleZoom(nextZoom) {
-      const viewId = this.viewId || this.viewport?.id || "default-view";
+    handleZoom(viewport, nextZoom) {
+      const viewId = this.viewId || viewport?.id || "default-view";
       const nextViewState = {
-        ...this.viewport,
+        ...viewport,
         zoom: nextZoom,
         transitionDuration: this.props.transitionDuration,
         transitionInterpolator: new import_core4.FlyToInterpolator()
@@ -690,13 +698,13 @@ var __exports__ = (() => {
       this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });
     }
     handleZoomIn() {
-      if (this.viewport) {
-        this.handleZoom(this.viewport.zoom + 1);
+      for (const viewport of Object.values(this.viewports)) {
+        this.handleZoom(viewport, viewport.zoom + 1);
       }
     }
     handleZoomOut() {
-      if (this.viewport) {
-        this.handleZoom(this.viewport.zoom - 1);
+      for (const viewport of Object.values(this.viewports)) {
+        this.handleZoom(viewport, viewport.zoom - 1);
       }
     }
   };

package/dist/index.cjs

@@ -163,6 +163,7 @@ var CompassWidget = class {
     this.id = "compass";
     this.placement = "top-left";
     this.viewId = null;
+    this.viewports = {};
     this.id = props.id || "compass";
     this.viewId = props.viewId || null;
     this.placement = props.placement || "top-left";
@@ -175,7 +176,7 @@ var CompassWidget = class {
     Object.assign(this.props, props);
   }
   onViewportChange(viewport) {
-    this.viewport = viewport;
+    this.viewports[viewport.id] = viewport;
     this.update();
   }
   onAdd({ deck }) {
@@ -192,35 +193,41 @@ var CompassWidget = class {
     this.update();
     return element;
   }
-  getRotation() {
-    if (this.viewport instanceof import_core2.WebMercatorViewport) {
-      return [-this.viewport.bearing, this.viewport.pitch];
-    } else if (this.viewport instanceof import_core2._GlobeViewport) {
-      return [0, Math.max(-80, Math.min(80, this.viewport.latitude))];
+  getRotation(viewport) {
+    if (viewport instanceof import_core2.WebMercatorViewport) {
+      return [-viewport.bearing, viewport.pitch];
+    } else if (viewport instanceof import_core2._GlobeViewport) {
+      return [0, Math.max(-80, Math.min(80, viewport.latitude))];
     }
     return [0, 0];
   }
   update() {
-    const [rz, rx] = this.getRotation();
+    var _a;
+    const viewId = this.viewId || ((_a = Object.values(this.viewports)[0]) == null ? void 0 : _a.id) || "default-view";
+    const viewport = this.viewports[viewId];
+    const [rz, rx] = this.getRotation(viewport);
     const element = this.element;
     if (!element) {
       return;
     }
-    const ui = (0, import_jsx_runtime3.jsx)("div", { className: "deck-widget-button", style: { perspective: 100 }, children: (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: () => this.handleCompassReset(), label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: (0, import_jsx_runtime3.jsx)("svg", { fill: "none", width: "100%", height: "100%", viewBox: "0 0 26 26", children: (0, import_jsx_runtime3.jsxs)("g", { transform: `rotate(${rz},13,13)`, children: [(0, import_jsx_runtime3.jsx)("path", { d: "M10 13.0001L12.9999 5L15.9997 13.0001H10Z", fill: "var(--icon-compass-north-color, #F05C44)" }), (0, import_jsx_runtime3.jsx)("path", { d: "M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z", fill: "var(--icon-compass-south-color, #C2C2CC)" })] }) }) }) });
+    const ui = (0, import_jsx_runtime3.jsx)("div", { className: "deck-widget-button", style: { perspective: 100 }, children: (0, import_jsx_runtime3.jsx)("button", { type: "button", onClick: () => {
+      for (const viewport2 of Object.values(this.viewports)) {
+        this.handleCompassReset(viewport2);
+      }
+    }, label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: (0, import_jsx_runtime3.jsx)("svg", { fill: "none", width: "100%", height: "100%", viewBox: "0 0 26 26", children: (0, import_jsx_runtime3.jsxs)("g", { transform: `rotate(${rz},13,13)`, children: [(0, import_jsx_runtime3.jsx)("path", { d: "M10 13.0001L12.9999 5L15.9997 13.0001H10Z", fill: "var(--icon-compass-north-color, #F05C44)" }), (0, import_jsx_runtime3.jsx)("path", { d: "M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z", fill: "var(--icon-compass-south-color, #C2C2CC)" })] }) }) }) });
     (0, import_preact2.render)(ui, element);
   }
   onRemove() {
     this.deck = void 0;
     this.element = void 0;
   }
-  handleCompassReset() {
-    var _a;
-    const viewId = this.viewId || ((_a = this.viewport) == null ? void 0 : _a.id) || "default-view";
-    if (this.viewport instanceof import_core2.WebMercatorViewport) {
+  handleCompassReset(viewport) {
+    const viewId = this.viewId || viewport.id || "default-view";
+    if (viewport instanceof import_core2.WebMercatorViewport) {
       const nextViewState = {
-        ...this.viewport,
+        ...viewport,
         bearing: 0,
-        ...this.getRotation()[0] === 0 ? { pitch: 0 } : {},
+        ...this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {},
         transitionDuration: this.props.transitionDuration,
         transitionInterpolator: new import_core2.FlyToInterpolator()
       };
@@ -239,6 +246,7 @@ var ZoomWidget = class {
     this.placement = "top-left";
     this.orientation = "vertical";
     this.viewId = null;
+    this.viewports = {};
     this.id = props.id || "zoom";
     this.viewId = props.viewId || null;
     this.placement = props.placement || "top-left";
@@ -272,13 +280,12 @@ var ZoomWidget = class {
     Object.assign(this.props, props);
   }
   onViewportChange(viewport) {
-    this.viewport = viewport;
+    this.viewports[viewport.id] = viewport;
   }
-  handleZoom(nextZoom) {
-    var _a;
-    const viewId = this.viewId || ((_a = this.viewport) == null ? void 0 : _a.id) || "default-view";
+  handleZoom(viewport, nextZoom) {
+    const viewId = this.viewId || (viewport == null ? void 0 : viewport.id) || "default-view";
     const nextViewState = {
-      ...this.viewport,
+      ...viewport,
       zoom: nextZoom,
       transitionDuration: this.props.transitionDuration,
       transitionInterpolator: new import_core3.FlyToInterpolator()
@@ -286,13 +293,13 @@ var ZoomWidget = class {
     this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });
   }
   handleZoomIn() {
-    if (this.viewport) {
-      this.handleZoom(this.viewport.zoom + 1);
+    for (const viewport of Object.values(this.viewports)) {
+      this.handleZoom(viewport, viewport.zoom + 1);
     }
   }
   handleZoomOut() {
-    if (this.viewport) {
-      this.handleZoom(this.viewport.zoom - 1);
+    for (const viewport of Object.values(this.viewports)) {
+      this.handleZoom(viewport, viewport.zoom - 1);
     }
   }
 };

package/dist/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["index.js", "fullscreen-widget.js", "components.js", "compass-widget.js", "zoom-widget.js", "themes.js"],
-  "sourcesContent": ["export { FullscreenWidget } from \"./fullscreen-widget.js\";\nexport { CompassWidget } from \"./compass-widget.js\";\nexport { ZoomWidget } from \"./zoom-widget.js\";\nexport * from \"./themes.js\";\n", "import { jsx as _jsx } from \"preact/jsx-runtime\";\n/* global document */\nimport { _deepEqual as deepEqual } from '@deck.gl/core';\nimport { render } from 'preact';\nimport { IconButton } from \"./components.js\";\nexport class FullscreenWidget {\n    constructor(props) {\n        this.id = 'fullscreen';\n        this.placement = 'top-left';\n        this.fullscreen = false;\n        this.id = props.id || 'fullscreen';\n        this.placement = props.placement || 'top-left';\n        props.enterLabel = props.enterLabel || 'Enter Fullscreen';\n        props.exitLabel = props.exitLabel || 'Exit Fullscreen';\n        props.style = props.style || {};\n        this.props = props;\n    }\n    onAdd({ deck }) {\n        const { style, className } = this.props;\n        const el = document.createElement('div');\n        el.classList.add('deck-widget', 'deck-widget-fullscreen');\n        if (className)\n            el.classList.add(className);\n        if (style) {\n            Object.entries(style).map(([key, value]) => el.style.setProperty(key, value));\n        }\n        this.deck = deck;\n        this.element = el;\n        this.update();\n        document.addEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n        return el;\n    }\n    onRemove() {\n        this.deck = undefined;\n        this.element = undefined;\n        document.removeEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n    }\n    update() {\n        const { enterLabel, exitLabel } = this.props;\n        const el = this.element;\n        if (!el) {\n            return;\n        }\n        const ui = (_jsx(IconButton, { onClick: this.handleClick.bind(this), label: this.fullscreen ? exitLabel : enterLabel, className: this.fullscreen ? 'deck-widget-fullscreen-exit' : 'deck-widget-fullscreen-enter' }));\n        render(ui, el);\n    }\n    setProps(props) {\n        const oldProps = this.props;\n        const el = this.element;\n        if (el) {\n            if (oldProps.className !== props.className) {\n                if (oldProps.className)\n                    el.classList.remove(oldProps.className);\n                if (props.className)\n                    el.classList.add(props.className);\n            }\n            if (!deepEqual(oldProps.style, props.style, 1)) {\n                if (oldProps.style) {\n                    Object.entries(oldProps.style).map(([key]) => el.style.removeProperty(key));\n                }\n                if (props.style) {\n                    Object.entries(props.style).map(([key, value]) => el.style.setProperty(key, value));\n                }\n            }\n        }\n        Object.assign(this.props, props);\n    }\n    getContainer() {\n        return this.props.container || this.deck?.getCanvas()?.parentElement;\n    }\n    onFullscreenChange() {\n        const prevFullscreen = this.fullscreen;\n        const fullscreen = document.fullscreenElement === this.getContainer();\n        if (prevFullscreen !== fullscreen) {\n            this.fullscreen = !this.fullscreen;\n        }\n        this.update();\n    }\n    async handleClick() {\n        if (this.fullscreen) {\n            await this.exitFullscreen();\n        }\n        else {\n            await this.requestFullscreen();\n        }\n        this.update();\n    }\n    async requestFullscreen() {\n        const container = this.getContainer();\n        if (container?.requestFullscreen) {\n            await container.requestFullscreen({ navigationUI: 'hide' });\n        }\n        else {\n            this.togglePseudoFullscreen();\n        }\n    }\n    async exitFullscreen() {\n        if (document.exitFullscreen) {\n            await document.exitFullscreen();\n        }\n        else {\n            this.togglePseudoFullscreen();\n        }\n    }\n    togglePseudoFullscreen() {\n        this.getContainer()?.classList.toggle('deck-pseudo-fullscreen');\n    }\n}\n", "import { jsx as _jsx } from \"preact/jsx-runtime\";\nexport const IconButton = props => {\n    const { className, label, onClick } = props;\n    return (_jsx(\"div\", { className: \"deck-widget-button\", children: _jsx(\"button\", { className: `deck-widget-icon-button ${className}`, type: \"button\", onClick: onClick, title: label, children: _jsx(\"div\", { className: \"deck-widget-icon\" }) }) }));\n};\nexport const ButtonGroup = props => {\n    const { children, orientation } = props;\n    return _jsx(\"div\", { className: `deck-widget-button-group ${orientation}`, children: children });\n};\nexport const GroupedIconButton = props => {\n    const { className, label, onClick } = props;\n    return (_jsx(\"button\", { className: `deck-widget-icon-button ${className}`, type: \"button\", onClick: onClick, title: label, children: _jsx(\"div\", { className: \"deck-widget-icon\" }) }));\n};\n", "import { jsx as _jsx, jsxs as _jsxs } from \"preact/jsx-runtime\";\n/* global document */\nimport { FlyToInterpolator, WebMercatorViewport, _GlobeViewport } from '@deck.gl/core';\nimport { render } from 'preact';\nexport class CompassWidget {\n    constructor(props) {\n        this.id = 'compass';\n        this.placement = 'top-left';\n        this.viewId = null;\n        this.id = props.id || 'compass';\n        this.viewId = props.viewId || null;\n        this.placement = props.placement || 'top-left';\n        props.transitionDuration = props.transitionDuration || 200;\n        props.label = props.label || 'Compass';\n        props.style = props.style || {};\n        this.props = props;\n    }\n    setProps(props) {\n        Object.assign(this.props, props);\n    }\n    onViewportChange(viewport) {\n        this.viewport = viewport;\n        this.update();\n    }\n    onAdd({ deck }) {\n        const { style, className } = this.props;\n        const element = document.createElement('div');\n        element.classList.add('deck-widget', 'deck-widget-compass');\n        if (className)\n            element.classList.add(className);\n        if (style) {\n            Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));\n        }\n        this.deck = deck;\n        this.element = element;\n        this.update();\n        return element;\n    }\n    getRotation() {\n        if (this.viewport instanceof WebMercatorViewport) {\n            return [-this.viewport.bearing, this.viewport.pitch];\n        }\n        else if (this.viewport instanceof _GlobeViewport) {\n            return [0, Math.max(-80, Math.min(80, this.viewport.latitude))];\n        }\n        return [0, 0];\n    }\n    update() {\n        const [rz, rx] = this.getRotation();\n        const element = this.element;\n        if (!element) {\n            return;\n        }\n        const ui = (_jsx(\"div\", { className: \"deck-widget-button\", style: { perspective: 100 }, children: _jsx(\"button\", { type: \"button\", onClick: () => this.handleCompassReset(), label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: _jsx(\"svg\", { fill: \"none\", width: \"100%\", height: \"100%\", viewBox: \"0 0 26 26\", children: _jsxs(\"g\", { transform: `rotate(${rz},13,13)`, children: [_jsx(\"path\", { d: \"M10 13.0001L12.9999 5L15.9997 13.0001H10Z\", fill: \"var(--icon-compass-north-color, #F05C44)\" }), _jsx(\"path\", { d: \"M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z\", fill: \"var(--icon-compass-south-color, #C2C2CC)\" })] }) }) }) }));\n        render(ui, element);\n    }\n    onRemove() {\n        this.deck = undefined;\n        this.element = undefined;\n    }\n    handleCompassReset() {\n        const viewId = this.viewId || this.viewport?.id || 'default-view';\n        if (this.viewport instanceof WebMercatorViewport) {\n            const nextViewState = {\n                ...this.viewport,\n                bearing: 0,\n                ...(this.getRotation()[0] === 0 ? { pitch: 0 } : {}),\n                transitionDuration: this.props.transitionDuration,\n                transitionInterpolator: new FlyToInterpolator()\n            };\n            // @ts-ignore Using private method temporary until there's a public one\n            this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });\n        }\n    }\n}\n", "import { jsx as _jsx, jsxs as _jsxs } from \"preact/jsx-runtime\";\n/* global document */\nimport { FlyToInterpolator } from '@deck.gl/core';\nimport { render } from 'preact';\nimport { ButtonGroup, GroupedIconButton } from \"./components.js\";\nexport class ZoomWidget {\n    constructor(props) {\n        this.id = 'zoom';\n        this.placement = 'top-left';\n        this.orientation = 'vertical';\n        this.viewId = null;\n        this.id = props.id || 'zoom';\n        this.viewId = props.viewId || null;\n        this.placement = props.placement || 'top-left';\n        this.orientation = props.orientation || 'vertical';\n        props.transitionDuration = props.transitionDuration || 200;\n        props.zoomInLabel = props.zoomInLabel || 'Zoom In';\n        props.zoomOutLabel = props.zoomOutLabel || 'Zoom Out';\n        props.style = props.style || {};\n        this.props = props;\n    }\n    onAdd({ deck }) {\n        const { style, className } = this.props;\n        const element = document.createElement('div');\n        element.classList.add('deck-widget', 'deck-widget-zoom');\n        if (className)\n            element.classList.add(className);\n        if (style) {\n            Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));\n        }\n        const ui = (_jsxs(ButtonGroup, { orientation: this.orientation, children: [_jsx(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: \"deck-widget-zoom-in\" }), _jsx(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: \"deck-widget-zoom-out\" })] }));\n        render(ui, element);\n        this.deck = deck;\n        this.element = element;\n        return element;\n    }\n    onRemove() {\n        this.deck = undefined;\n        this.element = undefined;\n    }\n    setProps(props) {\n        Object.assign(this.props, props);\n    }\n    onViewportChange(viewport) {\n        this.viewport = viewport;\n    }\n    handleZoom(nextZoom) {\n        const viewId = this.viewId || this.viewport?.id || 'default-view';\n        const nextViewState = {\n            ...this.viewport,\n            zoom: nextZoom,\n            transitionDuration: this.props.transitionDuration,\n            transitionInterpolator: new FlyToInterpolator()\n        };\n        // @ts-ignore Using private method temporary until there's a public one\n        this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });\n    }\n    handleZoomIn() {\n        if (this.viewport) {\n            this.handleZoom(this.viewport.zoom + 1);\n        }\n    }\n    handleZoomOut() {\n        if (this.viewport) {\n            this.handleZoom(this.viewport.zoom - 1);\n        }\n    }\n}\n", "export const LightTheme = {\n    '--button-background': '#fff',\n    '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n    '--button-inner-stroke': 'unset',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n    '--button-backdrop-filter': 'unset',\n    '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n    '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\nexport const DarkTheme = {\n    '--button-background': 'rgba(18, 18, 20, 1)',\n    '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n    '--button-inner-stroke': 'unset',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n    '--button-backdrop-filter': 'unset',\n    '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n    '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\nexport const LightGlassTheme = {\n    '--button-background': 'rgba(255, 255, 255, 0.6)',\n    '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n    '--button-inner-stroke': '1px solid rgba(255, 255, 255, 0.6)',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n    '--button-backdrop-filter': 'blur(4px)',\n    '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n    '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\nexport const DarkGlassTheme = {\n    '--button-background': 'rgba(18, 18, 20, 0.75)',\n    '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n    '--button-inner-stroke': '1px solid rgba(18, 18, 20, 0.75)',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n    '--button-backdrop-filter': 'blur(4px)',\n    '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n    '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\n"],
-  "mappings": "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",
-  "names": ["import_jsx_runtime", "_jsx", "_jsx", "deepEqual", "import_jsx_runtime", "import_core", "import_preact", "_jsx", "_jsxs", "import_jsx_runtime", "import_core", "import_preact", "_jsxs", "_jsx"]
+  "sourcesContent": ["export { FullscreenWidget } from \"./fullscreen-widget.js\";\nexport { CompassWidget } from \"./compass-widget.js\";\nexport { ZoomWidget } from \"./zoom-widget.js\";\nexport * from \"./themes.js\";\n", "import { jsx as _jsx } from \"preact/jsx-runtime\";\n/* global document */\nimport { _deepEqual as deepEqual } from '@deck.gl/core';\nimport { render } from 'preact';\nimport { IconButton } from \"./components.js\";\nexport class FullscreenWidget {\n    constructor(props) {\n        this.id = 'fullscreen';\n        this.placement = 'top-left';\n        this.fullscreen = false;\n        this.id = props.id || 'fullscreen';\n        this.placement = props.placement || 'top-left';\n        props.enterLabel = props.enterLabel || 'Enter Fullscreen';\n        props.exitLabel = props.exitLabel || 'Exit Fullscreen';\n        props.style = props.style || {};\n        this.props = props;\n    }\n    onAdd({ deck }) {\n        const { style, className } = this.props;\n        const el = document.createElement('div');\n        el.classList.add('deck-widget', 'deck-widget-fullscreen');\n        if (className)\n            el.classList.add(className);\n        if (style) {\n            Object.entries(style).map(([key, value]) => el.style.setProperty(key, value));\n        }\n        this.deck = deck;\n        this.element = el;\n        this.update();\n        document.addEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n        return el;\n    }\n    onRemove() {\n        this.deck = undefined;\n        this.element = undefined;\n        document.removeEventListener('fullscreenchange', this.onFullscreenChange.bind(this));\n    }\n    update() {\n        const { enterLabel, exitLabel } = this.props;\n        const el = this.element;\n        if (!el) {\n            return;\n        }\n        const ui = (_jsx(IconButton, { onClick: this.handleClick.bind(this), label: this.fullscreen ? exitLabel : enterLabel, className: this.fullscreen ? 'deck-widget-fullscreen-exit' : 'deck-widget-fullscreen-enter' }));\n        render(ui, el);\n    }\n    setProps(props) {\n        const oldProps = this.props;\n        const el = this.element;\n        if (el) {\n            if (oldProps.className !== props.className) {\n                if (oldProps.className)\n                    el.classList.remove(oldProps.className);\n                if (props.className)\n                    el.classList.add(props.className);\n            }\n            if (!deepEqual(oldProps.style, props.style, 1)) {\n                if (oldProps.style) {\n                    Object.entries(oldProps.style).map(([key]) => el.style.removeProperty(key));\n                }\n                if (props.style) {\n                    Object.entries(props.style).map(([key, value]) => el.style.setProperty(key, value));\n                }\n            }\n        }\n        Object.assign(this.props, props);\n    }\n    getContainer() {\n        return this.props.container || this.deck?.getCanvas()?.parentElement;\n    }\n    onFullscreenChange() {\n        const prevFullscreen = this.fullscreen;\n        const fullscreen = document.fullscreenElement === this.getContainer();\n        if (prevFullscreen !== fullscreen) {\n            this.fullscreen = !this.fullscreen;\n        }\n        this.update();\n    }\n    async handleClick() {\n        if (this.fullscreen) {\n            await this.exitFullscreen();\n        }\n        else {\n            await this.requestFullscreen();\n        }\n        this.update();\n    }\n    async requestFullscreen() {\n        const container = this.getContainer();\n        if (container?.requestFullscreen) {\n            await container.requestFullscreen({ navigationUI: 'hide' });\n        }\n        else {\n            this.togglePseudoFullscreen();\n        }\n    }\n    async exitFullscreen() {\n        if (document.exitFullscreen) {\n            await document.exitFullscreen();\n        }\n        else {\n            this.togglePseudoFullscreen();\n        }\n    }\n    togglePseudoFullscreen() {\n        this.getContainer()?.classList.toggle('deck-pseudo-fullscreen');\n    }\n}\n", "import { jsx as _jsx } from \"preact/jsx-runtime\";\nexport const IconButton = props => {\n    const { className, label, onClick } = props;\n    return (_jsx(\"div\", { className: \"deck-widget-button\", children: _jsx(\"button\", { className: `deck-widget-icon-button ${className}`, type: \"button\", onClick: onClick, title: label, children: _jsx(\"div\", { className: \"deck-widget-icon\" }) }) }));\n};\nexport const ButtonGroup = props => {\n    const { children, orientation } = props;\n    return _jsx(\"div\", { className: `deck-widget-button-group ${orientation}`, children: children });\n};\nexport const GroupedIconButton = props => {\n    const { className, label, onClick } = props;\n    return (_jsx(\"button\", { className: `deck-widget-icon-button ${className}`, type: \"button\", onClick: onClick, title: label, children: _jsx(\"div\", { className: \"deck-widget-icon\" }) }));\n};\n", "import { jsx as _jsx, jsxs as _jsxs } from \"preact/jsx-runtime\";\n/* global document */\nimport { FlyToInterpolator, WebMercatorViewport, _GlobeViewport } from '@deck.gl/core';\nimport { render } from 'preact';\nexport class CompassWidget {\n    constructor(props) {\n        this.id = 'compass';\n        this.placement = 'top-left';\n        this.viewId = null;\n        this.viewports = {};\n        this.id = props.id || 'compass';\n        this.viewId = props.viewId || null;\n        this.placement = props.placement || 'top-left';\n        props.transitionDuration = props.transitionDuration || 200;\n        props.label = props.label || 'Compass';\n        props.style = props.style || {};\n        this.props = props;\n    }\n    setProps(props) {\n        Object.assign(this.props, props);\n    }\n    onViewportChange(viewport) {\n        this.viewports[viewport.id] = viewport;\n        this.update();\n    }\n    onAdd({ deck }) {\n        const { style, className } = this.props;\n        const element = document.createElement('div');\n        element.classList.add('deck-widget', 'deck-widget-compass');\n        if (className)\n            element.classList.add(className);\n        if (style) {\n            Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));\n        }\n        this.deck = deck;\n        this.element = element;\n        this.update();\n        return element;\n    }\n    getRotation(viewport) {\n        if (viewport instanceof WebMercatorViewport) {\n            return [-viewport.bearing, viewport.pitch];\n        }\n        else if (viewport instanceof _GlobeViewport) {\n            return [0, Math.max(-80, Math.min(80, viewport.latitude))];\n        }\n        return [0, 0];\n    }\n    update() {\n        const viewId = this.viewId || Object.values(this.viewports)[0]?.id || 'default-view';\n        const viewport = this.viewports[viewId];\n        const [rz, rx] = this.getRotation(viewport);\n        const element = this.element;\n        if (!element) {\n            return;\n        }\n        const ui = (_jsx(\"div\", { className: \"deck-widget-button\", style: { perspective: 100 }, children: _jsx(\"button\", { type: \"button\", onClick: () => {\n                    for (const viewport of Object.values(this.viewports)) {\n                        this.handleCompassReset(viewport);\n                    }\n                }, label: this.props.label, style: { transform: `rotateX(${rx}deg)` }, children: _jsx(\"svg\", { fill: \"none\", width: \"100%\", height: \"100%\", viewBox: \"0 0 26 26\", children: _jsxs(\"g\", { transform: `rotate(${rz},13,13)`, children: [_jsx(\"path\", { d: \"M10 13.0001L12.9999 5L15.9997 13.0001H10Z\", fill: \"var(--icon-compass-north-color, #F05C44)\" }), _jsx(\"path\", { d: \"M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z\", fill: \"var(--icon-compass-south-color, #C2C2CC)\" })] }) }) }) }));\n        render(ui, element);\n    }\n    onRemove() {\n        this.deck = undefined;\n        this.element = undefined;\n    }\n    handleCompassReset(viewport) {\n        const viewId = this.viewId || viewport.id || 'default-view';\n        if (viewport instanceof WebMercatorViewport) {\n            const nextViewState = {\n                ...viewport,\n                bearing: 0,\n                ...(this.getRotation(viewport)[0] === 0 ? { pitch: 0 } : {}),\n                transitionDuration: this.props.transitionDuration,\n                transitionInterpolator: new FlyToInterpolator()\n            };\n            // @ts-ignore Using private method temporary until there's a public one\n            this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });\n        }\n    }\n}\n", "import { jsx as _jsx, jsxs as _jsxs } from \"preact/jsx-runtime\";\n/* global document */\nimport { FlyToInterpolator } from '@deck.gl/core';\nimport { render } from 'preact';\nimport { ButtonGroup, GroupedIconButton } from \"./components.js\";\nexport class ZoomWidget {\n    constructor(props) {\n        this.id = 'zoom';\n        this.placement = 'top-left';\n        this.orientation = 'vertical';\n        this.viewId = null;\n        this.viewports = {};\n        this.id = props.id || 'zoom';\n        this.viewId = props.viewId || null;\n        this.placement = props.placement || 'top-left';\n        this.orientation = props.orientation || 'vertical';\n        props.transitionDuration = props.transitionDuration || 200;\n        props.zoomInLabel = props.zoomInLabel || 'Zoom In';\n        props.zoomOutLabel = props.zoomOutLabel || 'Zoom Out';\n        props.style = props.style || {};\n        this.props = props;\n    }\n    onAdd({ deck }) {\n        const { style, className } = this.props;\n        const element = document.createElement('div');\n        element.classList.add('deck-widget', 'deck-widget-zoom');\n        if (className)\n            element.classList.add(className);\n        if (style) {\n            Object.entries(style).map(([key, value]) => element.style.setProperty(key, value));\n        }\n        const ui = (_jsxs(ButtonGroup, { orientation: this.orientation, children: [_jsx(GroupedIconButton, { onClick: () => this.handleZoomIn(), label: this.props.zoomInLabel, className: \"deck-widget-zoom-in\" }), _jsx(GroupedIconButton, { onClick: () => this.handleZoomOut(), label: this.props.zoomOutLabel, className: \"deck-widget-zoom-out\" })] }));\n        render(ui, element);\n        this.deck = deck;\n        this.element = element;\n        return element;\n    }\n    onRemove() {\n        this.deck = undefined;\n        this.element = undefined;\n    }\n    setProps(props) {\n        Object.assign(this.props, props);\n    }\n    onViewportChange(viewport) {\n        this.viewports[viewport.id] = viewport;\n    }\n    handleZoom(viewport, nextZoom) {\n        const viewId = this.viewId || viewport?.id || 'default-view';\n        const nextViewState = {\n            ...viewport,\n            zoom: nextZoom,\n            transitionDuration: this.props.transitionDuration,\n            transitionInterpolator: new FlyToInterpolator()\n        };\n        // @ts-ignore Using private method temporary until there's a public one\n        this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });\n    }\n    handleZoomIn() {\n        for (const viewport of Object.values(this.viewports)) {\n            this.handleZoom(viewport, viewport.zoom + 1);\n        }\n    }\n    handleZoomOut() {\n        for (const viewport of Object.values(this.viewports)) {\n            this.handleZoom(viewport, viewport.zoom - 1);\n        }\n    }\n}\n", "export const LightTheme = {\n    '--button-background': '#fff',\n    '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n    '--button-inner-stroke': 'unset',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n    '--button-backdrop-filter': 'unset',\n    '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n    '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\nexport const DarkTheme = {\n    '--button-background': 'rgba(18, 18, 20, 1)',\n    '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n    '--button-inner-stroke': 'unset',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25)',\n    '--button-backdrop-filter': 'unset',\n    '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n    '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\nexport const LightGlassTheme = {\n    '--button-background': 'rgba(255, 255, 255, 0.6)',\n    '--button-stroke': 'rgba(255, 255, 255, 0.3)',\n    '--button-inner-stroke': '1px solid rgba(255, 255, 255, 0.6)',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n    '--button-backdrop-filter': 'blur(4px)',\n    '--button-icon-idle': 'rgba(97, 97, 102, 1)',\n    '--button-icon-hover': 'rgba(24, 24, 26, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\nexport const DarkGlassTheme = {\n    '--button-background': 'rgba(18, 18, 20, 0.75)',\n    '--button-stroke': 'rgba(18, 18, 20, 0.30)',\n    '--button-inner-stroke': '1px solid rgba(18, 18, 20, 0.75)',\n    '--button-shadow': '0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset',\n    '--button-backdrop-filter': 'blur(4px)',\n    '--button-icon-idle': 'rgba(158, 157, 168, 1)',\n    '--button-icon-hover': 'rgba(215, 214, 229, 1)',\n    '--icon-compass-north-color': '#F05C44',\n    '--icon-compass-south-color': '#C2C2CC'\n};\n"],
+  "mappings": "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",
+  "names": ["import_jsx_runtime", "_jsx", "_jsx", "deepEqual", "import_jsx_runtime", "import_core", "import_preact", "_jsx", "viewport", "_jsxs", "import_jsx_runtime", "import_core", "import_preact", "_jsxs", "_jsx"]
 }

package/dist/zoom-widget.d.ts

@@ -37,7 +37,9 @@ export declare class ZoomWidget implements Widget<ZoomWidgetProps> {
     placement: WidgetPlacement;
     orientation: 'vertical' | 'horizontal';
     viewId?: string | null;
-    viewport?: Viewport;
+    viewports: {
+        [id: string]: Viewport;
+    };
     deck?: Deck<any>;
     element?: HTMLDivElement;
     constructor(props: ZoomWidgetProps);
@@ -46,8 +48,8 @@ export declare class ZoomWidget implements Widget<ZoomWidgetProps> {
     }): HTMLDivElement;
     onRemove(): void;
     setProps(props: Partial<ZoomWidgetProps>): void;
-    onViewportChange(viewport: any): void;
-    handleZoom(nextZoom: number): void;
+    onViewportChange(viewport: Viewport): void;
+    handleZoom(viewport: Viewport, nextZoom: number): void;
     handleZoomIn(): void;
     handleZoomOut(): void;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"zoom-widget.d.ts","sourceRoot":"","sources":["../src/zoom-widget.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAI3E,UAAU,eAAe;IACvB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,qBAAa,UAAW,YAAW,MAAM,CAAC,eAAe,CAAC;IACxD,EAAE,SAAU;IACZ,KAAK,EAAE,eAAe,CAAC;IACvB,SAAS,EAAE,eAAe,CAAc;IACxC,WAAW,EAAE,UAAU,GAAG,YAAY,CAAc;IACpD,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC9B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;gBAEb,KAAK,EAAE,eAAe;IAYlC,KAAK,CAAC,EAAC,IAAI,EAAC,EAAE;QAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAA;KAAC,GAAG,cAAc;IA8BhD,QAAQ;IAKR,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC;IAIxC,gBAAgB,CAAC,QAAQ,KAAA;IAIzB,UAAU,CAAC,QAAQ,EAAE,MAAM;IAY3B,YAAY;IAMZ,aAAa;CAKd"}
+{"version":3,"file":"zoom-widget.d.ts","sourceRoot":"","sources":["../src/zoom-widget.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,EAAE,eAAe,EAAC,MAAM,eAAe,CAAC;AAI3E,UAAU,eAAe;IACvB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB;;OAEG;IACH,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IACxC;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,CAAC;IACrC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,qBAAa,UAAW,YAAW,MAAM,CAAC,eAAe,CAAC;IACxD,EAAE,SAAU;IACZ,KAAK,EAAE,eAAe,CAAC;IACvB,SAAS,EAAE,eAAe,CAAc;IACxC,WAAW,EAAE,UAAU,GAAG,YAAY,CAAc;IACpD,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC9B,SAAS,EAAE;QAAC,CAAC,EAAE,EAAE,MAAM,GAAG,QAAQ,CAAA;KAAC,CAAM;IACzC,IAAI,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;gBAEb,KAAK,EAAE,eAAe;IAYlC,KAAK,CAAC,EAAC,IAAI,EAAC,EAAE;QAAC,IAAI,EAAE,IAAI,CAAC,GAAG,CAAC,CAAA;KAAC,GAAG,cAAc;IA8BhD,QAAQ;IAKR,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,eAAe,CAAC;IAIxC,gBAAgB,CAAC,QAAQ,EAAE,QAAQ;IAInC,UAAU,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM;IAY/C,YAAY;IAMZ,aAAa;CAKd"}

package/dist/zoom-widget.js

@@ -9,6 +9,7 @@ export class ZoomWidget {
         this.placement = 'top-left';
         this.orientation = 'vertical';
         this.viewId = null;
+        this.viewports = {};
         this.id = props.id || 'zoom';
         this.viewId = props.viewId || null;
         this.placement = props.placement || 'top-left';
@@ -42,12 +43,12 @@ export class ZoomWidget {
         Object.assign(this.props, props);
     }
     onViewportChange(viewport) {
-        this.viewport = viewport;
+        this.viewports[viewport.id] = viewport;
     }
-    handleZoom(nextZoom) {
-        const viewId = this.viewId || this.viewport?.id || 'default-view';
+    handleZoom(viewport, nextZoom) {
+        const viewId = this.viewId || viewport?.id || 'default-view';
         const nextViewState = {
-            ...this.viewport,
+            ...viewport,
             zoom: nextZoom,
             transitionDuration: this.props.transitionDuration,
             transitionInterpolator: new FlyToInterpolator()
@@ -56,13 +57,13 @@ export class ZoomWidget {
         this.deck._onViewStateChange({ viewId, viewState: nextViewState, interactionState: {} });
     }
     handleZoomIn() {
-        if (this.viewport) {
-            this.handleZoom(this.viewport.zoom + 1);
+        for (const viewport of Object.values(this.viewports)) {
+            this.handleZoom(viewport, viewport.zoom + 1);
         }
     }
     handleZoomOut() {
-        if (this.viewport) {
-            this.handleZoom(this.viewport.zoom - 1);
+        for (const viewport of Object.values(this.viewports)) {
+            this.handleZoom(viewport, viewport.zoom - 1);
         }
     }
 }

package/dist.min.js

@@ -4,6 +4,6 @@
   else if (typeof define === 'function' && define.amd) define([], factory);
         else if (typeof exports === 'object') exports['deck'] = factory();
   else root['deck'] = factory();})(globalThis, function () {
-"use strict";var __exports__=(()=>{var we=Object.create;var A=Object.defineProperty;var xe=Object.getOwnPropertyDescriptor;var Ce=Object.getOwnPropertyNames;var Pe=Object.getPrototypeOf,Le=Object.prototype.hasOwnProperty;var De=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),We=(t,e)=>{for(var n in e)A(t,n,{get:e[n],enumerable:!0})},Z=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of Ce(e))!Le.call(t,o)&&o!==n&&A(t,o,{get:()=>e[o],enumerable:!(i=xe(e,o))||i.enumerable});return t},C=(t,e,n)=>(Z(t,e,"default"),n&&Z(n,e,"default")),N=(t,e,n)=>(n=t!=null?we(Pe(t)):{},Z(e||!t||!t.__esModule?A(n,"default",{value:t,enumerable:!0}):n,t)),Fe=t=>Z(A({},"__esModule",{value:!0}),t);var F=De(($e,oe)=>{oe.exports=globalThis.deck});var z={};We(z,{CompassWidget:()=>G,DarkGlassTheme:()=>je,DarkTheme:()=>Ae,FullscreenWidget:()=>B,LightGlassTheme:()=>Ve,LightTheme:()=>Ze,ZoomWidget:()=>q});var w={},ie=N(F(),1);C(w,N(F(),1));if(!ie.Layer)throw new Error("@deck.gl/core is not found");C(z,w);var ye=N(F(),1);var R,p,_e,Se,L,re,ue,J,Ee,T={},de=[],Ie=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,Q=Array.isArray;function P(t,e){for(var n in e)t[n]=e[n];return t}function pe(t){var e=t.parentNode;e&&e.removeChild(t)}function Ne(t,e,n){var i,o,s,l={};for(s in e)s=="key"?i=e[s]:s=="ref"?o=e[s]:l[s]=e[s];if(arguments.length>2&&(l.children=arguments.length>3?R.call(arguments,2):n),typeof t=="function"&&t.defaultProps!=null)for(s in t.defaultProps)l[s]===void 0&&(l[s]=t.defaultProps[s]);return j(t,l,i,o,null)}function j(t,e,n,i,o){var s={type:t,props:e,key:n,ref:i,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,constructor:void 0,__v:o??++_e,__i:-1,__u:0};return o==null&&p.vnode!=null&&p.vnode(s),s}function S(t){return t.children}function U(t,e){this.props=t,this.context=e}function D(t,e){if(e==null)return t.__?D(t.__,t.__i+1):null;for(var n;e<t.__k.length;e++)if((n=t.__k[e])!=null&&n.__e!=null)return n.__e;return typeof t.type=="function"?D(t):null}function fe(t){var e,n;if((t=t.__)!=null&&t.__c!=null){for(t.__e=t.__c.base=null,e=0;e<t.__k.length;e++)if((n=t.__k[e])!=null&&n.__e!=null){t.__e=t.__c.base=n.__e;break}return fe(t)}}function se(t){(!t.__d&&(t.__d=!0)&&L.push(t)&&!$.__r++||re!==p.debounceRendering)&&((re=p.debounceRendering)||ue)($)}function $(){var t,e,n,i,o,s,l,a,_;for(L.sort(J);t=L.shift();)t.__d&&(e=L.length,i=void 0,s=(o=(n=t).__v).__e,a=[],_=[],(l=n.__P)&&((i=P({},o)).__v=o.__v+1,p.vnode&&p.vnode(i),Y(l,i,o,n.__n,l.ownerSVGElement!==void 0,32&o.__u?[s]:null,a,s??D(o),!!(32&o.__u),_),i.__v=o.__v,i.__.__k[i.__i]=i,ge(a,i,_),i.__e!=s&&fe(i)),L.length>e&&L.sort(J));$.__r=0}function he(t,e,n,i,o,s,l,a,_,c,d){var r,g,u,m,k,v=i&&i.__k||de,f=e.length;for(n.__d=_,Te(n,e,v),_=n.__d,r=0;r<f;r++)(u=n.__k[r])!=null&&typeof u!="boolean"&&typeof u!="function"&&(g=u.__i===-1?T:v[u.__i]||T,u.__i=r,Y(t,u,g,o,s,l,a,_,c,d),m=u.__e,u.ref&&g.ref!=u.ref&&(g.ref&&ee(g.ref,null,u),d.push(u.ref,u.__c||m,u)),k==null&&m!=null&&(k=m),65536&u.__u||g.__k===u.__k?(m||g.__e!=_||(_=D(g)),_=me(u,_,t)):typeof u.type=="function"&&u.__d!==void 0?_=u.__d:m&&(_=m.nextSibling),u.__d=void 0,u.__u&=-196609);n.__d=_,n.__e=k}function Te(t,e,n){var i,o,s,l,a,_=e.length,c=n.length,d=c,r=0;for(t.__k=[],i=0;i<_;i++)l=i+r,(o=t.__k[i]=(o=e[i])==null||typeof o=="boolean"||typeof o=="function"?null:typeof o=="string"||typeof o=="number"||typeof o=="bigint"||o.constructor==String?j(null,o,null,null,null):Q(o)?j(S,{children:o},null,null,null):o.constructor===void 0&&o.__b>0?j(o.type,o.props,o.key,o.ref?o.ref:null,o.__v):o)!=null?(o.__=t,o.__b=t.__b+1,a=ze(o,n,l,d),o.__i=a,s=null,a!==-1&&(d--,(s=n[a])&&(s.__u|=131072)),s==null||s.__v===null?(a==-1&&r--,typeof o.type!="function"&&(o.__u|=65536)):a!==l&&(a===l+1?r++:a>l?d>_-l?r+=a-l:r--:a<l?a==l-1&&(r=a-l):r=0,a!==i+r&&(o.__u|=65536))):(s=n[l])&&s.key==null&&s.__e&&!(131072&s.__u)&&(s.__e==t.__d&&(t.__d=D(s)),K(s,s,!1),n[l]=null,d--);if(d)for(i=0;i<c;i++)(s=n[i])!=null&&!(131072&s.__u)&&(s.__e==t.__d&&(t.__d=D(s)),K(s,s))}function me(t,e,n){var i,o;if(typeof t.type=="function"){for(i=t.__k,o=0;i&&o<i.length;o++)i[o]&&(i[o].__=t,e=me(i[o],e,n));return e}t.__e!=e&&(n.insertBefore(t.__e,e||null),e=t.__e);do e=e&&e.nextSibling;while(e!=null&&e.nodeType===8);return e}function ze(t,e,n,i){var o=t.key,s=t.type,l=n-1,a=n+1,_=e[n];if(_===null||_&&o==_.key&&s===_.type&&!(131072&_.__u))return n;if(i>(_!=null&&!(131072&_.__u)?1:0))for(;l>=0||a<e.length;){if(l>=0){if((_=e[l])&&!(131072&_.__u)&&o==_.key&&s===_.type)return l;l--}if(a<e.length){if((_=e[a])&&!(131072&_.__u)&&o==_.key&&s===_.type)return a;a++}}return-1}function le(t,e,n){e[0]==="-"?t.setProperty(e,n??""):t[e]=n==null?"":typeof n!="number"||Ie.test(e)?n:n+"px"}function V(t,e,n,i,o){var s;e:if(e==="style")if(typeof n=="string")t.style.cssText=n;else{if(typeof i=="string"&&(t.style.cssText=i=""),i)for(e in i)n&&e in n||le(t.style,e,"");if(n)for(e in n)i&&n[e]===i[e]||le(t.style,e,n[e])}else if(e[0]==="o"&&e[1]==="n")s=e!==(e=e.replace(/(PointerCapture)$|Capture$/i,"$1")),e=e.toLowerCase()in t?e.toLowerCase().slice(2):e.slice(2),t.l||(t.l={}),t.l[e+s]=n,n?i?n.u=i.u:(n.u=Date.now(),t.addEventListener(e,s?ce:ae,s)):t.removeEventListener(e,s?ce:ae,s);else{if(o)e=e.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if(e!=="width"&&e!=="height"&&e!=="href"&&e!=="list"&&e!=="form"&&e!=="tabIndex"&&e!=="download"&&e!=="rowSpan"&&e!=="colSpan"&&e!=="role"&&e in t)try{t[e]=n??"";break e}catch{}typeof n=="function"||(n==null||n===!1&&e[4]!=="-"?t.removeAttribute(e):t.setAttribute(e,n))}}function ae(t){if(this.l){var e=this.l[t.type+!1];if(t.t){if(t.t<=e.u)return}else t.t=Date.now();return e(p.event?p.event(t):t)}}function ce(t){if(this.l)return this.l[t.type+!0](p.event?p.event(t):t)}function Y(t,e,n,i,o,s,l,a,_,c){var d,r,g,u,m,k,v,f,b,x,M,I,ne,O,X,y=e.type;if(e.constructor!==void 0)return null;128&n.__u&&(_=!!(32&n.__u),s=[a=e.__e=n.__e]),(d=p.__b)&&d(e);e:if(typeof y=="function")try{if(f=e.props,b=(d=y.contextType)&&i[d.__c],x=d?b?b.props.value:d.__:i,n.__c?v=(r=e.__c=n.__c).__=r.__E:("prototype"in y&&y.prototype.render?e.__c=r=new y(f,x):(e.__c=r=new U(f,x),r.constructor=y,r.render=Oe),b&&b.sub(r),r.props=f,r.state||(r.state={}),r.context=x,r.__n=i,g=r.__d=!0,r.__h=[],r._sb=[]),r.__s==null&&(r.__s=r.state),y.getDerivedStateFromProps!=null&&(r.__s==r.state&&(r.__s=P({},r.__s)),P(r.__s,y.getDerivedStateFromProps(f,r.__s))),u=r.props,m=r.state,r.__v=e,g)y.getDerivedStateFromProps==null&&r.componentWillMount!=null&&r.componentWillMount(),r.componentDidMount!=null&&r.__h.push(r.componentDidMount);else{if(y.getDerivedStateFromProps==null&&f!==u&&r.componentWillReceiveProps!=null&&r.componentWillReceiveProps(f,x),!r.__e&&(r.shouldComponentUpdate!=null&&r.shouldComponentUpdate(f,r.__s,x)===!1||e.__v===n.__v)){for(e.__v!==n.__v&&(r.props=f,r.state=r.__s,r.__d=!1),e.__e=n.__e,e.__k=n.__k,e.__k.forEach(function(H){H&&(H.__=e)}),M=0;M<r._sb.length;M++)r.__h.push(r._sb[M]);r._sb=[],r.__h.length&&l.push(r);break e}r.componentWillUpdate!=null&&r.componentWillUpdate(f,r.__s,x),r.componentDidUpdate!=null&&r.__h.push(function(){r.componentDidUpdate(u,m,k)})}if(r.context=x,r.props=f,r.__P=t,r.__e=!1,I=p.__r,ne=0,"prototype"in y&&y.prototype.render){for(r.state=r.__s,r.__d=!1,I&&I(e),d=r.render(r.props,r.state,r.context),O=0;O<r._sb.length;O++)r.__h.push(r._sb[O]);r._sb=[]}else do r.__d=!1,I&&I(e),d=r.render(r.props,r.state,r.context),r.state=r.__s;while(r.__d&&++ne<25);r.state=r.__s,r.getChildContext!=null&&(i=P(P({},i),r.getChildContext())),g||r.getSnapshotBeforeUpdate==null||(k=r.getSnapshotBeforeUpdate(u,m)),he(t,Q(X=d!=null&&d.type===S&&d.key==null?d.props.children:d)?X:[X],e,n,i,o,s,l,a,_,c),r.base=e.__e,e.__u&=-161,r.__h.length&&l.push(r),v&&(r.__E=r.__=null)}catch(H){e.__v=null,_||s!=null?(e.__e=a,e.__u|=_?160:32,s[s.indexOf(a)]=null):(e.__e=n.__e,e.__k=n.__k),p.__e(H,e,n)}else s==null&&e.__v===n.__v?(e.__k=n.__k,e.__e=n.__e):e.__e=Me(n.__e,e,n,i,o,s,l,_,c);(d=p.diffed)&&d(e)}function ge(t,e,n){e.__d=void 0;for(var i=0;i<n.length;i++)ee(n[i],n[++i],n[++i]);p.__c&&p.__c(e,t),t.some(function(o){try{t=o.__h,o.__h=[],t.some(function(s){s.call(o)})}catch(s){p.__e(s,o.__v)}})}function Me(t,e,n,i,o,s,l,a,_){var c,d,r,g,u,m,k,v=n.props,f=e.props,b=e.type;if(b==="svg"&&(o=!0),s!=null){for(c=0;c<s.length;c++)if((u=s[c])&&"setAttribute"in u==!!b&&(b?u.localName===b:u.nodeType===3)){t=u,s[c]=null;break}}if(t==null){if(b===null)return document.createTextNode(f);t=o?document.createElementNS("http://www.w3.org/2000/svg",b):document.createElement(b,f.is&&f),s=null,a=!1}if(b===null)v===f||a&&t.data===f||(t.data=f);else{if(s=s&&R.call(t.childNodes),v=n.props||T,!a&&s!=null)for(v={},c=0;c<t.attributes.length;c++)v[(u=t.attributes[c]).name]=u.value;for(c in v)u=v[c],c=="children"||(c=="dangerouslySetInnerHTML"?r=u:c==="key"||c in f||V(t,c,null,u,o));for(c in f)u=f[c],c=="children"?g=u:c=="dangerouslySetInnerHTML"?d=u:c=="value"?m=u:c=="checked"?k=u:c==="key"||a&&typeof u!="function"||v[c]===u||V(t,c,u,v[c],o);if(d)a||r&&(d.__html===r.__html||d.__html===t.innerHTML)||(t.innerHTML=d.__html),e.__k=[];else if(r&&(t.innerHTML=""),he(t,Q(g)?g:[g],e,n,i,o&&b!=="foreignObject",s,l,s?s[0]:n.__k&&D(n,0),a,_),s!=null)for(c=s.length;c--;)s[c]!=null&&pe(s[c]);a||(c="value",m!==void 0&&(m!==t[c]||b==="progress"&&!m||b==="option"&&m!==v[c])&&V(t,c,m,v[c],!1),c="checked",k!==void 0&&k!==t[c]&&V(t,c,k,v[c],!1))}return t}function ee(t,e,n){try{typeof t=="function"?t(e):t.current=e}catch(i){p.__e(i,n)}}function K(t,e,n){var i,o;if(p.unmount&&p.unmount(t),(i=t.ref)&&(i.current&&i.current!==t.__e||ee(i,null,e)),(i=t.__c)!=null){if(i.componentWillUnmount)try{i.componentWillUnmount()}catch(s){p.__e(s,e)}i.base=i.__P=null,t.__c=void 0}if(i=t.__k)for(o=0;o<i.length;o++)i[o]&&K(i[o],e,n||typeof t.type!="function");n||t.__e==null||pe(t.__e),t.__=t.__e=t.__d=void 0}function Oe(t,e,n){return this.constructor(t,n)}function E(t,e,n){var i,o,s,l;p.__&&p.__(t,e),o=(i=typeof n=="function")?null:n&&n.__k||e.__k,s=[],l=[],Y(e,t=(!i&&n||e).__k=Ne(S,null,[t]),o||T,T,e.ownerSVGElement!==void 0,!i&&n?[n]:o?null:e.firstChild?R.call(e.childNodes):null,s,!i&&n?n:o?o.__e:e.firstChild,i,l),ge(s,t,l)}R=de.slice,p={__e:function(t,e,n,i){for(var o,s,l;e=e.__;)if((o=e.__c)&&!o.__)try{if((s=o.constructor)&&s.getDerivedStateFromError!=null&&(o.setState(s.getDerivedStateFromError(t)),l=o.__d),o.componentDidCatch!=null&&(o.componentDidCatch(t,i||{}),l=o.__d),l)return o.__E=o}catch(a){t=a}throw t}},_e=0,Se=function(t){return t!=null&&t.constructor==null},U.prototype.setState=function(t,e){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=P({},this.state),typeof t=="function"&&(t=t(P({},n),this.props)),t&&P(n,t),t!=null&&this.__v&&(e&&this._sb.push(e),se(this))},U.prototype.forceUpdate=function(t){this.__v&&(this.__e=!0,t&&this.__h.push(t),se(this))},U.prototype.render=S,L=[],ue=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,J=function(t,e){return t.__v.__b-e.__v.__b},$.__r=0,Ee=0;var He=0,qe=Array.isArray;function h(t,e,n,i,o,s){var l,a,_={};for(a in e)a=="ref"?l=e[a]:_[a]=e[a];var c={type:t,props:_,key:n,ref:l,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,constructor:void 0,__v:--He,__i:-1,__u:0,__source:o,__self:s};if(typeof t=="function"&&(l=t.defaultProps))for(a in l)_[a]===void 0&&(_[a]=l[a]);return p.vnode&&p.vnode(c),c}var ve=t=>{let{className:e,label:n,onClick:i}=t;return h("div",{className:"deck-widget-button",children:h("button",{className:`deck-widget-icon-button ${e}`,type:"button",onClick:i,title:n,children:h("div",{className:"deck-widget-icon"})})})},be=t=>{let{children:e,orientation:n}=t;return h("div",{className:`deck-widget-button-group ${n}`,children:e})},te=t=>{let{className:e,label:n,onClick:i}=t;return h("button",{className:`deck-widget-icon-button ${e}`,type:"button",onClick:i,title:n,children:h("div",{className:"deck-widget-icon"})})};var B=class{constructor(e){this.id="fullscreen";this.placement="top-left";this.fullscreen=!1;this.id=e.id||"fullscreen",this.placement=e.placement||"top-left",e.enterLabel=e.enterLabel||"Enter Fullscreen",e.exitLabel=e.exitLabel||"Exit Fullscreen",e.style=e.style||{},this.props=e}onAdd({deck:e}){let{style:n,className:i}=this.props,o=document.createElement("div");return o.classList.add("deck-widget","deck-widget-fullscreen"),i&&o.classList.add(i),n&&Object.entries(n).map(([s,l])=>o.style.setProperty(s,l)),this.deck=e,this.element=o,this.update(),document.addEventListener("fullscreenchange",this.onFullscreenChange.bind(this)),o}onRemove(){this.deck=void 0,this.element=void 0,document.removeEventListener("fullscreenchange",this.onFullscreenChange.bind(this))}update(){let{enterLabel:e,exitLabel:n}=this.props,i=this.element;if(!i)return;let o=h(ve,{onClick:this.handleClick.bind(this),label:this.fullscreen?n:e,className:this.fullscreen?"deck-widget-fullscreen-exit":"deck-widget-fullscreen-enter"});E(o,i)}setProps(e){let n=this.props,i=this.element;i&&(n.className!==e.className&&(n.className&&i.classList.remove(n.className),e.className&&i.classList.add(e.className)),(0,ye._deepEqual)(n.style,e.style,1)||(n.style&&Object.entries(n.style).map(([o])=>i.style.removeProperty(o)),e.style&&Object.entries(e.style).map(([o,s])=>i.style.setProperty(o,s)))),Object.assign(this.props,e)}getContainer(){return this.props.container||this.deck?.getCanvas()?.parentElement}onFullscreenChange(){let e=this.fullscreen,n=document.fullscreenElement===this.getContainer();e!==n&&(this.fullscreen=!this.fullscreen),this.update()}async handleClick(){this.fullscreen?await this.exitFullscreen():await this.requestFullscreen(),this.update()}async requestFullscreen(){let e=this.getContainer();e?.requestFullscreen?await e.requestFullscreen({navigationUI:"hide"}):this.togglePseudoFullscreen()}async exitFullscreen(){document.exitFullscreen?await document.exitFullscreen():this.togglePseudoFullscreen()}togglePseudoFullscreen(){this.getContainer()?.classList.toggle("deck-pseudo-fullscreen")}};var W=N(F(),1);var G=class{constructor(e){this.id="compass";this.placement="top-left";this.viewId=null;this.id=e.id||"compass",this.viewId=e.viewId||null,this.placement=e.placement||"top-left",e.transitionDuration=e.transitionDuration||200,e.label=e.label||"Compass",e.style=e.style||{},this.props=e}setProps(e){Object.assign(this.props,e)}onViewportChange(e){this.viewport=e,this.update()}onAdd({deck:e}){let{style:n,className:i}=this.props,o=document.createElement("div");return o.classList.add("deck-widget","deck-widget-compass"),i&&o.classList.add(i),n&&Object.entries(n).map(([s,l])=>o.style.setProperty(s,l)),this.deck=e,this.element=o,this.update(),o}getRotation(){return this.viewport instanceof W.WebMercatorViewport?[-this.viewport.bearing,this.viewport.pitch]:this.viewport instanceof W._GlobeViewport?[0,Math.max(-80,Math.min(80,this.viewport.latitude))]:[0,0]}update(){let[e,n]=this.getRotation(),i=this.element;if(!i)return;let o=h("div",{className:"deck-widget-button",style:{perspective:100},children:h("button",{type:"button",onClick:()=>this.handleCompassReset(),label:this.props.label,style:{transform:`rotateX(${n}deg)`},children:h("svg",{fill:"none",width:"100%",height:"100%",viewBox:"0 0 26 26",children:h("g",{transform:`rotate(${e},13,13)`,children:[h("path",{d:"M10 13.0001L12.9999 5L15.9997 13.0001H10Z",fill:"var(--icon-compass-north-color, #F05C44)"}),h("path",{d:"M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z",fill:"var(--icon-compass-south-color, #C2C2CC)"})]})})})});E(o,i)}onRemove(){this.deck=void 0,this.element=void 0}handleCompassReset(){let e=this.viewId||this.viewport?.id||"default-view";if(this.viewport instanceof W.WebMercatorViewport){let n={...this.viewport,bearing:0,...this.getRotation()[0]===0?{pitch:0}:{},transitionDuration:this.props.transitionDuration,transitionInterpolator:new W.FlyToInterpolator};this.deck._onViewStateChange({viewId:e,viewState:n,interactionState:{}})}}};var ke=N(F(),1);var q=class{constructor(e){this.id="zoom";this.placement="top-left";this.orientation="vertical";this.viewId=null;this.id=e.id||"zoom",this.viewId=e.viewId||null,this.placement=e.placement||"top-left",this.orientation=e.orientation||"vertical",e.transitionDuration=e.transitionDuration||200,e.zoomInLabel=e.zoomInLabel||"Zoom In",e.zoomOutLabel=e.zoomOutLabel||"Zoom Out",e.style=e.style||{},this.props=e}onAdd({deck:e}){let{style:n,className:i}=this.props,o=document.createElement("div");o.classList.add("deck-widget","deck-widget-zoom"),i&&o.classList.add(i),n&&Object.entries(n).map(([l,a])=>o.style.setProperty(l,a));let s=h(be,{orientation:this.orientation,children:[h(te,{onClick:()=>this.handleZoomIn(),label:this.props.zoomInLabel,className:"deck-widget-zoom-in"}),h(te,{onClick:()=>this.handleZoomOut(),label:this.props.zoomOutLabel,className:"deck-widget-zoom-out"})]});return E(s,o),this.deck=e,this.element=o,o}onRemove(){this.deck=void 0,this.element=void 0}setProps(e){Object.assign(this.props,e)}onViewportChange(e){this.viewport=e}handleZoom(e){let n=this.viewId||this.viewport?.id||"default-view",i={...this.viewport,zoom:e,transitionDuration:this.props.transitionDuration,transitionInterpolator:new ke.FlyToInterpolator};this.deck._onViewStateChange({viewId:n,viewState:i,interactionState:{}})}handleZoomIn(){this.viewport&&this.handleZoom(this.viewport.zoom+1)}handleZoomOut(){this.viewport&&this.handleZoom(this.viewport.zoom-1)}};var Ze={"--button-background":"#fff","--button-stroke":"rgba(255, 255, 255, 0.3)","--button-inner-stroke":"unset","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25)","--button-backdrop-filter":"unset","--button-icon-idle":"rgba(97, 97, 102, 1)","--button-icon-hover":"rgba(24, 24, 26, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"},Ae={"--button-background":"rgba(18, 18, 20, 1)","--button-stroke":"rgba(18, 18, 20, 0.30)","--button-inner-stroke":"unset","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25)","--button-backdrop-filter":"unset","--button-icon-idle":"rgba(158, 157, 168, 1)","--button-icon-hover":"rgba(215, 214, 229, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"},Ve={"--button-background":"rgba(255, 255, 255, 0.6)","--button-stroke":"rgba(255, 255, 255, 0.3)","--button-inner-stroke":"1px solid rgba(255, 255, 255, 0.6)","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset","--button-backdrop-filter":"blur(4px)","--button-icon-idle":"rgba(97, 97, 102, 1)","--button-icon-hover":"rgba(24, 24, 26, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"},je={"--button-background":"rgba(18, 18, 20, 0.75)","--button-stroke":"rgba(18, 18, 20, 0.30)","--button-inner-stroke":"1px solid rgba(18, 18, 20, 0.75)","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset","--button-backdrop-filter":"blur(4px)","--button-icon-idle":"rgba(158, 157, 168, 1)","--button-icon-hover":"rgba(215, 214, 229, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"};return Fe(z);})();
+"use strict";var __exports__=(()=>{var we=Object.create;var H=Object.defineProperty;var xe=Object.getOwnPropertyDescriptor;var Ce=Object.getOwnPropertyNames;var Pe=Object.getPrototypeOf,Le=Object.prototype.hasOwnProperty;var De=(t,e)=>()=>(e||t((e={exports:{}}).exports,e),e.exports),We=(t,e)=>{for(var n in e)H(t,n,{get:e[n],enumerable:!0})},j=(t,e,n,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let o of Ce(e))!Le.call(t,o)&&o!==n&&H(t,o,{get:()=>e[o],enumerable:!(i=xe(e,o))||i.enumerable});return t},C=(t,e,n)=>(j(t,e,"default"),n&&j(n,e,"default")),N=(t,e,n)=>(n=t!=null?we(Pe(t)):{},j(e||!t||!t.__esModule?H(n,"default",{value:t,enumerable:!0}):n,t)),Fe=t=>j(H({},"__esModule",{value:!0}),t);var F=De(($e,oe)=>{oe.exports=globalThis.deck});var O={};We(O,{CompassWidget:()=>G,DarkGlassTheme:()=>Ae,DarkTheme:()=>He,FullscreenWidget:()=>B,LightGlassTheme:()=>Ze,LightTheme:()=>je,ZoomWidget:()=>q});var w={},ie=N(F(),1);C(w,N(F(),1));if(!ie.Layer)throw new Error("@deck.gl/core is not found");C(O,w);var ye=N(F(),1);var R,p,_e,Se,L,re,ue,J,Ee,T={},de=[],Ie=/acit|ex(?:s|g|n|p|$)|rph|grid|ows|mnc|ntw|ine[ch]|zoo|^ord|itera/i,Q=Array.isArray;function P(t,e){for(var n in e)t[n]=e[n];return t}function pe(t){var e=t.parentNode;e&&e.removeChild(t)}function Ne(t,e,n){var i,o,s,l={};for(s in e)s=="key"?i=e[s]:s=="ref"?o=e[s]:l[s]=e[s];if(arguments.length>2&&(l.children=arguments.length>3?R.call(arguments,2):n),typeof t=="function"&&t.defaultProps!=null)for(s in t.defaultProps)l[s]===void 0&&(l[s]=t.defaultProps[s]);return A(t,l,i,o,null)}function A(t,e,n,i,o){var s={type:t,props:e,key:n,ref:i,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,constructor:void 0,__v:o??++_e,__i:-1,__u:0};return o==null&&p.vnode!=null&&p.vnode(s),s}function S(t){return t.children}function U(t,e){this.props=t,this.context=e}function D(t,e){if(e==null)return t.__?D(t.__,t.__i+1):null;for(var n;e<t.__k.length;e++)if((n=t.__k[e])!=null&&n.__e!=null)return n.__e;return typeof t.type=="function"?D(t):null}function fe(t){var e,n;if((t=t.__)!=null&&t.__c!=null){for(t.__e=t.__c.base=null,e=0;e<t.__k.length;e++)if((n=t.__k[e])!=null&&n.__e!=null){t.__e=t.__c.base=n.__e;break}return fe(t)}}function se(t){(!t.__d&&(t.__d=!0)&&L.push(t)&&!$.__r++||re!==p.debounceRendering)&&((re=p.debounceRendering)||ue)($)}function $(){var t,e,n,i,o,s,l,a,_;for(L.sort(J);t=L.shift();)t.__d&&(e=L.length,i=void 0,s=(o=(n=t).__v).__e,a=[],_=[],(l=n.__P)&&((i=P({},o)).__v=o.__v+1,p.vnode&&p.vnode(i),Y(l,i,o,n.__n,l.ownerSVGElement!==void 0,32&o.__u?[s]:null,a,s??D(o),!!(32&o.__u),_),i.__v=o.__v,i.__.__k[i.__i]=i,ge(a,i,_),i.__e!=s&&fe(i)),L.length>e&&L.sort(J));$.__r=0}function he(t,e,n,i,o,s,l,a,_,c,d){var r,g,u,m,k,v=i&&i.__k||de,f=e.length;for(n.__d=_,Te(n,e,v),_=n.__d,r=0;r<f;r++)(u=n.__k[r])!=null&&typeof u!="boolean"&&typeof u!="function"&&(g=u.__i===-1?T:v[u.__i]||T,u.__i=r,Y(t,u,g,o,s,l,a,_,c,d),m=u.__e,u.ref&&g.ref!=u.ref&&(g.ref&&ee(g.ref,null,u),d.push(u.ref,u.__c||m,u)),k==null&&m!=null&&(k=m),65536&u.__u||g.__k===u.__k?(m||g.__e!=_||(_=D(g)),_=me(u,_,t)):typeof u.type=="function"&&u.__d!==void 0?_=u.__d:m&&(_=m.nextSibling),u.__d=void 0,u.__u&=-196609);n.__d=_,n.__e=k}function Te(t,e,n){var i,o,s,l,a,_=e.length,c=n.length,d=c,r=0;for(t.__k=[],i=0;i<_;i++)l=i+r,(o=t.__k[i]=(o=e[i])==null||typeof o=="boolean"||typeof o=="function"?null:typeof o=="string"||typeof o=="number"||typeof o=="bigint"||o.constructor==String?A(null,o,null,null,null):Q(o)?A(S,{children:o},null,null,null):o.constructor===void 0&&o.__b>0?A(o.type,o.props,o.key,o.ref?o.ref:null,o.__v):o)!=null?(o.__=t,o.__b=t.__b+1,a=Oe(o,n,l,d),o.__i=a,s=null,a!==-1&&(d--,(s=n[a])&&(s.__u|=131072)),s==null||s.__v===null?(a==-1&&r--,typeof o.type!="function"&&(o.__u|=65536)):a!==l&&(a===l+1?r++:a>l?d>_-l?r+=a-l:r--:a<l?a==l-1&&(r=a-l):r=0,a!==i+r&&(o.__u|=65536))):(s=n[l])&&s.key==null&&s.__e&&!(131072&s.__u)&&(s.__e==t.__d&&(t.__d=D(s)),K(s,s,!1),n[l]=null,d--);if(d)for(i=0;i<c;i++)(s=n[i])!=null&&!(131072&s.__u)&&(s.__e==t.__d&&(t.__d=D(s)),K(s,s))}function me(t,e,n){var i,o;if(typeof t.type=="function"){for(i=t.__k,o=0;i&&o<i.length;o++)i[o]&&(i[o].__=t,e=me(i[o],e,n));return e}t.__e!=e&&(n.insertBefore(t.__e,e||null),e=t.__e);do e=e&&e.nextSibling;while(e!=null&&e.nodeType===8);return e}function Oe(t,e,n,i){var o=t.key,s=t.type,l=n-1,a=n+1,_=e[n];if(_===null||_&&o==_.key&&s===_.type&&!(131072&_.__u))return n;if(i>(_!=null&&!(131072&_.__u)?1:0))for(;l>=0||a<e.length;){if(l>=0){if((_=e[l])&&!(131072&_.__u)&&o==_.key&&s===_.type)return l;l--}if(a<e.length){if((_=e[a])&&!(131072&_.__u)&&o==_.key&&s===_.type)return a;a++}}return-1}function le(t,e,n){e[0]==="-"?t.setProperty(e,n??""):t[e]=n==null?"":typeof n!="number"||Ie.test(e)?n:n+"px"}function Z(t,e,n,i,o){var s;e:if(e==="style")if(typeof n=="string")t.style.cssText=n;else{if(typeof i=="string"&&(t.style.cssText=i=""),i)for(e in i)n&&e in n||le(t.style,e,"");if(n)for(e in n)i&&n[e]===i[e]||le(t.style,e,n[e])}else if(e[0]==="o"&&e[1]==="n")s=e!==(e=e.replace(/(PointerCapture)$|Capture$/i,"$1")),e=e.toLowerCase()in t?e.toLowerCase().slice(2):e.slice(2),t.l||(t.l={}),t.l[e+s]=n,n?i?n.u=i.u:(n.u=Date.now(),t.addEventListener(e,s?ce:ae,s)):t.removeEventListener(e,s?ce:ae,s);else{if(o)e=e.replace(/xlink(H|:h)/,"h").replace(/sName$/,"s");else if(e!=="width"&&e!=="height"&&e!=="href"&&e!=="list"&&e!=="form"&&e!=="tabIndex"&&e!=="download"&&e!=="rowSpan"&&e!=="colSpan"&&e!=="role"&&e in t)try{t[e]=n??"";break e}catch{}typeof n=="function"||(n==null||n===!1&&e[4]!=="-"?t.removeAttribute(e):t.setAttribute(e,n))}}function ae(t){if(this.l){var e=this.l[t.type+!1];if(t.t){if(t.t<=e.u)return}else t.t=Date.now();return e(p.event?p.event(t):t)}}function ce(t){if(this.l)return this.l[t.type+!0](p.event?p.event(t):t)}function Y(t,e,n,i,o,s,l,a,_,c){var d,r,g,u,m,k,v,f,b,x,z,I,ne,M,X,y=e.type;if(e.constructor!==void 0)return null;128&n.__u&&(_=!!(32&n.__u),s=[a=e.__e=n.__e]),(d=p.__b)&&d(e);e:if(typeof y=="function")try{if(f=e.props,b=(d=y.contextType)&&i[d.__c],x=d?b?b.props.value:d.__:i,n.__c?v=(r=e.__c=n.__c).__=r.__E:("prototype"in y&&y.prototype.render?e.__c=r=new y(f,x):(e.__c=r=new U(f,x),r.constructor=y,r.render=Me),b&&b.sub(r),r.props=f,r.state||(r.state={}),r.context=x,r.__n=i,g=r.__d=!0,r.__h=[],r._sb=[]),r.__s==null&&(r.__s=r.state),y.getDerivedStateFromProps!=null&&(r.__s==r.state&&(r.__s=P({},r.__s)),P(r.__s,y.getDerivedStateFromProps(f,r.__s))),u=r.props,m=r.state,r.__v=e,g)y.getDerivedStateFromProps==null&&r.componentWillMount!=null&&r.componentWillMount(),r.componentDidMount!=null&&r.__h.push(r.componentDidMount);else{if(y.getDerivedStateFromProps==null&&f!==u&&r.componentWillReceiveProps!=null&&r.componentWillReceiveProps(f,x),!r.__e&&(r.shouldComponentUpdate!=null&&r.shouldComponentUpdate(f,r.__s,x)===!1||e.__v===n.__v)){for(e.__v!==n.__v&&(r.props=f,r.state=r.__s,r.__d=!1),e.__e=n.__e,e.__k=n.__k,e.__k.forEach(function(V){V&&(V.__=e)}),z=0;z<r._sb.length;z++)r.__h.push(r._sb[z]);r._sb=[],r.__h.length&&l.push(r);break e}r.componentWillUpdate!=null&&r.componentWillUpdate(f,r.__s,x),r.componentDidUpdate!=null&&r.__h.push(function(){r.componentDidUpdate(u,m,k)})}if(r.context=x,r.props=f,r.__P=t,r.__e=!1,I=p.__r,ne=0,"prototype"in y&&y.prototype.render){for(r.state=r.__s,r.__d=!1,I&&I(e),d=r.render(r.props,r.state,r.context),M=0;M<r._sb.length;M++)r.__h.push(r._sb[M]);r._sb=[]}else do r.__d=!1,I&&I(e),d=r.render(r.props,r.state,r.context),r.state=r.__s;while(r.__d&&++ne<25);r.state=r.__s,r.getChildContext!=null&&(i=P(P({},i),r.getChildContext())),g||r.getSnapshotBeforeUpdate==null||(k=r.getSnapshotBeforeUpdate(u,m)),he(t,Q(X=d!=null&&d.type===S&&d.key==null?d.props.children:d)?X:[X],e,n,i,o,s,l,a,_,c),r.base=e.__e,e.__u&=-161,r.__h.length&&l.push(r),v&&(r.__E=r.__=null)}catch(V){e.__v=null,_||s!=null?(e.__e=a,e.__u|=_?160:32,s[s.indexOf(a)]=null):(e.__e=n.__e,e.__k=n.__k),p.__e(V,e,n)}else s==null&&e.__v===n.__v?(e.__k=n.__k,e.__e=n.__e):e.__e=ze(n.__e,e,n,i,o,s,l,_,c);(d=p.diffed)&&d(e)}function ge(t,e,n){e.__d=void 0;for(var i=0;i<n.length;i++)ee(n[i],n[++i],n[++i]);p.__c&&p.__c(e,t),t.some(function(o){try{t=o.__h,o.__h=[],t.some(function(s){s.call(o)})}catch(s){p.__e(s,o.__v)}})}function ze(t,e,n,i,o,s,l,a,_){var c,d,r,g,u,m,k,v=n.props,f=e.props,b=e.type;if(b==="svg"&&(o=!0),s!=null){for(c=0;c<s.length;c++)if((u=s[c])&&"setAttribute"in u==!!b&&(b?u.localName===b:u.nodeType===3)){t=u,s[c]=null;break}}if(t==null){if(b===null)return document.createTextNode(f);t=o?document.createElementNS("http://www.w3.org/2000/svg",b):document.createElement(b,f.is&&f),s=null,a=!1}if(b===null)v===f||a&&t.data===f||(t.data=f);else{if(s=s&&R.call(t.childNodes),v=n.props||T,!a&&s!=null)for(v={},c=0;c<t.attributes.length;c++)v[(u=t.attributes[c]).name]=u.value;for(c in v)u=v[c],c=="children"||(c=="dangerouslySetInnerHTML"?r=u:c==="key"||c in f||Z(t,c,null,u,o));for(c in f)u=f[c],c=="children"?g=u:c=="dangerouslySetInnerHTML"?d=u:c=="value"?m=u:c=="checked"?k=u:c==="key"||a&&typeof u!="function"||v[c]===u||Z(t,c,u,v[c],o);if(d)a||r&&(d.__html===r.__html||d.__html===t.innerHTML)||(t.innerHTML=d.__html),e.__k=[];else if(r&&(t.innerHTML=""),he(t,Q(g)?g:[g],e,n,i,o&&b!=="foreignObject",s,l,s?s[0]:n.__k&&D(n,0),a,_),s!=null)for(c=s.length;c--;)s[c]!=null&&pe(s[c]);a||(c="value",m!==void 0&&(m!==t[c]||b==="progress"&&!m||b==="option"&&m!==v[c])&&Z(t,c,m,v[c],!1),c="checked",k!==void 0&&k!==t[c]&&Z(t,c,k,v[c],!1))}return t}function ee(t,e,n){try{typeof t=="function"?t(e):t.current=e}catch(i){p.__e(i,n)}}function K(t,e,n){var i,o;if(p.unmount&&p.unmount(t),(i=t.ref)&&(i.current&&i.current!==t.__e||ee(i,null,e)),(i=t.__c)!=null){if(i.componentWillUnmount)try{i.componentWillUnmount()}catch(s){p.__e(s,e)}i.base=i.__P=null,t.__c=void 0}if(i=t.__k)for(o=0;o<i.length;o++)i[o]&&K(i[o],e,n||typeof t.type!="function");n||t.__e==null||pe(t.__e),t.__=t.__e=t.__d=void 0}function Me(t,e,n){return this.constructor(t,n)}function E(t,e,n){var i,o,s,l;p.__&&p.__(t,e),o=(i=typeof n=="function")?null:n&&n.__k||e.__k,s=[],l=[],Y(e,t=(!i&&n||e).__k=Ne(S,null,[t]),o||T,T,e.ownerSVGElement!==void 0,!i&&n?[n]:o?null:e.firstChild?R.call(e.childNodes):null,s,!i&&n?n:o?o.__e:e.firstChild,i,l),ge(s,t,l)}R=de.slice,p={__e:function(t,e,n,i){for(var o,s,l;e=e.__;)if((o=e.__c)&&!o.__)try{if((s=o.constructor)&&s.getDerivedStateFromError!=null&&(o.setState(s.getDerivedStateFromError(t)),l=o.__d),o.componentDidCatch!=null&&(o.componentDidCatch(t,i||{}),l=o.__d),l)return o.__E=o}catch(a){t=a}throw t}},_e=0,Se=function(t){return t!=null&&t.constructor==null},U.prototype.setState=function(t,e){var n;n=this.__s!=null&&this.__s!==this.state?this.__s:this.__s=P({},this.state),typeof t=="function"&&(t=t(P({},n),this.props)),t&&P(n,t),t!=null&&this.__v&&(e&&this._sb.push(e),se(this))},U.prototype.forceUpdate=function(t){this.__v&&(this.__e=!0,t&&this.__h.push(t),se(this))},U.prototype.render=S,L=[],ue=typeof Promise=="function"?Promise.prototype.then.bind(Promise.resolve()):setTimeout,J=function(t,e){return t.__v.__b-e.__v.__b},$.__r=0,Ee=0;var Ve=0,qe=Array.isArray;function h(t,e,n,i,o,s){var l,a,_={};for(a in e)a=="ref"?l=e[a]:_[a]=e[a];var c={type:t,props:_,key:n,ref:l,__k:null,__:null,__b:0,__e:null,__d:void 0,__c:null,constructor:void 0,__v:--Ve,__i:-1,__u:0,__source:o,__self:s};if(typeof t=="function"&&(l=t.defaultProps))for(a in l)_[a]===void 0&&(_[a]=l[a]);return p.vnode&&p.vnode(c),c}var ve=t=>{let{className:e,label:n,onClick:i}=t;return h("div",{className:"deck-widget-button",children:h("button",{className:`deck-widget-icon-button ${e}`,type:"button",onClick:i,title:n,children:h("div",{className:"deck-widget-icon"})})})},be=t=>{let{children:e,orientation:n}=t;return h("div",{className:`deck-widget-button-group ${n}`,children:e})},te=t=>{let{className:e,label:n,onClick:i}=t;return h("button",{className:`deck-widget-icon-button ${e}`,type:"button",onClick:i,title:n,children:h("div",{className:"deck-widget-icon"})})};var B=class{constructor(e){this.id="fullscreen";this.placement="top-left";this.fullscreen=!1;this.id=e.id||"fullscreen",this.placement=e.placement||"top-left",e.enterLabel=e.enterLabel||"Enter Fullscreen",e.exitLabel=e.exitLabel||"Exit Fullscreen",e.style=e.style||{},this.props=e}onAdd({deck:e}){let{style:n,className:i}=this.props,o=document.createElement("div");return o.classList.add("deck-widget","deck-widget-fullscreen"),i&&o.classList.add(i),n&&Object.entries(n).map(([s,l])=>o.style.setProperty(s,l)),this.deck=e,this.element=o,this.update(),document.addEventListener("fullscreenchange",this.onFullscreenChange.bind(this)),o}onRemove(){this.deck=void 0,this.element=void 0,document.removeEventListener("fullscreenchange",this.onFullscreenChange.bind(this))}update(){let{enterLabel:e,exitLabel:n}=this.props,i=this.element;if(!i)return;let o=h(ve,{onClick:this.handleClick.bind(this),label:this.fullscreen?n:e,className:this.fullscreen?"deck-widget-fullscreen-exit":"deck-widget-fullscreen-enter"});E(o,i)}setProps(e){let n=this.props,i=this.element;i&&(n.className!==e.className&&(n.className&&i.classList.remove(n.className),e.className&&i.classList.add(e.className)),(0,ye._deepEqual)(n.style,e.style,1)||(n.style&&Object.entries(n.style).map(([o])=>i.style.removeProperty(o)),e.style&&Object.entries(e.style).map(([o,s])=>i.style.setProperty(o,s)))),Object.assign(this.props,e)}getContainer(){return this.props.container||this.deck?.getCanvas()?.parentElement}onFullscreenChange(){let e=this.fullscreen,n=document.fullscreenElement===this.getContainer();e!==n&&(this.fullscreen=!this.fullscreen),this.update()}async handleClick(){this.fullscreen?await this.exitFullscreen():await this.requestFullscreen(),this.update()}async requestFullscreen(){let e=this.getContainer();e?.requestFullscreen?await e.requestFullscreen({navigationUI:"hide"}):this.togglePseudoFullscreen()}async exitFullscreen(){document.exitFullscreen?await document.exitFullscreen():this.togglePseudoFullscreen()}togglePseudoFullscreen(){this.getContainer()?.classList.toggle("deck-pseudo-fullscreen")}};var W=N(F(),1);var G=class{constructor(e){this.id="compass";this.placement="top-left";this.viewId=null;this.viewports={};this.id=e.id||"compass",this.viewId=e.viewId||null,this.placement=e.placement||"top-left",e.transitionDuration=e.transitionDuration||200,e.label=e.label||"Compass",e.style=e.style||{},this.props=e}setProps(e){Object.assign(this.props,e)}onViewportChange(e){this.viewports[e.id]=e,this.update()}onAdd({deck:e}){let{style:n,className:i}=this.props,o=document.createElement("div");return o.classList.add("deck-widget","deck-widget-compass"),i&&o.classList.add(i),n&&Object.entries(n).map(([s,l])=>o.style.setProperty(s,l)),this.deck=e,this.element=o,this.update(),o}getRotation(e){return e instanceof W.WebMercatorViewport?[-e.bearing,e.pitch]:e instanceof W._GlobeViewport?[0,Math.max(-80,Math.min(80,e.latitude))]:[0,0]}update(){let e=this.viewId||Object.values(this.viewports)[0]?.id||"default-view",n=this.viewports[e],[i,o]=this.getRotation(n),s=this.element;if(!s)return;let l=h("div",{className:"deck-widget-button",style:{perspective:100},children:h("button",{type:"button",onClick:()=>{for(let a of Object.values(this.viewports))this.handleCompassReset(a)},label:this.props.label,style:{transform:`rotateX(${o}deg)`},children:h("svg",{fill:"none",width:"100%",height:"100%",viewBox:"0 0 26 26",children:h("g",{transform:`rotate(${i},13,13)`,children:[h("path",{d:"M10 13.0001L12.9999 5L15.9997 13.0001H10Z",fill:"var(--icon-compass-north-color, #F05C44)"}),h("path",{d:"M16.0002 12.9999L13.0004 21L10.0005 12.9999H16.0002Z",fill:"var(--icon-compass-south-color, #C2C2CC)"})]})})})});E(l,s)}onRemove(){this.deck=void 0,this.element=void 0}handleCompassReset(e){let n=this.viewId||e.id||"default-view";if(e instanceof W.WebMercatorViewport){let i={...e,bearing:0,...this.getRotation(e)[0]===0?{pitch:0}:{},transitionDuration:this.props.transitionDuration,transitionInterpolator:new W.FlyToInterpolator};this.deck._onViewStateChange({viewId:n,viewState:i,interactionState:{}})}}};var ke=N(F(),1);var q=class{constructor(e){this.id="zoom";this.placement="top-left";this.orientation="vertical";this.viewId=null;this.viewports={};this.id=e.id||"zoom",this.viewId=e.viewId||null,this.placement=e.placement||"top-left",this.orientation=e.orientation||"vertical",e.transitionDuration=e.transitionDuration||200,e.zoomInLabel=e.zoomInLabel||"Zoom In",e.zoomOutLabel=e.zoomOutLabel||"Zoom Out",e.style=e.style||{},this.props=e}onAdd({deck:e}){let{style:n,className:i}=this.props,o=document.createElement("div");o.classList.add("deck-widget","deck-widget-zoom"),i&&o.classList.add(i),n&&Object.entries(n).map(([l,a])=>o.style.setProperty(l,a));let s=h(be,{orientation:this.orientation,children:[h(te,{onClick:()=>this.handleZoomIn(),label:this.props.zoomInLabel,className:"deck-widget-zoom-in"}),h(te,{onClick:()=>this.handleZoomOut(),label:this.props.zoomOutLabel,className:"deck-widget-zoom-out"})]});return E(s,o),this.deck=e,this.element=o,o}onRemove(){this.deck=void 0,this.element=void 0}setProps(e){Object.assign(this.props,e)}onViewportChange(e){this.viewports[e.id]=e}handleZoom(e,n){let i=this.viewId||e?.id||"default-view",o={...e,zoom:n,transitionDuration:this.props.transitionDuration,transitionInterpolator:new ke.FlyToInterpolator};this.deck._onViewStateChange({viewId:i,viewState:o,interactionState:{}})}handleZoomIn(){for(let e of Object.values(this.viewports))this.handleZoom(e,e.zoom+1)}handleZoomOut(){for(let e of Object.values(this.viewports))this.handleZoom(e,e.zoom-1)}};var je={"--button-background":"#fff","--button-stroke":"rgba(255, 255, 255, 0.3)","--button-inner-stroke":"unset","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25)","--button-backdrop-filter":"unset","--button-icon-idle":"rgba(97, 97, 102, 1)","--button-icon-hover":"rgba(24, 24, 26, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"},He={"--button-background":"rgba(18, 18, 20, 1)","--button-stroke":"rgba(18, 18, 20, 0.30)","--button-inner-stroke":"unset","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25)","--button-backdrop-filter":"unset","--button-icon-idle":"rgba(158, 157, 168, 1)","--button-icon-hover":"rgba(215, 214, 229, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"},Ze={"--button-background":"rgba(255, 255, 255, 0.6)","--button-stroke":"rgba(255, 255, 255, 0.3)","--button-inner-stroke":"1px solid rgba(255, 255, 255, 0.6)","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset","--button-backdrop-filter":"blur(4px)","--button-icon-idle":"rgba(97, 97, 102, 1)","--button-icon-hover":"rgba(24, 24, 26, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"},Ae={"--button-background":"rgba(18, 18, 20, 0.75)","--button-stroke":"rgba(18, 18, 20, 0.30)","--button-inner-stroke":"1px solid rgba(18, 18, 20, 0.75)","--button-shadow":"0px 0px 8px 0px rgba(0, 0, 0, 0.25), 0px 0px 8px 0px rgba(0, 0, 0, 0.1) inset","--button-backdrop-filter":"blur(4px)","--button-icon-idle":"rgba(158, 157, 168, 1)","--button-icon-hover":"rgba(215, 214, 229, 1)","--icon-compass-north-color":"#F05C44","--icon-compass-south-color":"#C2C2CC"};return Fe(O);})();
       return __exports__;
       });

package/package.json

@@ -3,7 +3,7 @@
   "description": "UI widgets for deck.gl",
   "license": "MIT",
   "type": "module",
-  "version": "9.0.24",
+  "version": "9.0.26",
   "publishConfig": {
     "access": "public"
   },
@@ -47,5 +47,5 @@
   "peerDependencies": {
     "@deck.gl/core": "^9.0.0"
   },
-  "gitHead": "0949b9e539222d84d35b1b315e55710106409553"
+  "gitHead": "207f67da86ca13e92eee6b96a934b76f92926d4c"
 }

package/src/compass-widget.tsx

@@ -33,7 +33,7 @@ export class CompassWidget implements Widget<CompassWidgetProps> {
   props: CompassWidgetProps;
   placement: WidgetPlacement = 'top-left';
   viewId?: string | null = null;
-  viewport?: Viewport;
+  viewports: {[id: string]: Viewport} = {};
   deck?: Deck<any>;
   element?: HTMLDivElement;
 
@@ -51,8 +51,8 @@ export class CompassWidget implements Widget<CompassWidgetProps> {
     Object.assign(this.props, props);
   }
 
-  onViewportChange(viewport) {
-    this.viewport = viewport;
+  onViewportChange(viewport: Viewport) {
+    this.viewports[viewport.id] = viewport;
     this.update();
   }
 
@@ -70,17 +70,19 @@ export class CompassWidget implements Widget<CompassWidgetProps> {
     return element;
   }
 
-  getRotation() {
-    if (this.viewport instanceof WebMercatorViewport) {
-      return [-this.viewport.bearing, this.viewport.pitch];
-    } else if (this.viewport instanceof _GlobeViewport) {
-      return [0, Math.max(-80, Math.min(80, this.viewport.latitude))];
+  getRotation(viewport?: Viewport) {
+    if (viewport instanceof WebMercatorViewport) {
+      return [-viewport.bearing, viewport.pitch];
+    } else if (viewport instanceof _GlobeViewport) {
+      return [0, Math.max(-80, Math.min(80, viewport.latitude))];
     }
     return [0, 0];
   }
 
   update() {
-    const [rz, rx] = this.getRotation();
+    const viewId = this.viewId || Object.values(this.viewports)[0]?.id || 'default-view';
+    const viewport = this.viewports[viewId];
+    const [rz, rx] = this.getRotation(viewport);
     const element = this.element;
     if (!element) {
       return;
@@ -89,7 +91,11 @@ export class CompassWidget implements Widget<CompassWidgetProps> {
       <div className="deck-widget-button" style={{perspective: 100}}>
         <button
           type="button"
-          onClick={() => this.handleCompassReset()}
+          onClick={() => {
+            for (const viewport of Object.values(this.viewports)) {
+              this.handleCompassReset(viewport);
+            }
+          }}
           label={this.props.label}
           style={{transform: `rotateX(${rx}deg)`}}
         >
@@ -116,13 +122,13 @@ export class CompassWidget implements Widget<CompassWidgetProps> {
     this.element = undefined;
   }
 
-  handleCompassReset() {
-    const viewId = this.viewId || this.viewport?.id || 'default-view';
-    if (this.viewport instanceof WebMercatorViewport) {
+  handleCompassReset(viewport: Viewport) {
+    const viewId = this.viewId || viewport.id || 'default-view';
+    if (viewport instanceof WebMercatorViewport) {
       const nextViewState = {
-        ...this.viewport,
+        ...viewport,
         bearing: 0,
-        ...(this.getRotation()[0] === 0 ? {pitch: 0} : {}),
+        ...(this.getRotation(viewport)[0] === 0 ? {pitch: 0} : {}),
         transitionDuration: this.props.transitionDuration,
         transitionInterpolator: new FlyToInterpolator()
       };

package/src/zoom-widget.tsx

@@ -43,7 +43,7 @@ export class ZoomWidget implements Widget<ZoomWidgetProps> {
   placement: WidgetPlacement = 'top-left';
   orientation: 'vertical' | 'horizontal' = 'vertical';
   viewId?: string | null = null;
-  viewport?: Viewport;
+  viewports: {[id: string]: Viewport} = {};
   deck?: Deck<any>;
   element?: HTMLDivElement;
 
@@ -98,14 +98,14 @@ export class ZoomWidget implements Widget<ZoomWidgetProps> {
     Object.assign(this.props, props);
   }
 
-  onViewportChange(viewport) {
-    this.viewport = viewport;
+  onViewportChange(viewport: Viewport) {
+    this.viewports[viewport.id] = viewport;
   }
 
-  handleZoom(nextZoom: number) {
-    const viewId = this.viewId || this.viewport?.id || 'default-view';
+  handleZoom(viewport: Viewport, nextZoom: number) {
+    const viewId = this.viewId || viewport?.id || 'default-view';
     const nextViewState = {
-      ...this.viewport,
+      ...viewport,
       zoom: nextZoom,
       transitionDuration: this.props.transitionDuration,
       transitionInterpolator: new FlyToInterpolator()
@@ -115,14 +115,14 @@ export class ZoomWidget implements Widget<ZoomWidgetProps> {
   }
 
   handleZoomIn() {
-    if (this.viewport) {
-      this.handleZoom(this.viewport.zoom + 1);
+    for (const viewport of Object.values(this.viewports)) {
+      this.handleZoom(viewport, viewport.zoom + 1);
     }
   }
 
   handleZoomOut() {
-    if (this.viewport) {
-      this.handleZoom(this.viewport.zoom - 1);
+    for (const viewport of Object.values(this.viewports)) {
+      this.handleZoom(viewport, viewport.zoom - 1);
     }
   }
 }