Incode Cordova SDK reference

Incode Welcome

Incode Onboarding Cordova Plugin

Incode Onboarding provides effortless onboarding where security matters.
It is a part of Incode Omnichannel Biometric Identity Platform, that is powered by Incode's world class Face Recognition, Liveness detection and ID Validation models. Organizations can choose to have an optional video conference to additionally verify the customer’s identity.

In this repo you can find an example onboarding app that uses Incode Onboarding Cordova Plugin to enable remote account opening.

Supported Android Version

API 21+ & CompileSDK version 35.

Supported iOS Version

iOS 13+

Installation

Install the Incode Onboarding Cordova Plugin in your app path using command:

cordova plugin add incode-cordova-plugin

OR

cordova plugin add https://github.com/Incode-Technologies-Example-Repos/CordovaPluginReleases.git

OR for nfc version of the plugin

cordova plugin add "https://github.com/Incode-Technologies-Example-Repos/CordovaPluginReleases.git#release/[VERSION]-nfc"

As our SDK needs camera to capture ID and face, use command:

 cordova plugin add cordova-plugin-camera

Same applies for GeoLocation if its required, use command:

cordova plugin add cordova-plugin-geolocation

Additional Steps for Android

For Cordova

Cordova sample app needs to provide a source from where to fetch Android SDK dependency from. Suggested method would be to add a hook within the config.xml file that will be triggered after platform is added:

</platform>
    <hook type="after_platform_add" src="hooks/after_platform_add/add-incode-maven-repo.js" />
</widget>

add-incode-maven-repo.js content that can be reused:

#!/usr/bin/env node

const fs = require('fs');
const path = require('path');

const repoBlock = `maven {
    url = uri("https://maven.pkg.github.com/Incode-Technologies-Example-Repos/android-omni-packages")
     credentials {
        username = project.findProperty("github_username") ?: System.getenv("GITHUB_USERNAME")
        password = project.findProperty("github_token") ?: System.getenv("GITHUB_TOKEN")
    }
}`;

function removeIncodeMavenBlocks(block) {
    let idx = 0;
    while (true) {
        const mavenIndex = block.indexOf('maven {', idx);
        if (mavenIndex === -1) break;
        // Only consider blocks containing the Incode repo URL
        const urlIdx = block.indexOf('repo.incode.com/artifactory/libs-incode-welcome', mavenIndex);
        if (urlIdx === -1) {
            idx = mavenIndex + 7;
            continue;
        }
        // Find the matching closing brace for maven { ... }
        let braceCount = 0;
        let endIdx = mavenIndex;
        let found = false;
        for (; endIdx < block.length; endIdx++) {
            if (block[endIdx] === '{') braceCount++;
            else if (block[endIdx] === '}') braceCount--;
            if (braceCount === 0 && endIdx > mavenIndex) {
                found = true;
                break;
            }
        }
        if (found) {
            block = block.slice(0, mavenIndex) + block.slice(endIdx + 1);
            idx = mavenIndex; // Continue searching after removed block
        } else {
            break; // Malformed, stop
        }
    }
    return block;
}

function insertRepoFirst(block) {
    block = removeIncodeMavenBlocks(block);
    return block.replace(/repositories\s*\{/, match => `${match}\n${repoBlock}\n`);
}

function patchGradle(context) {
    const projectRoot = context.opts && context.opts.projectRoot ? context.opts.projectRoot : process.cwd();
    const appGradlePath = path.join(projectRoot, 'platforms/android/app/build.gradle');
    if (!fs.existsSync(appGradlePath)) {
        console.log('app/build.gradle not found:', appGradlePath);
        return;
    }
    let appGradle = fs.readFileSync(appGradlePath, 'utf8');

    // Patch buildscript
    appGradle = appGradle.replace(/(buildscript\s*\{[\s\S]*?)(\n\s*dependencies\s*\{)/, (match, p1, p2) => {
        let beforeDeps = p1;
        if (/repositories\s*\{/.test(beforeDeps)) {
            beforeDeps = insertRepoFirst(beforeDeps);
        } else {
            beforeDeps = beforeDeps.replace(/buildscript\s*\{/, m => `${m}\n    repositories {\n${repoBlock}\n    }\n`);
        }
        return beforeDeps + p2;
    });

    // Patch allprojects
    appGradle = appGradle.replace(/(allprojects\s*\{[\s\S]*?)(\n\s*task |\n\s*ext |\n\s*android |\n\s*\/\*|$)/, (match, p1, p2) => {
        let beforeNext = p1;
        if (/repositories\s*\{/.test(beforeNext)) {
            beforeNext = insertRepoFirst(beforeNext);
        } else {
            beforeNext = beforeNext.replace(/allprojects\s*\{/, m => `${m}\n    repositories {\n${repoBlock}\n    }\n`);
        }
        return beforeNext + p2;
    });

    fs.writeFileSync(appGradlePath, appGradle, 'utf8');
}

// Cordova will call as a function during the build, but allow running directly for manual testing
module.exports = patchGradle;
if (require.main === module) {
    patchGradle({ opts: { projectRoot: process.cwd() } });
}

For Capacitor/Ionic

Modify your project's build.gradle so it contains refrence to github repository package using GITHUB_USERNAME and GITHUB_TOKEN, provided by Incode.

allprojects {
  repositories {
    ...
+    maven {
+    url "https://maven.pkg.github.com/Incode-Technologies-Example-Repos/android-omni-packages"
+      credentials {
+        username = "GITHUB_USERNAME"
+        password = "GITHUB_TOKEN"
+      }
+    }
    ...
  }
}

Additional Steps for iOS

For Cordova

Run pod install under ios folder

For Capacitor/Ionic

  1. Copy below lines into the pod file:

    source 'https://github.com/CocoaPods/Specs.git'
    source '[email protected]:Incode-Technologies-Example-Repos/IncdDistributionPodspecs.git'
  2. Run pod install or pod install --repo-update under ios/app folder.

  3. Run npx cap sync

Documentation

Following functions can be used to initialize the plugin with different modules as per your business requirement.

Initialize SDK

Below function will initialize Incode SDK which is required at least once in the app lifecycle.

cordova.exec(
    function(param) {
        console.log("Success: "+param);
        // start the incode session here
    },
    function(err) {
        console.log("Error: "+ err);
        // handle the error by showing some UI or alert.
    }, 
    "Cplugin", 
    "initializeSDK", 
    [apiKey,apiUrl,loggingEnabled,testMode,isExternalTokenEnabled,disableJailbreakDetection,clientExperimentId,e2eeUrl]
); 

Above function takes the following parameters:

  • apiKey (string): API key, provided by Incode.
  • apiUrl (string): API URL, provided by Incode.
  • loggingEnabled (string): Set to true to enable logging, false to disable. Default true.
  • testMode (string): Set to true if running on simulator/emulators, false when running on devices. Default false.
  • isExternalTokenEnabled (string): Set to true if using external token authentication, false otherwise. Default false.
  • disableJailbreakDetection (string): Set to true to disable jailbreak detection. Valid only for iOS. Default false.
  • clientExperimentId (string): Optional client experiment ID used to enroll customer to experimental features like ID V2. Pass null or empty string if not used.
  • e2eeUrl (string): E2EE API URL, provided by Incode. A URL for end-to-end encryption. Supply null if not using end-to-end encryption. Default null.

Set Common Configuration

Below function will set a common runtime configuration used by both iOS and Android. It should be called after initializeSDK but before anything else.

cordova.exec(
    function(param) {
        console.log("Success: "+param);
        // common config is set
    },
    function(err) {
        console.log("Error: "+ err);
        // handle the error
    },
    "Cplugin",
    "setCommonConfig",
    [setShowCloseButton]
); 

It takes the following optional parameter

  • setShowCloseButton (string): Set to true to show a close button. Defaults to false.

Start onboarding

Create a new session based on the specified list of modules.

let sessionConfig = {
  configurationId: "your-workflow-id",
};
let flowConfig = [
  { module: "addPhone" },
  { module: "addId", showIdTypeChooser: "true", showTutorials: "true" },
  { module: "addDocumentScan", documentType: "ADDRESS_STATEMENT" },
  { module: "addGeolocation" },
  { module: "addSelfieScan", showTutorials: "true" },
  { module: "addFaceMatch" },
  { module: "addSignature" },
  { module: "addVideoSelfie" }
];
let recordSessionConfig = {}; // Optional

cordova.exec(
  function (result) {
    console.log("Success startDefaultFlow: ", result);
  },
  function (error) {
    console.log("Error startDefaultFlow:", error);
  },
  "Cplugin",
  "startOnboarding",
  [sessionConfig, flowConfig, recordSessionConfig]
);

To change session parameters, specify them inside mandatory sessionConfig parameter:

  • region (string): Specify a region, currently supported are ALL(covers all regions), BR (optimized for Brazil) and IN (optimized for India)
  • queue (string): Specify a queue to which this onboarding session will be attached to
  • interviewId (string): In case you're creating an onboarding session on the backend, you can provide its interviewId and the flow will be started for that particular onboarding session
  • configurationId (string): In case you've created a flow on the dashboard with a specific configuration, you can provide it here so that those settings apply to this session
  • token (string): In case you're creating an onboarding session on the backend, you can provide its token and the flow will be started for that particular onboarding session
  • externalId (string): ID used outside of Incode Omni
  • externalCustomerId(string): This identifier links the onboarding session to an entity in an external system not part of the Incode Omni Platform. It could represent a prospect Id or a customer Id from the client's database, providing a bridge between the Incode session and the client's internal user management systems.
  • validationModules (json array): List of validation modules that should be enabled in this session
  • customFields (json object): Custom data that should be attached to this onboarding session
  • e2eEncryptionEnabled (boolean): Enable e2e encryption.
  • mergeSessionRecordings (boolean): Indicates whether the session recordings will be compiled into a single video. If set to true, the recordings from the ID capture and Face capture will be merged.

To configure the modules used in this session, specify them in the mandatory flowConfig parameter.

To enable screen recording of ID and Selfie capture, specify optional recordSessionConfig parameter:

  • Set recordSession to true
  • Set forcePermissions to true if you wish to abort the session in case user denies permissions, false otherwise

Start the session

Below function will start the fresh session when nothing is passed in interviewId. Or else reopens the exisiting session. It returns interviewId and token on success callback.

var sessionConfig = {
  configurationId: "your-flow-id",   // optional
  externalId: "your-external-id",    // optional
  interviewId: "existing-interview", // optional
  token: "your-external-token",      // optional
  e2eEncryptionEnabled: true,         // optional
  region: "ALL",                      // optional
  queue: "your-queue",               // optional
  validationModules: ["module1"],     // optional
  customFields: { key: "value" },     // optional
  externalCustomerId: "customer-id", // optional
  mergeSessionRecordings: false       // optional
};

cordova.exec(
  function(data) {
    console.log("Success setupOnboardingSession: " + data.interviewId + " Token:" + data.token);
    // Start the Incode moudles or sections from here
  },
  function(err) {
    console.log("Error setupOnboardingSession: " + err);
    // handle the error by showing some UI or alert.
  }, 
  "Cplugin",
  "setupOnboardingSession",
  [sessionConfig]
);

Above function takes a sessionConfig object with the following optional properties:

  • configurationId (string): Flow id from the Incode dashboard. Applies backend settings as configured on the dashboard.
  • externalId (string): Custom id which client can pass based on their unique identifier of the user.
  • interviewId (string): Session id from the dashboard. Pass this to restart an existing session.
  • token (string): Session token generated by your backend after calling the omni/start API. configurationId can be omitted if this is passed.
  • e2eEncryptionEnabled (boolean): Set to true to enable end-to-end encryption for this session. E2EE must be initialized via e2eeUrl parameter in initializeSDK for this to work.
  • region (string): Region ISO code.
  • queue (string): Queue name.
  • validationModules (arrray of strings): Validation modules to use.
  • customFields (object): Custom key-value fields.
  • externalCustomerId (string): External customer identifier.
  • mergeSessionRecordings (boolean): Whether to merge session recordings.

To Set theme for iOS, use below fucntion. Make sure to call this function before startOnboardingSection.

cordova.exec(
  function(param) {

  },
  function(err) {
    console.log("Error in set Theme: "+ err);
  }, 
  "Cplugin", 
  "setTheme", 
  [jsonTheme]
);

Start section

To configure and start the flow for a section use startOnboardingSection function. Refer code below to start the section with default settings.

const flowConfig = [
    {module:"addPhone"},
    {module:"addGeolocation"},
    {module:"addUserConsent", title:"Title", content:"Content"},        
    {module:"addMachineLearningConsent", consentType:"US"},
    {
        module:"addId",
        idType: "passport",
        showIdTypeChooser: "false",
        showTutorials:"true",
        waitForTutorials:"false",
        idCategory:"FIRST",
        enableBackShownAsFrontCheck:"true",
        enableFrontShownAsBackCheck:"true"
    },
    {
        module:"addSelfieScan", 
        showTutorials:"true", 
        waitForTutorials:"false", 
        maskCheckEnabled:"true", 
        lensesCheckEnabled:"true"
    },
    {
        module: "addFaceAuthentication",
        showTutorials: "false",
        autoCaptureTimeout: "3",
        captureAttempts: "3",
        eyesClosedCheck: "true",
        headCoverCheck: "true",
        lensesCheck: "true",
        faceMaskCheck: "true"
    },  
    {module:"addFaceMatch", matchType:"idSelfie"},
    {
        module:"addNFC", 
        idType: "passport", 
        showNFCSymbolConfirmationScreen:"false", 
        showInitialDataConfirmationScreen:"false", 
        processNFCData:"false"
    },
    {module:"addEKYC"},
    {module:"addAntifraud"},
    {module:"addGovernmentValidation"},
    {module:"addDocumentScan", documentType:"ADDRESS_STATEMENT"},
    {module:"addSignature"}
];
const recordSessionConfig = {
  // Optional
  recordSession: "false",
  forcePermission: "false"
};
const sectionTag = "custom-section-tag-001";

cordova.exec(
  function(result) {
    console.log("Result: " + result);
    // handle the response here
  },
  function(error) {
    console.log("Error: " + error);
    // handle the error by showing some UI or alert.
  },
  "Cplugin",
  "startOnboardingSection",
  [flowConfig, recordSessionConfig, sectionTag]
);

You can start multiple sections, but only one at a time.

To enable screen recording of ID and Selfie capture, specify recordSessionConfig parameter:

  • Set recordSession to true.
  • Set forcePermissions, true if you wish to abort the session in case user denies permissons, false otherwise.

To uniquely identify section you want to start, specify sectionTag parameter.

Return values:

  • status: String. success or userCancelled.
  • sectionTag: String. value of sectionTag parameter passed in config.
  • Result data from modules run in this step.

Our Cordova plugin supports the following UI & Non UI modules:

  • addPhone
  • addEmail
  • addGeolocation
  • addId
  • addSelfieScan
  • addFaceMatch
  • addSignature
  • addGovernmentValidation
  • addDocumentScan
  • userScore
  • approve (Non UI)
  • getUserScore (Non UI)
  • faceMatch (Non UI)
  • startFaceLogin
  • finishOnboarding (Non UI)
  • addVideoSelfie
  • addEKYC
  • addAntifraud
  • addNFC
  • addFaceAuthentication
  • CURPValidation

To load individual modules one at a time refer to example below. For all the modules checkout our sample code.

let flowConfig = [
    {module:"addId"}
];
let recordSessionConfig = {
    // Optional
    recordSession: "false",
    forcePermission: "false"
};
let sectionTag = "custom-section-tag-001";

cordova.exec(
    function(result) {
        console.log("Section Success: " + result);
        // Start next section here.
    }, 
    function(error) {
        console.log("Error: " + error);
        // Handle the error by showing some UI or alert.
    },
    "Cplugin", 
    "startOnboardingSection", 
    [flowConfig, recordSessionConfig, sectionTag]
);

To fetch scores or results once onboarding modules are done.

cordova.exec(
    function(winParam) {
        myObj = JSON.stringify(winParam);
        console.log("Score: " + myObj);
    }, 
    function(err) {
        console.log("Error: " + err);
    }, 
    "Cplugin", 
    "getUserScore", 
    ["fast"]
);

Below code is mandatory to finish the session after all sections or modules are completed successfully. This should be called only once when all the sections are done.

cordova.exec(
    function(winParam) {
        console.log("finishOnboarding Success: " + winParam);
    },
    function(err) {
        console.log("Error: " + err);
        callbackError('Nothing to echo.' + err);
    }, 
    "Cplugin", 
    "finishOnboarding", 
    []
);

Make sure to delete local cache data once all the above steps are done.

cordova.exec(
    function(winParam) {
        console.log("deleteLocalUserData Success: " + winParam);
    }, 
    function(err) {
        console.log("Error: " + err);
    }, 
    "Cplugin", 
    "deleteUserLocalData", 
    []
);

Set UX configuration

To programmatically set UX configuration in runtime, call setUXConfig method.

let uxConfig = JSON.stringify({
    "showFooter": false
});

cordova.exec(
    function(result) {
    
    },
    function(error) {
    
    },
    "Cplugin",
    "setUXConfig",
    [uxConfig]
);

Start workflow

startWorkflow method starts the workflow defined on Incode's dashboard.

let sessionConfig = {
    configurationId: "your-workflow-id",
};

cordova.exec(
    function(result) {
        console.log("Success: " + result);
    },
    function(error) {
        console.log("Error: " + error);
    },
    "Cplugin",
    "startWorkflow",
    [sessionConfig]
); 

To choose the workflow to start and session options, specify parameters inside the required sessionConfig argument:

  • configurationId (string, required): The configuration ID of the workflow as defined in the dashboard.
  • region (string): Supported values are ALL (all regions), BR (Brazil), and IN (India).
  • queue (string): The queue to which this onboarding session will be attached.
  • interviewId (string): If you have created an onboarding session on the backend, provide its interviewId to start the flow for that session.
  • token (string): If you have created an onboarding session on the backend, provide its token to start the flow for that session.
  • externalId (string): An external identifier used outside of Incode Omni.
  • externalCustomerId (string): Links the onboarding session to an entity in an external system, such as a prospect or customer ID from your database.
  • e2eEncryptionEnabled (boolean): Set to true to enable end-to-end encryption for this workflow session. E2EE must be initialized via e2eeUrl parameter in initializeSDK for this to work.
  • customFields (object): Custom key-value data to attach to this onboarding session.

Start flow

startFlow method starts a new session based on a configurationId that you provide via sessionConfig, optionally starting from a specific module.

let sessionConfig = {
    configurationId: "your-flow-id",
};

cordova.exec(
    function(winParam) {
        console.log("Success: " + winParam);
    },
    function(err) {
        console.log("Error: " + err);
    }, 
    "Cplugin", 
    "startFlow", 
    [sessionConfig, moduleId]
); 

To choose the flow to start and session options, specify parameters inside the required sessionConfig argument:

  • configurationId (string, required): The configuration ID of the workflow as defined in the dashboard.
  • region (string): Supported values are ALL (all regions), BR (Brazil), and IN (India).
  • queue (string): The queue to which this onboarding session will be attached.
  • interviewId (string): If you have created an onboarding session on the backend, provide its interviewId to start the flow for that session.
  • token (string): If you have created an onboarding session on the backend, provide its token to start the flow for that session.
  • externalId (string): An external identifier used outside of Incode Omni.
  • externalCustomerId (string): Links the onboarding session to an entity in an external system, such as a prospect or customer ID from your database.
  • e2eEncryptionEnabled (boolean): Set to true to enable end-to-end encryption for this workflow session. E2EE must be initialized via e2eeUrl parameter in initializeSDK for this to work.
  • customFields (object): Custom key-value data to attach to this onboarding session.

You can also provide an optional second argument to specify the module name (e.g. 'EMAIL', 'PHONE', etc.) to start the flow from a specific module. If omitted, the flow starts from the first module in the configuration.

UI Customization

V2 Customization guide

Use setTheme method to provide a JSON for your custom theme that will be applied to both Android and iOS V2 UX:

cordova.exec(
    function(result) {
        console.log("deleteLocalUserData Success: " + result);
    }, 
    function(err) {
        console.log("Error: " + err);
    }, 
    "Cplugin",
    "setTheme",
    [v2jsonTheme]
);

Sample JSON:

{
  "displayMode": "light",
  "typography": {
    "family": {
      "text": {
        "android": {
          "regular": "onboard_sdk_dm_sans_regular",
          "bold": "onboard_sdk_dm_sans_bold",
          "medium": "onboard_sdk_dm_sans_medium"
        },
        "ios": {
          "regular": "DMSans-Regular",
          "bold": "DMSans-Bold",
          "medium": "DMSans-Medium"
        }
      },
      "display": {
        "android": {
          "regular": "onboard_sdk_dm_sans_regular",
          "bold": "onboard_sdk_dm_sans_bold",
          "medium": "onboard_sdk_dm_sans_medium"
        },
        "ios": {
          "extraBold": "DMSans-ExtraBold"
        }
      }
    },
    "letterSpacing": {
      "none": 0,
      "medium": -0.5,
      "large": -1.0,
      "extraLarge": -1.5
    }
  },
  "colorPalette": {
    "neutral": "#ffffff",
    "black": "#000000",
    "brand50": "#e5f0ff",
    "brand200": "#99c3ff",
    "brand300": "#66a6ff",
    "brand400": "#3388ff",
    "brand500": "#006aff",
    "brand600": "#0055cc",
    "brand900": "#21273b",
    "gray50": "#FCFCFD",
    "gray100": "#EBECEF",
    "gray200": "#C6C8D2",
    "gray300": "#A3A8B8",
    "gray500": "#60667C",
    "gray700": "#3A3E4B",
    "gray800": "#262831",
    "gray900": "#14151A",
    "brandSecondary50": "#F2E2FE",
    "brandSecondary500": "#820AD1",
    "negative50": "#FFF0F0",
    "negative500": "#FF5A5F",
    "negative600": "#E71111",
    "negative950": "#240001",
    "warning50": "#FFF7EB",
    "warning400": "#FFB647",
    "warning500": "#FF9900",
    "warning950": "#523100",
    "positive50": "#E4FBF0",
    "positive600": "#189F60",
    "positive800": "#0C5030"
  }
}

V1 Customization guide

Use setTheme method to provide a JSON for your custom theme that will be applied to iOS V1 UX:

Sample JSON:

Map<String, dynamic> theme = {
 "colors": {
  "accent": "#00B2FD",
  "primary": "#20263D",
  "background": "#FFFFFF",
  "secondaryBackground": "#E9E9EB",
  "success": "#0CD5A2",
  "error": "#FF5C6F",
  "warning": "#F3AB3C",
  "cancel": "#20263D"
 },
 "fonts": {
  "buttonBig": {
   "name": "CircularXXTT-Black",
   "size": "20"
  },
  "buttonMedium": {
   "name": "CircularXXTT-Black",
   "size": "16"
  },
  "buttonSmall": {
   "name": "CircularXXTT-Black",
   "size": "12"
  },
  "title": {
   "name": "CircularXXTT-Black",
   "size": "25"
  },
  "hugeTitle": {
   "name": "CircularXXTT-Black",
   "size": "40"
  },
  "subtitle": {
   "name": "CircularXXTT-Black",
   "size": "18"
  },
  "boldedSubtitle": {
   "name": "CircularXXTT-Bold",
   "size": "18"
  },
  "smallSubtitle": {
   "name": "CircularXXTT-Black",
   "size": "14"
  },
  "info": {
   "name": "CircularXXTT-Black",
   "size": "16"
  },
  "body": {
   "name": "CircularXXTT-Medium",
   "size": "14"
  },
  "boldedBody": {
   "name": "CircularXXTT-Bold",
   "size": "14"
  },
  "textFieldBig": {
   "name": "CircularXXTT-Black",
   "size": "20"
  },
  "textFieldMedium": {
   "name": "CircularXXTT-Black",
   "size": "15"
  }
 },
 "buttons": {
  "primary": {
   "states": {
    "normal": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#00B2FD",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 32,
     "shadowColor": "#000000",
     "shadowOffset": [0,5],
     "shadowOpacity": 0.15,
     "shadowRadius": 9,
     "textColor": "#FFFFFF",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "highlighted": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#20263D",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 32,
     "shadowColor": "#000000",
     "shadowOffset": [0,5],
     "shadowOpacity": 0.15,
     "shadowRadius": 9,
     "textColor": "#00B2FD",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "disabled": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#E9E9EB",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 32,
     "shadowColor": "#000000",
     "shadowOffset": [0,5],
     "shadowOpacity": 0,
     "shadowRadius": 9,
     "textColor": "#FFFFFF",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    }
   },
   "big": {
    "height": 64,
    "minWidth": 200,
    "contentInsets": {
     "top": 19,
     "left": 32,
     "bottom": 19,
     "right": 32
    },
    "kerning": 0
   },
   "medium": {
    "height": 46,
    "minWidth": 0,
    "contentInsets": {
     "top": 12,
     "left": 24,
     "bottom": 12,
     "right": 24
    },
    "kerning": 0
   }
  },
  "secondary": {
   "states": {
    "normal": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#FFFFFF",
     "borderColor": "#20263D",
     "borderWidth": 1,
     "cornerRadius": 32,
     "shadowColor": "",
     "shadowOffset": [0,0],
     "shadowOpacity": 0,
     "shadowRadius": 0,
     "textColor": "#20263D",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "highlighted": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#20263D",
     "borderColor": "#20263D",
     "borderWidth": 1,
     "cornerRadius": 32,
     "shadowColor": "",
     "shadowOffset": [0,0],
     "shadowOpacity": 0,
     "shadowRadius": 0,
     "textColor": "#00B2FD",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "disabled": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#FFFFFF",
     "borderColor": "#E9E9EB",
     "borderWidth": 1,
     "cornerRadius": 32,
     "shadowColor": "",
     "shadowOffset": [0,0],
     "shadowOpacity": 0,
     "shadowRadius": 0,
     "textColor": "#E9E9EB",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    }
   },
   "big": {
    "height": 64,
    "minWidth": 200,
    "contentInsets": {
     "top": 19,
     "left": 32,
     "bottom": 19,
     "right": 32
    },
    "kerning": 0
   },
   "medium": {
    "height": 46,
    "minWidth": 0,
    "contentInsets": {
     "top": 12,
     "left": 24,
     "bottom": 12,
     "right": 24
    },
    "kerning": 0
   }
  },
  "text": {
   "states": {
    "normal": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 0,
     "shadowColor": "",
     "shadowOffset": [0,0],
     "shadowOpacity": 0,
     "shadowRadius": 0,
     "textColor": "#20263D",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "highlighted": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 0,
     "shadowColor": "",
     "shadowOffset": [0,0],
     "shadowOpacity": 0,
     "shadowRadius": 0,
     "textColor": "#00B2FD",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "disabled": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 0,
     "shadowColor": "",
     "shadowOffset": [0,0],
     "shadowOpacity": 0,
     "shadowRadius": 0,
     "textColor": "#E9E9EB",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    }
   },
   "big": {
    "height": 40,
    "minWidth": 200,
    "contentInsets": {
     "top": 8,
     "left": 16,
     "bottom": 8,
     "right": 16
    },
    "kerning": 0
   },
   "medium": {
    "height": 30,
    "minWidth": 0,
    "contentInsets": {
     "top": 12,
     "left": 24,
     "bottom": 12,
     "right": 24
    },
    "kerning": 0
   }
  },
  "help": {
   "states": {
    "normal": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#00B2FD",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 32,
     "shadowColor": "#000000",
     "shadowOffset": [0,5],
     "shadowOpacity": 0.15,
     "shadowRadius": 9,
     "textColor": "#FFFFFF",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "highlighted": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#20263D",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 32,
     "shadowColor": "#000000",
     "shadowOffset": [0,5],
     "shadowOpacity": 0.15,
     "shadowRadius": 9,
     "textColor": "#00B2FD",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    },
    "disabled": {
     "animateStateChange": true,
     "alpha": 1,
     "backgroundColor": "#E9E9EB",
     "borderColor": "",
     "borderWidth": 0,
     "cornerRadius": 32,
     "shadowColor": "#000000",
     "shadowOffset": [0,5],
     "shadowOpacity": 0,
     "shadowRadius": 9,
     "textColor": "#FFFFFF",
     "transform": {
      "a": 1,
      "b": 0,
      "c": 0,
      "d": 1,
      "tx": 0,
      "ty": 0
     }
    }
   },
   "big": {
    "height": 64,
    "minWidth": 200,
    "contentInsets": {
     "top": 19,
     "left": 32,
     "bottom": 19,
     "right": 32
    },
    "kerning": 0
   },
   "medium": {
    "height": 46,
    "minWidth": 0,
    "contentInsets": {
     "top": 12,
     "left": 24,
     "bottom": 12,
     "right": 24
    },
    "kerning": 0
   }
  }
 },
 "labels": {
  "title": {
   "textColor": "#20263D",
   "kerning": 0
  },
  "secondaryTitle": {
   "textColor": "#FFFFFF",
   "kerning": 0
  },
  "subtitle": {
   "textColor": "#20263D",
   "kerning": 0
  },
  "secondarySubtitle": {
   "textColor": "#FFFFFF",
   "kerning": 0
  },
  "smallSubtitle": {
   "textColor": "#20263D",
   "kerning": 0
  },
  "info": {
   "textColor": "#636670",
   "kerning": 0
  },
  "secondaryInfo": {
   "textColor": "#FFFFFF",
   "kerning": 0
  },
  "body": {
   "textColor": "#20263D",
   "kerning": 0
  },
  "secondaryBody": {
   "textColor": "#FFFFFF",
   "kerning": 0
  },
  "code": {
   "textColor": "#20263D",
   "kerning": 16
  }
 },
 "customComponents": {
  "cameraFeedback": {
   "alpha": 0.8,
   "backgroundColor": "#000000",
   "cornerRadius": 20,
   "textBackgroundColor": "",
   "textColor": "#FFFFFF"
  },
  "idCaptureHelp": {
   "commonIssueLayoutOrientation": "horizontal"
  },
  "idSideLabel": {
   "alpha": 1,
   "backgroundColor": "#FFFFFF",
   "borderColor": "",
   "borderWidth": 0,
   "cornerRadius": 5
  },
  "separator": {
   "alpha": 1.0,
   "color": "#20263D",
   "cornerRadius": 0,
   "padding": 24,
   "thickness": 1
  },
  "signature": {
   "signatureColor": "#04BD19",
   "canvasBorderColor": "#EC03FC"
  },
  "idAutocaptureCountdown": {
   "backgroundColor": "#00B2FD",
   "numberColor": "#FFFFFF"
  }
 },
};

License

Copyright 2018 Incode Technologies. All rights reserved.