React Native
A <BannerAd> component plus a framework-agnostic AdxClient. react-native-webview is optional.
| Package | @theaimart/adx-react-native |
|---|---|
| Language | TypeScript |
| Distribution | npm |
| Requirements | Peer deps: react, react-native. react-native-webview only if you expect html/openrtb creatives. |
Install
npm
bash
npm install @theaimart/adx-react-native
# optional, only if you expect html/openrtb creatives:
npm install react-native-webviewUsage
Drop-in component
tsx
import { BannerAd } from '@theaimart/adx-react-native';
function AdSlot() {
return (
<BannerAd
apiKey="pk_your_publisher_key"
slotId="8b1f2c3d-....-uuid"
onLoad={(ad) => console.log('filled', ad.source)}
onError={(e) => console.log('no fill', e.message)}
/>
);
}Client directly
ts
import { AdxClient, platformUserAgent } from '@theaimart/adx-react-native';
const client = new AdxClient({ apiKey: 'pk_...', userAgent: platformUserAgent() });
const ad = await client.requestAd({ slotId: '8b1f-uuid' });
if (ad.filled && ad.isTrackable) await client.reportViewable(ad.impId!);Production hardening
- React Native's Android networking uses OkHttp, whose default UA (okhttp/…) is on the backend's bot blocklist and yields silent no-fill. This SDK always sends theaimart-adx-reactnative/<ver> (<platform>) with an android/iPhone token so the backend also classifies the device correctly.
- SQL-filter-safe-encodes free-text params and fails closed like every other SDK.
These behaviors come directly from the wire contract — see User-Agent rules and WAF-safe encoding for why they matter. Not getting fills? See Troubleshooting.
API
| Member | Notes |
|---|---|
<BannerAd apiKey slotId onLoad? onError? /> | Image ads render with <Image>+<Pressable> (click via Linking); html/openrtb ads use a sandboxed WebView. Viewability fires automatically via measureInWindow. |
new AdxClient({ apiKey, userAgent?, baseUrl? }) | Framework-agnostic client for custom rendering. |
client.requestAd({ slotId? , … }) | Request an ad decision. |
client.reportViewable(impId) | Fire the viewability beacon. |
platformUserAgent() | Builds the platform-tagged fraud-safe UA string. |
The normalized Ad model
Same normalized Ad shape as the Web/Node SDKs (filled, kind, source, impId, creative, auction, isTrackable).
Build & test
bash
cd packages/react-native
npm install
npm test # node --test — client + encoding logic (off-device)
npm run typecheck # tsc --noEmit
npm run build # tsc -> distThe <BannerAd> component requires a React Native environment to run; the client/encoding logic is unit-tested off-device.