mobility-toolbox-js 3.0.0-beta.15 → 3.0.0-beta.17

package/mbt.js

@@ -44485,7 +44485,7 @@ uniform ${i3} ${s3} u_${a3};
           })
         );
         this.options = options;
-        this.children = options.children || [];
+        this.set("children", options.children || []);
       }
       /** @deprecated */
       get children() {
@@ -44613,7 +44613,7 @@ uniform ${i3} ${s3} u_${a3};
         (oldValue || []).forEach((child) => {
           child.set("parent", void 0);
         });
-        (this.children || []).forEach((child) => {
+        (this.get("children") || []).forEach((child) => {
           child.set("parent", this);
         });
       }
@@ -44664,13 +44664,20 @@ uniform ${i3} ${s3} u_${a3};
   var MobilityLayerMixin_default = MobilityLayerMixin;
 
   // src/ol/layers/MaplibreLayer.ts
+  var buildStyleUrl = (url, style, apiKey, apiKeyName) => {
+    return getUrlWithParams_default(`${url}/styles/${style}/style.json`, {
+      [apiKeyName]: apiKey
+    }).toString();
+  };
   var MaplibreLayer = class _MaplibreLayer extends MobilityLayerMixin_default(MapLibreLayer) {
     get mbMap() {
-      console.warn("Deprecated. Use layer.maplibreMap.");
+      console.warn("MaplibreLayer.mbMap is deprecated. Use layer.maplibreMap.");
       return this.maplibreMap;
     }
     get maplibreMap() {
-      console.warn("Deprecated. Use layer.mapLibreMap.");
+      console.warn(
+        "MaplibreLayer.maplibreMap is deprecated. Use layer.mapLibreMap."
+      );
       return this.mapLibreMap;
     }
     // get queryRenderedFeaturesOptions(): maplibregl.QueryRenderedFeaturesOptions {
@@ -44704,7 +44711,7 @@ uniform ${i3} ${s3} u_${a3};
      * @param {string} [options.url="https://maps.geops.io"] The geOps Maps API url.
      */
     constructor(options) {
-      super({
+      const newOptions = {
         apiKeyName: "key",
         style: "travic_v2",
         url: "https://maps.geops.io",
@@ -44712,7 +44719,16 @@ uniform ${i3} ${s3} u_${a3};
         mapLibreOptions: {
           ...options.mapLibreOptions || {}
         }
-      });
+      };
+      if (!newOptions.mapLibreOptions.style && newOptions.apiKey) {
+        newOptions.mapLibreOptions.style = buildStyleUrl(
+          newOptions.url,
+          newOptions.style,
+          newOptions.apiKey,
+          newOptions.apiKeyName
+        );
+      }
+      super(newOptions);
     }
     /**
      * Initialize the layer and listen to feature clicks.
@@ -44740,19 +44756,15 @@ uniform ${i3} ${s3} u_${a3};
       if (this.url.includes("style.json")) {
         return this.url;
       }
-      return getUrlWithParams_default(`${this.url}/styles/${this.style}/style.json`, {
-        [this.get("apiKeyName")]: this.get("apiKey")
-      }).toString();
+      return buildStyleUrl(
+        this.url,
+        this.style,
+        this.get("apiKey"),
+        this.get("apiKeyName")
+      );
     }
-    // eslint-disable-next-line class-methods-use-this
-    // createMap(options: MapOptions): Map {
-    //   return new Map(options);
-    // }
-    // createRenderer(): MaplibreLayerRenderer {
-    //   return new MaplibreLayerRenderer(this);
-    // }
     updateMaplibreMap() {
-      this.maplibreMap?.setStyle(this.getStyle(), { diff: false });
+      this.mapLibreMap?.setStyle(this.getStyle(), { diff: false });
     }
     /**
      * Create a copy of the MaplibreLayer.
@@ -44972,12 +44984,12 @@ uniform ${i3} ${s3} u_${a3};
         );
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
-      if (maplibreMap) {
-        if (maplibreMap.loaded()) {
+      const { mapLibreMap } = this.maplibreLayer;
+      if (mapLibreMap) {
+        if (mapLibreMap.loaded()) {
           this.onLoad();
         } else {
-          maplibreMap.once("load", this.onLoad);
+          mapLibreMap.once("load", this.onLoad);
         }
       }
       this.olEventsKeys.push(
@@ -44999,8 +45011,8 @@ uniform ${i3} ${s3} u_${a3};
      * @override
      */
     detachFromMap() {
-      if (this.maplibreLayer?.maplibreMap) {
-        this.maplibreLayer.maplibreMap.off("load", this.onLoad);
+      if (this.maplibreLayer?.mapLibreMap) {
+        this.maplibreLayer.mapLibreMap.off("load", this.onLoad);
         this.removeLayers();
         this.removeSources();
       }
@@ -45008,43 +45020,43 @@ uniform ${i3} ${s3} u_${a3};
     }
     /** @private */
     addSources() {
-      if (!this.maplibreLayer?.maplibreMap || !this.sources) {
+      if (!this.maplibreLayer?.mapLibreMap || !this.sources) {
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
-      if (maplibreMap) {
+      const { mapLibreMap } = this.maplibreLayer;
+      if (mapLibreMap) {
         Object.entries(this.sources).forEach(([id, source]) => {
-          if (!maplibreMap.getSource(id)) {
-            maplibreMap.addSource(id, source);
+          if (!mapLibreMap.getSource(id)) {
+            mapLibreMap.addSource(id, source);
           }
         });
       }
     }
     /** @private */
     removeSources() {
-      if (!this.maplibreLayer?.maplibreMap || !this.sources) {
+      if (!this.maplibreLayer?.mapLibreMap || !this.sources) {
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
-      if (maplibreMap) {
+      const { mapLibreMap } = this.maplibreLayer;
+      if (mapLibreMap) {
         Object.keys(this.sources).forEach((id) => {
-          if (maplibreMap.getSource(id)) {
-            maplibreMap.removeSource(id);
+          if (mapLibreMap.getSource(id)) {
+            mapLibreMap.removeSource(id);
           }
         });
       }
     }
     /** @private */
     addLayers() {
-      if (!this.maplibreLayer?.maplibreMap || !Array.isArray(this.layers)) {
+      if (!this.maplibreLayer?.mapLibreMap || !Array.isArray(this.layers)) {
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
-      if (maplibreMap) {
+      const { mapLibreMap } = this.maplibreLayer;
+      if (mapLibreMap) {
         this.layers.forEach((layer) => {
           const { id, source } = layer;
-          if ((!source || source && maplibreMap.getSource(source)) && id && !maplibreMap.getLayer(id)) {
-            maplibreMap.addLayer(layer, this.beforeId);
+          if ((!source || source && mapLibreMap.getSource(source)) && id && !mapLibreMap.getLayer(id)) {
+            mapLibreMap.addLayer(layer, this.beforeId);
           }
         });
         this.applyLayoutVisibility();
@@ -45052,15 +45064,15 @@ uniform ${i3} ${s3} u_${a3};
     }
     /** @private */
     removeLayers() {
-      if (!this.maplibreLayer?.maplibreMap || !Array.isArray(this.layers)) {
+      if (!this.maplibreLayer?.mapLibreMap || !Array.isArray(this.layers)) {
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
-      if (maplibreMap) {
+      const { mapLibreMap } = this.maplibreLayer;
+      if (mapLibreMap) {
         this.layers.forEach((styleLayer) => {
           const { id } = styleLayer;
-          if (id && maplibreMap.getLayer(id)) {
-            maplibreMap.removeLayer(id);
+          if (id && mapLibreMap.getLayer(id)) {
+            mapLibreMap.removeLayer(id);
           }
         });
       }
@@ -45070,17 +45082,18 @@ uniform ${i3} ${s3} u_${a3};
      * @private
      */
     onLoad() {
-      if (!this.maplibreLayer?.maplibreMap) {
+      if (!this.maplibreLayer?.mapLibreMap) {
         return;
       }
       this.addSources();
       this.addLayers();
-      const { maplibreMap } = this.maplibreLayer;
-      const style = maplibreMap.getStyle();
+      const { mapLibreMap } = this.maplibreLayer;
+      const style = mapLibreMap.getStyle();
       if (style?.layers && this.layersFilter) {
         const styles = style.layers.filter(this.layersFilter);
-        this.disabled = !styles.length;
+        this.set("disabled", !styles.length);
       }
+      this.applyLayoutVisibility();
     }
     /**
      * Set the feature state of the features.
@@ -45089,10 +45102,10 @@ uniform ${i3} ${s3} u_${a3};
      * @public
      */
     setFeatureState(features, state) {
-      if (!this.maplibreLayer?.maplibreMap || !features.length) {
+      if (!this.maplibreLayer?.mapLibreMap || !features.length) {
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
+      const { mapLibreMap } = this.maplibreLayer;
       features.forEach((feature2) => {
         const { source, sourceLayer } = feature2.get(VECTOR_TILE_FEATURE_PROPERTY) || {};
         if (!source && !sourceLayer || !feature2.getId()) {
@@ -45105,7 +45118,7 @@ uniform ${i3} ${s3} u_${a3};
           }
           return;
         }
-        maplibreMap.setFeatureState(
+        mapLibreMap.setFeatureState(
           {
             id: feature2.getId(),
             source,
@@ -45124,19 +45137,19 @@ uniform ${i3} ${s3} u_${a3};
       console.warn(
         `Deprecated. getFeatureInfoAtCoordinate([layer], coordinate) from ol package instead.`
       );
-      if (!this.maplibreLayer?.maplibreMap) {
+      if (!this.maplibreLayer?.mapLibreMap) {
         return Promise.resolve({ coordinate, features: [], layer: this });
       }
-      const { maplibreMap } = this.maplibreLayer;
-      if (!maplibreMap.isStyleLoaded()) {
+      const { mapLibreMap } = this.maplibreLayer;
+      if (!mapLibreMap.isStyleLoaded()) {
         return Promise.resolve({ coordinate, features: [], layer: this });
       }
       let layers = this.layers || [];
       if (this.layersFilter) {
-        layers = maplibreMap.getStyle().layers.filter(this.layersFilter);
+        layers = mapLibreMap.getStyle().layers.filter(this.layersFilter);
       }
       if (this.queryRenderedLayersFilter) {
-        layers = maplibreMap.getStyle().layers.filter(this.queryRenderedLayersFilter);
+        layers = mapLibreMap.getStyle().layers.filter(this.queryRenderedLayersFilter);
       }
       return Promise.resolve({
         features: [],
@@ -45149,14 +45162,14 @@ uniform ${i3} ${s3} u_${a3};
     //  * @param {maplibregl.filter} filter Determines which features should be rendered in a style layer.
     //  */
     // setFilter(filter: { [key: string]: any }) {
-    //   if (!this.maplibreLayer?.maplibreMap) {
+    //   if (!this.maplibreLayer?.mapLibreMap) {
     //     return;
     //   }
-    //   const { maplibreMap } = this.maplibreLayer;
+    //   const { mapLibreMap } = this.maplibreLayer;
     //   this.styleLayers.forEach(({ id }) => {
-    //     if (id && filter && maplibreMap.getLayer(id)) {
+    //     if (id && filter && mapLibreMap.getLayer(id)) {
     //       // @ts-ignore
-    //       maplibreMap.setFilter(id, filter);
+    //       mapLibreMap.setFilter(id, filter);
     //     }
     //   });
     // }
@@ -45206,21 +45219,21 @@ uniform ${i3} ${s3} u_${a3};
      */
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     applyLayoutVisibility(evt) {
-      if (!this.maplibreLayer?.maplibreMap?.getStyle() || !this.layersFilter) {
+      if (!this.maplibreLayer?.mapLibreMap?.getStyle() || !this.layersFilter) {
         return;
       }
-      const { maplibreMap } = this.maplibreLayer;
-      const style = maplibreMap.getStyle();
+      const { mapLibreMap } = this.maplibreLayer;
+      const style = mapLibreMap.getStyle();
       const visibilityValue = this.getVisible() ? "visible" : "none";
       const layers = style.layers || [];
       for (let i = 0; i < layers.length; i += 1) {
         const layer = layers[i];
         if (this.layersFilter(layer)) {
           const { id } = layer;
-          if (maplibreMap.getLayer(id)) {
-            maplibreMap.setLayoutProperty(id, "visibility", visibilityValue);
+          if (mapLibreMap.getLayer(id)) {
+            mapLibreMap.setLayoutProperty(id, "visibility", visibilityValue);
             if (this.getMinZoom() || this.getMaxZoom()) {
-              maplibreMap.setLayerZoomRange(
+              mapLibreMap.setLayerZoomRange(
                 id,
                 this.getMinZoom() ? this.getMinZoom() - 1 : 0,
                 // Maplibre zoom = ol zoom - 1