@mapcomponents/react-maplibre 0.1.57 → 0.1.59

package/coverage/lcov-report/src/components/MlImageMarkerLayer/MlImageMarkerLayer.tsx.html

@@ -417,171 +417,171 @@ import { GeoJSONSource } from "maplibre-gl";
 import useMap, { useMapType } from "../../hooks/useMap";
  
 interface MlImageMarkerLayerProps {
-  /**
-   * Id of the target MapLibre instance in mapContext
-   */
-  mapId?: string;
-  /**
-   * The layerId of an existing layer this layer should be rendered visually beneath
-   * https://maplibre.org/maplibre-gl-js-docs/api/map/#map#addlayer - see "beforeId" property
-   */
-  insertBeforeLayer?: string;
-  /**
-   * Id of the layer that will be added by this component to the maplibre-gl instance
-   */
-  layerId?: string;
-  /**
-   * Id of the image that will be added by this component to the maplibre-gl instance
-   */
-  imageId?: string;
-  /**
-   * Path or URL to a supported raster image
-   */
-  imgSrc?: string;
-  /**
-   * Javascript object that is passed the addLayer command as first parameter.
-   */
-  options?: any;
+	/**
+	 * Id of the target MapLibre instance in mapContext
+	 */
+	mapId?: string;
+	/**
+	 * The layerId of an existing layer this layer should be rendered visually beneath
+	 * https://maplibre.org/maplibre-gl-js-docs/api/map/#map#addlayer - see "beforeId" property
+	 */
+	insertBeforeLayer?: string;
+	/**
+	 * Id of the layer that will be added by this component to the maplibre-gl instance
+	 */
+	layerId?: string;
+	/**
+	 * Id of the image that will be added by this component to the maplibre-gl instance
+	 */
+	imageId?: string;
+	/**
+	 * Path or URL to a supported raster image
+	 */
+	imgSrc?: string;
+	/**
+	 * Javascript object that is passed the addLayer command as first parameter.
+	 */
+	options?: any;
 }
  
 const MlImageMarkerLayer = (props: MlImageMarkerLayerProps) => {
-  const mapHook = useMap({
-    mapId: props.mapId,
-    waitForLayer: props.insertBeforeLayer,
-  });
+	const mapHook = useMap({
+		mapId: props.mapId,
+		waitForLayer: props.insertBeforeLayer,
+	});
  
-  const initializedRef = useRef(false);
-  const recreationInProgress = useRef(false);
-  const imageIdRef = useRef(props.imageId || "img_" + new Date().getTime());
-  const layerId = useRef(props.layerId || "MlImageMarkerLayer-" + mapHook.componentId);
+	const initializedRef = useRef(false);
+	const recreationInProgress = useRef(false);
+	const imageIdRef = useRef(props.imageId || "img_" + new Date().getTime());
+	const layerId = useRef(props.layerId || "MlImageMarkerLayer-" + mapHook.componentId);
  
-  // effect to sync Layer paint & layout properties
-  useEffect(() => {
-    <span class="missing-if-branch" title="else path not taken" >E</span>if (
-      !mapHook.map ||
-      (<span class="branch-1 cbranch-no" title="branch not covered" >mapHook.map </span>&amp;&amp; <span class="branch-2 cbranch-no" title="branch not covered" >!mapHook.map.map.getLayer(layerId.current))</span> ||
-<span class="branch-3 cbranch-no" title="branch not covered" >      !props.options</span>
-    )
-      return;
+	// effect to sync Layer paint &amp; layout properties
+	useEffect(() =&gt; {
+		<span class="missing-if-branch" title="else path not taken" >E</span>if (
+			!mapHook.map ||
+			(<span class="branch-1 cbranch-no" title="branch not covered" >mapHook.map </span>&amp;&amp; <span class="branch-2 cbranch-no" title="branch not covered" >!mapHook.map.map.getLayer(layerId.current))</span> ||
+<span class="branch-3 cbranch-no" title="branch not covered" >			!props.options</span>
+		)
+			return;
 &nbsp;
-    var key;
+		var key;
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    if (props.options.layout) {</span>
-<span class="cstat-no" title="statement not covered" >      for (key in props.options.layout) {</span>
-<span class="cstat-no" title="statement not covered" >        mapHook.map.map.setLayoutProperty(layerId.current, key, props.options.layout[key]);</span>
-      }
-    }
-<span class="cstat-no" title="statement not covered" >    if (props.options.paint) {</span>
-<span class="cstat-no" title="statement not covered" >      for (key in props.options.paint) {</span>
-<span class="cstat-no" title="statement not covered" >        mapHook.map.map.setPaintProperty(layerId.current, key, props.options.paint[key]);</span>
-      }
-    }
-  }, [props.options, layerId.current, props.mapId]);
+<span class="cstat-no" title="statement not covered" >		if (props.options.layout) {</span>
+<span class="cstat-no" title="statement not covered" >			for (key in props.options.layout) {</span>
+<span class="cstat-no" title="statement not covered" >				mapHook.map.map.setLayoutProperty(layerId.current, key, props.options.layout[key]);</span>
+			}
+		}
+<span class="cstat-no" title="statement not covered" >		if (props.options.paint) {</span>
+<span class="cstat-no" title="statement not covered" >			for (key in props.options.paint) {</span>
+<span class="cstat-no" title="statement not covered" >				mapHook.map.map.setPaintProperty(layerId.current, key, props.options.paint[key]);</span>
+			}
+		}
+	}, [props.options, layerId.current, props.mapId]);
 &nbsp;
-  const createImage = <span class="fstat-no" title="function not covered" >(m</span>apHook: useMapType, props: MlImageMarkerLayerProps, callback: Function) =&gt; {
-<span class="cstat-no" title="statement not covered" >    if (!mapHook.map) {</span>
-<span class="cstat-no" title="statement not covered" >      initializedRef.current = false;</span>
+	const createImage = <span class="fstat-no" title="function not covered" >(m</span>apHook: useMapType, props: MlImageMarkerLayerProps, callback: Function) =&gt; {
+<span class="cstat-no" title="statement not covered" >		if (!mapHook.map) {</span>
+<span class="cstat-no" title="statement not covered" >			initializedRef.current = false;</span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >      return;</span>
-    }
+<span class="cstat-no" title="statement not covered" >			return;</span>
+		}
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    if (props.imgSrc &amp;&amp; !mapHook.map.map.hasImage(imageIdRef.current)) {</span>
-<span class="cstat-no" title="statement not covered" >      mapHook.map.map.loadImage(props.imgSrc, <span class="fstat-no" title="function not covered" >fu</span>nction (error, image) {</span>
-<span class="cstat-no" title="statement not covered" >        if (error) <span class="cstat-no" title="statement not covered" >throw error;</span></span>
+<span class="cstat-no" title="statement not covered" >		if (props.imgSrc &amp;&amp; !mapHook.map.map.hasImage(imageIdRef.current)) {</span>
+<span class="cstat-no" title="statement not covered" >			mapHook.map.map.loadImage(props.imgSrc, <span class="fstat-no" title="function not covered" >fu</span>nction (error, image) {</span>
+<span class="cstat-no" title="statement not covered" >				if (error) <span class="cstat-no" title="statement not covered" >throw error;</span></span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >        if (!mapHook.map || mapHook.map.map.hasImage(imageIdRef.current)) <span class="cstat-no" title="statement not covered" >return;</span></span>
+<span class="cstat-no" title="statement not covered" >				if (!mapHook.map || mapHook.map.map.hasImage(imageIdRef.current)) <span class="cstat-no" title="statement not covered" >return;</span></span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >        mapHook.map.addImage(imageIdRef.current, image, mapHook.componentId);</span>
+<span class="cstat-no" title="statement not covered" >				mapHook.map.addImage(imageIdRef.current, image, mapHook.componentId);</span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >        if (typeof callback === "function") {</span>
-<span class="cstat-no" title="statement not covered" >          callback();</span>
-        }
-      });
-    } else {
-<span class="cstat-no" title="statement not covered" >      if (typeof callback === "function") {</span>
-<span class="cstat-no" title="statement not covered" >        callback();</span>
-      }
-    }
-  };
+<span class="cstat-no" title="statement not covered" >				if (typeof callback === "function") {</span>
+<span class="cstat-no" title="statement not covered" >					callback();</span>
+				}
+			});
+		} else {
+<span class="cstat-no" title="statement not covered" >			if (typeof callback === "function") {</span>
+<span class="cstat-no" title="statement not covered" >				callback();</span>
+			}
+		}
+	};
 &nbsp;
-  const createLayer = (
-    mapHook: useMapType,
-    props: MlImageMarkerLayerProps,
-    createMapLibreElements: Function
-  ) =&gt; {
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (!props.options || !mapHook.map || mapHook.map?.map.getLayer(layerId.current)) <span class="cstat-no" title="statement not covered" >return;</span>
+	const createLayer = (
+		mapHook: useMapType,
+		props: MlImageMarkerLayerProps,
+		createMapLibreElements: Function
+	) =&gt; {
+		<span class="missing-if-branch" title="if path not taken" >I</span>if (!props.options || !mapHook.map || mapHook.map?.map.getLayer(layerId.current)) <span class="cstat-no" title="statement not covered" >return;</span>
 &nbsp;
-    let tmpOptions = {
-      id: layerId.current,
-      layout: {},
-      ...props.options,
-    };
-    tmpOptions.layout["icon-image"] = imageIdRef.current;
-    mapHook.map.addLayer(tmpOptions, props.insertBeforeLayer, mapHook.componentId);
+		let tmpOptions = {
+			id: layerId.current,
+			layout: {},
+			...props.options,
+		};
+		tmpOptions.layout["icon-image"] = imageIdRef.current;
+		mapHook.map.addLayer(tmpOptions, props.insertBeforeLayer, mapHook.componentId);
 &nbsp;
-    // recreate layer if map style.json has changed
-    mapHook.map.on(
-      "styledata",
-<span class="fstat-no" title="function not covered" >      ()</span> =&gt; {
-<span class="cstat-no" title="statement not covered" >        if (</span>
-          initializedRef.current &amp;&amp;
-          !mapHook.map?.map.getLayer(layerId.current) &amp;&amp;
-          !recreationInProgress.current
-        ) {
-<span class="cstat-no" title="statement not covered" >          initializedRef.current = false;</span>
-<span class="cstat-no" title="statement not covered" >          recreationInProgress.current = true;</span>
-<span class="cstat-no" title="statement not covered" >          console.log("Recreate Layer " + layerId.current);</span>
-<span class="cstat-no" title="statement not covered" >          createMapLibreElements();</span>
-        }
-      },
-      mapHook.componentId
-    );
+		// recreate layer if map style.json has changed
+		mapHook.map.on(
+			"styledata",
+<span class="fstat-no" title="function not covered" >			()</span> =&gt; {
+<span class="cstat-no" title="statement not covered" >				if (</span>
+					initializedRef.current &amp;&amp;
+					!mapHook.map?.map.getLayer(layerId.current) &amp;&amp;
+					!recreationInProgress.current
+				) {
+<span class="cstat-no" title="statement not covered" >					initializedRef.current = false;</span>
+<span class="cstat-no" title="statement not covered" >					recreationInProgress.current = true;</span>
+<span class="cstat-no" title="statement not covered" >					console.log("Recreate Layer " + layerId.current);</span>
+<span class="cstat-no" title="statement not covered" >					createMapLibreElements();</span>
+				}
+			},
+			mapHook.componentId
+		);
 &nbsp;
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (recreationInProgress.current) {
-<span class="cstat-no" title="statement not covered" >      recreationInProgress.current = false;</span>
-    }
-  };
+		<span class="missing-if-branch" title="if path not taken" >I</span>if (recreationInProgress.current) {
+<span class="cstat-no" title="statement not covered" >			recreationInProgress.current = false;</span>
+		}
+	};
 &nbsp;
-  const createMapLibreElements = useCallback(() =&gt; {
-    if (!mapHook.map || initializedRef.current || mapHook.map?.map.getLayer(layerId.current))
-      return;
+	const createMapLibreElements = useCallback(() =&gt; {
+		if (!mapHook.map || initializedRef.current || mapHook.map?.map.getLayer(layerId.current))
+			return;
 &nbsp;
-    initializedRef.current = true;
+		initializedRef.current = true;
 &nbsp;
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (recreationInProgress.current) {
-<span class="cstat-no" title="statement not covered" >      mapHook.cleanup();</span>
-    }
+		<span class="missing-if-branch" title="if path not taken" >I</span>if (recreationInProgress.current) {
+<span class="cstat-no" title="statement not covered" >			mapHook.cleanup();</span>
+		}
 &nbsp;
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (props.imgSrc) {
-<span class="cstat-no" title="statement not covered" >      createImage(mapHook, props, <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
-<span class="cstat-no" title="statement not covered" >        createLayer(mapHook, props, createMapLibreElements);</span>
-      });
-    } else {
-      createLayer(mapHook, props, createMapLibreElements);
-    }
-  }, [props, mapHook]);
+		<span class="missing-if-branch" title="if path not taken" >I</span>if (props.imgSrc) {
+<span class="cstat-no" title="statement not covered" >			createImage(mapHook, props, <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
+<span class="cstat-no" title="statement not covered" >				createLayer(mapHook, props, createMapLibreElements);</span>
+			});
+		} else {
+			createLayer(mapHook, props, createMapLibreElements);
+		}
+	}, [props, mapHook]);
 &nbsp;
-  useEffect(() =&gt; {
-    <span class="missing-if-branch" title="if path not taken" >I</span>if (initializedRef.current) <span class="cstat-no" title="statement not covered" >return;</span>
+	useEffect(() =&gt; {
+		<span class="missing-if-branch" title="if path not taken" >I</span>if (initializedRef.current) <span class="cstat-no" title="statement not covered" >return;</span>
 &nbsp;
-    createMapLibreElements();
-  }, [createMapLibreElements]);
+		createMapLibreElements();
+	}, [createMapLibreElements]);
 &nbsp;
-  useEffect(() =&gt; {
-    <span class="missing-if-branch" title="else path not taken" >E</span>if (
-      !mapHook.map ||
-      (<span class="branch-1 cbranch-no" title="branch not covered" >mapHook.map </span>&amp;&amp; <span class="branch-2 cbranch-no" title="branch not covered" >!mapHook.map.map.getLayer(layerId.current))</span> ||
-<span class="branch-3 cbranch-no" title="branch not covered" >      !props.options</span>
-    ) {
-      return;
-    }
+	useEffect(() =&gt; {
+		<span class="missing-if-branch" title="else path not taken" >E</span>if (
+			!mapHook.map ||
+			(<span class="branch-1 cbranch-no" title="branch not covered" >mapHook.map </span>&amp;&amp; <span class="branch-2 cbranch-no" title="branch not covered" >!mapHook.map.map.getLayer(layerId.current))</span> ||
+<span class="branch-3 cbranch-no" title="branch not covered" >			!props.options</span>
+		) {
+			return;
+		}
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    (mapHook.map.map.getSource(layerId.current) as GeoJSONSource).setData(</span>
-      props.options.source.data
-    );
-  }, [props.options.source.data, props]);
+<span class="cstat-no" title="statement not covered" >		(mapHook.map.map.getSource(layerId.current) as GeoJSONSource).setData(</span>
+			props.options.source.data
+		);
+	}, [props.options.source.data, props]);
 &nbsp;
-  return &lt;&gt;&lt;/&gt;;
+	return &lt;&gt;&lt;/&gt;;
 };
 &nbsp;
 export default MlImageMarkerLayer;
@@ -592,7 +592,7 @@ export default MlImageMarkerLayer;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Tue Aug 30 2022 13:27:18 GMT+0000 (Coordinated Universal Time)
+                at Tue Oct 04 2022 12:11:13 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlImageMarkerLayer/index.html

@@ -101,7 +101,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Tue Aug 30 2022 13:27:18 GMT+0000 (Coordinated Universal Time)
+                at Tue Oct 04 2022 12:11:13 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayer/MlLayer.tsx.html

@@ -177,27 +177,27 @@ import useLayer from "../../hooks/useLayer";
 import { Feature, FeatureCollection } from "@turf/turf";
  
 interface MlLayerProps {
-  /**
-   * Id of the target MapLibre instance in mapContext
-   */
-  mapId?: string;
-  /**
-   * The layerId of an existing layer this layer should be rendered visually beneath
-   * https://maplibre.org/maplibre-gl-js-docs/api/map/#map#addlayer - see "beforeId" property
-   */
-  insertBeforeLayer?: string;
-  /**
-   * Id of the layer that will be added by this component to the maplibre-gl instance
-   */
-  layerId?: string;
-  /**
-   * Javascript object that is passed the addLayer command as first parameter.
-   */
-  options?: any;
-  /**
-   * GeoJSON data that is supposed to be rendered by this component.
-   */
-  geojson?: Feature | FeatureCollection | undefined;
+	/**
+	 * Id of the target MapLibre instance in mapContext
+	 */
+	mapId?: string;
+	/**
+	 * The layerId of an existing layer this layer should be rendered visually beneath
+	 * https://maplibre.org/maplibre-gl-js-docs/api/map/#map#addlayer - see "beforeId" property
+	 */
+	insertBeforeLayer?: string;
+	/**
+	 * Id of the layer that will be added by this component to the maplibre-gl instance
+	 */
+	layerId?: string;
+	/**
+	 * Javascript object that is passed the addLayer command as first parameter.
+	 */
+	options?: any;
+	/**
+	 * GeoJSON data that is supposed to be rendered by this component.
+	 */
+	geojson?: Feature | FeatureCollection | undefined;
 }
  
 /**
@@ -206,22 +206,22 @@ interface MlLayerProps {
  * @category Map components 
  */
 const MlLayer = (props: MlLayerProps) => {
-  useLayer({
-    idPrefix: 'MlLayer-',
-    layerId: props.layerId,
-    mapId: props.mapId,
-    geojson: props.geojson,
-    options: {
-      type: "background",
-      paint: {
-        "background-color": "rgba(0,0,0,0)",
-      },
-      ...props.options,
-    },
-    insertBeforeLayer: props.insertBeforeLayer,
-  });
+	useLayer({
+		idPrefix: 'MlLayer-',
+		layerId: props.layerId,
+		mapId: props.mapId,
+		geojson: props.geojson,
+		options: {
+			type: "background",
+			paint: {
+				"background-color": "rgba(0,0,0,0)",
+			},
+			...props.options,
+		},
+		insertBeforeLayer: props.insertBeforeLayer,
+	});
  
-  return <></>;
+	return <></>;
 };
  
 export default MlLayer;
@@ -232,7 +232,7 @@ export default MlLayer;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Tue Aug 30 2022 13:27:18 GMT+0000 (Coordinated Universal Time)
+                at Tue Oct 04 2022 12:11:13 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayer/index.html

@@ -101,7 +101,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Tue Aug 30 2022 13:27:18 GMT+0000 (Coordinated Universal Time)
+                at Tue Oct 04 2022 12:11:13 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>