maplibre-gl-components 0.20.4 → 0.20.6

package/dist/{ControlGrid-DZuo4G2B.js → ControlGrid-BmxIgQg5.js}

@@ -3054,7 +3054,7 @@ var mq = {
     if (t === "shapefile") {
       if (!this._shapefileConverter) {
         this._updateLoading("Loading Shapefile converter...");
-        const { getShapefileConverter: s } = await import("./ShapefileConverter-B27S0Yww.js").then((a) => a.n);
+        const { getShapefileConverter: s } = await import("./ShapefileConverter-BefhyBOj.js").then((a) => a.n);
         this._shapefileConverter = s();
       }
       const r = await this._shapefileConverter.convert(n, e.name, i);
@@ -3062,9 +3062,9 @@ var mq = {
     } else if (Fae(t)) {
       if (!this._duckdbConverter) {
         this._updateLoading("Loading DuckDB converter...");
-        const { getDuckDBConverter: s } = await import("./DuckDBConverter-B6C0hZof.js").then((a) => a.n);
+        const { getDuckDBConverter: s } = await import("./DuckDBConverter-G6cWy2IS.js").then((a) => a.n);
         if (this._duckdbConverter = s(), this._options.duckdbBundleUrl) {
-          const { DuckDBConverter: a } = await import("./DuckDBConverter-B6C0hZof.js").then((l) => l.n);
+          const { DuckDBConverter: a } = await import("./DuckDBConverter-G6cWy2IS.js").then((l) => l.n);
           this._duckdbConverter = new a(this._options.duckdbBundleUrl);
         }
       }
@@ -4530,7 +4530,7 @@ var ioe = ["none", "bone", "bwr", "cividis", "cool", "coolwarm", "gray", "hot",
         if (!(i instanceof Error ? i.message : String(i)).includes("non-unsigned integers not yet supported")) throw i;
         const { parseCOGTileMatrixSet: n, texture: r } = await import("@developmentseed/deck.gl-geotiff");
         if (typeof n != "function" || typeof r?.inferTextureFormat != "function") throw i;
-        const { fromUrl: s } = await import("./geotiff-CgNQDPkf.js"), { CreateTexture: a, FilterNoDataVal: l, MaskTexture: h } = await import("@developmentseed/deck.gl-raster/gpu-modules"), d = await import("./lib-CNQtqzfc.js"), p = d.default || d, g = this.props.geotiff, v = typeof g == "string" ? await s(g) : g, y = this.props.geoKeysParser, E = await n(v, y), S = await v.getImage(), R = await v.getImageCount(), I = [];
+        const { fromUrl: s } = await import("./geotiff-BsSRJ-4E.js"), { CreateTexture: a, FilterNoDataVal: l, MaskTexture: h } = await import("@developmentseed/deck.gl-raster/gpu-modules"), d = await import("./lib-CNQtqzfc.js"), p = d.default || d, g = this.props.geotiff, v = typeof g == "string" ? await s(g) : g, y = this.props.geoKeysParser, E = await n(v, y), S = await v.getImage(), R = await v.getImageCount(), I = [];
         for (let ae = 0; ae < R; ae++) I.push(await v.getImage(ae));
         const k = await y(S.getGeoKeys());
         if (!k) throw new Error("Could not determine source projection from GeoTIFF geo keys");
@@ -5236,7 +5236,7 @@ var poe = class {
         <div class="segment-label">Segments</div>
         <div class="segment-list"></div>
       </div>
-    `, this._resultValueEl = a.querySelector(".result-value"), this._resultUnitEl = a.querySelector(".result-unit"), this._segmentListEl = a.querySelector(".segment-list"), i.appendChild(a), this._instructionsEl = document.createElement("div"), this._instructionsEl.className = "measure-instructions", this._instructionsEl.textContent = "Click on the map to start measuring. Double-click to finish.", i.appendChild(this._instructionsEl), this._measurementsListEl = document.createElement("div"), this._measurementsListEl.className = "measurements-list", this._measurementsListEl.style.display = "none", i.appendChild(this._measurementsListEl);
+    `, this._resultValueEl = a.querySelector(".result-value"), this._resultUnitEl = a.querySelector(".result-unit"), this._segmentListEl = a.querySelector(".segment-list"), i.appendChild(a), this._instructionsEl = document.createElement("div"), this._instructionsEl.className = "measure-instructions", this._instructionsEl.textContent = "Click Start, then click the map to add points. Double-click to finish.", i.appendChild(this._instructionsEl), this._measurementsListEl = document.createElement("div"), this._measurementsListEl.className = "measurements-list", this._measurementsListEl.style.display = "none", i.appendChild(this._measurementsListEl);
     const l = document.createElement("div");
     return l.className = "measure-actions", l.innerHTML = `
       <button type="button" class="action-btn primary start-btn">
@@ -5372,7 +5372,7 @@ var poe = class {
   _cancelDrawing() {
     this._stopDrawing(), this._clearMarkers(), this._state.currentPoints = [], this._state.currentValue = 0, this._state.currentSegments = [], this._updateMapGeometry();
     const e = this._panel?.querySelector(".measure-result");
-    e && (e.style.display = "none"), this._instructionsEl && (this._instructionsEl.textContent = "Click on the map to start measuring. Double-click to finish.");
+    e && (e.style.display = "none"), this._instructionsEl && (this._instructionsEl.textContent = "Click Start, then click the map to add points. Double-click to finish.");
   }
   _updateMeasurement() {
     const e = this._state.currentPoints;
@@ -8226,7 +8226,7 @@ var Goe = [
       this._state.loading = !0, this._state.error = null, this._state.status = null, this._render();
       try {
         await this._ensureOverlay();
-        const { COGLayer: l } = await import("@developmentseed/deck.gl-geotiff"), { fromUrl: h } = await import("./geotiff-CgNQDPkf.js");
+        const { COGLayer: l } = await import("@developmentseed/deck.gl-geotiff"), { fromUrl: h } = await import("./geotiff-BsSRJ-4E.js");
         this._patchCOGLayer(l);
         const d = `stac-${this._state.stacItem?.id || "layer"}-rgb-${this._layerCounter++}`, [p, g, v] = await Promise.all([
           h(r.href),
@@ -8394,7 +8394,7 @@ var Goe = [
     e.prototype._parseGeoTIFF = async function() {
       const { parseCOGTileMatrixSet: n, texture: r } = await import("@developmentseed/deck.gl-geotiff");
       if (typeof n != "function" || typeof r?.inferTextureFormat != "function") return i.call(this);
-      const { fromUrl: s } = await import("./geotiff-CgNQDPkf.js"), { CreateTexture: a, FilterNoDataVal: l, Colormap: h } = await import("@developmentseed/deck.gl-raster/gpu-modules"), d = await import("./lib-CNQtqzfc.js"), p = d.default || d, g = this.props.geotiff, v = typeof g == "string" ? await s(g) : g, y = this.props.geoKeysParser;
+      const { fromUrl: s } = await import("./geotiff-BsSRJ-4E.js"), { CreateTexture: a, FilterNoDataVal: l, Colormap: h } = await import("@developmentseed/deck.gl-raster/gpu-modules"), d = await import("./lib-CNQtqzfc.js"), p = d.default || d, g = this.props.geotiff, v = typeof g == "string" ? await s(g) : g, y = this.props.geoKeysParser;
       let E;
       try {
         E = await n(v, y);
@@ -10077,7 +10077,7 @@ var a9 = class {
     throw new Error("CORS error: Unable to fetch the file. The server doesn't allow cross-origin requests.");
   }
   async _loadGeoParquet(e) {
-    const { getDuckDBConverter: t } = await import("./DuckDBConverter-B6C0hZof.js").then((a) => a.n), i = t(), n = await this._fetchWithCorsProxy(e);
+    const { getDuckDBConverter: t } = await import("./DuckDBConverter-G6cWy2IS.js").then((a) => a.n), i = t(), n = await this._fetchWithCorsProxy(e);
     let r;
     try {
       r = await n.arrayBuffer();
@@ -10121,7 +10121,7 @@ var a9 = class {
   }
   async _setupViewportLoading(e, t, i) {
     if (!this._map) return;
-    const { getDuckDBConverter: n } = await import("./DuckDBConverter-B6C0hZof.js").then((a) => a.n), r = n(), s = `${e}.parquet`;
+    const { getDuckDBConverter: n } = await import("./DuckDBConverter-G6cWy2IS.js").then((a) => a.n), r = n(), s = `${e}.parquet`;
     try {
       await r.registerRemoteParquet(t, s);
       const a = await r.getParquetSchema(s);
@@ -10150,7 +10150,7 @@ var a9 = class {
     for (const n of t.layerIds) this._map.getLayer(n) && this._map.setLayoutProperty(n, "visibility", "visible");
     this._viewportLoadingState.set(e, !0);
     try {
-      const { getDuckDBConverter: n } = await import("./DuckDBConverter-B6C0hZof.js").then((d) => d.n), r = n(), s = this._map.getBounds(), a = [
+      const { getDuckDBConverter: n } = await import("./DuckDBConverter-G6cWy2IS.js").then((d) => d.n), r = n(), s = this._map.getBounds(), a = [
         s.getWest(),
         s.getSouth(),
         s.getEast(),
@@ -10165,7 +10165,7 @@ var a9 = class {
   }
   async _cleanupViewportLoading() {
     if (this._map && this._viewportHandler && (this._map.off("moveend", this._viewportHandler), this._viewportHandler = void 0), this._viewportLoadingLayers.size > 0) try {
-      const { getDuckDBConverter: e } = await import("./DuckDBConverter-B6C0hZof.js").then((i) => i.n), t = e();
+      const { getDuckDBConverter: e } = await import("./DuckDBConverter-G6cWy2IS.js").then((i) => i.n), t = e();
       for (const i of this._viewportLoadingLayers) {
         const n = this._vectorLayers.get(i);
         n?.duckdbFileName && await t.unregisterFile(n.duckdbFileName);
@@ -10178,7 +10178,7 @@ var a9 = class {
     const t = this._vectorLayers.get(e);
     if (!(!t?.viewportLoading || !t.duckdbFileName)) {
       try {
-        const { getDuckDBConverter: i } = await import("./DuckDBConverter-B6C0hZof.js").then((n) => n.n);
+        const { getDuckDBConverter: i } = await import("./DuckDBConverter-G6cWy2IS.js").then((n) => n.n);
         await i().unregisterFile(t.duckdbFileName);
       } catch {
       }
@@ -11052,7 +11052,7 @@ var rle = class {
     throw new Error("CORS error: Unable to fetch the file. The server doesn't allow cross-origin requests.");
   }
   async _loadGeoParquet(e) {
-    const { getDuckDBConverter: t } = await import("./DuckDBConverter-B6C0hZof.js").then((a) => a.n), i = t(), n = await this._fetchWithCorsProxy(e);
+    const { getDuckDBConverter: t } = await import("./DuckDBConverter-G6cWy2IS.js").then((a) => a.n), i = t(), n = await this._fetchWithCorsProxy(e);
     let r;
     try {
       r = await n.arrayBuffer();
@@ -11162,7 +11162,7 @@ var rle = class {
   visible: !0,
   collapsed: !0,
   panelWidth: 280,
-  maxHeight: 500,
+  maxHeight: 0,
   backgroundColor: "rgba(255, 255, 255, 0.95)",
   borderRadius: 4,
   opacity: 1,
@@ -11179,6 +11179,7 @@ var rle = class {
   _eventHandlers = /* @__PURE__ */ new Map();
   _map;
   _handleZoom;
+  _handleResize;
   _zoomVisible = !0;
   _colorbar;
   _colorbars = [];
@@ -11225,7 +11226,7 @@ var rle = class {
     return this._map = e, this._container = this._createContainer(), this._setupZoomHandler(), this._state.collapsed || this._showPanel(), this._container;
   }
   onRemove() {
-    this._handleZoom && this._map && this._map.off("zoom", this._handleZoom), this._removeAllColorbars(), this._container?.remove(), this._container = void 0, this._map = void 0;
+    this._handleZoom && this._map && this._map.off("zoom", this._handleZoom), this._handleResize && (window.removeEventListener("resize", this._handleResize), this._handleResize = void 0), this._removeAllColorbars(), this._container?.remove(), this._container = void 0, this._map = void 0;
   }
   getDefaultPosition() {
     return this._options.position;
@@ -11300,7 +11301,7 @@ var rle = class {
   }
   _createPanel() {
     const e = document.createElement("div");
-    e.className = `colorbar-gui-panel ${this._options.position.includes("left") ? "right" : "left"}`, e.style.width = `${this._options.panelWidth}px`, this._options.maxHeight > 0 && (e.style.maxHeight = `${this._options.maxHeight}px`, e.style.overflowY = "auto"), e.style.background = this._options.backgroundColor, e.style.borderRadius = `${this._options.borderRadius}px`, e.style.fontSize = `${this._options.fontSize}px`, e.style.color = this._options.fontColor;
+    e.className = `colorbar-gui-panel ${this._options.position.includes("left") ? "right" : "left"}`, e.style.width = `${this._options.panelWidth}px`, e.style.overflowY = "auto", e.style.background = this._options.backgroundColor, e.style.borderRadius = `${this._options.borderRadius}px`, e.style.fontSize = `${this._options.fontSize}px`, e.style.color = this._options.fontColor;
     const t = document.createElement("div");
     t.className = "colorbar-gui-header", t.innerHTML = `
       <span>Colorbar</span>
@@ -11503,10 +11504,15 @@ or #440154, #21918c, #fde725`, this._customColorsTextarea.addEventListener("inpu
     this._state.collapsed ? this.expand() : this.collapse();
   }
   _showPanel() {
-    !this._panel && this._container && (this._panel = this._createPanel(), this._container.appendChild(this._panel)), this._button?.classList.add("active");
+    !this._panel && this._container && (this._panel = this._createPanel(), this._container.appendChild(this._panel)), this._button?.classList.add("active"), this._updatePanelHeight(), this._handleResize || (this._handleResize = () => this._updatePanelHeight(), window.addEventListener("resize", this._handleResize));
   }
   _hidePanel() {
-    this._panel?.remove(), this._panel = void 0, this._button?.classList.remove("active");
+    this._handleResize && (window.removeEventListener("resize", this._handleResize), this._handleResize = void 0), this._panel?.remove(), this._panel = void 0, this._button?.classList.remove("active");
+  }
+  _updatePanelHeight() {
+    if (!this._panel) return;
+    const e = 16, t = 200, i = this._panel.getBoundingClientRect().top, n = Math.max(t, window.innerHeight - i - e), r = this._options.maxHeight > 0 ? Math.min(this._options.maxHeight, n) : n;
+    this._panel.style.maxHeight = `${r}px`;
   }
   _setupZoomHandler() {
     this._map && (this._handleZoom = () => {
@@ -11523,7 +11529,7 @@ or #440154, #21918c, #fde725`, this._customColorsTextarea.addEventListener("inpu
   visible: !0,
   collapsed: !0,
   panelWidth: 280,
-  maxHeight: 500,
+  maxHeight: 0,
   backgroundColor: "rgba(255, 255, 255, 0.95)",
   borderRadius: 4,
   opacity: 1,
@@ -11540,6 +11546,7 @@ or #440154, #21918c, #fde725`, this._customColorsTextarea.addEventListener("inpu
   _eventHandlers = /* @__PURE__ */ new Map();
   _map;
   _handleZoom;
+  _handleResize;
   _zoomVisible = !0;
   _legend;
   _legends = [];
@@ -11588,7 +11595,7 @@ or #440154, #21918c, #fde725`, this._customColorsTextarea.addEventListener("inpu
     return this._map = e, this._container = this._createContainer(), this._setupZoomHandler(), this._state.collapsed || this._showPanel(), this._container;
   }
   onRemove() {
-    this._handleZoom && this._map && this._map.off("zoom", this._handleZoom), this._removeAllLegends(), this._container?.remove(), this._container = void 0, this._map = void 0;
+    this._handleZoom && this._map && this._map.off("zoom", this._handleZoom), this._handleResize && (window.removeEventListener("resize", this._handleResize), this._handleResize = void 0), this._removeAllLegends(), this._container?.remove(), this._container = void 0, this._map = void 0;
   }
   getDefaultPosition() {
     return this._options.position;
@@ -11671,7 +11678,7 @@ or #440154, #21918c, #fde725`, this._customColorsTextarea.addEventListener("inpu
   }
   _createPanel() {
     const e = document.createElement("div");
-    e.className = `legend-gui-panel ${this._options.position.includes("left") ? "right" : "left"}`, e.style.minWidth = `${this._options.panelWidth}px`, e.style.width = "auto", e.style.maxWidth = "400px", this._options.maxHeight > 0 && (e.style.maxHeight = `${this._options.maxHeight}px`, e.style.overflowY = "auto"), e.style.background = this._options.backgroundColor, e.style.borderRadius = `${this._options.borderRadius}px`, e.style.fontSize = `${this._options.fontSize}px`, e.style.color = this._options.fontColor;
+    e.className = `legend-gui-panel ${this._options.position.includes("left") ? "right" : "left"}`, e.style.minWidth = `${this._options.panelWidth}px`, e.style.width = "auto", e.style.maxWidth = "400px", e.style.overflowY = "auto", e.style.background = this._options.backgroundColor, e.style.borderRadius = `${this._options.borderRadius}px`, e.style.fontSize = `${this._options.fontSize}px`, e.style.color = this._options.fontColor;
     const t = document.createElement("div");
     t.className = "legend-gui-header", t.innerHTML = `
       <span>Legend</span>
@@ -11882,10 +11889,15 @@ or #440154, #21918c, #fde725`, this._customColorsTextarea.addEventListener("inpu
     this._state.collapsed ? this.expand() : this.collapse();
   }
   _showPanel() {
-    !this._panel && this._container && (this._panel = this._createPanel(), this._container.appendChild(this._panel)), this._button?.classList.add("active");
+    !this._panel && this._container && (this._panel = this._createPanel(), this._container.appendChild(this._panel)), this._button?.classList.add("active"), this._updatePanelHeight(), this._handleResize || (this._handleResize = () => this._updatePanelHeight(), window.addEventListener("resize", this._handleResize));
   }
   _hidePanel() {
-    this._panel?.remove(), this._panel = void 0, this._button?.classList.remove("active");
+    this._handleResize && (window.removeEventListener("resize", this._handleResize), this._handleResize = void 0), this._panel?.remove(), this._panel = void 0, this._button?.classList.remove("active");
+  }
+  _updatePanelHeight() {
+    if (!this._panel) return;
+    const e = 16, t = 200, i = this._panel.getBoundingClientRect().top, n = Math.max(t, window.innerHeight - i - e), r = this._options.maxHeight > 0 ? Math.min(this._options.maxHeight, n) : n;
+    this._panel.style.maxHeight = `${r}px`;
   }
   _setupZoomHandler() {
     this._map && (this._handleZoom = () => {