Angular

Angular UI Package for KYC

Installation

You can install the @faceki/angular-kyc-sdk package using npm or yarn:

npm install @faceki/angular-kyc-sdk
# or
yarn add @faceki/angular-kyc-sdk

Getting Started

Import the Module

Import the FacekiKycModule into your Angular application module:

import { FacekiKycModule } from '@faceki/angular-kyc-sdk';

@NgModule({
  imports: [FacekiKycModule],
  // ...
})
export class YourAppModule { }

Set Configuration

Provide your KYC service configuration in your Angular app, typically in the providers array of your module. For example:

import { FacekiKycService } from '@faceki/angular-kyc-sdk';

@NgModule({
  // ...
  providers: [
    {
      provide: FacekiKycService,
      useValue: {
        clientId: 'your-client-id',
        clientSecret: 'your-client-secret'
      },
    },
  ],
})
export class YourAppModule { }

Add Bootstrap in index.html

  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">

Link Assets

Add this to your angular.json inside projects -> architect -> build -> assets

   {
     "glob": "**/*",
     "input": "node_modules/@faceki/angular-kyc-sdk/assets",
     "output": "assets/"
   }

Use the Component

In your Angular component template, use the <lib-faceki-kyc></lib-faceki-kyc> custom element to integrate KYC functionality into your application:

<lib-faceki-kyc></lib-faceki-kyc>

Handle KYC Responses & Text Controls

Implement success and failure callbacks to handle KYC responses within your component, as demonstrated in the provided code examples:

// Your component class
import { FacekiKycService,MultiDocumentKYCResponseClass, SingleDocumentKYCResponseClass } from '@faceki/angular-kyc-sdk';

@Component({
  // ...
})
export class YourComponent {
  constructor(private facekiConfig: FacekiKycService) {
    this.facekiConfig.onSuccess = this.onSuccessCallback;
    this.facekiConfig.onFail = this.onFailCallback;
    this.facekiConfig.failureText = "Verification Failed";
    this.facekiConfig.successText = "Verification Successful";
    this.facekiConfig.loadingText = "Verification In Progress";
  }

  onSuccessCallback(response:SingleDocumentKYCResponseClass | MultiDocumentKYCResponseClass) {

    if (response instanceof SingleDocumentKYCResponseClass) {
      console.log('SingleDocumentKYCResponse:');
    } else if (response instanceof MultiDocumentKYCResponseClass) {
      console.log('MultiDocumentKYCResponse:', response);
    } 
  }
  onFailCallback(response:SingleDocumentKYCResponseClass | MultiDocumentKYCResponseClass) {

    if (response instanceof SingleDocumentKYCResponseClass) {
      console.log('SingleDocumentKYCResponse:');
    } else if (response instanceof MultiDocumentKYCResponseClass) {
      console.log('MultiDocumentKYCResponse:', response);
    } 
  }
}