THEOplayer React Native Connectors
    Preparing search index...

    Module NPAW Connector - v1.0.0

    THEOplayer React Native NPAW Connector

    An NPAW (formerly YOUBORA) analytics connector for @theoplayer/react-native.

    This connector is JavaScript-only and works across iOS, Android and web through the unified react-native-theoplayer player, using only the npaw-plugin-react-native plugin — no native iOS/Android modules are required.

    Note: This connector targets NPAW v7+ (it depends on npaw-plugin-react-native ^7.3.x).

    npm install @theoplayer/react-native-analytics-npaw
    

    Create the connector with the useNpaw hook, passing a config object and initializing it once the THEOplayer instance is ready:

    import { LogLevel, useNpaw } from '@theoplayer/react-native-analytics-npaw';

    const App = () => {
    const [npaw, initNpaw] = useNpaw({
    accountCode: 'your-account-code',
    analytics: {
    'content.title': 'Big Buck Bunny',
    'content.isLive': false,
    // Free-form custom metadata shown in the NPAW "Metadata" panel:
    'content.metadata': { genre: 'animation' },
    },
    // Optional NpawPlugin options (host, sessionRecovery, ...):
    plugin: { sessionRecovery: 'auto' },
    logLevel: LogLevel.DEBUG,
    });

    const onPlayerReady = (player: THEOplayer) => {
    initNpaw(player);
    };

    return <THEOplayerView config={playerConfig} onPlayerReady={onPlayerReady} />;
    };

    Alternatively, construct the NpawConnector class directly:

    import { NpawConnector } from '@theoplayer/react-native-analytics-npaw';

    const connector = new NpawConnector(player, { accountCode: 'your-account-code' });
    Field Description
    accountCode Your NPAW account code. Required.
    analytics Per-video analytics options, e.g. content.title, content.isLive, content.metadata, user.name, ...
    plugin NpawPlugin options such as host, sessionRecovery and balancerAnalyticsEnabled.
    logLevel Initial LogLevel.

    Once initialized, the connector registers a video adapter (and an ads adapter) against the player and reports playback automatically:

    • Playback events (start, join, pause/resume, buffering, seeking, end and errors) mapped from the unified PlayerEventType events.
    • Playhead, duration and live/VOD state, resource, rendition and bitrate.
    • The active subtitle/caption track language (getSubtitles) and audio language (getVideoLanguage).
    • Ads: ad breaks, ad start/join/stop, quartiles, skip, click and errors, with ad position (pre/mid/post), duration and skippability.
    // Update options for the current video (e.g. late-arriving metadata):
    npaw.current?.setVideoOptions({ 'content.title': 'New Title' });

    // Update global analytics options:
    npaw.current?.setAnalyticsOptions({ 'user.name': 'viewer-1' });

    // Change the log level:
    npaw.current?.setLogLevel(LogLevel.SILENT);

    // Stop analytics and close all sessions:
    npaw.current?.destroy();

    See the NPAW integration documentation for the full set of plugin and analytics options.

    Enumerations

    LogLevel

    Classes

    NpawConnector

    Interfaces

    NpawConnectorConfig

    Type Aliases

    NpawAnalyticsOptions

    Functions

    useNpaw