mobility-toolbox-js 3.0.0-beta.36 → 3.0.0-beta.38

package/mbt.js

@@ -17993,7 +17993,6 @@ uniform ${i3} ${a3} u_${s3};
     Layer: () => Layer_default4,
     MaplibreLayer: () => MaplibreLayer_default,
     MaplibreStyleLayer: () => MaplibreStyleLayer_default,
-    MobilityLayerMixin: () => MobilityLayerMixin_default,
     RealtimeAPI: () => RealtimeAPI_default,
     RealtimeLayer: () => RealtimeLayer_default,
     RealtimeModes: () => RealtimeModes,
@@ -25014,7 +25013,6 @@ uniform ${i3} ${a3} u_${s3};
   // src/common/utils/getVehiclePosition.ts
   var getVehiclePosition = (now, trajectory, noInterpolate) => {
     const {
-      // @ts-expect-error  coordinate is added by the RealtimeLayer
       coordinate,
       // @ts-expect-error  olGeometry is added by the RealtimeLayer
       olGeometry,
@@ -43225,13 +43223,13 @@ uniform ${i3} ${a3} u_${s3};
       }
       const map = this.getMap();
       if (map && map.isRendered() && this.getActive()) {
-        this.handlePointerAtPixel_(this.lastPixel_, map);
+        this.handlePointerAtPixel_(map.getCoordinateFromPixel(this.lastPixel_));
       }
       feature2.addEventListener(EventType_default.CHANGE, this.boundHandleFeatureChange_);
     }
     /**
      * @param {import("../MapBrowserEvent.js").default} evt Map browser event.
-     * @param {Array<Array<SegmentData>>} segments The segments subject to modification.
+     * @param {Array<SegmentData>} segments The segments subject to modification.
      * @private
      */
     willModifyFeatures_(evt, segments) {
@@ -43239,12 +43237,9 @@ uniform ${i3} ${a3} u_${s3};
         this.featuresBeingModified_ = new Collection_default();
         const features = this.featuresBeingModified_.getArray();
         for (let i = 0, ii = segments.length; i < ii; ++i) {
-          const segment = segments[i];
-          for (let s = 0, ss = segment.length; s < ss; ++s) {
-            const feature2 = segment[s].feature;
-            if (feature2 && !features.includes(feature2)) {
-              this.featuresBeingModified_.push(feature2);
-            }
+          const feature2 = segments[i].feature;
+          if (feature2 && !features.includes(feature2)) {
+            this.featuresBeingModified_.push(feature2);
           }
         }
         if (this.featuresBeingModified_.getLength() === 0) {
@@ -43562,10 +43557,11 @@ uniform ${i3} ${a3} u_${s3};
      * @param {import("../coordinate.js").Coordinate} coordinates Coordinates.
      * @param {Array<Feature>} features The features being modified.
      * @param {Array<import("../geom/SimpleGeometry.js").default>} geometries The geometries being modified.
+     * @param {boolean} existing The vertex represents an existing vertex.
      * @return {Feature} Vertex feature.
      * @private
      */
-    createOrUpdateVertexFeature_(coordinates2, features, geometries) {
+    createOrUpdateVertexFeature_(coordinates2, features, geometries, existing) {
       let vertexFeature = this.vertexFeature_;
       if (!vertexFeature) {
         vertexFeature = new Feature_default(new Point_default(coordinates2));
@@ -43577,6 +43573,7 @@ uniform ${i3} ${a3} u_${s3};
       }
       vertexFeature.set("features", features);
       vertexFeature.set("geometries", geometries);
+      vertexFeature.set("existing", existing);
       return vertexFeature;
     }
     /**
@@ -43606,6 +43603,80 @@ uniform ${i3} ${a3} u_${s3};
       }
       return super.handleEvent(mapBrowserEvent) && !handled;
     }
+    findInsertVerticesAndUpdateDragSegments_(pixelCoordinate) {
+      this.handlePointerAtPixel_(pixelCoordinate);
+      this.dragSegments_.length = 0;
+      this.featuresBeingModified_ = null;
+      const vertexFeature = this.vertexFeature_;
+      if (!vertexFeature) {
+        return;
+      }
+      const projection = this.getMap().getView().getProjection();
+      const insertVertices = [];
+      const vertex = vertexFeature.getGeometry().getCoordinates();
+      const vertexExtent = boundingExtent([vertex]);
+      const segmentDataMatches = this.rBush_.getInExtent(vertexExtent);
+      const componentSegments = {};
+      segmentDataMatches.sort(compareIndexes);
+      for (let i = 0, ii = segmentDataMatches.length; i < ii; ++i) {
+        const segmentDataMatch = segmentDataMatches[i];
+        const segment = segmentDataMatch.segment;
+        let uid = getUid(segmentDataMatch.geometry);
+        const depth = segmentDataMatch.depth;
+        if (depth) {
+          uid += "-" + depth.join("-");
+        }
+        if (!componentSegments[uid]) {
+          componentSegments[uid] = new Array(2);
+        }
+        if (segmentDataMatch.geometry.getType() === "Circle" && segmentDataMatch.index === CIRCLE_CIRCUMFERENCE_INDEX) {
+          const closestVertex = closestOnSegmentData(
+            pixelCoordinate,
+            segmentDataMatch,
+            projection
+          );
+          if (equals3(closestVertex, vertex) && !componentSegments[uid][0]) {
+            this.dragSegments_.push([segmentDataMatch, 0]);
+            componentSegments[uid][0] = segmentDataMatch;
+          }
+          continue;
+        }
+        if (equals3(segment[0], vertex) && !componentSegments[uid][0]) {
+          this.dragSegments_.push([segmentDataMatch, 0]);
+          componentSegments[uid][0] = segmentDataMatch;
+          continue;
+        }
+        if (equals3(segment[1], vertex) && !componentSegments[uid][1]) {
+          if (componentSegments[uid][0] && componentSegments[uid][0].index === 0) {
+            let coordinates2 = segmentDataMatch.geometry.getCoordinates();
+            switch (segmentDataMatch.geometry.getType()) {
+              // prevent dragging closed linestrings by the connecting node
+              case "LineString":
+              case "MultiLineString":
+                continue;
+              // if dragging the first vertex of a polygon, ensure the other segment
+              // belongs to the closing vertex of the linear ring
+              case "MultiPolygon":
+                coordinates2 = coordinates2[depth[1]];
+              /* falls through */
+              case "Polygon":
+                if (segmentDataMatch.index !== coordinates2[depth[0]].length - 2) {
+                  continue;
+                }
+                break;
+              default:
+            }
+          }
+          this.dragSegments_.push([segmentDataMatch, 1]);
+          componentSegments[uid][1] = segmentDataMatch;
+          continue;
+        }
+        if (getUid(segment) in this.vertexSegments_ && !componentSegments[uid][0] && !componentSegments[uid][1]) {
+          insertVertices.push(segmentDataMatch);
+        }
+      }
+      return insertVertices;
+    }
     /**
      * Handle pointer drag events.
      * @param {import("../MapBrowserEvent.js").default} evt Event.
@@ -43613,7 +43684,10 @@ uniform ${i3} ${a3} u_${s3};
      */
     handleDragEvent(evt) {
       this.ignoreNextSingleClick_ = false;
-      this.willModifyFeatures_(evt, this.dragSegments_);
+      this.willModifyFeatures_(
+        evt,
+        this.dragSegments_.map(([segment]) => segment)
+      );
       const vertex = [
         evt.coordinate[0] + this.delta_[0],
         evt.coordinate[1] + this.delta_[1]
@@ -43671,26 +43745,30 @@ uniform ${i3} ${a3} u_${s3};
             segment[index] = vertex;
             break;
           case "Circle":
+            const circle = (
+              /** @type {import("../geom/Circle.js").default} */
+              geometry
+            );
             segment[0] = vertex;
             segment[1] = vertex;
             if (segmentData.index === CIRCLE_CENTER_INDEX) {
               this.changingFeature_ = true;
-              geometry.setCenter(vertex);
+              circle.setCenter(vertex);
               this.changingFeature_ = false;
             } else {
               this.changingFeature_ = true;
               const projection = evt.map.getView().getProjection();
               let radius = distance(
-                fromUserCoordinate(geometry.getCenter(), projection),
+                fromUserCoordinate(circle.getCenter(), projection),
                 fromUserCoordinate(vertex, projection)
               );
               const userProjection2 = getUserProjection();
               if (userProjection2) {
-                const circleGeometry = geometry.clone().transform(userProjection2, projection);
+                const circleGeometry = circle.clone().transform(userProjection2, projection);
                 circleGeometry.setRadius(radius);
                 radius = circleGeometry.transform(projection, userProjection2).getRadius();
               }
-              geometry.setRadius(radius);
+              circle.setRadius(radius);
               this.changingFeature_ = false;
             }
             break;
@@ -43700,7 +43778,7 @@ uniform ${i3} ${a3} u_${s3};
           this.setGeometryCoordinates_(geometry, coordinates2);
         }
       }
-      this.createOrUpdateVertexFeature_(vertex, features, geometries);
+      this.createOrUpdateVertexFeature_(vertex, features, geometries, true);
     }
     /**
      * Handle pointer down events.
@@ -43713,80 +43791,15 @@ uniform ${i3} ${a3} u_${s3};
         return false;
       }
       const pixelCoordinate = evt.coordinate;
-      this.handlePointerAtPixel_(evt.pixel, evt.map, pixelCoordinate);
-      this.dragSegments_.length = 0;
-      this.featuresBeingModified_ = null;
-      const vertexFeature = this.vertexFeature_;
-      if (vertexFeature) {
-        const projection = evt.map.getView().getProjection();
-        const insertVertices = [];
-        const vertex = vertexFeature.getGeometry().getCoordinates();
-        const vertexExtent = boundingExtent([vertex]);
-        const segmentDataMatches = this.rBush_.getInExtent(vertexExtent);
-        const componentSegments = {};
-        segmentDataMatches.sort(compareIndexes);
-        for (let i = 0, ii = segmentDataMatches.length; i < ii; ++i) {
-          const segmentDataMatch = segmentDataMatches[i];
-          const segment = segmentDataMatch.segment;
-          let uid = getUid(segmentDataMatch.geometry);
-          const depth = segmentDataMatch.depth;
-          if (depth) {
-            uid += "-" + depth.join("-");
-          }
-          if (!componentSegments[uid]) {
-            componentSegments[uid] = new Array(2);
-          }
-          if (segmentDataMatch.geometry.getType() === "Circle" && segmentDataMatch.index === CIRCLE_CIRCUMFERENCE_INDEX) {
-            const closestVertex = closestOnSegmentData(
-              pixelCoordinate,
-              segmentDataMatch,
-              projection
-            );
-            if (equals3(closestVertex, vertex) && !componentSegments[uid][0]) {
-              this.dragSegments_.push([segmentDataMatch, 0]);
-              componentSegments[uid][0] = segmentDataMatch;
-            }
-            continue;
-          }
-          if (equals3(segment[0], vertex) && !componentSegments[uid][0]) {
-            this.dragSegments_.push([segmentDataMatch, 0]);
-            componentSegments[uid][0] = segmentDataMatch;
-            continue;
-          }
-          if (equals3(segment[1], vertex) && !componentSegments[uid][1]) {
-            if (componentSegments[uid][0] && componentSegments[uid][0].index === 0) {
-              let coordinates2 = segmentDataMatch.geometry.getCoordinates();
-              switch (segmentDataMatch.geometry.getType()) {
-                // prevent dragging closed linestrings by the connecting node
-                case "LineString":
-                case "MultiLineString":
-                  continue;
-                // if dragging the first vertex of a polygon, ensure the other segment
-                // belongs to the closing vertex of the linear ring
-                case "MultiPolygon":
-                  coordinates2 = coordinates2[depth[1]];
-                /* falls through */
-                case "Polygon":
-                  if (segmentDataMatch.index !== coordinates2[depth[0]].length - 2) {
-                    continue;
-                  }
-                  break;
-                default:
-              }
-            }
-            this.dragSegments_.push([segmentDataMatch, 1]);
-            componentSegments[uid][1] = segmentDataMatch;
-            continue;
+      const insertVertices = this.findInsertVerticesAndUpdateDragSegments_(pixelCoordinate);
+      if (insertVertices?.length && this.insertVertexCondition_(evt)) {
+        this.willModifyFeatures_(evt, insertVertices);
+        if (this.vertexFeature_) {
+          const vertex = this.vertexFeature_.getGeometry().getCoordinates();
+          for (let j = insertVertices.length - 1; j >= 0; --j) {
+            this.insertVertex_(insertVertices[j], vertex);
           }
-          if (getUid(segment) in this.vertexSegments_ && !componentSegments[uid][0] && !componentSegments[uid][1] && this.insertVertexCondition_(evt)) {
-            insertVertices.push(segmentDataMatch);
-          }
-        }
-        if (insertVertices.length) {
-          this.willModifyFeatures_(evt, [insertVertices]);
-        }
-        for (let j = insertVertices.length - 1; j >= 0; --j) {
-          this.insertVertex_(insertVertices[j], vertex);
+          this.ignoreNextSingleClick_ = true;
         }
       }
       return !!this.vertexFeature_;
@@ -43802,7 +43815,11 @@ uniform ${i3} ${a3} u_${s3};
         const segmentData = this.dragSegments_[i][0];
         const geometry = segmentData.geometry;
         if (geometry.getType() === "Circle") {
-          const coordinates2 = geometry.getCenter();
+          const circle = (
+            /** @type {import("../geom/Circle.js").default} */
+            geometry
+          );
+          const coordinates2 = circle.getCenter();
           const centerSegmentData = segmentData.featureSegments[0];
           const circumferenceSegmentData = segmentData.featureSegments[1];
           centerSegmentData.segment[0] = coordinates2;
@@ -43810,7 +43827,7 @@ uniform ${i3} ${a3} u_${s3};
           circumferenceSegmentData.segment[0] = coordinates2;
           circumferenceSegmentData.segment[1] = coordinates2;
           this.rBush_.update(createOrUpdateFromCoordinate(coordinates2), centerSegmentData);
-          let circleGeometry = geometry;
+          let circleGeometry = circle;
           const userProjection2 = getUserProjection();
           if (userProjection2) {
             const projection = evt.map.getView().getProjection();
@@ -43846,16 +43863,15 @@ uniform ${i3} ${a3} u_${s3};
      */
     handlePointerMove_(evt) {
       this.lastPixel_ = evt.pixel;
-      this.handlePointerAtPixel_(evt.pixel, evt.map, evt.coordinate);
+      this.handlePointerAtPixel_(evt.coordinate);
     }
     /**
-     * @param {import("../pixel.js").Pixel} pixel Pixel
-     * @param {import("../Map.js").default} map Map.
-     * @param {import("../coordinate.js").Coordinate} [coordinate] The pixel Coordinate.
+     * @param {import("../coordinate.js").Coordinate} pixelCoordinate The pixel Coordinate.
      * @private
      */
-    handlePointerAtPixel_(pixel, map, coordinate) {
-      const pixelCoordinate = coordinate || map.getCoordinateFromPixel(pixel);
+    handlePointerAtPixel_(pixelCoordinate) {
+      const map = this.getMap();
+      const pixel = map.getPixelFromCoordinate(pixelCoordinate);
       const projection = map.getView().getProjection();
       const sortByDistance = function(a, b) {
         return projectedDistanceToSegmentDataSquared(pixelCoordinate, a, projection) - projectedDistanceToSegmentDataSquared(pixelCoordinate, b, projection);
@@ -43873,10 +43889,10 @@ uniform ${i3} ${a3} u_${s3};
               );
             }
             const geom = geometry || feature2.getGeometry();
-            if (feature2 instanceof Feature_default && this.features_.getArray().includes(feature2)) {
+            if (geom && geom.getType() === "Point" && feature2 instanceof Feature_default && this.features_.getArray().includes(feature2)) {
               hitPointGeometry = /** @type {Point} */
               geom;
-              const coordinate2 = (
+              const coordinate = (
                 /** @type {Point} */
                 feature2.getGeometry().getFlatCoordinates().slice(0, 2)
               );
@@ -43884,7 +43900,7 @@ uniform ${i3} ${a3} u_${s3};
                 {
                   feature: feature2,
                   geometry: hitPointGeometry,
-                  segment: [coordinate2, coordinate2]
+                  segment: [coordinate, coordinate]
                 }
               ];
             }
@@ -43923,7 +43939,8 @@ uniform ${i3} ${a3} u_${s3};
             this.createOrUpdateVertexFeature_(
               vertex,
               [node.feature],
-              [node.geometry]
+              [node.geometry],
+              this.snappedToVertex_
             );
           } else {
             const pixel1 = map.getPixelFromCoordinate(closestSegment[0]);
@@ -43938,7 +43955,8 @@ uniform ${i3} ${a3} u_${s3};
             this.createOrUpdateVertexFeature_(
               vertex,
               [node.feature],
-              [node.geometry]
+              [node.geometry],
+              this.snappedToVertex_
             );
             const geometries = {};
             geometries[getUid(node.geometry)] = true;
@@ -43967,6 +43985,7 @@ uniform ${i3} ${a3} u_${s3};
     /**
      * @param {SegmentData} segmentData Segment data.
      * @param {import("../coordinate.js").Coordinate} vertex Vertex.
+     * @return {boolean} A vertex was inserted.
      * @private
      */
     insertVertex_(segmentData, vertex) {
@@ -43997,7 +44016,7 @@ uniform ${i3} ${a3} u_${s3};
           coordinates2.splice(index + 1, 0, vertex);
           break;
         default:
-          return;
+          return false;
       }
       this.setGeometryCoordinates_(geometry, coordinates2);
       const rTree = this.rBush_;
@@ -44021,17 +44040,70 @@ uniform ${i3} ${a3} u_${s3};
       };
       rTree.insert(boundingExtent(newSegmentData2.segment), newSegmentData2);
       this.dragSegments_.push([newSegmentData2, 0]);
-      this.ignoreNextSingleClick_ = true;
+      return true;
+    }
+    updatePointer_(coordinate) {
+      if (coordinate) {
+        this.findInsertVerticesAndUpdateDragSegments_(coordinate);
+      }
+      return this.vertexFeature_?.getGeometry().getCoordinates();
+    }
+    /**
+     * Get the current pointer position.
+     * @return {import("../coordinate.js").Coordinate | null} The current pointer coordinate.
+     */
+    getPoint() {
+      const coordinate = this.vertexFeature_?.getGeometry().getCoordinates();
+      if (!coordinate) {
+        return null;
+      }
+      return toUserCoordinate(
+        coordinate,
+        this.getMap().getView().getProjection()
+      );
     }
     /**
-     * Removes the vertex currently being pointed.
+     * Check if a point can be removed from the current linestring or polygon at the current
+     * pointer position.
+     * @return {boolean} A point can be deleted at the current pointer position.
+     * @api
+     */
+    canRemovePoint() {
+      if (!this.vertexFeature_) {
+        return false;
+      }
+      if (this.vertexFeature_.get("geometries").every(
+        (geometry) => geometry.getType() === "Circle" || geometry.getType().endsWith("Point")
+      )) {
+        return false;
+      }
+      const coordinate = this.vertexFeature_.getGeometry().getCoordinates();
+      const segments = this.rBush_.getInExtent(boundingExtent([coordinate]));
+      return segments.some(
+        ({ segment }) => equals3(segment[0], coordinate) || equals3(segment[1], coordinate)
+      );
+    }
+    /**
+     * Removes the vertex currently being pointed from the current linestring or polygon.
+     * @param {import('../coordinate.js').Coordinate} [coordinate] If provided, the pointer
+     * will be set to the provided coordinate. If not, the current pointer coordinate will be used.
      * @return {boolean} True when a vertex was removed.
      * @api
      */
-    removePoint() {
-      if (this.lastPointerEvent_ && this.lastPointerEvent_.type != MapBrowserEventType_default.POINTERDRAG) {
+    removePoint(coordinate) {
+      if (coordinate) {
+        coordinate = fromUserCoordinate(
+          coordinate,
+          this.getMap().getView().getProjection()
+        );
+        this.updatePointer_(coordinate);
+      }
+      if (!this.lastPointerEvent_ || this.lastPointerEvent_ && this.lastPointerEvent_.type != MapBrowserEventType_default.POINTERDRAG) {
         const evt = this.lastPointerEvent_;
-        this.willModifyFeatures_(evt, this.dragSegments_);
+        this.willModifyFeatures_(
+          evt,
+          this.dragSegments_.map(([segment]) => segment)
+        );
         const removed = this.removeVertex_();
         if (this.featuresBeingModified_) {
           this.dispatchEvent(
@@ -44160,6 +44232,45 @@ uniform ${i3} ${a3} u_${s3};
       }
       return deleted;
     }
+    /**
+     * Check if a point can be inserted to the current linestring or polygon at the current
+     * pointer position.
+     * @return {boolean} A point can be inserted at the current pointer position.
+     * @api
+     */
+    canInsertPoint() {
+      if (!this.vertexFeature_) {
+        return false;
+      }
+      if (this.vertexFeature_.get("geometries").every(
+        (geometry) => geometry.getType() === "Circle" || geometry.getType().endsWith("Point")
+      )) {
+        return false;
+      }
+      const coordinate = this.vertexFeature_.getGeometry().getCoordinates();
+      const segments = this.rBush_.getInExtent(boundingExtent([coordinate]));
+      return segments.some(
+        ({ segment }) => !(equals3(segment[0], coordinate) || equals3(segment[1], coordinate))
+      );
+    }
+    /**
+     * Inserts the vertex currently being pointed to the current linestring or polygon.
+     * @param {import('../coordinate.js').Coordinate} [coordinate] If provided, the pointer
+     * will be set to the provided coordinate. If not, the current pointer coordinate will be used.
+     * @return {boolean} A vertex was inserted.
+     * @api
+     */
+    insertPoint(coordinate) {
+      const pixelCoordinate = coordinate ? fromUserCoordinate(coordinate, this.getMap().getView().getProjection()) : this.vertexFeature_?.getGeometry().getCoordinates();
+      if (!pixelCoordinate) {
+        return false;
+      }
+      const insertVertices = this.findInsertVerticesAndUpdateDragSegments_(pixelCoordinate);
+      return insertVertices.reduce(
+        (prev, segmentData) => prev || this.insertVertex_(segmentData, pixelCoordinate),
+        false
+      );
+    }
     /**
      * @param {import("../geom/SimpleGeometry.js").default} geometry Geometry.
      * @param {Array} coordinates Coordinates.
@@ -44435,7 +44546,7 @@ uniform ${i3} ${a3} u_${s3};
      */
     createModifyInteraction() {
       this.modifyInteraction = new Modify_default({
-        // hitDetection: this.routingLayer, // Create a bug, the first point is always selected even if the mous eis far away
+        // hitDetection: this.routingLayer, // TODO: wait for ol, fixed in https://github.com/openlayers/openlayers/pull/16393
         deleteCondition: (e) => {
           const feats = e.target?.getFeaturesAtPixel(e.pixel, {
             hitTolerance: 5
@@ -44475,7 +44586,7 @@ uniform ${i3} ${a3} u_${s3};
      */
     drawRoute() {
       this.abortRequests();
-      this.routingLayer?.getSource()?.clear(true);
+      this.routingLayer?.getSource()?.clear();
       if (!this.viaPoints.length) {
         return null;
       }
@@ -45209,7 +45320,7 @@ uniform ${i3} ${a3} u_${s3};
   // src/ol/layers/MaplibreLayer.ts
   var import_lodash2 = __toESM(require_lodash());
 
-  // src/ol/mixins/PropertiesLayerMixin.ts
+  // src/ol/utils/defineDeprecatedProperties.ts
   var import_lodash = __toESM(require_lodash());
   var deprecated = () => {
   };
@@ -45218,213 +45329,207 @@ uniform ${i3} ${a3} u_${s3};
       console.warn(message);
     }, 1e3);
   }
-  function PropertiesLayerMixin(Base) {
-    return class PropertiesLayer extends Base {
-      constructor(...args) {
-        const options = args[0];
-        super(options);
-        this.olEventsKeys = [];
-        this.options = {};
-        if (options.properties) {
-          deprecated(
-            "Deprecated. Don't use properties options. Pass the values directly in options object."
-          );
-          this.setProperties(options.properties);
-        }
-        this.on("propertychange", (evt) => {
-          if (evt.key === "children") {
-            this.onChildrenChange(evt.oldValue);
-          }
-        });
-        this.options = options;
-        this.set("children", options.children || []);
-      }
-      /**
-       * Initialize the layer with the map passed in parameters.
-       *
-       * @param {ol/Map~Map} map A map.
-       */
-      attachToMap(map) {
-        (super.attachToMap || (() => {
-        }))(map);
-        (this.get("children") || []).forEach((child) => {
-          map.addLayer(child);
-        });
-      }
-      /**
-       * Terminate what was initialized in init function. Remove layer, events...
-       */
-      detachFromMap() {
-        unByKey(this.olEventsKeys);
-        (this.get("children") || []).forEach((child) => {
-          this.map.removeLayer(child);
-        });
-        (super.detachFromMap || (() => {
-        }))();
-      }
-      /**
-       * Return the an array containing all the descendants of the layer in a flat array. Including the current layer.
-       * @deprecated
-       */
-      flat() {
-        deprecated(
-          "Layer.flat is deprecated. Use getLayersAsFlatArray utils method instead."
-        );
-        return getLayersAsFlatArray_default(this);
-      }
-      onChildrenChange(oldValue) {
-        (oldValue || []).forEach((child) => {
-          child.set("parent", void 0);
-        });
-        (this.get("children") || []).forEach((child) => {
-          child.set("parent", this);
-        });
+  var onChildrenChange = (layer, oldValue) => {
+    (oldValue || []).forEach((child) => {
+      child.set("parent", void 0);
+    });
+    (layer.get("children") || []).forEach((child) => {
+      child.set("parent", void 0);
+    });
+  };
+  var defineDeprecatedProperties = (obj, options) => {
+    if (options.properties) {
+      deprecated(
+        "Deprecated. Don't use properties options. Pass the values directly in options object."
+      );
+      obj.setProperties(options.properties);
+    }
+    obj.on("propertychange", (evt) => {
+      if (evt.key === "children") {
+        onChildrenChange(evt.target, evt.oldValue);
       }
-      // @ts-expect-error  - this is a mixin
-      setMapInternal(map) {
+      if (evt.key === "map") {
+        const map = evt.target.get(evt.key);
         if (map) {
-          super.setMapInternal(map);
-          this.attachToMap(map);
-        } else {
-          this.detachFromMap();
-          super.setMapInternal(map);
+          (evt.target.get("children") || []).forEach((child) => {
+            map.addLayer(child);
+          });
+        } else if (evt.oldValue) {
+          (evt.target.get("children") || []).forEach((child) => {
+            evt.oldValue.removeLayer(child);
+          });
         }
       }
-      /** @deprecated */
-      get children() {
-        deprecated(
-          "Layer.children is deprecated. Use the Layer.get('children') method instead."
-        );
-        return this.get("children") || [];
-      }
-      /** @deprecated */
-      set children(newValue) {
-        deprecated(
-          "Layer.children is deprecated. Use the Layer.set('children', children) method instead."
-        );
-        this.set("children", newValue || []);
-      }
-      /** @deprecated */
-      get copyrights() {
-        deprecated(
-          "Layer.copyrights is deprecated. Get the attributions from the source object"
-        );
-        return this.get("copyrights");
-      }
-      /** @deprecated */
-      set copyrights(newCopyrights) {
-        deprecated(
-          "Layer.copyrights is deprecated. Set the attributions to the source object."
-        );
-        const arrValue = newCopyrights && !Array.isArray(newCopyrights) ? [newCopyrights] : newCopyrights;
-        this.set("copyrights", arrValue || []);
-      }
-      /** @deprecated */
-      get disabled() {
-        deprecated(
-          "Layer.disabled is deprecated. Use the Layer.get('disabled') method instead."
-        );
-        return this.get("disabled");
-      }
-      /** @deprecated */
-      set disabled(newValue) {
-        deprecated(
-          "Layer.disabled is deprecated. Use the Layer.set('disabled', newValue) method instead."
-        );
-        this.set("disabled", newValue);
-      }
-      /** @deprecated */
-      get group() {
-        deprecated(
-          "Layer.group is deprecated. Use the Layer.get('group') method instead."
-        );
-        return this.get("group");
-      }
-      /** @deprecated */
-      get hitTolerance() {
-        deprecated(
-          "Layer.hitTolerance is deprecated.Pass the hitTolerance when you request the features."
-        );
-        return this.get("hitTolerance") || 5;
-      }
-      /** @deprecated */
-      set hitTolerance(newValue) {
-        deprecated(
-          "Layer.hitTolerance is deprecated.Pass the hitTolerance when you request the features."
-        );
-        this.set("hitTolerance", newValue);
-      }
-      get key() {
-        return this.get("key") || this.get("name");
-      }
-      get map() {
-        return this.getMapInternal();
-      }
-      /** @deprecated */
-      get name() {
-        deprecated(
-          "Layer.name is deprecated. Use the Layer.get('name') method instead."
-        );
-        return this.get("name");
-      }
-      /** @deprecated */
-      get olLayer() {
-        deprecated(
-          "Layer.olLayer is deprecated. mobility-toolbox-js/ol layers inherits now from ol/layer/Layer class. This getter is only a redirect to the current 'this' object."
-        );
-        return this;
-      }
-      // eslint-disable-next-line class-methods-use-this
-      set olLayer(newValue) {
-        deprecated(
-          "Layer.olLayer is deprecated. mobility-toolbox-js/ol layers inherits now from ol/layer/Layer class. This setter has no effect."
-        );
-      }
-      /** @deprecated */
-      // get olListenersKeys(): EventsKey[] {
-      //   return this.olEventsKeys;
-      // }
-      /** @deprecated */
-      get parent() {
-        deprecated(
-          "Layer.parent is deprecated. Use the Layer.get('parent') method instead."
-        );
-        return this.get("parent");
-      }
-      /** @deprecated */
-      set parent(newValue) {
-        deprecated(
-          "Layer.parent is deprecated. Use the Layer.set('parent', parent) method instead."
-        );
-        this.set("parent", newValue);
-      }
-      /** @deprecated */
-      get visible() {
-        deprecated(
-          "Layer.visible is deprecated. Use the Layer.getVisible() method instead."
-        );
-        return this.getVisible();
-      }
-      /** @deprecated */
-      set visible(newValue) {
-        deprecated(
-          "Layer.visible is deprecated. Use the Layer.setVisible(newValue) method instead."
-        );
-        this.setVisible(newValue);
+    });
+    obj.set("options", options);
+    obj.set("children", options.children || []);
+    Object.defineProperties(obj, {
+      children: {
+        /** @deprecated */
+        get: () => {
+          deprecated(
+            "Layer.children is deprecated. Use the Layer.get('children') method instead."
+          );
+          return obj.get("children") || [];
+        },
+        /** @deprecated */
+        set: (newValue) => {
+          deprecated(
+            "Layer.children is deprecated. Use the Layer.set('children', children) method instead."
+          );
+          obj.set("children", newValue || []);
+        }
+      },
+      copyrights: {
+        /** @deprecated */
+        get: () => {
+          deprecated(
+            "Layer.copyrights is deprecated. Get the attributions from the source object"
+          );
+          return obj.get("copyrights");
+        },
+        /** @deprecated */
+        set: (newCopyrights) => {
+          deprecated(
+            "Layer.copyrights is deprecated. Set the attributions to the source object."
+          );
+          const arrValue = newCopyrights && !Array.isArray(newCopyrights) ? [newCopyrights] : newCopyrights;
+          obj.set("copyrights", arrValue || []);
+        }
+      },
+      disabled: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.disabled is deprecated. Use the Layer.get('disabled') method instead."
+          );
+          return obj.get("disabled");
+        },
+        /** @deprecated */
+        set(newValue) {
+          deprecated(
+            "Layer.disabled is deprecated. Use the Layer.set('disabled', newValue) method instead."
+          );
+          obj.set("disabled", newValue);
+        }
+      },
+      group: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.group is deprecated. Use the Layer.get('group') method instead."
+          );
+          return obj.get("group");
+        }
+      },
+      hitTolerance: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.hitTolerance is deprecated. Pass the hitTolerance when you request the features."
+          );
+          return obj.get("hitTolerance") || 5;
+        },
+        /** @deprecated */
+        set(newValue) {
+          deprecated(
+            "Layer.hitTolerance is deprecated. Pass the hitTolerance when you request the features."
+          );
+          obj.set("hitTolerance", newValue);
+        }
+      },
+      key: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            'Layer.key is deprecated. Use the Layer.get("key") method instead.'
+          );
+          return obj.get("key") || obj.get("name");
+        }
+      },
+      map: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            'Layer.map is deprecated. Use the Layer.get("map") method instead.'
+          );
+          return obj.getMapInternal();
+        }
+      },
+      name: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.name is deprecated. Use the Layer.get('name') method instead."
+          );
+          return obj.get("name");
+        }
+      },
+      olLayer: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.olLayer is deprecated. mobility-toolbox-js/ol layers inherits now from ol/layer/Layer class. obj getter is only a redirect to the current 'this' object."
+          );
+          return obj;
+        },
+        /** @deprecated */
+        set() {
+          deprecated(
+            "Layer.olLayer is deprecated. mobility-toolbox-js/ol layers inherits now from ol/layer/Layer class. obj setter has no effect."
+          );
+        }
+      },
+      options: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            'Layer.options is deprecated. Use the Layer.get("options") method instead.'
+          );
+          return obj.get("options");
+        },
+        set(newValue) {
+          deprecated(
+            'Layer.options is deprecated.  Use the Layer.set("options", newValue) method instead.'
+          );
+          return obj.set("options", newValue);
+        }
+      },
+      parent: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.parent is deprecated. Use the Layer.get('parent') method instead."
+          );
+          return obj.get("parent");
+        },
+        /** @deprecated */
+        set(newValue) {
+          deprecated(
+            "Layer.parent is deprecated. Use the Layer.set('parent', parent) method instead."
+          );
+          obj.set("parent", newValue);
+        }
+      },
+      visible: {
+        /** @deprecated */
+        get() {
+          deprecated(
+            "Layer.visible is deprecated. Use the Layer.getVisible() method instead."
+          );
+          return obj.getVisible();
+        },
+        /** @deprecated */
+        set(newValue) {
+          deprecated(
+            "Layer.visible is deprecated. Use the Layer.setVisible(newValue) method instead."
+          );
+          obj.setVisible(newValue);
+        }
       }
-    };
-  }
-  var PropertiesLayerMixin_default = PropertiesLayerMixin;
-
-  // src/ol/mixins/MobilityLayerMixin.ts
-  function MobilityLayerMixin(Base) {
-    return class MobilityLayer extends PropertiesLayerMixin_default(Base) {
-      // constructor(options: MobilityLayerOptions = {}) {
-      //   super(options);
-      // }
-    };
-  }
-  var MobilityLayerMixin_default = MobilityLayerMixin;
+    });
+  };
+  var defineDeprecatedProperties_default = defineDeprecatedProperties;
 
   // src/ol/layers/MaplibreLayer.ts
   var buildStyleUrl = (url, style, apiKey, apiKeyName) => {
@@ -45439,7 +45544,7 @@ uniform ${i3} ${a3} u_${s3};
       console.warn(message);
     }, 1e3);
   }
-  var MaplibreLayer = class _MaplibreLayer extends MobilityLayerMixin_default(MapLibreLayer) {
+  var MaplibreLayer = class _MaplibreLayer extends MapLibreLayer {
     /**
      * Constructor.
      *
@@ -45471,13 +45576,14 @@ uniform ${i3} ${a3} u_${s3};
         );
       }
       super(newOptions);
+      this.olEventsKeys = [];
+      defineDeprecatedProperties_default(this, options);
+      this.set("options", options);
     }
     /**
      * Initialize the layer and listen to feature clicks.
-     * @param {ol/Map~Map} map An OpenLayers map.
      */
-    attachToMap(map) {
-      super.attachToMap(map);
+    attachToMap() {
       const updateMaplibreMapDebounced = (0, import_lodash2.default)(
         this.updateMaplibreMap.bind(this),
         150
@@ -45491,14 +45597,6 @@ uniform ${i3} ${a3} u_${s3};
         })
       );
     }
-    // get queryRenderedFeaturesOptions(): maplibregl.QueryRenderedFeaturesOptions {
-    //   return this.get('queryRenderedFeaturesOptions');
-    // }
-    // set queryRenderedFeaturesOptions(
-    //   newValue: maplibregl.QueryRenderedFeaturesOptions,
-    // ) {
-    //   this.set('queryRenderedFeaturesOptions', newValue);
-    // }
     /**
      * Create a copy of the MaplibreLayer.
      *
@@ -45508,10 +45606,13 @@ uniform ${i3} ${a3} u_${s3};
      */
     clone(newOptions) {
       return new _MaplibreLayer({
-        ...this.options || {},
+        ...this.get("options") || {},
         ...newOptions || {}
       });
     }
+    detachFromMap() {
+      unByKey(this.olEventsKeys);
+    }
     getStyle() {
       if (this.style && typeof this.style === "object" && this.style.name && this.style.version) {
         return this.style;
@@ -45519,11 +45620,28 @@ uniform ${i3} ${a3} u_${s3};
       if (this.url.includes("style.json")) {
         return this.url;
       }
-      if (this.get("mapLibreOptions")?.style) {
-        return this.get("mapLibreOptions").style;
+      if (this.get("options")?.mapLibreOptions?.style) {
+        return this.get("options").mapLibreOptions.style;
       }
       return buildStyleUrl(this.url, this.style, this.apiKey, this.apiKeyName);
     }
+    // get queryRenderedFeaturesOptions(): maplibregl.QueryRenderedFeaturesOptions {
+    //   return this.get('queryRenderedFeaturesOptions');
+    // }
+    // set queryRenderedFeaturesOptions(
+    //   newValue: maplibregl.QueryRenderedFeaturesOptions,
+    // ) {
+    //   this.set('queryRenderedFeaturesOptions', newValue);
+    // }
+    setMapInternal(map) {
+      if (map) {
+        super.setMapInternal(map);
+        this.attachToMap();
+      } else {
+        this.detachFromMap();
+        super.setMapInternal(map);
+      }
+    }
     updateMaplibreMap() {
       try {
         this.mapLibreMap?.setStyle(this.getStyle(), { diff: false });
@@ -45665,7 +45783,7 @@ uniform ${i3} ${a3} u_${s3};
       console.warn(...messages);
     }, 1e3);
   }
-  var MaplibreStyleLayer = class _MaplibreStyleLayer extends MobilityLayerMixin_default(Layer_default) {
+  var MaplibreStyleLayer = class _MaplibreStyleLayer extends Layer_default {
     /**
      * Constructor.
      *
@@ -45704,7 +45822,10 @@ uniform ${i3} ${a3} u_${s3};
       }
       super({ source: new Source_default({}), ...options });
       this.highlightedFeatures = [];
+      this.olEventsKeys = [];
       this.selectedFeatures = [];
+      defineDeprecatedProperties_default(this, options);
+      this.set("options", options);
       this.beforeId = options.beforeId;
       this.onLoad = this.onLoad.bind(this);
       if (!this.layersFilter && this.layers) {
@@ -45774,16 +45895,16 @@ uniform ${i3} ${a3} u_${s3};
      * @override
      */
     attachToMap(map) {
-      if (this.maplibreLayer && !this.maplibreLayer.map) {
+      if (this.maplibreLayer && !this.maplibreLayer.getMapInternal()) {
         map.addLayer(this.maplibreLayer);
       }
-      super.attachToMap(map);
-      if (!this.map || !this.maplibreLayer) {
+      const mapInternal = this.getMapInternal();
+      if (!mapInternal || !this.maplibreLayer) {
         return;
       }
-      if (!this.map.getTargetElement()) {
+      if (!mapInternal.getTargetElement()) {
         this.olEventsKeys.push(
-          this.map.on("change:target", () => {
+          mapInternal.on("change:target", () => {
             this.attachToMap(map);
           })
         );
@@ -45829,7 +45950,7 @@ uniform ${i3} ${a3} u_${s3};
      * @public
      */
     clone(newOptions) {
-      return new _MaplibreStyleLayer({ ...this.options, ...newOptions });
+      return new _MaplibreStyleLayer({ ...this.get("options"), ...newOptions });
     }
     createRenderer() {
       return new MaplibreStyleLayerRenderer(this);
@@ -45839,12 +45960,12 @@ uniform ${i3} ${a3} u_${s3};
      * @override
      */
     detachFromMap() {
+      unByKey(this.olEventsKeys);
       if (this.maplibreLayer?.mapLibreMap) {
         this.maplibreLayer.mapLibreMap.off("load", this.onLoad);
         this.removeLayers();
         this.removeSources();
       }
-      super.detachFromMap();
     }
     /**
      * Request feature information for a given coordinate.
@@ -45995,6 +46116,15 @@ uniform ${i3} ${a3} u_${s3};
       );
       this.setFeatureState(features, { hover: state });
     }
+    setMapInternal(map) {
+      if (map) {
+        super.setMapInternal(map);
+        this.attachToMap(map);
+      } else {
+        this.detachFromMap();
+        super.setMapInternal(map);
+      }
+    }
     get beforeId() {
       return this.get("beforeId");
     }
@@ -46871,17 +47001,24 @@ uniform ${i3} ${a3} u_${s3};
     if (minResolution && maxResolution && !inRange) {
       return [];
     }
+    const zIndex = feature2?.getGeometry()?.getType() === "Point" ? 100 : 0;
+    let styles = [blackBorder, redLine];
     const mot = feature2.get("mot");
-    if (mot !== "foot") {
-      return [blackBorder, redLine];
+    if (mot === "foot") {
+      styles = [dashedRedLine];
     }
-    return [dashedRedLine];
+    styles = styles.map((style) => {
+      const tmp = style.clone();
+      tmp.setZIndex(zIndex);
+      return tmp;
+    });
+    return styles;
   };
   var routingStyle_default = routingStyle;
 
   // src/ol/layers/RealtimeLayer.ts
   var format2 = new GeoJSON_default();
-  var RealtimeLayer = class _RealtimeLayer extends MobilityLayerMixin_default(Layer_default) {
+  var RealtimeLayer = class _RealtimeLayer extends Layer_default {
     /**
      * Constructor.
      *
@@ -46899,6 +47036,8 @@ uniform ${i3} ${a3} u_${s3};
       });
       this.allowRenderWhenAnimating = false;
       this.maxNbFeaturesRequested = 100;
+      this.olEventsKeys = [];
+      defineDeprecatedProperties_default(this, options);
       this.engine = new RealtimeEngine_default({
         getViewState: this.getViewState.bind(this),
         onRender: this.onRealtimeEngineRender.bind(this),
@@ -46920,17 +47059,17 @@ uniform ${i3} ${a3} u_${s3};
       this.onZoomEndDebounced = (0, import_lodash6.default)(this.onZoomEnd, 100);
       this.onMoveEndDebounced = (0, import_lodash6.default)(this.onMoveEnd, 100);
     }
-    attachToMap(map) {
-      super.attachToMap(map);
+    attachToMap() {
       this.engine.attachToMap();
-      if (this.map) {
+      const mapInternal = this.getMapInternal();
+      if (mapInternal) {
         if (this.getVisible()) {
           this.engine.start();
         }
-        const index = this.map.getLayers().getArray().indexOf(this);
-        this.map.getLayers().insertAt(index, this.vectorLayer);
+        const index = mapInternal.getLayers().getArray().indexOf(this);
+        mapInternal.getLayers().insertAt(index, this.vectorLayer);
         this.olEventsKeys.push(
-          ...this.map.on(
+          ...mapInternal.on(
             ["moveend", "change:target"],
             // @ts-expect-error  - bad ol definitions
             (evt) => {
@@ -46971,7 +47110,7 @@ uniform ${i3} ${a3} u_${s3};
      * @public
      */
     clone(newOptions) {
-      return new _RealtimeLayer({ ...this.options, ...newOptions });
+      return new _RealtimeLayer({ ...this.get("options"), ...newOptions });
     }
     createRenderer() {
       return new RealtimeLayerRenderer(this);
@@ -46980,9 +47119,9 @@ uniform ${i3} ${a3} u_${s3};
      * Destroy the container of the tracker.
      */
     detachFromMap() {
-      this.map?.removeLayer(this.vectorLayer);
+      unByKey(this.olEventsKeys);
+      this.getMapInternal()?.removeLayer(this.vectorLayer);
       this.engine.detachFromMap();
-      super.detachFromMap();
     }
     /**
      * Get some informations about a trajectory.
@@ -46997,7 +47136,7 @@ uniform ${i3} ${a3} u_${s3};
           id,
           this.engine.mode,
           this.engine.getGeneralizationLevelByZoom(
-            Math.floor(this.map?.getView()?.getZoom() || 0)
+            Math.floor(this.getMapInternal()?.getView()?.getZoom() || 0)
           )
         )
       ];
@@ -47013,17 +47152,18 @@ uniform ${i3} ${a3} u_${s3};
       return this.engine.getVehicles(filterFunc);
     }
     getViewState() {
-      if (!this.map?.getView()) {
+      const mapInternal = this.getMapInternal();
+      if (!mapInternal?.getView()) {
         return {};
       }
-      const view = this.map.getView();
+      const view = mapInternal.getView();
       return {
         center: view.getCenter(),
         extent: view.calculateExtent(),
         pixelRatio: this.engine.pixelRatio,
         resolution: view.getResolution(),
         rotation: view.getRotation(),
-        size: this.map.getSize(),
+        size: mapInternal.getSize(),
         visible: this.getVisible(),
         zoom: view.getZoom()
       };
@@ -47047,7 +47187,7 @@ uniform ${i3} ${a3} u_${s3};
         id,
         this.engine.mode,
         this.engine.getGeneralizationLevelByZoom(
-          Math.floor(this.map?.getView()?.getZoom() || 0)
+          Math.floor(this.getMapInternal()?.getView()?.getZoom() || 0)
         )
       ).then((data) => {
         const fullTrajectory = data.content;
@@ -47098,8 +47238,17 @@ uniform ${i3} ${a3} u_${s3};
       }
       this.highlightTrajectory(id);
     }
+    setMapInternal(map) {
+      if (map) {
+        super.setMapInternal(map);
+        this.attachToMap();
+      } else {
+        this.detachFromMap();
+        super.setMapInternal(map);
+      }
+    }
     shouldRender() {
-      return this.allowRenderWhenAnimating ? false : this.map.getView().getAnimating() || this.map.getView().getInteracting();
+      return this.allowRenderWhenAnimating ? false : this.getMapInternal()?.getView().getAnimating() || this.getMapInternal()?.getView().getInteracting();
     }
     /**
      * Start the rendering.
@@ -47182,14 +47331,15 @@ uniform ${i3} ${a3} u_${s3};
       return null;
     }
   };
-  var Layer2 = class _Layer extends MobilityLayerMixin_default(Layer_default) {
+  var Layer2 = class _Layer extends Layer_default {
     constructor(options) {
       super(options);
+      defineDeprecatedProperties_default(this, options);
       deprecated4("Layer is deprecated. Use an OpenLayers Layer instead.");
     }
     clone(newOptions) {
       return new _Layer({
-        ...this.options || {},
+        ...this.get("options") || {},
         ...newOptions || {}
       });
     }
@@ -47206,18 +47356,19 @@ uniform ${i3} ${a3} u_${s3};
      * @deprecated
      */
     clone(newOptions) {
-      return new _VectorLayer({ ...this.options, ...newOptions });
+      return new _VectorLayer({ ...this.get("options"), ...newOptions });
     }
     /**
      * @deprecated
      */
     getFeatureInfoAtCoordinate(coordinate) {
       let features = [];
-      if (this.map) {
-        const pixel = this.map.getPixelFromCoordinate(coordinate);
-        features = this.map.getFeaturesAtPixel(pixel, {
-          hitTolerance: this.hitTolerance || 5,
-          layerFilter: (l) => l === this.olLayer
+      const mapInternal = this.getMapInternal();
+      if (mapInternal) {
+        const pixel = mapInternal.getPixelFromCoordinate(coordinate);
+        features = mapInternal.getFeaturesAtPixel(pixel, {
+          hitTolerance: this.get("hitTolerance") || 5,
+          layerFilter: (l) => l === this
         }) || [];
       }
       return Promise.resolve({