1.0.14 • Published 5 days ago

@digiotech/react-native v1.0.14

Weekly downloads
-
License
MIT
Repository
github
Last release
5 days ago

Digio React Native SDK

npm version

Official React Native SDK for Digio Gateway Integration

Installation

yarn install @digiotech/react-native

Documentation

Documentation of Digio Gateway Integration and their usage

Basic Usage

Instantiate the Digio instance with environment & other options

import { Digio, DigioConfig, DigioResponse } from '@digiotech/react-native';

const config: DigioConfig = { environment: Environment.PRODUCTION };
const digio = new Digio(config);
const documentId = "<document_id>";
const identifier = "<email_or_phone>";
const digioResponse: DigioResponse = await digio.start(documentId, identifier);

Consuming gateway events Optional

You can consume events and understand the flow or the journey of the user as he is performing it.

For a complete list of events and the payload associated with it, refer here

import { useEffect } from 'react';
import { Digio, DigioConfig, GatewayEvent } from '@digiotech/react-native';

function YourComponent() {
  useEffect(() => {
    const gatewayEventListener = digio.addGatewayEventListener(
      (event: GatewayEvent) => {
        // Do some operation on the received events
      }
    );

    return () => {
      gatewayEventListener.remove();
    }
  }, []);
}

Complete Usage

import { useEffect } from 'react';
import { Digio, DigioConfig, GatewayEvent } from '@digiotech/react-native';

function YourComponent() {
  useEffect(() => {
    const gatewayEventListener = digio.addGatewayEventListener(
      (event: GatewayEvent) => {
        // Do some operation on the received events
      }
    );

    return () => {
      gatewayEventListener.remove();
    }
  }, []);

  const triggerDigioGateway = async () => {
    const config: DigioConfig = { environment: Environment.PRODUCTION };
    const digio = new Digio(config);
    const documentId = "<document_id>";
    const identifier = "<email_or_phone>";
    const tokenId = "<gateway_token_id";
    const digioResponse: DigioResponse = await digio.start(documentId, identifier, tokenId);

  }
}

Android

Note: Incase you are using camera feature and facing black screen on camera then follow below steps

  • Add below in your project under build.gradle file inside dependencies
implementation fileTree(dir: 'libs', include: ['*.aar'])

SDK Reference

DigioConfig

Parameters:

NameTypeDescription
environment*stringEnvironment for which you want to open gateway. One of sandbox or production
logostringPass an URL of your brand logo. Note: Pass an optimised image url for best results
themestringOptions for changing the appearance of the gateway. See below for options under it.

Theme:

NameTypeDescription
primaryColorstringYour brand colour's HEX code to alter CTA (call-to-action) button colors
secondaryColorstringHEX Code to alter text colors
fontFamilystringFont Family of your choice. For eg: Crimson Pro
fontFormatstringFormat of the Font Family Provided. For eg: ’woff2’,’ot’,’tt’
fontUrlstringFont Family URL. For eg: '{font_family_url}.woff2'

DigioResponse Response received from Gateway

NameTypeDescription
code*numberSUCCESS = 1001 FAIL = 1002 CANCEL = -1000 WEBVIEW_CRASH = 1003 WEBVIEW_ERROR = 10017 SDK_CRASH = 1004 Location/Camera/MicroPhone Permission Denied By User = 1008
documentIdstringDocument ID Passed from the parent app. For eg: KID22040413040490937VNTC6LAP8KWD
messagestringError message in case of crash or failure
permissionsArrayList of mandatory permissions which are not given during kyc journey

Android Permissions

Add required permissions in the manifest file. Note - This is the common SDK for various KYC flows

<!--RECORD_AUDIO and MODIFY_AUDIO_SETTINGS Permission required for Video KYC -->
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
/** Required for geotagging */
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
/** Required for ID card analysis, selfie and face match**/
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera.autofocus"   android:required="false" />

A fintech Android app can't access the following permission

  • Read_external_storage
  • Read_media_images
  • Read_contacts
  • Access_fine_location
  • Read_phone_numbers
  • Read_media_videos

IOS Permission

Permissions need to add in your info.plist

  /**  Camera permission incase of selfie/video KYC/ capture document  **/
  <key>NSCameraUsageDescription</key>
  <string>$(PRODUCT_NAME) would like to access your camera.</string>
  <key>NSPhotoLibraryUsageDescription</key>
  <string>$(PRODUCT_NAME) would like to access your photo.</string>
  /**  Microphone permission incase of video KYC  **/
  <key>NSMicrophoneUsageDescription</key>
  <string>$(PRODUCT_NAME) would like to access your microphone to capture video.</string>
  /** Location permission for geo tagging for camera/video kyc/ selfie **/
  <key>NSLocationWhenInUseUsageDescription</key>
  <string>$(PRODUCT_NAME) would like to access your location.</string>
  <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
  <string>$(PRODUCT_NAME) would like to access your location.</string>

Note : All permissions should be checked and taken before triggering Digio SDK

1.0.1-3.1

5 days ago

1.0.14

5 days ago

1.0.1-4.1

5 days ago

1.0.13

16 days ago

1.0.12

4 months ago

1.0.10

4 months ago

1.0.9

4 months ago

1.0.8

4 months ago

1.0.7

4 months ago

1.0.6-beta1

4 months ago

1.0.6-beta2

4 months ago

1.0.5

5 months ago

1.0.4

5 months ago

1.0.3

5 months ago

1.0.2

7 months ago

1.0.0

7 months ago