react-native-maps 1.21.0-alpha.133 → 1.21.0-alpha.135

package/android/src/main/java/com/facebook/react/viewmanagers/RNMapsMapViewManagerDelegate.java

@@ -142,6 +142,9 @@ public class RNMapsMapViewManagerDelegate<T extends View, U extends BaseViewMana
       case "userInterfaceStyle":
         mViewManager.setUserInterfaceStyle(view, (String) value);
         break;
+      case "customMapStyleString":
+        mViewManager.setCustomMapStyleString(view, value == null ? null : (String) value);
+        break;
       case "userLocationAnnotationTitle":
         mViewManager.setUserLocationAnnotationTitle(view, value == null ? null : (String) value);
         break;

package/android/src/main/java/com/facebook/react/viewmanagers/RNMapsMapViewManagerInterface.java

@@ -53,6 +53,7 @@ public interface RNMapsMapViewManagerInterface<T extends View> {
   void setTintColor(T view, @Nullable Integer value);
   void setToolbarEnabled(T view, boolean value);
   void setUserInterfaceStyle(T view, @Nullable String value);
+  void setCustomMapStyleString(T view, @Nullable String value);
   void setUserLocationAnnotationTitle(T view, @Nullable String value);
   void setUserLocationCalloutEnabled(T view, boolean value);
   void setUserLocationFastestInterval(T view, int value);

package/android/src/main/java/com/rnmaps/fabric/MapViewManager.java

@@ -461,6 +461,11 @@ public class MapViewManager extends ViewGroupManager<MapView> implements RNMapsM
         // do nothing (initialProp)
     }
 
+    @Override
+    public void setCustomMapStyleString(MapView view, @Nullable String value) {
+        view.setMapStyle(value);
+    }
+
     @Override
     public void setUserLocationAnnotationTitle(MapView view, @Nullable String value) {
         // not supported

package/android/src/main/jni/react/renderer/components/RNMapsSpecs/Props.cpp

@@ -66,6 +66,7 @@ RNMapsGoogleMapViewProps::RNMapsGoogleMapViewProps(
     showsTraffic(convertRawProp(context, rawProps, "showsTraffic", sourceProps.showsTraffic, {false})),
     showsUserLocation(convertRawProp(context, rawProps, "showsUserLocation", sourceProps.showsUserLocation, {false})),
     userInterfaceStyle(convertRawProp(context, rawProps, "userInterfaceStyle", sourceProps.userInterfaceStyle, {RNMapsGoogleMapViewUserInterfaceStyle::System})),
+    customMapStyleString(convertRawProp(context, rawProps, "customMapStyleString", sourceProps.customMapStyleString, {})),
     userLocationCalloutEnabled(convertRawProp(context, rawProps, "userLocationCalloutEnabled", sourceProps.userLocationCalloutEnabled, {false})),
     userLocationFastestInterval(convertRawProp(context, rawProps, "userLocationFastestInterval", sourceProps.userLocationFastestInterval, {0})),
     userLocationPriority(convertRawProp(context, rawProps, "userLocationPriority", sourceProps.userLocationPriority, {RNMapsGoogleMapViewUserLocationPriority::High})),
@@ -130,6 +131,7 @@ RNMapsMapViewProps::RNMapsMapViewProps(
     tintColor(convertRawProp(context, rawProps, "tintColor", sourceProps.tintColor, {})),
     toolbarEnabled(convertRawProp(context, rawProps, "toolbarEnabled", sourceProps.toolbarEnabled, {true})),
     userInterfaceStyle(convertRawProp(context, rawProps, "userInterfaceStyle", sourceProps.userInterfaceStyle, {RNMapsMapViewUserInterfaceStyle::System})),
+    customMapStyleString(convertRawProp(context, rawProps, "customMapStyleString", sourceProps.customMapStyleString, {})),
     userLocationAnnotationTitle(convertRawProp(context, rawProps, "userLocationAnnotationTitle", sourceProps.userLocationAnnotationTitle, {})),
     userLocationCalloutEnabled(convertRawProp(context, rawProps, "userLocationCalloutEnabled", sourceProps.userLocationCalloutEnabled, {false})),
     userLocationFastestInterval(convertRawProp(context, rawProps, "userLocationFastestInterval", sourceProps.userLocationFastestInterval, {5000})),

package/android/src/main/jni/react/renderer/components/RNMapsSpecs/Props.h

@@ -391,6 +391,7 @@ class RNMapsGoogleMapViewProps final : public ViewProps {
   bool showsTraffic{false};
   bool showsUserLocation{false};
   RNMapsGoogleMapViewUserInterfaceStyle userInterfaceStyle{RNMapsGoogleMapViewUserInterfaceStyle::System};
+  std::string customMapStyleString{};
   bool userLocationCalloutEnabled{false};
   int userLocationFastestInterval{0};
   RNMapsGoogleMapViewUserLocationPriority userLocationPriority{RNMapsGoogleMapViewUserLocationPriority::High};
@@ -917,6 +918,7 @@ class RNMapsMapViewProps final : public ViewProps {
   SharedColor tintColor{};
   bool toolbarEnabled{true};
   RNMapsMapViewUserInterfaceStyle userInterfaceStyle{RNMapsMapViewUserInterfaceStyle::System};
+  std::string customMapStyleString{};
   std::string userLocationAnnotationTitle{};
   bool userLocationCalloutEnabled{false};
   int userLocationFastestInterval{5000};

package/ios/AirGoogleMaps/AIRGoogleMap.m

@@ -666,8 +666,7 @@ id regionAsJSON(MKCoordinateRegion region) {
   if (!style) {
     NSLog(@"The style definition could not be loaded: %@", error);
   }
-
-  self.mapStyle = style;
+    [self setMapStyle:style];
 }
 
 - (BOOL)showsCompass {

package/ios/AirGoogleMaps/AIRGoogleMapManager.h

@@ -14,6 +14,7 @@
 @interface AIRGoogleMapManager : RCTViewManager
 
 @property (nonatomic, strong) NSString* googleMapId;
+@property (nonatomic, strong) NSString* customMapStyle;
 @property (nonatomic) BOOL zoomTapEnabled;
 @property (nonatomic, strong) UIColor* backgroundColor;
 @property (nonatomic, strong) GMSCameraPosition* camera;

package/ios/AirGoogleMaps/AIRGoogleMapManager.m

@@ -30,7 +30,7 @@ static NSString *const RCTMapViewKey = @"MapView";
 
 @interface AIRGoogleMapManager() <GMSMapViewDelegate>
 {
-  BOOL didCallOnMapReady;
+    BOOL didCallOnMapReady;
 }
 @end
 
@@ -40,37 +40,40 @@ RCT_EXPORT_MODULE()
 
 - (UIView *)view
 {
-
-  if (self.initialProps){
-      if (self.initialProps[@"googleMapId"]){
-          _googleMapId  = self.initialProps[@"googleMapId"];
-      }
-      if (self.initialProps[@"zoomTapEnabled"]){
-          _zoomTapEnabled = self.initialProps[@"zoomTapEnabled"];
-      }
-      if (self.initialProps[@"loadingBackgroundColor"]){
-          _backgroundColor = [RCTConvert UIColor:self.initialProps[@"loadingBackgroundColor"]];
-      }
-      if (self.initialProps[@"initialCamera"]){
-          _camera = [RCTConvert GMSCameraPositionWithDefaults:self.initialProps[@"initialCamera"] existingCamera:nil];
-      }
-  }
-  AIRGoogleMap *map = [[AIRGoogleMap alloc] initWithMapId:self.googleMapId initialCamera:self.camera backgroundColor:self.backgroundColor andZoomTapEnabled:self.zoomTapEnabled];
-  map.bridge = self.bridge;
-  map.delegate = self;
-  map.isAccessibilityElement = NO;
-  map.accessibilityElementsHidden = NO;
-  map.settings.consumesGesturesInView = NO;
-
-  UIPanGestureRecognizer *drag = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handleMapDrag:)];
-  [drag setMinimumNumberOfTouches:1];
-  [drag setMaximumNumberOfTouches:1];
-  [map addGestureRecognizer:drag];
-
-  UIPinchGestureRecognizer *pinch = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(handleMapDrag:)];
-  [map addGestureRecognizer:pinch];
-
-  return map;
+    
+    if (self.initialProps){
+        if (self.initialProps[@"googleMapId"]){
+            _googleMapId  = self.initialProps[@"googleMapId"];
+        }
+        if (self.initialProps[@"zoomTapEnabled"]){
+            _zoomTapEnabled = self.initialProps[@"zoomTapEnabled"];
+        }
+        if (self.initialProps[@"loadingBackgroundColor"]){
+            _backgroundColor = [RCTConvert UIColor:self.initialProps[@"loadingBackgroundColor"]];
+        }
+        if (self.initialProps[@"initialCamera"]){
+            _camera = [RCTConvert GMSCameraPositionWithDefaults:self.initialProps[@"initialCamera"] existingCamera:nil];
+        }
+    }
+    AIRGoogleMap *map = [[AIRGoogleMap alloc] initWithMapId:self.googleMapId initialCamera:self.camera backgroundColor:self.backgroundColor andZoomTapEnabled:self.zoomTapEnabled];
+    map.bridge = self.bridge;
+    map.delegate = self;
+    map.isAccessibilityElement = NO;
+    map.accessibilityElementsHidden = NO;
+    map.settings.consumesGesturesInView = NO;
+    if (self.customMapStyle != nil){
+        map.customMapStyleString = self.customMapStyle;
+    }
+    
+    UIPanGestureRecognizer *drag = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handleMapDrag:)];
+    [drag setMinimumNumberOfTouches:1];
+    [drag setMaximumNumberOfTouches:1];
+    [map addGestureRecognizer:drag];
+    
+    UIPinchGestureRecognizer *pinch = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(handleMapDrag:)];
+    [map addGestureRecognizer:pinch];
+    
+    return map;
 }
 
 RCT_EXPORT_VIEW_PROPERTY(isAccessibilityElement, BOOL)
@@ -130,14 +133,14 @@ RCT_EXPORT_METHOD(getCamera:(nonnull NSNumber *)reactTag
         } else {
             AIRGoogleMap *mapView = (AIRGoogleMap *)view;
             resolve(@{
-                      @"center": @{
-                              @"latitude": @(mapView.camera.target.latitude),
-                              @"longitude": @(mapView.camera.target.longitude),
-                              },
-                      @"pitch": @(mapView.camera.viewingAngle),
-                      @"heading": @(mapView.camera.bearing),
-                      @"zoom": @(mapView.camera.zoom),
-                    });
+                @"center": @{
+                    @"latitude": @(mapView.camera.target.latitude),
+                    @"longitude": @(mapView.camera.target.longitude),
+                },
+                @"pitch": @(mapView.camera.viewingAngle),
+                @"heading": @(mapView.camera.bearing),
+                @"zoom": @(mapView.camera.zoom),
+            });
         }
     }];
 }
@@ -181,36 +184,36 @@ RCT_EXPORT_METHOD(animateToRegion:(nonnull NSNumber *)reactTag
                   withRegion:(MKCoordinateRegion)region
                   withDuration:(CGFloat)duration)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-      // Core Animation must be used to control the animation's duration
-      // See http://stackoverflow.com/a/15663039/171744
-      [CATransaction begin];
-      [CATransaction setAnimationDuration:duration/1000];
-      AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-      GMSCameraPosition *camera = [AIRGoogleMap makeGMSCameraPositionFromMap:mapView andMKCoordinateRegion:region];
-      [mapView animateToCameraPosition:camera];
-      [CATransaction commit];
-    }
-  }];
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            // Core Animation must be used to control the animation's duration
+            // See http://stackoverflow.com/a/15663039/171744
+            [CATransaction begin];
+            [CATransaction setAnimationDuration:duration/1000];
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            GMSCameraPosition *camera = [AIRGoogleMap makeGMSCameraPositionFromMap:mapView andMKCoordinateRegion:region];
+            [mapView animateToCameraPosition:camera];
+            [CATransaction commit];
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(fitToElements:(nonnull NSNumber *)reactTag
                   edgePadding:(nonnull NSDictionary *)edgePadding
                   animated:(BOOL)animated)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-        AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-        [mapView fitToElementsWithEdgePadding:edgePadding animated:animated];
-    }
-  }];
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            [mapView fitToElementsWithEdgePadding:edgePadding animated:animated];
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(fitToSuppliedMarkers:(nonnull NSNumber *)reactTag
@@ -218,15 +221,15 @@ RCT_EXPORT_METHOD(fitToSuppliedMarkers:(nonnull NSNumber *)reactTag
                   edgePadding:(nonnull NSDictionary *)edgePadding
                   animated:(BOOL)animated)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-        AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-        [mapView fitToSuppliedMarkers:markers withEdgePadding:edgePadding animated:animated];
-    }
-  }];
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            [mapView fitToSuppliedMarkers:markers withEdgePadding:edgePadding animated:animated];
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(fitToCoordinates:(nonnull NSNumber *)reactTag
@@ -234,15 +237,15 @@ RCT_EXPORT_METHOD(fitToCoordinates:(nonnull NSNumber *)reactTag
                   edgePadding:(nonnull NSDictionary *)edgePadding
                   animated:(BOOL)animated)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-      AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-        [mapView fitToCoordinates:coordinates withEdgePadding:edgePadding animated:animated];
-    }
-  }];
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            [mapView fitToCoordinates:coordinates withEdgePadding:edgePadding animated:animated];
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(takeSnapshot:(nonnull NSNumber *)reactTag
@@ -254,54 +257,54 @@ RCT_EXPORT_METHOD(takeSnapshot:(nonnull NSNumber *)reactTag
                   result:(nonnull NSString *)result
                   withCallback:(RCTPromiseResolveBlock)callback)
 {
-  NSTimeInterval timeStamp = [[NSDate date] timeIntervalSince1970];
-  NSString *pathComponent = [NSString stringWithFormat:@"Documents/snapshot-%.20lf.%@", timeStamp, format];
-  NSString *filePath = [NSHomeDirectory() stringByAppendingPathComponent: pathComponent];
-
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-        RCTLogError(@"Invalid view returned from registry, expecting AIRMap, got: %@", view);
-    } else {
-        AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-        NSMutableDictionary* config = [NSMutableDictionary new];
-
-        [mapView takeSnapshotWithConfig:config success:callback error:^(NSString *code, NSString *message, NSError *error) {
-            callback(@[error]);
-        }];
-
-        [config setObject:width forKey:@"width"];
-        [config setObject:height forKey:@"height"];
-        [config setObject:format forKey:@"format"];
-        [config setObject:quality forKey:@"quality"];
-        [config setObject:result forKey:@"result"];
-        [config setObject:filePath forKey:@"filePath"];
-
-      // TODO: currently we are ignoring width, height, region
-
-      UIGraphicsBeginImageContextWithOptions(mapView.frame.size, YES, 0.0f);
-      [mapView.layer renderInContext:UIGraphicsGetCurrentContext()];
-      UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
-
-      NSData *data;
-      if ([format isEqualToString:@"png"]) {
-          data = UIImagePNGRepresentation(image);
-
-      }
-      else if([format isEqualToString:@"jpg"]) {
-            data = UIImageJPEGRepresentation(image, quality.floatValue);
-      }
-
-      if ([result isEqualToString:@"file"]) {
-          [data writeToFile:filePath atomically:YES];
-            callback(@[[NSNull null], filePath]);
-        }
-        else if ([result isEqualToString:@"base64"]) {
-            callback(@[[NSNull null], [data base64EncodedStringWithOptions:NSDataBase64EncodingEndLineWithCarriageReturn]]);
+    NSTimeInterval timeStamp = [[NSDate date] timeIntervalSince1970];
+    NSString *pathComponent = [NSString stringWithFormat:@"Documents/snapshot-%.20lf.%@", timeStamp, format];
+    NSString *filePath = [NSHomeDirectory() stringByAppendingPathComponent: pathComponent];
+    
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            NSMutableDictionary* config = [NSMutableDictionary new];
+            
+            [mapView takeSnapshotWithConfig:config success:callback error:^(NSString *code, NSString *message, NSError *error) {
+                callback(@[error]);
+            }];
+            
+            [config setObject:width forKey:@"width"];
+            [config setObject:height forKey:@"height"];
+            [config setObject:format forKey:@"format"];
+            [config setObject:quality forKey:@"quality"];
+            [config setObject:result forKey:@"result"];
+            [config setObject:filePath forKey:@"filePath"];
+            
+            // TODO: currently we are ignoring width, height, region
+            
+            UIGraphicsBeginImageContextWithOptions(mapView.frame.size, YES, 0.0f);
+            [mapView.layer renderInContext:UIGraphicsGetCurrentContext()];
+            UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
+            
+            NSData *data;
+            if ([format isEqualToString:@"png"]) {
+                data = UIImagePNGRepresentation(image);
+                
+            }
+            else if([format isEqualToString:@"jpg"]) {
+                data = UIImageJPEGRepresentation(image, quality.floatValue);
+            }
+            
+            if ([result isEqualToString:@"file"]) {
+                [data writeToFile:filePath atomically:YES];
+                callback(@[[NSNull null], filePath]);
+            }
+            else if ([result isEqualToString:@"base64"]) {
+                callback(@[[NSNull null], [data base64EncodedStringWithOptions:NSDataBase64EncodingEndLineWithCarriageReturn]]);
+            }
         }
-    }
-    UIGraphicsEndImageContext();
-  }];
+        UIGraphicsEndImageContext();
+    }];
 }
 
 RCT_EXPORT_METHOD(pointForCoordinate:(nonnull NSNumber *)reactTag
@@ -309,21 +312,21 @@ RCT_EXPORT_METHOD(pointForCoordinate:(nonnull NSNumber *)reactTag
                   resolver: (RCTPromiseResolveBlock)resolve
                   rejecter:(RCTPromiseRejectBlock)reject)
 {
-  CLLocationCoordinate2D coord =
-  CLLocationCoordinate2DMake(
-                             [coordinate[@"latitude"] doubleValue],
-                             [coordinate[@"longitude"] doubleValue]
-                             );
-
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRMap, got: %@", view);
-    } else {
-      AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-        resolve([mapView getPointForCoordinates:coord]);
-    }
-  }];
+    CLLocationCoordinate2D coord =
+    CLLocationCoordinate2DMake(
+                               [coordinate[@"latitude"] doubleValue],
+                               [coordinate[@"longitude"] doubleValue]
+                               );
+    
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            resolve([mapView getPointForCoordinates:coord]);
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(coordinateForPoint:(nonnull NSNumber *)reactTag
@@ -331,20 +334,20 @@ RCT_EXPORT_METHOD(coordinateForPoint:(nonnull NSNumber *)reactTag
                   resolver: (RCTPromiseResolveBlock)resolve
                   rejecter:(RCTPromiseRejectBlock)reject)
 {
-  CGPoint pt = CGPointMake(
-                           [point[@"x"] doubleValue],
-                           [point[@"y"] doubleValue]
-                           );
-
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRMap, got: %@", view);
-    } else {
-      AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-        resolve([view getCoordinatesForPoint:pt]);
-    }
-  }];
+    CGPoint pt = CGPointMake(
+                             [point[@"x"] doubleValue],
+                             [point[@"y"] doubleValue]
+                             );
+    
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            resolve([view getCoordinatesForPoint:pt]);
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(getMarkersFrames:(nonnull NSNumber *)reactTag
@@ -367,140 +370,140 @@ RCT_EXPORT_METHOD(getMapBoundaries:(nonnull NSNumber *)reactTag
                   resolver:(RCTPromiseResolveBlock)resolve
                   rejecter:(RCTPromiseRejectBlock)reject)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-        resolve([view getMapBoundaries]);
-    }
-  }];
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            resolve([view getMapBoundaries]);
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(setMapBoundaries:(nonnull NSNumber *)reactTag
                   northEast:(CLLocationCoordinate2D)northEast
                   southWest:(CLLocationCoordinate2D)southWest)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-      AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-
-      GMSCoordinateBounds *bounds = [[GMSCoordinateBounds alloc] initWithCoordinate:northEast coordinate:southWest];
-
-      mapView.cameraTargetBounds = bounds;
-    }
-  }];
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            
+            GMSCoordinateBounds *bounds = [[GMSCoordinateBounds alloc] initWithCoordinate:northEast coordinate:southWest];
+            
+            mapView.cameraTargetBounds = bounds;
+        }
+    }];
 }
 
 RCT_EXPORT_METHOD(setIndoorActiveLevelIndex:(nonnull NSNumber *)reactTag
                   levelIndex:(NSInteger) levelIndex)
 {
-  [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
-    id view = viewRegistry[reactTag];
-    if (![view isKindOfClass:[AIRGoogleMap class]]) {
-      RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
-    } else {
-      AIRGoogleMap *mapView = (AIRGoogleMap *)view;
-      if (!mapView.indoorDisplay) {
-        return;
-      }
-      if ( levelIndex < [mapView.indoorDisplay.activeBuilding.levels count]) {
-        mapView.indoorDisplay.activeLevel = mapView.indoorDisplay.activeBuilding.levels[levelIndex];
-      }
-    }
-  }];
- }
+    [self.bridge.uiManager addUIBlock:^(__unused RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
+        id view = viewRegistry[reactTag];
+        if (![view isKindOfClass:[AIRGoogleMap class]]) {
+            RCTLogError(@"Invalid view returned from registry, expecting AIRGoogleMap, got: %@", view);
+        } else {
+            AIRGoogleMap *mapView = (AIRGoogleMap *)view;
+            if (!mapView.indoorDisplay) {
+                return;
+            }
+            if ( levelIndex < [mapView.indoorDisplay.activeBuilding.levels count]) {
+                mapView.indoorDisplay.activeLevel = mapView.indoorDisplay.activeBuilding.levels[levelIndex];
+            }
+        }
+    }];
+}
 
 + (BOOL)requiresMainQueueSetup {
-  return YES;
+    return YES;
 }
 
 - (NSDictionary *)constantsToExport {
-  return @{ @"legalNotice": [GMSServices openSourceLicenseInfo] };
+    return @{ @"legalNotice": [GMSServices openSourceLicenseInfo] };
 }
 
 - (void)mapView:(GMSMapView *)mapView willMove:(BOOL)gesture {
-  self.isGesture = gesture;
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView willMove:gesture];
+    self.isGesture = gesture;
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView willMove:gesture];
 }
 
 - (void)mapViewDidStartTileRendering:(GMSMapView *)mapView {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView didPrepareMap];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView didPrepareMap];
 }
 
 - (void)mapViewDidFinishTileRendering:(GMSMapView *)mapView {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView mapViewDidFinishTileRendering];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView mapViewDidFinishTileRendering];
 }
 
 - (BOOL)mapView:(GMSMapView *)mapView didTapMarker:(GMSMarker *)marker {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  return [googleMapView didTapMarker:marker];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    return [googleMapView didTapMarker:marker];
 }
 
 - (void)mapView:(GMSMapView *)mapView didTapOverlay:(GMSPolygon *)polygon {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView didTapPolygon:polygon];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView didTapPolygon:polygon];
 }
 
 - (void)mapView:(GMSMapView *)mapView didTapAtCoordinate:(CLLocationCoordinate2D)coordinate {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView didTapAtCoordinate:coordinate];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView didTapAtCoordinate:coordinate];
 }
 
 - (void)mapView:(GMSMapView *)mapView didLongPressAtCoordinate:(CLLocationCoordinate2D)coordinate {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView didLongPressAtCoordinate:coordinate];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView didLongPressAtCoordinate:coordinate];
 }
 
 - (void)mapView:(GMSMapView *)mapView didChangeCameraPosition:(GMSCameraPosition *)position {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView didChangeCameraPosition:position isGesture:self.isGesture];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView didChangeCameraPosition:position isGesture:self.isGesture];
 }
 
 - (void)mapView:(GMSMapView *)mapView idleAtCameraPosition:(GMSCameraPosition *)position {
-  AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
-  [googleMapView idleAtCameraPosition:position isGesture:self.isGesture];
+    AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
+    [googleMapView idleAtCameraPosition:position isGesture:self.isGesture];
 }
 
 - (UIView *)mapView:(GMSMapView *)mapView markerInfoWindow:(GMSMarker *)marker {
-  AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
-  return [aMarker.fakeMarker markerInfoWindow];}
+    AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
+    return [aMarker.fakeMarker markerInfoWindow];}
 
 - (UIView *)mapView:(GMSMapView *)mapView markerInfoContents:(GMSMarker *)marker {
-  AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
-  return [aMarker.fakeMarker markerInfoContents];
+    AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
+    return [aMarker.fakeMarker markerInfoContents];
 }
 
 - (void)mapView:(GMSMapView *)mapView didTapInfoWindowOfMarker:(GMSMarker *)marker {
-  AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
-  [aMarker.fakeMarker didTapInfoWindowOfMarker:aMarker];
+    AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
+    [aMarker.fakeMarker didTapInfoWindowOfMarker:aMarker];
 }
 
 - (void)mapView:(GMSMapView *)mapView didBeginDraggingMarker:(GMSMarker *)marker {
-  AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
-  [aMarker.fakeMarker didBeginDraggingMarker:aMarker];
+    AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
+    [aMarker.fakeMarker didBeginDraggingMarker:aMarker];
 }
 
 - (void)mapView:(GMSMapView *)mapView didEndDraggingMarker:(GMSMarker *)marker {
-  AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
-  [aMarker.fakeMarker didEndDraggingMarker:aMarker];
+    AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
+    [aMarker.fakeMarker didEndDraggingMarker:aMarker];
 }
 
 - (void)mapView:(GMSMapView *)mapView didDragMarker:(GMSMarker *)marker {
-  AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
-  [aMarker.fakeMarker didDragMarker:aMarker];
+    AIRGMSMarker *aMarker = (AIRGMSMarker *)marker;
+    [aMarker.fakeMarker didDragMarker:aMarker];
 }
 
 - (void)mapView:(GMSMapView *)mapView
-    didTapPOIWithPlaceID:(NSString *)placeID
-                    name:(NSString *)name
-                location:(CLLocationCoordinate2D)location {
+didTapPOIWithPlaceID:(NSString *)placeID
+           name:(NSString *)name
+       location:(CLLocationCoordinate2D)location {
     AIRGoogleMap *googleMapView = (AIRGoogleMap *)mapView;
     [googleMapView didTapPOIWithPlaceID:placeID name:name location:location];
 }
@@ -508,23 +511,23 @@ RCT_EXPORT_METHOD(setIndoorActiveLevelIndex:(nonnull NSNumber *)reactTag
 #pragma mark Gesture Recognizer Handlers
 
 - (void)handleMapDrag:(UIPanGestureRecognizer*)recognizer {
-  AIRGoogleMap *map = (AIRGoogleMap *)recognizer.view;
-  if (!map.onPanDrag) return;
-
-  CGPoint touchPoint = [recognizer locationInView:map];
-  CLLocationCoordinate2D coord = [map.projection coordinateForPoint:touchPoint];
-  map.onPanDrag(@{
-                  @"coordinate": @{
-                      @"latitude": @(coord.latitude),
-                      @"longitude": @(coord.longitude),
-                      },
-                  @"position": @{
-                      @"x": @(touchPoint.x),
-                      @"y": @(touchPoint.y),
-                      },
-                   @"numberOfTouches": @(recognizer.numberOfTouches),
-                  });
-
+    AIRGoogleMap *map = (AIRGoogleMap *)recognizer.view;
+    if (!map.onPanDrag) return;
+    
+    CGPoint touchPoint = [recognizer locationInView:map];
+    CLLocationCoordinate2D coord = [map.projection coordinateForPoint:touchPoint];
+    map.onPanDrag(@{
+        @"coordinate": @{
+            @"latitude": @(coord.latitude),
+            @"longitude": @(coord.longitude),
+        },
+        @"position": @{
+            @"x": @(touchPoint.x),
+            @"y": @(touchPoint.y),
+        },
+        @"numberOfTouches": @(recognizer.numberOfTouches),
+    });
+    
 }
 
 @end

package/ios/AirGoogleMaps/RNMapsGoogleMapView.mm

@@ -196,9 +196,9 @@ using namespace facebook::react;
 
     _view.onIndoorLevelActivated = [self](NSDictionary* dictionary) {
         if (_eventEmitter) {
-            
+
             auto mapViewEventEmitter = std::static_pointer_cast<RNMapsGoogleMapViewEventEmitter const>(_eventEmitter);
-            
+
             facebook::react::RNMapsGoogleMapViewEventEmitter::OnIndoorLevelActivated data = {
                 .activeLevelIndex= (int) [dictionary[@"activeLevelIndex"] integerValue],
                 .name = [dictionary[@"name"] UTF8String],
@@ -214,7 +214,7 @@ using namespace facebook::react;
 
             NSError *jsError = nil;
             NSString *levelsStr = RCTJSONStringify(dictionary[@"levels"], &jsError);
-            
+
             facebook::react::RNMapsGoogleMapViewEventEmitter::OnIndoorBuildingFocused data = {
                 .underground = [dictionary[@"underground"] boolValue],
                 .activeLevelIndex = (int) [dictionary[@"activeLevelIndex"] integerValue],
@@ -497,6 +497,12 @@ using namespace facebook::react;
             _legacyMapManager.googleMapId = mapID;
         }
     }
+    if (oldViewProps.customMapStyleString != newViewProps.customMapStyleString) {
+        NSString* customStyle = RCTNSStringFromString(newViewProps.customMapStyleString);
+        if (customStyle && [customStyle length]){
+            _legacyMapManager.customMapStyle = customStyle;
+        }
+    }
     if (!newViewProps.zoomTapEnabled) {
         _legacyMapManager.zoomTapEnabled = newViewProps.zoomTapEnabled;
     } else {
@@ -573,6 +579,8 @@ using namespace facebook::react;
     REMAP_MAPVIEW_PROP(scrollEnabled)
 
     REMAP_MAPVIEW_STRING_PROP(kmlSrc)
+    REMAP_MAPVIEW_STRING_PROP(customMapStyleString)
+
 
     if (newViewProps.minZoom != oldViewProps.minZoom || newViewProps.maxZoom != oldViewProps.maxZoom){
         [_view setMinZoom:newViewProps.minZoom maxZoom:newViewProps.maxZoom];

package/ios/AirMaps/AIRMapMarker.m

@@ -30,7 +30,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
     BOOL _calloutIsOpen;
     NSInteger _zIndexBeforeOpen;
     BOOL _useLegacyPinView;
-    
+
     CADisplayLink *_displayLink;
     CLLocationCoordinate2D _startCoordinate;
     CLLocationCoordinate2D _endCoordinate;
@@ -52,13 +52,13 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
     // Make sure we use the image size when available
     CGSize size = self.image ? self.image.size : frame.size;
     CGRect bounds = {CGPointZero, size};
-    
+
     // The MapView is basically in charge of figuring out the center position of the marker view. If the view changed in
     // height though, we need to compensate in such a way that the bottom of the marker stays at the same spot on the
     // map.
     CGFloat dy = (bounds.size.height - self.bounds.size.height) / 2;
     CGPoint center = (CGPoint){ self.center.x, self.center.y - dy };
-    
+
     // Avoid crashes due to nan coords
     if (isnan(center.x) || isnan(center.y) ||
         isnan(bounds.origin.x) || isnan(bounds.origin.y) ||
@@ -67,7 +67,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
                     self.reactTag, self, NSStringFromCGPoint(center), NSStringFromCGRect(bounds));
         return;
     }
-    
+
     self.center = center;
     self.bounds = bounds;
 }
@@ -102,31 +102,31 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 {
     if ([self shouldUsePinView]) {
         // In this case, we want to render a platform "default" legacy marker.
-        
-        
+
+
         if (_pinView == nil && _useLegacyPinView) {
             _pinView = [[MKPinAnnotationView alloc] initWithAnnotation:self reuseIdentifier: nil];
             [self addGestureRecognizerToView:_pinView];
             _pinView.annotation = self;
-            
+
             if ([_pinView respondsToSelector:@selector(setPinTintColor:)]) {
                 _pinView.pinTintColor = self.pinColor;
             }
-            
+
             _pinView.draggable = self.draggable;
             _pinView.layer.zPosition = self.zIndex;
             _pinView.displayPriority = self.displayPriority;
             _pinView.zPriority = self.zIndex;
             return _pinView;
         }
-        
-        
-        
+
+
+
         if (_markerView == nil && !_useLegacyPinView) {
             _markerView = [[MKMarkerAnnotationView alloc] initWithAnnotation:self reuseIdentifier: nil];
             [self addGestureRecognizerToView:_markerView];
             _markerView.annotation = self;
-            
+
             _markerView.draggable = self.draggable;
             _markerView.layer.zPosition = self.zIndex;
             _markerView.markerTintColor = self.pinColor;
@@ -135,7 +135,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
             _markerView.displayPriority = self.displayPriority;
             _markerView.zPriority = self.zIndex;
 
-            
+
         }
         return _markerView ?: _pinView;
     } else {
@@ -152,14 +152,14 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 - (void)fillCalloutView:(SMCalloutView *)calloutView
 {
     // Set everything necessary on the calloutView before it becomes visible.
-    
+
     // Apply the MKAnnotationView's desired calloutOffset (from the top-middle of the view)
     if ([self shouldUsePinView] && !_hasSetCalloutOffset && _useLegacyPinView) {
         calloutView.calloutOffset = CGPointMake(-8,0);
     } else {
         calloutView.calloutOffset = self.calloutOffset;
     }
-    
+
     if (self.calloutView) {
         calloutView.title = nil;
         calloutView.subtitle = nil;
@@ -172,13 +172,13 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
             // as a result, we use the default "masked" background view.
             calloutView.backgroundView = [SMCalloutMaskedBackgroundView new];
         }
-        
+
         // when this is set, the callout's content will be whatever react views the user has put as the callout's
         // children.
         calloutView.contentView = self.calloutView;
-        
+
     } else {
-        
+
         // if there is no calloutView, it means the user wants to use the default callout behavior with title/subtitle
         // pairs.
         calloutView.title = self.title;
@@ -192,12 +192,12 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 {
     _calloutIsOpen = YES;
     [self setZIndex:_zIndexBeforeOpen];
-    
+
     MKAnnotationView *annotationView = [self getAnnotationView];
-    
+
     [self setSelected:YES animated:NO];
     [self.map selectAnnotation:self animated:NO];
-    
+
     id event = @{
         @"action": @"marker-select",
         @"id": self.identifier ?: @"unknown",
@@ -206,17 +206,17 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
             @"longitude": @(self.coordinate.longitude)
         }
     };
-    
+
     if (self.map.onMarkerSelect) self.map.onMarkerSelect(event);
     if (self.onSelect) self.onSelect(event);
-    
+
     if (![self shouldShowCalloutView]) {
         // no callout to show
         return;
     }
-    
+
     [self fillCalloutView:self.map.calloutView];
-    
+
     // This is where we present our custom callout view... MapKit's built-in callout doesn't have the flexibility
     // we need, but a lot of work was done by Nick Farina to make this identical to MapKit's built-in.
     [self.map.calloutView presentCalloutFromRect:annotationView.bounds
@@ -244,12 +244,12 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 - (void)_handleTap:(UITapGestureRecognizer *)recognizer {
     AIRMapMarker *marker = self;
     if (!marker) return;
-    
+
     if (marker.selected) {
         CGPoint touchPoint = [recognizer locationInView:marker.map.calloutView];
         CGRect bubbleFrame = [self.calloutView convertRect:marker.map.calloutView.bounds toView:marker.map];
         CGPoint touchPointReal = [recognizer locationInView:self.calloutView];
-        
+
         UIView *calloutView = [marker.map.calloutView hitTest:touchPoint withEvent:nil];
         if (calloutView) {
             // the callout (or its subview) got clicked, not the marker
@@ -263,7 +263,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
                 }
                 tmp = tmp.superview;
             }
-            
+
             id event = @{
                 @"action": calloutSubview ? @"callout-inside-press" : @"callout-press",
                 @"id": marker.identifier ?: @"unknown",
@@ -278,7 +278,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
                     @"height": @(bubbleFrame.size.height),
                 }
             };
-            
+
             if (calloutSubview) calloutSubview.onPress(event);
             if (marker.onCalloutPress) marker.onCalloutPress(event);
             if (marker.calloutView && marker.calloutView.onPress) marker.calloutView.onPress(event);
@@ -286,7 +286,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
             return;
         }
     }
-    
+
     // the actual marker got clicked
     CGPoint touchPointReal = [recognizer locationInView:self.calloutView];
     id event = @{
@@ -301,10 +301,10 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
             @"y": @(touchPointReal.y),
         }
     };
-    
+
     if (marker.onPress) marker.onPress(event);
     if (marker.map.onMarkerPress) marker.map.onMarkerPress(event);
-    
+
     [marker.map selectAnnotation:marker animated:NO];
 }
 
@@ -314,10 +314,10 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
     [self setZIndex:_zIndexBeforeOpen];
     // hide the callout view
     [self.map.calloutView dismissCalloutAnimated:YES];
-    
+
     [self setSelected:NO animated:NO];
     [self.map deselectAnnotation:self animated:NO];
-    
+
     id event = @{
         @"action": @"marker-deselect",
         @"id": self.identifier ?: @"unknown",
@@ -326,7 +326,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
             @"longitude": @(self.coordinate.longitude)
         }
     };
-    
+
     if (self.map.onMarkerDeselect) self.map.onMarkerDeselect(event);
     if (self.onDeselect) self.onDeselect(event);
 }
@@ -355,13 +355,13 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 - (void)setImageSrc:(NSString *)imageSrc
 {
     _imageSrc = imageSrc;
-    
+
     if (_reloadImageCancellationBlock) {
         _reloadImageCancellationBlock();
         _reloadImageCancellationBlock = nil;
     }
     __weak __typeof(self) weakSelf = self;
-    
+
     _reloadImageCancellationBlock = [[[RCTBridge currentBridge] moduleForName:@"ImageLoader"] loadImageWithURLRequest:[RCTConvert NSURLRequest:_imageSrc]
                                                                                                                  size:self.bounds.size
                                                                                                                 scale:RCTScreenScale()
@@ -384,7 +384,7 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 - (void)setPinColor:(UIColor *)pinColor
 {
     _pinColor = pinColor;
-    
+
     if(_useLegacyPinView && [_pinView respondsToSelector:@selector(setPinTintColor:)]) {
         _pinView.pinTintColor = _pinColor;
     } else {
@@ -412,6 +412,19 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
         self.layer.zPosition = _zIndex;
     }
 }
+- (void)layoutSubviews
+{
+    [super layoutSubviews];
+
+    CGRect reactFrame = self.frame;
+
+    UIView *firstSubView = self.subviews.firstObject;
+    if (firstSubView && (CGRectGetWidth(firstSubView.frame) > CGRectGetWidth(reactFrame) ||
+                         CGRectGetHeight(firstSubView.frame) > CGRectGetHeight(reactFrame))) {
+        reactFrame = firstSubView.frame;
+    }
+    [self reactSetFrame:reactFrame];
+}
 
 - (void)setUseLegacyPinView:(BOOL)value {
     _useLegacyPinView = value;
@@ -422,16 +435,16 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
         NSLog(@"Animation already in progress. Rejecting new animation request.");
         return;
     }
-    
+
     // Mark as animating
     _isAnimating = YES;
-    
+
     // Store animation parameters
     _startCoordinate = self.coordinate;
     _endCoordinate = newCoordinate;
     _animationDuration = duration;
     _animationStartTime = [NSDate timeIntervalSinceReferenceDate];
-    
+
     // Start a CADisplayLink
     if (_displayLink) {
         [_displayLink invalidate];
@@ -443,15 +456,15 @@ NSInteger const AIR_CALLOUT_OPEN_ZINDEX_BASELINE = 999;
 - (void)updatePosition {
     NSTimeInterval elapsed = [NSDate timeIntervalSinceReferenceDate] - _animationStartTime;
     CGFloat progress = MIN(elapsed / _animationDuration, 1.0);
-    
+
     // Interpolate coordinates
     CLLocationDegrees currentLatitude = _startCoordinate.latitude + progress * (_endCoordinate.latitude - _startCoordinate.latitude);
     CLLocationDegrees currentLongitude = _startCoordinate.longitude + progress * (_endCoordinate.longitude - _startCoordinate.longitude);
-    
+
     // Update annotation's coordinate
     CLLocationCoordinate2D currentCoordinate = CLLocationCoordinate2DMake(currentLatitude, currentLongitude);
     [self setValue:[NSValue valueWithMKCoordinate:currentCoordinate] forKey:@"coordinate"];
-    
+
     // Stop the animation when complete
     if (progress == 1.0) {
         [_displayLink invalidate];

package/ios/generated/RNMapsSpecs/Props.cpp

@@ -66,6 +66,7 @@ RNMapsGoogleMapViewProps::RNMapsGoogleMapViewProps(
     showsTraffic(convertRawProp(context, rawProps, "showsTraffic", sourceProps.showsTraffic, {false})),
     showsUserLocation(convertRawProp(context, rawProps, "showsUserLocation", sourceProps.showsUserLocation, {false})),
     userInterfaceStyle(convertRawProp(context, rawProps, "userInterfaceStyle", sourceProps.userInterfaceStyle, {RNMapsGoogleMapViewUserInterfaceStyle::System})),
+    customMapStyleString(convertRawProp(context, rawProps, "customMapStyleString", sourceProps.customMapStyleString, {})),
     userLocationCalloutEnabled(convertRawProp(context, rawProps, "userLocationCalloutEnabled", sourceProps.userLocationCalloutEnabled, {false})),
     userLocationFastestInterval(convertRawProp(context, rawProps, "userLocationFastestInterval", sourceProps.userLocationFastestInterval, {0})),
     userLocationPriority(convertRawProp(context, rawProps, "userLocationPriority", sourceProps.userLocationPriority, {RNMapsGoogleMapViewUserLocationPriority::High})),

package/ios/generated/RNMapsSpecs/Props.h

@@ -391,6 +391,7 @@ class RNMapsGoogleMapViewProps final : public ViewProps {
   bool showsTraffic{false};
   bool showsUserLocation{false};
   RNMapsGoogleMapViewUserInterfaceStyle userInterfaceStyle{RNMapsGoogleMapViewUserInterfaceStyle::System};
+  std::string customMapStyleString{};
   bool userLocationCalloutEnabled{false};
   int userLocationFastestInterval{0};
   RNMapsGoogleMapViewUserLocationPriority userLocationPriority{RNMapsGoogleMapViewUserLocationPriority::High};

package/package.json

@@ -5,7 +5,7 @@
   "main": "src/index.ts",
   "author": "Leland Richardson <leland.m.richardson@gmail.com>",
   "homepage": "https://github.com/react-native-maps/react-native-maps#readme",
-  "version": "1.21.0-alpha.133",
+  "version": "1.21.0-alpha.135",
   "license": "MIT",
   "scripts": {
     "lint": "eslint . --max-warnings 0",

package/src/MapView.tsx

@@ -1134,11 +1134,16 @@ class MapView extends React.Component<MapViewProps, State> {
       region,
       provider,
       children,
+      customMapStyle,
       ...restProps
     } = this.props;
 
     /* eslint-enable @typescript-eslint/no-unused-vars */
     const userInterfaceStyle = this.props.userInterfaceStyle || 'system';
+    const customMapStyleString = customMapStyle
+      ? JSON.stringify(this.props.customMapStyle)
+      : undefined;
+
     const props: MapFabricNativeProps = {
       onMapReady: this._onMapReady,
       liteMode: this.props.liteMode,
@@ -1150,6 +1155,7 @@ class MapView extends React.Component<MapViewProps, State> {
       onMarkerDeselect: this.handleMarkerDeselect,
       onKmlReady: this.handleKmlReady,
       userInterfaceStyle: userInterfaceStyle,
+      customMapStyleString,
       minZoom: minZoomLevel,
       maxZoom: maxZoomLevel,
       onRegionChange: this.handleRegionChange,

package/src/specs/NativeComponentGoogleMapView.ts

@@ -774,6 +774,15 @@ export interface MapFabricNativeProps extends ViewProps {
    */
   userInterfaceStyle?: WithDefault<'system' | 'light' | 'dark', 'system'>;
 
+  /**
+   * Adds custom styling to the map component.
+   * See [README](https://github.com/react-native-maps/react-native-maps#customizing-the-map-style) for more information.
+   *
+   * @platform iOS: Google Maps only
+   * @platform Android: Supported
+   */
+  customMapStyleString?: string;
+
   /**
    * If `true` clicking user location will show the default callout for userLocation annotation.
    *

package/src/specs/NativeComponentMapView.ts

@@ -923,6 +923,15 @@ export interface MapFabricNativeProps extends ViewProps {
    */
   userInterfaceStyle?: WithDefault<'system' | 'light' | 'dark', 'system'>;
 
+  /**
+   * Adds custom styling to the map component.
+   * See [README](https://github.com/react-native-maps/react-native-maps#customizing-the-map-style) for more information.
+   *
+   * @platform iOS: Google Maps only
+   * @platform Android: Supported
+   */
+  customMapStyleString?: string;
+
   /**
    * The title of the annotation for current user location.
    *