KyvShield SDK

<!-- Include SDK -->
<script src="https://kyvshield-naruto.innolinkcloud.com/static/sdk/kyvshield.min.js"></script>

<script>
// ── Possible values ───────────────────────────────────────────────────
// steps       : 'selfie', 'recto', 'verso'
// challengeMode: 'minimal', 'standard', 'strict'
// selfieDisplayMode / documentDisplayMode: 'standard', 'compact', 'immersive', 'neonHud'
// themeMode   : 'light', 'dark'

// ── Fetch documents from API ──────────────────────────────────────────
const res = await fetch('https://kyvshield-naruto.innolinkcloud.com/api/v1/documents', {
  headers: { 'X-API-Key': 'YOUR_API_KEY' },
});
const { documents } = await res.json();
const selectedDoc = documents[0]; // or let user pick

// ── Start KYC ─────────────────────────────────────────────────────────
const result = await KyvShield.initKyc(
  {
    baseUrl: 'https://kyvshield-naruto.innolinkcloud.com',
    apiKey: 'YOUR_API_KEY',
    enableLog: true,
    theme: { primaryColor: '#EF8352', themeMode: 'light' },
  },
  {
    steps: ['selfie', 'recto', 'verso'],
    language: 'fr',
    showIntroPage: true,
    showInstructionPages: true,
    showResultPage: true,
    showSuccessPerStep: true,
    selfieDisplayMode: 'standard',
    documentDisplayMode: 'standard',
    challengeMode: 'minimal',
    requireFaceMatch: true,
    playChallengeAudio: true,
    maxChallengeAudioPlay: 1,
    pauseBetweenAudioPlay: 1000,
    target: selectedDoc,
    kycIdentifier: 'user-12345',
  }
);

// ── Handle result ─────────────────────────────────────────────────────
console.log('Success:', result.success);
console.log('Status:', result.overallStatus);   // pass, reject, error
console.log('Session:', result.sessionId);

// Selfie
if (result.selfieResult) {
  console.log('Live:', result.selfieResult.isLive);
  console.log('Image:', result.selfieResult.capturedImage?.length, 'bytes');
}

// Recto
if (result.rectoResult) {
  console.log('Score:', result.rectoResult.score);
  console.log('Fields:', result.rectoResult.extraction?.fields?.length);
  if (result.rectoResult.faceVerification) {
    console.log('Face match:', result.rectoResult.faceVerification.isMatch);
    console.log('Similarity:', result.rectoResult.faceVerification.similarityScore);
  }
}

// Extracted data
console.log('Nom:', result.getExtractedValue?.('nom'));
console.log('NIN:', result.getExtractedValue?.('nin'));
</script>

import sn.innolink.kyvshield.lite.KyvshieldLite
import sn.innolink.kyvshield.lite.KyvshieldInput
import sn.innolink.kyvshield.lite.config.*
import sn.innolink.kyvshield.lite.result.*

// ── Possible values ───────────────────────────────────────────────────
// CaptureStep        : selfie, recto, verso
// ChallengeMode      : minimal, standard, strict
// SelfieDisplayMode  : standard, compact, immersive, neonHud
// DocumentDisplayMode: standard, compact, immersive, neonHud
// ChallengeAudioRepeat: once, twice, thrice

// ── Fetch documents from API ──────────────────────────────────────────
// GET https://kyvshield-naruto.innolinkcloud.com/api/v1/documents
// Header: X-API-Key: YOUR_API_KEY
// Parse response -> List<KyvshieldDocument> via KyvshieldDocument.fromJson()

// ── With Jetpack Compose (ActivityResultContract) ─────────────────────

val kycLauncher = rememberLauncherForActivityResult(
    KyvshieldLite.getResultContract()
) { result: KYCResult ->
    // Handle result
    println("Success: ${result.success}")
    println("Status: ${result.overallStatus}")
}

// Build config
val config = KyvshieldConfig(
    baseUrl = "https://kyvshield-naruto.innolinkcloud.com",
    apiKey = "YOUR_API_KEY",
    enableLog = true,
    theme = KyvshieldThemeConfig(
        primaryColor = 0xFFEF8352.toInt(),
        darkMode = false,
    ),
)

// Build flow
val flow = KyvshieldFlowConfig(
    steps = listOf(CaptureStep.selfie, CaptureStep.recto, CaptureStep.verso),
    language = "fr",
    showIntroPage = true,
    showInstructionPages = true,
    showResultPage = true,
    showSuccessPerStep = true,
    selfieDisplayMode = SelfieDisplayMode.standard,
    documentDisplayMode = DocumentDisplayMode.standard,
    challengeMode = ChallengeMode.minimal,
    requireFaceMatch = true,
    playChallengeAudio = true,
    maxChallengeAudioPlay = ChallengeAudioRepeat.once,
    pauseBetweenAudioPlayMs = 1000L,
    stepChallengeModes = mapOf(
        CaptureStep.selfie to ChallengeMode.minimal,
        CaptureStep.recto to ChallengeMode.standard,
        CaptureStep.verso to ChallengeMode.minimal,
    ),
    target = selectedDoc,
    kycIdentifier = "user-12345",
)

// Launch KYC
kycLauncher.launch(KyvshieldInput(config, flow))

// ── Handle result ─────────────────────────────────────────────────────

println("Success: ${result.success}")
println("Status: ${result.overallStatus}")   // pass, reject, error
println("Session: ${result.sessionId}")

// Selfie
result.selfieResult?.let {
    println("Live: ${it.isLive}")
    println("Image: ${it.capturedImage?.size ?: 0} bytes")
}

// Recto
result.rectoResult?.let {
    println("Recto score: ${it.score}")
    println("Aligned doc: ${it.alignedDocument?.size ?: 0} bytes")
    println("Photos: ${it.extractedPhotos.size}")
    println("Fields: ${it.extraction?.fields?.size ?: 0}")
    it.faceVerification?.let { fv ->
        println("Face match: ${fv.isMatch}")
        println("Similarity: ${fv.similarityScore}")
    }
}

// Verso
result.versoResult?.let {
    println("Verso score: ${it.score}")
    println("Fields: ${it.extraction?.fields?.size ?: 0}")
}

// Extracted data (searches recto + verso)
println("Nom: ${result.getExtractedValue("nom")}")
println("NIN: ${result.getExtractedValue("nin")}")

// Loop all fields sorted by priority
result.rectoResult?.extraction?.sortedFields?.forEach { field ->
    println("${field.label}: ${field.stringValue}")
}

import KyvshieldLite

// ── Possible values ───────────────────────────────────────────────────
// CaptureStep        : .selfie, .recto, .verso
// ChallengeMode      : .minimal, .standard, .strict
// SelfieDisplayMode  : .standard, .compact, .immersive, .neonHud
// DocumentDisplayMode: .standard, .compact, .immersive, .neonHud
// ChallengeAudioRepeat: .once, .twice, .thrice

// ── Fetch documents from API ──────────────────────────────────────────

let url = URL(string: "https://kyvshield-naruto.innolinkcloud.com/api/v1/documents")!
var request = URLRequest(url: url)
request.setValue("YOUR_API_KEY", forHTTPHeaderField: "X-API-Key")
let (data, _) = try await URLSession.shared.data(for: request)
let json = try JSONSerialization.jsonObject(with: data) as! [String: Any]
let docsJson = json["documents"] as! [[String: Any]]
let docs = docsJson.map { KyvshieldDocument.fromJson($0) }
let selectedDoc = docs.first!

// ── Request camera permission ─────────────────────────────────────────

KyvshieldLite.requestCameraPermission { granted in
    guard granted else {
        if KyvshieldLite.isCameraPermissionDenied() {
            KyvshieldLite.openSettings()
        }
        return
    }
    startKyc(doc: selectedDoc)
}

// ── Start KYC (UIKit) ─────────────────────────────────────────────────

func startKyc(doc: KyvshieldDocument) {
    let config = KyvshieldConfig(
        baseUrl: "https://kyvshield-naruto.innolinkcloud.com",
        apiKey: "YOUR_API_KEY",
        enableLog: true,
        theme: KyvshieldThemeConfig(
            primaryColor: UIColor(hex: "#EF8352"),
            brightness: .light
        )
    )

    let flow = KyvshieldFlowConfig(
        steps: [.selfie, .recto, .verso],
        target: doc,
        kycIdentifier: "user-12345",
        challengeMode: .minimal,
        stepChallengeModes: [
            .selfie: .minimal,
            .recto: .standard,
            .verso: .minimal,
        ],
        selfieDisplayMode: .standard,
        documentDisplayMode: .standard,
        requireFaceMatch: true,
        showIntroPage: true,
        showInstructionPages: true,
        showResultPage: true,
        showSuccessPerStep: true,
        language: "fr",
        playChallengeAudio: true,
        maxChallengeAudioPlay: .once,
        pauseBetweenAudioPlayMs: 1000
    )

    KyvshieldLite.initKyc(from: self, config: config, flow: flow) { result in
        self.handleResult(result)
    }
}

// ── SwiftUI alternative ───────────────────────────────────────────────

// .fullScreenCover(isPresented: $showKyc) {
//     KyvshieldView(config: config, flow: flow) { result in
//         showKyc = false
//         handleResult(result)
//     }
// }

// ── Handle result ─────────────────────────────────────────────────────

func handleResult(_ result: KYCResult) {
    print("Success: \(result.success)")
    print("Status: \(result.overallStatus)")   // .pass, .reject, .error
    print("Session: \(result.sessionId ?? "")")

    // Selfie
    if let selfie = result.selfieResult {
        print("Live: \(selfie.isLive)")
        print("Image: \(selfie.capturedImage?.count ?? 0) bytes")
    }

    // Recto
    if let recto = result.rectoResult {
        print("Recto score: \(recto.score)")
        print("Aligned doc: \(recto.alignedDocument?.count ?? 0) bytes")
        print("Photos: \(recto.extractedPhotos.count)")
        print("Fields: \(recto.extraction?.fields.count ?? 0)")
        if let fv = recto.faceVerification {
            print("Face match: \(fv.isMatch)")
            print("Similarity: \(fv.similarityScore)")
        }
    }

    // Verso
    if let verso = result.versoResult {
        print("Verso score: \(verso.score)")
        print("Fields: \(verso.extraction?.fields.count ?? 0)")
    }

    // Extracted data (searches recto + verso)
    print("Nom: \(result.getExtractedValue("nom") ?? "")")
    print("NIN: \(result.getExtractedValue("nin") ?? "")")

    // Loop all fields sorted by priority
    for field in result.rectoResult?.extraction?.sortedFields ?? [] {
        print("\(field.label): \(field.stringValue ?? "")")
    }
}

import React, { useState } from 'react';
import { Button, View, Alert } from 'react-native';
import {
  KyvshieldModal,
  FlowPresets,
  requestCameraPermission,
  isCameraPermissionDenied,
  openSettings,
  kycResultGetExtractedValue,
} from '@kyvshield/react-native';
import type {
  KyvshieldConfig,
  KyvshieldFlowConfig,
  KyvshieldDocument,
  CaptureStep,
  ChallengeMode,
  SelfieDisplayMode,
  DocumentDisplayMode,
  KYCResult,
} from '@kyvshield/react-native';

// ── Possible values ───────────────────────────────────────────────────
// CaptureStep        : 'selfie', 'recto', 'verso'
// ChallengeMode      : 'minimal', 'standard', 'strict'
// SelfieDisplayMode  : 'standard', 'compact', 'immersive', 'neonHud'
// DocumentDisplayMode: 'standard', 'compact', 'immersive', 'neonHud'
// ChallengeAudioRepeat: 'once', 'twice', 'thrice'

// ── Fetch documents from API ──────────────────────────────────────────

async function fetchDocuments(): Promise<KyvshieldDocument[]> {
  const res = await fetch(
    'https://kyvshield-naruto.innolinkcloud.com/api/v1/documents',
    { headers: { 'X-API-Key': 'YOUR_API_KEY' } },
  );
  const { documents } = await res.json();
  return documents;
}

// ── Config ────────────────────────────────────────────────────────────

const config: KyvshieldConfig = {
  baseUrl: 'https://kyvshield-naruto.innolinkcloud.com',
  apiKey: 'YOUR_API_KEY',
  enableLog: true,
  theme: {
    primaryColor: '#EF8352',
    darkMode: false,
  },
};

// ── Flow ──────────────────────────────────────────────────────────────

const flow: KyvshieldFlowConfig = {
  steps: ['selfie', 'recto', 'verso'] as CaptureStep[],
  language: 'fr',
  showIntroPage: true,
  showInstructionPages: true,
  showResultPage: true,
  showSuccessPerStep: true,
  selfieDisplayMode: 'standard' as SelfieDisplayMode,
  documentDisplayMode: 'standard' as DocumentDisplayMode,
  challengeMode: 'minimal' as ChallengeMode,
  requireFaceMatch: true,
  playChallengeAudio: true,
  maxChallengeAudioPlay: 'once',
  pauseBetweenAudioPlayMs: 1000,
  target: selectedDoc,
  kycIdentifier: 'user-12345',
};

// ── Component ─────────────────────────────────────────────────────────

export default function App() {
  const [visible, setVisible] = useState(false);

  const startKyc = async () => {
    const granted = await requestCameraPermission();
    if (!granted) {
      const denied = await isCameraPermissionDenied();
      if (denied) openSettings();
      return;
    }
    setVisible(true);
  };

  const handleResult = (result: KYCResult) => {
    setVisible(false);

    console.log('Success:', result.success);
    console.log('Status:', result.overallStatus); // pass, reject, error
    console.log('Session:', result.sessionId);

    // Selfie
    if (result.selfieResult) {
      console.log('Live:', result.selfieResult.isLive);
      console.log('Image:', result.selfieResult.capturedImageBase64?.length, 'chars');
    }

    // Recto
    if (result.rectoResult) {
      console.log('Score:', result.rectoResult.score);
      console.log('Fields:', result.rectoResult.extraction?.fields?.length);
      if (result.rectoResult.faceVerification) {
        console.log('Face match:', result.rectoResult.faceVerification.isMatch);
        console.log('Similarity:', result.rectoResult.faceVerification.similarityScore);
      }
    }

    // Extracted data
    console.log('Nom:', kycResultGetExtractedValue(result, 'nom'));
    console.log('NIN:', kycResultGetExtractedValue(result, 'nin'));
  };

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Button title="Start KYC" onPress={startKyc} />
      <KyvshieldModal
        visible={visible}
        config={config}
        flow={flow}
        onResult={handleResult}
        onDismiss={() => setVisible(false)}
      />
    </View>
  );
}