npm - @mapcomponents/react-maplibre - Versions diffs - 0.1.34 → 0.1.37 - Mend

@mapcomponents/react-maplibre 0.1.34 → 0.1.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (305) hide show

package/coverage/lcov-report/src/components/MlVectorTileLayer/{MlVectorTileLayer.js.html → MlVectorTileLayer.tsx.html} RENAMED Viewed

@@ -3,7 +3,7 @@
 <html lang="en">
 <head>
-    <title>Code coverage report for src/components/MlVectorTileLayer/MlVectorTileLayer.js</title>
+    <title>Code coverage report for src/components/MlVectorTileLayer/MlVectorTileLayer.tsx</title>
     <meta charset="utf-8" />
     <link rel="stylesheet" href="../../../prettify.css" />
     <link rel="stylesheet" href="../../../base.css" />
@@ -19,7 +19,7 @@
 <body>
 <div class='wrapper'>
     <div class='pad1'>
-        <h1><a href="../../../index.html">All files</a> / <a href="index.html">src/components/MlVectorTileLayer</a> MlVectorTileLayer.js</h1>
+        <h1><a href="../../../index.html">All files</a> / <a href="index.html">src/components/MlVectorTileLayer</a> MlVectorTileLayer.tsx</h1>
         <div class='clearfix'>
             <div class='fl pad1y space-right2'>
@@ -186,7 +186,32 @@
 <a name='L121'></a><a href='#L121'>121</a>
 <a name='L122'></a><a href='#L122'>122</a>
 <a name='L123'></a><a href='#L123'>123</a>
-<a name='L124'></a><a href='#L124'>124</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L124'></a><a href='#L124'>124</a>
+<a name='L125'></a><a href='#L125'>125</a>
+<a name='L126'></a><a href='#L126'>126</a>
+<a name='L127'></a><a href='#L127'>127</a>
+<a name='L128'></a><a href='#L128'>128</a>
+<a name='L129'></a><a href='#L129'>129</a>
+<a name='L130'></a><a href='#L130'>130</a>
+<a name='L131'></a><a href='#L131'>131</a>
+<a name='L132'></a><a href='#L132'>132</a>
+<a name='L133'></a><a href='#L133'>133</a>
+<a name='L134'></a><a href='#L134'>134</a>
+<a name='L135'></a><a href='#L135'>135</a>
+<a name='L136'></a><a href='#L136'>136</a>
+<a name='L137'></a><a href='#L137'>137</a>
+<a name='L138'></a><a href='#L138'>138</a>
+<a name='L139'></a><a href='#L139'>139</a>
+<a name='L140'></a><a href='#L140'>140</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>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -199,8 +224,13 @@
 <span class="cline-any cline-yes">1x</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>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">12x</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-yes">12x</span>
 <span class="cline-any cline-yes">12x</span>
 <span class="cline-any cline-yes">12x</span>
@@ -250,6 +280,8 @@
 <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">12x</span>
 <span class="cline-any cline-yes">8x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -313,17 +345,31 @@
 import useMap from "../../hooks/useMap";
 import PropTypes from "prop-types";
 &nbsp;
+interface MlVectorTileLayerProps {
+  mapId?: string;
+  insertBeforeLayer?: string;
+  layerId?: string;
+  sourceOptions?: any;
+  url?: string;
+  layers?: any;
+}
+&nbsp;
 /**
  * Adds a vector-tile source and 0...n vector-tile-layers to the MapLibre instance referenced by
  * props.mapId
  *
  * @component
  */
-const MlVectorTileLayer = (props) =&gt; {
-  const mapHook = useMap({ mapId: props.mapId, waitForLayer: props.insertBeforeLayer });
+const MlVectorTileLayer = (props: MlVectorTileLayerProps) =&gt; {
+  const mapHook = useMap({
+    mapId: props.mapId,
+    waitForLayer: props.insertBeforeLayer,
+  });
 &nbsp;
   const layerIdsRef = useRef({});
-  const layerId = useRef(props.layerId || "MlVectorTileLayer-" + mapHook.componentId);
+  const layerId = useRef(
+    props.layerId || "MlVectorTileLayer-" + mapHook.componentId
+  );
   const layerPaintConfsRef = useRef({});
   const layerLayoutConfsRef = useRef({});
   const initializedRef = useRef(false);
@@ -369,7 +415,9 @@ const MlVectorTileLayer = (props) =&gt; {
         mapHook.componentId
       );
       layerPaintConfsRef.current[key] = JSON.stringify(props.layers[key].paint);
-      layerLayoutConfsRef.current[key] = JSON.stringify(props.layers[key].layout);
+      layerLayoutConfsRef.current[key] = JSON.stringify(
+        props.layers[key].layout
+      );
     }
   }, [mapHook.map, props]);
 &nbsp;
@@ -377,13 +425,13 @@ const MlVectorTileLayer = (props) =&gt; {
     if (!mapHook.map || !initializedRef.current) return;
     // initialize the layer and add it to the MapLibre-gl instance or do something else with it
     for (var key in props.layers) {
-      if (mapHook.map.getLayer(layerIdsRef.current[key])) {
+      <span class="missing-if-branch" title="else path not taken" >E</span>if (mapHook.map.map.getLayer(layerIdsRef.current[key])) {
         // update changed paint property
         let layerPaintConfString = JSON.stringify(props.layers[key].paint);
 &nbsp;
         <span class="missing-if-branch" title="if path not taken" >I</span>if (layerPaintConfString !== layerPaintConfsRef.current[key]) {
 <span class="cstat-no" title="statement not covered" >          for (let paintKey in props.layers[key].paint) {</span>
-<span class="cstat-no" title="statement not covered" >            mapHook.map.setPaintProperty(</span>
+<span class="cstat-no" title="statement not covered" >            mapHook.map.map.setPaintProperty(</span>
               layerIdsRef.current[key],
               paintKey,
               props.layers[key].paint[paintKey]
@@ -397,7 +445,7 @@ const MlVectorTileLayer = (props) =&gt; {
 &nbsp;
         <span class="missing-if-branch" title="if path not taken" >I</span>if (layerLayoutConfString !== layerLayoutConfsRef.current[key]) {
 <span class="cstat-no" title="statement not covered" >          for (let layoutKey in props.layers[key].layout) {</span>
-<span class="cstat-no" title="statement not covered" >            mapHook.map.setLayoutProperty(</span>
+<span class="cstat-no" title="statement not covered" >            mapHook.map.map.setLayoutProperty(</span>
               layerIdsRef.current[key],
               layoutKey,
               props.layers[key].layout[layoutKey]
@@ -439,7 +487,7 @@ export default MlVectorTileLayer;
             <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 Thu Mar 24 2022 19:39:33 GMT+0000 (Coordinated Universal Time)
+                at Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlVectorTileLayer/index.html CHANGED Viewed

@@ -79,7 +79,7 @@
 </tr>
 </thead>
 <tbody><tr>
-	<td class="file high" data-value="MlVectorTileLayer.js"><a href="MlVectorTileLayer.js.html">MlVectorTileLayer.js</a></td>
+	<td class="file high" data-value="MlVectorTileLayer.tsx"><a href="MlVectorTileLayer.tsx.html">MlVectorTileLayer.tsx</a></td>
 	<td data-value="88.57" class="pic high">
 	<div class="chart"><div class="cover-fill" style="width: 88%"></div><div class="cover-empty" style="width: 12%"></div></div>
 	</td>
@@ -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 Thu Mar 24 2022 19:39:33 GMT+0000 (Coordinated Universal Time)
+                at Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlWmsFeatureInfoPopup/MlWmsFeatureInfoPopup.js.html CHANGED Viewed

@@ -262,7 +262,7 @@ export default MlWmsFeatureInfoPopup;
             <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 Thu Mar 24 2022 19:39:33 GMT+0000 (Coordinated Universal Time)
+                at Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlWmsFeatureInfoPopup/index.html CHANGED Viewed

@@ -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 Thu Mar 24 2022 19:39:33 GMT+0000 (Coordinated Universal Time)
+                at Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlWmsLayer/{MlWmsLayer.js.html → MlWmsLayer.tsx.html} RENAMED Viewed

@@ -3,7 +3,7 @@
 <html lang="en">
 <head>
-    <title>Code coverage report for src/components/MlWmsLayer/MlWmsLayer.js</title>
+    <title>Code coverage report for src/components/MlWmsLayer/MlWmsLayer.tsx</title>
     <meta charset="utf-8" />
     <link rel="stylesheet" href="../../../prettify.css" />
     <link rel="stylesheet" href="../../../base.css" />
@@ -19,7 +19,7 @@
 <body>
 <div class='wrapper'>
     <div class='pad1'>
-        <h1><a href="../../../index.html">All files</a> / <a href="index.html">src/components/MlWmsLayer</a> MlWmsLayer.js</h1>
+        <h1><a href="../../../index.html">All files</a> / <a href="index.html">src/components/MlWmsLayer</a> MlWmsLayer.tsx</h1>
         <div class='clearfix'>
             <div class='fl pad1y space-right2'>
@@ -228,7 +228,22 @@
 <a name='L163'></a><a href='#L163'>163</a>
 <a name='L164'></a><a href='#L164'>164</a>
 <a name='L165'></a><a href='#L165'>165</a>
-<a name='L166'></a><a href='#L166'>166</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L166'></a><a href='#L166'>166</a>
+<a name='L167'></a><a href='#L167'>167</a>
+<a name='L168'></a><a href='#L168'>168</a>
+<a name='L169'></a><a href='#L169'>169</a>
+<a name='L170'></a><a href='#L170'>170</a>
+<a name='L171'></a><a href='#L171'>171</a>
+<a name='L172'></a><a href='#L172'>172</a>
+<a name='L173'></a><a href='#L173'>173</a>
+<a name='L174'></a><a href='#L174'>174</a>
+<a name='L175'></a><a href='#L175'>175</a>
+<a name='L176'></a><a href='#L176'>176</a>
+<a name='L177'></a><a href='#L177'>177</a>
+<a name='L178'></a><a href='#L178'>178</a>
+<a name='L179'></a><a href='#L179'>179</a>
+<a name='L180'></a><a href='#L180'>180</a>
+<a name='L181'></a><a href='#L181'>181</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>
@@ -273,9 +288,23 @@
 <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>
+<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">1x</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>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">12x</span>
 <span class="cline-any cline-yes">12x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -301,6 +330,7 @@
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
+<span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">4x</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -422,13 +452,24 @@ const defaultProps = {
   },
 };
 &nbsp;
+interface MlWmsLayerProps {
+  urlParameters?: any;
+  url: string;
+  visible?: boolean;
+  attribution?: string;
+  mapId?: string;
+  sourceOptions?: any;
+  layerOptions?: any;
+  insertBeforeLayer?: string;
+  layerId?: string;
+}
 /**
  * Adds a WMS raster source &amp; layer to the maplibre-gl instance
  *
  * @param {object} props
  * @param {object} props.urlParameters URL query parameters that will be added to the WMS URL. A layers property (string) is mandatory. Any value defined on this attribute will extend the default object
  * @param {string} props.url WMS URL
- * @param {bool} props.visible Sets layer "visibility" property to "visible" if true or "none" if false
+ * @param {bool}   props.visible Sets layer "visibility" property to "visible" if true or "none" if false
  * @param {string} props.attribution MapLibre attribution shown in the bottom right of the map, if this layer is visible
  * @param {string} props.mapId Id of the target MapLibre instance in mapContext
  * @param {object} props.sourceOptions Object that is passed to the MapLibre.addSource call as config option parameter
@@ -438,8 +479,11 @@ const defaultProps = {
  *
  * @component
  */
-const MlWmsLayer = (props) =&gt; {
-  const mapHook = useMap({ mapId: props.mapId, waitForLayer: props.insertBeforeLayer });
+const MlWmsLayer = (props:MlWmsLayerProps) =&gt; {
+  const mapHook = useMap({
+    mapId: props.mapId,
+    waitForLayer: props.insertBeforeLayer,
+  });
 &nbsp;
   const initializedRef = useRef(false);
   const layerId = useRef(props.layerId || "MlWmsLayer-" + mapHook.componentId);
@@ -464,7 +508,8 @@ const MlWmsLayer = (props) =&gt; {
     };
     let urlParams = new URLSearchParams(urlParamsObj);
     let urlParamsStr =
-      decodeURIComponent(urlParams.toString()) + "".replace(/%2F/g, "/").replace(/%3A/g, ":");
+      decodeURIComponent(urlParams.toString()) +
+      "".replace(/%2F/g, "/").replace(/%3A/g, ":");
 &nbsp;
     mapHook.map.addSource(
       layerId.current,
@@ -490,7 +535,7 @@ const MlWmsLayer = (props) =&gt; {
     );
 &nbsp;
     <span class="missing-if-branch" title="if path not taken" >I</span>if (!props.visible) {
-<span class="cstat-no" title="statement not covered" >      mapHook.map.setLayoutProperty(layerId.current, "visibility", "none");</span>
+<span class="cstat-no" title="statement not covered" >      mapHook.map.map.setLayoutProperty(layerId.current, "visibility", "none");</span>
     }
   }, [mapHook, props]);
 &nbsp;
@@ -499,9 +544,9 @@ const MlWmsLayer = (props) =&gt; {
 &nbsp;
     // toggle layer visibility by changing the layout object's visibility property
     if (props.visible) {
-      mapHook.map.setLayoutProperty(layerId.current, "visibility", "visible");
+      mapHook.map.map.setLayoutProperty(layerId.current, "visibility", "visible");
     } else <span class="missing-if-branch" title="else path not taken" >E</span>{
-<span class="cstat-no" title="statement not covered" >      mapHook.map.setLayoutProperty(layerId.current, "visibility", "none");</span>
+<span class="cstat-no" title="statement not covered" >      mapHook.map.map.setLayoutProperty(layerId.current, "visibility", "none");</span>
     }
   }, [props.visible, mapHook.map]);
 &nbsp;
@@ -565,7 +610,7 @@ export default MlWmsLayer;
             <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 Thu Mar 24 2022 19:39:33 GMT+0000 (Coordinated Universal Time)
+                at Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlWmsLayer/index.html CHANGED Viewed

@@ -79,7 +79,7 @@
 </tr>
 </thead>
 <tbody><tr>
-	<td class="file high" data-value="MlWmsLayer.js"><a href="MlWmsLayer.js.html">MlWmsLayer.js</a></td>
+	<td class="file high" data-value="MlWmsLayer.tsx"><a href="MlWmsLayer.tsx.html">MlWmsLayer.tsx</a></td>
 	<td data-value="86.66" class="pic high">
 	<div class="chart"><div class="cover-fill" style="width: 86%"></div><div class="cover-empty" style="width: 14%"></div></div>
 	</td>
@@ -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 Thu Mar 24 2022 19:39:33 GMT+0000 (Coordinated Universal Time)
+                at Wed Apr 20 2022 08:49:29 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>