appbooster

v1.0.5

Published

5 months ago

Lightweight TypeScript ads SDK for AppBooster CPC ad platform

0High
0Medium
0Low

culicode

ads sdk cpc appbooster banner native

@appbooster/ads

Lightweight TypeScript SDK for AppBooster's CPC ad platform. Zero dependencies, Shadow DOM, CSP-safe.

Install

npm/pnpm

pnpm add @appbooster/ads

Script tag (IIFE)

<!-- Pinned version (recommended) -->
<script src="https://extensionbooster-resources.s3.amazonaws.com/sdk/v1.0.0/ext-review-ads.iife.js"></script>

<!-- Always latest -->
<script src="https://extensionbooster-resources.s3.amazonaws.com/sdk/latest/ext-review-ads.iife.js"></script>

Web Component — included automatically when the script loads.

Quick Start

1. Script tag (auto-scan)

<script src="ext-review-ads.iife.js"></script>

<div data-ext-review-ad
     data-publisher-id="YOUR_ID"
     data-format="banner"
     data-theme="auto">
</div>

2. NPM / ESM

import ExtReviewAds from '@appbooster/ads';

await ExtReviewAds.render(document.getElementById('ad-slot'), {
  publisherId: 'YOUR_ID',
  slot: 'sidebar',
  format: 'native',
  theme: 'auto',
});

3. Web Component

<ext-review-ad
  publisher-id="YOUR_ID"
  slot="sidebar"
  format="banner"
  theme="dark">
</ext-review-ad>

API Reference

`ExtReviewAds.init(config)`

Renders into first [data-ext-review-ad] element found, or appends a new container to <body>.

`ExtReviewAds.render(target, config)`

Renders an ad into the given HTMLElement.

`ExtReviewAds.version`

Current SDK version string.

`AdConfig`

| Property | Type | Default | Description | |---|---|---|---| | publisherId | string | — | Required. Your publisher key | | slot | string | 'default' | Ad slot identifier | | format | 'banner' \| 'native' \| 'text' | 'native' | Ad format | | theme | 'light' \| 'dark' \| 'auto' | 'auto' | Color theme | | baseUrl | string | https://api.appbooster.net | API base URL |

Formats

| Format | Description | |---|---| | banner | Responsive bar with icon, title, description, CTA button | | native | Flexible card that inherits parent fonts via CSS custom props | | text | Single-line Sponsored: title — description link |

Theming

Override CSS custom properties on the host element:

ext-review-ad {
  --er-ad-bg: #f9f9f9;
  --er-ad-text: #111;
  --er-ad-border: #ddd;
  --er-ad-radius: 12px;
  --er-ad-font: 'Inter', sans-serif;
  --er-ad-accent: #0055bb;
  --er-ad-muted: #777;
}

| Variable | Purpose | |---|---| | --er-ad-bg | Ad background color | | --er-ad-text | Primary text color | | --er-ad-border | Border color | | --er-ad-radius | Border radius | | --er-ad-font | Font family (inherits parent by default) | | --er-ad-accent | CTA / link color | | --er-ad-muted | Secondary / label text color |

CSP Notes

No eval(), no new Function(), no innerHTML with user data
All DOM built via createElement / createTextNode
Shadow DOM isolates styles — safe for Chrome extensions
Add to your CSP: img-src https://api.appbooster.net
Impression tracking uses a 1×1 pixel <img> request

Browser Support

Requires: fetch, IntersectionObserver, CustomElements (all modern browsers, Chrome 67+).

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme