BLINKID ELEMENT =================

ELEMENT DESCRIPTION
--------------------------------
BLINKID element integrates Microblink BlinkID, AI-powered software for lighting-fast ID scanning. Supports government-issued documents from more than 180 countries worldwide, letting you onboard your users quickly and securely, right on your website, or simply extract all data from an ID using either a webcam or an uploaded file.

STEP-BY-STEP SETUP
--------------------------------
 0) Register a MICROBLINK account: https://microblink.com/login

 1) Get a licence key from MICROBLINK for BLINKID, on IN-BROWSER platform: https://developer.microblink.com/license

 2) Enter your BLINKID LICENSE KEY in the Plugin Settings, field BLINKIDLICENSEKEY, optionally, enter this CSS customisation in the Plugin Settings, field CUSTOM CSS (HEADERS):
   /* Global font family */
   --mb-font-family: inherit;

   /* Component (UI with buttons) */
   --mb-component-background: #FFF;
   --mb-component-font-color: #000;
   --mb-component-font-size:  14px;
   --mb-component-font-style: normal;
   --mb-component-font-weight: 400;
   --mb-component-letter-spacing: normal;
   --mb-component-line-height: 20px;
   --mb-component-text-transform: none;
   --mb-component-border-color: rgba(120, 120, 128, 0.2);
   --mb-component-border-radius: 5px;
   --mb-component-border-style: solid;
   --mb-component-border-width: 1px;
   --mb-component-box-shadow: none;
   --mb-component-button-background:        #FFF;
   --mb-component-button-border-color:         rgba(120, 120, 128, 0.2);
   --mb-component-button-border-color-disabled: rgba(116, 116, 128, 0.08);
   --mb-component-button-border-radius: 20px;
   --mb-component-button-border-style: solid;
   --mb-component-button-border-width: 1px;
   --mb-component-button-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.1);
   --mb-component-button-box-shadow-disabled: none;

   /* User feedback (messages below buttons) */
   --mb-feedback-font-color-error: #FF2D55;
   --mb-feedback-font-color-info: rgba(60, 60, 67, 0.7);
   --mb-feedback-font-size: 12px;
   --mb-feedback-font-style: normal;
   --mb-feedback-font-weight: 400;
   --mb-feedback-letter-spacing: normal;
   --mb-feedback-line-height: 16px;
   --mb-feedback-text-transform: none;

   /* Overlays */
   --mb-overlay-draganddrop-background: rgba(72, 178, 232, 0.25);
   --mb-overlay-draganddrop-background-error: rgba(255, 45, 85, 0.25);
   --mb-overlay-draganddrop-border-color-error: #FF2D55;
   --mb-overlay-draganddrop-border-style-error: dashed;

 3) Drap and drop up the visual element BLINKID in your app, containing the scanning engine.

 4) Select the BLINKID element, in APPEARANCE section, configure the following fields :
 
 FIELDS :
 - ACTION MESSAGE : Default text message shown to the user prior to scanning.
 - RTL : Right to left (RTL) support.
 - SCAN FROM IMAGE : Enable Scan from Image.
 - RETURN FACE IMAGE : Return Face Image in Base64 format.
 - RETURN SIGNATURE IMAGE : Return Signature Image in Base64 format.
 - RESULT DATA TYPE : Must always be set to Result (BlinkID).

 5) Integrate the logic into your application using the following BLINKID events, states and actions:

 EVENTS :
 If you intend to trigger an action depending on the scan events, use any of the following Workflow Start:
 - READY : Event which is emitted when UI component is successfully initialized and ready for use.
 - SCAN SUCCESS : Event which is emitted after successful scan.
 - CAMERA SCAN STARTED : Event which is emitted when camera scan is started, i.e. when user clicks on scan from camera button.
 - IMAGE SCAN STARTED : Event which is emitted when image scan is started, i.e. when user clicks on Scan from gallery button.
 - SCAN ABORTED : Event which is emitted when scan is aborted, i.e. when user clicks on close from the gallery toolbar, or presses escape key.
 - SCAN ERROR : Event which is emitted during or immediately after scan error.
 - FEEDBACK : Event which is emitted during positive or negative user feedback scanning, for example partially hidden ID or successful scanning.
 - FATAL ERROR : Event which is emitted during initialization of UI component.

 EXPOSED STATES:
 Use any element able to show/process the data of interest (such as a Group with a Text field) stored within the result of the following states of the BLINKID element :
   - RESULT : Result of the scan, containing individually selectable information detected from the ID scan.
   - ERROR CODE : BlinkID Technical Error code.
   - ERROR FATAL : BlinkID Technical Fatal error short description.
   - ERROR MESSAGE : BlinkID Technical Fatal error message.
   - FEEDBACK CODE : BlinkID feedback code, preventing scanning.
   - FEEDBACK MESSAGE : BlinkID feedback message, preventing scanning.
   - FEEDBACK STATE : BlinkID feedback state, indicating whether the event preventing the scan has been cleared or not.
   - RAW RESULT : BlinkID Raw scanning results.

 ELEMENT ACTIONS - TRIGGERED IN WORKFLOW:
   - RESET : Reset the BLINKID element to its original state and attributes.    

IMPLEMENTATION EXAMPLE
======================
Feel free to browse the app editor in the Service URL for an implementation example.

ADDITIONAL INFORMATION
======================
> Supported ID types details : https://microblink.com/full-list-of-supported-identity-documents/

TROUBLESHOOTING
================
Any plugin related error will be posted to the Console of the browser.

PERFORMANCE CONSIDERATIONS
===========================
N/A

QUESTIONS ?
===========
Contact us at [email protected] for any additional feature you would require or support question