@maplibre/maplibre-react-native 11.0.3 → 11.1.1

package/android/src/main/java/org/maplibre/reactnative/MLRNPackage.kt

@@ -20,6 +20,7 @@ import org.maplibre.reactnative.components.mapview.MLRNMapViewModule
 import org.maplibre.reactnative.components.sources.geojsonsource.MLRNGeoJSONSourceManager
 import org.maplibre.reactnative.components.sources.geojsonsource.MLRNGeoJSONSourceModule
 import org.maplibre.reactnative.components.sources.imagesource.MLRNImageSourceManager
+import org.maplibre.reactnative.components.sources.tilesources.rasterdemsource.MLRNRasterDEMSourceManager
 import org.maplibre.reactnative.components.sources.tilesources.rastersource.MLRNRasterSourceManager
 import org.maplibre.reactnative.components.sources.tilesources.vectorsource.MLRNVectorSourceManager
 import org.maplibre.reactnative.components.sources.tilesources.vectorsource.MLRNVectorSourceModule
@@ -196,6 +197,7 @@ class MLRNPackage : BaseReactPackage() {
         managers.add(MLRNImageSourceManager(reactContext))
         managers.add(MLRNGeoJSONSourceManager(reactContext))
         managers.add(MLRNRasterSourceManager(reactContext))
+        managers.add(MLRNRasterDEMSourceManager(reactContext))
         managers.add(MLRNVectorSourceManager(reactContext))
 
         // images

package/android/src/main/java/org/maplibre/reactnative/components/annotations/markerview/MLRNMarkerView.kt

@@ -8,7 +8,6 @@ import android.view.ViewGroup
 import android.widget.FrameLayout
 import com.facebook.react.bridge.ReactContext
 import com.facebook.react.uimanager.UIManagerHelper
-import com.facebook.react.uimanager.ViewGroupManager
 import org.maplibre.android.geometry.LatLng
 import org.maplibre.geojson.Point
 import org.maplibre.reactnative.components.AbstractMapFeature
@@ -32,7 +31,7 @@ class MLRNMarkerView(
     private var mAddedToMap = false
     private var mLastWidth = 0
     private var mLastHeight = 0
-    private var mLastZIndex: Int? = null
+    private var mLastZIndex: Float? = null
     private var markerId: String? = null
 
     private val surfaceId: Int
@@ -117,6 +116,7 @@ class MLRNMarkerView(
     }
 
     fun updateZIndex(zIndex: Float) {
+        mLastZIndex = zIndex
         mWrapperView?.translationZ = zIndex
     }
 
@@ -174,9 +174,8 @@ class MLRNMarkerView(
                     }
                 mWrapperView!!.setLayerType(LAYER_TYPE_HARDWARE, null)
 
-                mLastZIndex = ViewGroupManager.getViewZIndex(this@MLRNMarkerView)
-                if (mLastZIndex != null) {
-                    mWrapperView!!.translationZ = mLastZIndex!!.toFloat()
+                mLastZIndex?.let { zIndex ->
+                    mWrapperView!!.translationZ = zIndex
                 }
 
                 val scale = resources.displayMetrics.density
@@ -233,14 +232,6 @@ class MLRNMarkerView(
             return
         }
 
-        val currentZIndex = ViewGroupManager.getViewZIndex(this@MLRNMarkerView)
-        if (currentZIndex != mLastZIndex) {
-            mLastZIndex = currentZIndex
-            if (currentZIndex != null) {
-                mWrapperView?.translationZ = currentZIndex.toFloat()
-            }
-        }
-
         if (width == mLastWidth && height == mLastHeight) return
 
         mLastWidth = width

package/android/src/main/java/org/maplibre/reactnative/components/layer/MLRNLayer.kt

@@ -13,6 +13,7 @@ import org.maplibre.android.style.layers.CircleLayer
 import org.maplibre.android.style.layers.FillExtrusionLayer
 import org.maplibre.android.style.layers.FillLayer
 import org.maplibre.android.style.layers.HeatmapLayer
+import org.maplibre.android.style.layers.HillshadeLayer
 import org.maplibre.android.style.layers.Layer
 import org.maplibre.android.style.layers.LineLayer
 import org.maplibre.android.style.layers.Property
@@ -146,26 +147,24 @@ class MLRNLayer(
 
     private fun makeLayer(): Layer? =
         when (mLayerType) {
-            "fill" -> {
-                val layer = FillLayer(mID, mSourceID)
-                if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
-                layer
+            "background" -> {
+                BackgroundLayer(mID)
             }
 
-            "line" -> {
-                val layer = LineLayer(mID, mSourceID)
+            "circle" -> {
+                val layer = CircleLayer(mID, mSourceID)
                 if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
                 layer
             }
 
-            "symbol" -> {
-                val layer = SymbolLayer(mID, mSourceID)
+            "fill" -> {
+                val layer = FillLayer(mID, mSourceID)
                 if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
                 layer
             }
 
-            "circle" -> {
-                val layer = CircleLayer(mID, mSourceID)
+            "fill-extrusion" -> {
+                val layer = FillExtrusionLayer(mID, mSourceID)
                 if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
                 layer
             }
@@ -176,8 +175,14 @@ class MLRNLayer(
                 layer
             }
 
-            "fill-extrusion" -> {
-                val layer = FillExtrusionLayer(mID, mSourceID)
+            "hillshade" -> {
+                val layer = HillshadeLayer(mID, mSourceID)
+                if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
+                layer
+            }
+
+            "line" -> {
+                val layer = LineLayer(mID, mSourceID)
                 if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
                 layer
             }
@@ -186,8 +191,10 @@ class MLRNLayer(
                 RasterLayer(mID, mSourceID)
             }
 
-            "background" -> {
-                BackgroundLayer(mID)
+            "symbol" -> {
+                val layer = SymbolLayer(mID, mSourceID)
+                if (mSourceLayerID != null) layer.setSourceLayer(mSourceLayerID)
+                layer
             }
 
             else -> {
@@ -201,36 +208,38 @@ class MLRNLayer(
         val map = mMap ?: return
         val style = MLRNStyle(context, reactStyle, map)
         when (mLayer) {
-            is FillLayer -> MLRNStyleFactory.setFillLayerStyle(mLayer as FillLayer, style)
-            is LineLayer -> MLRNStyleFactory.setLineLayerStyle(mLayer as LineLayer, style)
-            is SymbolLayer -> MLRNStyleFactory.setSymbolLayerStyle(mLayer as SymbolLayer, style)
+            is BackgroundLayer -> MLRNStyleFactory.setBackgroundLayerStyle(mLayer as BackgroundLayer, style)
             is CircleLayer -> MLRNStyleFactory.setCircleLayerStyle(mLayer as CircleLayer, style)
-            is HeatmapLayer -> MLRNStyleFactory.setHeatmapLayerStyle(mLayer as HeatmapLayer, style)
+            is FillLayer -> MLRNStyleFactory.setFillLayerStyle(mLayer as FillLayer, style)
             is FillExtrusionLayer -> MLRNStyleFactory.setFillExtrusionLayerStyle(mLayer as FillExtrusionLayer, style)
+            is HeatmapLayer -> MLRNStyleFactory.setHeatmapLayerStyle(mLayer as HeatmapLayer, style)
+            is HillshadeLayer -> MLRNStyleFactory.setHillshadeLayerStyle(mLayer as HillshadeLayer, style)
+            is LineLayer -> MLRNStyleFactory.setLineLayerStyle(mLayer as LineLayer, style)
             is RasterLayer -> MLRNStyleFactory.setRasterLayerStyle(mLayer as RasterLayer, style)
-            is BackgroundLayer -> MLRNStyleFactory.setBackgroundLayerStyle(mLayer as BackgroundLayer, style)
+            is SymbolLayer -> MLRNStyleFactory.setSymbolLayerStyle(mLayer as SymbolLayer, style)
         }
     }
 
     private fun updateFilter(expression: Expression?) {
         when (mLayer) {
+            is CircleLayer -> (mLayer as CircleLayer).setFilter(expression!!)
             is FillLayer -> (mLayer as FillLayer).setFilter(expression!!)
+            is FillExtrusionLayer -> (mLayer as FillExtrusionLayer).setFilter(expression!!)
+            is HeatmapLayer -> (mLayer as HeatmapLayer).setFilter(expression!!)
             is LineLayer -> (mLayer as LineLayer).setFilter(expression!!)
             is SymbolLayer -> (mLayer as SymbolLayer).setFilter(expression!!)
-            is CircleLayer -> (mLayer as CircleLayer).setFilter(expression!!)
-            is HeatmapLayer -> (mLayer as HeatmapLayer).setFilter(expression!!)
-            is FillExtrusionLayer -> (mLayer as FillExtrusionLayer).setFilter(expression!!)
         }
     }
 
     private fun applySourceLayer() {
         when (mLayer) {
+            is CircleLayer -> (mLayer as CircleLayer).setSourceLayer(mSourceLayerID)
             is FillLayer -> (mLayer as FillLayer).setSourceLayer(mSourceLayerID)
+            is FillExtrusionLayer -> (mLayer as FillExtrusionLayer).setSourceLayer(mSourceLayerID)
+            is HeatmapLayer -> (mLayer as HeatmapLayer).setSourceLayer(mSourceLayerID)
+            is HillshadeLayer -> (mLayer as HillshadeLayer).setSourceLayer(mSourceLayerID)
             is LineLayer -> (mLayer as LineLayer).setSourceLayer(mSourceLayerID)
             is SymbolLayer -> (mLayer as SymbolLayer).setSourceLayer(mSourceLayerID)
-            is CircleLayer -> (mLayer as CircleLayer).setSourceLayer(mSourceLayerID)
-            is HeatmapLayer -> (mLayer as HeatmapLayer).setSourceLayer(mSourceLayerID)
-            is FillExtrusionLayer -> (mLayer as FillExtrusionLayer).setSourceLayer(mSourceLayerID)
         }
     }
 

package/android/src/main/java/org/maplibre/reactnative/components/sources/tilesources/rasterdemsource/MLRNRasterDEMSource.kt

@@ -0,0 +1,28 @@
+package org.maplibre.reactnative.components.sources.tilesources.rasterdemsource
+
+import android.content.Context
+import org.maplibre.android.style.sources.RasterDemSource
+import org.maplibre.reactnative.components.sources.tilesources.MLRNTileSource
+
+class MLRNRasterDEMSource(
+    context: Context?,
+) : MLRNTileSource<RasterDemSource?>(context) {
+    var tileSize: Int? = null
+    var encoding: String? = null
+
+    override fun makeSource(): RasterDemSource {
+        val configurationUrl = url
+        val resolvedTileSize = (if (tileSize != null) tileSize else RasterDemSource.DEFAULT_TILE_SIZE)!!
+        if (configurationUrl != null) {
+            return RasterDemSource(mID, configurationUrl, resolvedTileSize)
+        }
+
+        return RasterDemSource(mID, buildTileset(), resolvedTileSize)
+    }
+
+    override fun buildTileset(): org.maplibre.android.style.sources.TileSet {
+        val tileSet = super.buildTileset()
+        encoding?.let { tileSet.encoding = it }
+        return tileSet
+    }
+}

package/android/src/main/java/org/maplibre/reactnative/components/sources/tilesources/rasterdemsource/MLRNRasterDEMSourceManager.kt

@@ -0,0 +1,34 @@
+package org.maplibre.reactnative.components.sources.tilesources.rasterdemsource
+
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.annotations.ReactProp
+import org.maplibre.reactnative.components.sources.tilesources.MLRNTileSourceManager
+
+class MLRNRasterDEMSourceManager(
+    context: ReactApplicationContext,
+) : MLRNTileSourceManager<MLRNRasterDEMSource>(context) {
+    companion object {
+        const val REACT_CLASS: String = "MLRNRasterDEMSource"
+    }
+
+    override fun getName(): String = REACT_CLASS
+
+    override fun createViewInstance(themedReactContext: ThemedReactContext): MLRNRasterDEMSource = MLRNRasterDEMSource(themedReactContext)
+
+    @ReactProp(name = "tileSize")
+    fun setTileSize(
+        source: MLRNRasterDEMSource,
+        tileSize: Int,
+    ) {
+        source.tileSize = tileSize
+    }
+
+    @ReactProp(name = "encoding")
+    fun setEncoding(
+        source: MLRNRasterDEMSource,
+        encoding: String,
+    ) {
+        source.encoding = encoding
+    }
+}

package/ios/components/layer/MLRNLayer.h

@@ -4,6 +4,19 @@
 
 #import <MapLibre/MapLibre.h>
 
+typedef NS_ENUM(NSInteger, MLRNLayerType) {
+  MLRNLayerTypeBackground,
+  MLRNLayerTypeCircle,
+  MLRNLayerTypeColorRelief,
+  MLRNLayerTypeFill,
+  MLRNLayerTypeFillExtrusion,
+  MLRNLayerTypeHeatmap,
+  MLRNLayerTypeHillshade,
+  MLRNLayerTypeLine,
+  MLRNLayerTypeRaster,
+  MLRNLayerTypeSymbol,
+};
+
 @interface MLRNLayer : UIView
 
 @property (nonatomic, strong, nullable) MLNStyleLayer *styleLayer;
@@ -13,7 +26,7 @@
 @property (nonatomic, strong, nullable) NSArray *filter;
 
 @property (nonatomic, copy, nullable) NSString *id;
-@property (nonatomic, copy, nullable) NSString *layerType;
+@property (nonatomic, assign) MLRNLayerType layerType;
 @property (nonatomic, copy, nullable) NSString *sourceID;
 @property (nonatomic, copy, nullable) NSString *sourceLayerID;
 

package/ios/components/layer/MLRNLayer.m

@@ -166,13 +166,10 @@
 // MARK: - Layer factory (type-based dispatch)
 
 - (nullable MLNStyleLayer *)makeLayer:(MLNStyle *)style {
-  NSString *type = _layerType;
-
-  if ([type isEqualToString:@"background"]) {
+  if (_layerType == MLRNLayerTypeBackground) {
     return [[MLNBackgroundStyleLayer alloc] initWithIdentifier:_id];
   }
 
-  // All other layer types need a source
   MLNSource *source = [self layerWithSourceIDInStyle:style];
   if (source == nil) {
     return nil;
@@ -180,23 +177,37 @@
 
   MLNStyleLayer *layer = nil;
 
-  if ([type isEqualToString:@"fill"]) {
-    layer = [[MLNFillStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else if ([type isEqualToString:@"line"]) {
-    layer = [[MLNLineStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else if ([type isEqualToString:@"symbol"]) {
-    layer = [[MLNSymbolStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else if ([type isEqualToString:@"circle"]) {
-    layer = [[MLNCircleStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else if ([type isEqualToString:@"heatmap"]) {
-    layer = [[MLNHeatmapStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else if ([type isEqualToString:@"fill-extrusion"]) {
-    layer = [[MLNFillExtrusionStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else if ([type isEqualToString:@"raster"]) {
-    layer = [[MLNRasterStyleLayer alloc] initWithIdentifier:_id source:source];
-  } else {
-    RCTLogError(@"Unknown layer type: %@", type);
-    return nil;
+  switch (_layerType) {
+    case MLRNLayerTypeCircle:
+      layer = [[MLNCircleStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeColorRelief:
+      RCTLogError(@"ColorRelief layer type is not supported on iOS");
+      return nil;
+    case MLRNLayerTypeFill:
+      layer = [[MLNFillStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeFillExtrusion:
+      layer = [[MLNFillExtrusionStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeHeatmap:
+      layer = [[MLNHeatmapStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeHillshade:
+      layer = [[MLNHillshadeStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeLine:
+      layer = [[MLNLineStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeRaster:
+      layer = [[MLNRasterStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    case MLRNLayerTypeSymbol:
+      layer = [[MLNSymbolStyleLayer alloc] initWithIdentifier:_id source:source];
+      break;
+    default:
+      RCTLogError(@"Unknown layer type: %ld", (long)_layerType);
+      return nil;
   }
 
   // Set sourceLayerIdentifier for vector layers
@@ -216,34 +227,38 @@
     return [self isAddedToMap];
   };
 
-  if ([_styleLayer isKindOfClass:[MLNFillStyleLayer class]]) {
-    [style fillLayer:(MLNFillStyleLayer *)_styleLayer withReactStyle:_reactStyle isValid:isValid];
-  } else if ([_styleLayer isKindOfClass:[MLNLineStyleLayer class]]) {
-    [style lineLayer:(MLNLineStyleLayer *)_styleLayer withReactStyle:_reactStyle isValid:isValid];
-  } else if ([_styleLayer isKindOfClass:[MLNSymbolStyleLayer class]]) {
-    [style symbolLayer:(MLNSymbolStyleLayer *)_styleLayer
-        withReactStyle:_reactStyle
-               isValid:isValid];
+  if ([_styleLayer isKindOfClass:[MLNBackgroundStyleLayer class]]) {
+    [style backgroundLayer:(MLNBackgroundStyleLayer *)_styleLayer
+            withReactStyle:_reactStyle
+                   isValid:isValid];
   } else if ([_styleLayer isKindOfClass:[MLNCircleStyleLayer class]]) {
     [style circleLayer:(MLNCircleStyleLayer *)_styleLayer
         withReactStyle:_reactStyle
                isValid:isValid];
-  } else if ([_styleLayer isKindOfClass:[MLNHeatmapStyleLayer class]]) {
-    [style heatmapLayer:(MLNHeatmapStyleLayer *)_styleLayer
-         withReactStyle:_reactStyle
-                isValid:isValid];
+  } else if ([_styleLayer isKindOfClass:[MLNFillStyleLayer class]]) {
+    [style fillLayer:(MLNFillStyleLayer *)_styleLayer withReactStyle:_reactStyle isValid:isValid];
   } else if ([_styleLayer isKindOfClass:[MLNFillExtrusionStyleLayer class]]) {
     [style fillExtrusionLayer:(MLNFillExtrusionStyleLayer *)_styleLayer
                withReactStyle:_reactStyle
                       isValid:isValid];
+  } else if ([_styleLayer isKindOfClass:[MLNHeatmapStyleLayer class]]) {
+    [style heatmapLayer:(MLNHeatmapStyleLayer *)_styleLayer
+         withReactStyle:_reactStyle
+                isValid:isValid];
+  } else if ([_styleLayer isKindOfClass:[MLNHillshadeStyleLayer class]]) {
+    [style hillshadeLayer:(MLNHillshadeStyleLayer *)_styleLayer
+           withReactStyle:_reactStyle
+                  isValid:isValid];
+  } else if ([_styleLayer isKindOfClass:[MLNLineStyleLayer class]]) {
+    [style lineLayer:(MLNLineStyleLayer *)_styleLayer withReactStyle:_reactStyle isValid:isValid];
   } else if ([_styleLayer isKindOfClass:[MLNRasterStyleLayer class]]) {
     [style rasterLayer:(MLNRasterStyleLayer *)_styleLayer
         withReactStyle:_reactStyle
                isValid:isValid];
-  } else if ([_styleLayer isKindOfClass:[MLNBackgroundStyleLayer class]]) {
-    [style backgroundLayer:(MLNBackgroundStyleLayer *)_styleLayer
-            withReactStyle:_reactStyle
-                   isValid:isValid];
+  } else if ([_styleLayer isKindOfClass:[MLNSymbolStyleLayer class]]) {
+    [style symbolLayer:(MLNSymbolStyleLayer *)_styleLayer
+        withReactStyle:_reactStyle
+               isValid:isValid];
   }
 }
 

package/ios/components/layer/MLRNLayerComponentView.mm

@@ -14,6 +14,31 @@
 
 using namespace facebook::react;
 
+static MLRNLayerType MLRNLayerTypeFromCppEnum(MLRNLayerLayerType layerType) {
+  switch (layerType) {
+    case MLRNLayerLayerType::Background:
+      return MLRNLayerTypeBackground;
+    case MLRNLayerLayerType::Circle:
+      return MLRNLayerTypeCircle;
+    case MLRNLayerLayerType::ColorRelief:
+      return MLRNLayerTypeColorRelief;
+    case MLRNLayerLayerType::Fill:
+      return MLRNLayerTypeFill;
+    case MLRNLayerLayerType::FillExtrusion:
+      return MLRNLayerTypeFillExtrusion;
+    case MLRNLayerLayerType::Heatmap:
+      return MLRNLayerTypeHeatmap;
+    case MLRNLayerLayerType::Hillshade:
+      return MLRNLayerTypeHillshade;
+    case MLRNLayerLayerType::Line:
+      return MLRNLayerTypeLine;
+    case MLRNLayerLayerType::Raster:
+      return MLRNLayerTypeRaster;
+    case MLRNLayerLayerType::Symbol:
+      return MLRNLayerTypeSymbol;
+  }
+}
+
 // MARK: - MLRNLayerComponentView
 
 @interface MLRNLayerComponentView () <RCTMLRNLayerViewProtocol>
@@ -64,7 +89,7 @@ using namespace facebook::react;
   }
 
   if (oldViewProps.layerType != newViewProps.layerType) {
-    _view.layerType = RCTNSStringFromString(newViewProps.layerType);
+    _view.layerType = MLRNLayerTypeFromCppEnum(newViewProps.layerType);
   }
 
   if (oldViewProps.source != newViewProps.source) {

package/ios/components/sources/tile-sources/raster-dem-source/MLRNRasterDEMSource.h

@@ -0,0 +1,10 @@
+#import "MLRNTileSource.h"
+
+#import <MapLibre/MapLibre.h>
+
+@interface MLRNRasterDEMSource : MLRNTileSource
+
+@property (nonatomic, strong) NSNumber *tileSize;
+@property (nonatomic, copy) NSString *encoding;
+
+@end

package/ios/components/sources/tile-sources/raster-dem-source/MLRNRasterDEMSource.m

@@ -0,0 +1,39 @@
+#import "MLRNRasterDEMSource.h"
+
+@implementation MLRNRasterDEMSource
+
+- (nullable MLNSource *)makeSource {
+  if (self.url != nil) {
+    NSURL *url = [NSURL URLWithString:self.url];
+    if (self.tileSize != nil) {
+      return [[MLNRasterDEMSource alloc] initWithIdentifier:self.id
+                                           configurationURL:url
+                                                   tileSize:[self.tileSize floatValue]];
+    }
+    return [[MLNRasterDEMSource alloc] initWithIdentifier:self.id configurationURL:url];
+  }
+  return [[MLNRasterDEMSource alloc] initWithIdentifier:self.id
+                                       tileURLTemplates:self.tileUrlTemplates
+                                                options:[self getOptions]];
+}
+
+- (NSDictionary<MLNTileSourceOption, id> *)getOptions {
+  NSMutableDictionary<MLNTileSourceOption, id> *options =
+      [[NSMutableDictionary alloc] initWithDictionary:[super getOptions]];
+
+  if (self.tileSize != nil) {
+    options[MLNTileSourceOptionTileSize] = _tileSize;
+  }
+
+  if (self.encoding != nil) {
+    MLNDEMEncoding demEncoding = MLNDEMEncodingMapbox;
+    if ([self.encoding isEqualToString:@"terrarium"]) {
+      demEncoding = MLNDEMEncodingTerrarium;
+    }
+    options[MLNTileSourceOptionDEMEncoding] = @(demEncoding);
+  }
+
+  return options;
+}
+
+@end

package/ios/components/sources/tile-sources/raster-dem-source/MLRNRasterDEMSourceComponentView.h

@@ -0,0 +1,9 @@
+#import <React/RCTViewComponentView.h>
+
+@class MLRNRasterDEMSource;
+
+@interface MLRNRasterDEMSourceComponentView : RCTViewComponentView
+
+@property (nonatomic, readonly) MLRNRasterDEMSource *rasterDEMSource;
+
+@end

package/ios/components/sources/tile-sources/raster-dem-source/MLRNRasterDEMSourceComponentView.mm

@@ -0,0 +1,131 @@
+#import "MLRNRasterDEMSourceComponentView.h"
+
+#import <react/renderer/components/MapLibreReactNativeSpec/ComponentDescriptors.h>
+#import <react/renderer/components/MapLibreReactNativeSpec/EventEmitters.h>
+#import <react/renderer/components/MapLibreReactNativeSpec/Props.h>
+#import <react/renderer/components/MapLibreReactNativeSpec/RCTComponentViewHelpers.h>
+
+#import "RCTFabricComponentsPlugins.h"
+
+#import <MapLibre/MapLibre.h>
+#import <React/RCTConversions.h>
+#import "MLRNRasterDEMSource.h"
+
+using namespace facebook::react;
+
+// MARK: - MLRNRasterDEMSourceComponentView
+
+@interface MLRNRasterDEMSourceComponentView () <RCTMLRNRasterDEMSourceViewProtocol>
+
+@end
+
+@implementation MLRNRasterDEMSourceComponentView {
+  MLRNRasterDEMSource *_view;
+}
+
+- (instancetype)initWithFrame:(CGRect)frame {
+  if (self = [super initWithFrame:frame]) {
+    static const auto defaultProps = std::make_shared<const MLRNRasterDEMSourceProps>();
+    _props = defaultProps;
+    [self prepareView];
+  }
+
+  return self;
+}
+
+- (void)prepareView {
+  _view = [[MLRNRasterDEMSource alloc] init];
+  self.contentView = _view;
+}
+
+- (MLRNRasterDEMSource *)rasterDEMSource {
+  return _view;
+}
+
+#pragma mark - RCTComponentViewProtocol
+
++ (ComponentDescriptorProvider)componentDescriptorProvider {
+  return concreteComponentDescriptorProvider<MLRNRasterDEMSourceComponentDescriptor>();
+}
+
+- (void)updateProps:(const Props::Shared &)props oldProps:(const Props::Shared &)oldProps {
+  const auto &oldViewProps = *std::static_pointer_cast<const MLRNRasterDEMSourceProps>(_props);
+  const auto &newViewProps = *std::static_pointer_cast<const MLRNRasterDEMSourceProps>(props);
+
+  if (oldViewProps.id != newViewProps.id) {
+    _view.id = RCTNSStringFromString(newViewProps.id);
+  }
+
+  if (oldViewProps.url != newViewProps.url) {
+    _view.url = RCTNSStringFromStringNilIfEmpty(newViewProps.url);
+  }
+
+  if (oldViewProps.tiles != newViewProps.tiles) {
+    if (newViewProps.tiles.size() > 0) {
+      NSMutableArray *tiles = [NSMutableArray arrayWithCapacity:newViewProps.tiles.size()];
+      for (const auto &tile : newViewProps.tiles) {
+        [tiles addObject:RCTNSStringFromString(tile)];
+      }
+      _view.tileUrlTemplates = tiles;
+    } else {
+      _view.tileUrlTemplates = nil;
+    }
+  }
+
+  if (oldViewProps.minzoom != newViewProps.minzoom) {
+    _view.minZoomLevel = newViewProps.minzoom >= 0 ? @(newViewProps.minzoom) : nil;
+  }
+
+  if (oldViewProps.maxzoom != newViewProps.maxzoom) {
+    _view.maxZoomLevel = newViewProps.maxzoom >= 0 ? @(newViewProps.maxzoom) : nil;
+  }
+
+  if (oldViewProps.attribution != newViewProps.attribution) {
+    _view.attribution = RCTNSStringFromStringNilIfEmpty(newViewProps.attribution);
+  }
+
+  if (oldViewProps.tileSize != newViewProps.tileSize) {
+    _view.tileSize = newViewProps.tileSize >= 0 ? @(newViewProps.tileSize) : nil;
+  }
+
+  if (oldViewProps.encoding != newViewProps.encoding) {
+    switch (newViewProps.encoding) {
+      case MLRNRasterDEMSourceEncoding::Terrarium:
+        _view.encoding = @"terrarium";
+        break;
+      case MLRNRasterDEMSourceEncoding::Mapbox:
+      default:
+        _view.encoding = @"mapbox";
+        break;
+    }
+  }
+
+  [super updateProps:props oldProps:oldProps];
+}
+
+- (void)mountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView
+                          index:(NSInteger)index {
+  if ([childComponentView isKindOfClass:[RCTViewComponentView class]] &&
+      ((RCTViewComponentView *)childComponentView).contentView) {
+    [_view insertReactSubview:(id<RCTComponent>)((RCTViewComponentView *)childComponentView)
+                                  .contentView
+                      atIndex:index];
+  }
+  [super mountChildComponentView:childComponentView index:index];
+}
+
+- (void)unmountChildComponentView:(UIView<RCTComponentViewProtocol> *)childComponentView
+                            index:(NSInteger)index {
+  if ([childComponentView isKindOfClass:[RCTViewComponentView class]] &&
+      ((RCTViewComponentView *)childComponentView).contentView) {
+    [_view removeReactSubview:(id<RCTComponent>)((RCTViewComponentView *)childComponentView)
+                                  .contentView];
+  }
+  [super unmountChildComponentView:childComponentView index:index];
+}
+
+Class<RCTComponentViewProtocol> MLRNRasterDEMSourceCls(void) {
+  return MLRNRasterDEMSourceComponentView.class;
+}
+
+@end

package/lib/commonjs/components/layer/LayerNativeComponent.ts

@@ -10,7 +10,19 @@ import type { StyleValue } from "../../utils/StyleValue";
 
 export interface NativeProps extends ViewProps {
   id: string;
-  layerType: string;
+  layerType?: CodegenTypes.WithDefault<
+    | "background"
+    | "circle"
+    | "color-relief"
+    | "fill"
+    | "fill-extrusion"
+    | "heatmap"
+    | "hillshade"
+    | "line"
+    | "raster"
+    | "symbol",
+    "background"
+  >;
 
   source?: string;
   sourceLayer?: string;