@digia-engage/core

React Native SDK for Digia Engage. It renders in-app experiences (nudges, guides, surveys, and inline content) in React Native apps on Android and iOS.

How it works

@digia-engage/core wraps the native Digia Engage Android and iOS SDKs. The native SDKs load campaigns, decide what to show, and render nudges, surveys, and inline content. Tooltip and spotlight guides are rendered in React Native by <DigiaHost />, anchored to your <DigiaAnchorView> elements.

Campaigns are triggered by a CEP (CleverTap, WebEngage, or MoEngage, through its @digia-engage/* package) or by your app through Digia.triggerCampaign().

Requirements

Installation

npm install @digia-engage/core
# or
yarn add @digia-engage/core

Autolinking handles the native setup.

iOS pods

The Digia Engage iOS SDK is published to the Digia CocoaPods spec repo. Point CocoaPods at it.

Expo: add the config plugin to app.json, then run npx expo prebuild:

{ "expo": { "plugins": ["@digia-engage/core"] } }

Bare React Native: add these lines to the top of ios/Podfile, keeping this order:

source 'https://github.com/Digia-Technology-Private-Limited/digia-podspecs.git'
source 'https://cdn.cocoapods.org/'

Then install pods and rebuild the app:

cd ios && pod install

To use a CEP, also install its package: @digia-engage/clevertap, @digia-engage/webengage, or @digia-engage/moengage.

Usage

1 — Initialize the SDK

Call Digia.initialize() once, as early as possible (top of App.tsx):

import { Digia } from '@digia-engage/core';

await Digia.initialize({
  apiKey: 'YOUR_API_KEY',
  environment: 'production', // or 'sandbox'
  logLevel: 'error',
});

initialize() waits up to 2 seconds for campaigns to load and does not reject if loading fails.

Custom fonts

Embed the font faces your app needs using Expo's expo-font config plugin or your native projects, then pass the registered family name to Digia Engage. Dashboard-provided weights are applied automatically.

await Digia.initialize({
  apiKey: 'YOUR_API_KEY',
  fontFamily: 'Inter',
});

The family must be registered as a native multi-face family. If the requested face is unavailable, the operating system performs its normal font fallback.

2 — Mount <DigiaHost />

Place <DigiaHost /> once at the root of your component tree, after your navigation container. It renders tooltip and spotlight guides.

// app/_layout.tsx (Expo Router) or App.tsx
import { DigiaHost } from '@digia-engage/core';

export default function RootLayout() {
  return (
    <>
      <Stack />
      <DigiaHost />
    </>
  );
}

3 — Track screen changes

import { Digia } from '@digia-engage/core';

<NavigationContainer
  onStateChange={() => {
    const route = navRef.getCurrentRoute();
    if (route) Digia.setCurrentScreen(route.name);
  }}
>

4 — Add anchors for guide campaigns

Wrap any UI element you want a tooltip or spotlight to point at:

import { DigiaAnchorView } from '@digia-engage/core';

<DigiaAnchorView anchorKey="home_banner_btn">
  <Button title="Banner" />
</DigiaAnchorView>

5 — Add slots for inline campaigns

import { DigiaSlotView } from '@digia-engage/core';

// Auto-sizes to the content height
<DigiaSlotView placementKey="home_banner" />

6 — Trigger campaigns

With a CEP — install its package and register it after initialize():

import { DigiaCleverTapPlugin } from '@digia-engage/clevertap';

await Digia.initialize({ apiKey: 'YOUR_API_KEY' });
Digia.register(new DigiaCleverTapPlugin());

register() rejects if the CEP package isn't installed or linked. Each CEP package's README lists any extra setup it needs.

From your app — show a campaign by key:

const { accepted, dropReason } = await Digia.triggerCampaign('welcome_tour');
if (!accepted) console.warn(`Not shown: ${dropReason}`);

dropReason explains a refusal, for example frequency_capped, screen_not_targeted, unknown_campaign_key, or not_ready while campaigns are still loading. Pass a second argument to override the campaign's variables for this delivery.

7 — (Optional) Handle actions

Register only the actions your app owns. A configured handler suppresses SDK fallback:

await Digia.initialize({
  apiKey: 'YOUR_API_KEY',
  actionHandlers: {
    customKV: (payload) => handleCustomAction(payload),
    deepLink: (url) => router.push(url),
    openURL: (url) => openInAppBrowser(url),
  },
  linking: {
    routeViaSystemLinking: true,
    inAppBrowser: defaultInAppBrowser, // requires react-native-inappbrowser-reborn
  },
});

Handlers can be replaced after initialization and cleared when a screen stops owning the action:

Digia.setCustomKVHandler((payload) => handleCustomAction(payload));
Digia.setCustomKVHandler(null);

8 — (Optional) Identify users

Digia.setUserId('user-123'); // after login
Digia.clearUserId();         // on logout
Digia.clearAllInlineContent(); // drop the previous user's inline content

API Reference

Digia

DigiaConfig

<DigiaHost />

No props. Renders tooltip and spotlight guides. Place it once at the app root.

<DigiaAnchorView>

<DigiaSlotView>

Renders inline campaign content (banners, cards) at a named placement. Collapses to zero height when no campaign is active for the slot.

License

Business Source License 1.1 (BUSL-1.1) © Tinkerbox Technology Private Limited — see LICENSE