Web SDK reference

@engageapp/inapp-web renders full-screen in-app takeovers in web apps. Install it with npm install @engageapp/inapp-web and import the EngageInApp singleton (a class EngageInAppClient is also exported for custom instances).

init(config)

Initialise the SDK. config is { publishableKey, apiBaseUrl?, fetchImpl? }.

• publishableKey — required; your pk_… key.
• apiBaseUrl — optional; defaults to https://api.engageapp.xyz.
• fetchImpl — optional custom fetch (tests / non-browser runtimes).

identify(externalId, opts?)

Associate the current user with the SDK. Safe to call repeatedly. opts = { email?, firstName?, lastName?, device?, identityHash? }. The identityHash is remembered and sent on later fetches when identity verification is enabled.

setHandlers(handlers)

{ onShown?(message), onButtonTap?(action, message), onDismiss?(message) }. A button action is { type: 'deeplink' | 'url' | 'dismiss', value? } — route deep links and URLs from onButtonTap.

onAppForeground()

Async; returns true when a takeover was shown. Fetches and renders the next pending takeover. No-ops if not yet identified, if one is already on screen, or if a fetch is in flight. Call on every app foreground / route into the app.

Media rendering

A takeover's media block is { type: 'image' | 'video', url, posterUrl?, placement?, autoplay?, loop?, muted? }. placement is 'fullscreen' (edge-to-edge behind the copy, the default for video) or 'hero' (a banner above it, the default for images). Video renders as an inline <video> — autoplaying, looping and muted unless the author said otherwise. If the browser blocks autoplay with sound, the SDK retries muted and then falls back to showing playback controls; posterUrl is the frame shown until playback starts.

dismiss()

Programmatically close the current takeover, if any.

See the In-App Takeover setup guide for an end-to-end example.