Update docs (#1796)

Co-authored-by: Kyle Barron <kyle@unfolded.ai>

docs/api-reference/geolocate-control.md

@@ -29,11 +29,12 @@ import * as React from 'react';
 import Map, {GeolocateControl} from 'react-map-gl';
 
 function App() {
-  const geolocateControlRef = React.useRef();
-
-  React.useEffect(() => {
-    geolocateControlRef.current.trigger();
-  }, [])
+  const geolocateControlRef = React.useCallback((ref) => {
+    if (ref) {
+      // Activate as soon as the control is loaded
+      ref.trigger();
+    }
+  }, []);
 
   return <Map><GeolocateControl ref={geolocateControlRef} /></Map>;
 }

docs/api-reference/map.md

@@ -32,13 +32,13 @@ import Map from 'react-map-gl';
 function App() {
   const mapRef = React.useRef();
 
-  React.useEffect(() => {
-    mapRef.current.on('styleimagemissing', () => {
+  const onMapLoad = React.useCallback(() => {
+    mapRef.current.on('move', () => {
       // do something
     });
-  }, [])
+  }, []);
 
-  return <Map ref={mapRef} />;
+  return <Map ref={mapRef} onLoad={onMapLoad} />;
 }
 ```
 

docs/get-started/get-started.md

@@ -59,6 +59,9 @@ Install your choice of fork along with react-map-gl, for example:
 
 ```bash
 npm install --save react-map-gl maplibre-gl
+
+# Add an empty placeholder for mapbox-gl to satisfy the peer dependency
+npm install --save mapbox-gl@npm:empty-npm-package@1.0.0
 ```
 
 Then override the `mapLib` prop of `Map`:

examples/get-started/maplibre/package.json

@@ -4,7 +4,7 @@
     "build": "webpack --mode=production -o ./dist"
   },
   "dependencies": {
-    "mapbox-gl": "^1.0.0",
+    "mapbox-gl": "npm:empty-npm-package@1.0.0",
     "maplibre-gl": "^2.0.0",
     "react": "^17.0.0",
     "react-dom": "^17.0.0",

yarn.lock

@@ -3389,9 +3389,9 @@ camelcase@^5.0.0, camelcase@^5.3.1:
   integrity sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==
 
 caniuse-lite@^1.0.30001286:
-  version "1.0.30001309"
-  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001309.tgz"
-  integrity sha512-Pl8vfigmBXXq+/yUz1jUwULeq9xhMJznzdc/xwl4WclDAuebcTHVefpz8lE/bMI+UN7TOkSSe7B7RnZd6+dzjA==
+  version "1.0.30001312"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001312.tgz"
+  integrity sha512-Wiz1Psk2MEK0pX3rUzWaunLTZzqS2JYZFzNKqAiJGiuxIjRPLgV6+VDPOg6lQOUxmDwhTlh198JsTTi8Hzw6aQ==
 
 caseless@~0.12.0:
   version "0.12.0"