Fixing docs in response to react-map-gl named export change (#9427)

* Update using-with-react.md react-map-gl import

* Update using-with-mapbox.md with new react-map-gl import

* Update mapbox-layers-react.jsx with new react-map-gl import

* Update basemap.md with new react-map-gl import

* Update mapbox-overlay.md with new react-map-gl import

* Update docs/api-reference/carto/basemap.md

---------

Co-authored-by: Chris Gervang <[email protected]>

Author: ironicbrew

docs/api-reference/carto/basemap.md

@@ -22,7 +22,7 @@ npm install @deck.gl/core @deck.gl/layers @deck.gl/carto
 
 ```js
 import {DeckGL} from '@deck.gl/react';
-import {StaticMap} from 'react-map-gl';
+import {Map} from 'react-map-gl/maplibre';
 import {BASEMAP} from '@deck.gl/carto';
 <DeckGL initialViewState={INITIAL_VIEW_STATE} controller={true} layers={layers}>
   <StaticMap mapStyle={BASEMAP.POSITRON} />

docs/api-reference/mapbox/mapbox-overlay.md

@@ -50,7 +50,7 @@ map.once('load', () => {
 
 ```tsx
 import React from 'react';
-import {Map, useControl} from 'react-map-gl';
+import {Map, useControl} from 'react-map-gl/mapbox';
 import {MapboxOverlay} from '@deck.gl/mapbox';
 import {DeckProps} from '@deck.gl/core';
 import {ScatterplotLayer} from '@deck.gl/layers';

docs/developer-guide/base-maps/using-with-mapbox.md

@@ -86,7 +86,7 @@ map.once('load', () => {
 
 ```tsx
 import React from 'react';
-import {Map, useControl} from 'react-map-gl';
+import {Map, useControl} from 'react-map-gl/mapbox';
 import {MapboxOverlay} from '@deck.gl/mapbox';
 import {DeckProps} from '@deck.gl/core';
 import {ScatterplotLayer} from '@deck.gl/layers';
@@ -180,7 +180,7 @@ The reverse-controlled option is supported by the pre-built scripting bundle, an
 
 ```tsx
 import React from 'react';
-import {Map} from 'react-map-gl';
+import {Map} from 'react-map-gl/mapbox';
 import {DeckGL} from '@deck.gl/react';
 import {ScatterplotLayer} from '@deck.gl/layers';
 import 'mapbox-gl/dist/mapbox-gl.css';

docs/get-started/using-with-react.md

@@ -59,7 +59,7 @@ import {DeckGL} from '@deck.gl/react';
 import {MapViewState} from '@deck.gl/core';
 import {LineLayer} from '@deck.gl/layers';
 import {ZoomWidget} from '@deck.gl/react';
-import {Map} from 'react-map-gl';
+import {Map} from 'react-map-gl/mapbox';
 
 const INITIAL_VIEW_STATE: MapViewState = {
   longitude: -122.41669,

test/apps/mapbox-integration/mapbox-layers-react/mapbox-layers-react.jsx

@@ -6,7 +6,7 @@
 import React, {useState, useRef, useCallback} from 'react';
 import {createRoot} from 'react-dom/client';
 import DeckGL, {ScatterplotLayer, ArcLayer, TextLayer} from 'deck.gl';
-import {Map} from 'react-map-gl';
+import {Map} from 'react-map-gl/mapbox';
 
 import MapboxLayer from '../../../../modules/mapbox/src/mapbox-layer';