@rnmapbox/maps 10.0.0-beta.33 → 10.0.0-beta.34

package/.eslintrc.js

@@ -1,7 +1,7 @@
 module.exports = {
   root: true,
   parser: '@babel/eslint-parser',
-  plugins: ['react', 'react-native', 'fp', 'import'],
+  plugins: ['react', 'react-native', 'import'],
   env: {
     jest: true,
   },
@@ -38,6 +38,7 @@ module.exports = {
   extends: [
     'eslint:recommended',
     'plugin:react/recommended',
+    'plugin:jest/recommended',
     '@react-native-community',
     'prettier',
   ],
@@ -76,7 +77,6 @@ module.exports = {
     'no-use-before-define': ['error', { functions: false }],
     'no-unused-expressions': ['error', { allowTaggedTemplates: true }],
     'no-plusplus': ['error', { allowForLoopAfterthoughts: true }],
-    'fp/no-mutating-methods': 'warn',
     'react-native/no-inline-styles': 0,
   },
   ignorePatterns: ['**/rnmapbox.web.symlink'],

package/.nvmrc

@@ -1,2 +1,2 @@
-v14.17.0
+v14.20.0
 

package/README-v10.md

@@ -80,7 +80,7 @@ code ios/Podfile
 pod 'React-Core', :path => '../node_modules/react-native/React', modular_headers: true
 ```
 
-IOS:
+iOS:
 
  * Add `$(SDKROOT)/usr/lib/swift` to Library search paths.
 

package/README.md

@@ -12,7 +12,7 @@
 </tr>
 </table>
 
-|  [![npm version](https://badge.fury.io/js/%40react-native-mapbox-gl%2Fmaps.svg)](https://badge.fury.io/js/%40react-native-mapbox-gl%2Fmaps)  | [![iOS & Android Build](https://github.com/rnmapbox/maps/actions/workflows/on-push.yml/badge.svg?branch=main)](https://github.com/rnmapbox/maps/actions/workflows/on-push.yml?branch=main)  |
+|  [![npm version](https://badge.fury.io/js/%40rnmapbox%2Fmaps.svg)](https://badge.fury.io/js/%40rnmapbox%2Fmaps)  | [![iOS & Android Build](https://github.com/rnmapbox/maps/actions/workflows/on-push.yml/badge.svg?branch=main)](https://github.com/rnmapbox/maps/actions/workflows/on-push.yml?branch=main)  |
 |---|---|
 
 
@@ -91,17 +91,25 @@ _See [iOS](ios/install.md) & [Android](android/install.md) setup guide for more
 
 ### Step 1 - Install Package:
 
+#### Using `yarn`
+Install the latest source from git:
 ```sh
-# install with Yarn
-# yarn add @rnmapbox/maps
 yarn add rnmapbox/maps#main
+``` 
 
+#### Using `npm`
+Install the latest source from git:
+```sh
+npm install --save rnmapbox/maps#main
+``` 
 
-# or install with NPM
-# npm install @rnmapbox/maps --save
-npm install rnmapbox/maps#main --save
+#### Installing other versions
+Replace `rnmapbox/maps#main` with the following to install other versions:
+- `@rnmapbox/maps` installs the latest release
 
-```
+
+#### Using `expo`
+Please follow the [Expo Guide](/plugin/install.md).
 
 ### Step 2 - Installation Guides:
 
@@ -136,42 +144,39 @@ npm run android
 ```
 
 ## Adding a map
-
 ```js
-import React, { Component } from 'react';
+import React from 'react';
 import { StyleSheet, View } from 'react-native';
 import MapboxGL from '@rnmapbox/maps';
 
 MapboxGL.setAccessToken('<YOUR_ACCESSTOKEN>');
 
+const App = () => {
+  return (
+    <View style={styles.page}>
+      <View style={styles.container}>
+        <MapboxGL.MapView style={styles.map} />
+      </View>
+    </View>
+  );
+}
+
+export default App;
+
 const styles = StyleSheet.create({
   page: {
     flex: 1,
     justifyContent: 'center',
     alignItems: 'center',
-    backgroundColor: '#F5FCFF'
   },
   container: {
     height: 300,
     width: 300,
-    backgroundColor: 'tomato'
   },
   map: {
     flex: 1
   }
 });
-
-export default class App extends Component {
-  render() {
-    return (
-      <View style={styles.page}>
-        <View style={styles.container}>
-          <MapboxGL.MapView style={styles.map} />
-        </View>
-      </View>
-    );
-  }
-}
 ```
 ---
 ## Documentation

package/android/install.md

@@ -20,7 +20,7 @@ Overwrite mapbox dependencies within your `android/build.gradle > buildscript >
 buildscript {
     ext {
         // ...
-        RNMapboxMapsImpl = "maplibre" // optinal - as this is the default
+        RNMapboxMapsImpl = "maplibre" // optional - as this is the default
 
         RNMapboxMapsLibs = { // optional - only required if you want to customize it
             implementation ("org.maplibre.gl:android-sdk:9.5.2")

package/android/rctmgl/src/main/java-v10/com/mapbox/rctmgl/components/mapview/RCTMGLMapView.kt

@@ -527,7 +527,11 @@ open class RCTMGLMapView(private val mContext: Context, var mManager: RCTMGLMapV
         layerWaiters.remove(layerId)
     }
 
-    fun waitForLayer(layerID: String, callback: FoundLayerCallback) {
+    fun waitForLayer(layerID: String?, callback: FoundLayerCallback) {
+        if(layerID == null){
+            callback.found(null)
+            return
+        }
         if (savedStyle != null) {
             val layer = savedStyle?.getLayer(layerID)
             if (layer != null) {

package/android/rctmgl/src/main/java-v10/com/mapbox/rctmgl/components/styles/layers/RCTLayer.kt

@@ -49,7 +49,7 @@ abstract class RCTLayer<T : Layer?>(protected var mContext: Context) : AbstractS
         mSourceID = sourceID
     }
 
-    fun setAboveLayerID(aboveLayerID: String) {
+    fun setAboveLayerID(aboveLayerID: String?) {
         if (mAboveLayerID != null && mAboveLayerID == aboveLayerID) {
             return
         }
@@ -60,7 +60,7 @@ abstract class RCTLayer<T : Layer?>(protected var mContext: Context) : AbstractS
         }
     }
 
-    fun setBelowLayerID(belowLayerID: String) {
+    fun setBelowLayerID(belowLayerID: String?) {
         if (mBelowLayerID != null && mBelowLayerID == belowLayerID) {
             return
         }
@@ -147,7 +147,7 @@ abstract class RCTLayer<T : Layer?>(protected var mContext: Context) : AbstractS
     }
 
     fun addAbove(aboveLayerID: String?) {
-        mMapView!!.waitForLayer(aboveLayerID!!, object : FoundLayerCallback {
+        mMapView!!.waitForLayer(aboveLayerID, object : FoundLayerCallback {
             override fun found(layer: Layer?) {
                 if (!hasInitialized()) {
                     return
@@ -160,7 +160,7 @@ abstract class RCTLayer<T : Layer?>(protected var mContext: Context) : AbstractS
     }
 
     fun addBelow(belowLayerID: String?) {
-        mMapView!!.waitForLayer(belowLayerID!!, object : FoundLayerCallback {
+        mMapView!!.waitForLayer(belowLayerID, object : FoundLayerCallback {
             override fun found(layer: Layer?) {
                 if (!hasInitialized()) {
                     return
@@ -271,4 +271,4 @@ abstract class RCTLayer<T : Layer?>(protected var mContext: Context) : AbstractS
     companion object {
         const val LOG_TAG = "RCTLayer"
     }
-}
+}

package/docs/Annotation.md

@@ -1,8 +1,8 @@
 <!-- This file was autogenerated from Annotation.js do not modify -->
-## <MapboxGL.Annotation />
-### 
+# <MapboxGL.Annotation />
 
-### props
+
+## props
 | Prop | Type | Default | Required | Description |
 | ---- | :--: | :-----: | :------: | :----------: |
 | id | `string` | `none` | `true` | FIX ME NO DESCRIPTION |
@@ -15,22 +15,22 @@
 | style | `any` | `none` | `false` | FIX ME NO DESCRIPTION |
 | icon | `union` | `none` | `false` | FIX ME NO DESCRIPTION |
 
-### methods
-#### onPress()
+## methods
+### onPress()
 
 
 
-##### arguments
+#### arguments
 | Name | Type | Required | Description  |
 | ---- | :--: | :------: | :----------: |
 
 
 
-#### symbolStyle()
+### symbolStyle()
 
 
 
-##### arguments
+#### arguments
 | Name | Type | Required | Description  |
 | ---- | :--: | :------: | :----------: |
 

package/docs/Annotations.md

@@ -1,17 +1,19 @@
-Comparsion of various annotations available in React native mapbox:
+# Annotations Comparison
 
-|*Feature*              | *SymbolLayer*      |*PointAnnotation*                     |*MarkerView*             |*CircleLayer*        |
-|-----------------------|--------------------|--------------------------------------|-------------------------|---------------------|
-|Can use images         | ✓            |                                      |                         |                     |
-|RN Views as childern   | iOS: static        |iOS: interactive <br/> android: static|interactive              |                     |
-|Interactions           | click              |iOS: full <br/> android: click & drag & callout  | supports full interactivity in the sense that inside MarkerViews one can place any RN View, which can be interacted with. Not to be misunderstood with drag n drop interactivity.                     | click          |
-|Control Z-index        | &check;            |iOS: always on top, android: n/a      |always on top            | &check;             |
-|Clustering             | &check;            |                                      |                         | &check;             |
-|Style with expressions | &check;            |                                      |                         | &check;             |
-|iOS implementation     | [MGLStyleSymbolLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLSymbolStyleLayer.html)     |[MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html)                     |[MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html)       |[MGLCircleStyleLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLCircleStyleLayer.html)       |
-|android implementation | [SymbolLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/SymbolLayer.html)|[annotation.Symbol](https://docs.mapbox.com/android/api/plugins/annotation/0.8.0/com/mapbox/mapboxsdk/plugins/annotation/Symbol.html)|[annotation.Marker](https://docs.mapbox.com/android/api/plugins/markerview/0.4.0/com/mapbox/mapboxsdk/plugins/markerview/MarkerView.html) |[CircleLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/CircleLayer.html)|
+Comparsion of various annotations available in React native mapbox:
 
+| *Feature*              | *SymbolLayer*      | *PointAnnotation*                                                                                                                     |*MarkerView*             |*CircleLayer*        |
+|------------------------|--------------------|---------------------------------------------------------------------------------------------------------------------------------------|-------------------------|---------------------|
+| Can use images         | &check;            |                                                                                                                                       |                         |                     |
+| RN Views as children   | iOS: static        | iOS: interactive <br/> Android: static                                                                                                |interactive              |                     |
+| Interactions           | click              | iOS: full <br/> Android: click & drag & callout                                                                                       | supports full interactivity in the sense that inside MarkerViews one can place any RN View, which can be interacted with. Not to be misunderstood with drag n drop interactivity.                     | click          |
+| Control Z-index        | &check;            | iOS: always on top, Android: n/a                                                                                                      |always on top            | &check;             |
+| Clustering             | &check;            |                                                                                                                                       |                         | &check;             |
+| Style with expressions | &check;            |                                                                                                                                       |                         | &check;             |
+| iOS implementation     | [MGLStyleSymbolLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLSymbolStyleLayer.html)     | [MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html)                                        |[MGLAnnotationView](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLAnnotationView.html)       |[MGLCircleStyleLayer](https://docs.mapbox.com/ios/api/maps/5.8.0/Classes/MGLCircleStyleLayer.html)       |
+| Android implementation | [SymbolLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/SymbolLayer.html)| [annotation.Symbol](https://docs.mapbox.com/android/api/plugins/annotation/0.8.0/com/mapbox/mapboxsdk/plugins/annotation/Symbol.html) |[annotation.Marker](https://docs.mapbox.com/android/api/plugins/markerview/0.4.0/com/mapbox/mapboxsdk/plugins/markerview/MarkerView.html) |[CircleLayer](https://docs.mapbox.com/android/api/map-sdk/9.0.0/com/mapbox/mapboxsdk/style/layers/CircleLayer.html)|
 
 Related links:
+
 * iOS [markers and annotations](https://docs.mapbox.com/ios/maps/overview/markers-and-annotations/)
-* android [annotation plugin](https://docs.mapbox.com/android/plugins/overview/annotation/)
+* Android [annotation plugin](https://docs.mapbox.com/android/plugins/overview/annotation/)

package/docs/Atmosphere.md

@@ -1,14 +1,14 @@
 <!-- This file was autogenerated from Atmosphere.tsx do not modify -->
-## <MapboxGL.Atmosphere />
-### 
+# <MapboxGL.Atmosphere />
 
-### props
+
+## props
 | Prop | Type | Default | Required | Description |
 | ---- | :--: | :-----: | :------: | :----------: |
 | style | `AtmosphereLayerStyleProps` | `none` | `true` | FIX ME NO DESCRIPTION |
 
 
-### styles
+## styles
 
 * <a href="#range">range</a><br/>
 * <a href="#color">color</a><br/>
@@ -19,247 +19,247 @@
 
 ___
 
-#### range
+### range
 Name: `range`
 
-#### Description
+### Description
 The start and end distance range in which fog fades from fully transparent to fully opaque. The distance to the point at the center of the map is defined as zero, so that negative range values are closer to the camera, and positive values are farther away.
 
-#### Type
+### Type
 `array<number>`
-#### Default Value
+### Default Value
 `[0.5,10]`
 
-#### Minimum
+### Minimum
 `-20`
 
 
-#### Maximum
+### Maximum
 `20`
 
-#### Expression
+### Expression
 
 Parameters: `zoom`
 ___
 
-#### Name
+### Name
 
 `rangeTransition`
 
-#### Description
+### Description
 
-The transition affecting any changes to this layer’s range propery.
+The transition affecting any changes to this layer’s range property.
 
-#### Type
+### Type
 
 `{ duration, delay }`
 
-#### Units
+### Units
 `milliseconds`
 
-#### Default Value
+### Default Value
 `{duration: 300, delay: 0}`
 
 
 ___
 
-#### color
+### color
 Name: `color`
 
-#### Description
+### Description
 The color of the atmosphere region immediately below the horizon and within the `range` and above the horizon and within `horizonBlend`. Using opacity is recommended only for smoothly transitioning fog on/off as anything less than 100% opacity results in more tiles loaded and drawn.
 
-#### Type
+### Type
 `color`
-#### Default Value
+### Default Value
 `#ffffff`
 
 
-#### Expression
+### Expression
 
 Parameters: `zoom`
 ___
 
-#### Name
+### Name
 
 `colorTransition`
 
-#### Description
+### Description
 
-The transition affecting any changes to this layer’s color propery.
+The transition affecting any changes to this layer’s color property.
 
-#### Type
+### Type
 
 `{ duration, delay }`
 
-#### Units
+### Units
 `milliseconds`
 
-#### Default Value
+### Default Value
 `{duration: 300, delay: 0}`
 
 
 ___
 
-#### highColor
+### highColor
 Name: `highColor`
 
-#### Description
+### Description
 The color of the atmosphere region above the horizon, `highColor` extends further above the horizon than the `color` property and its spread can be controlled with `horizonBlend`. The opacity can be set to `0` to remove the high atmosphere color contribution.
 
-#### Type
+### Type
 `color`
-#### Default Value
+### Default Value
 `#245cdf`
 
 
-#### Expression
+### Expression
 
 Parameters: `zoom`
 ___
 
-#### Name
+### Name
 
 `highColorTransition`
 
-#### Description
+### Description
 
-The transition affecting any changes to this layer’s highColor propery.
+The transition affecting any changes to this layer’s highColor property.
 
-#### Type
+### Type
 
 `{ duration, delay }`
 
-#### Units
+### Units
 `milliseconds`
 
-#### Default Value
+### Default Value
 `{duration: 300, delay: 0}`
 
 
 ___
 
-#### spaceColor
+### spaceColor
 Name: `spaceColor`
 
-#### Description
+### Description
 The color of the region above the horizon and after the end of the `horizonBlend` contribution. The opacity can be set to `0` to have a transparent background.
 
-#### Type
+### Type
 `color`
-#### Default Value
+### Default Value
 `interpolate,linear,zoom,4,#010b19,7,#367ab9`
 
 
-#### Expression
+### Expression
 
 Parameters: `zoom`
 ___
 
-#### Name
+### Name
 
 `spaceColorTransition`
 
-#### Description
+### Description
 
-The transition affecting any changes to this layer’s spaceColor propery.
+The transition affecting any changes to this layer’s spaceColor property.
 
-#### Type
+### Type
 
 `{ duration, delay }`
 
-#### Units
+### Units
 `milliseconds`
 
-#### Default Value
+### Default Value
 `{duration: 300, delay: 0}`
 
 
 ___
 
-#### horizonBlend
+### horizonBlend
 Name: `horizonBlend`
 
-#### Description
+### Description
 Horizon blend applies a smooth fade from the color of the atmosphere to the color of space. A value of zero leaves a sharp transition from atmosphere to space. Increasing the value blends the color of atmosphere into increasingly high angles of the sky.
 
-#### Type
+### Type
 `number`
-#### Default Value
+### Default Value
 `interpolate,linear,zoom,4,0.2,7,0.1`
 
-#### Minimum
+### Minimum
 `0`
 
 
-#### Maximum
+### Maximum
 `1`
 
-#### Expression
+### Expression
 
 Parameters: `zoom`
 ___
 
-#### Name
+### Name
 
 `horizonBlendTransition`
 
-#### Description
+### Description
 
-The transition affecting any changes to this layer’s horizonBlend propery.
+The transition affecting any changes to this layer’s horizonBlend property.
 
-#### Type
+### Type
 
 `{ duration, delay }`
 
-#### Units
+### Units
 `milliseconds`
 
-#### Default Value
+### Default Value
 `{duration: 300, delay: 0}`
 
 
 ___
 
-#### starIntensity
+### starIntensity
 Name: `starIntensity`
 
-#### Description
+### Description
 A value controlling the star intensity where `0` will show no stars and `1` will show stars at their maximum intensity.
 
-#### Type
+### Type
 `number`
-#### Default Value
+### Default Value
 `interpolate,linear,zoom,5,0.35,6,0`
 
-#### Minimum
+### Minimum
 `0`
 
 
-#### Maximum
+### Maximum
 `1`
 
-#### Expression
+### Expression
 
 Parameters: `zoom`
 ___
 
-#### Name
+### Name
 
 `starIntensityTransition`
 
-#### Description
+### Description
 
-The transition affecting any changes to this layer’s starIntensity propery.
+The transition affecting any changes to this layer’s starIntensity property.
 
-#### Type
+### Type
 
 `{ duration, delay }`
 
-#### Units
+### Units
 `milliseconds`
 
-#### Default Value
+### Default Value
 `{duration: 300, delay: 0}`