@maplibre/maplibre-react-native 11.0.0-beta.10 → 11.0.0-beta.12

package/android/src/main/java/org/maplibre/reactnative/components/annotations/pointannotation/MLRNPointAnnotation.kt

@@ -4,6 +4,7 @@ import android.content.Context
 import android.graphics.Bitmap
 import android.graphics.PointF
 import android.view.View
+import android.view.ViewGroup
 import com.facebook.react.bridge.ReactContext
 import com.facebook.react.uimanager.UIManagerHelper
 import org.maplibre.android.geometry.LatLng
@@ -26,18 +27,17 @@ class MLRNPointAnnotation(
     private var mMap: MapLibreMap? = null
     private var mMapView: MLRNMapView? = null
 
-    private val mHasChildren = false
-
     private var mCoordinate: Point? = null
 
-    public var mapLibreId: String? = null
-    public var title: String? = null
+    var mapLibreId: String? = null
+    var title: String? = null
     private var mSnippet: String? = null
 
     private var mAnchor: FloatArray? = null
     private var mOffset: FloatArray? = null
-    private val mIsSelected = false
     private var mDraggable = false
+    var selected = false
+        private set
 
     private var mChildView: View? = null
     private var mChildBitmap: Bitmap? = null
@@ -49,7 +49,7 @@ class MLRNPointAnnotation(
     private var mCalloutBitmapId: String? = null
 
     companion object {
-        const val MARKER_IMAGE_ID: String = "MARKER_IMAGE_ID"
+        const val DEFAULT_MARKER: String = "DEFAULT_MARKER"
     }
 
     private val surfaceId: Int
@@ -115,7 +115,7 @@ class MLRNPointAnnotation(
         // Return children in consistent order: child view first, then callout
         return when {
             index == 0 && mChildView != null -> mChildView
-            index == 0 && mChildView == null && mCalloutView != null -> mCalloutView
+            index == 0 && mCalloutView != null -> mCalloutView
             index == 1 && mChildView != null && mCalloutView != null -> mCalloutView
             else -> null
         }
@@ -139,6 +139,10 @@ class MLRNPointAnnotation(
             }
             addBitmapToStyle(mCalloutBitmap, mCalloutBitmapId)
         }
+
+        if (selected) {
+            mMapView?.selectAnnotation(this)
+        }
     }
 
     override fun removeFromMap(mapView: MLRNMapView) {
@@ -201,16 +205,12 @@ class MLRNPointAnnotation(
         refreshBitmap(v, v.left, v.top, v.right, v.bottom)
     }
 
-    fun getLatLng(): LatLng? = GeoJSONUtils.toLatLng(mCoordinate)
-
     val annotationId: Long? get() = mAnnotation?.id
 
     fun setSnippet(snippet: String?) {
         mSnippet = snippet
     }
 
-    fun getCalloutView(): View? = mCalloutView
-
     fun setLngLat(lngLat: DoubleArray?) {
         if (lngLat == null || lngLat.size < 2) {
             return
@@ -260,21 +260,37 @@ class MLRNPointAnnotation(
         }
     }
 
-    fun getMarker(): Symbol? = mAnnotation
-
-    fun onSelect(shouldSendEvent: Boolean) {
-        if (mCalloutView != null) {
-            makeCallout()
+    fun setSelectedAnnotation(selected: Boolean) {
+        if (mMapView != null && mAnnotation != null) {
+            if (selected) {
+                mMapView?.selectAnnotation(this)
+            } else {
+                mMapView?.deselectAnnotation(this)
+            }
+        } else {
+            this.selected = selected
         }
-        if (shouldSendEvent) {
+    }
+
+    fun onSelect() {
+        if (!selected) {
+            selected = true
+            if (mCalloutView != null) {
+                makeCallout()
+            }
+
             emitEvent("onSelected")
         }
     }
 
     fun onDeselect() {
-        emitEvent("onDeselected")
-        if (mCalloutSymbol != null) {
-            mMapView?.getSymbolManager()?.delete(mCalloutSymbol)
+        if (selected) {
+            selected = false
+            if (mCalloutSymbol != null) {
+                mMapView?.getSymbolManager()?.delete(mCalloutSymbol)
+            }
+
+            emitEvent("onDeselected")
         }
     }
 
@@ -325,12 +341,12 @@ class MLRNPointAnnotation(
     }
 
     private fun updateIconImage() {
-        if (mChildView != null) {
+        if (mChildView != null && ((mChildView as? ViewGroup)?.childCount ?: 0) > 0) {
             if (mChildBitmapId != null) {
                 mAnnotation?.iconImage = mChildBitmapId
             }
         } else {
-            mAnnotation?.iconImage = MARKER_IMAGE_ID
+            mAnnotation?.iconImage = DEFAULT_MARKER
             mAnnotation?.iconAnchor = "bottom"
         }
     }
@@ -418,8 +434,8 @@ class MLRNPointAnnotation(
     private fun getScreenPosition(latLng: LatLng): PointF? {
         val screenPos = mMap?.projection?.toScreenLocation(latLng)
         val density = getDisplayDensity()
-        screenPos?.x = screenPos?.x?.div(density) ?: 0f
-        screenPos?.y = screenPos?.y?.div(density) ?: 0f
+        screenPos?.x = screenPos.x.div(density)
+        screenPos?.y = screenPos.y.div(density)
         return screenPos
     }
 

package/android/src/main/java/org/maplibre/reactnative/components/annotations/pointannotation/MLRNPointAnnotationManager.kt

@@ -82,7 +82,8 @@ class MLRNPointAnnotationManager(
         annotation: MLRNPointAnnotation,
         selected: Boolean,
     ) {
-        // Selection is handled by the map view
+        annotation
+            .setSelectedAnnotation(selected)
     }
 
     @ReactProp(name = "lngLat")

package/android/src/main/java/org/maplibre/reactnative/components/mapview/MLRNMapView.kt

@@ -156,9 +156,6 @@ open class MLRNMapView(
 
     private var symbolManager: SymbolManager? = null
 
-    private var activePointAnnotationAnnotationId: Long? = null
-    private var pointAnnotationClicked = false
-
     private var markerViewManager: MarkerViewManager? = null
     private var offscreenAnnotationViewContainer: ViewGroup? = null
 
@@ -264,10 +261,6 @@ open class MLRNMapView(
                     }
 
                     is MLRNPointAnnotation -> {
-                        if (child.feature.annotationId == activePointAnnotationAnnotationId) {
-                            activePointAnnotationAnnotationId = null
-                        }
-
                         child.feature.mapLibreId?.let { pointAnnotations.remove(it) }
                     }
 
@@ -324,18 +317,11 @@ open class MLRNMapView(
         mapLibreMap!!.moveCamera(cameraUpdate, callback)
     }
 
-    fun getPointAnnotationByMarkerID(markerID: Long): MLRNPointAnnotation? {
-        for (key in pointAnnotations.keys) {
-            val annotation = pointAnnotations[key]
-
-            if (annotation != null && markerID == annotation.annotationId) {
-                return annotation
-            }
+    fun getPointAnnotationByAnnotationId(annotationId: Long): MLRNPointAnnotation? =
+        pointAnnotations.values.find {
+            it.annotationId == annotationId
         }
 
-        return null
-    }
-
     fun getSymbolManager(): SymbolManager = symbolManager!!
 
     interface FoundLayerCallback {
@@ -465,28 +451,24 @@ open class MLRNMapView(
         symbolManager = SymbolManager(this, this.mapLibreMap!!, style)
         symbolManager!!.setIconAllowOverlap(true)
         symbolManager!!.addClickListener { symbol ->
-            onMarkerClick(symbol)
+            onPointAnnotationClick(symbol)
             true
         }
         symbolManager!!.addDragListener(
             object : OnSymbolDragListener {
                 override fun onAnnotationDragStarted(symbol: Symbol) {
-                    pointAnnotationClicked = true
-                    val selectedMarkerID = symbol.id
-                    val annotation = getPointAnnotationByMarkerID(selectedMarkerID)
+                    val selectedPointAnnotationID = symbol.id
+                    val annotation = getPointAnnotationByAnnotationId(selectedPointAnnotationID)
                     annotation?.onDragStart()
                 }
 
                 override fun onAnnotationDrag(symbol: Symbol) {
-                    val selectedMarkerID = symbol.id
-                    val annotation = getPointAnnotationByMarkerID(selectedMarkerID)
+                    val annotation = getPointAnnotationByAnnotationId(symbol.id)
                     annotation?.onDrag()
                 }
 
                 override fun onAnnotationDragFinished(symbol: Symbol) {
-                    pointAnnotationClicked = false
-                    val selectedMarkerID = symbol.id
-                    val annotation = getPointAnnotationByMarkerID(selectedMarkerID)
+                    val annotation = getPointAnnotationByAnnotationId(symbol.id)
                     annotation?.onDragEnd()
                 }
             },
@@ -547,17 +529,7 @@ open class MLRNMapView(
     }
 
     override fun onMapClick(latLng: LatLng): Boolean {
-        if (pointAnnotationClicked) {
-            pointAnnotationClicked = false
-        }
-
-        if (activePointAnnotationAnnotationId != null) {
-            val active =
-                pointAnnotations.values.find { it.annotationId == activePointAnnotationAnnotationId }
-            if (active != null) {
-                deselectAnnotation(active)
-            }
-        }
+        pointAnnotations.values.find { it.selected }?.let { deselectAnnotation(it) }
 
         val screenPoint = mapLibreMap!!.projection.toScreenLocation(latLng)
 
@@ -607,10 +579,6 @@ open class MLRNMapView(
     }
 
     override fun onMapLongClick(latLng: LatLng): Boolean {
-        if (pointAnnotationClicked) {
-            pointAnnotationClicked = false
-        }
-
         val screenPoint = mapLibreMap!!.projection.toScreenLocation(latLng)
 
         if (markerViewManager?.isPointInsideMarker(screenPoint) == true) {
@@ -626,42 +594,24 @@ open class MLRNMapView(
         return false
     }
 
-    fun onMarkerClick(symbol: Symbol) {
-        pointAnnotationClicked = true
-        val selectedMarkerID = symbol.id
-
-        var activeAnnotation: MLRNPointAnnotation? = null
-        var nextActiveAnnotation: MLRNPointAnnotation? = null
-
-        for (key in pointAnnotations.keys) {
-            val pointAnnotation = pointAnnotations[key]
-            val currentAnnotationId = pointAnnotation!!.annotationId
+    fun onPointAnnotationClick(nextSymbol: Symbol) {
+        val nextSelectedPointAnnotation =
+            getPointAnnotationByAnnotationId(nextSymbol.id) ?: return
 
-            if (activePointAnnotationAnnotationId == currentAnnotationId) {
-                activeAnnotation = pointAnnotation
-            }
-
-            if (selectedMarkerID == currentAnnotationId && activePointAnnotationAnnotationId != currentAnnotationId) {
-                nextActiveAnnotation = pointAnnotation
-            }
-        }
-
-        if (activeAnnotation != null) {
-            deselectAnnotation(activeAnnotation)
-        }
-
-        if (nextActiveAnnotation != null) {
-            selectAnnotation(nextActiveAnnotation)
+        if (!nextSelectedPointAnnotation.selected) {
+            selectAnnotation(nextSelectedPointAnnotation)
         }
     }
 
-    fun selectAnnotation(annotation: MLRNPointAnnotation) {
-        activePointAnnotationAnnotationId = annotation.annotationId
-        annotation.onSelect(true)
+    fun selectAnnotation(nextSelectedPointAnnotation: MLRNPointAnnotation) {
+        pointAnnotations.values
+            .filter { it.selected && it !== nextSelectedPointAnnotation }
+            .forEach { it.onDeselect() }
+
+        nextSelectedPointAnnotation.onSelect()
     }
 
     fun deselectAnnotation(annotation: MLRNPointAnnotation) {
-        activePointAnnotationAnnotationId = null
         annotation.onDeselect()
     }
 
@@ -1359,7 +1309,7 @@ open class MLRNMapView(
         }
 
     private fun getPressableSourceWithHighestZIndex(sources: MutableList<MLRNPressableSource<*>>?): MLRNPressableSource<*>? {
-        if (sources == null || sources.isEmpty()) {
+        if (sources.isNullOrEmpty()) {
             return null
         }
 
@@ -1412,10 +1362,10 @@ open class MLRNMapView(
      */
     private fun setUpImage(loadedStyle: Style) {
         loadedStyle.addImage(
-            "MARKER_IMAGE_ID",
+            MLRNPointAnnotation.DEFAULT_MARKER,
             BitmapFactory.decodeResource(
                 this.resources,
-                R.drawable.red_marker,
+                R.drawable.default_marker,
             ),
         )
     }

package/ios/components/annotations/point-annotation/MLRNPointAnnotation.m

@@ -1,6 +1,7 @@
 #import "MLRNPointAnnotation.h"
 #import <React/UIView+React.h>
 #import "MLRNMapTouchEvent.h"
+#import "MLRNMapView.h"
 #import "MLRNUtils.h"
 
 const float CENTER_X_OFFSET_BASE = -0.5f;
@@ -75,6 +76,9 @@ const float CENTER_Y_OFFSET_BASE = -0.5f;
   _reactSelected = reactSelected;
 
   if (_map != nil) {
+    if ([_map isKindOfClass:[MLRNMapView class]]) {
+      ((MLRNMapView *)_map).annotationSelected = YES;
+    }
     if (_reactSelected) {
       [_map selectAnnotation:self animated:NO completionHandler:nil];
     } else {
@@ -120,8 +124,22 @@ const float CENTER_Y_OFFSET_BASE = -0.5f;
   BOOL hasCustomChildren = (self.reactSubviews.count > 0) || (self.customChildCount > 0);
 
   if (!hasCustomChildren) {
-    // default pin view
-    return nil;
+    // Replicate MLNMapView's to allow unified tap/selection behavior.
+    NSBundle *mapLibreBundle = [NSBundle bundleForClass:[MLNMapView class]];
+    UIImage *pinImage = [UIImage imageNamed:@"default_marker"
+                                   inBundle:mapLibreBundle
+              compatibleWithTraitCollection:nil];
+
+    UIImageView *pinImageView = [[UIImageView alloc] initWithImage:pinImage];
+    [pinImageView sizeToFit];
+
+    MLNAnnotationView *defaultView = [[MLNAnnotationView alloc] initWithReuseIdentifier:nil];
+    defaultView.bounds = pinImageView.bounds;
+    [defaultView addSubview:pinImageView];
+    defaultView.centerOffset = CGVectorMake(0, 0);
+    defaultView.enabled = YES;
+    [defaultView addGestureRecognizer:customViewTap];
+    return defaultView;
   } else {
     // custom view
     self.enabled = YES;
@@ -143,6 +161,9 @@ const float CENTER_Y_OFFSET_BASE = -0.5f;
 }
 
 - (void)_handleTap:(UITapGestureRecognizer *)recognizer {
+  if ([_map isKindOfClass:[MLRNMapView class]]) {
+    ((MLRNMapView *)_map).annotationSelected = YES;
+  }
   [_map selectAnnotation:self animated:NO completionHandler:nil];
 }
 

package/ios/components/images/MLRNImageLoader.h

@@ -0,0 +1,27 @@
+#import <MapLibre/MapLibre.h>
+#import <React/RCTImageLoaderProtocol.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+/**
+ * Singleton that exposes the image loader obtained from the TurboModule registry.
+ */
+@interface MLRNImageLoader : NSObject
+
++ (instancetype)sharedInstance;
+
+@property (nonatomic, strong, nullable) id<RCTImageLoaderProtocol> imageLoader;
+
++ (void)fetchImage:(NSString *)url
+             scale:(double)scale
+               sdf:(BOOL)sdf
+          callback:(RCTImageLoaderCompletionBlock)callback;
+
++ (void)fetchImages:(MLNStyle *)style
+            objects:(NSDictionary<NSString *, id> *)objects
+        forceUpdate:(BOOL)forceUpdate
+           callback:(void (^)(void))callback;
+
+@end
+
+NS_ASSUME_NONNULL_END

package/ios/components/images/MLRNImageLoader.m

@@ -0,0 +1,85 @@
+#import "MLRNImageLoader.h"
+#import "MLRNImageQueue.h"
+
+#import <React/RCTLog.h>
+
+@implementation MLRNImageLoader
+
++ (instancetype)sharedInstance {
+  static MLRNImageLoader *_instance = nil;
+  static dispatch_once_t onceToken;
+  dispatch_once(&onceToken, ^{
+    _instance = [[MLRNImageLoader alloc] init];
+  });
+  return _instance;
+}
+
++ (void)fetchImage:(NSString *)url
+             scale:(double)scale
+               sdf:(BOOL)sdf
+          callback:(RCTImageLoaderCompletionBlock)callback {
+  [MLRNImageQueue.sharedInstance addImage:url
+                                    scale:scale
+                                      sdf:sdf
+                              imageLoader:[MLRNImageLoader sharedInstance].imageLoader
+                        completionHandler:callback];
+}
+
++ (void)fetchImages:(MLNStyle *)style
+            objects:(NSDictionary<NSString *, id> *)objects
+        forceUpdate:(BOOL)forceUpdate
+           callback:(void (^)(void))callback {
+  if (objects == nil) {
+    callback();
+    return;
+  }
+
+  NSArray<NSString *> *imageNames = objects.allKeys;
+  if (imageNames.count == 0) {
+    callback();
+    return;
+  }
+
+  __block NSUInteger imagesLeftToLoad = imageNames.count;
+  __weak MLNStyle *weakStyle = style;
+
+  void (^imageLoadedBlock)(void) = ^{
+    imagesLeftToLoad--;
+
+    if (imagesLeftToLoad == 0) {
+      callback();
+    }
+  };
+
+  for (NSString *imageName in imageNames) {
+    UIImage *foundImage = forceUpdate ? nil : [style imageForName:imageName];
+
+    if (forceUpdate || foundImage == nil) {
+      NSDictionary *image = objects[imageName];
+      BOOL hasScale =
+          [image isKindOfClass:[NSDictionary class]] && ([image objectForKey:@"scale"] != nil);
+      BOOL hasSdf =
+          [image isKindOfClass:[NSDictionary class]] && ([image objectForKey:@"sdf"] != nil);
+      double scale = hasScale ? [[image objectForKey:@"scale"] doubleValue] : 1.0;
+      BOOL sdf = hasSdf ? [[image objectForKey:@"sdf"] boolValue] : NO;
+      [MLRNImageQueue.sharedInstance addImage:objects[imageName]
+                                        scale:scale
+                                          sdf:sdf
+                                  imageLoader:[MLRNImageLoader sharedInstance].imageLoader
+                            completionHandler:^(NSError *error, UIImage *img) {
+                              if (!img) {
+                                RCTLogWarn(@"Failed to fetch image: %@ error:%@", imageName, error);
+                              } else {
+                                dispatch_async(dispatch_get_main_queue(), ^{
+                                  [weakStyle setImage:img forName:imageName];
+                                  imageLoadedBlock();
+                                });
+                              }
+                            }];
+    } else {
+      imageLoadedBlock();
+    }
+  }
+}
+
+@end

package/ios/components/images/MLRNImageQueue.h

@@ -1,5 +1,5 @@
 #import <Foundation/Foundation.h>
-#import <React/RCTImageLoader.h>
+#import <React/RCTImageLoaderProtocol.h>
 
 @interface MLRNImageQueue : NSObject
 
@@ -9,7 +9,7 @@
 - (void)addImage:(NSString *)imageURL
                 scale:(double)scale
                   sdf:(Boolean)sdf
-               bridge:(RCTBridge *)bridge
+          imageLoader:(id<RCTImageLoaderProtocol>)imageLoader
     completionHandler:(RCTImageLoaderCompletionBlock)handler;
 
 @end

package/ios/components/images/MLRNImageQueue.m

@@ -34,10 +34,10 @@
 - (void)addImage:(NSString *)imageURL
                 scale:(double)scale
                   sdf:(Boolean)sdf
-               bridge:(RCTBridge *)bridge
+          imageLoader:(id<RCTImageLoaderProtocol>)imageLoader
     completionHandler:(RCTImageLoaderCompletionBlock)handler {
   MLRNImageQueueOperation *operation = [[MLRNImageQueueOperation alloc] init];
-  operation.bridge = bridge;
+  operation.imageLoader = imageLoader;
   operation.urlRequest = [RCTConvert NSURLRequest:imageURL];
   operation.sdf = sdf;
   operation.completionHandler = handler;

package/ios/components/images/MLRNImageQueueOperation.h

@@ -1,8 +1,8 @@
-#import <React/RCTImageLoader.h>
+#import <React/RCTImageLoaderProtocol.h>
 
 @interface MLRNImageQueueOperation : NSBlockOperation
 
-@property (nonatomic, weak) RCTBridge *bridge;
+@property (nonatomic, weak) id<RCTImageLoaderProtocol> imageLoader;
 @property (nonatomic, copy) RCTImageLoaderCompletionBlock completionHandler;
 @property (nonatomic, copy) NSURLRequest *urlRequest;
 @property (nonatomic) Boolean sdf;

package/ios/components/images/MLRNImageQueueOperation.m

@@ -1,5 +1,7 @@
 #import "MLRNImageQueueOperation.h"
 
+#import <React/RCTImageLoader.h>
+
 typedef NS_ENUM(NSInteger, MLRNImageQueueOperationState) {
   IOState_Initial,
   IOState_CancelledDoNotExecute,
@@ -101,9 +103,7 @@ typedef NS_ENUM(NSInteger, MLRNImageQueueOperationState) {
   __weak MLRNImageQueueOperation *weakSelf = self;
   dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
     [weakSelf
-        setCancellationBlock:[[weakSelf.bridge moduleForName:@"ImageLoader"
-                                       lazilyLoadIfNecessary:YES]
-                                 loadImageWithURLRequest:weakSelf.urlRequest
+        setCancellationBlock:[weakSelf.imageLoader loadImageWithURLRequest:weakSelf.urlRequest
                                  size:CGSizeZero
                                  scale:weakSelf.scale
                                  clipped:YES

package/ios/components/images/MLRNImages.h

@@ -1,4 +1,3 @@
-#import <React/RCTBridge.h>
 #import <React/RCTComponent.h>
 #import <UIKit/UIKit.h>
 
@@ -8,8 +7,6 @@
 
 @interface MLRNImages : UIView
 
-@property (nonatomic, weak) RCTBridge *bridge;
-
 @property (nonatomic, strong) MLRNMapView *_Nullable map;
 @property (nonatomic, strong, nonnull) NSMutableArray<id<RCTComponent>> *reactSubviews;
 

package/ios/components/images/MLRNImages.m

@@ -2,6 +2,7 @@
 #import <React/UIView+React.h>
 #import "MLRNEvent.h"
 #import "MLRNEventTypes.h"
+#import "MLRNImageLoader.h"
 #import "MLRNMapView.h"
 #import "MLRNUtils.h"
 
@@ -169,12 +170,11 @@ static UIImage *_placeHolderImage;
 
   if (missingImages.count > 0) {
     // forceUpdate to ensure the placeholder images are updated
-    [MLRNUtils fetchImages:_bridge
-                     style:self.map.style
-                   objects:missingImages
-               forceUpdate:true
-                  callback:^{
-                  }];
+    [MLRNImageLoader fetchImages:self.map.style
+                         objects:missingImages
+                     forceUpdate:true
+                        callback:^{
+                        }];
   }
 }
 

package/ios/components/images/MLRNImagesComponentView.mm

@@ -7,7 +7,6 @@
 
 #import "RCTFabricComponentsPlugins.h"
 
-#import <React/RCTBridge+Private.h>
 #import <React/RCTConversions.h>
 #import "MLRNFollyConvert.h"
 #import "MLRNImages.h"
@@ -37,8 +36,6 @@ using namespace facebook::react;
 - (void)prepareView {
   _view = [[MLRNImages alloc] init];
 
-  _view.bridge = [RCTBridge currentBridge];
-
   // Capture weak self reference to prevent retain cycle
   __weak __typeof__(self) weakSelf = self;
 

package/ios/components/images/MLRNImagesModule.h

@@ -0,0 +1,6 @@
+#import <MapLibreReactNativeSpec/MapLibreReactNativeSpec.h>
+
+#import <React/RCTInitializing.h>
+
+@interface MLRNImagesModule : NSObject <NativeImagesModuleSpec, RCTInitializing>
+@end

package/ios/components/images/MLRNImagesModule.mm

@@ -0,0 +1,23 @@
+#import "MLRNImagesModule.h"
+#import "MLRNImageLoader.h"
+
+#import <MapLibreReactNativeSpec/MapLibreReactNativeSpec.h>
+
+@implementation MLRNImagesModule
+
+@synthesize moduleRegistry = _moduleRegistry;
+
++ (NSString *)moduleName {
+  return @"MLRNImagesModule";
+}
+
+- (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:
+    (const facebook::react::ObjCTurboModule::InitParams &)params {
+  return std::make_shared<facebook::react::NativeImagesModuleSpecJSI>(params);
+}
+
+- (void)initialize {
+  [MLRNImageLoader sharedInstance].imageLoader = [_moduleRegistry moduleForName:"ImageLoader"];
+}
+
+@end

package/ios/components/layer/MLRNLayer.h

@@ -1,4 +1,3 @@
-#import <React/RCTBridge.h>
 #import <UIKit/UIKit.h>
 
 @class MLRNMapView;
@@ -7,8 +6,6 @@
 
 @interface MLRNLayer : UIView
 
-@property (nonatomic, weak, nullable) RCTBridge *bridge;
-
 @property (nonatomic, strong, nullable) MLNStyleLayer *styleLayer;
 @property (nonatomic, strong, nullable) MLNStyle *style;
 @property (nonatomic, weak, nullable) MLRNMapView *map;

package/ios/components/layer/MLRNLayer.m

@@ -211,7 +211,6 @@
 
 - (void)addStyles {
   MLRNStyle *style = [[MLRNStyle alloc] initWithMLNStyle:self.style];
-  style.bridge = self.bridge;
 
   BOOL (^isValid)(void) = ^{
     return [self isAddedToMap];