@regulaforensics/vp-frontend-document-components 1.2.0 → 2.0.0

package/lib/index-document.d.ts

@@ -0,0 +1,5 @@
+import '@webcomponents/webcomponentsjs/webcomponents-bundle.js';
+import DocumentReaderService from './services/DocumentReaderService';
+import DocumentReaderProcessor from './services/DocumentReaderProcessor';
+declare function defineComponents(): Promise<Awaited<CustomElementConstructor>[]>;
+export { DocumentReaderService, DocumentReaderProcessor, defineComponents };

package/lib/models/CameraModel.d.ts

@@ -0,0 +1,9 @@
+import { FacingModeType } from '../types';
+declare class CameraModel {
+    readonly deviceId: string;
+    readonly facing?: FacingModeType;
+    readonly groupId: string;
+    readonly label: string;
+    constructor(mdi: MediaDeviceInfo, facing?: FacingModeType);
+}
+export default CameraModel;

package/lib/models/CustomError.d.ts

@@ -0,0 +1,7 @@
+import { ErrorTypes } from '../constants';
+declare class CustomError {
+    type: ErrorTypes;
+    details?: any;
+    constructor(type: ErrorTypes, details?: any);
+}
+export default CustomError;

package/lib/models/ImageModel.d.ts

@@ -0,0 +1,7 @@
+declare class ImageModel {
+    readonly mimeType: string;
+    readonly raw: string;
+    readonly extension: string;
+    constructor(dataURL: string);
+}
+export default ImageModel;

package/lib/services/DebugService.d.ts

@@ -0,0 +1,13 @@
+import { logLevels } from '../constants';
+declare class DebugService {
+    private readonly logLvl;
+    constructor(logLvl: logLevels);
+    private log;
+    private time;
+    debug(message: string, ...optionalParams: Array<any>): void;
+    info(message: string, ...optionalParams: Array<any>): void;
+    warn(message: string, ...optionalParams: Array<any>): void;
+    error(message: string, ...optionalParams: Array<any>): void;
+}
+declare const _default: DebugService;
+export default _default;

package/lib/services/DocumentReaderProcessor.d.ts

@@ -0,0 +1,53 @@
+import { CurrentPage, FacingModeType, SDKImageProcessingRequest, SDKRecognizerProcessingRequest, WidthAndHeight } from '../types';
+import { Response } from '@regulaforensics/document-reader-webclient';
+declare type ServiceListener = ((data: Response) => void) | null;
+declare type ResponseListener = (currentPage: CurrentPage) => void;
+declare type StreamSettings = Partial<StreamParams>;
+declare type StreamParams = {
+    cameraMode: FacingModeType;
+    preferredCameraId: string;
+    resolution: WidthAndHeight;
+};
+declare class DocumentReaderProcessor {
+    private _videoElement;
+    private _stream;
+    private _documentReaderService;
+    private _canvas;
+    private _streamParam;
+    private _frameSizes;
+    private _recognizerProcessParam;
+    private _imageProcessParam;
+    private _videoEventListener;
+    private _recognizerListener;
+    private _isPrepared;
+    private _isInitialized;
+    private _isProcessing;
+    constructor(videoElement?: HTMLVideoElement);
+    get streamParam(): StreamParams;
+    set streamParam(params: Partial<StreamSettings>);
+    get recognizerProcessParam(): SDKRecognizerProcessingRequest;
+    set recognizerProcessParam(params: SDKRecognizerProcessingRequest);
+    get imageProcessParam(): SDKImageProcessingRequest;
+    set imageProcessParam(params: SDKImageProcessingRequest);
+    get recognizeListener(): ServiceListener;
+    set recognizeListener(listener: ServiceListener);
+    set videoElement(videoElement: HTMLVideoElement | null);
+    get videoElement(): HTMLVideoElement | null;
+    get isPrepared(): boolean;
+    get isInitialized(): boolean;
+    get isProcessing(): boolean;
+    private get processRequest();
+    private startStream;
+    private detect;
+    private startNewPage;
+    private startNewDocument;
+    startRecognition(responseListener?: ResponseListener): Promise<Response>;
+    processImage(images: FileList | Array<Blob>): Promise<Response>;
+    stopRecognition(): void;
+    prepare(): Promise<void>;
+    initialize(license?: {
+        license: string | undefined;
+    }): Promise<void>;
+    shutdown(): void;
+}
+export default DocumentReaderProcessor;

package/lib/services/DocumentReaderService.d.ts

@@ -0,0 +1,44 @@
+import { DocumentCommandCode } from '../constants';
+import { DocumentReaderRequest } from '../types';
+import { Response } from '@regulaforensics/document-reader-webclient';
+declare type PrepareData = {
+    isInitialized: boolean;
+    isPrepared: boolean;
+};
+declare type PrepareListener = (status: PrepareData) => void;
+declare class DocumentReaderService {
+    private _isPrepared;
+    private _isInitialized;
+    private _isProcessing;
+    private _worker;
+    private _prepareListener;
+    private _currentPromise;
+    constructor();
+    get isInitialized(): boolean;
+    private set isInitialized(value);
+    get isPrepared(): boolean;
+    private set isPrepared(value);
+    get isProcessing(): boolean;
+    get prepareListener(): PrepareListener | null;
+    set prepareListener(listener: PrepareListener | null);
+    private postCustomMessage;
+    private createProcessImageRequest;
+    private createPromise;
+    private finishPromise;
+    private rejectPromise;
+    private print;
+    private printErr;
+    private onWorkerMessage;
+    private callPrepareListener;
+    prepare(): Promise<void>;
+    initialize(initData?: {
+        license: string | undefined;
+    }): Promise<void>;
+    processImage(base64ImagesArray: Array<string>, params: DocumentReaderRequest): Promise<Response>;
+    process(imageDataArray: Array<ImageData>, request: DocumentReaderRequest, commandCode: DocumentCommandCode): Promise<Response>;
+    startNewPage(): Promise<void>;
+    startNewDocument(): Promise<void>;
+    shutdown(): void;
+    showVersion(): void;
+}
+export default DocumentReaderService;

package/lib/services/EventEmitter.d.ts

@@ -0,0 +1,9 @@
+declare class EventEmitter {
+    callbacks: Record<string, any>;
+    constructor();
+    on(event: string, cb: (data: any) => any): void;
+    emit(event: string, data: any): void;
+    unsubscribe(event: string, listener: any): void;
+    unsubscribeAll(): void;
+}
+export default EventEmitter;

package/lib/services/FaceLivenessService.d.ts

@@ -0,0 +1,43 @@
+import { UserAgentType } from '../types';
+import EventEmitter from './EventEmitter';
+import CameraModel from '../models/CameraModel';
+declare type MetadataType = {
+    metadata: {
+        hostAppId: string;
+        sdkVersion: string;
+        deviceModel: string;
+        camera: CameraModel;
+    };
+    try_id?: number;
+    guid?: string;
+    userAgent: UserAgentType;
+    mode?: number;
+};
+declare class FaceLivenessService {
+    initialized: boolean;
+    processing: boolean;
+    prepared: boolean;
+    worker: Worker | null;
+    params: {
+        width: number;
+        height: number;
+        metadata?: MetadataType;
+    };
+    eventEmitter: EventEmitter;
+    constructor();
+    prepare(listener: (data: any) => void): Promise<void>;
+    initialize(params: {
+        width: number;
+        height: number;
+        metadata: MetadataType;
+        debug?: boolean;
+    }): void;
+    private postCustomMessage;
+    private emit;
+    private print;
+    private printErr;
+    private onWorkerMessage;
+    shutdown(): void;
+    processImage(videoFrame: Uint8ClampedArray): void;
+}
+export default FaceLivenessService;

package/lib/services/FaceService.d.ts

@@ -0,0 +1,12 @@
+import { FaceLivenessResultType } from '../types';
+declare type GetLivenessResultOptions = {
+    uuid: string;
+    try_id: number;
+    backendURL?: string;
+    headers?: Record<string, string>;
+};
+declare function getLivenessResult(encryptedBody: Uint8Array, { uuid, try_id, backendURL, headers }: GetLivenessResultOptions): Promise<FaceLivenessResultType>;
+declare const _default: {
+    getLivenessResult: typeof getLivenessResult;
+};
+export default _default;

package/lib/types.d.ts

@@ -0,0 +1,323 @@
+import { Response } from '@regulaforensics/document-reader-webclient';
+import { DocumentEventActions, FaceEventActions, InternalScenarios, ObjectFit, ResponseCode, StreamStatus, ErrorTypes, CameraFacingMode } from './constants';
+import CameraModel from './models/CameraModel';
+export declare type XY = {
+    x: number;
+    y: number;
+};
+export declare type Oval = {
+    axisX: number;
+    axisY: number;
+    center: XY;
+};
+export declare type FrameObject = {
+    left: number;
+    top: number;
+    width: number;
+    height: number;
+};
+export declare type WidthAndHeight = {
+    width: number;
+    height: number;
+};
+export declare type VideoParamsType = {
+    videoElement: HTMLVideoElement | null;
+    videoParams: WidthAndHeight;
+    videoContainerParams: WidthAndHeight;
+};
+export declare type FacingModeType = keyof typeof CameraFacingMode;
+export declare type VideoStatusParamsType = {
+    videoStatus: StreamStatus;
+    camera: CameraTypes;
+    twoFacingModesAvailable: boolean;
+};
+export declare type CaptureFrameType = {
+    imageData: Array<ImageData>;
+    raw: string;
+    mimeType: string;
+};
+export declare type CaptureType = Array<Omit<CaptureFrameType, 'imageData'>>;
+export declare type CodeType = {
+    code: number;
+    images?: null;
+};
+export declare type UserAgentType = {
+    appCodeName: string;
+    appName: string;
+    appVersion: string;
+    language: string;
+    languages: readonly string[];
+    platform: string;
+    product: string;
+    productSub: string;
+    userAgent: string;
+    vendor: string;
+    vendorSub: string;
+};
+declare type FaceLivenessEyesType = {
+    predLeft: number;
+    predRight: number;
+    probLeft: number;
+    probRight: number;
+};
+declare type FaceLivenessOcclusionType = {
+    foreheadGlasses: boolean;
+    glasses: boolean;
+    hat: boolean;
+    medicineMask: boolean;
+    occlusion: boolean;
+    openedMouth: boolean;
+    sunglasses: boolean;
+};
+declare type FaceLivenessQualityType = {
+    blur: number;
+    brightness: number;
+    noise: number;
+};
+export declare type FaceLivenessResponseType = {
+    code: number;
+    msg: string;
+    results: {
+        faceIdx: number;
+        livenessStatus: number;
+        metadata: {
+            ageNear: string;
+            ageNormal: string;
+            distance: number;
+            evaluationTime: number;
+            eyesNear: FaceLivenessEyesType;
+            eyesNormal: FaceLivenessEyesType;
+            faceQuality: {
+                details: Array<{
+                    attribute: string;
+                    score: number;
+                }>;
+                score: number;
+            };
+            faceTrackBreak: number;
+            occlusionNear: FaceLivenessOcclusionType;
+            occlusionNormal: FaceLivenessOcclusionType;
+            predArtMaskNear: number;
+            predArtMaskNormal: number;
+            predElectronicDeviceNear: number;
+            predElectronicDeviceNormal: number;
+            predGeometryClassifier: number;
+            predLivenessViewNear: number;
+            predLivenessViewNormal: number;
+            predOpticalFlow: number;
+            predShadesNear: number;
+            predShadesNormal: number;
+            predTotal: number;
+            probArtMaskNear: number;
+            probArtMaskNormal: number;
+            probElectronicDeviceNear: number;
+            probElectronicDeviceNormal: number;
+            probGeometryClassifier: number;
+            probOpticalFlow: number;
+            probShadesNear: number;
+            probShadesNormal: number;
+            qualityNear: FaceLivenessQualityType;
+            qualityNormal: FaceLivenessQualityType;
+            smileNear: string;
+            smileNormal: string;
+            symNear: number;
+            symNormal: number;
+        };
+    };
+    versionDescriptor: string;
+    versionSDK: string;
+    images: Array<string>;
+};
+export declare type FaceDetectionResponseType = {
+    capture: Array<string>;
+};
+export declare type DocumentReaderResponseType = Response;
+export declare type CameraSnapshotResponseType = CaptureType;
+export declare type FaceLivenessResultType = Omit<FaceLivenessResponseType, 'images'>;
+export declare type FaceDebugOutput = {
+    cft: boolean;
+    face: {
+        height: number;
+        landmarks: Array<XY>;
+        pitch: number;
+        roll: number;
+        width: number;
+        x: number;
+        y: number;
+        yaw: number;
+    };
+    target: Oval;
+};
+export declare type ScenarioParamsType = {
+    UVTorch?: number;
+    barcodeExt?: number;
+    caption: string;
+    desc: string;
+    faceExt?: number;
+    frameKWHDoublePageSpreadLandscape: string;
+    frameKWHDoublePageSpreadPortrait: string;
+    frameKWHLandscape: string;
+    frameKWHPortrait: string;
+    frameOrientation: number;
+    manualCrop?: number;
+    multiPageOff?: number;
+    name: string;
+    seriesProcessMode?: number;
+};
+export declare type InitDataType = {
+    scenario: Array<ScenarioParamsType>;
+};
+export declare type UserFrameType = {
+    frameBottom: number;
+    frameLeft: number;
+    frameRight: number;
+    frameTop: number;
+    width: number;
+    height: number;
+};
+export declare type ImageInputParamType = {
+    frameBottom: number;
+    frameLeft: number;
+    frameRight: number;
+    frameTop: number;
+    light: number;
+    resolutionType: number;
+};
+export declare type FrameParamsType = {
+    userFrame: UserFrameType;
+    serviceFrame: ImageInputParamType;
+};
+export declare type ImageQualityCheck = {
+    featureType: number;
+    mean: number;
+    probability: number;
+    result: number;
+    std_dev: number;
+    type: number;
+};
+export declare type SupportedBrowserVersions = {
+    Chrome: number;
+    Firefox: number;
+    Safari: number;
+    Opera?: number;
+    Edge?: number;
+    Chromium?: number;
+    IE?: number;
+    'Internet Explorer'?: number;
+    'Mobile Safari'?: number;
+    'Samsung Browser'?: number;
+};
+export declare type SupportedBrowserVersionsByOsType = {
+    iOS: SupportedBrowserVersions;
+    Android: SupportedBrowserVersions;
+    desktop: SupportedBrowserVersions;
+};
+declare type CustomEventDataType<R> = {
+    status: ResponseCode;
+    reason?: keyof typeof ErrorTypes;
+    response?: R;
+};
+interface DetailEvent<A, R> {
+    manual: boolean;
+    action: A;
+    data: CustomEventDataType<R> | null;
+}
+export declare type FaceLivenessDetailType = DetailEvent<FaceEventActions, FaceLivenessResponseType>;
+export declare type FaceCaptureDetailType = DetailEvent<FaceEventActions, FaceDetectionResponseType>;
+export declare type DocumentReaderDetailType = DetailEvent<DocumentEventActions, DocumentReaderResponseType>;
+export declare type CameraSnapshotDetailType = DetailEvent<DocumentEventActions, CameraSnapshotResponseType>;
+export declare type DocumentReaderImage = {
+    data: string;
+    light: number;
+    pageIdx: number;
+};
+export declare type DocumentReaderProcessParam = {
+    returnPackageForReprocess?: boolean;
+    returnUncroppedImage?: boolean;
+    scenario?: keyof typeof InternalScenarios;
+    multipageProcessing?: boolean;
+    timeout?: number;
+    timeoutFromFirstDetect?: number;
+    timeoutFromFirstDocType?: number;
+    resultTypeOutput?: Array<string>;
+    imageQa?: {
+        expectedPass?: Array<string>;
+        dpiThreshold?: number;
+        glaresCheck?: boolean;
+        glaresCheckParams?: {
+            imgMarginPart?: number;
+            maxGlaringPart?: number;
+        };
+    };
+};
+export declare type DocumentReaderRequest = {
+    processParam: Record<string, any>;
+    imagesList?: Array<DocumentReaderImage>;
+    imageInputParam?: ImageInputParamType;
+};
+export declare type SDKRecognizerProcessingRequest = {
+    processParam: DocumentReaderProcessParam;
+};
+export declare type SDKImageProcessingRequest = {
+    processParam: Pick<DocumentReaderProcessParam, 'returnPackageForReprocess' | 'returnUncroppedImage' | 'scenario'>;
+};
+export declare type DevicesType = {
+    devices: Array<MediaDeviceInfo>;
+    videoDevices: Array<MediaDeviceInfo>;
+    isCameraAllowed: boolean;
+    isDevicesChecked: boolean;
+};
+export interface StreamDataType {
+    status: StreamStatus;
+    stream: MediaStream | null;
+    camera: CameraTypes;
+    twoFacingModesAvailable: boolean;
+}
+export declare type CameraTypes = {
+    selectedCamera: CameraModel;
+    frontCameras: Array<CameraModel>;
+    backCameras: Array<CameraModel>;
+};
+export declare type CurrentPage = {
+    data: Response;
+    startNextPage: () => Promise<void>;
+    finishRecognition: () => void;
+};
+declare global {
+    interface HTMLElementEventMap {
+        'face-liveness': CustomEvent<FaceLivenessDetailType>;
+        'face-capture': CustomEvent<FaceCaptureDetailType>;
+        'document-reader': CustomEvent<DocumentReaderDetailType>;
+        'camera-snapshot': CustomEvent<CameraSnapshotDetailType>;
+    }
+}
+interface IBaseComponent {
+    locale?: string;
+    copyright?: boolean;
+    'camera-id'?: string;
+    'change-camera'?: boolean;
+}
+interface IDocumentBaseComponent extends IBaseComponent {
+    'start-screen'?: boolean;
+    multiple?: boolean;
+    'object-fit'?: keyof typeof ObjectFit;
+}
+export interface IFaceLiveness extends Omit<IBaseComponent, 'headers'> {
+    url?: string;
+    debug?: boolean;
+    headers?: string | Record<string, string>;
+}
+export interface IDocumentReader extends IDocumentBaseComponent {
+    'internal-scenario'?: keyof typeof InternalScenarios;
+    'multipage-processing'?: boolean;
+    license?: string;
+}
+export interface IFaceDetection extends IBaseComponent {
+    debug?: boolean;
+}
+export declare type ICameraSnapshot = IDocumentBaseComponent;
+export { default as DocumentReaderCaptureWebComponent } from './web-components/CameraSnapshot';
+export { default as DocumentReaderWebComponent } from './web-components/DocumentReader';
+export { default as FaceDetectionWebComponent } from './web-components/FaceDetection';
+export { default as FaceLivenessWebComponent } from './web-components/FaceLiveness';
+export { default as FullScreenContainer } from './web-components/FullScreenContainer';

package/lib/utils.d.ts

@@ -0,0 +1,27 @@
+import { ImageOutputType, ObjectFit } from './constants';
+import CameraModel from './models/CameraModel';
+import { CameraTypes, CaptureFrameType, DevicesType, FaceDebugOutput, FacingModeType, FrameObject, StreamDataType, VideoParamsType, WidthAndHeight } from './types';
+export declare function uint8ArrayToBase64(arr: Uint8ClampedArray, videoFrame: {
+    width: number;
+    height: number;
+}): string;
+export declare function downloadBase64Image(base64: string, name: string | number): void;
+export declare function saveByteArray(data: Uint8ClampedArray, name: string | number): void;
+export declare const convertBooleanAttributeParam: (attributeValue: string | null) => boolean | undefined;
+export declare const convertNumberAttributeParam: (attributeValue: string | null) => number | undefined;
+export declare function compose(...argsA: any): any;
+export declare function recalculateFrameSizes(videoWidth: number, videoHeight: number, containerWidth: number, containerHeight: number, frameWidth: number, frameHeight: number, frameX: number, frameY: number, objectFit: ObjectFit): FrameObject;
+export declare function getByteCount(b64: Array<string> | string): number;
+export declare function base64ToArrayBuffer(base64: string): ArrayBuffer;
+export declare function getUintImages(files: FileList | Array<Blob>, resizeValue: number, maxBrowserSupportedResolution: number): Promise<Array<Promise<ImageData>>>;
+export declare function generateEvent<T>(type: string, detail: T): CustomEvent;
+export declare const getAvailableCameras: (cameraPool: CameraModel[], preferredCameraId?: string) => CameraModel | undefined;
+export declare function calculateFrame(videoElementParams: VideoParamsType, isLandscape: boolean, ratio: number, frameOffset: number): FrameObject;
+export declare function getVideosDevices(): Promise<DevicesType>;
+export declare function isBackCameraLabel(label: string, keywords: Array<string>): boolean;
+export declare function getCameras(preferredCameraType: FacingModeType, mediaDevices: DevicesType, preferredCameraId?: string): Promise<CameraTypes>;
+export declare const closeStreamTracks: (stream: MediaStream) => void;
+export declare function getVideo(resolution: WidthAndHeight, cameraTypes: CameraTypes, preferredCameraId?: string): Promise<StreamDataType>;
+export declare function getImageFromVideo(videoElement: HTMLVideoElement, outputType: ImageOutputType): CaptureFrameType;
+export declare function getNextCamera(camerasInfo: CameraTypes): string;
+export declare function drawFaceDebugOutput(canvas: HTMLCanvasElement, videoElementParams: VideoParamsType, debugOutput: FaceDebugOutput): void;

package/lib/web-components/CameraSnapshot.d.ts

@@ -0,0 +1,11 @@
+import { Root } from 'react-dom/client';
+export default class DocumentReaderCaptureWebComponent extends HTMLElement {
+    root: Root;
+    mounted: boolean;
+    constructor();
+    static get observedAttributes(): Array<string>;
+    attributeChangedCallback(name: string): void;
+    connectedCallback(): void;
+    render(): void;
+    disconnectedCallback(): void;
+}

package/lib/web-components/DocumentReader.d.ts

@@ -0,0 +1,11 @@
+import { Root } from 'react-dom/client';
+export default class DocumentReaderWebComponent extends HTMLElement {
+    root: Root;
+    mounted: boolean;
+    constructor();
+    static get observedAttributes(): Array<string>;
+    attributeChangedCallback(name: string): void;
+    connectedCallback(): void;
+    render(): void;
+    disconnectedCallback(): void;
+}

package/lib/web-components/FaceDetection.d.ts

@@ -0,0 +1,11 @@
+import { Root } from 'react-dom/client';
+export default class FaceDetectionWebComponent extends HTMLElement {
+    root: Root;
+    mounted: boolean;
+    constructor();
+    static get observedAttributes(): Array<string>;
+    attributeChangedCallback(name: string): void;
+    connectedCallback(): void;
+    render(): void;
+    disconnectedCallback(): void;
+}

package/lib/web-components/FaceLiveness.d.ts

@@ -0,0 +1,14 @@
+import { Root } from 'react-dom/client';
+export default class FaceLivenessWebComponent extends HTMLElement {
+    root: Root;
+    mounted: boolean;
+    requestHeaders: Record<string, string>;
+    constructor();
+    static get observedAttributes(): Array<string>;
+    attributeChangedCallback(name: string): void;
+    connectedCallback(): void;
+    set headers(headersData: Record<string, string>);
+    get headers(): Record<string, string>;
+    render(): void;
+    disconnectedCallback(): void;
+}

package/lib/web-components/FullScreenContainer.d.ts

@@ -0,0 +1,4 @@
+export default class FullScreenContainer extends HTMLElement {
+    root: ShadowRoot;
+    constructor();
+}