@lugg/maps 0.2.0-alpha.1 → 0.2.0-alpha.10

package/README.md

@@ -1,9 +1,6 @@
 # @lugg/maps
 
-React Native Fabric maps library for iOS and Android.
-
-- Google Maps (iOS & Android)
-- Apple Maps (iOS only)
+Universal maps for your React Native apps 📍
 
 ## Installation
 
@@ -56,6 +53,22 @@ Add your Google Maps API key to `AndroidManifest.xml`:
 </application>
 ```
 
+### Web
+
+Wrap your app with `MapProvider` and pass your Google Maps API key:
+
+```tsx
+import { MapProvider } from '@lugg/maps';
+
+function App() {
+  return (
+    <MapProvider apiKey="YOUR_WEB_API_KEY">
+      {/* Your app */}
+    </MapProvider>
+  );
+}
+```
+
 ## Usage
 
 ```tsx

package/android/src/main/java/com/luggmaps/LuggGoogleMapView.kt

@@ -1,7 +1,6 @@
 package com.luggmaps
 
 import android.annotation.SuppressLint
-import android.util.Log
 import android.view.View
 import android.view.ViewGroup
 import com.facebook.react.uimanager.PixelUtil.dpToPx
@@ -103,7 +102,6 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
   override fun removeViewAt(index: Int) {
     val view = getChildAt(index)
     if (view is LuggMarkerView) {
-      Log.d(TAG, "removing markerView: ${view.name}")
       view.marker?.remove()
       view.marker = null
     } else if (view is LuggPolylineView) {
@@ -123,7 +121,6 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
   }
 
   fun onDropViewInstance() {
-    Log.d(TAG, "dropping mapView instance")
     pendingMarkerViews.clear()
     pendingPolylineViews.clear()
     polylineAnimators.values.forEach { it.destroy() }
@@ -282,6 +279,7 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
       title = markerView.title
       snippet = markerView.description
       setAnchor(markerView.anchorX, markerView.anchorY)
+      zIndex = markerView.zIndex
       if (!markerView.hasCustomView) {
         iconView = null
       }
@@ -291,7 +289,6 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
   private fun processPendingMarkers() {
     if (googleMap == null) return
 
-    Log.d(TAG, "processing pending markers ${pendingMarkerViews.size}")
     pendingMarkerViews.forEach { addMarkerViewToMap(it) }
     pendingMarkerViews.clear()
   }
@@ -311,15 +308,14 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
       .position(position)
       .title(markerView.title)
       .snippet(markerView.description)
-      .collisionBehavior(CollisionBehavior.REQUIRED)
 
-    Log.d(TAG, "adding marker: ${markerView.name} customview: ${markerView.hasCustomView}")
     if (markerView.hasCustomView) {
       options.iconView(iconView)
     }
 
     val marker = map.addMarker(options) as AdvancedMarker
     marker.setAnchor(markerView.anchorX, markerView.anchorY)
+    marker.zIndex = markerView.zIndex
 
     markerView.marker = marker
   }
@@ -342,6 +338,7 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
     }
 
     polylineView.polyline?.width = polylineView.strokeWidth.dpToPx()
+    polylineView.polyline?.zIndex = polylineView.zIndex
 
     polylineAnimators[polylineView]?.apply {
       coordinates = polylineView.coordinates
@@ -364,6 +361,7 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
 
     val options = PolylineOptions()
       .width(polylineView.strokeWidth.dpToPx())
+      .zIndex(polylineView.zIndex)
 
     val polyline = map.addPolyline(options)
     polylineView.polyline = polyline
@@ -466,7 +464,14 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
     }
   }
 
-  fun fitCoordinates(coordinates: List<LatLng>, padding: Int, duration: Int) {
+  fun fitCoordinates(
+    coordinates: List<LatLng>,
+    paddingTop: Int,
+    paddingLeft: Int,
+    paddingBottom: Int,
+    paddingRight: Int,
+    duration: Int
+  ) {
     val map = googleMap ?: return
     if (coordinates.isEmpty()) return
 
@@ -474,12 +479,29 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
     coordinates.forEach { boundsBuilder.include(it) }
     val bounds = boundsBuilder.build()
 
-    val cameraUpdate = CameraUpdateFactory.newLatLngBounds(bounds, padding.toFloat().dpToPx().toInt())
+    val top = paddingTop.toFloat().dpToPx().toInt()
+    val left = paddingLeft.toFloat().dpToPx().toInt()
+    val bottom = paddingBottom.toFloat().dpToPx().toInt()
+    val right = paddingRight.toFloat().dpToPx().toInt()
+
+    // Set padding before camera update, then restore after
+    map.setPadding(
+      this.paddingLeft + left,
+      this.paddingTop + top,
+      this.paddingRight + right,
+      this.paddingBottom + bottom
+    )
+
+    val cameraUpdate = CameraUpdateFactory.newLatLngBounds(bounds, 0)
+
     when {
       duration < 0 -> map.animateCamera(cameraUpdate)
       duration > 0 -> map.animateCamera(cameraUpdate, duration, null)
       else -> map.moveCamera(cameraUpdate)
     }
+
+    // Restore base padding
+    map.setPadding(this.paddingLeft, this.paddingTop, this.paddingRight, this.paddingBottom)
   }
 
   // endregion

package/android/src/main/java/com/luggmaps/LuggGoogleMapViewManager.kt

@@ -144,7 +144,15 @@ class LuggGoogleMapViewManager :
     view.moveCamera(latitude, longitude, zoom, duration.toInt())
   }
 
-  override fun fitCoordinates(view: LuggGoogleMapView, coordinates: ReadableArray?, padding: Double, duration: Double) {
+  override fun fitCoordinates(
+    view: LuggGoogleMapView,
+    coordinates: ReadableArray?,
+    paddingTop: Double,
+    paddingLeft: Double,
+    paddingBottom: Double,
+    paddingRight: Double,
+    duration: Double
+  ) {
     val coords = mutableListOf<LatLng>()
     coordinates?.let {
       for (i in 0 until it.size()) {
@@ -154,7 +162,7 @@ class LuggGoogleMapViewManager :
         coords.add(LatLng(lat, lng))
       }
     }
-    view.fitCoordinates(coords, padding.toInt(), duration.toInt())
+    view.fitCoordinates(coords, paddingTop.toInt(), paddingLeft.toInt(), paddingBottom.toInt(), paddingRight.toInt(), duration.toInt())
   }
 
   companion object {

package/android/src/main/java/com/luggmaps/LuggMarkerView.kt

@@ -1,7 +1,6 @@
 package com.luggmaps
 
 import android.content.Context
-import android.util.Log
 import android.view.View
 import androidx.core.view.isNotEmpty
 import com.facebook.react.views.view.ReactViewGroup
@@ -34,6 +33,9 @@ class LuggMarkerView(context: Context) : ReactViewGroup(context) {
   var anchorY: Float = 1.0f
     private set
 
+  var zIndex: Float = 0f
+    private set
+
   var didLayout: Boolean = false
     private set
 
@@ -114,6 +116,10 @@ class LuggMarkerView(context: Context) : ReactViewGroup(context) {
     anchorY = y.toFloat()
   }
 
+  fun setZIndex(zIndex: Float) {
+    this.zIndex = zIndex
+  }
+
   fun setName(name: String?) {
     this.name = name
   }

package/android/src/main/java/com/luggmaps/LuggMarkerViewManager.kt

@@ -63,6 +63,12 @@ class LuggMarkerViewManager :
     }
   }
 
+  @ReactProp(name = "zIndex", defaultFloat = 0f)
+  override fun setZIndex(view: LuggMarkerView, zIndex: Float) {
+    super.setZIndex(view, zIndex)
+    view.setZIndex(zIndex)
+  }
+
   companion object {
     const val NAME = "LuggMarkerView"
   }

package/android/src/main/java/com/luggmaps/LuggPolylineView.kt

@@ -25,6 +25,9 @@ class LuggPolylineView(context: Context) : ReactViewGroup(context) {
   var animated: Boolean = false
     private set
 
+  var zIndex: Float = 0f
+    private set
+
   var cachedSpans: List<StyleSpan>? = null
     private set
 
@@ -55,6 +58,10 @@ class LuggPolylineView(context: Context) : ReactViewGroup(context) {
     animated = value
   }
 
+  fun setZIndex(value: Float) {
+    zIndex = value
+  }
+
   fun getOrCreateSpans(): List<StyleSpan> {
     cachedSpans?.let { return it }
 

package/android/src/main/java/com/luggmaps/LuggPolylineViewManager.kt

@@ -65,6 +65,12 @@ class LuggPolylineViewManager :
     view.setAnimated(value)
   }
 
+  @ReactProp(name = "zIndex", defaultFloat = 0f)
+  override fun setZIndex(view: LuggPolylineView, value: Float) {
+    super.setZIndex(view, value)
+    view.setZIndex(value)
+  }
+
   companion object {
     const val NAME = "LuggPolylineView"
   }

package/android/src/main/java/com/luggmaps/core/PolylineAnimator.kt

@@ -2,18 +2,24 @@ package com.luggmaps.core
 
 import android.animation.ValueAnimator
 import android.graphics.Color
+import android.location.Location
 import android.view.animation.LinearInterpolator
 import com.google.android.gms.maps.model.LatLng
 import com.google.android.gms.maps.model.Polyline
 import com.google.android.gms.maps.model.StrokeStyle
 import com.google.android.gms.maps.model.StyleSpan
 import kotlin.math.floor
-import kotlin.math.max
 import kotlin.math.min
 
 class PolylineAnimator {
   var polyline: Polyline? = null
   var coordinates: List<LatLng> = emptyList()
+    set(value) {
+      field = value
+      if (animated && animator != null) {
+        computeCumulativeDistances()
+      }
+    }
   var strokeColors: List<Int> = listOf(Color.BLACK)
   var strokeWidth: Float = 1f
 
@@ -31,6 +37,8 @@ class PolylineAnimator {
 
   private var animator: ValueAnimator? = null
   private var animationProgress: Float = 0f
+  private var cumulativeDistances: FloatArray = floatArrayOf()
+  private var totalLength: Float = 0f
 
   fun update() {
     if (animated) return
@@ -50,8 +58,10 @@ class PolylineAnimator {
   private fun startAnimation() {
     if (animator != null) return
 
+    computeCumulativeDistances()
+
     animator = ValueAnimator.ofFloat(0f, 2.15f).apply {
-      duration = 3650 // ~1.75s per phase * 2 + pause
+      duration = 2150
       repeatCount = ValueAnimator.INFINITE
       interpolator = LinearInterpolator()
       addUpdateListener { animation ->
@@ -62,6 +72,58 @@ class PolylineAnimator {
     }
   }
 
+  private fun computeCumulativeDistances() {
+    if (coordinates.size < 2) {
+      cumulativeDistances = floatArrayOf(0f)
+      totalLength = 0f
+      return
+    }
+
+    val distances = FloatArray(coordinates.size)
+    distances[0] = 0f
+    var total = 0f
+
+    for (i in 1 until coordinates.size) {
+      val prev = coordinates[i - 1]
+      val curr = coordinates[i]
+      val results = FloatArray(1)
+      Location.distanceBetween(prev.latitude, prev.longitude, curr.latitude, curr.longitude, results)
+      total += results[0]
+      distances[i] = total
+    }
+
+    cumulativeDistances = distances
+    totalLength = total
+  }
+
+  private fun indexForDistance(distance: Float): Int {
+    for (i in 1 until cumulativeDistances.size) {
+      if (cumulativeDistances[i] >= distance) {
+        return i - 1
+      }
+    }
+    return (cumulativeDistances.size - 2).coerceAtLeast(0)
+  }
+
+  private fun coordinateAtDistance(distance: Float): LatLng {
+    if (distance <= 0f) return coordinates.first()
+    if (distance >= totalLength) return coordinates.last()
+
+    val idx = indexForDistance(distance)
+    val segStart = cumulativeDistances[idx]
+    val segEnd = cumulativeDistances[idx + 1]
+    val segLength = segEnd - segStart
+
+    val t = if (segLength > 0) (distance - segStart) / segLength else 0f
+    val c1 = coordinates[idx]
+    val c2 = coordinates[idx + 1]
+
+    return LatLng(
+      c1.latitude + (c2.latitude - c1.latitude) * t,
+      c1.longitude + (c2.longitude - c1.longitude) * t
+    )
+  }
+
   private fun stopAnimation() {
     animator?.cancel()
     animator = null
@@ -69,71 +131,55 @@ class PolylineAnimator {
 
   private fun updateAnimatedPolyline() {
     val poly = polyline ?: return
-    if (coordinates.size < 2) {
+    if (coordinates.size < 2 || totalLength <= 0f) {
       poly.points = coordinates
       return
     }
 
-    val segmentCount = coordinates.size - 1
     val progress = min(animationProgress, 2f)
 
-    val headPos: Float
-    val tailPos: Float
+    val headDist: Float
+    val tailDist: Float
 
     if (progress <= 1f) {
-      tailPos = 0f
-      headPos = progress * segmentCount
+      tailDist = 0f
+      headDist = progress * totalLength
     } else {
       val shrinkProgress = progress - 1f
-      tailPos = shrinkProgress * segmentCount
-      headPos = segmentCount.toFloat()
+      tailDist = shrinkProgress * totalLength
+      headDist = totalLength
     }
 
-    if (headPos <= tailPos || coordinates.isEmpty()) {
+    if (headDist <= tailDist) {
       poly.setSpans(emptyList())
       poly.points = listOf(coordinates.firstOrNull() ?: LatLng(0.0, 0.0))
       return
     }
 
-    val startIndex = floor(tailPos).toInt()
-    val endIndex = kotlin.math.ceil(headPos.toDouble()).toInt()
-    val visibleLength = headPos - tailPos
+    val visibleLength = headDist - tailDist
+    val startIndex = indexForDistance(tailDist)
+    val endIndex = indexForDistance(headDist)
 
     val points = mutableListOf<LatLng>()
     val spans = mutableListOf<StyleSpan>()
 
-    for (i in startIndex..minOf(endIndex, coordinates.size - 1)) {
-      var coord = coordinates[i]
-
-      // Interpolate tail
-      if (i == startIndex && tailPos > startIndex.toFloat() && i + 1 < coordinates.size) {
-        val t = tailPos - startIndex
-        val next = coordinates[i + 1]
-        coord = LatLng(
-          coord.latitude + (next.latitude - coord.latitude) * t,
-          coord.longitude + (next.longitude - coord.longitude) * t
-        )
-      }
+    points.add(coordinateAtDistance(tailDist))
 
-      // Interpolate head
-      if (i == endIndex && headPos < endIndex.toFloat() && i > 0) {
-        val t = headPos - (endIndex - 1)
-        val prev = coordinates[i - 1]
-        coord = LatLng(
-          prev.latitude + (coordinates[i].latitude - prev.latitude) * t,
-          prev.longitude + (coordinates[i].longitude - prev.longitude) * t
-        )
-      }
+    for (i in (startIndex + 1)..endIndex) {
+      points.add(coordinates[i])
+    }
 
-      points.add(coord)
+    val endCoord = coordinateAtDistance(headDist)
+    val lastAdded = points.lastOrNull()
+    if (lastAdded == null || endCoord.latitude != lastAdded.latitude || endCoord.longitude != lastAdded.longitude) {
+      points.add(endCoord)
+    }
 
-      if (i < endIndex && i < segmentCount) {
-        val segStartPos = max(i.toFloat(), tailPos)
-        val segEndPos = min((i + 1).toFloat(), headPos)
-        val gradientMid = ((segStartPos + segEndPos) / 2f - tailPos) / visibleLength
-        val color = colorAtGradientPosition(gradientMid)
-        spans.add(StyleSpan(StrokeStyle.colorBuilder(color).build()))
-      }
+    for (i in 0 until (points.size - 1)) {
+      val segMidDist = tailDist + visibleLength * (i + 0.5f) / (points.size - 1)
+      val gradientPos = (segMidDist - tailDist) / visibleLength
+      val color = colorAtGradientPosition(gradientPos)
+      spans.add(StyleSpan(StrokeStyle.colorBuilder(color).build()))
     }
 
     poly.points = points

package/ios/LuggAppleMapView.mm

@@ -161,6 +161,10 @@ using namespace luggmaps::events;
   _maxZoom = viewProps.maxZoom;
   [self applyZoomRange];
 
+  _mapView.layoutMargins =
+      UIEdgeInsetsMake(viewProps.padding.top, viewProps.padding.left,
+                       viewProps.padding.bottom, viewProps.padding.right);
+
   [_mapWrapperView addSubview:_mapView];
 
   [self setCameraWithLatitude:viewProps.initialCoordinate.latitude
@@ -298,7 +302,7 @@ using namespace luggmaps::events;
   free(coords);
 
   polylineView.polyline = polyline;
-  [_mapView addOverlay:polyline];
+  [self insertOverlay:polyline withZIndex:polylineView.zIndex];
 }
 
 - (void)syncPolylineView:(LuggPolylineView *)polylineView {
@@ -312,6 +316,9 @@ using namespace luggmaps::events;
   // Build new polyline from coordinates
   NSArray<CLLocation *> *coordinates = polylineView.coordinates;
   if (coordinates.count == 0) {
+    if (renderer) {
+      renderer.animated = NO;
+    }
     if (oldPolyline) {
       [_mapView removeOverlay:oldPolyline];
       polylineView.polyline = nil;
@@ -333,6 +340,8 @@ using namespace luggmaps::events;
 
   // If we have an existing renderer, update it in place
   if (renderer && oldPolyline) {
+    [_mapView removeOverlay:oldPolyline];
+    [self insertOverlay:newPolyline withZIndex:polylineView.zIndex];
     [renderer updatePolyline:newPolyline];
     renderer.lineWidth = polylineView.strokeWidth;
     renderer.strokeColor = polylineView.strokeColors.firstObject;
@@ -346,7 +355,28 @@ using namespace luggmaps::events;
   if (oldPolyline) {
     [_mapView removeOverlay:oldPolyline];
   }
-  [_mapView addOverlay:newPolyline];
+  [self insertOverlay:newPolyline withZIndex:polylineView.zIndex];
+}
+
+- (void)insertOverlay:(id<MKOverlay>)overlay withZIndex:(NSInteger)zIndex {
+  if (zIndex == 0) {
+    [_mapView addOverlay:overlay];
+    return;
+  }
+
+  NSArray<id<MKOverlay>> *overlays = _mapView.overlays;
+  NSInteger insertIndex = overlays.count;
+
+  for (NSInteger i = 0; i < overlays.count; i++) {
+    LuggPolylineView *existingPolylineView =
+        [self findPolylineViewForOverlay:overlays[i]];
+    if (existingPolylineView && existingPolylineView.zIndex > zIndex) {
+      insertIndex = i;
+      break;
+    }
+  }
+
+  [_mapView insertOverlay:overlay atIndex:insertIndex];
 }
 
 - (LuggPolylineView *)findPolylineViewForOverlay:(id<MKOverlay>)overlay {
@@ -384,6 +414,12 @@ using namespace luggmaps::events;
   annotation.title = markerView.title;
   annotation.subtitle = markerView.markerDescription;
 
+  MKAnnotationView *annotationView = annotation.annotationView;
+  if (annotationView) {
+    annotationView.layer.zPosition = markerView.zIndex;
+    annotationView.zPriority = markerView.zIndex;
+  }
+
   [self updateAnnotationViewFrame:annotation];
 }
 
@@ -438,7 +474,8 @@ using namespace luggmaps::events;
                                    reuseIdentifier:nil];
   annotationView.canShowCallout = YES;
   annotationView.displayPriority = MKFeatureDisplayPriorityRequired;
-  annotationView.collisionMode = MKAnnotationViewCollisionModeNone;
+  annotationView.layer.zPosition = markerView.zIndex;
+  annotationView.zPriority = markerView.zIndex;
 
   UIView *iconView = markerView.iconView;
   [iconView removeFromSuperview];
@@ -523,7 +560,10 @@ using namespace luggmaps::events;
 }
 
 - (void)fitCoordinates:(NSArray *)coordinates
-               padding:(double)padding
+            paddingTop:(double)paddingTop
+           paddingLeft:(double)paddingLeft
+         paddingBottom:(double)paddingBottom
+          paddingRight:(double)paddingRight
               duration:(double)duration {
   if (!_mapView || coordinates.count == 0) {
     return;
@@ -546,7 +586,7 @@ using namespace luggmaps::events;
   free(coords);
 
   UIEdgeInsets edgePadding =
-      UIEdgeInsetsMake(padding, padding, padding, padding);
+      UIEdgeInsetsMake(paddingTop, paddingLeft, paddingBottom, paddingRight);
 
   if (duration < 0) {
     [_mapView setVisibleMapRect:mapRect edgePadding:edgePadding animated:YES];

package/ios/LuggGoogleMapView.mm

@@ -168,6 +168,10 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
     [_mapView setMinZoom:_mapView.minZoom maxZoom:(float)viewProps.maxZoom];
   }
 
+  _mapView.padding =
+      UIEdgeInsetsMake(viewProps.padding.top, viewProps.padding.left,
+                       viewProps.padding.bottom, viewProps.padding.right);
+
   [_mapWrapperView addSubview:_mapView];
 
   _isMapReady = YES;
@@ -238,14 +242,15 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
   marker.position = markerView.coordinate;
   marker.title = markerView.title;
   marker.snippet = markerView.markerDescription;
-  marker.groundAnchor = markerView.anchor;
-
+  marker.zIndex = (int)markerView.zIndex;
   if (markerView.hasCustomView) {
     UIView *iconView = markerView.iconView;
     [iconView removeFromSuperview];
     marker.iconView = iconView;
+    marker.groundAnchor = markerView.anchor;
   } else {
     marker.iconView = nil;
+    marker.groundAnchor = CGPointMake(0.5, 1);
   }
 }
 
@@ -273,13 +278,13 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
   marker.position = markerView.coordinate;
   marker.title = markerView.title;
   marker.snippet = markerView.markerDescription;
-  marker.collisionBehavior = GMSCollisionBehaviorRequired;
 
   if (markerView.hasCustomView) {
     marker.iconView = iconView;
+    marker.groundAnchor = markerView.anchor;
   }
 
-  marker.groundAnchor = markerView.anchor;
+  marker.zIndex = (int)markerView.zIndex;
   marker.map = _mapView;
 
   markerView.marker = marker;
@@ -302,6 +307,7 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
 
   GMSPolyline *polyline = (GMSPolyline *)polylineView.polyline;
   polyline.strokeWidth = polylineView.strokeWidth;
+  polyline.zIndex = (int)polylineView.zIndex;
 
   GMSPolylineAnimator *animator =
       [_polylineAnimators objectForKey:polylineView];
@@ -331,6 +337,7 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
 
   GMSPolyline *polyline = [GMSPolyline polylineWithPath:[GMSMutablePath path]];
   polyline.strokeWidth = polylineView.strokeWidth;
+  polyline.zIndex = (int)polylineView.zIndex;
   polyline.map = _mapView;
   polylineView.polyline = polyline;
 
@@ -406,7 +413,10 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
 }
 
 - (void)fitCoordinates:(NSArray *)coordinates
-               padding:(double)padding
+            paddingTop:(double)paddingTop
+           paddingLeft:(double)paddingLeft
+         paddingBottom:(double)paddingBottom
+          paddingRight:(double)paddingRight
               duration:(double)duration {
   if (!_mapView || coordinates.count == 0) {
     return;
@@ -419,8 +429,10 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
     bounds = [bounds includingCoordinate:CLLocationCoordinate2DMake(lat, lng)];
   }
 
+  UIEdgeInsets edgePadding =
+      UIEdgeInsetsMake(paddingTop, paddingLeft, paddingBottom, paddingRight);
   GMSCameraUpdate *cameraUpdate = [GMSCameraUpdate fitBounds:bounds
-                                                 withPadding:padding];
+                                              withEdgeInsets:edgePadding];
 
   if (duration < 0) {
     [_mapView animateWithCameraUpdate:cameraUpdate];

package/ios/LuggMarkerView.h

@@ -14,10 +14,12 @@ NS_ASSUME_NONNULL_BEGIN
 
 @interface LuggMarkerView : RCTViewComponentView
 
+@property(nonatomic, readonly, nullable) NSString *name;
 @property(nonatomic, readonly) CLLocationCoordinate2D coordinate;
 @property(nonatomic, readonly, nullable) NSString *title;
 @property(nonatomic, readonly, nullable) NSString *markerDescription;
 @property(nonatomic, readonly) CGPoint anchor;
+@property(nonatomic, readonly) NSInteger zIndex;
 @property(nonatomic, readonly) BOOL hasCustomView;
 @property(nonatomic, readonly) BOOL didLayout;
 @property(nonatomic, readonly) UIView *iconView;