@unbraided/kenal-ekyc-sdk

@unbraided/kenal-ekyc-sdk

A React Native SDK for integrating Kenal's eKYC solution in your applications.

Installation

npm install @unbraided/kenal-ekyc-sdk

Ensure you have the required peer dependencies:

npm install react-native-webview

For TypeScript users, install type definitions:

npm install --save-dev @types/react @types/react-native

Usage

Initializing the SDK

import { KenalClient } from "@unbraided/kenal-ekyc-sdk";

KenalClient.initialize({
  apiKey: "YOUR_API_KEY",
  environment: "sandbox", // or 'production'
});

MyKad Verification

import React, { useState } from "react";
import { View, Button, TextInput, StyleSheet } from "react-native";
import { MyKad, KenalWebView } from "@unbraided/kenal-ekyc-sdk";

const MyKadScreen = () => {
  const [name, setName] = useState("");
  const [idNumber, setIDNumber] = useState("");
  const [refID, setRefID] = useState("");
  const [useOCRForData, setUseOCRForData] = useState(false);
  const [verificationUrl, setVerificationUrl] = useState(null);

  const startVerification = async () => {
    try {
      const result = await MyKad.start({
        name: name,
        idNumber: idNumber,
        useOCRForData: useOCRForData,
        refId: refID,
      });

      setVerificationUrl(result.fullURL);
    } catch (error) {
      console.error("Verification error:", error);
      alert(`Failed to start verification: ${error.message}`);
    }
  };

  const handleComplete = (data) => {
    console.log("Verification completed:", data);
  };

  if (verificationUrl) {
    return (
      <KenalWebView
        url={verificationUrl}
        onComplete={handleComplete}
        onError={(error) => console.error("WebView error:", error)}
      />
    );
  }

  return (
    <View style={styles.container}>
      <TextInput style={styles.input} placeholder="Enter your name" value={name} onChangeText={setName} />
      <TextInput style={styles.input} placeholder="Enter your ID number" value={idNumber} onChangeText={setIdNumber} />
      <TextInput style={styles.input} placeholder="Enter a reference ID" value={refID} onChangeText={setRefID} />
      <Button title="Start Verification" onPress={startVerification} />
    </View>
  );
};

const styles = StyleSheet.create({
  container: {
    flex: 1,
    padding: 20,
    justifyContent: "center",
  },
  input: {
    height: 40,
    borderWidth: 1,
    borderColor: "#ccc",
    borderRadius: 5,
    marginBottom: 10,
    paddingHorizontal: 10,
  },
});

export default MyKadScreen;

API Reference

KenalClient

Initializes the SDK with your API key and environment settings.

KenalClient.initialize({
  apiKey: string, // Your Kenal API key
  environment: "sandbox" | "production",
});

MyKad

Static service for MyKad verification.

MyKad.start({
  name: string;
  idNumber: string;
  refId?: string;
  useOCRForData?: boolean;
}): Promise<{ fullURL: string }>;