@ezoic/react-native-sdk 1.2.0 → 1.3.0

package/EzoicReactNativeSdk.podspec

@@ -20,6 +20,9 @@ Pod::Spec.new do |s|
 
   # Native Ezoic Ads SDK (vends the `EzoicAdsSDKBinary` module). Brings in
   # PrebidMobile + Google-Mobile-Ads-SDK transitively.
-  s.dependency "EzoicAdsSDK", "~> 1.2"
+  s.dependency "EzoicAdsSDK", "~> 1.3"
+  # The native-ad host imports GoogleMobileAds directly (NativeAdView,
+  # MediaView, NativeAd). Pin GMA 12 so the module is on the compile path.
+  s.dependency "Google-Mobile-Ads-SDK", "~> 12.0"
   s.swift_version = "5.9"
 end

package/README.md

@@ -1,11 +1,12 @@
 # @ezoic/react-native-sdk
 
-Ezoic Ads SDK for React Native (Prebid + Google Ad Manager banner ads).
+Ezoic Ads SDK for React Native (Prebid + Google Ad Manager banner, native, interstitial and rewarded ads).
 
 A thin React Native (New Architecture) wrapper over the native Ezoic Ads SDKs
 for iOS (`EzoicAdsSDK`, via CocoaPods) and Android
 (`com.ezoic.sdk:ezoic-ads-sdk`, via Maven Central). It exposes an imperative
-`EzoicAds` TurboModule and an `EzoicBannerView` Fabric component.
+`EzoicAds` TurboModule plus `EzoicBannerView` and `EzoicNativeAdView` Fabric
+components.
 
 ## Requirements
 
@@ -68,6 +69,28 @@ const tracked = await EzoicAds.trackPageview();
 `adUnitIdentifier` is a string coerced to a native integer. `size` is a `"WxH"`
 string or comma-separated list (e.g. `"300x250"`, `"300x250,320x50"`).
 
+### Native ads
+
+`EzoicNativeAdView` loads a native ad and renders it in an SDK-built template
+`NativeAdView` (headline, icon, media, body and a call-to-action). Unlike the
+banner it has no `size` prop — size it with `style` and the template lays its
+assets out inside those bounds.
+
+```tsx
+import { EzoicAds, EzoicNativeAdView } from '@ezoic/react-native-sdk';
+
+<EzoicNativeAdView
+  adUnitIdentifier="123456"
+  style={{ width: '100%', height: 300 }}
+  onLoad={() => console.log('loaded')}
+  onError={(e) => console.log('error', e.message, e.code)}
+  onImpression={() => console.log('impression')}
+  onClick={() => console.log('click')}
+  onOpen={() => console.log('open')}
+  onClose={() => console.log('close')}
+/>;
+```
+
 ## API
 
 - `EzoicAds.initialize(config)` → `Promise<void>`
@@ -76,6 +99,7 @@ string or comma-separated list (e.g. `"300x250"`, `"300x250,320x50"`).
 - `EzoicAds.setSubjectToCOPPA(value)` → `void`
 - `EzoicAds.trackPageview()` → `Promise<boolean>`
 - `<EzoicBannerView adUnitIdentifier size onLoad onError onImpression onClick onOpen onClose />`
+- `<EzoicNativeAdView adUnitIdentifier onLoad onError onImpression onClick onOpen onClose />`
 
 ## License
 

package/android/build.gradle

@@ -68,5 +68,11 @@ dependencies {
   // Native Ezoic Ads SDK (resolved from Maven Central). Brings in Google Mobile
   // Ads + Prebid transitively. Requires mavenCentral() + google() in the
   // consuming app's repositories (the RN template provides both).
-  implementation "com.ezoic.sdk:ezoic-ads-sdk:1.2.0"
+  implementation "com.ezoic.sdk:ezoic-ads-sdk:1.3.0"
+
+  // The native-ad wrapper references GMA's NativeAdView/MediaView/NativeAd
+  // types at compile time. The Ezoic SDK POM scopes Google Mobile Ads at
+  // runtime only, so pin the compile-time classpath here (runtime resolution
+  // still comes transitively from the Ezoic SDK).
+  compileOnly "com.google.android.gms:play-services-ads:22.6.0"
 }

package/android/src/main/java/com/ezoic/reactnative/EzoicNativeAdViewManager.kt

@@ -0,0 +1,314 @@
+package com.ezoic.reactnative
+
+import android.content.Context
+import android.graphics.Typeface
+import android.view.View
+import android.view.ViewGroup
+import android.widget.Button
+import android.widget.FrameLayout
+import android.widget.ImageView
+import android.widget.LinearLayout
+import android.widget.TextView
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.ReactApplicationContext
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.SimpleViewManager
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.uimanager.events.RCTEventEmitter
+import com.ezoic.ads.sdk.adunits.EzoicNativeAd
+import com.ezoic.ads.sdk.adunits.EzoicNativeAdListener
+import com.ezoic.ads.sdk.adunits.EzoicNativeAdLoadListener
+import com.ezoic.ads.sdk.core.EzoicError
+import com.google.android.gms.ads.nativead.MediaView
+import com.google.android.gms.ads.nativead.NativeAd
+import com.google.android.gms.ads.nativead.NativeAdView
+
+@ReactModule(name = EzoicNativeAdViewManager.NAME)
+class EzoicNativeAdViewManager(private val ctx: ReactApplicationContext) :
+  SimpleViewManager<EzoicNativeAdViewManager.NativeAdContainer>() {
+
+  override fun getName() = NAME
+
+  override fun createViewInstance(reactContext: ThemedReactContext): NativeAdContainer {
+    val container = NativeAdContainer(reactContext)
+    container.layoutParams = ViewGroup.LayoutParams(
+      ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT
+    )
+    return container
+  }
+
+  @ReactProp(name = "adUnitIdentifier")
+  fun setAdUnitIdentifier(view: NativeAdContainer, value: String?) {
+    val newAdUnitId = value?.toIntOrNull() ?: 0
+    // Ad unit changed after a load already started: tear down the loaded/loading
+    // ad and clear the started flag so onAfterUpdateTransaction's maybeLoad
+    // starts a fresh load for the new id.
+    if (newAdUnitId != view.adUnitId && view.loadStarted) {
+      view.ezoicNativeAd?.destroy()
+      view.ezoicNativeAd = null
+      view.removeAllViews()
+      view.loadStarted = false
+      view.loadGeneration++
+    }
+    view.adUnitId = newAdUnitId
+    view.rawAdUnitId = value ?: ""
+  }
+
+  // Fabric sets every prop for the mount transaction before this runs, so the
+  // ad unit id is final here. `view.post` escapes the mount transaction so the
+  // synchronous native-SDK failure path (uninitialized) can't reenter the
+  // mounting layer; the started flag survives repeated transactions.
+  override fun onAfterUpdateTransaction(view: NativeAdContainer) {
+    super.onAfterUpdateTransaction(view)
+    view.post { maybeLoad(view) }
+  }
+
+  private fun maybeLoad(view: NativeAdContainer) {
+    if (view.loadStarted || view.disposed) return
+    if (view.adUnitId <= 0) {
+      // Non-numeric or missing id coerces to 0 in setAdUnitIdentifier. Only
+      // emit an error when a prop was actually supplied (non-empty raw
+      // string); an unset prop should stay silent.
+      if (view.rawAdUnitId.isNotEmpty()) {
+        view.loadStarted = true
+        emit(view, "topError", errorMap("Invalid ad unit identifier", 0))
+      }
+      return
+    }
+    view.loadStarted = true
+    val generation = view.loadGeneration
+    EzoicNativeAd.load(view.context, view.adUnitId, object : EzoicNativeAdLoadListener {
+      override fun onNativeAdLoaded(nativeAd: EzoicNativeAd) {
+        // dispose() and this callback both arrive on the main thread, so the
+        // check is race-free. A late-arriving ad is destroyed, not rendered.
+        // A generation mismatch means the ad unit changed mid-load (mirrors
+        // the SDK's isCurrentLoad token pattern): destroy and emit nothing.
+        if (view.disposed || view.loadGeneration != generation) {
+          nativeAd.destroy()
+          return
+        }
+        val gmaAd = nativeAd.nativeAd ?: run {
+          // Empty-content ad: destroy it instead of keeping an unrenderable,
+          // errored ad alive on the view.
+          nativeAd.destroy()
+          emit(view, "topError", errorMap("Native ad loaded without content", 0))
+          return
+        }
+        view.ezoicNativeAd = nativeAd
+        // Attach the lifecycle listener before the rendered NativeAdView
+        // registers — the impression fires as soon as the view is displayed.
+        nativeAd.listener = object : EzoicNativeAdListener {
+          override fun onNativeAdImpression(nativeAd: EzoicNativeAd) =
+            emit(view, "topImpression", Arguments.createMap())
+          override fun onNativeAdClicked(nativeAd: EzoicNativeAd) =
+            emit(view, "topAdClick", Arguments.createMap())
+          override fun onNativeAdOpened(nativeAd: EzoicNativeAd) =
+            emit(view, "topOpen", Arguments.createMap())
+          override fun onNativeAdClosed(nativeAd: EzoicNativeAd) =
+            emit(view, "topClose", Arguments.createMap())
+        }
+        val adView = buildTemplate(view.context, gmaAd)
+        view.removeAllViews()
+        view.addView(adView)
+        emit(view, "topLoad", Arguments.createMap())
+      }
+
+      override fun onNativeAdFailedToLoad(error: EzoicError) {
+        if (view.disposed || view.loadGeneration != generation) return
+        emit(view, "topError", errorMap(error.message, error.code))
+      }
+    })
+  }
+
+  /**
+   * Builds a template [NativeAdView] entirely in code (the module ships no
+   * `res/` layouts). Layout: a vertical column of a header row (icon +
+   * headline/advertiser), a [MediaView], the body text and a call-to-action
+   * button. Only the asset views actually present on [gmaAd] are created and
+   * registered; [NativeAdView.setNativeAd] is called last, as GMA requires.
+   */
+  private fun buildTemplate(context: Context, gmaAd: NativeAd): NativeAdView {
+    val adView = NativeAdView(context)
+
+    val root = LinearLayout(context).apply {
+      orientation = LinearLayout.VERTICAL
+      layoutParams = FrameLayout.LayoutParams(
+        FrameLayout.LayoutParams.MATCH_PARENT,
+        FrameLayout.LayoutParams.WRAP_CONTENT,
+      )
+      val pad = dp(context, 8)
+      setPadding(pad, pad, pad, pad)
+    }
+
+    val headerRow = LinearLayout(context).apply {
+      orientation = LinearLayout.HORIZONTAL
+      layoutParams = LinearLayout.LayoutParams(
+        LinearLayout.LayoutParams.MATCH_PARENT,
+        LinearLayout.LayoutParams.WRAP_CONTENT,
+      )
+    }
+
+    var iconView: ImageView? = null
+    gmaAd.icon?.drawable?.let { drawable ->
+      val iv = ImageView(context).apply {
+        layoutParams = LinearLayout.LayoutParams(dp(context, 40), dp(context, 40))
+        setImageDrawable(drawable)
+      }
+      headerRow.addView(iv)
+      iconView = iv
+    }
+
+    val textColumn = LinearLayout(context).apply {
+      orientation = LinearLayout.VERTICAL
+      layoutParams = LinearLayout.LayoutParams(
+        0,
+        LinearLayout.LayoutParams.WRAP_CONTENT,
+        1f,
+      ).apply { leftMargin = dp(context, 8) }
+    }
+
+    var headlineView: TextView? = null
+    gmaAd.headline?.let { text ->
+      val tv = TextView(context).apply {
+        this.text = text
+        setTypeface(typeface, Typeface.BOLD)
+        textSize = 16f
+      }
+      textColumn.addView(tv)
+      headlineView = tv
+    }
+
+    var advertiserView: TextView? = null
+    gmaAd.advertiser?.let { text ->
+      val tv = TextView(context).apply {
+        this.text = text
+        textSize = 12f
+      }
+      textColumn.addView(tv)
+      advertiserView = tv
+    }
+
+    headerRow.addView(textColumn)
+    root.addView(headerRow)
+
+    var mediaView: MediaView? = null
+    gmaAd.mediaContent?.let { content ->
+      val mv = MediaView(context).apply {
+        layoutParams = LinearLayout.LayoutParams(
+          LinearLayout.LayoutParams.MATCH_PARENT,
+          dp(context, 175),
+        ).apply { topMargin = dp(context, 8) }
+        mediaContent = content
+      }
+      root.addView(mv)
+      mediaView = mv
+    }
+
+    var bodyView: TextView? = null
+    gmaAd.body?.let { text ->
+      val tv = TextView(context).apply {
+        this.text = text
+        textSize = 14f
+        setPadding(0, dp(context, 8), 0, 0)
+      }
+      root.addView(tv)
+      bodyView = tv
+    }
+
+    var callToActionView: Button? = null
+    gmaAd.callToAction?.let { text ->
+      val btn = Button(context).apply {
+        this.text = text
+        layoutParams = LinearLayout.LayoutParams(
+          LinearLayout.LayoutParams.MATCH_PARENT,
+          LinearLayout.LayoutParams.WRAP_CONTENT,
+        ).apply { topMargin = dp(context, 8) }
+      }
+      root.addView(btn)
+      callToActionView = btn
+    }
+
+    adView.addView(root)
+    // Register only the asset views that were populated; a null assignment
+    // leaves that asset unregistered.
+    adView.headlineView = headlineView
+    adView.bodyView = bodyView
+    adView.iconView = iconView
+    adView.advertiserView = advertiserView
+    adView.callToActionView = callToActionView
+    adView.mediaView = mediaView
+    adView.setNativeAd(gmaAd)
+    return adView
+  }
+
+  override fun onDropViewInstance(view: NativeAdContainer) {
+    super.onDropViewInstance(view)
+    view.disposed = true
+    view.loadGeneration++
+    view.ezoicNativeAd?.destroy()
+    view.ezoicNativeAd = null
+    view.removeAllViews()
+  }
+
+  private fun emit(view: NativeAdContainer, event: String, payload: WritableMap) {
+    if (view.disposed) return
+    ctx.getJSModule(RCTEventEmitter::class.java).receiveEvent(view.id, event, payload)
+  }
+
+  private fun errorMap(message: String?, code: Int): WritableMap {
+    val map = Arguments.createMap()
+    map.putString("message", message ?: "")
+    map.putInt("code", code)
+    return map
+  }
+
+  private fun dp(context: Context, value: Int): Int =
+    (value * context.resources.displayMetrics.density).toInt()
+
+  override fun getExportedCustomBubblingEventTypeConstants(): Map<String, Any> {
+    fun reg(on: String) = mapOf("phasedRegistrationNames" to mapOf("bubbled" to on))
+    return mapOf(
+      "topLoad" to reg("onLoad"),
+      "topError" to reg("onError"),
+      "topImpression" to reg("onImpression"),
+      "topAdClick" to reg("onAdClick"),
+      "topOpen" to reg("onOpen"),
+      "topClose" to reg("onClose")
+    )
+  }
+
+  /**
+   * Container for the template ad view. RN lays out only Yoga-managed views;
+   * the template [NativeAdView] is added from native code and stays unmeasured
+   * (blank) unless we force a measure/layout pass. Overriding [requestLayout]
+   * to post a manual measure(EXACTLY)+layout of the current bounds is the
+   * proven fix (react-native-google-mobile-ads uses the same approach).
+   */
+  class NativeAdContainer(context: Context) : FrameLayout(context) {
+    var adUnitId: Int = 0
+    var rawAdUnitId: String = ""
+    var loadStarted: Boolean = false
+    var disposed: Boolean = false
+    var loadGeneration: Int = 0
+    var ezoicNativeAd: EzoicNativeAd? = null
+
+    private val measureAndLayout = Runnable {
+      measure(
+        View.MeasureSpec.makeMeasureSpec(width, View.MeasureSpec.EXACTLY),
+        View.MeasureSpec.makeMeasureSpec(height, View.MeasureSpec.EXACTLY)
+      )
+      layout(left, top, right, bottom)
+    }
+
+    override fun requestLayout() {
+      super.requestLayout()
+      post(measureAndLayout)
+    }
+  }
+
+  companion object {
+    const val NAME = "EzoicNativeAdView"
+  }
+}

package/android/src/main/java/com/ezoic/reactnative/EzoicReactNativeSdkPackage.kt

@@ -19,7 +19,10 @@ class EzoicReactNativeSdkPackage : BaseReactPackage() {
   override fun createViewManagers(
     reactContext: ReactApplicationContext
   ): List<ViewManager<*, *>> {
-    return listOf(EzoicBannerViewManager(reactContext))
+    return listOf(
+      EzoicBannerViewManager(reactContext),
+      EzoicNativeAdViewManager(reactContext)
+    )
   }
 
   override fun getReactModuleInfoProvider() = ReactModuleInfoProvider {

package/ios/EzoicNativeAdHostView.swift

@@ -0,0 +1,181 @@
+import UIKit
+import EzoicAdsSDKBinary
+import GoogleMobileAds
+
+@objc public protocol EzoicNativeAdHostViewDelegate: AnyObject {
+  func nativeAdDidLoad()
+  func nativeAdDidFail(_ message: String, code: Int)
+  func nativeAdDidRecordImpression()
+  func nativeAdDidRecordClick()
+  func nativeAdWillPresentScreen()
+  func nativeAdDidDismissScreen()
+}
+
+@objc public class EzoicNativeAdHostView: UIView, EzoicNativeAdDelegate {
+
+  @objc public weak var hostDelegate: EzoicNativeAdHostViewDelegate?
+
+  private var adUnitId: Int = 0
+  private var ezoicNativeAd: EzoicNativeAd?
+  private var adView: NativeAdView?
+  private var loadStarted = false
+
+  /// Stores the ad unit id. The load is NOT started here — the Fabric
+  /// component view calls `startLoad()` from `finalizeUpdates`, after the
+  /// event emitter is attached, so a synchronous SDK failure (uninitialized)
+  /// can deliver `onError` instead of being dropped.
+  @objc public func configure(adUnitIdentifier: String) {
+    self.adUnitId = Int(adUnitIdentifier) ?? 0
+  }
+
+  /// Starts the native-ad load once. A second call is a no-op; the guard
+  /// survives repeated `finalizeUpdates` calls.
+  @objc public func startLoad() {
+    if loadStarted { return }
+    loadStarted = true
+    EzoicNativeAd.load(adUnitIdentifier: adUnitId) { [weak self] result in
+      guard let self = self else { return }
+      switch result {
+      case .success(let ad):
+        guard let gmaAd = ad.nativeAd else {
+          // Empty-content ad: destroy it and do not retain it instead of
+          // keeping an unrenderable, errored ad alive.
+          ad.destroy()
+          self.hostDelegate?.nativeAdDidFail("Native ad loaded without content", code: 0)
+          return
+        }
+        self.ezoicNativeAd = ad
+        // Attach the delegate before rendering so the impression, which fires
+        // as soon as the NativeAdView is displayed, is delivered.
+        ad.delegate = self
+        self.render(gmaAd)
+        self.hostDelegate?.nativeAdDidLoad()
+      case .failure(let error):
+        self.hostDelegate?.nativeAdDidFail(error.localizedDescription, code: error.code)
+      }
+    }
+  }
+
+  /// Builds a template `NativeAdView` in code (mirrors the Android template):
+  /// a header row (icon + headline/advertiser), a `MediaView`, the body text
+  /// and a call-to-action button. Optional text/image assets are created and
+  /// registered only when present, but the `MediaView` is always built: on
+  /// GMA 12 `NativeAd.mediaContent` is non-optional and the media view is a
+  /// required asset. `adView.nativeAd` is assigned last.
+  private func render(_ gmaAd: GoogleMobileAds.NativeAd) {
+    let adView = NativeAdView()
+    adView.translatesAutoresizingMaskIntoConstraints = false
+
+    let mainStack = UIStackView()
+    mainStack.axis = .vertical
+    mainStack.spacing = 8
+    mainStack.translatesAutoresizingMaskIntoConstraints = false
+
+    let headerRow = UIStackView()
+    headerRow.axis = .horizontal
+    headerRow.spacing = 8
+    headerRow.alignment = .center
+
+    if let image = gmaAd.icon?.image {
+      let iconView = UIImageView(image: image)
+      iconView.translatesAutoresizingMaskIntoConstraints = false
+      NSLayoutConstraint.activate([
+        iconView.widthAnchor.constraint(equalToConstant: 40),
+        iconView.heightAnchor.constraint(equalToConstant: 40),
+      ])
+      headerRow.addArrangedSubview(iconView)
+      adView.iconView = iconView
+    }
+
+    let textColumn = UIStackView()
+    textColumn.axis = .vertical
+
+    if let headline = gmaAd.headline {
+      let label = UILabel()
+      label.text = headline
+      label.font = .boldSystemFont(ofSize: 16)
+      label.numberOfLines = 0
+      textColumn.addArrangedSubview(label)
+      adView.headlineView = label
+    }
+
+    if let advertiser = gmaAd.advertiser {
+      let label = UILabel()
+      label.text = advertiser
+      label.font = .systemFont(ofSize: 12)
+      textColumn.addArrangedSubview(label)
+      adView.advertiserView = label
+    }
+
+    headerRow.addArrangedSubview(textColumn)
+    mainStack.addArrangedSubview(headerRow)
+
+    let mediaView = MediaView()
+    mediaView.mediaContent = gmaAd.mediaContent
+    mediaView.translatesAutoresizingMaskIntoConstraints = false
+    // Priority 999 so a caller-supplied style shorter than the template's
+    // natural height breaks this constraint instead of spamming
+    // unsatisfiable-constraint logs.
+    let mediaHeight = mediaView.heightAnchor.constraint(equalToConstant: 175)
+    mediaHeight.priority = UILayoutPriority(999)
+    mediaHeight.isActive = true
+    mainStack.addArrangedSubview(mediaView)
+    adView.mediaView = mediaView
+
+    if let body = gmaAd.body {
+      let label = UILabel()
+      label.text = body
+      label.font = .systemFont(ofSize: 14)
+      label.numberOfLines = 0
+      mainStack.addArrangedSubview(label)
+      adView.bodyView = label
+    }
+
+    if let cta = gmaAd.callToAction {
+      let button = UIButton(type: .system)
+      button.setTitle(cta, for: .normal)
+      // The NativeAdView handles the tap; the button must not intercept it.
+      button.isUserInteractionEnabled = false
+      mainStack.addArrangedSubview(button)
+      adView.callToActionView = button
+    }
+
+    adView.addSubview(mainStack)
+    NSLayoutConstraint.activate([
+      mainStack.topAnchor.constraint(equalTo: adView.topAnchor, constant: 8),
+      mainStack.leadingAnchor.constraint(equalTo: adView.leadingAnchor, constant: 8),
+      mainStack.trailingAnchor.constraint(equalTo: adView.trailingAnchor, constant: -8),
+      mainStack.bottomAnchor.constraint(equalTo: adView.bottomAnchor, constant: -8),
+    ])
+
+    self.adView?.removeFromSuperview()
+    addSubview(adView)
+    NSLayoutConstraint.activate([
+      adView.topAnchor.constraint(equalTo: topAnchor),
+      adView.leadingAnchor.constraint(equalTo: leadingAnchor),
+      adView.trailingAnchor.constraint(equalTo: trailingAnchor),
+      adView.bottomAnchor.constraint(equalTo: bottomAnchor),
+    ])
+
+    adView.nativeAd = gmaAd
+    self.adView = adView
+  }
+
+  // MARK: - EzoicNativeAdDelegate
+  public func nativeAdDidRecordImpression(_ nativeAd: EzoicNativeAd) {
+    hostDelegate?.nativeAdDidRecordImpression()
+  }
+  public func nativeAdDidRecordClick(_ nativeAd: EzoicNativeAd) {
+    hostDelegate?.nativeAdDidRecordClick()
+  }
+  public func nativeAdWillPresentScreen(_ nativeAd: EzoicNativeAd) {
+    hostDelegate?.nativeAdWillPresentScreen()
+  }
+  public func nativeAdDidDismissScreen(_ nativeAd: EzoicNativeAd) {
+    hostDelegate?.nativeAdDidDismissScreen()
+  }
+
+  deinit {
+    ezoicNativeAd?.destroy()
+  }
+}

package/ios/EzoicNativeAdViewComponentView.mm

@@ -0,0 +1,99 @@
+#import <React/RCTViewComponentView.h>
+#import <react/renderer/components/EzoicReactNativeSdkSpec/ComponentDescriptors.h>
+#import <react/renderer/components/EzoicReactNativeSdkSpec/EventEmitters.h>
+#import <react/renderer/components/EzoicReactNativeSdkSpec/Props.h>
+#import <react/renderer/components/EzoicReactNativeSdkSpec/RCTComponentViewHelpers.h>
+#import <EzoicReactNativeSdk/EzoicReactNativeSdk-Swift.h>
+
+using namespace facebook::react;
+
+@interface EzoicNativeAdView : RCTViewComponentView <EzoicNativeAdHostViewDelegate>
+@end
+
+@implementation EzoicNativeAdView {
+  EzoicNativeAdHostView *_host;
+  NSString *_lastAdUnit;
+  BOOL _loadStarted;
+}
+
++ (ComponentDescriptorProvider)componentDescriptorProvider {
+  return concreteComponentDescriptorProvider<EzoicNativeAdViewComponentDescriptor>();
+}
+
+- (instancetype)initWithFrame:(CGRect)frame {
+  if (self = [super initWithFrame:frame]) {
+    _host = [EzoicNativeAdHostView new];
+    _host.hostDelegate = self;
+    self.contentView = _host;
+  }
+  return self;
+}
+
+- (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps {
+  const auto &newProps = *std::static_pointer_cast<EzoicNativeAdViewProps const>(props);
+  NSString *adUnit = [NSString stringWithUTF8String:newProps.adUnitIdentifier.c_str()];
+  if (![adUnit isEqualToString:_lastAdUnit]) {
+    // Ad unit changed after a load already started: swap in a fresh host
+    // (mirrors prepareForRecycle) and reset the load guard so
+    // finalizeUpdates starts a new load for the new id.
+    if (_loadStarted) {
+      [_host removeFromSuperview];
+      _host = [EzoicNativeAdHostView new];
+      _host.hostDelegate = self;
+      self.contentView = _host;
+      _loadStarted = NO;
+    }
+    _lastAdUnit = adUnit;
+    [_host configureWithAdUnitIdentifier:adUnit];
+  }
+  [super updateProps:props oldProps:oldProps];
+}
+
+// RCTMountingManager mounts on Insert as updateProps → updateEventEmitter →
+// finalizeUpdates. Starting the load here (not in updateProps) guarantees the
+// event emitter is attached before the native SDK can fail synchronously and
+// emit onError, which would otherwise be dropped while _eventEmitter is nil.
+- (void)finalizeUpdates:(RNComponentViewUpdateMask)updateMask {
+  [super finalizeUpdates:updateMask];
+  if (!_loadStarted && _lastAdUnit.length > 0) {
+    _loadStarted = YES;
+    [_host startLoad];
+  }
+}
+
+- (void)nativeAdDidLoad {
+  if (_eventEmitter) std::static_pointer_cast<EzoicNativeAdViewEventEmitter const>(_eventEmitter)->onLoad({});
+}
+- (void)nativeAdDidFail:(NSString *)message code:(NSInteger)code {
+  if (_eventEmitter)
+    std::static_pointer_cast<EzoicNativeAdViewEventEmitter const>(_eventEmitter)
+      ->onError({.message = std::string([message UTF8String]), .code = (int)code});
+}
+- (void)nativeAdDidRecordImpression {
+  if (_eventEmitter) std::static_pointer_cast<EzoicNativeAdViewEventEmitter const>(_eventEmitter)->onImpression({});
+}
+- (void)nativeAdDidRecordClick {
+  if (_eventEmitter) std::static_pointer_cast<EzoicNativeAdViewEventEmitter const>(_eventEmitter)->onAdClick({});
+}
+- (void)nativeAdWillPresentScreen {
+  if (_eventEmitter) std::static_pointer_cast<EzoicNativeAdViewEventEmitter const>(_eventEmitter)->onOpen({});
+}
+- (void)nativeAdDidDismissScreen {
+  if (_eventEmitter) std::static_pointer_cast<EzoicNativeAdViewEventEmitter const>(_eventEmitter)->onClose({});
+}
+
+- (void)prepareForRecycle {
+  // Recycled views are reused for a new ad unit; rebuild the host (which owns
+  // the loaded EzoicNativeAd, destroyed on deinit) and reset the load guards.
+  [_host removeFromSuperview];
+  _host = [EzoicNativeAdHostView new];
+  _host.hostDelegate = self;
+  self.contentView = _host;
+  _lastAdUnit = nil;
+  _loadStarted = NO;
+  [super prepareForRecycle];
+}
+
+Class<RCTComponentViewProtocol> EzoicNativeAdViewCls(void) { return EzoicNativeAdView.class; }
+
+@end

package/lib/module/EzoicNativeAdViewNativeComponent.ts

@@ -0,0 +1,22 @@
+import { codegenNativeComponent } from 'react-native';
+import type { CodegenTypes, HostComponent, ViewProps } from 'react-native';
+
+type LoadEvent = Readonly<{}>;
+type ErrorEvent = Readonly<{ message: string; code: CodegenTypes.Int32 }>;
+
+export interface NativeProps extends ViewProps {
+  adUnitIdentifier: string;
+  onLoad?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  onError?: CodegenTypes.BubblingEventHandler<ErrorEvent> | null;
+  onImpression?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  // `onClick` is reserved by core ViewProps (a gesture handler), so the native
+  // native-ad-click event is exposed as `onAdClick`. The public
+  // `EzoicNativeAdView` component maps the user-facing `onClick` prop onto this.
+  onAdClick?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  onOpen?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  onClose?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+}
+
+export default codegenNativeComponent<NativeProps>(
+  'EzoicNativeAdView'
+) as HostComponent<NativeProps>;

package/lib/module/helpers.js.map

@@ -1 +1 @@
-{"version":3,"names":["normalizeConfig","config","domain","Error","out","autoReadConsent","undefined","subjectToCOPPA","requestATTBeforeAds","debugEnabled","testMode","normalizeSize","size","split","map","s","trim","filter","length","join","coerceAdUnitId","adUnitIdentifier","String","mapRewardResult","result","earned","type","amount"],"sourceRoot":"../../src","sources":["helpers.ts"],"mappings":";;AAEA,OAAO,SAASA,eAAeA,CAACC,MAAmB,EAAe;EAChE,IAAI,CAACA,MAAM,IAAI,CAACA,MAAM,CAACC,MAAM,EAAE;IAC7B,MAAM,IAAIC,KAAK,CAAC,oDAAoD,CAAC;EACvE;EACA,MAAMC,GAAgB,GAAG;IAAEF,MAAM,EAAED,MAAM,CAACC;EAAO,CAAC;EAClD,IAAID,MAAM,CAACI,eAAe,KAAKC,SAAS,EACtCF,GAAG,CAACC,eAAe,GAAGJ,MAAM,CAACI,eAAe;EAC9C,IAAIJ,MAAM,CAACM,cAAc,KAAKD,SAAS,EACrCF,GAAG,CAACG,cAAc,GAAGN,MAAM,CAACM,cAAc;EAC5C,IAAIN,MAAM,CAACO,mBAAmB,KAAKF,SAAS,EAC1CF,GAAG,CAACI,mBAAmB,GAAGP,MAAM,CAACO,mBAAmB;EACtD,IAAIP,MAAM,CAACQ,YAAY,KAAKH,SAAS,EAAEF,GAAG,CAACK,YAAY,GAAGR,MAAM,CAACQ,YAAY;EAC7E,IAAIR,MAAM,CAACS,QAAQ,KAAKJ,SAAS,EAAEF,GAAG,CAACM,QAAQ,GAAGT,MAAM,CAACS,QAAQ;EACjE,OAAON,GAAG;AACZ;AAEA,OAAO,SAASO,aAAaA,CAACC,IAAwB,EAAU;EAC9D,IAAI,CAACA,IAAI,EAAE,OAAO,EAAE;EACpB,OAAOA,IAAI,CACRC,KAAK,CAAC,GAAG,CAAC,CACVC,GAAG,CAAEC,CAAC,IAAKA,CAAC,CAACC,IAAI,CAAC,CAAC,CAAC,CACpBC,MAAM,CAAEF,CAAC,IAAKA,CAAC,CAACG,MAAM,GAAG,CAAC,CAAC,CAC3BC,IAAI,CAAC,GAAG,CAAC;AACd;AAEA,OAAO,SAASC,cAAcA,CAACC,gBAAwB,EAAU;EAC/D,OAAOC,MAAM,CAACD,gBAAgB,CAAC;AACjC;AAQA;AACA;AACA;AACA;AACA,OAAO,SAASE,eAAeA,CAC7BC,MAA2C,EACF;EACzC,IAAIA,MAAM,IAAIA,MAAM,CAACC,MAAM,EAAE;IAC3B,OAAO;MAAEC,IAAI,EAAEF,MAAM,CAACE,IAAI;MAAEC,MAAM,EAAEH,MAAM,CAACG;IAAO,CAAC;EACrD;EACA,OAAO,IAAI;AACb","ignoreList":[]}
+{"version":3,"names":["normalizeConfig","config","domain","Error","out","autoReadConsent","undefined","subjectToCOPPA","requestATTBeforeAds","debugEnabled","testMode","normalizeSize","size","split","map","s","trim","filter","length","join","coerceAdUnitId","adUnitIdentifier","String","mapRewardResult","result","earned","type","amount"],"sourceRoot":"../../src","sources":["helpers.ts"],"mappings":";;AAEA,OAAO,SAASA,eAAeA,CAACC,MAAmB,EAAe;EAChE,IAAI,CAACA,MAAM,IAAI,CAACA,MAAM,CAACC,MAAM,EAAE;IAC7B,MAAM,IAAIC,KAAK,CAAC,oDAAoD,CAAC;EACvE;EACA,MAAMC,GAAgB,GAAG;IAAEF,MAAM,EAAED,MAAM,CAACC;EAAO,CAAC;EAClD,IAAID,MAAM,CAACI,eAAe,KAAKC,SAAS,EACtCF,GAAG,CAACC,eAAe,GAAGJ,MAAM,CAACI,eAAe;EAC9C,IAAIJ,MAAM,CAACM,cAAc,KAAKD,SAAS,EACrCF,GAAG,CAACG,cAAc,GAAGN,MAAM,CAACM,cAAc;EAC5C,IAAIN,MAAM,CAACO,mBAAmB,KAAKF,SAAS,EAC1CF,GAAG,CAACI,mBAAmB,GAAGP,MAAM,CAACO,mBAAmB;EACtD,IAAIP,MAAM,CAACQ,YAAY,KAAKH,SAAS,EAAEF,GAAG,CAACK,YAAY,GAAGR,MAAM,CAACQ,YAAY;EAC7E,IAAIR,MAAM,CAACS,QAAQ,KAAKJ,SAAS,EAAEF,GAAG,CAACM,QAAQ,GAAGT,MAAM,CAACS,QAAQ;EACjE,OAAON,GAAG;AACZ;AAEA,OAAO,SAASO,aAAaA,CAACC,IAAwB,EAAU;EAC9D,IAAI,CAACA,IAAI,EAAE,OAAO,EAAE;EACpB,OAAOA,IAAI,CACRC,KAAK,CAAC,GAAG,CAAC,CACVC,GAAG,CAAEC,CAAC,IAAKA,CAAC,CAACC,IAAI,CAAC,CAAC,CAAC,CACpBC,MAAM,CAAEF,CAAC,IAAKA,CAAC,CAACG,MAAM,GAAG,CAAC,CAAC,CAC3BC,IAAI,CAAC,GAAG,CAAC;AACd;AAEA,OAAO,SAASC,cAAcA,CAACC,gBAAiC,EAAU;EACxE,OAAOC,MAAM,CAACD,gBAAgB,CAAC;AACjC;AAQA;AACA;AACA;AACA;AACA,OAAO,SAASE,eAAeA,CAC7BC,MAA2C,EACF;EACzC,IAAIA,MAAM,IAAIA,MAAM,CAACC,MAAM,EAAE;IAC3B,OAAO;MAAEC,IAAI,EAAEF,MAAM,CAACE,IAAI;MAAEC,MAAM,EAAEH,MAAM,CAACG;IAAO,CAAC;EACrD;EACA,OAAO,IAAI;AACb","ignoreList":[]}

package/lib/module/index.js

@@ -2,6 +2,7 @@
 
 import NativeEzoicAds from "./NativeEzoicAds.js";
 import EzoicBannerNative from './EzoicBannerViewNativeComponent';
+import EzoicNativeAdNative from './EzoicNativeAdViewNativeComponent';
 import { coerceAdUnitId, normalizeConfig, normalizeSize } from "./helpers.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 export { EzoicRewardedAd } from "./EzoicRewardedAd.js";
@@ -47,4 +48,31 @@ export function EzoicBannerView(props) {
     onClose: onClose ? () => onClose() : undefined
   });
 }
+/**
+ * Renders a native ad in an SDK-built template `NativeAdView`. The component
+ * fills the bounds it is given by its RN style, so size it with `style` (e.g.
+ * `{ width: '100%', height: 300 }`); the template lays out its assets inside.
+ */
+export function EzoicNativeAdView(props) {
+  const {
+    adUnitIdentifier,
+    onLoad,
+    onError,
+    onImpression,
+    onClick,
+    onOpen,
+    onClose,
+    ...rest
+  } = props;
+  return /*#__PURE__*/_jsx(EzoicNativeAdNative, {
+    ...rest,
+    adUnitIdentifier: coerceAdUnitId(adUnitIdentifier),
+    onLoad: onLoad ? () => onLoad() : undefined,
+    onError: onError ? e => onError(e.nativeEvent) : undefined,
+    onImpression: onImpression ? () => onImpression() : undefined,
+    onAdClick: onClick ? () => onClick() : undefined,
+    onOpen: onOpen ? () => onOpen() : undefined,
+    onClose: onClose ? () => onClose() : undefined
+  });
+}
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["NativeEzoicAds","EzoicBannerNative","coerceAdUnitId","normalizeConfig","normalizeSize","jsx","_jsx","EzoicRewardedAd","EzoicInterstitialAd","EzoicAds","initialize","config","setGDPRConsent","applies","consentString","setGPPConsent","gppString","sectionIds","setSubjectToCOPPA","value","trackPageview","EzoicBannerView","props","adUnitIdentifier","size","onLoad","onError","onImpression","onClick","onOpen","onClose","rest","undefined","e","nativeEvent","onAdClick"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":";;AACA,OAAOA,cAAc,MAA4B,qBAAkB;AACnE,OAAOC,iBAAiB,MAAM,kCAAkC;AAChE,SAASC,cAAc,EAAEC,eAAe,EAAEC,aAAa,QAAQ,cAAW;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAG3E,SACEC,eAAe,QAGV,sBAAmB;AAC1B,SACEC,mBAAmB,QAEd,0BAAuB;AAE9B,OAAO,MAAMC,QAAQ,GAAG;EACtBC,UAAUA,CAACC,MAAmB,EAAiB;IAC7C,OAAOX,cAAc,CAACU,UAAU,CAACP,eAAe,CAACQ,MAAM,CAAC,CAAC;EAC3D,CAAC;EACDC,cAAcA,CAACC,OAAgB,EAAEC,aAAsB,EAAQ;IAC7Dd,cAAc,CAACY,cAAc,CAACC,OAAO,EAAEC,aAAa,CAAC;EACvD,CAAC;EACDC,aAAaA,CAACC,SAAkB,EAAEC,UAAmB,EAAQ;IAC3DjB,cAAc,CAACe,aAAa,CAACC,SAAS,EAAEC,UAAU,CAAC;EACrD,CAAC;EACDC,iBAAiBA,CAACC,KAAc,EAAQ;IACtCnB,cAAc,CAACkB,iBAAiB,CAACC,KAAK,CAAC;EACzC,CAAC;EACDC,aAAaA,CAAA,EAAqB;IAChC,OAAOpB,cAAc,CAACoB,aAAa,CAAC,CAAC;EACvC;AACF,CAAC;AAmBD,OAAO,SAASC,eAAeA,CAACC,KAA2B,EAAE;EAC3D,MAAM;IACJC,gBAAgB;IAChBC,IAAI;IACJC,MAAM;IACNC,OAAO;IACPC,YAAY;IACZC,OAAO;IACPC,MAAM;IACNC,OAAO;IACP,GAAGC;EACL,CAAC,GAAGT,KAAK;EACT,oBACEhB,IAAA,CAACL,iBAAiB;IAAA,GACZ8B,IAAI;IACRR,gBAAgB,EAAErB,cAAc,CAACqB,gBAAgB,CAAE;IACnDC,IAAI,EAAEpB,aAAa,CAACoB,IAAI,CAAE;IAC1BC,MAAM,EAAEA,MAAM,GAAG,MAAMA,MAAM,CAAC,CAAC,GAAGO,SAAU;IAC5CN,OAAO,EAAEA,OAAO,GAAIO,CAAC,IAAKP,OAAO,CAACO,CAAC,CAACC,WAAW,CAAC,GAAGF,SAAU;IAC7DL,YAAY,EAAEA,YAAY,GAAG,MAAMA,YAAY,CAAC,CAAC,GAAGK,SAAU;IAC9DG,SAAS,EAAEP,OAAO,GAAG,MAAMA,OAAO,CAAC,CAAC,GAAGI,SAAU;IACjDH,MAAM,EAAEA,MAAM,GAAG,MAAMA,MAAM,CAAC,CAAC,GAAGG,SAAU;IAC5CF,OAAO,EAAEA,OAAO,GAAG,MAAMA,OAAO,CAAC,CAAC,GAAGE;EAAU,CAChD,CAAC;AAEN","ignoreList":[]}
+{"version":3,"names":["NativeEzoicAds","EzoicBannerNative","EzoicNativeAdNative","coerceAdUnitId","normalizeConfig","normalizeSize","jsx","_jsx","EzoicRewardedAd","EzoicInterstitialAd","EzoicAds","initialize","config","setGDPRConsent","applies","consentString","setGPPConsent","gppString","sectionIds","setSubjectToCOPPA","value","trackPageview","EzoicBannerView","props","adUnitIdentifier","size","onLoad","onError","onImpression","onClick","onOpen","onClose","rest","undefined","e","nativeEvent","onAdClick","EzoicNativeAdView"],"sourceRoot":"../../src","sources":["index.tsx"],"mappings":"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","ignoreList":[]}

package/lib/typescript/src/EzoicNativeAdViewNativeComponent.d.ts

@@ -0,0 +1,18 @@
+import type { CodegenTypes, HostComponent, ViewProps } from 'react-native';
+type LoadEvent = Readonly<{}>;
+type ErrorEvent = Readonly<{
+    message: string;
+    code: CodegenTypes.Int32;
+}>;
+export interface NativeProps extends ViewProps {
+    adUnitIdentifier: string;
+    onLoad?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+    onError?: CodegenTypes.BubblingEventHandler<ErrorEvent> | null;
+    onImpression?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+    onAdClick?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+    onOpen?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+    onClose?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+}
+declare const _default: HostComponent<NativeProps>;
+export default _default;
+//# sourceMappingURL=EzoicNativeAdViewNativeComponent.d.ts.map

package/lib/typescript/src/EzoicNativeAdViewNativeComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EzoicNativeAdViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../src/EzoicNativeAdViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAE3E,KAAK,SAAS,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;AAC9B,KAAK,UAAU,GAAG,QAAQ,CAAC;IAAE,OAAO,EAAE,MAAM,CAAC;IAAC,IAAI,EAAE,YAAY,CAAC,KAAK,CAAA;CAAE,CAAC,CAAC;AAE1E,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,gBAAgB,EAAE,MAAM,CAAC;IACzB,MAAM,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAC7D,OAAO,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC;IAC/D,YAAY,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAInE,SAAS,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAChE,MAAM,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;IAC7D,OAAO,CAAC,EAAE,YAAY,CAAC,oBAAoB,CAAC,SAAS,CAAC,GAAG,IAAI,CAAC;CAC/D;wBAII,aAAa,CAAC,WAAW,CAAC;AAF/B,wBAEgC"}

package/lib/typescript/src/helpers.d.ts

@@ -1,7 +1,7 @@
 import type { EzoicConfig } from './NativeEzoicAds.js';
 export declare function normalizeConfig(config: EzoicConfig): EzoicConfig;
 export declare function normalizeSize(size: string | undefined): string;
-export declare function coerceAdUnitId(adUnitIdentifier: string): string;
+export declare function coerceAdUnitId(adUnitIdentifier: string | number): string;
 export interface RewardResultLike {
     earned: boolean;
     type: string;

package/lib/typescript/src/helpers.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAkB,CAAC;AAEpD,wBAAgB,eAAe,CAAC,MAAM,EAAE,WAAW,GAAG,WAAW,CAchE;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,CAO9D;AAED,wBAAgB,cAAc,CAAC,gBAAgB,EAAE,MAAM,GAAG,MAAM,CAE/D;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAC7B,MAAM,EAAE,gBAAgB,GAAG,IAAI,GAAG,SAAS,GAC1C;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAKzC"}
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qBAAkB,CAAC;AAEpD,wBAAgB,eAAe,CAAC,MAAM,EAAE,WAAW,GAAG,WAAW,CAchE;AAED,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,GAAG,MAAM,CAO9D;AAED,wBAAgB,cAAc,CAAC,gBAAgB,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,CAExE;AAED,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,OAAO,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,MAAM,CAAC;CAChB;AAED;;;GAGG;AACH,wBAAgB,eAAe,CAC7B,MAAM,EAAE,gBAAgB,GAAG,IAAI,GAAG,SAAS,GAC1C;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAKzC"}

package/lib/typescript/src/index.d.ts

@@ -26,4 +26,24 @@ export interface EzoicBannerViewProps {
     onClose?: () => void;
 }
 export declare function EzoicBannerView(props: EzoicBannerViewProps): import("react").JSX.Element;
+export interface EzoicNativeAdError {
+    message: string;
+    code: number;
+}
+export interface EzoicNativeAdViewProps {
+    adUnitIdentifier: string | number;
+    style?: StyleProp<ViewStyle>;
+    onLoad?: () => void;
+    onError?: (error: EzoicNativeAdError) => void;
+    onImpression?: () => void;
+    onClick?: () => void;
+    onOpen?: () => void;
+    onClose?: () => void;
+}
+/**
+ * Renders a native ad in an SDK-built template `NativeAdView`. The component
+ * fills the bounds it is given by its RN style, so size it with `style` (e.g.
+ * `{ width: '100%', height: 300 }`); the template lays out its assets inside.
+ */
+export declare function EzoicNativeAdView(props: EzoicNativeAdViewProps): import("react").JSX.Element;
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAuB,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAkB,CAAC;AAIpE,YAAY,EAAE,WAAW,EAAE,CAAC;AAC5B,OAAO,EACL,eAAe,EACf,KAAK,WAAW,EAChB,KAAK,wBAAwB,GAC9B,MAAM,sBAAmB,CAAC;AAC3B,OAAO,EACL,mBAAmB,EACnB,KAAK,4BAA4B,GAClC,MAAM,0BAAuB,CAAC;AAE/B,eAAO,MAAM,QAAQ;uBACA,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;4BAGtB,OAAO,kBAAkB,MAAM,GAAG,IAAI;8BAGpC,MAAM,eAAe,MAAM,GAAG,IAAI;6BAGnC,OAAO,GAAG,IAAI;qBAGtB,OAAO,CAAC,OAAO,CAAC;CAGlC,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,gBAAgB,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,+BAyB1D"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AACzD,OAAuB,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAkB,CAAC;AAKpE,YAAY,EAAE,WAAW,EAAE,CAAC;AAC5B,OAAO,EACL,eAAe,EACf,KAAK,WAAW,EAChB,KAAK,wBAAwB,GAC9B,MAAM,sBAAmB,CAAC;AAC3B,OAAO,EACL,mBAAmB,EACnB,KAAK,4BAA4B,GAClC,MAAM,0BAAuB,CAAC;AAE/B,eAAO,MAAM,QAAQ;uBACA,WAAW,GAAG,OAAO,CAAC,IAAI,CAAC;4BAGtB,OAAO,kBAAkB,MAAM,GAAG,IAAI;8BAGpC,MAAM,eAAe,MAAM,GAAG,IAAI;6BAGnC,OAAO,GAAG,IAAI;qBAGtB,OAAO,CAAC,OAAO,CAAC;CAGlC,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,oBAAoB;IACnC,gBAAgB,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IAC5C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,+BAyB1D;AAED,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,sBAAsB;IACrC,gBAAgB,EAAE,MAAM,GAAG,MAAM,CAAC;IAClC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAC9C,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAED;;;;GAIG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,+BAuB9D"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@ezoic/react-native-sdk",
-  "version": "1.2.0",
-  "description": "Ezoic Ads SDK for React Native (Prebid + Google Ad Manager banner, interstitial and rewarded ads).",
+  "version": "1.3.0",
+  "description": "Ezoic Ads SDK for React Native (Prebid + Google Ad Manager banner, native, interstitial and rewarded ads).",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",
   "exports": {

package/src/EzoicNativeAdViewNativeComponent.ts

@@ -0,0 +1,22 @@
+import { codegenNativeComponent } from 'react-native';
+import type { CodegenTypes, HostComponent, ViewProps } from 'react-native';
+
+type LoadEvent = Readonly<{}>;
+type ErrorEvent = Readonly<{ message: string; code: CodegenTypes.Int32 }>;
+
+export interface NativeProps extends ViewProps {
+  adUnitIdentifier: string;
+  onLoad?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  onError?: CodegenTypes.BubblingEventHandler<ErrorEvent> | null;
+  onImpression?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  // `onClick` is reserved by core ViewProps (a gesture handler), so the native
+  // native-ad-click event is exposed as `onAdClick`. The public
+  // `EzoicNativeAdView` component maps the user-facing `onClick` prop onto this.
+  onAdClick?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  onOpen?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+  onClose?: CodegenTypes.BubblingEventHandler<LoadEvent> | null;
+}
+
+export default codegenNativeComponent<NativeProps>(
+  'EzoicNativeAdView'
+) as HostComponent<NativeProps>;

package/src/helpers.ts

@@ -25,7 +25,7 @@ export function normalizeSize(size: string | undefined): string {
     .join(',');
 }
 
-export function coerceAdUnitId(adUnitIdentifier: string): string {
+export function coerceAdUnitId(adUnitIdentifier: string | number): string {
   return String(adUnitIdentifier);
 }
 

package/src/index.tsx

@@ -1,6 +1,7 @@
 import type { StyleProp, ViewStyle } from 'react-native';
 import NativeEzoicAds, { type EzoicConfig } from './NativeEzoicAds';
 import EzoicBannerNative from './EzoicBannerViewNativeComponent';
+import EzoicNativeAdNative from './EzoicNativeAdViewNativeComponent';
 import { coerceAdUnitId, normalizeConfig, normalizeSize } from './helpers';
 
 export type { EzoicConfig };
@@ -75,3 +76,49 @@ export function EzoicBannerView(props: EzoicBannerViewProps) {
     />
   );
 }
+
+export interface EzoicNativeAdError {
+  message: string;
+  code: number;
+}
+
+export interface EzoicNativeAdViewProps {
+  adUnitIdentifier: string | number;
+  style?: StyleProp<ViewStyle>;
+  onLoad?: () => void;
+  onError?: (error: EzoicNativeAdError) => void;
+  onImpression?: () => void;
+  onClick?: () => void;
+  onOpen?: () => void;
+  onClose?: () => void;
+}
+
+/**
+ * Renders a native ad in an SDK-built template `NativeAdView`. The component
+ * fills the bounds it is given by its RN style, so size it with `style` (e.g.
+ * `{ width: '100%', height: 300 }`); the template lays out its assets inside.
+ */
+export function EzoicNativeAdView(props: EzoicNativeAdViewProps) {
+  const {
+    adUnitIdentifier,
+    onLoad,
+    onError,
+    onImpression,
+    onClick,
+    onOpen,
+    onClose,
+    ...rest
+  } = props;
+  return (
+    <EzoicNativeAdNative
+      {...rest}
+      adUnitIdentifier={coerceAdUnitId(adUnitIdentifier)}
+      onLoad={onLoad ? () => onLoad() : undefined}
+      onError={onError ? (e) => onError(e.nativeEvent) : undefined}
+      onImpression={onImpression ? () => onImpression() : undefined}
+      onAdClick={onClick ? () => onClick() : undefined}
+      onOpen={onOpen ? () => onOpen() : undefined}
+      onClose={onClose ? () => onClose() : undefined}
+    />
+  );
+}