@rnmapbox/maps 10.0.0-beta.65 → 10.0.0-beta.67

package/android/rctmgl/src/main/java-v10/com/mapbox/rctmgl/components/camera/RCTMGLCamera.kt

@@ -93,7 +93,7 @@ class RCTMGLCamera(private val mContext: Context, private val mManager: RCTMGLCa
         override fun onAnimationStart(animator: Animator) {}
         override fun onAnimationEnd(animator: Animator) {
             if (!hasSentFirstRegion) {
-                mMapView!!.sendRegionChangeEvent(false)
+                mMapView?.sendRegionChangeEvent(false)
                 hasSentFirstRegion = true
             }
         }

package/index.d.ts

@@ -24,7 +24,14 @@ import {
 
 import type {
   SymbolLayerStyleProps,
+  CircleLayerStyleProps,
+  FillExtrusionLayerStyleProps,
+  SkyLayerStyleProps,
+  RasterLayerStyleProps,
+  HeatmapLayerStyleProps,
+  FillLayerStyleProps,
   LineLayerStyleProps,
+  BackgroundLayerStyleProps,
 } from './javascript/utils/MapboxStyles';
 import { getAnnotationsLayerID as _getAnnotationsLayerID } from './javascript/utils/getAnnotationsLayerID';
 import {
@@ -47,10 +54,16 @@ import {
   SymbolLayer as _SymbolLayer,
   Props as _SymbolLayerProps,
 } from './javascript/components/SymbolLayer';
-import {
-  LineLayer as _LineLayer,
+import _LineLayer, {
   Props as _LineLayerProps,
 } from './javascript/components/LineLayer';
+import { Props as _BackgroundLayerProps } from './javascript/components/BackgroundLayer';
+import { Props as _CircleLayerProps } from './javascript/components/CircleLayer';
+import { Props as _FillLayerProps } from './javascript/components/FillLayer';
+import { Props as _FillExtrusionLayerProps } from './javascript/components/FillExtrusionLayer';
+import { Props as _RasterLayerProps } from './javascript/components/RasterLayer';
+import { Props as _HeatmapLayerProps } from './javascript/components/HeatmapLayer';
+import { Props as _SkyLayerProps } from './javascript/components/SkyLayer';
 import {
   ShapeSource as _ShapeSource,
   Props as _ShapeSourceProps,
@@ -111,17 +124,6 @@ type Visibility = 'visible' | 'none';
 type Alignment = 'map' | 'viewport';
 type AutoAlignment = Alignment | 'auto';
 
-type NamedStyles<T> = {
-  [P in keyof T]:
-    | SymbolLayerStyleProps
-    | RasterLayerStyle
-    | LineLayerStyleProps
-    | FillLayerStyle
-    | FillExtrusionLayerStyle
-    | CircleLayerStyle
-    | BackgroundLayerStyle;
-};
-
 export type OnPressEvent = {
   features: Array<GeoJSON.Feature>;
   coordinates: {
@@ -281,13 +283,13 @@ declare namespace MapboxGL {
     class ImageSource extends Component<ImageSourceProps> {}
 
     // layers
-    class FillLayer extends Component<FillLayerProps> {}
-    class FillExtrusionLayer extends Component<FillExtrusionLayerProps> {}
+    class FillLayer extends Component<_FillLayerProps> {}
+    class FillExtrusionLayer extends Component<_FillExtrusionLayerProps> {}
     class LineLayer extends Component<_LineLayerProps> {}
-    class CircleLayer extends Component<CircleLayerProps> {}
+    class CircleLayer extends Component<_CircleLayerProps> {}
     class SymbolLayer extends Component<_SymbolLayerProps> {}
-    class RasterLayer extends Component<RasterLayerProps> {}
-    class BackgroundLayer extends Component<BackgroundLayerProps> {}
+    class RasterLayer extends Component<_RasterLayerProps> {}
+    class BackgroundLayer extends Component<_BackgroundLayerProps> {}
   }
 
   /**
@@ -370,26 +372,6 @@ declare namespace MapboxGL {
 
   class Light extends Component<LightProps> {}
 
-  class StyleSheet extends Component {
-    static create<T extends NamedStyles<T> | NamedStyles<any>>(styles: T): T;
-    camera(
-      stops: { [key: number]: string },
-      interpolationMode?: InterpolationMode,
-    ): void;
-    source(
-      stops: { [key: number]: string },
-      attributeName: string,
-      interpolationMode?: InterpolationMode,
-    ): void;
-    composite(
-      stops: { [key: number]: string },
-      attributeName: string,
-      interpolationMode?: InterpolationMode,
-    ): void;
-
-    identity(attributeName: string): number;
-  }
-
   class Callout extends Component<CalloutProps> {}
   type Style = React.FC<StyleProps>;
 
@@ -403,16 +385,16 @@ declare namespace MapboxGL {
   /**
    * Layers
    */
-  class BackgroundLayer extends Component<BackgroundLayerProps> {}
-  class CircleLayer extends Component<CircleLayerProps> {}
-  class FillExtrusionLayer extends Component<FillExtrusionLayerProps> {}
-  class FillLayer extends Component<FillLayerProps> {}
-  class LineLayer extends Component<LineLayerProps> {}
-  class RasterLayer extends Component<RasterLayerProps> {}
-  class HeatmapLayer extends Component<HeatmapLayerProps> {}
+  class BackgroundLayer extends Component<_BackgroundLayerProps> {}
+  class CircleLayer extends Component<_CircleLayerProps> {}
+  class FillExtrusionLayer extends Component<_FillExtrusionLayerProps> {}
+  class FillLayer extends Component<_FillLayerProps> {}
+  class LineLayer extends Component<_LineLayerProps> {}
+  class RasterLayer extends Component<_RasterLayerProps> {}
+  class HeatmapLayer extends Component<_HeatmapLayerProps> {}
   class Images extends Component<ImagesProps> {}
   class ImageSource extends Component<ImageSourceProps> {}
-  class SkyLayer extends Component<SkyLayerProps> {}
+  class SkyLayer extends Component<_SkyLayerProps> {}
 
   class LocationManager extends Component {
     start(displacement?: number): void;
@@ -639,121 +621,19 @@ export interface Transition {
   delay: number;
 }
 
-export interface BackgroundLayerStyle {
-  visibility?: Visibility | Expression;
-  backgroundColor?: string | Expression;
-  backgroundColorTransition?: Transition | Expression;
-  backgroundPattern?: string | Expression;
-  backgroundPatternTransition?: Transition | Expression;
-  backgroundOpacity?: number | Expression;
-  backgroundOpacityTransition?: Transition | Expression;
-}
+export type BackgroundLayerStyle = BackgroundLayerStyleProps;
 
-export interface CircleLayerStyle {
-  visibility?: Visibility | Expression;
-  circleRadius?: number | Expression;
-  circleRadiusTransition?: Transition | Expression;
-  circleColor?: string | Expression;
-  circleColorTransition?: Transition | Expression;
-  circleBlur?: number | Expression;
-  circleBlurTransition?: Transition | Expression;
-  circleOpacity?: number | Expression;
-  circleOpacityTransition?: Transition | Expression;
-  circleTranslate?: Array<number> | Expression;
-  circleTranslateTransition?: Transition | Expression;
-  circleTranslateAnchor?: Alignment | Expression;
-  circlePitchScale?: Alignment | Expression;
-  circlePitchAlignment?: Alignment | Expression;
-  circleStrokeWidth?: number | Expression;
-  circleStrokeWidthTransition?: Transition | Expression;
-  circleStrokeColor?: string | Expression;
-  circleStrokeColorTransition?: Transition | Expression;
-  circleStrokeOpacity?: number | Expression;
-  circleStrokeOpacityTransition?: Transition | Expression;
-}
+export type CircleLayerStyle = CircleLayerStyleProps;
 
-export interface FillExtrusionLayerStyle {
-  visibility?: Visibility | Expression;
-  fillExtrusionOpacity?: number | Expression;
-  fillExtrusionOpacityTransition?: Transition | Expression;
-  fillExtrusionColor?: string | Expression;
-  fillExtrusionColorTransition?: Transition | Expression;
-  fillExtrusionTranslate?: Array<number> | Expression;
-  fillExtrusionTranslateTransition?: Transition | Expression;
-  fillExtrusionTranslateAnchor?: Alignment | Expression;
-  fillExtrusionPattern?: string | Expression;
-  fillExtrusionPatternTransition?: Transition | Expression;
-  fillExtrusionHeight?: number | Expression;
-  fillExtrusionHeightTransition?: Transition | Expression;
-  fillExtrusionBase?: number | Expression;
-  fillExtrusionBaseTransition?: Transition | Expression;
-}
+export type FillExtrusionLayerStyle = FillExtrusionLayerStyleProps;
 
-export interface FillLayerStyle {
-  visibility?: Visibility | Expression;
-  fillAntialias?: boolean | Expression;
-  fillOpacity?: number | Expression;
-  fillExtrusionOpacityTransition?: Transition | Expression;
-  fillColor?: string | Expression;
-  fillColorTransition?: Transition | Expression;
-  fillOutlineColor?: string | Expression;
-  fillOutlineColorTransition?: Transition | Expression;
-  fillTranslate?: Array<number> | Expression;
-  fillTranslateTransition?: Transition | Expression;
-  fillTranslateAnchor?: Alignment | Expression;
-  fillPattern?: string | Expression;
-  fillPatternTransition?: Transition | Expression;
-}
+export type FillLayerStyle = FillLayerStyleProps;
 
-export interface SkyLayerStyle {
-  skyType: string | Expression;
-  skyAtmosphereSun?: Array<number> | Expression;
-  skyAtmosphereSunIntensity: number | Expression;
-}
+export type SkyLayerStyle = SkyLayerStyleProps;
 
-export interface LineLayerStyle {
-  lineCap?: 'butt' | 'round' | 'square' | Expression;
-  lineJoin?: 'bevel' | 'round' | 'miter' | Expression;
-  lineMiterLimit?: number | Expression;
-  lineRoundLimit?: number | Expression;
-  visibility?: Visibility | Expression;
-  lineOpacity?: number | Expression;
-  lineOpacityTransition?: Transition | Expression;
-  lineColor?: string | Expression;
-  lineColorTransition?: Transition | Expression;
-  lineTranslate?: Array<number> | Expression;
-  lineTranslateTransition?: Transition | Expression;
-  lineTranslateAnchor?: Alignment | Expression;
-  lineWidth?: number | Expression;
-  lineWidthTransition?: Transition | Expression;
-  lineGapWidth?: number | Expression;
-  lineGapWidthTransition?: Transition | Expression;
-  lineOffset?: number | Expression;
-  lineOffsetTransition?: Transition | Expression;
-  lineBlur?: number | Expression;
-  lineBlurTransition?: Transition | Expression;
-  lineDasharray?: Array<number> | Expression;
-  lineDasharrayTransition?: Transition | Expression;
-  linePattern?: string | Expression;
-  linePatternTransition?: Transition | Expression;
-}
+export type LineLayerStyle = LineLayerStyleProps;
 
-export interface RasterLayerStyle {
-  visibility?: Visibility | Expression;
-  rasterOpacity?: number | Expression;
-  rasterOpacityTransition?: Transition | Expression;
-  rasterHueRotate?: Expression;
-  rasterHueRotateTransition?: Transition | Expression;
-  rasterBrightnessMin?: number | Expression;
-  rasterBrightnessMinTransition?: Transition | Expression;
-  rasterBrightnessMax?: number | Expression;
-  rasterBrightnessMaxTransition?: Transition | Expression;
-  rasterSaturation?: number | Expression;
-  rasterSaturationTransition?: Transition | Expression;
-  rasterContrast?: number | Expression;
-  rasterContrastTransition?: Transition | Expression;
-  rasterFadeDuration?: number | Expression;
-}
+export type RasterLayerStyle = RasterLayerStyleProps;
 
 export type TextVariableAnchorValues =
   | 'center'
@@ -769,17 +649,7 @@ export type TextVariableAnchorValues =
 export type SymbolLayerStyle = SymbolLayerStyleProps;
 export type LineLayerStyle = LineLayerStyleProps;
 
-export interface HeatmapLayerStyle {
-  visibility?: Visibility | Expression;
-  heatmapRadius?: number | Expression;
-  heatmapRadiusTransition?: Transition | Expression;
-  heatmapWeight?: number | Expression;
-  heatmapIntensity?: number | Expression;
-  heatmapIntensityTransition?: Transition | Expression;
-  heatmapColor?: string | Expression;
-  heatmapOpacity?: number | Expression;
-  heatmapOpacityTransition?: Transition | Expression;
-}
+export type HeatmapLayerStyle = HeatmapLayerStyleProps;
 
 export interface Point {
   x: number;

package/ios/RCTMGL-v10/RCTMGLLogging.swift

@@ -81,6 +81,19 @@ func errorMessage(_ error: Error) -> String {
   }
 }
 
+/// log message if optional returned by `fn` is nil
+func logged<T>(_ msg: String, info: (() -> String)? = nil, level: Logger.LogLevel = .error, rejecter: RCTPromiseRejectBlock? = nil, fn: () -> T?) ->T? {
+  let ret = fn()
+  if ret == nil {
+    Logger.log(level:level, message: "\(msg) \(info?() ?? "")")
+    rejecter?(msg, "\(info?() ?? "")", NSError(domain:"is null", code: 0))
+    return nil
+  } else {
+    return ret
+  }
+}
+
+/// log message if `fn` throws and return nil
 func logged<T>(_ msg: String, info: (() -> String)? = nil, level: Logger.LogLevel = .error, rejecter: RCTPromiseRejectBlock? = nil, fn : () throws -> T) -> T? {
   do {
     return try fn()

package/ios/RCTMGL-v10/RCTMGLMarkerView.swift

@@ -1,6 +1,36 @@
 import MapboxMaps
 import UIKit
 
+/// dummy parent of RCTMGLMarkerView, so react-native changes visibility on RCTMGLMarkerView,
+/// and Mapbox changes visibility on RCTMGLMarkerViewParentViewAnnotation
+class RCTMGLMarkerViewParentViewAnnotation : UIView {
+  required init(marker: RCTMGLMarkerView) {
+    super.init(frame: marker.bounds)
+    insertSubview(marker, at: 0)
+  }
+  
+  required init?(coder: NSCoder) {
+    fatalError("not implented")
+  }
+
+  func remove(marker: RCTMGLMarkerView) {
+    marker.removeFromSuperview()
+  }
+
+  func updateSize(_ size: CGSize, oldOffset: CGVector, newOffset: CGVector) {
+    let actSize = self.frame.size
+    if actSize.width != size.width || actSize.height != size.height {
+      let dx = ((size.width/2.0) - newOffset.dx) - ((actSize.width/2.0) - oldOffset.dx)
+      let dy = ((size.height/2.0) + newOffset.dy) - ((actSize.height/2.0) + oldOffset.dy)
+      print(" => size=\(size) actSize=\(actSize) newOffset=\(newOffset) oldOffset=\(oldOffset)  dx=\(dx) dy=\(dy)")
+      var frame = self.frame
+      frame = frame.offsetBy(dx: -dx, dy: -dy)
+      frame.size = size
+      self.frame = frame
+    }
+  }
+}
+
 class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
   // MARK: - Instance variables
   
@@ -8,6 +38,7 @@ class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
   let id: String = "marker-\(UUID().uuidString)"
   
   weak var map: RCTMGLMapView?
+  weak var _annotationView: RCTMGLMarkerViewParentViewAnnotation?
   
   var didAddToMap = false
   
@@ -31,13 +62,7 @@ class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
   
   @objc var isSelected: Bool = false {
     didSet {
-      let hasBecomeSelected = isSelected && !oldValue
-      
-      if hasBecomeSelected {
-        setSelected()
-      } else {
-        update()
-      }
+      update()
     }
   }
 
@@ -89,36 +114,33 @@ class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
   
   // MARK: - React methods
   
+  override var isHidden: Bool {
+    get {
+      return super.isHidden
+    }
+    set {
+      super.isHidden = newValue
+    }
+  }
+  
   override func reactSetFrame(_ frame: CGRect) {
     let prev = self.frame
     var next = frame
     
     let frameDidChange = !next.equalTo(prev)
-    if (frameDidChange) {
-      if prev.minX == 0 || prev.minY == 0 {
-        // Start the view offscreen to make it invisible until the annotation manager sets it to
-        // the correct point on the map.
-        next = CGRect(
-          x: -10000,
-          y: -10000,
-          width: next.width,
-          height: next.height
-        )
-      } else {
-        // Calculate the next position to temporarily place the view before the annotation manager
-        // sets it to the correct point on the map.
-        let dx = (next.width - prev.width) / 2
-        let dy = (next.height - prev.height) / 2
-        next = CGRect(
-          x: prev.minX - dx,
-          y: prev.minY - dy,
-          width: next.width,
-          height: next.height
-        )
-      }
+    if frameDidChange {
+      next = CGRect(
+        x: 0,
+        y: 0,
+        width: next.width,
+        height: next.height
+      )
     }
-    
+
     super.reactSetFrame(next)
+    if frameDidChange {
+      annotationView.updateSize(next.size, oldOffset:calcOffset(size: prev.size), newOffset: calcOffset(size: next.size))
+    }
     addOrUpdate()
   }
   
@@ -156,7 +178,7 @@ class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
 
     do {
       let options = getOptions()
-      try annotationManager.add(self, id: id, options: options)
+      try annotationManager.add(annotationView, id: id, options: options)
       didAddToMap = true
     } catch {
       Logger.log(level: .error, message: "[MarkerView] Error adding annotation", error: error)
@@ -174,27 +196,16 @@ class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
     
     do {
       let options = getOptions()
-      try annotationManager.update(self, options: options)
+      try annotationManager.update(annotationView, options: options)
     } catch {
       Logger.log(level: .error, message: "[MarkerView] Error updating annotation", error: error)
     }
   }
   
-  /// There is a Mapbox bug where `selected` does not cause the marker to move to the front, so we can't simply update the component.
-  /// This forces that effect. See https://github.com/mapbox/mapbox-maps-ios/issues/1599.
-  private func setSelected() {
-    if let options = annotationManager?.options(for: self) {
-      do {
-        annotationManager?.remove(self)
-        try annotationManager?.add(self, id: id, options: options)
-      } catch {
-        Logger.log(level: .error, message: "[MarkerView] Error selecting annotation", error: error)
-      }
-    }
-  }
-  
   private func remove() {
-    annotationManager?.remove(self)
+    annotationManager?.remove(annotationView)
+    annotationView.remove(marker: self)
+    self._annotationView = nil
     didAddToMap = false
   }
   
@@ -206,29 +217,49 @@ class RCTMGLMarkerView: UIView, RCTMGLMapComponent {
       geometry = Geometry.point(point)
     }
     
-    let offset = getOffset()
+    let size = self.bounds.size
+    let offset = calcOffset(size: size)
   
     let options = ViewAnnotationOptions(
       geometry: geometry,
-      width: self.bounds.width,
-      height: self.bounds.height,
+      width: size.width,
+      height: size.height,
       allowOverlap: allowOverlap,
       offsetX: offset.dx,
-      offsetY: offset.dy
+      offsetY: offset.dy,
+      selected: isSelected
     )
     return options
   }
   
-  private func getOffset() -> CGVector {
+  private func calcOffset(size: CGSize) -> CGVector {
     guard let anchor = anchor, let anchorX = anchor["x"]?.CGFloat, let anchorY = anchor["y"]?.CGFloat else {
       return .zero
     }
           
-    // Create a modified offset, normalized from 0..1 to -1..1 and scaled to
-    // the view size.
-    let x = (anchorX * 2 - 1) * (self.bounds.width / 2) * -1
-    let y = (anchorY * 2 - 1) * (self.bounds.height / 2)
+    let x = (anchorX * 2 - 1) * (size.width / 2) * -1
+    let y = (anchorY * 2 - 1) * (size.height / 2)
 
     return CGVector(dx: x, dy: y)
   }
+  
+  var annotationView : RCTMGLMarkerViewParentViewAnnotation {
+    if let result = _annotationView {
+      return result
+    }
+    let result = RCTMGLMarkerViewParentViewAnnotation(marker: self)
+    _annotationView = result
+    return result
+  }
+
+  @objc override func didMoveToSuperview() {
+    // React tends to add back us to our original superview,
+    // https://github.com/facebook/react-native/blob/11ece22fc6955d169def9ef9f2809c24bc457ba8/React/Views/UIView%2BReact.m#L172-L177
+    // fix that if we see that
+    if let expectedParent = _annotationView {
+      if superview != nil && superview != expectedParent {
+        expectedParent.addSubview(self)
+      }
+    }
+  }
 }