Skip to main content

iOS KYC component

KYC due diligence is one of the steps required to onboard consumers onto your app. We provide a KYC component that you can embed in your app. This lets you provide a seamless experience to your user while capturing the required documentation to verify their identity.

Start KYC​

Once setup is done you are ready to present the SDK on the screen. See this code example for a quick start.

Customizing the look and feel of the KYC component​

The look and feel of the KYC flow can be customised by passing a BrandingConfig as a parameter to the startKyc method. This struct can be constructed like so:

static let branding = BrandingConfig(
    textColor: /* Your color here */,
    confirmButtonColor: /* Your color here */,
    declineButtonColor: /* Your color here */,
    confirmTextColor: /* Your color here */,
    declineTextColor: /* Your color here */,
    disabledConfirmButtonColor: /* Your color here */,
    font: /* Your font here */,
    backgroundColor: /* Your color here */,
    separatorColor: /* Your color here */
)

Based on the colors and fonts provided, the SDK styles the pages in the KYC flow.

Font matching algorithm​

In order to better highlight content, the SDK automatically adapts the font you pass to different weights.

To achieve this, the SDK attempts two different approaches before falling back to using the base font:

  1. Using a font descriptor with a specific font weight. This works with fonts that are built into the OS. For example, the following snippet changes a font to bold.
let resultingFont = UIFont(descriptor: fontDescriptor.addingAttributes([
    .traits: [
        UIFontDescriptor.TraitKey.weight: UIFont.Weight.bold
    ]
]), size: pointSize)
  1. Using the font weight and font family to load a new font. For instance, if you provide Arial, the SDK attempts to use its bold counterpart, and attempts to load the fonts Arial-Bold and ArialRoman-Bold, using the font that successfully loads, or falling back to Arial if no match is found.

Example: Add KYC listeners​

UXComponents.kyc.startKyc(
    viewController: presentingViewController,
    kycData: KYCFlowData(
        reference: reference,
        locale: locale,
        brandingConfig: brandingConfig
    ),
    tokenExpirationHandler: { tokenRefreshCallback in
        // This handler is called if the session token has expired. You should attempt
        // to refresh the token, and inject it again in the `tokenRefreshCallback`.
        // If you can't refresh it, you can pass `nil` to tell the SDK the session ended.
        let newToken = try? await refreshToken()
        tokenRefreshCallback(newToken)
    },
    eventCallback: { event in
        switch event {
        case .applicantLoaded(applicantId: let applicantId, actionId: let actionId):
            print("Applicant loaded with Id \(applicantId) and action Id \(String(describing: actionId))")

        case .stepInitiated(idDocSetType: let idDocSetType):
            print("Step with id doc set type \(idDocSetType)")

        case .stepCompleted(idDocSetType: let idDocSetType):
            print("Step with id doc set type \(idDocSetType)")

        case .stepCancelled(idDocSetType: let idDocSetType):
            print("Step with id doc set type \(idDocSetType)")

        case .verificationCompleted(isApproved: let isApproved):
            print("Applicant is " + (isApproved ? "Approved" : "Rejected"))

        case .didChangeStatus(status: let status):
            print("Changed to status \(status)")

        case .didDismissUI:
            print("Dismissed the UI")

        case .kycError(message: let message, cause: let cause):
            print("\(message) - \(cause)")

        case .kycInputNotRequired:
            print("KYC is not in \"initiated\" state")

        @unknown default:
            print("Unknown event happened \(event)")
    }
)