@rnmapbox/maps 10.1.0-beta.8 → 10.1.0-rc.0

package/ios/RNMBX/RNMBXMapViewComponentView.mm

@@ -1,6 +1,7 @@
 #ifdef RCT_NEW_ARCH_ENABLED
 
 #import "RNMBXMapViewComponentView.h"
+#import "RNMBXFabricHelpers.h"
 
 #import <React/RCTConversions.h>
 #import <React/RCTFabricComponentsPlugins.h>
@@ -10,8 +11,6 @@
 #import <react/renderer/components/rnmapbox_maps_specs/Props.h>
 #import <react/renderer/components/rnmapbox_maps_specs/RCTComponentViewHelpers.h>
 
-#import "rnmapbox_maps-Swift.h.pre"
-
 using namespace facebook::react;
 
 @interface RNMBXMapViewComponentView () <RCTRNMBXMapViewViewProtocol>
@@ -42,6 +41,7 @@ using namespace facebook::react;
 @implementation RNMBXMapViewComponentView {
     RNMBXMapView *_view;
     RNMBXMapViewEventDispatcher *_eventDispatcher;
+    CGRect _frame;
 }
 
 - (instancetype)initWithFrame:(CGRect)frame
@@ -49,8 +49,16 @@ using namespace facebook::react;
   if (self = [super initWithFrame:frame]) {
     static const auto defaultProps = std::make_shared<const RNMBXMapViewProps>();
     _props = defaultProps;
+    _frame = frame;
+    [self prepareView];
+  }
+  return self;
+}
+
+- (void)prepareView
+{
     _eventDispatcher = [[RNMBXMapViewEventDispatcher alloc] initWithComponentView:self];
-      _view =  [[RNMBXMapView alloc] initWithFrame:frame eventDispatcher:_eventDispatcher];
+      _view =  [[RNMBXMapView alloc] initWithFrame:_frame eventDispatcher:_eventDispatcher];
       
       // just need to pass something, it won't really be used on fabric, but it's used to create events (it won't impact sending them)
       _view.reactTag = @-1;
@@ -62,7 +70,7 @@ using namespace facebook::react;
           __typeof__(self) strongSelf = weakSelf;
 
           if (strongSelf != nullptr && strongSelf->_eventEmitter != nullptr) {
-              const auto [type, json] = [RNMBXMapViewComponentView stringifyEventData:event];
+              const auto [type, json] = RNMBXStringifyEventData(event);
               std::dynamic_pointer_cast<const facebook::react::RNMBXMapViewEventEmitter>(strongSelf->_eventEmitter)->onPress({type, json});
             }
       }];
@@ -71,7 +79,7 @@ using namespace facebook::react;
           __typeof__(self) strongSelf = weakSelf;
 
           if (strongSelf != nullptr && strongSelf->_eventEmitter != nullptr) {
-              const auto [type, json] = [RNMBXMapViewComponentView stringifyEventData:event];
+              const auto [type, json] = RNMBXStringifyEventData(event);
               std::dynamic_pointer_cast<const facebook::react::RNMBXMapViewEventEmitter>(strongSelf->_eventEmitter)->onLongPress({type, json});
             }
       }];
@@ -80,111 +88,149 @@ using namespace facebook::react;
           __typeof__(self) strongSelf = weakSelf;
 
           if (strongSelf != nullptr && strongSelf->_eventEmitter != nullptr) {
-              const auto [type, json] = [RNMBXMapViewComponentView stringifyEventData:event];
+              const auto [type, json] = RNMBXStringifyEventData(event);
               std::dynamic_pointer_cast<const facebook::react::RNMBXMapViewEventEmitter>(strongSelf->_eventEmitter)->onMapChange({type, json});
             }
       }];
-
     self.contentView = _view;
-  }
+}
 
-  return self;
+- (void)mountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView index:(NSInteger)index
+{
+    if ([childComponentView isKindOfClass:[RCTViewComponentView class]] && ((RCTViewComponentView *)childComponentView).contentView) {
+        [_view addToMap:((RCTViewComponentView *)childComponentView).contentView];
+    }
+    [super mountChildComponentView:childComponentView index:index];
+}
+
+- (void)unmountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView index:(NSInteger)index
+{
+    if ([childComponentView isKindOfClass:[RCTViewComponentView class]] && ((RCTViewComponentView *)childComponentView).contentView) {
+        [_view removeFromMap:((RCTViewComponentView *)childComponentView).contentView];
+    }
+    [super unmountChildComponentView:childComponentView index:index];
 }
 
 - (void)dispatchCameraChangedEvent:(NSDictionary*)event {
-    const auto [type, json] = [RNMBXMapViewComponentView stringifyEventData:event];
+    const auto [type, json] = RNMBXStringifyEventData(event);
     std::dynamic_pointer_cast<const facebook::react::RNMBXMapViewEventEmitter>(self->_eventEmitter)->onCameraChanged({type, json});
 }
 
-+ (std::tuple<std::string, std::string>)stringifyEventData:(NSDictionary*)event {
-    std::string type = [event valueForKey:@"type"] == nil ? "" : std::string([[event valueForKey:@"type"] UTF8String]);
-    std::string json = "{}";
+#pragma mark - RCTComponentViewProtocol
 
-    NSError *error;
-    NSData *jsonData = nil;
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+  return concreteComponentDescriptorProvider<RNMBXMapViewComponentDescriptor>();
+}
 
-    if ([event valueForKey:@"payload"] != nil) {
-        jsonData = [NSJSONSerialization dataWithJSONObject:[event valueForKey:@"payload"]
-                                                           options:0
-                                                             error:&error];
+- (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &)oldProps
+{
+  const auto &newProps = static_cast<const RNMBXMapViewProps &>(*props);
+    id attributionEnabled = RNMBXConvertFollyDynamicToId(newProps.attributionEnabled);
+    if (attributionEnabled != nil) {
+        _view.reactAttributionEnabled = attributionEnabled;
     }
 
-    if (jsonData) {
-        json = std::string([[[NSString alloc] initWithData:jsonData encoding:NSUTF8StringEncoding] UTF8String]);
+    id attributionPosition = RNMBXConvertFollyDynamicToId(newProps.attributionPosition);
+    if (attributionPosition != nil) {
+        _view.reactAttributionPosition = attributionPosition;
     }
 
-    return {type, json};
-}
-
-- (NSDictionary*)convertPositionToDictionary:(const folly::dynamic*)position {
-    NSMutableDictionary<NSString*, NSNumber*>* result = [[NSMutableDictionary alloc] init];
-
-    if (!position->isNull()) {
-        for (auto& pair : position->items()) {
-            NSString* key = [NSString stringWithUTF8String:pair.first.getString().c_str()];
-            NSNumber* value = [[NSNumber alloc] initWithInt:pair.second.getDouble()];
-            [result setValue:value forKey:key];
-        }
+    id logoEnabled = RNMBXConvertFollyDynamicToId(newProps.logoEnabled);
+    if (logoEnabled != nil) {
+        _view.reactLogoEnabled = logoEnabled;
     }
 
-    return result;
-}
+    id logoPosition = RNMBXConvertFollyDynamicToId(newProps.logoPosition);
+    if (logoPosition != nil) {
+        _view.reactLogoPosition = logoPosition;
+    }
 
-- (NSDictionary*)convertLocalizeLabels:(const RNMBXMapViewLocalizeLabelsStruct*)labels {
-    NSMutableDictionary* result = [[NSMutableDictionary alloc] init];
-    NSMutableArray* ids = [[NSMutableArray alloc] init];
+    id compassEnabled = RNMBXConvertFollyDynamicToId(newProps.compassEnabled);
+    if (compassEnabled != nil) {
+        _view.reactCompassEnabled = compassEnabled;
+    }
 
-    [result setValue:[NSString stringWithUTF8String:labels->locale.c_str()] forKey:@"locale"];
+    id compassFadeWhenNorth = RNMBXConvertFollyDynamicToId(newProps.compassFadeWhenNorth);
+    if (compassFadeWhenNorth != nil) {
+        _view.reactCompassFadeWhenNorth = compassFadeWhenNorth;
+    }
 
-    for (auto& layerId : labels->layerIds) {
-        NSString* value = [NSString stringWithUTF8String:layerId.c_str()];
-        [ids addObject:value];
+    id compassPosition = RNMBXConvertFollyDynamicToId(newProps.compassPosition);
+    if (compassPosition != nil) {
+        _view.reactCompassPosition = compassPosition;
     }
 
-    [result setValue:ids forKey:@"layerIds"];
+    id compassViewPosition = RNMBXConvertFollyDynamicToId(newProps.compassViewPosition);
+    if (compassViewPosition != nil) {
+        _view.reactCompassViewPosition = [(NSNumber *)compassViewPosition doubleValue];
+    }
 
-    return result;
-}
+    NSDictionary<NSString *, NSNumber *> *compassViewMargins = RNMBXConvertFollyDynamicToId(newProps.compassViewMargins);
+    if (compassViewMargins != nil) {
+        CGPoint margins = CGPointMake([compassViewMargins[@"x"] doubleValue], [compassViewMargins[@"y"] doubleValue]);
+        _view.reactCompassViewMargins = margins;
+    }
 
+    id compassImage = RNMBXConvertFollyDynamicToId(newProps.compassImage);
+    if (compassImage != nil) {
+        _view.reactCompassImage = compassImage;
+    }
 
-#pragma mark - RCTComponentViewProtocol
+    id scaleBarEnabled = RNMBXConvertFollyDynamicToId(newProps.scaleBarEnabled);
+    if (scaleBarEnabled != nil) {
+        _view.reactScaleBarEnabled = scaleBarEnabled;
+    }
 
-+ (ComponentDescriptorProvider)componentDescriptorProvider
-{
-  return concreteComponentDescriptorProvider<RNMBXMapViewComponentDescriptor>();
-}
+    id scaleBarPosition = RNMBXConvertFollyDynamicToId(newProps.scaleBarPosition);
+    if (scaleBarPosition != nil) {
+        _view.reactScaleBarPosition = scaleBarPosition;
+    }
 
-- (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &)oldProps
-{
-  const auto &newProps = *std::static_pointer_cast<const RNMBXMapViewProps>(props);
-    [_view setReactAttributionEnabled:newProps.attributionEnabled];
-    [_view setReactAttributionPosition:[self convertPositionToDictionary:&newProps.attributionPosition]];
+    id zoomEnabled = RNMBXConvertFollyDynamicToId(newProps.zoomEnabled);
+    if (zoomEnabled != nil) {
+        _view.reactZoomEnabled = zoomEnabled;
+    }
 
-    [_view setReactLogoEnabled:newProps.logoEnabled];
-    [_view setReactLogoPosition:[self convertPositionToDictionary:&newProps.logoPosition]];
+    id scrollEnabled = RNMBXConvertFollyDynamicToId(newProps.scrollEnabled);
+    if (scrollEnabled != nil) {
+        _view.reactScrollEnabled = scrollEnabled;
+    }
 
-    [_view setReactCompassEnabled:newProps.compassEnabled];
-    [_view setReactCompassFadeWhenNorth:newProps.compassFadeWhenNorth];
-    [_view setReactCompassPosition:[self convertPositionToDictionary:&newProps.compassPosition]];
-    [_view setReactCompassViewPosition:newProps.compassViewPosition];
-    [_view setReactCompassViewMargins:CGPointMake(newProps.compassViewMargins.x, newProps.compassViewMargins.y)];
-    [_view setReactCompassImage:[NSString stringWithUTF8String:newProps.compassImage.c_str()]];
+    id rotateEnabled = RNMBXConvertFollyDynamicToId(newProps.rotateEnabled);
+    if (rotateEnabled != nil) {
+        _view.reactRotateEnabled = rotateEnabled;
+    }
 
-    [_view setReactScaleBarEnabled:newProps.scaleBarEnabled];
-    [_view setReactScaleBarPosition:[self convertPositionToDictionary:&newProps.scaleBarPosition]];
+    id pitchEnabled = RNMBXConvertFollyDynamicToId(newProps.pitchEnabled);
+    if (pitchEnabled != nil) {
+        _view.reactPitchEnabled = pitchEnabled;
+    }
 
-    [_view setReactZoomEnabled:newProps.zoomEnabled];
-    [_view setReactScrollEnabled:newProps.scrollEnabled];
-    [_view setReactRotateEnabled:newProps.rotateEnabled];
-    [_view setReactPitchEnabled:newProps.pitchEnabled];
+    id projection = RNMBXConvertFollyDynamicToId(newProps.projection);
+    if (projection != nil) {
+        _view.reactProjection = projection;
+    }
 
-    [_view setReactProjection:newProps.projection == RNMBXMapViewProjection::Mercator ? @"mercator" : @"globe"];
-    [_view setReactStyleURL:[NSString stringWithUTF8String:newProps.styleURL.c_str()]];
+    id localizeLabels = RNMBXConvertFollyDynamicToId(newProps.localizeLabels);
+    if (localizeLabels != nil) {
+        _view.reactLocalizeLabels = localizeLabels;
+    }
 
-    if (!newProps.localizeLabels.locale.empty()) {
-        [_view setReactLocalizeLabels:[self convertLocalizeLabels:&newProps.localizeLabels]];
+    id styleURL = RNMBXConvertFollyDynamicToId(newProps.styleURL);
+    if (styleURL != nil) {
+        _view.reactStyleURL = styleURL;
     }
+
   [super updateProps:props oldProps:oldProps];
+
+  [_view didSetProps:@[]];
+}
+
+- (void)prepareForRecycle
+{
+    [super prepareForRecycle];
+    [self prepareView];
 }
 
 @end

package/ios/RNMBX/RNMBXMapViewManager.m

@@ -29,6 +29,8 @@ RCT_REMAP_VIEW_PROPERTY(pitchEnabled, reactPitchEnabled, BOOL)
 RCT_REMAP_VIEW_PROPERTY(projection, reactProjection, NSString)
 RCT_REMAP_VIEW_PROPERTY(localizeLabels, reactLocalizeLabels, NSDictionary)
 
+RCT_REMAP_VIEW_PROPERTY(gestureSettings, reactGestureSettings, NSDictionary)
+
 RCT_REMAP_VIEW_PROPERTY(styleURL, reactStyleURL, NSString)
 RCT_REMAP_VIEW_PROPERTY(onPress, reactOnPress, RCTBubblingEventBlock)
 RCT_REMAP_VIEW_PROPERTY(onLongPress, reactOnLongPress, RCTBubblingEventBlock)

package/ios/RNMBX/RNMBXMapViewManager.swift

@@ -246,5 +246,4 @@ extension RNMBXMapViewManager {
           }
         }
     }
-
 }

package/ios/RNMBX/RNMBXMapViewModule.mm

@@ -7,7 +7,7 @@
 #import "RNMBXMapViewComponentView.h"
 #endif // RCT_NEW_ARCH_ENABLED
 
-#import "rnmapbox_maps-Swift.h.pre"
+#import "rnmapbox_maps-Swift.pre.h"
 
 @implementation RNMBXMapViewModule
 
@@ -139,7 +139,6 @@ RCT_EXPORT_METHOD(querySourceFeatures:(nonnull NSNumber*)viewRef sourceId:(NSStr
     } reject:reject methodName:@"querySourceFeatures"];
 }
 
-
 // Thanks to this guard, we won't compile this code when we build for the old architecture.
 #ifdef RCT_NEW_ARCH_ENABLED
 - (std::shared_ptr<facebook::react::TurboModule>)getTurboModule:

package/ios/RNMBX/RNMBXMarkerView.swift

@@ -22,7 +22,6 @@ class RNMBXMarkerViewParentViewAnnotation : UIView {
     if actSize.width != size.width || actSize.height != size.height {
       let dx = ((size.width/2.0) - newOffset.dx) - ((actSize.width/2.0) - oldOffset.dx)
       let dy = ((size.height/2.0) + newOffset.dy) - ((actSize.height/2.0) + oldOffset.dy)
-      print(" => size=\(size) actSize=\(actSize) newOffset=\(newOffset) oldOffset=\(oldOffset)  dx=\(dx) dy=\(dy)")
       var frame = self.frame
       frame = frame.offsetBy(dx: -dx, dy: -dy)
       frame.size = size
@@ -31,7 +30,8 @@ class RNMBXMarkerViewParentViewAnnotation : UIView {
   }
 }
 
-class RNMBXMarkerView: UIView, RNMBXMapComponent {
+@objc(RNMBXMarkerView)
+public class RNMBXMarkerView: UIView, RNMBXMapComponent {
   // MARK: - Instance variables
   
   static let key = "RNMBXMarkerView"
@@ -42,25 +42,25 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
   
   var didAddToMap = false
   
-  @objc var coordinate: String? {
+  @objc public var coordinate: String? {
     didSet {
       update()
     }
   }
   
-  @objc var anchor: [String: NSNumber]? {
+  @objc public var anchor: [String: NSNumber]? {
     didSet {
       update()
     }
   }
   
-  @objc var allowOverlap: Bool = false {
+  @objc public var allowOverlap: Bool = false {
     didSet {
       update()
     }
   }
   
-  @objc var isSelected: Bool = false {
+  @objc public var isSelected: Bool = false {
     didSet {
       update()
     }
@@ -69,7 +69,7 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
   // MARK: - Derived variables
   
   var annotationManager: ViewAnnotationManager? {
-    self.map?.viewAnnotations
+    self.map?.mapView?.viewAnnotations
   }
 
   var point: Point? {
@@ -115,7 +115,7 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
   
   // MARK: - React methods
   
-  override var isHidden: Bool {
+    public override var isHidden: Bool {
     get {
       return super.isHidden
     }
@@ -124,7 +124,7 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
     }
   }
   
-  override func reactSetFrame(_ frame: CGRect) {
+    public override func reactSetFrame(_ frame: CGRect) {
     let prev = self.frame
     var next = frame
     
@@ -140,18 +140,24 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
 
     super.reactSetFrame(next)
     if frameDidChange {
-      annotationView.updateSize(next.size, oldOffset:calcOffset(size: prev.size), newOffset: calcOffset(size: next.size))
+        updateAnnotationViewSize(next, prev)
     }
     addOrUpdate()
   }
-  
-  override func insertReactSubview(_ subview: UIView, at atIndex: Int) {
-    super.insertReactSubview(subview, at: atIndex)
+    
+    public override func insertReactSubview(_ subview: UIView, at atIndex: Int) {
+      super.insertReactSubview(subview, at: atIndex)
+    }
+    
+    public override func removeReactSubview(_ subview: UIView) {
+      super.removeReactSubview(subview)
+    }
+
+  @objc public func updateAnnotationViewSize(_ next: CGRect, _ prev: CGRect) {
+    annotationView.updateSize(next.size, oldOffset:calcOffset(size: prev.size), newOffset: calcOffset(size: next.size))
   }
   
-  override func removeReactSubview(_ subview: UIView) {
-    super.removeReactSubview(subview)
-  }
+    
   
   func waitForStyleLoad() -> Bool {
     true
@@ -159,7 +165,7 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
 
   // MARK: - Create, update, and remove methods
 
-    private func addOrUpdate() {
+   @objc public func addOrUpdate() {
       if didAddToMap {
         update()
       } else {
@@ -253,7 +259,7 @@ class RNMBXMarkerView: UIView, RNMBXMapComponent {
     return result
   }
 
-  @objc override func didMoveToSuperview() {
+    @objc public override func didMoveToSuperview() {
     // React tends to add back us to our original superview,
     // https://github.com/facebook/react-native/blob/11ece22fc6955d169def9ef9f2809c24bc457ba8/React/Views/UIView%2BReact.m#L172-L177
     // fix that if we see that

package/ios/RNMBX/RNMBXMarkerViewComponentView.h

@@ -0,0 +1,15 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+
+#import <UIKit/UIKit.h>
+
+#import <React/RCTUIManager.h>
+#import <React/RCTViewComponentView.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface RNMBXMarkerViewComponentView : RCTViewComponentView
+@end
+
+NS_ASSUME_NONNULL_END
+
+#endif // RCT_NEW_ARCH_ENABLED

package/ios/RNMBX/RNMBXMarkerViewComponentView.mm

@@ -0,0 +1,131 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+
+#import "RNMBXMarkerViewComponentView.h"
+#import "RNMBXFabricHelpers.h"
+
+#import <React/RCTConversions.h>
+#import <React/RCTFabricComponentsPlugins.h>
+
+#import <react/renderer/components/rnmapbox_maps_specs/ComponentDescriptors.h>
+#import <react/renderer/components/rnmapbox_maps_specs/EventEmitters.h>
+#import <react/renderer/components/rnmapbox_maps_specs/Props.h>
+#import <react/renderer/components/rnmapbox_maps_specs/RCTComponentViewHelpers.h>
+
+using namespace facebook::react;
+
+@interface RNMBXMarkerViewComponentView () <RCTRNMBXMarkerViewViewProtocol>
+@end
+
+@implementation RNMBXMarkerViewComponentView {
+    RNMBXMarkerView *_view;
+}
+
+- (instancetype)initWithFrame:(CGRect)frame
+{
+  if (self = [super initWithFrame:frame]) {
+    static const auto defaultProps = std::make_shared<const RNMBXMarkerViewProps>();
+    _props = defaultProps;
+      [self prepareView];
+  }
+
+  return self;
+}
+
+- (void)prepareView
+{
+  _view =  [[RNMBXMarkerView alloc] init];
+  self.contentView = _view;
+}
+
+- (void)prepareForRecycle
+{
+    [super prepareForRecycle];
+    [self prepareView];
+}
+
+- (void)mountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView index:(NSInteger)index
+{
+    if ([childComponentView isKindOfClass:[RCTViewComponentView class]] && ((RCTViewComponentView *)childComponentView).contentView != nil) {
+        [_view insertSubview:((RCTViewComponentView *)childComponentView).contentView atIndex:index];
+    } else {
+        [_view insertSubview:childComponentView atIndex:index];
+    }
+}
+
+- (void)unmountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView index:(NSInteger)index
+{
+    if ([childComponentView isKindOfClass:[RCTViewComponentView class]] && ((RCTViewComponentView *)childComponentView).contentView != nil) {
+        [((RCTViewComponentView *)childComponentView).contentView removeFromSuperview];
+    } else {
+        [childComponentView removeFromSuperview];
+    }
+}
+
+#pragma mark - RCTComponentViewProtocol
+
++ (ComponentDescriptorProvider)componentDescriptorProvider
+{
+  return concreteComponentDescriptorProvider<RNMBXMarkerViewComponentDescriptor>();
+}
+
+- (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &)oldProps
+{
+  const auto &newProps = static_cast<const RNMBXMarkerViewProps &>(*props);
+    
+    id coordinate = RNMBXConvertFollyDynamicToId(newProps.coordinate);
+    if (coordinate != nil) {
+        _view.coordinate = coordinate;
+    }
+    id anchor = RNMBXConvertFollyDynamicToId(newProps.anchor);
+    if (anchor != nil) {
+        _view.anchor = anchor;
+    }
+    id allowOverlap = RNMBXConvertFollyDynamicToId(newProps.allowOverlap);
+    if (allowOverlap != nil) {
+        _view.allowOverlap = allowOverlap;
+    }
+    id isSelected = RNMBXConvertFollyDynamicToId(newProps.isSelected);
+    if (isSelected != nil) {
+        _view.isSelected = isSelected;
+    }
+
+  [super updateProps:props oldProps:oldProps];
+}
+
+- (void)updateLayoutMetrics:(const LayoutMetrics &)layoutMetrics
+           oldLayoutMetrics:(const LayoutMetrics &)oldLayoutMetrics
+{
+    CGRect prev = _view.frame;
+    CGRect next = RCTCGRectFromRect(layoutMetrics.frame);
+    
+    BOOL frameDidChange = !CGRectEqualToRect(next, prev);
+    if (frameDidChange) {
+      next = CGRectMake(0, 0, next.size.width, next.size.height);
+    }
+    
+    LayoutMetrics newLayoutMetrics = LayoutMetrics{
+        RCTRectFromCGRect(next),
+        layoutMetrics.contentInsets,
+        layoutMetrics.borderWidth,
+        layoutMetrics.displayType,
+        layoutMetrics.layoutDirection,
+        layoutMetrics.wasLeftAndRightSwapped,
+        layoutMetrics.pointScaleFactor,
+        layoutMetrics.overflowInset
+    };
+
+    [super updateLayoutMetrics:newLayoutMetrics oldLayoutMetrics:oldLayoutMetrics];
+    if (frameDidChange) {
+        [_view updateAnnotationViewSize:next :prev];
+    }
+    [_view addOrUpdate];
+}
+
+@end
+
+Class<RCTComponentViewProtocol> RNMBXMarkerViewCls(void)
+{
+  return RNMBXMarkerViewComponentView.class;
+}
+
+#endif // RCT_NEW_ARCH_ENABLED

package/ios/RNMBX/RNMBXModelLayer.swift

@@ -0,0 +1,59 @@
+@_spi(Experimental) import MapboxMaps
+
+@objc(RNMBXModelLayer)
+public class RNMBXModelLayer: RNMBXVectorLayer {
+  typealias LayerType = ModelLayer
+
+  override func makeLayer(style: Style) throws -> Layer {
+    let vectorSource : VectorSource = try self.layerWithSourceID(in: style)
+    #if RNMBX_11
+    var layer = LayerType(id: self.id!, source: sourceID!)
+    #else
+    var layer = LayerType(id: self.id!)
+    #endif
+    layer.sourceLayer = self.sourceLayerID
+    layer.source = sourceID
+    return layer
+  }
+
+  override func layerType() -> Layer.Type {
+    return LayerType.self
+  }
+
+  override func apply(style : Style) throws {
+    try style.updateLayer(withId: id, type: LayerType.self) { (layer : inout ModelLayer) in
+      if self.styleLayer != nil {
+        self.setOptions(&self.styleLayer!)
+      }
+      if let styleLayer = self.styleLayer as? ModelLayer {
+        layer = styleLayer
+      }
+    }
+  }
+  
+  override func addStyles() {
+    if let style : Style = self.style {
+      let styler =  RNMBXStyle(style: self.style!)
+      styler.bridge = self.bridge
+      
+      if var styleLayer = self.styleLayer as? LayerType,
+         let reactStyle = reactStyle {
+        styler.modelLayer(
+          layer: &styleLayer,
+          reactStyle: reactStyle,
+          oldReactStyle: oldReatStyle,
+          applyUpdater: { (updater) in logged("RNMBXModelLayer.updateLayer") {
+            try style.updateLayer(withId: self.id, type: LayerType.self) { (layer: inout LayerType) in updater(&layer) }
+          }},
+          isValid: {
+            return self.isAddedToMap()
+          })
+        self.styleLayer = styleLayer
+      }
+    }
+  }
+  
+  func isAddedToMap() -> Bool {
+    return true
+  }
+}

package/ios/RNMBX/RNMBXModelLayerComponentView.h

@@ -0,0 +1,15 @@
+#ifdef RCT_NEW_ARCH_ENABLED
+
+#import <UIKit/UIKit.h>
+
+#import <React/RCTUIManager.h>
+#import <React/RCTViewComponentView.h>
+
+NS_ASSUME_NONNULL_BEGIN
+
+@interface RNMBXModelLayerComponentView : RCTViewComponentView
+@end
+
+NS_ASSUME_NONNULL_END
+
+#endif // RCT_NEW_ARCH_ENABLED