@mapcomponents/react-maplibre 0.1.24 → 0.1.28

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 (112) hide show
  1. package/CHANGELOG.md +72 -7
  2. package/coverage/clover.xml +461 -489
  3. package/coverage/coverage-final.json +21 -20
  4. package/coverage/lcov-report/index.html +94 -79
  5. package/coverage/lcov-report/src/components/MapLibreMap/MapLibreMap.js.html +22 -22
  6. package/coverage/lcov-report/src/components/MapLibreMap/index.html +1 -1
  7. package/coverage/lcov-report/src/components/MlCreatePdfButton/MlCreatePdfButton.js.html +11 -11
  8. package/coverage/lcov-report/src/components/MlCreatePdfButton/index.html +11 -11
  9. package/coverage/lcov-report/src/components/MlFeatureEditor/MlFeatureEditor.js.html +1 -1
  10. package/coverage/lcov-report/src/components/MlFeatureEditor/index.html +1 -1
  11. package/coverage/lcov-report/src/components/MlFillExtrusionLayer/MlFillExtrusionLayer.js.html +4 -4
  12. package/coverage/lcov-report/src/components/MlFillExtrusionLayer/index.html +1 -1
  13. package/coverage/lcov-report/src/components/MlFollowGps/MlFollowGps.js.html +212 -77
  14. package/coverage/lcov-report/src/components/MlFollowGps/index.html +19 -19
  15. package/coverage/lcov-report/src/components/MlGPXViewer/MlGPXViewer.js.html +129 -165
  16. package/coverage/lcov-report/src/components/MlGPXViewer/gpxConverter.js.html +8 -8
  17. package/coverage/lcov-report/src/components/MlGPXViewer/index.html +20 -20
  18. package/coverage/lcov-report/src/components/MlGeoJsonLayer/MlGeoJsonLayer.js.html +45 -297
  19. package/coverage/lcov-report/src/components/MlGeoJsonLayer/index.html +19 -19
  20. package/coverage/lcov-report/src/components/MlImageMarkerLayer/MlImageMarkerLayer.js.html +1 -1
  21. package/coverage/lcov-report/src/components/MlImageMarkerLayer/index.html +1 -1
  22. package/coverage/lcov-report/src/components/MlLayer/MlLayer.js.html +2 -2
  23. package/coverage/lcov-report/src/components/MlLayer/index.html +1 -1
  24. package/coverage/lcov-report/src/components/MlLayerMagnify/MlLayerMagnify.js.html +4 -4
  25. package/coverage/lcov-report/src/components/MlLayerMagnify/index.html +1 -1
  26. package/coverage/lcov-report/src/components/MlLayerSwipe/MlLayerSwipe.js.html +3 -3
  27. package/coverage/lcov-report/src/components/MlLayerSwipe/index.html +1 -1
  28. package/coverage/lcov-report/src/components/MlLayerSwitcher/MlLayerSwitcher.js.html +1 -1
  29. package/coverage/lcov-report/src/components/MlLayerSwitcher/components/LayerBox.js.html +1 -1
  30. package/coverage/lcov-report/src/components/MlLayerSwitcher/components/index.html +1 -1
  31. package/coverage/lcov-report/src/components/MlLayerSwitcher/index.html +1 -1
  32. package/coverage/lcov-report/src/components/MlMarker/MlMarker.js.html +1 -1
  33. package/coverage/lcov-report/src/components/MlMarker/index.html +1 -1
  34. package/coverage/lcov-report/src/components/MlNavigationCompass/MlNavigationCompass.js.html +38 -104
  35. package/coverage/lcov-report/src/components/MlNavigationCompass/index.html +19 -19
  36. package/coverage/lcov-report/src/components/MlNavigationTools/MlNavigationTools.js.html +40 -139
  37. package/coverage/lcov-report/src/components/MlNavigationTools/index.html +15 -15
  38. package/coverage/lcov-report/src/components/MlOsmLayer/MlOsmLayer.js.html +32 -155
  39. package/coverage/lcov-report/src/components/MlOsmLayer/index.html +19 -19
  40. package/coverage/lcov-report/src/components/MlScaleReference/MlScaleReference.js.html +39 -198
  41. package/coverage/lcov-report/src/components/MlScaleReference/index.html +9 -9
  42. package/coverage/lcov-report/src/components/MlShareMapState/MlShareMapState.js.html +1 -1
  43. package/coverage/lcov-report/src/components/MlShareMapState/index.html +1 -1
  44. package/coverage/lcov-report/src/components/MlSpatialElevationProfile/MlSpatialElevationProfile.js.html +4 -4
  45. package/coverage/lcov-report/src/components/MlSpatialElevationProfile/index.html +1 -1
  46. package/coverage/lcov-report/src/components/MlThreeJsLayer/MlThreeJsLayer.js.html +1 -1
  47. package/coverage/lcov-report/src/components/MlThreeJsLayer/index.html +1 -1
  48. package/coverage/lcov-report/src/components/MlTransitionGeoJsonLayer/MlTransitionGeoJsonLayer.js.html +580 -0
  49. package/coverage/lcov-report/src/components/MlTransitionGeoJsonLayer/index.html +116 -0
  50. package/coverage/lcov-report/src/components/MlUseMapDebugger/MlUseMapDebugger.js.html +1 -1
  51. package/coverage/lcov-report/src/components/MlUseMapDebugger/index.html +1 -1
  52. package/coverage/lcov-report/src/components/MlVectorTileLayer/MlVectorTileLayer.js.html +3 -3
  53. package/coverage/lcov-report/src/components/MlVectorTileLayer/index.html +1 -1
  54. package/coverage/lcov-report/src/components/MlWmsFeatureInfoPopup/MlWmsFeatureInfoPopup.js.html +1 -1
  55. package/coverage/lcov-report/src/components/MlWmsFeatureInfoPopup/index.html +1 -1
  56. package/coverage/lcov-report/src/components/MlWmsLayer/MlWmsLayer.js.html +8 -11
  57. package/coverage/lcov-report/src/components/MlWmsLayer/index.html +1 -1
  58. package/coverage/lcov-report/src/components/MlWmsLoader/MlWmsLoader.js.html +1 -1
  59. package/coverage/lcov-report/src/components/MlWmsLoader/index.html +1 -1
  60. package/coverage/lcov-report/src/hooks/index.html +6 -6
  61. package/coverage/lcov-report/src/hooks/useMap.js.html +38 -26
  62. package/coverage/lcov-report/src/hooks/useMapState.js.html +47 -38
  63. package/coverage/lcov-report/src/hooks/useWms.js.html +2 -2
  64. package/coverage/lcov-report/src/i18n.js.html +1 -1
  65. package/coverage/lcov-report/src/index.html +1 -1
  66. package/coverage/lcov-report/src/translations/english.js.html +1 -1
  67. package/coverage/lcov-report/src/translations/german.js.html +1 -1
  68. package/coverage/lcov-report/src/translations/index.html +1 -1
  69. package/coverage/lcov.info +826 -882
  70. package/dist/index.esm.js +288 -517
  71. package/dist/index.esm.js.map +1 -1
  72. package/jsdoc.json +3 -3
  73. package/package.json +9 -9
  74. package/src/components/MapLibreMap/lib/MapLibreGlWrapper.js +5 -1
  75. package/src/components/MapLibreMap/lib/MapLibreGlWrapper.test.js +3 -3
  76. package/src/components/MlFeatureEditor/MlFeatureEditor.test.js +2 -2
  77. package/src/components/MlFollowGps/MlFollowGps.js +99 -54
  78. package/src/components/MlFollowGps/MlFollowGps.test.js +1 -1
  79. package/src/components/MlGPXViewer/MlGPXViewer.js +69 -81
  80. package/src/components/MlGeoJsonLayer/MlGeoJsonLayer.js +6 -90
  81. package/src/components/MlGeoJsonLayer/MlGeoJsonLayer.stories.js +4 -22
  82. package/src/components/MlGeoJsonLayer/util/getDefaultPaintPropsByType.js +2 -2
  83. package/src/components/MlNavigationCompass/MlNavigationCompass.js +17 -39
  84. package/src/components/MlNavigationCompass/MlNavigationCompass.test.js +3 -3
  85. package/src/components/MlNavigationTools/MlNavigationTools.js +30 -63
  86. package/src/components/MlOsmLayer/MlOsmLayer.js +15 -56
  87. package/src/components/MlOsmLayer/MlOsmLayer.stories.js +21 -10
  88. package/src/components/MlOsmLayer/MlOsmLayer.test.js +4 -4
  89. package/src/components/MlScaleReference/MlScaleReference.js +29 -82
  90. package/src/components/MlShareMapState/MlShareMapState.stories.js +1 -3
  91. package/src/components/MlThreeJsLayer/lib/GLTFLoader.js +2369 -2591
  92. package/src/components/MlTransitionGeoJsonLayer/MlTransitionGeoJsonLayer.doc.de.md +3 -0
  93. package/src/components/MlTransitionGeoJsonLayer/MlTransitionGeoJsonLayer.js +165 -0
  94. package/src/components/MlTransitionGeoJsonLayer/MlTransitionGeoJsonLayer.meta.json +15 -0
  95. package/src/components/MlTransitionGeoJsonLayer/MlTransitionGeoJsonLayer.stories.js +52 -0
  96. package/src/components/MlTransitionGeoJsonLayer/MlTransitionGeoJsonLayer.test.js +20 -0
  97. package/src/components/MlTransitionGeoJsonLayer/assets/sample_1.json +26 -0
  98. package/src/components/MlTransitionGeoJsonLayer/assets/sample_2.json +22 -0
  99. package/src/components/MlTransitionGeoJsonLayer/assets/sample_polygon_1.json +33 -0
  100. package/src/components/{MlGeoJsonLayer → MlTransitionGeoJsonLayer}/util/transitionFunctions.js +63 -97
  101. package/src/components/MlWmsLayer/MlWmsLayer.js +1 -2
  102. package/src/decorators/MapContextDecorator.js +5 -0
  103. package/src/decorators/MultiMapContextDecorator.js +6 -0
  104. package/src/hooks/useMap.js +8 -4
  105. package/src/hooks/useMapState.js +4 -1
  106. package/src/hooks/useWms.js +1 -1
  107. package/dist/b556faa3bc6829d2.png +0 -0
  108. package/src/components/MlFollowGps/assets/marker.png +0 -0
  109. package/src/decorators/EmptyMapContextDecorator.js +0 -25
  110. package/src/decorators/MapContext3DDecorator.js +0 -39
  111. package/src/decorators/MapContextDashboardDecorator.js +0 -19
  112. package/src/decorators/MapContextKlokantechBasicDecorator.js +0 -39
@@ -23,30 +23,30 @@
23
23
  <div class='clearfix'>
24
24
 
25
25
  <div class='fl pad1y space-right2'>
26
- <span class="strong">60.97% </span>
26
+ <span class="strong">53.12% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>25/41</span>
28
+ <span class='fraction'>17/32</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
- <span class="strong">37.5% </span>
33
+ <span class="strong">20% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>6/16</span>
35
+ <span class='fraction'>2/10</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
- <span class="strong">50% </span>
40
+ <span class="strong">57.14% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>4/8</span>
42
+ <span class='fraction'>4/7</span>
43
43
  </div>
44
44
 
45
45
 
46
46
  <div class='fl pad1y space-right2'>
47
- <span class="strong">60% </span>
47
+ <span class="strong">51.61% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>24/40</span>
49
+ <span class='fraction'>16/31</span>
50
50
  </div>
51
51
 
52
52
 
@@ -80,17 +80,17 @@
80
80
  </thead>
81
81
  <tbody><tr>
82
82
  <td class="file medium" data-value="MlNavigationCompass.js"><a href="MlNavigationCompass.js.html">MlNavigationCompass.js</a></td>
83
- <td data-value="60.97" class="pic medium">
84
- <div class="chart"><div class="cover-fill" style="width: 60%"></div><div class="cover-empty" style="width: 40%"></div></div>
83
+ <td data-value="53.12" class="pic medium">
84
+ <div class="chart"><div class="cover-fill" style="width: 53%"></div><div class="cover-empty" style="width: 47%"></div></div>
85
85
  </td>
86
- <td data-value="60.97" class="pct medium">60.97%</td>
87
- <td data-value="41" class="abs medium">25/41</td>
88
- <td data-value="37.5" class="pct low">37.5%</td>
89
- <td data-value="16" class="abs low">6/16</td>
90
- <td data-value="50" class="pct medium">50%</td>
91
- <td data-value="8" class="abs medium">4/8</td>
92
- <td data-value="60" class="pct medium">60%</td>
93
- <td data-value="40" class="abs medium">24/40</td>
86
+ <td data-value="53.12" class="pct medium">53.12%</td>
87
+ <td data-value="32" class="abs medium">17/32</td>
88
+ <td data-value="20" class="pct low">20%</td>
89
+ <td data-value="10" class="abs low">2/10</td>
90
+ <td data-value="57.14" class="pct medium">57.14%</td>
91
+ <td data-value="7" class="abs medium">4/7</td>
92
+ <td data-value="51.61" class="pct medium">51.61%</td>
93
+ <td data-value="31" class="abs medium">16/31</td>
94
94
  </tr>
95
95
 
96
96
  </tbody>
@@ -101,7 +101,7 @@
101
101
  <div class='footer quiet pad2 space-top1 center small'>
102
102
  Code coverage generated by
103
103
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
104
- at Sun Jan 23 2022 14:26:32 GMT+0000 (Coordinated Universal Time)
104
+ at Sun Feb 20 2022 13:39:56 GMT+0000 (Coordinated Universal Time)
105
105
  </div>
106
106
  <script src="../../../prettify.js"></script>
107
107
  <script>
@@ -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">2.63% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>0/50</span>
28
+ <span class='fraction'>1/38</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
33
  <span class="strong">0% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>0/44</span>
35
+ <span class='fraction'>0/38</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
40
  <span class="strong">0% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>0/12</span>
42
+ <span class='fraction'>0/10</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">2.94% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>0/46</span>
49
+ <span class='fraction'>1/34</span>
50
50
  </div>
51
51
 
52
52
 
@@ -197,43 +197,7 @@
197
197
  <a name='L132'></a><a href='#L132'>132</a>
198
198
  <a name='L133'></a><a href='#L133'>133</a>
199
199
  <a name='L134'></a><a href='#L134'>134</a>
200
- <a name='L135'></a><a href='#L135'>135</a>
201
- <a name='L136'></a><a href='#L136'>136</a>
202
- <a name='L137'></a><a href='#L137'>137</a>
203
- <a name='L138'></a><a href='#L138'>138</a>
204
- <a name='L139'></a><a href='#L139'>139</a>
205
- <a name='L140'></a><a href='#L140'>140</a>
206
- <a name='L141'></a><a href='#L141'>141</a>
207
- <a name='L142'></a><a href='#L142'>142</a>
208
- <a name='L143'></a><a href='#L143'>143</a>
209
- <a name='L144'></a><a href='#L144'>144</a>
210
- <a name='L145'></a><a href='#L145'>145</a>
211
- <a name='L146'></a><a href='#L146'>146</a>
212
- <a name='L147'></a><a href='#L147'>147</a>
213
- <a name='L148'></a><a href='#L148'>148</a>
214
- <a name='L149'></a><a href='#L149'>149</a>
215
- <a name='L150'></a><a href='#L150'>150</a>
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>
232
- <a name='L167'></a><a href='#L167'>167</a>
233
- <a name='L168'></a><a href='#L168'>168</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
234
- <span class="cline-any cline-neutral">&nbsp;</span>
235
- <span class="cline-any cline-neutral">&nbsp;</span>
236
- <span class="cline-any cline-neutral">&nbsp;</span>
200
+ <a name='L135'></a><a href='#L135'>135</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
237
201
  <span class="cline-any cline-neutral">&nbsp;</span>
238
202
  <span class="cline-any cline-neutral">&nbsp;</span>
239
203
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -245,12 +209,7 @@
245
209
  <span class="cline-any cline-neutral">&nbsp;</span>
246
210
  <span class="cline-any cline-neutral">&nbsp;</span>
247
211
  <span class="cline-any cline-neutral">&nbsp;</span>
248
- <span class="cline-any cline-neutral">&nbsp;</span>
249
- <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>
252
- <span class="cline-any cline-no">&nbsp;</span>
253
- <span class="cline-any cline-no">&nbsp;</span>
212
+ <span class="cline-any cline-yes">1x</span>
254
213
  <span class="cline-any cline-no">&nbsp;</span>
255
214
  <span class="cline-any cline-neutral">&nbsp;</span>
256
215
  <span class="cline-any cline-no">&nbsp;</span>
@@ -277,32 +236,7 @@
277
236
  <span class="cline-any cline-no">&nbsp;</span>
278
237
  <span class="cline-any cline-neutral">&nbsp;</span>
279
238
  <span class="cline-any cline-no">&nbsp;</span>
280
- <span class="cline-any cline-neutral">&nbsp;</span>
281
- <span class="cline-any cline-neutral">&nbsp;</span>
282
- <span class="cline-any cline-neutral">&nbsp;</span>
283
- <span class="cline-any cline-neutral">&nbsp;</span>
284
- <span class="cline-any cline-neutral">&nbsp;</span>
285
- <span class="cline-any cline-neutral">&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-neutral">&nbsp;</span>
290
- <span class="cline-any cline-no">&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-neutral">&nbsp;</span>
294
- <span class="cline-any cline-no">&nbsp;</span>
295
- <span class="cline-any cline-no">&nbsp;</span>
296
- <span class="cline-any cline-neutral">&nbsp;</span>
297
- <span class="cline-any cline-neutral">&nbsp;</span>
298
- <span class="cline-any cline-no">&nbsp;</span>
299
239
  <span class="cline-any cline-no">&nbsp;</span>
300
- <span class="cline-any cline-no">&nbsp;</span>
301
- <span class="cline-any cline-neutral">&nbsp;</span>
302
- <span class="cline-any cline-neutral">&nbsp;</span>
303
- <span class="cline-any cline-no">&nbsp;</span>
304
- <span class="cline-any cline-neutral">&nbsp;</span>
305
- <span class="cline-any cline-neutral">&nbsp;</span>
306
240
  <span class="cline-any cline-neutral">&nbsp;</span>
307
241
  <span class="cline-any cline-no">&nbsp;</span>
308
242
  <span class="cline-any cline-neutral">&nbsp;</span>
@@ -397,28 +331,20 @@
397
331
  <span class="cline-any cline-neutral">&nbsp;</span>
398
332
  <span class="cline-any cline-neutral">&nbsp;</span>
399
333
  <span class="cline-any cline-neutral">&nbsp;</span>
400
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React from "react";
401
- &nbsp;
402
- import {MapContext} from "@mapcomponents/react-core";
403
- import {useEffect, useRef, useContext, useState} from "react";
334
+ <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">import React, { useEffect, useState } from "react";
404
335
  import Button from "@mui/material/Button";
405
336
  import ButtonGroup from "@mui/material/ButtonGroup";
406
337
  import ControlPointIcon from "@mui/icons-material/ControlPoint";
407
338
  import RemoveCircleOutlineIcon from "@mui/icons-material/RemoveCircleOutline";
408
- //import ZoomOutIcon from "@mui/icons-material/ZoomOut";
409
- //import ZoomInIcon from "@mui/icons-material/ZoomIn";
410
339
  import GpsFixedIcon from "@mui/icons-material/GpsFixed";
411
- import {v4 as uuidv4} from "uuid";
412
340
  &nbsp;
413
341
  import MlNavigationCompass from "../MlNavigationCompass/MlNavigationCompass";
414
342
  import MlFollowGps from "../MlFollowGps/MlFollowGps";
415
343
  import useMediaQuery from "@mui/material/useMediaQuery";
344
+ import useMap from "../../hooks/useMap";
416
345
  &nbsp;
417
- const MlNavigationTools = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(p</span>rops) =&gt; {</span>
418
- const mapContext = <span class="cstat-no" title="statement not covered" >useContext(MapContext);</span>
419
- const initializedRef = <span class="cstat-no" title="statement not covered" >useRef(false);</span>
420
- const mapRef = <span class="cstat-no" title="statement not covered" >useRef(undefined);</span>
421
- const componentId = <span class="cstat-no" title="statement not covered" >useRef((props.idPrefix ? props.idPrefix : "MlComponentTemplate-") + uuidv4());</span>
346
+ const MlNavigationTools = <span class="fstat-no" title="function not covered" >(p</span>rops) =&gt; {
347
+ const mapHook = <span class="cstat-no" title="statement not covered" >useMap({ mapId: props.mapId, waitForLayer: props.insertBeforeLayer });</span>
422
348
  &nbsp;
423
349
  const [pitch, setPitch] = <span class="cstat-no" title="statement not covered" >useState(0);</span>
424
350
  const [locationAccessDenied, setLocationAccessDenied] = <span class="cstat-no" title="statement not covered" >useState(false);</span>
@@ -437,67 +363,42 @@ const MlNavigationTools = <span class="cstat-no" title="statement not covered" >
437
363
  ":hover": {
438
364
  backgroundColor: "#515151",
439
365
  },
440
- color: "#ececec"
366
+ color: "#ececec",
441
367
  };
442
368
  &nbsp;
443
369
  <span class="cstat-no" title="statement not covered" > useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
444
- let _componentId = <span class="cstat-no" title="statement not covered" >componentId.current;</span>
445
- &nbsp;
446
- <span class="cstat-no" title="statement not covered" > return <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
447
- // This is the cleanup function, it is called when this react component is removed from react-dom
448
- // try to remove anything this component has added to the MapLibre-gl instance
449
- // e.g.: remove the layer
450
- // mapContext.getMap(props.mapId).removeLayer(layerRef.current);
451
- // check for the existence of map.style before calling getLayer or getSource
370
+ <span class="cstat-no" title="statement not covered" > if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
452
371
  &nbsp;
453
- <span class="cstat-no" title="statement not covered" > if (mapRef.current) {</span>
454
- <span class="cstat-no" title="statement not covered" > mapRef.current.cleanup(_componentId);</span>
455
- <span class="cstat-no" title="statement not covered" > mapRef.current = undefined;</span>
456
- }
457
- <span class="cstat-no" title="statement not covered" > initializedRef.current = false;</span>
458
- };
459
- }, []);
460
- &nbsp;
461
- <span class="cstat-no" title="statement not covered" > useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
462
- <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>
463
- // the MapLibre-gl instance (mapContext.getMap(props.mapId)) is accessible here
464
- // initialize the layer and add it to the MapLibre-gl instance or do something else with it
465
- <span class="cstat-no" title="statement not covered" > initializedRef.current = true;</span>
466
- <span class="cstat-no" title="statement not covered" > mapRef.current = mapContext.getMap(props.mapId);</span>
467
- <span class="cstat-no" title="statement not covered" > mapRef.current.on(</span>
468
- "pitchend",
469
- <span class="fstat-no" title="function not covered" > ()</span> =&gt; {
470
- <span class="cstat-no" title="statement not covered" > setPitch(mapRef.current.getPitch());</span>
471
- },
472
- componentId.current
473
- );
474
- <span class="cstat-no" title="statement not covered" > setPitch(mapRef.current.getPitch());</span>
475
- }, [mapContext.mapIds, mapContext, props.mapId]);
372
+ <span class="cstat-no" title="statement not covered" > mapHook.map.on("pitchend", <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
373
+ <span class="cstat-no" title="statement not covered" > setPitch(mapHook.map.getPitch());</span>
374
+ });
375
+ <span class="cstat-no" title="statement not covered" > setPitch(mapHook.map.getPitch());</span>
376
+ }, [mapHook.map, props.mapId]);
476
377
  &nbsp;
477
378
  const zoomIn = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
478
- <span class="cstat-no" title="statement not covered" > if (!mapRef.current) <span class="cstat-no" title="statement not covered" >return;</span></span>
379
+ <span class="cstat-no" title="statement not covered" > if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
479
380
  &nbsp;
480
- <span class="cstat-no" title="statement not covered" > if (mapRef.current.transform._zoom + 0.5 &lt;= mapRef.current.transform._maxZoom) {</span>
481
- <span class="cstat-no" title="statement not covered" > mapRef.current.easeTo({zoom: mapRef.current.transform._zoom + 0.5});</span>
381
+ <span class="cstat-no" title="statement not covered" > if (mapHook.map.transform._zoom + 0.5 &lt;= mapHook.map.transform._maxZoom) {</span>
382
+ <span class="cstat-no" title="statement not covered" > mapHook.map.easeTo({ zoom: mapHook.map.transform._zoom + 0.5 });</span>
482
383
  }
483
384
  };
484
385
  &nbsp;
485
386
  const zoomOut = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
486
- <span class="cstat-no" title="statement not covered" > if (!mapRef.current) <span class="cstat-no" title="statement not covered" >return;</span></span>
387
+ <span class="cstat-no" title="statement not covered" > if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
487
388
  &nbsp;
488
- <span class="cstat-no" title="statement not covered" > if (mapRef.current.transform._zoom - 0.5 &gt;= mapRef.current.transform._minZoom) {</span>
489
- <span class="cstat-no" title="statement not covered" > mapRef.current.easeTo({zoom: mapRef.current.transform._zoom - 0.5});</span>
389
+ <span class="cstat-no" title="statement not covered" > if (mapHook.map.transform._zoom - 0.5 &gt;= mapHook.map.transform._minZoom) {</span>
390
+ <span class="cstat-no" title="statement not covered" > mapHook.map.easeTo({ zoom: mapHook.map.transform._zoom - 0.5 });</span>
490
391
  }
491
392
  };
492
393
  &nbsp;
493
394
  const adjustPitch = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
494
- <span class="cstat-no" title="statement not covered" > if (!mapRef.current) <span class="cstat-no" title="statement not covered" >return;</span></span>
395
+ <span class="cstat-no" title="statement not covered" > if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
495
396
  &nbsp;
496
397
  let targetPitch = <span class="cstat-no" title="statement not covered" >60;</span>
497
- <span class="cstat-no" title="statement not covered" > if (mapRef.current.getPitch() !== 0) {</span>
398
+ <span class="cstat-no" title="statement not covered" > if (mapHook.map.getPitch() !== 0) {</span>
498
399
  <span class="cstat-no" title="statement not covered" > targetPitch = 0;</span>
499
400
  }
500
- <span class="cstat-no" title="statement not covered" > mapRef.current.easeTo({pitch: targetPitch});</span>
401
+ <span class="cstat-no" title="statement not covered" > mapHook.map.easeTo({ pitch: targetPitch });</span>
501
402
  };
502
403
  &nbsp;
503
404
  const moveToCurrentLocation = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
@@ -505,7 +406,7 @@ const MlNavigationTools = <span class="cstat-no" title="statement not covered" >
505
406
  };
506
407
  &nbsp;
507
408
  const getLocationSuccess = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >(l</span>ocation) =&gt; {</span>
508
- <span class="cstat-no" title="statement not covered" > mapRef.current.setCenter([location.coords.longitude, location.coords.latitude]);</span>
409
+ <span class="cstat-no" title="statement not covered" > mapHook.map.setCenter([location.coords.longitude, location.coords.latitude]);</span>
509
410
  };
510
411
  &nbsp;
511
412
  const getLocationError = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
@@ -530,33 +431,33 @@ const MlNavigationTools = <span class="cstat-no" title="statement not covered" >
530
431
  position: "relative",
531
432
  height: mediaIsMobile ? "55px" : "45px",
532
433
  marginLeft: mediaIsMobile ? "3px" : "-5px",
533
- transform: mediaIsMobile ? "scale(1.6)" : "scale(1)"
434
+ transform: mediaIsMobile ? "scale(1.6)" : "scale(1)",
534
435
  }}
535
436
  backgroundStyle={{
536
437
  boxShadow: "0px 0px 18px rgba(0,0,0,.5)",
537
438
  }}
538
439
  /&gt;
539
- &lt;Button sx={{...buttonStyle, fontWeight: 600}} onClick={adjustPitch}&gt;
440
+ &lt;Button sx={{ ...buttonStyle, fontWeight: 600 }} onClick={adjustPitch}&gt;
540
441
  {pitch ? "2D" : "3D"}
541
442
  &lt;/Button&gt;
542
443
  &lt;Button sx={buttonStyle} onClick={moveToCurrentLocation} disabled={locationAccessDenied}&gt;
543
- &lt;GpsFixedIcon sx={{fontSize: mediaIsMobile ? "1.5em" : "1.2em"}}/&gt;
444
+ &lt;GpsFixedIcon sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }} /&gt;
544
445
  &lt;/Button&gt;
545
- &lt;MlFollowGps style={{...(<span class="fstat-no" title="function not covered" >({</span>color, ...rest}) =&gt; <span class="cstat-no" title="statement not covered" >rest)</span>(buttonStyle)}} /&gt;
446
+ &lt;MlFollowGps style={{ ...(<span class="fstat-no" title="function not covered" >({</span> color, ...rest }) =&gt; <span class="cstat-no" title="statement not covered" >rest)</span>(buttonStyle) }} /&gt;
546
447
  &lt;ButtonGroup
547
448
  orientation="vertical"
548
449
  sx={{
549
450
  width: "50px",
550
451
  border: "none",
551
- Button: {minWidth: "20px !important", border: "none", padding: 0},
552
- "Button:hover": {border: "none"},
452
+ Button: { minWidth: "20px !important", border: "none", padding: 0 },
453
+ "Button:hover": { border: "none" },
553
454
  }}
554
455
  &gt;
555
- &lt;Button sx={{...buttonStyle, color: "#ececec",}} onClick={zoomIn}&gt;
556
- &lt;ControlPointIcon sx={{fontSize: mediaIsMobile ? "1.5em" : "1.2em"}}/&gt;
456
+ &lt;Button sx={{ ...buttonStyle, color: "#ececec" }} onClick={zoomIn}&gt;
457
+ &lt;ControlPointIcon sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }} /&gt;
557
458
  &lt;/Button&gt;
558
- &lt;Button sx={{...buttonStyle, color: "#ececec",}} onClick={zoomOut}&gt;
559
- &lt;RemoveCircleOutlineIcon sx={{fontSize: mediaIsMobile ? "1.5em" : "1.2em"}}/&gt;
459
+ &lt;Button sx={{ ...buttonStyle, color: "#ececec" }} onClick={zoomOut}&gt;
460
+ &lt;RemoveCircleOutlineIcon sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }} /&gt;
560
461
  &lt;/Button&gt;
561
462
  &lt;/ButtonGroup&gt;
562
463
  &lt;/div&gt;
@@ -571,7 +472,7 @@ export default MlNavigationTools;
571
472
  <div class='footer quiet pad2 space-top1 center small'>
572
473
  Code coverage generated by
573
474
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
574
- at Sun Jan 23 2022 14:26:32 GMT+0000 (Coordinated Universal Time)
475
+ at Sun Feb 20 2022 13:39:56 GMT+0000 (Coordinated Universal Time)
575
476
  </div>
576
477
  <script src="../../../prettify.js"></script>
577
478
  <script>
@@ -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">2.63% </span>
27
27
  <span class="quiet">Statements</span>
28
- <span class='fraction'>0/50</span>
28
+ <span class='fraction'>1/38</span>
29
29
  </div>
30
30
 
31
31
 
32
32
  <div class='fl pad1y space-right2'>
33
33
  <span class="strong">0% </span>
34
34
  <span class="quiet">Branches</span>
35
- <span class='fraction'>0/44</span>
35
+ <span class='fraction'>0/38</span>
36
36
  </div>
37
37
 
38
38
 
39
39
  <div class='fl pad1y space-right2'>
40
40
  <span class="strong">0% </span>
41
41
  <span class="quiet">Functions</span>
42
- <span class='fraction'>0/12</span>
42
+ <span class='fraction'>0/10</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">2.94% </span>
48
48
  <span class="quiet">Lines</span>
49
- <span class='fraction'>0/46</span>
49
+ <span class='fraction'>1/34</span>
50
50
  </div>
51
51
 
52
52
 
@@ -80,17 +80,17 @@
80
80
  </thead>
81
81
  <tbody><tr>
82
82
  <td class="file low" data-value="MlNavigationTools.js"><a href="MlNavigationTools.js.html">MlNavigationTools.js</a></td>
83
- <td data-value="0" class="pic low">
84
- <div class="chart"><div class="cover-fill" style="width: 0%"></div><div class="cover-empty" style="width: 100%"></div></div>
83
+ <td data-value="2.63" class="pic low">
84
+ <div class="chart"><div class="cover-fill" style="width: 2%"></div><div class="cover-empty" style="width: 98%"></div></div>
85
85
  </td>
86
+ <td data-value="2.63" class="pct low">2.63%</td>
87
+ <td data-value="38" class="abs low">1/38</td>
86
88
  <td data-value="0" class="pct low">0%</td>
87
- <td data-value="50" class="abs low">0/50</td>
88
- <td data-value="0" class="pct low">0%</td>
89
- <td data-value="44" class="abs low">0/44</td>
90
- <td data-value="0" class="pct low">0%</td>
91
- <td data-value="12" class="abs low">0/12</td>
89
+ <td data-value="38" class="abs low">0/38</td>
92
90
  <td data-value="0" class="pct low">0%</td>
93
- <td data-value="46" class="abs low">0/46</td>
91
+ <td data-value="10" class="abs low">0/10</td>
92
+ <td data-value="2.94" class="pct low">2.94%</td>
93
+ <td data-value="34" class="abs low">1/34</td>
94
94
  </tr>
95
95
 
96
96
  </tbody>
@@ -101,7 +101,7 @@
101
101
  <div class='footer quiet pad2 space-top1 center small'>
102
102
  Code coverage generated by
103
103
  <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
104
- at Sun Jan 23 2022 14:26:32 GMT+0000 (Coordinated Universal Time)
104
+ at Sun Feb 20 2022 13:39:56 GMT+0000 (Coordinated Universal Time)
105
105
  </div>
106
106
  <script src="../../../prettify.js"></script>
107
107
  <script>