react-native-maps 1.21.0-alpha.11 → 1.21.0-alpha.111

package/lib/MapMarker.js

@@ -28,12 +28,16 @@ const React = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const decorateMapComponent_1 = __importStar(require("./decorateMapComponent"));
 const MapMarkerNativeComponent_1 = require("./MapMarkerNativeComponent");
+const NativeComponentMarker_1 = require("./specs/NativeComponentMarker");
+const ProviderConstants_1 = require("./ProviderConstants");
+const fixImageProp_1 = require("./fixImageProp");
 class MapMarker extends React.Component {
     getNativeComponent;
     getMapManagerCommand;
     getUIManagerCommand;
     static Animated;
     marker;
+    fabricMarker = undefined;
     constructor(props) {
         super(props);
         this.marker = React.createRef();
@@ -49,27 +53,59 @@ class MapMarker extends React.Component {
     }
     showCallout() {
         if (this.marker.current) {
-            MapMarkerNativeComponent_1.Commands.showCallout(this.marker.current);
+            if (this.fabricMarker) {
+                // @ts-ignore
+                NativeComponentMarker_1.Commands.showCallout(this.marker.current);
+            }
+            else {
+                MapMarkerNativeComponent_1.Commands.showCallout(this.marker.current);
+            }
         }
     }
     hideCallout() {
         if (this.marker.current) {
-            MapMarkerNativeComponent_1.Commands.hideCallout(this.marker.current);
+            if (this.fabricMarker) {
+                // @ts-ignore
+                NativeComponentMarker_1.Commands.hideCallout(this.marker.current);
+            }
+            else {
+                MapMarkerNativeComponent_1.Commands.hideCallout(this.marker.current);
+            }
         }
     }
     setCoordinates(coordinate) {
         if (this.marker.current) {
-            MapMarkerNativeComponent_1.Commands.setCoordinates(this.marker.current, coordinate);
+            if (this.fabricMarker) {
+                NativeComponentMarker_1.Commands.setCoordinates(
+                // @ts-ignore
+                this.marker.current, coordinate.latitude, coordinate.longitude);
+            }
+            else {
+                MapMarkerNativeComponent_1.Commands.setCoordinates(this.marker.current, coordinate);
+            }
         }
     }
     redrawCallout() {
         if (this.marker.current) {
-            MapMarkerNativeComponent_1.Commands.redrawCallout(this.marker.current);
+            if (this.fabricMarker) {
+                // @ts-ignore
+                NativeComponentMarker_1.Commands.redrawCallout(this.marker.current);
+            }
+            else {
+                MapMarkerNativeComponent_1.Commands.redrawCallout(this.marker.current);
+            }
         }
     }
     animateMarkerToCoordinate(coordinate, duration = 500) {
         if (this.marker.current) {
-            MapMarkerNativeComponent_1.Commands.animateMarkerToCoordinate(this.marker.current, coordinate, duration);
+            if (this.fabricMarker) {
+                NativeComponentMarker_1.Commands.animateToCoordinates(
+                // @ts-ignore
+                this.marker.current, coordinate.latitude, coordinate.longitude, duration);
+            }
+            else {
+                MapMarkerNativeComponent_1.Commands.animateMarkerToCoordinate(this.marker.current, coordinate, duration);
+            }
         }
     }
     redraw() {
@@ -79,18 +115,24 @@ class MapMarker extends React.Component {
     }
     render() {
         const { stopPropagation = false } = this.props;
-        let image;
-        if (this.props.image) {
-            image = react_native_1.Image.resolveAssetSource(this.props.image) || {};
-            image = image.uri || this.props.image;
+        if (this.fabricMarker === undefined) {
+            const provider = this.context;
+            this.fabricMarker = !(react_native_1.Platform.OS === 'ios' && provider === ProviderConstants_1.PROVIDER_GOOGLE);
         }
         let icon;
-        if (this.props.icon) {
-            icon = react_native_1.Image.resolveAssetSource(this.props.icon) || {};
-            icon = icon.uri;
+        if (this.props.icon && this.fabricMarker) {
+            icon = (0, fixImageProp_1.fixImageProp)(this.props.icon);
+        }
+        let image;
+        if (this.props.image && this.fabricMarker) {
+            image = (0, fixImageProp_1.fixImageProp)(this.props.image);
         }
         const AIRMapMarker = this.getNativeComponent();
-        return (<AIRMapMarker {...this.props} ref={this.marker} image={image} icon={icon} style={[styles.marker, this.props.style]} onPress={event => {
+        return (<AIRMapMarker {...this.props} ref={this.marker} 
+        // @ts-ignore
+        image={image} 
+        // @ts-ignore
+        icon={icon} style={[styles.marker, this.props.style]} onPress={event => {
                 if (stopPropagation) {
                     event.stopPropagation();
                 }

package/lib/MapMarkerNativeComponent.js

@@ -9,9 +9,7 @@ exports.Commands = (0, codegenNativeCommands_1.default)({
     supportedCommands: [
         'showCallout',
         'hideCallout',
-        'redrawCallout',
         'animateMarkerToCoordinate',
-        'redraw',
         'setCoordinates',
     ],
 });

package/lib/MapOverlay.d.ts

@@ -60,6 +60,7 @@ export declare class MapOverlay extends React.Component<MapOverlayProps> {
     getMapManagerCommand: (name: string) => MapManagerCommand;
     getUIManagerCommand: (name: string) => UIManagerCommand;
     static Animated: Animated.AnimatedComponent<typeof MapOverlay>;
+    private fabricOverlay?;
     render(): React.JSX.Element;
 }
 type Coordinate = [number, number];

package/lib/MapOverlay.js

@@ -27,24 +27,26 @@ exports.MapOverlay = void 0;
 const React = __importStar(require("react"));
 const react_native_1 = require("react-native");
 const decorateMapComponent_1 = __importStar(require("./decorateMapComponent"));
+const fixImageProp_1 = require("./fixImageProp");
 class MapOverlay extends React.Component {
     getNativeComponent;
     getMapManagerCommand;
     getUIManagerCommand;
     static Animated;
+    fabricOverlay = undefined;
     render() {
         const { opacity = 1.0 } = this.props;
-        let image;
-        if (typeof this.props.image !== 'number' &&
-            this.props.image.uri?.startsWith('http')) {
-            image = this.props.image.uri;
-        }
-        else {
-            const sourceAsset = react_native_1.Image.resolveAssetSource(this.props.image) || {};
-            image = sourceAsset.uri;
+        if (this.fabricOverlay === undefined) {
+            this.fabricOverlay = react_native_1.Platform.OS === 'android';
         }
         const AIRMapOverlay = this.getNativeComponent();
-        return (<AIRMapOverlay {...this.props} opacity={opacity} image={image} style={[styles.overlay, this.props.style]}/>);
+        let image = this.props.image;
+        if (this.props.image && this.fabricOverlay) {
+            image = (0, fixImageProp_1.fixImageProp)(this.props.image);
+        }
+        return (<AIRMapOverlay {...this.props} opacity={opacity} 
+        // @ts-ignore
+        image={image} style={[styles.overlay, this.props.style]}/>);
     }
 }
 exports.MapOverlay = MapOverlay;

package/lib/MapPolygon.d.ts

@@ -124,7 +124,7 @@ export type MapPolygonProps = ViewProps & {
     zIndex?: number;
 };
 type NativeProps = MapPolygonProps & {
-    ref: React.RefObject<View>;
+    ref: React.RefObject<View | null>;
 };
 export declare class MapPolygon extends React.Component<MapPolygonProps> {
     context: React.ContextType<typeof ProviderContext>;

package/lib/MapPolyline.d.ts

@@ -14,7 +14,7 @@ export type MapPolylineProps = ViewProps & {
      * The fill color to use for the path.
      *
      * @default `#000`, `rgba(r,g,b,0.5)`
-     * @platform iOS: Supported
+     * @platform iOS: Apple Maps only
      * @platform Android: Not supported
      */
     fillColor?: string;
@@ -32,8 +32,8 @@ export type MapPolylineProps = ViewProps & {
      *
      * @default `round`
      * @platform iOS: Apple Maps only
-     * @platform Android: Supported
-     */
+     * @platform Android: supported
+     * */
     lineCap?: LineCapType;
     /**
      * An array of numbers specifying the dash pattern to use for the path.
@@ -42,8 +42,8 @@ export type MapPolylineProps = ViewProps & {
      * The values in the array alternate, starting with the first line segment length,
      * followed by the first gap length, followed by the second line segment length, and so on.
      *
-     * @platform iOS: Supported
-     * @platform Android: Supported
+     * @platform iOS: Apple Maps only
+     * @platform Android: supported
      */
     lineDashPattern?: number[];
     /**
@@ -60,7 +60,7 @@ export type MapPolylineProps = ViewProps & {
      * The line join style to apply to corners of the path.
      *
      * @platform iOS: Apple Maps only
-     * @platform Android: Not supported
+     * @platform Android: supported
      */
     lineJoin?: LineJoinType;
     /**
@@ -125,7 +125,7 @@ export type MapPolylineProps = ViewProps & {
     zIndex?: number;
 };
 type NativeProps = MapPolylineProps & {
-    ref: React.RefObject<View>;
+    ref: React.RefObject<View | null>;
 };
 export declare class MapPolyline extends React.Component<MapPolylineProps> {
     context: React.ContextType<typeof ProviderContext>;

package/lib/MapView.d.ts

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { Animated as RNAnimated, Animated, NativeSyntheticEvent, ViewProps } from 'react-native';
 import { CalloutPressEvent, ClickEvent, Frame, LatLng, MarkerDeselectEvent, MarkerDragEvent, MarkerDragStartEndEvent, MarkerPressEvent, MarkerSelectEvent, Point, Provider, Region } from './sharedTypes';
-import { Address, BoundingBox, Camera, CameraZoomRange, ChangeEvent, Details, EdgePadding, FitToOptions, IndoorBuildingEvent, IndoorLevelActivatedEvent, KmlMapEvent, LongPressEvent, MapPressEvent, MapStyleElement, MapType, MapTypes, PanDragEvent, PoiClickEvent, SnapshotOptions, UserLocationChangeEvent } from './MapView.types';
+import { ActiveIndoorLevel, Address, BoundingBox, Camera, CameraZoomRange, ChangeEvent, Details, EdgePadding, FitToOptions, IndoorBuilding, KmlMapEvent, LongPressEvent, MapPressEvent, MapStyleElement, MapType, MapTypes, PanDragEvent, PoiClickEvent, SnapshotOptions, UserLocationChangeEvent } from './MapView.types';
 import { Modify } from './sharedTypesInternal';
 import { MapViewNativeComponentType } from './MapViewNativeComponent';
 import AnimatedRegion from './AnimatedRegion';
@@ -217,14 +217,14 @@ export type MapViewProps = ViewProps & {
      * @platform iOS: Google Maps only
      * @platform Android: Supported
      */
-    onIndoorBuildingFocused?: (event: IndoorBuildingEvent) => void;
+    onIndoorBuildingFocused?: (indoorBuilding: IndoorBuilding) => void;
     /**
      * Callback that is called when a level on indoor building is activated
      *
      * @platform iOS: Google Maps only
      * @platform Android: Supported
      */
-    onIndoorLevelActivated?: (event: IndoorLevelActivatedEvent) => void;
+    onIndoorLevelActivated?: (indoorLevel: ActiveIndoorLevel) => void;
     /**
      * Callback that is called once the kml is fully loaded.
      *
@@ -245,7 +245,7 @@ export type MapViewProps = ViewProps & {
      * @platform iOS: Google Maps only
      * @platform Android: Supported
      */
-    onMapLoaded?: (event: NativeSyntheticEvent<{}>) => void;
+    onMapLoaded?: (event: NativeSyntheticEvent<null>) => void;
     /**
      * Callback that is called once the map is ready.
      *
@@ -255,7 +255,7 @@ export type MapViewProps = ViewProps & {
      * @platform iOS: Supported
      * @platform Android: Supported
      */
-    onMapReady?: (event?: NativeSyntheticEvent<{}>) => void;
+    onMapReady?: (event?: NativeSyntheticEvent<null>) => void;
     /**
      * Callback that is called when a marker on the map becomes deselected.
      * This will be called when the callout for that marker is about to be hidden.
@@ -426,7 +426,7 @@ export type MapViewProps = ViewProps & {
      * If `false` compass won't be displayed on the map.
      *
      * @default true
-     * @platform iOS: Supported
+     * @platform iOS: Supported (adaptive on Apple Maps, visible only if map is not pointing north)
      * @platform Android: Supported
      */
     showsCompass?: boolean;
@@ -454,32 +454,14 @@ export type MapViewProps = ViewProps & {
      * @platform Android: Supported
      */
     showsMyLocationButton?: boolean;
-    /**
-     * If `false` points of interest won't be displayed on the map.
-     * TODO: DEPRECATED? Doesn't seem to do anything
-     *
-     * @default true
-     * @platform iOS: Maybe Apple Maps?
-     * @platform Android: Not supported
-     */
-    showsPointsOfInterest?: boolean;
     /**
      * A Boolean indicating whether the map shows scale information.
      *
-     * @default true
+     * @default false
      * @platform iOS: Apple Maps only
      * @platform Android: Not supported
      */
     showsScale?: boolean;
-    /**
-     * A Boolean value indicating whether the map displays traffic information.
-     * TODO: Look into android support
-     *
-     * @default false
-     * @platform iOS: Supported
-     * @platform Android: Not supported?
-     */
-    showsTraffic?: boolean;
     /**
      * If `true` the users location will be displayed on the map.
      *
@@ -510,8 +492,8 @@ export type MapViewProps = ViewProps & {
      * Sets the map to the style selected.
      *
      * @default System setting
-     * @platform iOS: Apple Maps only (iOS >= 13.0)
-     * @platform Android: Not supported
+     * @platform iOS: Supported
+     * @platform Android: Supported
      */
     userInterfaceStyle?: 'light' | 'dark';
     /**
@@ -604,7 +586,7 @@ type ModifiedProps = Modify<MapViewProps, {
     initialRegion?: MapViewProps['initialRegion'] | null;
 }>;
 export type NativeProps = Omit<ModifiedProps, 'customMapStyle' | 'onRegionChange' | 'onRegionChangeComplete'> & {
-    ref: React.RefObject<MapViewNativeComponentType>;
+    ref: React.RefObject<MapViewNativeComponentType | null>;
     customMapStyleString?: string;
     handlePanDrag?: boolean;
     onChange?: (e: ChangeEvent) => void;
@@ -626,6 +608,7 @@ declare class MapView extends React.Component<MapViewProps, State> {
         duration?: number;
     }): void;
     animateToRegion(region: Region, duration?: number): void;
+    setRegion(region: Region): void;
     fitToElements(options?: FitToOptions): void;
     fitToSuppliedMarkers(markers: string[], options?: FitToOptions): void;
     fitToCoordinates(coordinates?: LatLng[], options?: FitToOptions): void;
@@ -636,7 +619,7 @@ declare class MapView extends React.Component<MapViewProps, State> {
      */
     getMapBoundaries(): Promise<BoundingBox>;
     setMapBoundaries(northEast: LatLng, southWest: LatLng): void;
-    setIndoorActiveLevelIndex(activeLevelIndex: number): void;
+    setIndoorActiveLevelIndex(activeLevelIndex: number): void | Promise<never>;
     /**
      * Takes a snapshot of the map and saves it to a picture
      * file or returns the image as a base64 encoded string.
@@ -707,8 +690,13 @@ declare class MapView extends React.Component<MapViewProps, State> {
     private handleMapPress;
     private handleMarkerPress;
     private handleMarkerSelect;
+    private handleKmlReady;
     private handleMarkerDeselect;
     private handleRegionChange;
+    private handleRegionChangeStarted;
+    private handleIndoorBuildingFocused;
+    private handleIndoorLevelActivated;
+    private handleRegionChangeComplete;
     render(): React.JSX.Element;
 }
 export declare const AnimatedMapView: RNAnimated.AnimatedComponent<typeof MapView>;