@mapcomponents/react-maplibre 0.1.48 → 0.1.52

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

@@ -169,7 +169,17 @@
 <a name='L104'></a><a href='#L104'>104</a>
 <a name='L105'></a><a href='#L105'>105</a>
 <a name='L106'></a><a href='#L106'>106</a>
-<a name='L107'></a><a href='#L107'>107</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
+<a name='L107'></a><a href='#L107'>107</a>
+<a name='L108'></a><a href='#L108'>108</a>
+<a name='L109'></a><a href='#L109'>109</a>
+<a name='L110'></a><a href='#L110'>110</a>
+<a name='L111'></a><a href='#L111'>111</a>
+<a name='L112'></a><a href='#L112'>112</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>
@@ -285,6 +295,9 @@ import getDefaultPaintPropsByType from "./util/getDefaultPaintPropsByType";
 import getDefaulLayerTypeByGeometry from "./util/getDefaultLayerTypeByGeometry";
 import { Feature, FeatureCollection } from "@turf/turf";
 &nbsp;
+&nbsp;
+import { LineLayerSpecification, CircleLayerSpecification, FillLayerSpecification,MapLayerMouseEvent, LayerSpecification } from "maplibre-gl";
+&nbsp;
 type MlGeoJsonLayerProps = {
   /**
    * Id of the target MapLibre instance in mapContext
@@ -293,6 +306,8 @@ type MlGeoJsonLayerProps = {
   /**
    * Id of an existing layer in the mapLibre instance to help specify the layer order
    * This layer will be visually beneath the layer with the "insertBeforeLayer" id.
+   * This layer will not be added to the maplibre-gl instance until a layer with an 
+   * id that matches the value of insertBeforeLayer is created.
    */
   insertBeforeLayer?: string;
   /**
@@ -307,7 +322,7 @@ type MlGeoJsonLayerProps = {
    * Type of the layer that will be added to the MapLibre instance.
    * Possible values: "line", "circle", "fill"
    */
-  type?: string;
+  type?: "fill" | "line" | "circle";
   /**
    * Paint property object, that is passed to the addLayer call.
    * Possible props depend on the layer type.
@@ -315,7 +330,7 @@ type MlGeoJsonLayerProps = {
    * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#circle
    * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#fill
    */
-  paint?: any;
+  paint?: CircleLayerSpecification['paint'] | FillLayerSpecification['paint'] | LineLayerSpecification['paint'];
   /**
    * Layout property object, that is passed to the addLayer call.
    * Possible props depend on the layer type.
@@ -323,28 +338,28 @@ type MlGeoJsonLayerProps = {
    * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#circle
    * https://maplibre.org/maplibre-gl-js-docs/style-spec/layers/#fill
    */
-  layout?: any;
+  layout?: CircleLayerSpecification['layout'] | FillLayerSpecification['layout'] | LineLayerSpecification['layout'];
   /**
    * Javascript object that is spread into the addLayer commands first parameter.
    */
-  options?: any;
+  options?: CircleLayerSpecification | FillLayerSpecification | LineLayerSpecification;
   /**
    * Javascript object with optional properties "fill", "line", "circle" to override implicit layer type default paint properties.
    */
-  defaultPaintOverrides?: any;
+  defaultPaintOverrides?: { circle?: CircleLayerSpecification['paint'], fill?: FillLayerSpecification['paint'], line?: LineLayerSpecification['paint'] };
   /**
    * Hover event handler that is executed whenever a geometry rendered by this component is hovered.
    */
-  onHover?: Function;
+  onHover?: MapLayerMouseEvent;
   /**
    * Click event handler that is executed whenever a geometry rendered by this component is clicked.
    */
-  onClick?: Function;
+  onClick?: MapLayerMouseEvent;
   /**
    * Leave event handler that is executed whenever a geometry rendered by this component is
    * left/unhovered.
    */
-  onLeave?: Function;
+  onLeave?: MapLayerMouseEvent;
 }
 &nbsp;
 /**
@@ -368,7 +383,7 @@ const MlGeoJsonLayer = (props: MlGeoJsonLayerProps) =&gt; {
         ),
       layout: props.layout || {},
       ...props.options,
-      type: layerType,
+      type: layerType as LayerSpecification['type'],
     },
     insertBeforeLayer: props.insertBeforeLayer,
     onHover: props.onHover,
@@ -388,7 +403,7 @@ export default MlGeoJsonLayer;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlGeoJsonLayer/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -592,7 +592,7 @@ export default MlImageMarkerLayer;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Wed Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -101,7 +101,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Wed Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -214,7 +214,7 @@ export default MlLayer;
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Wed Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -101,7 +101,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at Wed Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -736,7 +736,7 @@ export default MlLayerMagnify;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayerMagnify/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -508,7 +508,7 @@ export default MlLayerSwipe;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayerSwipe/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayerSwitcher/MlLayerSwitcher.js.html

@@ -721,7 +721,7 @@ export default MlLayerSwitcher;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayerSwitcher/components/LayerBox.js.html

@@ -292,7 +292,7 @@ export default LayerBox;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayerSwitcher/components/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlLayerSwitcher/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -490,7 +490,7 @@ export default MlMarker;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlMarker/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -250,7 +250,7 @@ export default MlMeasureTool;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlMeasureTool/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -748,7 +748,7 @@ export default MlNavigationCompass;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

package/coverage/lcov-report/src/components/MlNavigationCompass/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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>

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

@@ -23,30 +23,30 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">3.12% </span>
+                <span class="strong">5.88% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>1/32</span>
+                <span class='fraction'>2/34</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>0/40</span>
+                <span class='fraction'>0/44</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">0% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>0/7</span>
+                <span class='fraction'>0/8</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">3.7% </span>
+                <span class="strong">6.89% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>1/27</span>
+                <span class='fraction'>2/29</span>
             </div>
         
             
@@ -202,7 +202,47 @@
 <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>
+<a name='L140'></a><a href='#L140'>140</a>
+<a name='L141'></a><a href='#L141'>141</a>
+<a name='L142'></a><a href='#L142'>142</a>
+<a name='L143'></a><a href='#L143'>143</a>
+<a name='L144'></a><a href='#L144'>144</a>
+<a name='L145'></a><a href='#L145'>145</a>
+<a name='L146'></a><a href='#L146'>146</a>
+<a name='L147'></a><a href='#L147'>147</a>
+<a name='L148'></a><a href='#L148'>148</a>
+<a name='L149'></a><a href='#L149'>149</a>
+<a name='L150'></a><a href='#L150'>150</a>
+<a name='L151'></a><a href='#L151'>151</a>
+<a name='L152'></a><a href='#L152'>152</a>
+<a name='L153'></a><a href='#L153'>153</a>
+<a name='L154'></a><a href='#L154'>154</a>
+<a name='L155'></a><a href='#L155'>155</a>
+<a name='L156'></a><a href='#L156'>156</a>
+<a name='L157'></a><a href='#L157'>157</a>
+<a name='L158'></a><a href='#L158'>158</a>
+<a name='L159'></a><a href='#L159'>159</a>
+<a name='L160'></a><a href='#L160'>160</a>
+<a name='L161'></a><a href='#L161'>161</a>
+<a name='L162'></a><a href='#L162'>162</a>
+<a name='L163'></a><a href='#L163'>163</a>
+<a name='L164'></a><a href='#L164'>164</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>
+<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>
@@ -250,21 +290,22 @@
 <span class="cline-any cline-no">&nbsp;</span>
 <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-no">&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-no">&nbsp;</span>
-<span class="cline-any cline-no">&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-no">&nbsp;</span>
+<span class="cline-any cline-no">&nbsp;</span>
 <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>
@@ -272,9 +313,6 @@
 <span class="cline-any cline-no">&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-no">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -315,6 +353,13 @@
 <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-no">&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>
@@ -337,6 +382,9 @@
 <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">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>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -351,13 +399,29 @@ import MlNavigationCompass from "../MlNavigationCompass/MlNavigationCompass";
 import MlFollowGps from "../MlFollowGps/MlFollowGps";
 import useMediaQuery from "@mui/material/useMediaQuery";
 import useMap from "../../hooks/useMap";
+import MlCenterPosition from "../MlCenterPosition/MlCenterPosition";
 &nbsp;
 interface MlNavigationToolsProps {
+  /**
+   * Id of the target MapLibre instance in mapContext
+   */
   mapId?: string;
+  /**
+   * The layerId of an existing layer this layer should be rendered visually beneath
+   * https://maplibre.org/maplibre-gl-js-docs/api/map/#map#addlayer - see "beforeId" property
+   */
   insertBeforeLayer?: string;
+  /**
+   * Show follow GPS button
+   */
+  showFollowGpsButton?: boolean;
+  /**
+   * Show center on current position button
+   */
+  showCenterLocationButton?: boolean;
 }
 &nbsp;
- /**
+/**
  * @component
  */
 const MlNavigationTools = <span class="fstat-no" title="function not covered" >(p</span>rops: MlNavigationToolsProps) =&gt; {
@@ -388,21 +452,22 @@ const MlNavigationTools = <span class="fstat-no" title="function not covered" >(
 <span class="cstat-no" title="statement not covered" >  useEffect(<span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
 <span class="cstat-no" title="statement not covered" >    if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    mapHook.map.on("pitchend", <span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
-<span class="cstat-no" title="statement not covered" >      if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
+<span class="cstat-no" title="statement not covered" >    mapHook.map.on(</span>
+      "pitchend",
+<span class="fstat-no" title="function not covered" >      ()</span> =&gt; {
+<span class="cstat-no" title="statement not covered" >        if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >      setPitch(mapHook.map.map.getPitch());</span>
-    },mapHook.componentId);
+<span class="cstat-no" title="statement not covered" >        setPitch(mapHook.map.map.getPitch());</span>
+      },
+      mapHook.componentId
+    );
 <span class="cstat-no" title="statement not covered" >    setPitch(mapHook.map.map.getPitch());</span>
   }, [mapHook.map, props.mapId]);
 &nbsp;
   const zoomIn = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
 <span class="cstat-no" title="statement not covered" >    if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    if (</span>
-      mapHook.map.map.transform._zoom + 0.5 &lt;=
-      mapHook.map.map.transform._maxZoom
-    ) {
+<span class="cstat-no" title="statement not covered" >    if (mapHook.map.map.transform._zoom + 0.5 &lt;= mapHook.map.map.transform._maxZoom) {</span>
 <span class="cstat-no" title="statement not covered" >      mapHook.map.map.easeTo({ zoom: mapHook.map.map.transform._zoom + 0.5 });</span>
     }
   };
@@ -410,10 +475,7 @@ const MlNavigationTools = <span class="fstat-no" title="function not covered" >(
   const zoomOut = <span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >()</span> =&gt; {</span>
 <span class="cstat-no" title="statement not covered" >    if (!mapHook.map) <span class="cstat-no" title="statement not covered" >return;</span></span>
 &nbsp;
-<span class="cstat-no" title="statement not covered" >    if (</span>
-      mapHook.map.map.transform._zoom - 0.5 &gt;=
-      mapHook.map.map.transform._minZoom
-    ) {
+<span class="cstat-no" title="statement not covered" >    if (mapHook.map.map.transform._zoom - 0.5 &gt;= mapHook.map.map.transform._minZoom) {</span>
 <span class="cstat-no" title="statement not covered" >      mapHook.map.map.easeTo({ zoom: mapHook.map.map.transform._zoom - 0.5 });</span>
     }
   };
@@ -451,10 +513,18 @@ const MlNavigationTools = <span class="fstat-no" title="function not covered" >(
           boxShadow: "0px 0px 18px rgba(0,0,0,.5)",
         }}
       /&gt;
-      &lt;Button sx={{ ...buttonStyle, fontSize:mediaIsMobile?'1.4em':'1em', fontWeight: 600 }} onClick={adjustPitch}&gt;
+      &lt;Button
+        sx={{ ...buttonStyle, fontSize: mediaIsMobile ? "1.4em" : "1em", fontWeight: 600 }}
+        onClick={adjustPitch}
+      &gt;
         {pitch ? "2D" : "3D"}
       &lt;/Button&gt;
+      {props.showFollowGpsButton &amp;&amp;
       &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;
+      }
+      {props.showCenterLocationButton &amp;&amp;
+      &lt;MlCenterPosition 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;
+      }
       &lt;ButtonGroup
         orientation="vertical"
         sx={{
@@ -465,20 +535,22 @@ const MlNavigationTools = <span class="fstat-no" title="function not covered" >(
         }}
       &gt;
         &lt;Button sx={{ ...buttonStyle, color: "#ececec" }} onClick={zoomIn}&gt;
-          &lt;ControlPointIcon
-            sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }}
-          /&gt;
+          &lt;ControlPointIcon sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }} /&gt;
         &lt;/Button&gt;
         &lt;Button sx={{ ...buttonStyle, color: "#ececec" }} onClick={zoomOut}&gt;
-          &lt;RemoveCircleOutlineIcon
-            sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }}
-          /&gt;
+          &lt;RemoveCircleOutlineIcon sx={{ fontSize: mediaIsMobile ? "1.5em" : "1.2em" }} /&gt;
         &lt;/Button&gt;
       &lt;/ButtonGroup&gt;
     &lt;/div&gt;
   );
 };
 &nbsp;
+MlNavigationTools.defaultProps = {
+  mapId: undefined,
+  showFollowGpsButton: true,
+  showCenterLocationButton: false,
+};
+&nbsp;
 export default MlNavigationTools;
 &nbsp;</pre></td></tr></table></pre>
 
@@ -487,7 +559,7 @@ export default MlNavigationTools;
             <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 Jun 15 2022 17:08:11 GMT+0000 (Coordinated Universal Time)
+                at Tue Jul 19 2022 06:50:01 GMT+0000 (Coordinated Universal Time)
             </div>
         <script src="../../../prettify.js"></script>
         <script>