react-native-meon-rekyc

Re-KYC SDK for React Native. It logs in with company credentials, generates a deeplink, and opens the Re-KYC journey inside a WebView.

Installation

npm install react-native-meon-rekyc react-native-webview react-native-permissions

iOS

Required: Add setup_permissions in ios/Podfile (without this, IPV/camera will crash):

def node_require(script)
  require Pod::Executable.execute_command('node', ['-p',
    "require.resolve('#{script}', {paths: [process.argv[1]]})", __dir__]).strip
end

node_require('react-native/scripts/react_native_pods.rb')
node_require('react-native-permissions/scripts/setup.rb')

platform :ios, min_ios_version_supported
prepare_react_native_project!

setup_permissions([
  'Camera',
  'Microphone',
  'LocationWhenInUse',
])

Then:

cd ios && pod install

Add permissions in Info.plist:

<key>NSCameraUsageDescription</key>
<string>Camera permission is required for Re-KYC verification</string>
<key>NSMicrophoneUsageDescription</key>
<string>Microphone permission is required for Re-KYC verification</string>
<key>NSLocationWhenInUseUsageDescription</key>
<string>Location permission is required for Re-KYC verification</string>

Android

Add permissions in AndroidManifest.xml:

<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.RECORD_AUDIO" />
<uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" />
<uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
<uses-permission android:name="android.permission.INTERNET" />

Usage

import React from 'react';
import { View } from 'react-native';
import MeonReKYC from 'react-native-meon-rekyc';

const ReKycScreen = () => {
  return (
    <View style={{ flex: 1 }}>
      <MeonReKYC
        username="" //[email protected]
        password="" //123456
        company_id="" //1
        workflow_id="7cd3b329-7b79-46c4-b4f3"
        client_code="" //meon
        baseURL="https://rekyc.meon.co.in"
        onSuccess={(data) => console.log('Re-KYC ready:', data)}
        onError={(error) => console.log('Re-KYC error:', error)}
        onClose={() => console.log('Re-KYC closed')}
      />
    </View>
  );
};

export default ReKycScreen;

API Flow

1. POST /v1/company/company-login with username, password, company_id
2. GET /v1/company/get_deep_link/{workflow_id}/{client_code} with Authorization: Bearer <access_token>
3. Open data.deeplink in WebView

Props

| Prop | Type | Required | Default | Description | |------|------|----------|---------|-------------| | username | string | Yes | - | Company login username | | password | string | Yes | - | Company login password | | company_id | string | Yes | - | Company ID | | workflow_id | string | Yes | - | Workflow ID | | client_code | string | Yes | - | Client code | | baseURL | string | No | https://rekyc.meon.co.in | Re-KYC API base URL | | onSuccess | function | No | - | Called when deeplink is ready | | onError | function | No | - | Called on API or WebView error | | onClose | function | No | - | Called when user closes | | showHeader | boolean | No | true | Show header bar | | headerTitle | string | No | Re-KYC | Header title | | autoRequestPermissions | boolean | No | true | Request camera/mic/location | | showRefreshButton | boolean | No | false | Header refresh (reload WebView) | | userAgent | string | No | Safari (iOS) / Chrome (Android) | WebView user agent (fixes date picker on iOS) | | enableWebViewDebug | boolean | No | __DEV__ | Bridge console/errors to Metro via onWebMessage | | onWebMessage | function | No | - | Receives { bridge, message, level, ... } from WebView | | customStyles | object | No | {} | Style overrides |

Exported Helpers

import { companyLogin, getDeepLink, initializeReKycSession } from 'react-native-meon-rekyc';

License

MIT