@mapcomponents/react-maplibre 0.1.37 → 0.1.38

package/coverage/lcov-report/src/hooks/useLayer.ts.html

@@ -247,44 +247,7 @@
 <a name='L182'></a><a href='#L182'>182</a>
 <a name='L183'></a><a href='#L183'>183</a>
 <a name='L184'></a><a href='#L184'>184</a>
-<a name='L185'></a><a href='#L185'>185</a>
-<a name='L186'></a><a href='#L186'>186</a>
-<a name='L187'></a><a href='#L187'>187</a>
-<a name='L188'></a><a href='#L188'>188</a>
-<a name='L189'></a><a href='#L189'>189</a>
-<a name='L190'></a><a href='#L190'>190</a>
-<a name='L191'></a><a href='#L191'>191</a>
-<a name='L192'></a><a href='#L192'>192</a>
-<a name='L193'></a><a href='#L193'>193</a>
-<a name='L194'></a><a href='#L194'>194</a>
-<a name='L195'></a><a href='#L195'>195</a>
-<a name='L196'></a><a href='#L196'>196</a>
-<a name='L197'></a><a href='#L197'>197</a>
-<a name='L198'></a><a href='#L198'>198</a>
-<a name='L199'></a><a href='#L199'>199</a>
-<a name='L200'></a><a href='#L200'>200</a>
-<a name='L201'></a><a href='#L201'>201</a>
-<a name='L202'></a><a href='#L202'>202</a>
-<a name='L203'></a><a href='#L203'>203</a>
-<a name='L204'></a><a href='#L204'>204</a>
-<a name='L205'></a><a href='#L205'>205</a>
-<a name='L206'></a><a href='#L206'>206</a>
-<a name='L207'></a><a href='#L207'>207</a>
-<a name='L208'></a><a href='#L208'>208</a>
-<a name='L209'></a><a href='#L209'>209</a>
-<a name='L210'></a><a href='#L210'>210</a>
-<a name='L211'></a><a href='#L211'>211</a>
-<a name='L212'></a><a href='#L212'>212</a>
-<a name='L213'></a><a href='#L213'>213</a>
-<a name='L214'></a><a href='#L214'>214</a>
-<a name='L215'></a><a href='#L215'>215</a>
-<a name='L216'></a><a href='#L216'>216</a>
-<a name='L217'></a><a href='#L217'>217</a>
-<a name='L218'></a><a href='#L218'>218</a>
-<a name='L219'></a><a href='#L219'>219</a>
-<a name='L220'></a><a href='#L220'>220</a>
-<a name='L221'></a><a href='#L221'>221</a>
-<a name='L222'></a><a href='#L222'>222</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L185'></a><a href='#L185'>185</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -313,7 +276,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">5x</span>
+<span class="cline-any cline-yes">12x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -342,7 +305,6 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">60x</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-yes">14x</span>
@@ -374,29 +336,14 @@
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-yes">14x</span>
@@ -427,9 +374,6 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">60x</span>
 <span class="cline-any cline-yes">28x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">16x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -438,10 +382,6 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">60x</span>
 <span class="cline-any cline-yes">60x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">28x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -452,16 +392,9 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -470,16 +403,9 @@
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -560,8 +486,7 @@ function useLayer(props: useLayerProps): useLayerType {
 &nbsp;
   const initializedRef = useRef&lt;boolean&gt;(false);
   const layerId = useRef(
-    props.layerId ||
-      (props.idPrefix ? props.idPrefix : <span class="branch-1 cbranch-no" title="branch not covered" >"Layer-")</span> + mapHook.componentId
+    props.layerId || (props.idPrefix ? props.idPrefix : <span class="branch-1 cbranch-no" title="branch not covered" >"Layer-")</span> + mapHook.componentId
   );
 &nbsp;
   const createLayer = useCallback(() =&gt; {
@@ -592,30 +517,15 @@ function useLayer(props: useLayerProps): useLayerType {
     setLayer(mapHook.map.map.getLayer(layerId.current));
 &nbsp;
     <span class="missing-if-branch" title="if path not taken" >I</span>if (typeof props.onHover !== "undefined") {
-<span class="cstat-no" title="statement not covered" >      mapHook.map.on(</span>
-        "mousemove",
-        layerId.current,
-        props.onHover,
-        mapHook.componentId
-      );
+<span class="cstat-no" title="statement not covered" >      mapHook.map.on("mousemove", layerId.current, props.onHover, mapHook.componentId);</span>
     }
 &nbsp;
     <span class="missing-if-branch" title="if path not taken" >I</span>if (typeof props.onClick !== "undefined") {
-<span class="cstat-no" title="statement not covered" >      mapHook.map.on(</span>
-        "click",
-        layerId.current,
-        props.onClick,
-        mapHook.componentId
-      );
+<span class="cstat-no" title="statement not covered" >      mapHook.map.on("click", layerId.current, props.onClick, mapHook.componentId);</span>
     }
 &nbsp;
     <span class="missing-if-branch" title="if path not taken" >I</span>if (typeof props.onLeave !== "undefined") {
-<span class="cstat-no" title="statement not covered" >      mapHook.map.on(</span>
-        "mouseleave",
-        layerId.current,
-        props.onLeave,
-        mapHook.componentId
-      );
+<span class="cstat-no" title="statement not covered" >      mapHook.map.on("mouseleave", layerId.current, props.onLeave, mapHook.componentId);</span>
     }
 &nbsp;
     layerPaintConfRef.current = JSON.stringify(props.options?.paint);
@@ -647,22 +557,15 @@ function useLayer(props: useLayerProps): useLayerType {
   }, [mapHook.map, props.options, createLayer]);
 &nbsp;
   useEffect(() =&gt; {
-    if (
-      !initializedRef.current ||
-      !mapHook?.map?.map.getSource(layerId.current)
-    )
+    if (!initializedRef.current || !mapHook.map?.map?.getSource(layerId.current))
       return;
 &nbsp;
-    // @ts-ignore
-    mapHook.map.map.getSource(layerId.current).setData(props.geojson);
+      //@ts-ignore setData only exists on GeoJsonSource
+    mapHook.map.map.getSource(layerId.current)?.setData?.(props.geojson);
   }, [props.geojson, mapHook.map, props.options.type]);
 &nbsp;
   useEffect(() =&gt; {
-    if (
-      !mapHook.map ||
-      !mapHook.map?.map?.getLayer?.(layerId.current) ||
-      !initializedRef.current
-    )
+    if (!mapHook.map || !mapHook.map?.map?.getLayer?.(layerId.current) || !initializedRef.current)
       return;
 &nbsp;
     var key;
@@ -672,15 +575,8 @@ function useLayer(props: useLayerProps): useLayerType {
       let oldLayout = <span class="cstat-no" title="statement not covered" >JSON.parse(layerLayoutConfRef.current);</span>
 &nbsp;
 <span class="cstat-no" title="statement not covered" >      for (key in props.options.layout) {</span>
-<span class="cstat-no" title="statement not covered" >        if (</span>
-          props.options.layout?.[key] &amp;&amp;
-          props.options.layout[key] !== oldLayout[key]
-        ) {
-<span class="cstat-no" title="statement not covered" >          mapHook.map.map.setLayoutProperty(</span>
-            layerId.current,
-            key,
-            props.options.layout[key]
-          );
+<span class="cstat-no" title="statement not covered" >        if (props.options.layout?.[key] &amp;&amp; props.options.layout[key] !== oldLayout[key]) {</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" >      layerLayoutConfRef.current = layoutString;</span>
@@ -690,15 +586,8 @@ function useLayer(props: useLayerProps): useLayerType {
     <span class="missing-if-branch" title="if path not taken" >I</span>if (paintString !== layerPaintConfRef.current) {
       let oldPaint = <span class="cstat-no" title="statement not covered" >JSON.parse(layerPaintConfRef.current);</span>
 <span class="cstat-no" title="statement not covered" >      for (key in props.options.paint) {</span>
-<span class="cstat-no" title="statement not covered" >        if (</span>
-          props.options.paint?.[key] &amp;&amp;
-          props.options.paint[key] !== oldPaint[key]
-        ) {
-<span class="cstat-no" title="statement not covered" >          mapHook.map.map.setPaintProperty(</span>
-            layerId.current,
-            key,
-            props.options.paint[key]
-          );
+<span class="cstat-no" title="statement not covered" >        if (props.options.paint?.[key] &amp;&amp; props.options.paint[key] !== oldPaint[key]) {</span>
+<span class="cstat-no" title="statement not covered" >          mapHook.map.map.setPaintProperty(layerId.current, key, props.options.paint[key]);</span>
         }
       }
 <span class="cstat-no" title="statement not covered" >      layerPaintConfRef.current = paintString;</span>
@@ -733,7 +622,7 @@ export default useLayer;
             <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 Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
+                at Thu Apr 21 2022 11:37:11 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/hooks/useMap.ts.html

@@ -151,32 +151,7 @@
 <a name='L86'></a><a href='#L86'>86</a>
 <a name='L87'></a><a href='#L87'>87</a>
 <a name='L88'></a><a href='#L88'>88</a>
-<a name='L89'></a><a href='#L89'>89</a>
-<a name='L90'></a><a href='#L90'>90</a>
-<a name='L91'></a><a href='#L91'>91</a>
-<a name='L92'></a><a href='#L92'>92</a>
-<a name='L93'></a><a href='#L93'>93</a>
-<a name='L94'></a><a href='#L94'>94</a>
-<a name='L95'></a><a href='#L95'>95</a>
-<a name='L96'></a><a href='#L96'>96</a>
-<a name='L97'></a><a href='#L97'>97</a>
-<a name='L98'></a><a href='#L98'>98</a>
-<a name='L99'></a><a href='#L99'>99</a>
-<a name='L100'></a><a href='#L100'>100</a>
-<a name='L101'></a><a href='#L101'>101</a>
-<a name='L102'></a><a href='#L102'>102</a>
-<a name='L103'></a><a href='#L103'>103</a>
-<a name='L104'></a><a href='#L104'>104</a>
-<a name='L105'></a><a href='#L105'>105</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L89'></a><a href='#L89'>89</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -208,7 +183,6 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">169x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">169x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">169x</span>
@@ -249,17 +223,10 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">48x</span>
 <span class="cline-any cline-yes">48x</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">48x</span>
 <span class="cline-any cline-yes">48x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">169x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -271,33 +238,25 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import {
-  useContext,
-  useState,
-  useEffect,
-  useRef,
-  MutableRefObject,
-} from "react";
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { useContext, useState, useEffect, useRef, MutableRefObject } from "react";
 import { v4 as uuidv4 } from "uuid";
-// @ts-ignore
-import { MapContext } from "@mapcomponents/react-core";
+import MapContext from "../contexts/MapContext";
 import useMapState from "./useMapState";
-import MapLibreGlWrapper, {
-  LayerState,
-} from "../components/MapLibreMap/lib/MapLibreGlWrapper";
+import MapLibreGlWrapper, { LayerState } from "../components/MapLibreMap/lib/MapLibreGlWrapper";
 &nbsp;
 type useMapType = {
   map: MapLibreGlWrapper | undefined;
   mapIsReady: boolean;
   componentId: string;
   layers: (LayerState | undefined)[];
-  cleanup: Function
+  cleanup: Function;
 };
 &nbsp;
 function useMap(props: { mapId?: string; waitForLayer?: string }): useMapType {
   // Use a useRef hook to reference the layer object to be able to access it later inside useEffect hooks
   const mapContext: MapContextType = useContext(MapContext);
-  const [map, setMap] = useState();
+  const [map, setMap] = useState&lt;MapLibreGlWrapper&gt;();
 &nbsp;
   const mapState = useMapState({
     mapId: props.mapId,
@@ -312,8 +271,7 @@ function useMap(props: { mapId?: string; waitForLayer?: string }): useMapType {
   });
 &nbsp;
   const initializedRef = useRef(false);
-  const mapRef: MutableRefObject&lt;MapLibreGlWrapper | undefined&gt; =
-    useRef(undefined);
+  const mapRef: MutableRefObject&lt;MapLibreGlWrapper | undefined&gt; = useRef(undefined);
 &nbsp;
   const componentId = useRef(uuidv4());
 &nbsp;
@@ -353,36 +311,30 @@ function useMap(props: { mapId?: string; waitForLayer?: string }): useMapType {
     // initialize the layer and add it to the MapLibre-gl instance or do something else with it
     initializedRef.current = true;
     mapRef.current = mapContext.getMap(props.mapId);
-    // @ts-ignore
     setMap(mapRef.current);
     setMapIsReady(true);
-  }, [
-    mapContext.mapIds,
-    mapState.layers,
-    mapContext,
-    props.waitForLayer,
-    props.mapId,
-  ]);
+  }, [mapContext.mapIds, mapState.layers, mapContext, props.waitForLayer, props.mapId]);
 &nbsp;
   return {
     map: map,
     mapIsReady,
     componentId: componentId.current,
     layers: mapState.layers,
-    cleanup
+    cleanup,
   };
 }
 &nbsp;
 export default useMap;
 &nbsp;
-export type {useMapType};</pre></td></tr></table></pre>
+export type { useMapType };
+&nbsp;</pre></td></tr></table></pre>
 
                 <div class='push'></div><!-- for sticky footer -->
             </div><!-- /wrapper -->
             <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 Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
+                at Thu Apr 21 2022 11:37:11 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/hooks/useMapState.ts.html

@@ -403,7 +403,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">12x</span>
+<span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -415,7 +415,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-yes">12x</span>
+<span class="cline-any cline-yes">14x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -444,8 +444,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { useContext, useCallback, useState, useEffect, useRef } from "react";
 import PropTypes from "prop-types";
 import { v4 as uuidv4 } from "uuid";
-// @ts-ignore
-import { MapContext } from "@mapcomponents/react-core";
+import MapContext from "../contexts/MapContext";
 import MapLibreGlWrapper, {
   LayerState,
   ViewportState,
@@ -462,6 +461,7 @@ type MapContext = {
   getMap: Function;
   setMap: Function;
 };
+&nbsp;
 /**
  * React hook that allows subscribing to map state changes
  *
@@ -481,7 +481,7 @@ function useMapState(props: {
   };
 }): useMapStateType {
   // Use a useRef hook to reference the layer object to be able to access it later inside useEffect hooks
-  const mapContext: MapContext = useContext(MapContext);
+  const mapContext = useContext&lt;MapContextType&gt;(MapContext);
 &nbsp;
   const initializedRef = useRef(false);
   const mapRef = useRef&lt;MapLibreGlWrapper&gt;();
@@ -637,7 +637,7 @@ export default useMapState;
             <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 Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
+                at Thu Apr 21 2022 11:37:11 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/hooks/useWms.js.html

@@ -23,9 +23,9 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">0% </span>
+                <span class="strong">2.7% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>0/37</span>
+                <span class='fraction'>1/37</span>
             </div>
         
             
@@ -44,9 +44,9 @@
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">0% </span>
+                <span class="strong">2.85% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>0/35</span>
+                <span class='fraction'>1/35</span>
             </div>
         
             
@@ -235,7 +235,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
-<span class="cline-any cline-no">&nbsp;</span>
+<span class="cline-any cline-yes">10x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -326,7 +326,7 @@ function <span class="fstat-no" title="function not covered" >useWms(</span>prop
   };
 }
 &nbsp;
-<span class="cstat-no" title="statement not covered" >useWms.defaultProps = {</span>
+useWms.defaultProps = {
   url: "",
   urlParameters: {
     SERVICE: "WMS",
@@ -343,7 +343,7 @@ export default useWms;
             <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 Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
+                at Thu Apr 21 2022 11:37:11 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/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 Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
+                at Thu Apr 21 2022 11:37:11 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/index.ts.html

@@ -96,7 +96,15 @@
 <a name='L31'></a><a href='#L31'>31</a>
 <a name='L32'></a><a href='#L32'>32</a>
 <a name='L33'></a><a href='#L33'>33</a>
-<a name='L34'></a><a href='#L34'>34</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L34'></a><a href='#L34'>34</a>
+<a name='L35'></a><a href='#L35'>35</a>
+<a name='L36'></a><a href='#L36'>36</a>
+<a name='L37'></a><a href='#L37'>37</a>
+<a name='L38'></a><a href='#L38'>38</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -162,14 +170,18 @@ export { default as useLayer } from "./hooks/useLayer";
 export { default as useMapState } from "./hooks/useMapState";
 export { default as useMap } from "./hooks/useMap";
 export { default as useWms } from "./hooks/useWms.js";
-//</pre></td></tr></table></pre>
+&nbsp;
+export { MapComponentsProvider } from './contexts/MapContext';
+export { default as MapContext } from './contexts/MapContext';
+export { default as SimpleDataProvider } from './contexts/SimpleDataProvider';
+export { default as SimpleDataContext } from './contexts/SimpleDataContext';</pre></td></tr></table></pre>
 
                 <div class='push'></div><!-- for sticky footer -->
             </div><!-- /wrapper -->
             <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 Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
+                at Thu Apr 21 2022 11:37:11 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../prettify.js"></script>
         <script>