Fix source loading condition (#2513)

Author: Pessimistress

examples/vite.config.local.js

@@ -9,8 +9,8 @@ export default defineConfig(async () => {
     resolve: {
       alias: {
         // Use root dependencies
-        'react-map-gl/mapbox': join(rootDir, './modules/main/src/mapbox.ts'),
-        'react-map-gl/maplibre': join(rootDir, './modules/main/src/maplibre.ts'),
+        'react-map-gl/mapbox': join(rootDir, './modules/react-mapbox/src'),
+        'react-map-gl/maplibre': join(rootDir, './modules/react-maplibre/src'),
         react: join(rootDir, './node_modules/react'),
         'react-dom': join(rootDir, './node_modules/react-dom')
       }

modules/react-mapbox/src/components/source.ts

@@ -25,7 +25,6 @@ export type SourceProps = (SourceSpecification | CanvasSourceSpecification) & {
 let sourceCounter = 0;
 
 function createSource(map: MapInstance, id: string, props: SourceProps) {
-  // @ts-ignore
   if (map.isStyleLoaded()) {
     const options = {...props};
     delete options.id;
@@ -89,10 +88,12 @@ export function Source(props: SourceProps) {
     if (map) {
       /* global setTimeout */
       const forceUpdate = () => setTimeout(() => setStyleLoaded(version => version + 1), 0);
+      map.on('load', forceUpdate);
       map.on('styledata', forceUpdate);
       forceUpdate();
 
       return () => {
+        map.off('load', forceUpdate);
         map.off('styledata', forceUpdate);
         // @ts-ignore
         if (map.style && map.style._loaded && map.getSource(id)) {