janbaykara
commented
3 years ago 
Produced by:
// Usage
<MapGL>
<GeocodeControl position='top-right' accessToken={mapboxApiAccessToken} />
</MapG>
// Component
import React, { useContext, useEffect } from 'react'
import MapGL, { MapContext } from '@urbica/react-map-gl'
import mapboxgl from 'mapbox-gl';
import MapboxGeocoder from '@mapbox/mapbox-gl-geocoder';
function GeocodeControl ({ position, accessToken }: {
accessToken: string,
position?: 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right',
}) {
const map: mapboxgl.Map = useContext(MapContext)
useEffect(() => {
const control = new MapboxGeocoder({
accessToken,
mapboxgl
})
map?.addControl(
control,
position
)
return () => {
map?.removeControl(control)
}
}, [map, position])
return null
}More reading
Is your feature request related to a problem? Please describe. Need a search inside a map.. I found which can be outside a map
Describe the solution you'd like Search should be inside the map but there was nothing about geocoder/search
Describe alternatives you've considered I have used react-geocoder-autocomplete to search places now
Additional context Add any other context or screenshots about the feature request here.