@lugg/maps 0.2.0-alpha.5 → 0.2.0-alpha.7

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()
   }
@@ -312,13 +309,13 @@ class LuggGoogleMapView(private val reactContext: ThemedReactContext) :
       .title(markerView.title)
       .snippet(markerView.description)
 
-    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
   }

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/ios/LuggAppleMapView.mm

@@ -393,6 +393,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];
 }
 
@@ -447,6 +453,8 @@ using namespace luggmaps::events;
                                    reuseIdentifier:nil];
   annotationView.canShowCallout = YES;
   annotationView.displayPriority = MKFeatureDisplayPriorityRequired;
+  annotationView.layer.zPosition = markerView.zIndex;
+  annotationView.zPriority = markerView.zIndex;
 
   UIView *iconView = markerView.iconView;
   [iconView removeFromSuperview];

package/ios/LuggGoogleMapView.mm

@@ -242,6 +242,7 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
   marker.position = markerView.coordinate;
   marker.title = markerView.title;
   marker.snippet = markerView.markerDescription;
+  marker.zIndex = (int)markerView.zIndex;
   if (markerView.hasCustomView) {
     UIView *iconView = markerView.iconView;
     [iconView removeFromSuperview];
@@ -283,6 +284,7 @@ static NSString *const kDemoMapId = @"DEMO_MAP_ID";
     marker.groundAnchor = markerView.anchor;
   }
 
+  marker.zIndex = (int)markerView.zIndex;
   marker.map = _mapView;
 
   markerView.marker = marker;

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;

package/ios/LuggMarkerView.mm

@@ -13,10 +13,12 @@ using namespace facebook::react;
 @end
 
 @implementation LuggMarkerView {
+  NSString *_name;
   CLLocationCoordinate2D _coordinate;
   NSString *_title;
   NSString *_markerDescription;
   CGPoint _anchor;
+  NSInteger _zIndex;
   BOOL _didLayout;
   UIView *_iconView;
 }
@@ -34,6 +36,7 @@ using namespace facebook::react;
 
     _coordinate = CLLocationCoordinate2DMake(0, 0);
     _anchor = CGPointMake(0.5, 1.0);
+    _zIndex = 0;
     _didLayout = NO;
 
     _iconView = [[UIView alloc] init];
@@ -52,12 +55,14 @@ using namespace facebook::react;
   const auto &newViewProps =
       *std::static_pointer_cast<LuggMarkerViewProps const>(props);
 
+  _name = [NSString stringWithUTF8String:newViewProps.name.c_str()];
   _coordinate = CLLocationCoordinate2DMake(newViewProps.coordinate.latitude,
                                            newViewProps.coordinate.longitude);
   _title = [NSString stringWithUTF8String:newViewProps.title.c_str()];
   _markerDescription =
       [NSString stringWithUTF8String:newViewProps.description.c_str()];
   _anchor = CGPointMake(newViewProps.anchor.x, newViewProps.anchor.y);
+  _zIndex = newViewProps.zIndex.value_or(0);
 }
 
 - (void)finalizeUpdates:(RNComponentViewUpdateMask)updateMask {
@@ -109,6 +114,10 @@ using namespace facebook::react;
   }
 }
 
+- (NSString *)name {
+  return _name;
+}
+
 - (CLLocationCoordinate2D)coordinate {
   return _coordinate;
 }
@@ -125,6 +134,10 @@ using namespace facebook::react;
   return _anchor;
 }
 
+- (NSInteger)zIndex {
+  return _zIndex;
+}
+
 - (BOOL)hasCustomView {
   return _iconView.subviews.count > 0;
 }

package/lib/module/MapProvider.js

@@ -0,0 +1,13 @@
+"use strict";
+
+/**
+ * Provider component for map configuration.
+ * On web, wraps children with Google Maps APIProvider.
+ * On native, passes children through.
+ */
+export function MapProvider({
+  children
+}) {
+  return children;
+}
+//# sourceMappingURL=MapProvider.js.map

package/lib/module/MapProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["MapProvider","children"],"sourceRoot":"../../src","sources":["MapProvider.tsx"],"mappings":";;AAEA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASA,WAAWA,CAAC;EAAEC;AAA2B,CAAC,EAAE;EAC1D,OAAOA,QAAQ;AACjB","ignoreList":[]}

package/lib/module/MapProvider.types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=MapProvider.types.js.map

package/lib/module/MapProvider.types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../src","sources":["MapProvider.types.ts"],"mappings":"","ignoreList":[]}

package/lib/module/MapProvider.web.js

@@ -0,0 +1,14 @@
+"use strict";
+
+import { APIProvider } from '@vis.gl/react-google-maps';
+import { jsx as _jsx } from "react/jsx-runtime";
+export function MapProvider({
+  apiKey = '',
+  children
+}) {
+  return /*#__PURE__*/_jsx(APIProvider, {
+    apiKey: apiKey,
+    children: children
+  });
+}
+//# sourceMappingURL=MapProvider.web.js.map

package/lib/module/MapProvider.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["APIProvider","jsx","_jsx","MapProvider","apiKey","children"],"sourceRoot":"../../src","sources":["MapProvider.web.tsx"],"mappings":";;AAAA,SAASA,WAAW,QAAQ,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGxD,OAAO,SAASC,WAAWA,CAAC;EAAEC,MAAM,GAAG,EAAE;EAAEC;AAA2B,CAAC,EAAE;EACvE,oBAAOH,IAAA,CAACF,WAAW;IAACI,MAAM,EAAEA,MAAO;IAAAC,QAAA,EAAEA;EAAQ,CAAc,CAAC;AAC9D","ignoreList":[]}

package/lib/module/MapView.web.js

@@ -0,0 +1,212 @@
+"use strict";
+
+import React from 'react';
+import { View } from 'react-native';
+import { Map, useMap } from '@vis.gl/react-google-maps';
+import { Marker } from "./components/Marker.web.js";
+import { Polyline } from "./components/Polyline.web.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+// Map-specific component types that render inside the Google Map
+const MAP_COMPONENT_TYPES = new Set([Marker, Polyline]);
+const isMapComponent = child => MAP_COMPONENT_TYPES.has(child.type);
+const createSyntheticEvent = nativeEvent => ({
+  nativeEvent,
+  currentTarget: null,
+  target: null,
+  bubbles: false,
+  cancelable: false,
+  defaultPrevented: false,
+  eventPhase: 0,
+  isTrusted: true,
+  preventDefault: () => {},
+  stopPropagation: () => {},
+  isDefaultPrevented: () => false,
+  isPropagationStopped: () => false,
+  persist: () => {},
+  timeStamp: Date.now(),
+  type: ''
+});
+function MapController({
+  onMapReady,
+  onCameraMove,
+  onCameraIdle,
+  onReady
+}) {
+  const map = useMap();
+  const readyFired = React.useRef(false);
+  React.useEffect(() => {
+    if (!map) return;
+    onMapReady(map);
+    if (!readyFired.current) {
+      readyFired.current = true;
+      onReady?.();
+    }
+  }, [map, onMapReady, onReady]);
+  React.useEffect(() => {
+    if (!map) return;
+    const createPayload = gesture => {
+      const center = map.getCenter();
+      return {
+        coordinate: {
+          latitude: center?.lat() ?? 0,
+          longitude: center?.lng() ?? 0
+        },
+        zoom: map.getZoom() ?? 0,
+        gesture
+      };
+    };
+    let isDragging = false;
+    const dragStartListener = map.addListener('dragstart', () => {
+      isDragging = true;
+    });
+    const dragEndListener = map.addListener('dragend', () => {
+      isDragging = false;
+    });
+    const centerListener = map.addListener('center_changed', () => {
+      onCameraMove?.(createSyntheticEvent(createPayload(isDragging)));
+    });
+    const idleListener = map.addListener('idle', () => {
+      onCameraIdle?.(createSyntheticEvent(createPayload(false)));
+    });
+    return () => {
+      google.maps.event.removeListener(dragStartListener);
+      google.maps.event.removeListener(dragEndListener);
+      google.maps.event.removeListener(centerListener);
+      google.maps.event.removeListener(idleListener);
+    };
+  }, [map, onCameraMove, onCameraIdle]);
+  return null;
+}
+export class MapView extends React.Component {
+  static defaultProps = {
+    provider: 'google',
+    initialZoom: 10,
+    zoomEnabled: true,
+    scrollEnabled: true,
+    rotateEnabled: true,
+    pitchEnabled: true
+  };
+  mapInstance = null;
+  handleMapReady = map => {
+    this.mapInstance = map;
+  };
+  moveCamera(coordinate, options) {
+    const map = this.mapInstance;
+    if (!map) return;
+    const {
+      zoom,
+      duration = -1
+    } = options;
+    const center = {
+      lat: coordinate.latitude,
+      lng: coordinate.longitude
+    };
+    if (duration > 0) {
+      map.panTo(center);
+      map.setZoom(zoom);
+    } else {
+      map.setCenter(center);
+      map.setZoom(zoom);
+    }
+  }
+  fitCoordinates(coordinates, options) {
+    const map = this.mapInstance;
+    const first = coordinates[0];
+    if (!map || !first) return;
+    const {
+      padding,
+      duration = -1
+    } = options ?? {};
+    if (coordinates.length === 1) {
+      const zoom = this.props.initialZoom ?? 10;
+      this.moveCamera(first, {
+        zoom,
+        duration
+      });
+      return;
+    }
+    const bounds = new google.maps.LatLngBounds();
+    coordinates.forEach(coord => {
+      bounds.extend({
+        lat: coord.latitude,
+        lng: coord.longitude
+      });
+    });
+    map.fitBounds(bounds, {
+      top: padding?.top ?? 0,
+      left: padding?.left ?? 0,
+      bottom: padding?.bottom ?? 0,
+      right: padding?.right ?? 0
+    });
+  }
+  render() {
+    const {
+      mapId,
+      initialCoordinate,
+      initialZoom,
+      minZoom,
+      maxZoom,
+      zoomEnabled,
+      scrollEnabled,
+      pitchEnabled,
+      padding,
+      onCameraMove,
+      onCameraIdle,
+      onReady,
+      children,
+      style
+    } = this.props;
+    const gestureHandling = scrollEnabled === false && zoomEnabled === false ? 'none' : scrollEnabled === false ? 'none' : 'auto';
+    const defaultCenter = initialCoordinate ? {
+      lat: initialCoordinate.latitude,
+      lng: initialCoordinate.longitude
+    } : undefined;
+
+    // Separate map children (Marker, Polyline) from overlay children (regular Views)
+    const mapChildren = [];
+    const overlayChildren = [];
+    React.Children.forEach(children, child => {
+      if (! /*#__PURE__*/React.isValidElement(child)) return;
+      if (isMapComponent(child)) {
+        mapChildren.push(child);
+      } else {
+        overlayChildren.push(child);
+      }
+    });
+    const mapContainerStyle = {
+      position: 'absolute',
+      top: padding?.top ?? 0,
+      left: padding?.left ?? 0,
+      right: padding?.right ?? 0,
+      bottom: padding?.bottom ?? 0
+    };
+    const mapStyle = {
+      width: '100%',
+      height: '100%'
+    };
+    return /*#__PURE__*/_jsxs(View, {
+      style: style,
+      children: [/*#__PURE__*/_jsx(View, {
+        style: mapContainerStyle,
+        children: /*#__PURE__*/_jsxs(Map, {
+          mapId: mapId,
+          defaultCenter: defaultCenter,
+          defaultZoom: initialZoom,
+          minZoom: minZoom,
+          maxZoom: maxZoom,
+          gestureHandling: gestureHandling,
+          disableDefaultUI: true,
+          tilt: pitchEnabled === false ? 0 : undefined,
+          style: mapStyle,
+          children: [/*#__PURE__*/_jsx(MapController, {
+            onMapReady: this.handleMapReady,
+            onCameraMove: onCameraMove,
+            onCameraIdle: onCameraIdle,
+            onReady: onReady
+          }), mapChildren]
+        })
+      }), overlayChildren]
+    });
+  }
+}
+//# sourceMappingURL=MapView.web.js.map

package/lib/module/MapView.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","View","Map","useMap","Marker","Polyline","jsx","_jsx","jsxs","_jsxs","MAP_COMPONENT_TYPES","Set","isMapComponent","child","has","type","createSyntheticEvent","nativeEvent","currentTarget","target","bubbles","cancelable","defaultPrevented","eventPhase","isTrusted","preventDefault","stopPropagation","isDefaultPrevented","isPropagationStopped","persist","timeStamp","Date","now","MapController","onMapReady","onCameraMove","onCameraIdle","onReady","map","readyFired","useRef","useEffect","current","createPayload","gesture","center","getCenter","coordinate","latitude","lat","longitude","lng","zoom","getZoom","isDragging","dragStartListener","addListener","dragEndListener","centerListener","idleListener","google","maps","event","removeListener","MapView","Component","defaultProps","provider","initialZoom","zoomEnabled","scrollEnabled","rotateEnabled","pitchEnabled","mapInstance","handleMapReady","moveCamera","options","duration","panTo","setZoom","setCenter","fitCoordinates","coordinates","first","padding","length","props","bounds","LatLngBounds","forEach","coord","extend","fitBounds","top","left","bottom","right","render","mapId","initialCoordinate","minZoom","maxZoom","children","style","gestureHandling","defaultCenter","undefined","mapChildren","overlayChildren","Children","isValidElement","push","mapContainerStyle","position","mapStyle","width","height","defaultZoom","disableDefaultUI","tilt"],"sourceRoot":"../../src","sources":["MapView.web.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/Marker.js

@@ -12,10 +12,13 @@ export class Marker extends React.Component {
       title,
       description,
       anchor,
+      zIndex,
       children
     } = this.props;
     return /*#__PURE__*/_jsx(LuggMarkerViewNativeComponent, {
-      style: styles.marker,
+      style: [{
+        zIndex
+      }, styles.marker],
       name: name,
       coordinate: coordinate,
       title: title,

package/lib/module/components/Marker.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","LuggMarkerViewNativeComponent","jsx","_jsx","Marker","Component","render","name","coordinate","title","description","anchor","children","props","style","styles","marker","create","position","pointerEvents"],"sourceRoot":"../../../src","sources":["components/Marker.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,UAAU,QAAQ,cAAc;AACzC,OAAOC,6BAA6B,MAAM,yCAAyC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AA8BpF,OAAO,MAAMC,MAAM,SAASL,KAAK,CAACM,SAAS,CAAc;EACvDC,MAAMA,CAAA,EAAG;IACP,MAAM;MAAEC,IAAI;MAAEC,UAAU;MAAEC,KAAK;MAAEC,WAAW;MAAEC,MAAM;MAAEC;IAAS,CAAC,GAC9D,IAAI,CAACC,KAAK;IAEZ,oBACEV,IAAA,CAACF,6BAA6B;MAC5Ba,KAAK,EAAEC,MAAM,CAACC,MAAO;MACrBT,IAAI,EAAEA,IAAK;MACXC,UAAU,EAAEA,UAAW;MACvBC,KAAK,EAAEA,KAAM;MACbC,WAAW,EAAEA,WAAY;MACzBC,MAAM,EAAEA,MAAO;MAAAC,QAAA,EAEdA;IAAQ,CACoB,CAAC;EAEpC;AACF;AAEA,MAAMG,MAAM,GAAGf,UAAU,CAACiB,MAAM,CAAC;EAC/BD,MAAM,EAAE;IACNE,QAAQ,EAAE,UAAU;IACpBC,aAAa,EAAE;EACjB;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","StyleSheet","LuggMarkerViewNativeComponent","jsx","_jsx","Marker","Component","render","name","coordinate","title","description","anchor","zIndex","children","props","style","styles","marker","create","position","pointerEvents"],"sourceRoot":"../../../src","sources":["components/Marker.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,UAAU,QAAQ,cAAc;AACzC,OAAOC,6BAA6B,MAAM,yCAAyC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAkCpF,OAAO,MAAMC,MAAM,SAASL,KAAK,CAACM,SAAS,CAAc;EACvDC,MAAMA,CAAA,EAAG;IACP,MAAM;MAAEC,IAAI;MAAEC,UAAU;MAAEC,KAAK;MAAEC,WAAW;MAAEC,MAAM;MAAEC,MAAM;MAAEC;IAAS,CAAC,GACtE,IAAI,CAACC,KAAK;IAEZ,oBACEX,IAAA,CAACF,6BAA6B;MAC5Bc,KAAK,EAAE,CAAC;QAAEH;MAAO,CAAC,EAAEI,MAAM,CAACC,MAAM,CAAE;MACnCV,IAAI,EAAEA,IAAK;MACXC,UAAU,EAAEA,UAAW;MACvBC,KAAK,EAAEA,KAAM;MACbC,WAAW,EAAEA,WAAY;MACzBC,MAAM,EAAEA,MAAO;MAAAE,QAAA,EAEdA;IAAQ,CACoB,CAAC;EAEpC;AACF;AAEA,MAAMG,MAAM,GAAGhB,UAAU,CAACkB,MAAM,CAAC;EAC/BD,MAAM,EAAE;IACNE,QAAQ,EAAE,UAAU;IACpBC,aAAa,EAAE;EACjB;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/Marker.web.js

@@ -0,0 +1,34 @@
+"use strict";
+
+import React from 'react';
+import { AdvancedMarker } from '@vis.gl/react-google-maps';
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Converts point to % anchor for web.
+ * e.g. `0.5` to `-50%`
+ */
+const toWebAnchor = value => `-${value * 100}%`;
+export class Marker extends React.Component {
+  render() {
+    const {
+      coordinate,
+      title,
+      anchor,
+      zIndex,
+      children
+    } = this.props;
+    const position = {
+      lat: coordinate.latitude,
+      lng: coordinate.longitude
+    };
+    return /*#__PURE__*/_jsx(AdvancedMarker, {
+      position: position,
+      title: title,
+      zIndex: zIndex,
+      anchorLeft: anchor ? toWebAnchor(anchor.x) : undefined,
+      anchorTop: anchor ? toWebAnchor(anchor.y) : undefined,
+      children: children
+    });
+  }
+}
+//# sourceMappingURL=Marker.web.js.map

package/lib/module/components/Marker.web.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","AdvancedMarker","jsx","_jsx","toWebAnchor","value","Marker","Component","render","coordinate","title","anchor","zIndex","children","props","position","lat","latitude","lng","longitude","anchorLeft","x","undefined","anchorTop","y"],"sourceRoot":"../../../src","sources":["components/Marker.web.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,cAAc,QAAQ,2BAA2B;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAG3D;AACA;AACA;AACA;AACA,MAAMC,WAAW,GAAIC,KAAa,IAAK,IAAIA,KAAK,GAAG,GAAG,GAAG;AAEzD,OAAO,MAAMC,MAAM,SAASN,KAAK,CAACO,SAAS,CAAc;EACvDC,MAAMA,CAAA,EAAG;IACP,MAAM;MAAEC,UAAU;MAAEC,KAAK;MAAEC,MAAM;MAAEC,MAAM;MAAEC;IAAS,CAAC,GAAG,IAAI,CAACC,KAAK;IAElE,MAAMC,QAAQ,GAAG;MACfC,GAAG,EAAEP,UAAU,CAACQ,QAAQ;MACxBC,GAAG,EAAET,UAAU,CAACU;IAClB,CAAC;IAED,oBACEhB,IAAA,CAACF,cAAc;MACbc,QAAQ,EAAEA,QAAS;MACnBL,KAAK,EAAEA,KAAM;MACbE,MAAM,EAAEA,MAAO;MACfQ,UAAU,EAAET,MAAM,GAAGP,WAAW,CAACO,MAAM,CAACU,CAAC,CAAC,GAAGC,SAAU;MACvDC,SAAS,EAAEZ,MAAM,GAAGP,WAAW,CAACO,MAAM,CAACa,CAAC,CAAC,GAAGF,SAAU;MAAAT,QAAA,EAErDA;IAAQ,CACK,CAAC;EAErB;AACF","ignoreList":[]}