I need to enhance a React Admin supplier page to include a professional, interactive world map view that displays suppliers on a real map with proper geography. Requirements:

1. **Use a proper mapping library** (like Leaflet.js) - NOT custom SVG drawings
2. **Real world map** with accurate geography, countries, and coastlines
3. **Interactive controls**: pan, zoom, mouse wheel support
4. **Clickable supplier markers** that navigate to supplier detail pages
5. **Professional UI** with map legend and controls
6. **Toggle between list and map view**
7. **Position suppliers** by country with slight offsets to avoid overlap

The current supplier data has fields: Id, CompanyName, ContactName, City, Country, etc.

Please install the necessary mapping library dependencies and create a production-ready map component that looks professional like Google Maps, not a hand-drawn cartoon map.