@mapcomponents/react-maplibre 0.1.14 → 0.1.18

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 (100) hide show
  1. package/.github/workflows/storybook.yml +4 -2
  2. package/CHANGELOG.md +42 -0
  3. package/README.md +22 -6
  4. package/coverage/clover.xml +448 -460
  5. package/coverage/coverage-final.json +14 -14
  6. package/coverage/lcov-report/index.html +77 -78
  7. package/coverage/lcov-report/src/components/MapLibreMap/MapLibreMap.js.html +2 -3
  8. package/coverage/lcov-report/src/components/MapLibreMap/index.html +2 -3
  9. package/coverage/lcov-report/src/components/MlCreatePdfButton/MlCreatePdfButton.js.html +2 -3
  10. package/coverage/lcov-report/src/components/MlCreatePdfButton/index.html +2 -3
  11. package/coverage/lcov-report/src/components/MlFeatureEditor/MlFeatureEditor.js.html +2 -3
  12. package/coverage/lcov-report/src/components/MlFeatureEditor/index.html +2 -3
  13. package/coverage/lcov-report/src/components/MlFillExtrusionLayer/MlFillExtrusionLayer.js.html +2 -3
  14. package/coverage/lcov-report/src/components/MlFillExtrusionLayer/index.html +2 -3
  15. package/coverage/lcov-report/src/components/MlFollowGps/MlFollowGps.js.html +112 -107
  16. package/coverage/lcov-report/src/components/MlFollowGps/index.html +16 -17
  17. package/coverage/lcov-report/src/components/MlGPXViewer/MlGPXViewer.js.html +2 -3
  18. package/coverage/lcov-report/src/components/MlGPXViewer/gpxConverter.js.html +2 -3
  19. package/coverage/lcov-report/src/components/MlGPXViewer/index.html +2 -3
  20. package/coverage/lcov-report/src/components/MlGeoJsonLayer/MlGeoJsonLayer.js.html +168 -133
  21. package/coverage/lcov-report/src/components/MlGeoJsonLayer/index.html +20 -21
  22. package/coverage/lcov-report/src/components/MlImageMarkerLayer/MlImageMarkerLayer.js.html +46 -152
  23. package/coverage/lcov-report/src/components/MlImageMarkerLayer/index.html +20 -21
  24. package/coverage/lcov-report/src/components/MlLayer/MlLayer.js.html +92 -30
  25. package/coverage/lcov-report/src/components/MlLayer/index.html +20 -21
  26. package/coverage/lcov-report/src/components/MlLayerMagnify/MlLayerMagnify.js.html +2 -3
  27. package/coverage/lcov-report/src/components/MlLayerMagnify/index.html +2 -3
  28. package/coverage/lcov-report/src/components/MlLayerSwipe/MlLayerSwipe.js.html +2 -3
  29. package/coverage/lcov-report/src/components/MlLayerSwipe/index.html +2 -3
  30. package/coverage/lcov-report/src/components/MlLayerSwitcher/MlLayerSwitcher.js.html +3 -10
  31. package/coverage/lcov-report/src/components/MlLayerSwitcher/components/LayerBox.js.html +9 -82
  32. package/coverage/lcov-report/src/components/MlLayerSwitcher/components/index.html +10 -11
  33. package/coverage/lcov-report/src/components/MlLayerSwitcher/index.html +2 -3
  34. package/coverage/lcov-report/src/components/MlMarker/MlMarker.js.html +6 -7
  35. package/coverage/lcov-report/src/components/MlMarker/index.html +6 -7
  36. package/coverage/lcov-report/src/components/MlNavigationCompass/MlNavigationCompass.js.html +2 -3
  37. package/coverage/lcov-report/src/components/MlNavigationCompass/index.html +2 -3
  38. package/coverage/lcov-report/src/components/MlNavigationTools/MlNavigationTools.js.html +11 -15
  39. package/coverage/lcov-report/src/components/MlNavigationTools/index.html +8 -9
  40. package/coverage/lcov-report/src/components/MlOsmLayer/MlOsmLayer.js.html +2 -3
  41. package/coverage/lcov-report/src/components/MlOsmLayer/index.html +2 -3
  42. package/coverage/lcov-report/src/components/MlScaleReference/MlScaleReference.js.html +2 -3
  43. package/coverage/lcov-report/src/components/MlScaleReference/index.html +2 -3
  44. package/coverage/lcov-report/src/components/MlShareMapState/MlShareMapState.js.html +209 -18
  45. package/coverage/lcov-report/src/components/MlShareMapState/index.html +10 -11
  46. package/coverage/lcov-report/src/components/MlSpatialElevationProfile/MlSpatialElevationProfile.js.html +2 -3
  47. package/coverage/lcov-report/src/components/MlSpatialElevationProfile/index.html +2 -3
  48. package/coverage/lcov-report/src/components/MlThreeJsLayer/MlThreeJsLayer.js.html +2 -3
  49. package/coverage/lcov-report/src/components/MlThreeJsLayer/index.html +2 -3
  50. package/coverage/lcov-report/src/components/MlUseMapDebugger/MlUseMapDebugger.js.html +6 -25
  51. package/coverage/lcov-report/src/components/MlUseMapDebugger/index.html +6 -7
  52. package/coverage/lcov-report/src/components/MlVectorTileLayer/MlVectorTileLayer.js.html +2 -3
  53. package/coverage/lcov-report/src/components/MlVectorTileLayer/index.html +2 -3
  54. package/coverage/lcov-report/src/components/MlWmsFeatureInfoPopup/MlWmsFeatureInfoPopup.js.html +2 -3
  55. package/coverage/lcov-report/src/components/MlWmsFeatureInfoPopup/index.html +2 -3
  56. package/coverage/lcov-report/src/components/MlWmsLayer/MlWmsLayer.js.html +2 -3
  57. package/coverage/lcov-report/src/components/MlWmsLayer/index.html +2 -3
  58. package/coverage/lcov-report/src/components/MlWmsLoader/MlWmsLoader.js.html +6 -19
  59. package/coverage/lcov-report/src/components/MlWmsLoader/index.html +8 -9
  60. package/coverage/lcov-report/src/hooks/index.html +35 -36
  61. package/coverage/lcov-report/src/hooks/useMap.js.html +81 -169
  62. package/coverage/lcov-report/src/hooks/useMapState.js.html +82 -125
  63. package/coverage/lcov-report/src/hooks/useWms.js.html +9 -22
  64. package/coverage/lcov-report/src/i18n.js.html +2 -3
  65. package/coverage/lcov-report/src/index.html +2 -3
  66. package/coverage/lcov-report/src/translations/english.js.html +2 -3
  67. package/coverage/lcov-report/src/translations/german.js.html +2 -3
  68. package/coverage/lcov-report/src/translations/index.html +2 -3
  69. package/coverage/lcov.info +898 -900
  70. package/dist/index.esm.js +866 -758
  71. package/dist/index.esm.js.map +1 -1
  72. package/package.json +2 -2
  73. package/src/components/MapLibreMap/lib/MapLibreGlWrapper.js +16 -14
  74. package/src/components/MlComponentTemplate/MlComponentTemplate.js +7 -32
  75. package/src/components/MlFollowGps/MlFollowGps.js +67 -65
  76. package/src/components/MlFollowGps/MlFollowGps.test.js +3 -5
  77. package/src/components/MlGeoJsonLayer/MlGeoJsonLayer.js +101 -89
  78. package/src/components/MlGeoJsonLayer/MlGeoJsonLayer.stories.js +35 -6
  79. package/src/components/MlGeoJsonLayer/assets/sample_polygon_1.json +33 -0
  80. package/src/components/MlGeoJsonLayer/util/getDefaultLayerTypeByGeometry.js +25 -0
  81. package/src/components/MlGeoJsonLayer/util/getDefaultPaintPropsByType.js +31 -0
  82. package/src/components/MlImageMarkerLayer/MlImageMarkerLayer.js +21 -56
  83. package/src/components/MlLayer/MlLayer.js +26 -5
  84. package/src/components/MlLayerSwitcher/MlLayerSwitcher.js +0 -2
  85. package/src/components/MlLayerSwitcher/MlLayerSwitcher.stories.js +3 -6
  86. package/src/components/MlLayerSwitcher/components/LayerBox.js +2 -26
  87. package/src/components/MlMarker/MlMarker.js +1 -1
  88. package/src/components/MlNavigationTools/MlNavigationTools.js +4 -5
  89. package/src/components/MlShareMapState/MlShareMapState.js +73 -9
  90. package/src/components/MlShareMapState/MlShareMapState.stories.js +22 -2
  91. package/src/components/MlSpatialElevationProfile/MlSpatialElevationProfile.stories.js +1 -3
  92. package/src/components/MlUseMapDebugger/MlUseMapDebugger.js +1 -7
  93. package/src/components/MlWmsLoader/MlWmsLoader.js +0 -4
  94. package/src/hooks/useMap.js +33 -62
  95. package/src/hooks/useMapState.js +3 -17
  96. package/src/hooks/useWms.js +2 -7
  97. package/src/index.js +2 -0
  98. package/src/ui_components/ImageLoader.js +8 -3
  99. package/src/ui_components/Sidebar.js +1 -1
  100. package/src/ui_components/TopToolbar.js +0 -2
@@ -23,30 +23,30 @@
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
26
- <span class="strong">0% </span>
26
+ <span class="strong">75.55% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>0/47</span>
28
+ <span class='fraction'>34/45</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
- <span class="strong">0% </span>
33
+ <span class="strong">36.36% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>0/22</span>
35
+ <span class='fraction'>8/22</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
- <span class="strong">0% </span>
40
+ <span class="strong">71.42% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>0/7</span>
42
+ <span class='fraction'>5/7</span>
43
43
  </div>
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
- <span class="strong">0% </span>
47
+ <span class="strong">75% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>0/46</span>
49
+ <span class='fraction'>33/44</span>
50
50
  </div>
51
51
 
52
52
 
@@ -61,7 +61,7 @@
61
61
  </div>
62
62
  </template>
63
63
  </div>
64
- <div class='status-line low'></div>
64
+ <div class='status-line medium'></div>
65
65
  <pre><table class="coverage">
66
66
  <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
67
67
  <a name='L2'></a><a href='#L2'>2</a>
@@ -214,21 +214,7 @@
214
214
  <a name='L149'></a><a href='#L149'>149</a>
215
215
  <a name='L150'></a><a href='#L150'>150</a>
216
216
  <a name='L151'></a><a href='#L151'>151</a>
217
- <a name='L152'></a><a href='#L152'>152</a>
218
- <a name='L153'></a><a href='#L153'>153</a>
219
- <a name='L154'></a><a href='#L154'>154</a>
220
- <a name='L155'></a><a href='#L155'>155</a>
221
- <a name='L156'></a><a href='#L156'>156</a>
222
- <a name='L157'></a><a href='#L157'>157</a>
223
- <a name='L158'></a><a href='#L158'>158</a>
224
- <a name='L159'></a><a href='#L159'>159</a>
225
- <a name='L160'></a><a href='#L160'>160</a>
226
- <a name='L161'></a><a href='#L161'>161</a>
227
- <a name='L162'></a><a href='#L162'>162</a>
228
- <a name='L163'></a><a href='#L163'>163</a>
229
- <a name='L164'></a><a href='#L164'>164</a>
230
- <a name='L165'></a><a href='#L165'>165</a>
231
- <a name='L166'></a><a href='#L166'>166</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
217
+ <a name='L152'></a><a href='#L152'>152</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
232
218
  <span class="cline-any cline-neutral">&nbsp;</span>
233
219
  <span class="cline-any cline-neutral">&nbsp;</span>
234
220
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -240,20 +226,18 @@
240
226
  <span class="cline-any cline-neutral">&nbsp;</span>
241
227
  <span class="cline-any cline-neutral">&nbsp;</span>
242
228
  <span class="cline-any cline-neutral">&nbsp;</span>
243
- <span class="cline-any cline-no">&nbsp;</span>
229
+ <span class="cline-any cline-yes">49x</span>
244
230
  <span class="cline-any cline-neutral">&nbsp;</span>
245
- <span class="cline-any cline-no">&nbsp;</span>
246
- <span class="cline-any cline-no">&nbsp;</span>
231
+ <span class="cline-any cline-yes">49x</span>
232
+ <span class="cline-any cline-yes">49x</span>
247
233
  <span class="cline-any cline-neutral">&nbsp;</span>
248
- <span class="cline-any cline-no">&nbsp;</span>
234
+ <span class="cline-any cline-yes">49x</span>
235
+ <span class="cline-any cline-yes">49x</span>
249
236
  <span class="cline-any cline-neutral">&nbsp;</span>
250
- <span class="cline-any cline-no">&nbsp;</span>
251
- <span class="cline-any cline-no">&nbsp;</span>
237
+ <span class="cline-any cline-yes">49x</span>
238
+ <span class="cline-any cline-yes">49x</span>
252
239
  <span class="cline-any cline-neutral">&nbsp;</span>
253
- <span class="cline-any cline-no">&nbsp;</span>
254
- <span class="cline-any cline-no">&nbsp;</span>
255
- <span class="cline-any cline-neutral">&nbsp;</span>
256
- <span class="cline-any cline-no">&nbsp;</span>
240
+ <span class="cline-any cline-yes">49x</span>
257
241
  <span class="cline-any cline-neutral">&nbsp;</span>
258
242
  <span class="cline-any cline-neutral">&nbsp;</span>
259
243
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -261,8 +245,7 @@
261
245
  <span class="cline-any cline-neutral">&nbsp;</span>
262
246
  <span class="cline-any cline-neutral">&nbsp;</span>
263
247
  <span class="cline-any cline-neutral">&nbsp;</span>
264
- <span class="cline-any cline-neutral">&nbsp;</span>
265
- <span class="cline-any cline-no">&nbsp;</span>
248
+ <span class="cline-any cline-yes">49x</span>
266
249
  <span class="cline-any cline-neutral">&nbsp;</span>
267
250
  <span class="cline-any cline-no">&nbsp;</span>
268
251
  <span class="cline-any cline-no">&nbsp;</span>
@@ -281,45 +264,35 @@
281
264
  <span class="cline-any cline-neutral">&nbsp;</span>
282
265
  <span class="cline-any cline-neutral">&nbsp;</span>
283
266
  <span class="cline-any cline-neutral">&nbsp;</span>
284
- <span class="cline-any cline-no">&nbsp;</span>
285
- <span class="cline-any cline-no">&nbsp;</span>
286
- <span class="cline-any cline-no">&nbsp;</span>
287
- <span class="cline-any cline-no">&nbsp;</span>
288
- <span class="cline-any cline-no">&nbsp;</span>
289
- <span class="cline-any cline-no">&nbsp;</span>
290
- <span class="cline-any cline-neutral">&nbsp;</span>
291
- <span class="cline-any cline-neutral">&nbsp;</span>
292
- <span class="cline-any cline-neutral">&nbsp;</span>
293
- <span class="cline-any cline-no">&nbsp;</span>
294
- <span class="cline-any cline-no">&nbsp;</span>
295
- <span class="cline-any cline-neutral">&nbsp;</span>
296
- <span class="cline-any cline-no">&nbsp;</span>
297
- <span class="cline-any cline-no">&nbsp;</span>
298
- <span class="cline-any cline-no">&nbsp;</span>
299
- <span class="cline-any cline-no">&nbsp;</span>
300
- <span class="cline-any cline-neutral">&nbsp;</span>
301
- <span class="cline-any cline-no">&nbsp;</span>
302
- <span class="cline-any cline-neutral">&nbsp;</span>
303
- <span class="cline-any cline-neutral">&nbsp;</span>
304
- <span class="cline-any cline-neutral">&nbsp;</span>
305
- <span class="cline-any cline-no">&nbsp;</span>
306
- <span class="cline-any cline-no">&nbsp;</span>
307
- <span class="cline-any cline-neutral">&nbsp;</span>
308
- <span class="cline-any cline-neutral">&nbsp;</span>
309
- <span class="cline-any cline-no">&nbsp;</span>
310
- <span class="cline-any cline-no">&nbsp;</span>
267
+ <span class="cline-any cline-yes">49x</span>
268
+ <span class="cline-any cline-yes">14x</span>
269
+ <span class="cline-any cline-yes">14x</span>
270
+ <span class="cline-any cline-yes">14x</span>
271
+ <span class="cline-any cline-yes">14x</span>
272
+ <span class="cline-any cline-yes">14x</span>
311
273
  <span class="cline-any cline-neutral">&nbsp;</span>
312
274
  <span class="cline-any cline-neutral">&nbsp;</span>
313
275
  <span class="cline-any cline-neutral">&nbsp;</span>
276
+ <span class="cline-any cline-yes">49x</span>
277
+ <span class="cline-any cline-yes">14x</span>
314
278
  <span class="cline-any cline-neutral">&nbsp;</span>
279
+ <span class="cline-any cline-yes">14x</span>
280
+ <span class="cline-any cline-yes">6x</span>
281
+ <span class="cline-any cline-yes">6x</span>
282
+ <span class="cline-any cline-yes">6x</span>
315
283
  <span class="cline-any cline-neutral">&nbsp;</span>
284
+ <span class="cline-any cline-yes">6x</span>
316
285
  <span class="cline-any cline-neutral">&nbsp;</span>
317
286
  <span class="cline-any cline-neutral">&nbsp;</span>
318
287
  <span class="cline-any cline-neutral">&nbsp;</span>
288
+ <span class="cline-any cline-yes">49x</span>
289
+ <span class="cline-any cline-yes">28x</span>
319
290
  <span class="cline-any cline-neutral">&nbsp;</span>
320
291
  <span class="cline-any cline-neutral">&nbsp;</span>
292
+ <span class="cline-any cline-yes">14x</span>
293
+ <span class="cline-any cline-yes">14x</span>
321
294
  <span class="cline-any cline-neutral">&nbsp;</span>
322
- <span class="cline-any cline-no">&nbsp;</span>
295
+ <span class="cline-any cline-yes">14x</span>
323
296
  <span class="cline-any cline-no">&nbsp;</span>
324
297
  <span class="cline-any cline-neutral">&nbsp;</span>
325
298
  <span class="cline-any cline-no">&nbsp;</span>
@@ -327,17 +300,16 @@
327
300
  <span class="cline-any cline-neutral">&nbsp;</span>
328
301
  <span class="cline-any cline-no">&nbsp;</span>
329
302
  <span class="cline-any cline-no">&nbsp;</span>
330
- <span class="cline-any cline-no">&nbsp;</span>
331
303
  <span class="cline-any cline-neutral">&nbsp;</span>
332
304
  <span class="cline-any cline-neutral">&nbsp;</span>
333
305
  <span class="cline-any cline-neutral">&nbsp;</span>
334
306
  <span class="cline-any cline-neutral">&nbsp;</span>
335
307
  <span class="cline-any cline-neutral">&nbsp;</span>
336
308
  <span class="cline-any cline-neutral">&nbsp;</span>
337
- <span class="cline-any cline-no">&nbsp;</span>
338
- <span class="cline-any cline-no">&nbsp;</span>
309
+ <span class="cline-any cline-yes">14x</span>
310
+ <span class="cline-any cline-yes">14x</span>
339
311
  <span class="cline-any cline-neutral">&nbsp;</span>
340
- <span class="cline-any cline-no">&nbsp;</span>
312
+ <span class="cline-any cline-yes">14x</span>
341
313
  <span class="cline-any cline-neutral">&nbsp;</span>
342
314
  <span class="cline-any cline-neutral">&nbsp;</span>
343
315
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -349,13 +321,13 @@
349
321
  <span class="cline-any cline-neutral">&nbsp;</span>
350
322
  <span class="cline-any cline-neutral">&nbsp;</span>
351
323
  <span class="cline-any cline-neutral">&nbsp;</span>
352
- <span class="cline-any cline-no">&nbsp;</span>
324
+ <span class="cline-any cline-yes">49x</span>
353
325
  <span class="cline-any cline-neutral">&nbsp;</span>
354
326
  <span class="cline-any cline-neutral">&nbsp;</span>
355
327
  <span class="cline-any cline-neutral">&nbsp;</span>
356
328
  <span class="cline-any cline-neutral">&nbsp;</span>
357
329
  <span class="cline-any cline-neutral">&nbsp;</span>
358
- <span class="cline-any cline-no">&nbsp;</span>
330
+ <span class="cline-any cline-yes">4x</span>
359
331
  <span class="cline-any cline-neutral">&nbsp;</span>
360
332
  <span class="cline-any cline-neutral">&nbsp;</span>
361
333
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -367,7 +339,7 @@
367
339
  <span class="cline-any cline-neutral">&nbsp;</span>
368
340
  <span class="cline-any cline-neutral">&nbsp;</span>
369
341
  <span class="cline-any cline-neutral">&nbsp;</span>
370
- <span class="cline-any cline-no">&nbsp;</span>
342
+ <span class="cline-any cline-yes">4x</span>
371
343
  <span class="cline-any cline-neutral">&nbsp;</span>
372
344
  <span class="cline-any cline-neutral">&nbsp;</span>
373
345
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -403,23 +375,20 @@ import { MapContext } from "@mapcomponents/react-core";
403
375
  *
404
376
  * @component
405
377
  */
406
- function <span class="fstat-no" title="function not covered" >useMapState(</span>props) {
378
+ function useMapState(props) {
407
379
  // Use a useRef hook to reference the layer object to be able to access it later inside useEffect hooks
408
- const mapContext = <span class="cstat-no" title="statement not covered" >useContext(MapContext);</span>
409
- &nbsp;
410
- const initializedRef = <span class="cstat-no" title="statement not covered" >useRef(false);</span>
411
- const mapRef = <span class="cstat-no" title="statement not covered" >useRef(undefined);</span>
380
+ const mapContext = useContext(MapContext);
412
381
  &nbsp;
413
- const [center, setCenter] = <span class="cstat-no" title="statement not covered" >useState(undefined);</span>
382
+ const initializedRef = useRef(false);
383
+ const mapRef = useRef(undefined);
414
384
  &nbsp;
415
- const [viewport, setViewport] = <span class="cstat-no" title="statement not covered" >useState(undefined);</span>
416
- const viewportRef = <span class="cstat-no" title="statement not covered" >useRef(undefined);</span>
385
+ const [viewport, setViewport] = useState(undefined);
386
+ const viewportRef = useRef(undefined);
417
387
  &nbsp;
418
- const [layers, setLayers] = <span class="cstat-no" title="statement not covered" >useState(undefined);</span>
419
- const layersRef = <span class="cstat-no" title="statement not covered" >useRef(undefined);</span>
388
+ const [layers, setLayers] = useState(undefined);
389
+ const layersRef = useRef(undefined);
420
390
  //const mapRef = useRef(props.map);
421
- const componentId = <span class="cstat-no" title="statement not covered" >useRef(uuidv4());</span>
422
- &nbsp;
391
+ const componentId = useRef(uuidv4());
423
392
  &nbsp;
424
393
  /**
425
394
  * returns the element if it matches the defined filter criteria
@@ -427,13 +396,13 @@ function <span class="fstat-no" title="function not covered" >useMapState(</span
427
396
  *
428
397
  * @param {object} layer
429
398
  */
430
- const layerIdFilter = <span class="cstat-no" title="statement not covered" >useCallback(</span>
399
+ const layerIdFilter = useCallback(
431
400
  <span class="fstat-no" title="function not covered" > (l</span>ayer) =&gt; {
432
- <span class="cstat-no" title="statement not covered" > if (!props.filter.includeBaseLayers &amp;&amp; layer.baseLayer) {</span>
401
+ <span class="cstat-no" title="statement not covered" > if (!props?.filter?.includeBaseLayers &amp;&amp; layer.baseLayer) {</span>
433
402
  <span class="cstat-no" title="statement not covered" > return false;</span>
434
403
  }
435
404
  &nbsp;
436
- <span class="cstat-no" title="statement not covered" > if (typeof props.filter.matchLayerIds !== "undefined") {</span>
405
+ <span class="cstat-no" title="statement not covered" > if (typeof props.filter?.matchLayerIds !== "undefined") {</span>
437
406
  <span class="cstat-no" title="statement not covered" > if (props.filter.matchLayerIds instanceof RegExp) {</span>
438
407
  <span class="cstat-no" title="statement not covered" > return props.filter.matchLayerIds.test(layer.id);</span>
439
408
  } else {
@@ -446,45 +415,35 @@ function <span class="fstat-no" title="function not covered" >useMapState(</span
446
415
  [props.filter]
447
416
  );
448
417
  &nbsp;
449
- const refreshLayerState = <span class="cstat-no" title="statement not covered" >useCallback(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
450
- let _layerState = <span class="cstat-no" title="statement not covered" >mapRef.current.wrapper.layerState.filter(layerIdFilter);</span>
451
- let _layerStateString = <span class="cstat-no" title="statement not covered" >JSON.stringify(_layerState);</span>
452
- <span class="cstat-no" title="statement not covered" > if (layersRef.current !== _layerStateString) {</span>
453
- <span class="cstat-no" title="statement not covered" > layersRef.current = _layerStateString;</span>
454
- <span class="cstat-no" title="statement not covered" > setLayers(_layerState);</span>
418
+ const refreshLayerState = useCallback(() =&gt; {
419
+ let _layerState = mapRef.current.wrapper.layerState.filter(layerIdFilter);
420
+ let _layerStateString = JSON.stringify(_layerState);
421
+ if (layersRef.current !== _layerStateString) {
422
+ layersRef.current = _layerStateString;
423
+ setLayers(_layerState);
455
424
  }
456
- },[layerIdFilter]);
425
+ }, [layerIdFilter]);
457
426
  &nbsp;
458
- <span class="cstat-no" title="statement not covered" > useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
459
- let _componentId = <span class="cstat-no" title="statement not covered" >componentId.current;</span>
427
+ useEffect(() =&gt; {
428
+ let _componentId = componentId.current;
460
429
  &nbsp;
461
- <span class="cstat-no" title="statement not covered" > return <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
462
- <span class="cstat-no" title="statement not covered" > if (mapRef.current) {</span>
463
- <span class="cstat-no" title="statement not covered" > mapRef.current.cleanup(_componentId);</span>
464
- <span class="cstat-no" title="statement not covered" > mapRef.current = undefined;</span>
430
+ return () =&gt; {
431
+ if (mapRef.current) {
432
+ mapRef.current.cleanup(_componentId);
433
+ mapRef.current = undefined;
465
434
  }
466
- <span class="cstat-no" title="statement not covered" > initializedRef.current = false;</span>
435
+ initializedRef.current = false;
467
436
  };
468
437
  }, []);
469
438
  &nbsp;
470
- <span class="cstat-no" title="statement not covered" > useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
471
- <span class="cstat-no" title="statement not covered" > if (!mapContext.mapExists(props.mapId) || initializedRef.current) <span class="cstat-no" title="statement not covered" >return;</span></span>
439
+ useEffect(() =&gt; {
440
+ if (!mapContext.mapExists(props.mapId) || initializedRef.current) return;
472
441
  // the MapLibre-gl instance (mapContext.getMap(props.mapId)) is accessible here
473
442
  // initialize the layer and add it to the MapLibre-gl instance or do something else with it
474
- <span class="cstat-no" title="statement not covered" > initializedRef.current = true;</span>
475
- <span class="cstat-no" title="statement not covered" > mapRef.current = mapContext.getMap(props.mapId);</span>
443
+ initializedRef.current = true;
444
+ mapRef.current = mapContext.getMap(props.mapId);
476
445
  &nbsp;
477
- /*
478
- mapRef.current.on(
479
- "move",
480
- () =&gt; {
481
- setCenter(mapRef.current.getCenter());
482
- },
483
- componentId.current
484
- );
485
- */
486
- &nbsp;
487
- <span class="cstat-no" title="statement not covered" > if (props?.watch?.viewport) {</span>
446
+ <span class="missing-if-branch" title="if path not taken" >I</span>if (props?.watch?.viewport) {
488
447
  <span class="cstat-no" title="statement not covered" > setViewport(mapRef.current.wrapper.viewportState);</span>
489
448
  &nbsp;
490
449
  <span class="cstat-no" title="statement not covered" > mapRef.current.wrapper.on(</span>
@@ -492,17 +451,16 @@ function <span class="fstat-no" title="function not covered" >useMapState(</span
492
451
  <span class="fstat-no" title="function not covered" > ()</span> =&gt; {
493
452
  <span class="cstat-no" title="statement not covered" > if (viewportRef.current !== mapRef.current?.wrapper.viewportStateString) {</span>
494
453
  <span class="cstat-no" title="statement not covered" > setViewport(mapRef.current?.wrapper.viewportState);</span>
495
- <span class="cstat-no" title="statement not covered" > setCenter(mapRef.current?.wrapper.viewportState?.center);</span>
496
454
  }
497
455
  },
498
456
  componentId.current
499
457
  );
500
458
  }
501
459
  &nbsp;
502
- <span class="cstat-no" title="statement not covered" > if (props?.watch?.layers) {</span>
503
- <span class="cstat-no" title="statement not covered" > refreshLayerState();</span>
460
+ if (props?.watch?.layers) {
461
+ refreshLayerState();
504
462
  &nbsp;
505
- <span class="cstat-no" title="statement not covered" > mapRef.current.wrapper.on(</span>
463
+ mapRef.current.wrapper.on(
506
464
  "layerchange",
507
465
  refreshLayerState,
508
466
  {
@@ -514,13 +472,13 @@ function <span class="fstat-no" title="function not covered" >useMapState(</span
514
472
  }
515
473
  }, [mapContext.mapIds, mapContext, props.mapId, refreshLayerState]);
516
474
  &nbsp;
517
- <span class="cstat-no" title="statement not covered" > return {</span>
475
+ return {
518
476
  layers,
519
477
  viewport,
520
478
  };
521
479
  }
522
480
  &nbsp;
523
- <span class="cstat-no" title="statement not covered" >useMapState.defaultProps = {</span>
481
+ useMapState.defaultProps = {
524
482
  mapId: undefined,
525
483
  watch: {
526
484
  layers: true,
@@ -532,7 +490,7 @@ function <span class="fstat-no" title="function not covered" >useMapState(</span
532
490
  },
533
491
  };
534
492
  &nbsp;
535
- <span class="cstat-no" title="statement not covered" >useMapState.propTypes = {</span>
493
+ useMapState.propTypes = {
536
494
  /**
537
495
  * Id of the target MapLibre instance in mapContext
538
496
  */
@@ -564,10 +522,9 @@ export default useMapState;
564
522
  </div><!-- /wrapper -->
565
523
  <div class='footer quiet pad2 space-top1 center small'>
566
524
  Code coverage generated by
567
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
568
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
525
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
526
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
569
527
  </div>
570
- </div>
571
528
  <script src="../../prettify.js"></script>
572
529
  <script>
573
530
  window.onload = function () {
@@ -25,7 +25,7 @@
25
25
  <div class='fl pad1y space-right2'>
26
26
  <span class="strong">0% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>0/39</span>
28
+ <span class='fraction'>0/37</span>
29
29
  </div>
30
30
 
31
31
 
@@ -46,7 +46,7 @@
46
46
  <div class='fl pad1y space-right2'>
47
47
  <span class="strong">0% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>0/37</span>
49
+ <span class='fraction'>0/35</span>
50
50
  </div>
51
51
 
52
52
 
@@ -154,19 +154,10 @@
154
154
  <a name='L89'></a><a href='#L89'>89</a>
155
155
  <a name='L90'></a><a href='#L90'>90</a>
156
156
  <a name='L91'></a><a href='#L91'>91</a>
157
- <a name='L92'></a><a href='#L92'>92</a>
158
- <a name='L93'></a><a href='#L93'>93</a>
159
- <a name='L94'></a><a href='#L94'>94</a>
160
- <a name='L95'></a><a href='#L95'>95</a>
161
- <a name='L96'></a><a href='#L96'>96</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
162
- <span class="cline-any cline-neutral">&nbsp;</span>
163
- <span class="cline-any cline-neutral">&nbsp;</span>
164
- <span class="cline-any cline-neutral">&nbsp;</span>
157
+ <a name='L92'></a><a href='#L92'>92</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
165
158
  <span class="cline-any cline-neutral">&nbsp;</span>
166
159
  <span class="cline-any cline-neutral">&nbsp;</span>
167
160
  <span class="cline-any cline-neutral">&nbsp;</span>
168
- <span class="cline-any cline-no">&nbsp;</span>
169
- <span class="cline-any cline-no">&nbsp;</span>
170
161
  <span class="cline-any cline-neutral">&nbsp;</span>
171
162
  <span class="cline-any cline-no">&nbsp;</span>
172
163
  <span class="cline-any cline-no">&nbsp;</span>
@@ -253,16 +244,12 @@
253
244
  <span class="cline-any cline-neutral">&nbsp;</span>
254
245
  <span class="cline-any cline-neutral">&nbsp;</span>
255
246
  <span class="cline-any cline-neutral">&nbsp;</span>
256
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { useContext, useState, useEffect, useRef } from "react";
257
- import { v4 as uuidv4 } from "uuid";
247
+ <span class="cline-any cline-neutral">&nbsp;</span>
248
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import { useState, useEffect } from "react";
258
249
  import WMSCapabilities from "wms-capabilities";
259
- import { MapContext } from "@mapcomponents/react-core";
260
250
  &nbsp;
261
251
  function <span class="fstat-no" title="function not covered" >useWms(</span>props) {
262
252
  // Use a useRef hook to reference the layer object to be able to access it later inside useEffect hooks
263
- const mapContext = <span class="cstat-no" title="statement not covered" >useContext(MapContext);</span>
264
- const initializedRef = <span class="cstat-no" title="statement not covered" >useRef(false);</span>
265
- &nbsp;
266
253
  const [getFeatureInfoUrl, setGetFeatureInfoUrl] = <span class="cstat-no" title="statement not covered" >useState(undefined);</span>
267
254
  const [url, setUrl] = <span class="cstat-no" title="statement not covered" >useState(props.url);</span>
268
255
  const [wmsUrl, setWmsUrl] = <span class="cstat-no" title="statement not covered" >useState("");</span>
@@ -348,16 +335,16 @@ function <span class="fstat-no" title="function not covered" >useWms(</span>prop
348
335
  },
349
336
  };
350
337
  &nbsp;
351
- export default useWms;</pre></td></tr></table></pre>
338
+ export default useWms;
339
+ &nbsp;</pre></td></tr></table></pre>
352
340
 
353
341
  <div class='push'></div><!-- for sticky footer -->
354
342
  </div><!-- /wrapper -->
355
343
  <div class='footer quiet pad2 space-top1 center small'>
356
344
  Code coverage generated by
357
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
358
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
345
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
346
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
359
347
  </div>
360
- </div>
361
348
  <script src="../../prettify.js"></script>
362
349
  <script>
363
350
  window.onload = function () {
@@ -150,10 +150,9 @@ export default i18n;</pre></td></tr></table></pre>
150
150
  </div><!-- /wrapper -->
151
151
  <div class='footer quiet pad2 space-top1 center small'>
152
152
  Code coverage generated by
153
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
154
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
153
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
154
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
155
155
  </div>
156
- </div>
157
156
  <script src="../prettify.js"></script>
158
157
  <script>
159
158
  window.onload = function () {
@@ -100,10 +100,9 @@
100
100
  </div><!-- /wrapper -->
101
101
  <div class='footer quiet pad2 space-top1 center small'>
102
102
  Code coverage generated by
103
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
104
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
103
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
104
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
105
105
  </div>
106
- </div>
107
106
  <script src="../prettify.js"></script>
108
107
  <script>
109
108
  window.onload = function () {
@@ -78,10 +78,9 @@ export default english;</pre></td></tr></table></pre>
78
78
  </div><!-- /wrapper -->
79
79
  <div class='footer quiet pad2 space-top1 center small'>
80
80
  Code coverage generated by
81
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
82
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
81
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
82
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
83
83
  </div>
84
- </div>
85
84
  <script src="../../prettify.js"></script>
86
85
  <script>
87
86
  window.onload = function () {
@@ -78,10 +78,9 @@ export default german;</pre></td></tr></table></pre>
78
78
  </div><!-- /wrapper -->
79
79
  <div class='footer quiet pad2 space-top1 center small'>
80
80
  Code coverage generated by
81
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
82
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
81
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
82
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
83
83
  </div>
84
- </div>
85
84
  <script src="../../prettify.js"></script>
86
85
  <script>
87
86
  window.onload = function () {
@@ -115,10 +115,9 @@
115
115
  </div><!-- /wrapper -->
116
116
  <div class='footer quiet pad2 space-top1 center small'>
117
117
  Code coverage generated by
118
- <a href="https://istanbul.js.org/" target="_blank" rel="noopener">istanbul</a>
119
- at Wed Dec 15 2021 17:41:09 GMT+0000 (Coordinated Universal Time)
118
+ <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
119
+ at Thu Jan 13 2022 12:08:19 GMT+0000 (Coordinated Universal Time)
120
120
  </div>
121
- </div>
122
121
  <script src="../../prettify.js"></script>
123
122
  <script>
124
123
  window.onload = function () {