react-native-applovin-max 5.7.2 → 6.0.0

package/ios/AppLovinMAX.m

@@ -1777,15 +1777,7 @@ RCT_EXPORT_METHOD(setAppOpenAdLocalExtraParameter:(NSString *)adUnitIdentifier :
     // All positions have constant height
     NSMutableArray<NSLayoutConstraint *> *constraints = [NSMutableArray arrayWithObject: [adView.heightAnchor constraintEqualToConstant: adViewSize.height]];
     
-    UILayoutGuide *layoutGuide;
-    if ( @available(iOS 11.0, *) )
-    {
-        layoutGuide = superview.safeAreaLayoutGuide;
-    }
-    else
-    {
-        layoutGuide = superview.layoutMarginsGuide;
-    }
+    UILayoutGuide *layoutGuide = superview.safeAreaLayoutGuide;
     
     // If top of bottom center, stretch width of screen
     if ( [adViewPosition isEqual: TOP_CENTER] || [adViewPosition isEqual: BOTTOM_CENTER] )

package/ios/AppLovinMAX.xcodeproj/project.pbxproj

@@ -240,7 +240,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 10.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
 				MTL_ENABLE_DEBUG_INFO = YES;
 				ONLY_ACTIVE_ARCH = YES;
 				SDKROOT = iphoneos;
@@ -286,7 +286,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 10.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
 				SDKROOT = iphoneos;
 				VALIDATE_PRODUCT = YES;
@@ -307,7 +307,7 @@
 					"$(SRCROOT)/../../../React/**",
 					"$(SRCROOT)/../../react-native/React/**",
 				);
-				IPHONEOS_DEPLOYMENT_TARGET = 10.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
 				LIBRARY_SEARCH_PATHS = "$(inherited)";
 				OTHER_LDFLAGS = "-ObjC";
 				PRODUCT_NAME = AppLovinMAX;
@@ -331,7 +331,7 @@
 					"$(SRCROOT)/../../../React/**",
 					"$(SRCROOT)/../../react-native/React/**",
 				);
-				IPHONEOS_DEPLOYMENT_TARGET = 10.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 11.0;
 				LIBRARY_SEARCH_PATHS = "$(inherited)";
 				OTHER_LDFLAGS = "-ObjC";
 				PRODUCT_NAME = AppLovinMAX;

package/ios/AppLovinMAXNativeAdView.m

@@ -221,7 +221,14 @@
         if ( !icon.URL && icon.image )
         {
             RCTImageView *iconImageView = (RCTImageView *) view;
-            iconImageView.defaultImage = icon.image;
+            if ( [iconImageView respondsToSelector: @selector(setImage:)] )
+            {
+                [iconImageView performSelector: @selector(setImage:) withObject: icon.image];
+            }
+            else
+            {
+                [[AppLovinMAX shared] log: @"Unable to set native ad IconView image"];
+            }
         }
     }
 }

package/ios/Podfile

@@ -1,5 +1,5 @@
 # Uncomment the next line to define a global platform for your project
-platform :ios, '10.0'
+platform :ios, '11.0'
 require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'
 
 target 'AppLovinMAX' do

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-native-applovin-max",
   "author": "AppLovin Corporation",
-  "version": "5.7.2",
+  "version": "6.0.0",
   "description": "AppLovin MAX React Native Plugin for Android and iOS",
   "homepage": "https://github.com/AppLovin/AppLovin-MAX-React-Native",
   "license": "MIT",
@@ -24,6 +24,7 @@
   ],
   "repository": "https://github.com/AppLovin/AppLovin-MAX-React-Native",
   "devDependencies": {
+    "@types/react-native": "^0.63.1",
     "react": "^16.13.1",
     "react-native": "^0.63.1"
   },

package/react-native-applovin-max.podspec

@@ -11,7 +11,7 @@ Pod::Spec.new do |s|
   s.authors      = package["author"]
 
   s.platforms    = { :ios => "10.0" }
-  s.source       = { :git => "https://github.com/AppLovin/AppLovin-MAX-React-Native.git", :tag => "release_5_7_2" }
+  s.source       = { :git => "https://github.com/AppLovin/AppLovin-MAX-React-Native.git", :tag => "release_6_0_0" }
   
   s.source_files  = "ios/AppLovinMAX*.{h,m}"
 

package/src/AdView.tsx

@@ -0,0 +1,251 @@
+import React, { useEffect, useState } from "react";
+import { NativeModules, requireNativeComponent, StyleSheet } from "react-native";
+import type { ViewProps, ViewStyle, StyleProp } from "react-native";
+import type { AdDisplayFailedInfo, AdInfo, AdLoadFailedInfo, AdRevenueInfo } from "./types/AdInfo";
+import type { AdNativeEvent } from "./types/AdEvent";
+import type { AdViewProps } from "./types/AdViewProps";
+
+const { AppLovinMAX } = NativeModules;
+
+const {
+    BANNER_AD_FORMAT_LABEL,
+    MREC_AD_FORMAT_LABEL,
+
+    TOP_CENTER_POSITION,
+    TOP_LEFT_POSITION,
+    TOP_RIGHT_POSITION,
+    CENTERED_POSITION,
+    CENTER_LEFT_POSITION,
+    CENTER_RIGHT_POSITION,
+    BOTTOM_LEFT_POSITION,
+    BOTTOM_CENTER_POSITION,
+    BOTTOM_RIGHT_POSITION,
+} = AppLovinMAX.getConstants();
+
+/**
+ * Defines a format of an ad.
+ */
+export enum AdFormat {
+
+    /**
+     * Banner ad.
+     */
+    BANNER = BANNER_AD_FORMAT_LABEL,
+
+    /**
+     * MREC ad.
+     */
+    MREC = MREC_AD_FORMAT_LABEL,
+}
+
+/**
+ * Defines a position of a banner and MREC ad.
+ */
+export enum AdViewPosition {
+    TOP_CENTER = TOP_CENTER_POSITION,
+    TOP_LEFT = TOP_LEFT_POSITION,
+    TOP_RIGHT = TOP_RIGHT_POSITION,
+    CENTERED = CENTERED_POSITION,
+    CENTER_LEFT = CENTER_LEFT_POSITION,
+    CENTER_RIGHT = CENTER_RIGHT_POSITION,
+    BOTTOM_LEFT = BOTTOM_LEFT_POSITION,
+    BOTTOM_CENTER = BOTTOM_CENTER_POSITION,
+    BOTTOM_RIGHT = BOTTOM_RIGHT_POSITION,
+}
+
+type AdViewNativeEvents = {
+    onAdLoadedEvent(event: AdNativeEvent<AdInfo>): void
+    onAdLoadFailedEvent(event: AdNativeEvent<AdLoadFailedInfo>): void
+    onAdDisplayFailedEvent(event: AdNativeEvent<AdDisplayFailedInfo>): void
+    onAdClickedEvent(event: AdNativeEvent<AdInfo>): void
+    onAdExpandedEvent(event: AdNativeEvent<AdInfo>): void
+    onAdCollapsedEvent(event: AdNativeEvent<AdInfo>): void
+    onAdRevenuePaidEvent(event: AdNativeEvent<AdRevenueInfo>): void
+}
+
+const AdViewComponent = requireNativeComponent<AdViewProps & ViewProps & AdViewNativeEvents>("AppLovinMAXAdView");
+
+const ADVIEW_SIZE = {
+    banner: { width: 320, height: 50 },
+    leader: { width: 728, height: 90 },
+    mrec: { width: 300, height: 250 },
+};
+
+const getOutlineViewSize = (style: StyleProp<ViewStyle>) => {
+    const viewStyle = StyleSheet.flatten(style || {});
+    return [viewStyle?.width, viewStyle?.height];
+};
+
+const sizeAdViewDimensions = (adFormat: AdFormat, adaptiveBannerEnabled?: boolean, width?: number | string, height?: number | string): Promise<{}> => {
+    const sizeForBannerFormat = async () => {
+        const isTablet = await AppLovinMAX.isTablet();
+
+        const minWidth = isTablet ? ADVIEW_SIZE.leader.width : ADVIEW_SIZE.banner.width;
+
+        let minHeight;
+        if (adaptiveBannerEnabled) {
+            if (typeof width === "number" && width > minWidth) {
+                minHeight = await AppLovinMAX.getAdaptiveBannerHeightForWidth(width);
+            } else {
+                minHeight = await AppLovinMAX.getAdaptiveBannerHeightForWidth(minWidth);
+            }
+        } else {
+            minHeight = isTablet ? ADVIEW_SIZE.leader.height : ADVIEW_SIZE.banner.height;
+        }
+
+        return Promise.resolve({
+            ...width === "auto" ? {
+                width: minWidth,
+            } : {
+                minWidth: minWidth,
+            },
+            ...height === "auto" ? {
+                height: minHeight,
+            } : {
+                minHeight: minHeight,
+            }
+        });
+    }
+
+    if (adFormat === AdFormat.BANNER) {
+        return sizeForBannerFormat();
+    } else {
+        return Promise.resolve({
+            ...width === "auto" ? {
+                width: ADVIEW_SIZE.mrec.width,
+            } : {
+                minWidth: ADVIEW_SIZE.mrec.width,
+            },
+            ...height === "auto" ? {
+                height: ADVIEW_SIZE.mrec.height,
+            } : {
+                minHeight: ADVIEW_SIZE.mrec.height,
+            }
+        });
+    }
+}
+
+/**
+ * The {@link AdView} component for building a banner or a MREC.  Banners are sized to 320x50 on phones
+ * and 728x90 on tablets.  MRECs are sized to 300x250 on phones and tablets.  You may use the
+ * utility method `AppLovinMAX.isTablet()` to help with view sizing adjustments.  For adaptive
+ * banners, call `BannerAd.getAdaptiveHeightForWidth(width)` to get the banner height, and then adjust
+ * your content accordingly.
+ *
+ * ### Example:
+ * ```js
+ * <AdView
+ *   adUnitId={adUnitId}
+ *   adFormat={AdFormat.BANNER}
+ *   placement="my_placement"
+ *   customData="my_customData"
+ *   extraParameters={{"key1":"value1", "key2":"value2"}}
+ *   localExtraParameters={{"key1":123", "key2":object}}
+ *   adaptiveBannerEnabled={false}
+ *   autoRefresh={false}
+ *   style={styles.banner}
+ *   onAdLoaded={(adInfo: AdInfo) => { ... }}
+ * />
+ * ```
+ */
+export const AdView = ({
+    adUnitId,
+    adFormat,
+    placement,
+    customData,
+    adaptiveBannerEnabled = true,
+    autoRefresh = true,
+    extraParameters,
+    localExtraParameters,
+    onAdLoaded,
+    onAdLoadFailed,
+    onAdDisplayFailed,
+    onAdClicked,
+    onAdExpanded,
+    onAdCollapsed,
+    onAdRevenuePaid,
+    style,
+    ...otherProps
+}: AdViewProps & ViewProps) => {
+    const [isInitialized, setIsInitialized] = useState<boolean>(false);
+    const [dimensions, setDimensions] = useState({});
+
+    useEffect(() => {
+        AppLovinMAX.isInitialized().then((result: boolean) => {
+            setIsInitialized(result);
+            if (!result) {
+                console.warn("ERROR: AdView is mounted before the initialization of the AppLovin MAX React Native module");
+            }
+        });
+    }, []);
+
+    useEffect(() => {
+        if (!isInitialized) return;
+        const [width, height] = getOutlineViewSize(style);
+        sizeAdViewDimensions(adFormat, adaptiveBannerEnabled, width, height).then((value: {}) => {
+            setDimensions(value);
+        });
+    }, [isInitialized]);
+
+    const onAdLoadedEvent = (event: AdNativeEvent<AdInfo>) => {
+        if (onAdLoaded) onAdLoaded(event.nativeEvent);
+    };
+
+    const onAdLoadFailedEvent = (event: AdNativeEvent<AdLoadFailedInfo>) => {
+        if (onAdLoadFailed) onAdLoadFailed(event.nativeEvent);
+    };
+
+    const onAdDisplayFailedEvent = (event: AdNativeEvent<AdDisplayFailedInfo>) => {
+        if (onAdDisplayFailed) onAdDisplayFailed(event.nativeEvent);
+    };
+
+    const onAdClickedEvent = (event: AdNativeEvent<AdInfo>) => {
+        if (onAdClicked) onAdClicked(event.nativeEvent);
+    };
+
+    const onAdExpandedEvent = (event: AdNativeEvent<AdInfo>) => {
+        if (onAdExpanded) onAdExpanded(event.nativeEvent);
+    };
+
+    const onAdCollapsedEvent = (event: AdNativeEvent<AdInfo>) => {
+        if (onAdCollapsed) onAdCollapsed(event.nativeEvent);
+    };
+
+    const onAdRevenuePaidEvent = (event: AdNativeEvent<AdRevenueInfo>) => {
+        if (onAdRevenuePaid) onAdRevenuePaid(event.nativeEvent);
+    };
+
+    // Not initialized
+    if (!isInitialized) {
+        return null;
+    } else {
+        const isDimensionsSet = (Object.keys(dimensions).length > 0);
+
+        // Not sized yet
+        if (!isDimensionsSet) {
+            return null;
+        }
+    }
+
+    return (
+        <AdViewComponent
+            adUnitId={adUnitId}
+            adFormat={adFormat}
+            placement={placement}
+            customData={customData}
+            adaptiveBannerEnabled={adaptiveBannerEnabled}
+            autoRefresh={autoRefresh}
+            extraParameters={extraParameters}
+            localExtraParameters={localExtraParameters}
+            onAdLoadedEvent={onAdLoadedEvent}
+            onAdLoadFailedEvent={onAdLoadFailedEvent}
+            onAdDisplayFailedEvent={onAdDisplayFailedEvent}
+            onAdClickedEvent={onAdClickedEvent}
+            onAdExpandedEvent={onAdExpandedEvent}
+            onAdCollapsedEvent={onAdCollapsedEvent}
+            onAdRevenuePaidEvent={onAdRevenuePaidEvent}
+            style={{ ...(style as ViewProps), ...dimensions }}
+            {...otherProps}
+        />
+    );
+};

package/src/AppLovinMAX.ts

@@ -0,0 +1,24 @@
+import { NativeModules } from "react-native";
+import type { AppLovinMAXType } from "./types/AppLovinMAX";
+import type { Configuration } from "./types/Configuration";
+
+const NativeAppLovinMAX = NativeModules.AppLovinMAX;
+
+const VERSION = "6.0.0";
+
+const initialize = async (
+    sdkKey: string
+): Promise<Configuration> => {
+    return NativeAppLovinMAX.initialize(VERSION, sdkKey);
+}
+
+type NativeAppLovinMAXType = Omit<AppLovinMAXType, | 'initialize'>;
+
+const nativeMethods: NativeAppLovinMAXType = NativeAppLovinMAX;
+
+export const AppLovinMAX: AppLovinMAXType = {
+    ...nativeMethods,
+    initialize,
+}
+
+export default AppLovinMAX;

package/src/AppOpenAd.ts

@@ -0,0 +1,128 @@
+import { NativeModules } from "react-native";
+import { addEventListener, removeEventListener } from "./EventEmitter"
+import type { AdDisplayFailedInfo, AdInfo, AdLoadFailedInfo, AdRevenueInfo } from "./types/AdInfo";
+import type { AppOpenAdType } from "./types/AppOpenAd";
+
+const { AppLovinMAX } = NativeModules;
+
+const {
+    ON_APPOPEN_AD_LOADED_EVENT,
+    ON_APPOPEN_AD_LOAD_FAILED_EVENT,
+    ON_APPOPEN_AD_CLICKED_EVENT,
+    ON_APPOPEN_AD_DISPLAYED_EVENT,
+    ON_APPOPEN_AD_FAILED_TO_DISPLAY_EVENT,
+    ON_APPOPEN_AD_HIDDEN_EVENT,
+    ON_APPOPEN_AD_REVENUE_PAID,
+} = AppLovinMAX.getConstants();
+
+const isAdReady = (adUnitId: string): Promise<boolean> => {
+    return AppLovinMAX.isAppOpenAdReady(adUnitId);
+}
+
+const loadAd = (adUnitId: string): void => {
+    AppLovinMAX.loadAppOpenAd(adUnitId);
+}
+
+const showAd = (
+    adUnitId: string,
+    placement?: string | null,
+    customData?: string | null
+): void => {
+    AppLovinMAX.showAppOpenAd(adUnitId, placement ?? undefined, customData ?? undefined);
+}
+
+const setExtraParameter = (adUnitId: string, key: string, value: any): void => {
+    AppLovinMAX.setAppOpenAdExtraParameter(adUnitId, key, value);
+}
+
+const setLocalExtraParameter = (adUnitId: string, key: string, value: any): void => {
+    AppLovinMAX.setAppOpenAdLocalExtraParameter(adUnitId, { [key]: value });
+}
+
+const addAdLoadedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_LOADED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdLoadedEventListener = () => {
+    removeEventListener(ON_APPOPEN_AD_LOADED_EVENT);
+}
+
+const addAdLoadFailedEventListener = (listener: (errorInfo: AdLoadFailedInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_LOAD_FAILED_EVENT, (errorInfo: AdLoadFailedInfo) => listener(errorInfo));
+}
+
+const removeAdLoadFailedEventListener = () => {
+    removeEventListener(ON_APPOPEN_AD_LOAD_FAILED_EVENT);
+}
+
+const addAdClickedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_CLICKED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdClickedEventListener = () => {
+    removeEventListener(ON_APPOPEN_AD_CLICKED_EVENT);
+}
+
+const addAdDisplayedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_DISPLAYED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdDisplayedEventListener = () => {
+    removeEventListener(ON_APPOPEN_AD_DISPLAYED_EVENT);
+}
+
+const addAdFailedToDisplayEventListener = (listener: (errorInfo: AdDisplayFailedInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_FAILED_TO_DISPLAY_EVENT, (errorInfo: AdDisplayFailedInfo) => listener(errorInfo));
+}
+
+const removeAdFailedToDisplayEventListener = () => {
+    removeEventListener(ON_APPOPEN_AD_FAILED_TO_DISPLAY_EVENT);
+}
+
+const addAdHiddenEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_HIDDEN_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdHiddenEventListener = () => {
+    removeEventListener(ON_APPOPEN_AD_HIDDEN_EVENT);
+}
+
+const addAdRevenuePaidListener = (listener: (adInfo: AdRevenueInfo) => void) => {
+    addEventListener(ON_APPOPEN_AD_REVENUE_PAID, (adInfo: AdRevenueInfo) => listener(adInfo));
+}
+
+const removeAdRevenuePaidListener = () => {
+    removeEventListener(ON_APPOPEN_AD_REVENUE_PAID);
+}
+
+export const AppOpenAd: AppOpenAdType = {
+    isAdReady,
+    loadAd,
+    showAd,
+
+    setExtraParameter,
+    setLocalExtraParameter,
+
+    addAdLoadedEventListener,
+    removeAdLoadedEventListener,
+
+    addAdLoadFailedEventListener,
+    removeAdLoadFailedEventListener,
+
+    addAdClickedEventListener,
+    removeAdClickedEventListener,
+
+    addAdDisplayedEventListener,
+    removeAdDisplayedEventListener,
+
+    addAdFailedToDisplayEventListener,
+    removeAdFailedToDisplayEventListener,
+
+    addAdHiddenEventListener,
+    removeAdHiddenEventListener,
+
+    addAdRevenuePaidListener,
+    removeAdRevenuePaidListener,
+}
+
+export default AppOpenAd;

package/src/BannerAd.ts

@@ -0,0 +1,175 @@
+import { NativeModules } from "react-native";
+import { addEventListener, removeEventListener } from "./EventEmitter"
+import type { AdInfo, AdLoadFailedInfo, AdRevenueInfo } from "./types/AdInfo";
+import type { BannerAdType } from "./types/BannerAd";
+import type { AdViewPosition } from "./AdView";
+
+const { AppLovinMAX } = NativeModules;
+
+const {
+    ON_BANNER_AD_LOADED_EVENT,
+    ON_BANNER_AD_LOAD_FAILED_EVENT,
+    ON_BANNER_AD_CLICKED_EVENT,
+    ON_BANNER_AD_COLLAPSED_EVENT,
+    ON_BANNER_AD_EXPANDED_EVENT,
+    ON_BANNER_AD_REVENUE_PAID,
+} = AppLovinMAX.getConstants();
+
+const createAd = (adUnitId: string, position: AdViewPosition, xOffset?: number, yOffset?: number): void => {
+    AppLovinMAX.createBannerWithOffsets(adUnitId, position, xOffset ?? 0, yOffset ?? 0);
+}
+
+const destroyAd = (adUnitId: string): void => {
+    AppLovinMAX.destroyBanner(adUnitId);
+}
+
+const showAd = (adUnitId: string): void => {
+    AppLovinMAX.showBanner(adUnitId);
+}
+
+const hideAd = (adUnitId: string): void => {
+    AppLovinMAX.hideBanner(adUnitId);
+}
+
+const setPlacement = (adUnitId: string, placement: string | null): void => {
+    AppLovinMAX.setBannerPlacement(adUnitId, placement);
+}
+
+const setCustomData = (adUnitId: string, customData: string | null): void => {
+    AppLovinMAX.setBannerCustomData(adUnitId, customData);
+}
+
+const updatePosition = (adUnitId: string, bannerPosition: AdViewPosition): void => {
+    AppLovinMAX.updateBannerPosition(adUnitId, bannerPosition);
+}
+
+const setExtraParameter = (adUnitId: string, key: string, value: any): void => {
+    AppLovinMAX.setBannerExtraParameter(adUnitId, key, value);
+}
+
+const setLocalExtraParameter = (adUnitId: string, key: string, value: any): void => {
+    AppLovinMAX.setBannerLocalExtraParameter(adUnitId, { [key]: value });
+}
+
+const startAutoRefresh = (adUnitId: string): void => {
+    AppLovinMAX.startBannerAutoRefresh(adUnitId);
+}
+
+const stopAutoRefresh = (adUnitId: string): void => {
+    AppLovinMAX.stopBannerAutoRefresh(adUnitId);
+}
+
+const addAdLoadedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_BANNER_AD_LOADED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdLoadedEventListener = () => {
+    removeEventListener(ON_BANNER_AD_LOADED_EVENT);
+}
+
+const addAdLoadFailedEventListener = (listener: (errorInfo: AdLoadFailedInfo) => void) => {
+    addEventListener(ON_BANNER_AD_LOAD_FAILED_EVENT, (errorInfo: AdLoadFailedInfo) => listener(errorInfo));
+}
+
+const removeAdLoadFailedEventListener = () => {
+    removeEventListener(ON_BANNER_AD_LOAD_FAILED_EVENT);
+}
+
+const addAdClickedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_BANNER_AD_CLICKED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdClickedEventListener = () => {
+    removeEventListener(ON_BANNER_AD_CLICKED_EVENT);
+}
+
+const addAdCollapsedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_BANNER_AD_COLLAPSED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdCollapsedEventListener = () => {
+    removeEventListener(ON_BANNER_AD_COLLAPSED_EVENT);
+}
+
+const addAdExpandedEventListener = (listener: (adInfo: AdInfo) => void) => {
+    addEventListener(ON_BANNER_AD_EXPANDED_EVENT, (adInfo: AdInfo) => listener(adInfo));
+}
+
+const removeAdExpandedEventListener = () => {
+    removeEventListener(ON_BANNER_AD_EXPANDED_EVENT);
+}
+
+const addAdRevenuePaidListener = (listener: (adInfo: AdRevenueInfo) => void) => {
+    addEventListener(ON_BANNER_AD_REVENUE_PAID, (adInfo: AdRevenueInfo) => listener(adInfo));
+}
+
+const removeAdRevenuePaidListener = () => {
+    removeEventListener(ON_BANNER_AD_REVENUE_PAID);
+}
+
+// Banner specific APIs
+
+const setBackgroundColor = (adUnitId: string, hexColorCode: string): void => {
+    AppLovinMAX.setBannerBackgroundColor(adUnitId, hexColorCode);
+}
+
+const setWidth = (adUnitId: string, width: number): void => {
+    AppLovinMAX.setBannerWidth(adUnitId, width);
+}
+
+const updateOffsets = (adUnitId: string, xOffset: number, yOffset: number): void => {
+    AppLovinMAX.updateBannerOffsets(adUnitId, xOffset, yOffset);
+}
+
+const getAdaptiveHeightForWidth = (width: number): Promise<number> => {
+    return AppLovinMAX.getAdaptiveBannerHeightForWidth(width);
+}
+
+export const BannerAd: BannerAdType = {
+    createAd,
+    destroyAd,
+
+    showAd,
+    hideAd,
+
+    setPlacement,
+    setCustomData,
+
+    updatePosition,
+
+    setExtraParameter,
+    setLocalExtraParameter,
+
+    startAutoRefresh,
+    stopAutoRefresh,
+
+    addAdLoadedEventListener,
+    removeAdLoadedEventListener,
+
+    addAdLoadFailedEventListener,
+    removeAdLoadFailedEventListener,
+
+    addAdClickedEventListener,
+    removeAdClickedEventListener,
+
+    addAdCollapsedEventListener,
+    removeAdCollapsedEventListener,
+
+    addAdExpandedEventListener,
+    removeAdExpandedEventListener,
+
+    addAdRevenuePaidListener,
+    removeAdRevenuePaidListener,
+
+    // Banner specific APIs
+
+    setBackgroundColor,
+
+    setWidth,
+
+    updateOffsets,
+
+    getAdaptiveHeightForWidth,
+}
+
+export default BannerAd;