@getyoti/react-face-capture 1.0.0-beta.2 → 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +77 -0
- package/README.md +33 -33
- package/index.css +1 -1
- package/index.d.ts +181 -0
- package/index.js +1 -1
- package/package.json +6 -28
- package/vanilla/index.css +1 -1
- package/vanilla/index.js +1 -1
- package/vanilla/index.js.map +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,82 @@
|
|
|
1
1
|
# CHANGELOG
|
|
2
2
|
|
|
3
|
+
## v1.1.0
|
|
4
|
+
|
|
5
|
+
### New features
|
|
6
|
+
|
|
7
|
+
- New way to sign the `onSuccess` result in the secure mode.
|
|
8
|
+
|
|
9
|
+
### Fixes
|
|
10
|
+
|
|
11
|
+
- `faceCaptureAssetsRootUrl` is no longer typed as a required prop.
|
|
12
|
+
|
|
13
|
+
## v1.0.0
|
|
14
|
+
|
|
15
|
+
### New features
|
|
16
|
+
|
|
17
|
+
- Removed `widthMinConstraint` and `widthIdealConstraint` from the Face Capture Module props.
|
|
18
|
+
|
|
19
|
+
- Added `resolutionType` prop to provide a semantic and easier way of selecting the desired resolution.
|
|
20
|
+
The possible values for the new prop are:
|
|
21
|
+
|
|
22
|
+
- `hd`
|
|
23
|
+
- `full_hd`
|
|
24
|
+
|
|
25
|
+
- Added `onReadyForCapture` callback to provide a way for the integrators to know when the module is ready to take images.
|
|
26
|
+
|
|
27
|
+
- Now the Face Capture Module will stop the process and the camera when the page is hidden.
|
|
28
|
+
|
|
29
|
+
- There is a known issue on iPhone Firefox, when opening a new FCM instance in a different tab, that may cause the previous one to freeze.
|
|
30
|
+
|
|
31
|
+
- Now the vanilla version of the Face Capture Module also exports some useful constants, as the React version does. Here is a list of all of them:
|
|
32
|
+
|
|
33
|
+
- **CAPTURE_METHOD**
|
|
34
|
+
- **COUNTDOWN_MODES**
|
|
35
|
+
- **ERROR_CODE**
|
|
36
|
+
- **FORMAT_TYPE**
|
|
37
|
+
- **IMAGE_TYPE**
|
|
38
|
+
- **LANGUAGE_CODE**
|
|
39
|
+
- **QUALITY_TYPE**
|
|
40
|
+
- **RESOLUTION_TYPE**
|
|
41
|
+
|
|
42
|
+
New constants can be accessed by using `Yoti.<CONSTANT_NAME>`.
|
|
43
|
+
|
|
44
|
+
- Now `countdownMode` has new options:
|
|
45
|
+
|
|
46
|
+
- `never` and `always` remains the same.
|
|
47
|
+
- `auto` has been replaced by `only_mobile` and `only_desktop` which brings extra configuration for all possible scenarios.
|
|
48
|
+
|
|
49
|
+
- Implemented localisation languages:
|
|
50
|
+
|
|
51
|
+
- `ur`: Urdu
|
|
52
|
+
- `hy`: Armenian
|
|
53
|
+
- `he`: Hebrew
|
|
54
|
+
|
|
55
|
+
- Updated localisations languages:
|
|
56
|
+
|
|
57
|
+
- `it`: Italian
|
|
58
|
+
- `es-419`: Latin American Spanish
|
|
59
|
+
|
|
60
|
+
- Fixed typo in German localisation.
|
|
61
|
+
|
|
62
|
+
- Manual capture method fallback when slow performance, is now optional with the new `manualCaptureFallback` prop.
|
|
63
|
+
|
|
64
|
+
- Added type declaration file `index.d.ts` for the Face Capture component and exported properties.
|
|
65
|
+
|
|
66
|
+
- CustomManualButton and CustomConsentButton properties are not supported in the vanilla version.
|
|
67
|
+
|
|
68
|
+
### Minor changes
|
|
69
|
+
|
|
70
|
+
- Removed ellipsis from user feedback messages.
|
|
71
|
+
|
|
72
|
+
### Fixes
|
|
73
|
+
|
|
74
|
+
- Fix error added on `FCM 1.0.0-beta.2` causing `JPEG` images to be more compressed than desired on landscape scenario.
|
|
75
|
+
|
|
76
|
+
## v1.0.0-beta.3
|
|
77
|
+
|
|
78
|
+
Fix a package install error which cause `yarn` and older `npm` versions to fail.
|
|
79
|
+
|
|
3
80
|
## v1.0.0-beta.2
|
|
4
81
|
|
|
5
82
|
### New features
|
package/README.md
CHANGED
|
@@ -2,6 +2,11 @@
|
|
|
2
2
|
|
|
3
3
|
The purpose of this module is to capture a face and return the output image.
|
|
4
4
|
|
|
5
|
+
## CHANGELOG
|
|
6
|
+
|
|
7
|
+
Please check the [CHANGELOG](https://github.com/getyoti/web-fcm-demo/blob/main/docs/FCM-CHANGELOG.md)
|
|
8
|
+
to review release changes, issues, fixes, and possible breaking changes on Major releases.
|
|
9
|
+
|
|
5
10
|
## Pre-requisite to adopt the dependency
|
|
6
11
|
|
|
7
12
|
### Peer dependencies
|
|
@@ -32,6 +37,8 @@ Secondly, the module needs `MediaDevices.getUserMedia()` to work. When this isn'
|
|
|
32
37
|
|
|
33
38
|
_Note: Non-Safari browsers on iOS are not supported because of an iOS limitation._
|
|
34
39
|
|
|
40
|
+
_Note: Edge is only supported on desktop versions._
|
|
41
|
+
|
|
35
42
|
Finally, some devices might experience poor performance when attempting to detect a face. This is because the underlying library TensorFlow.js can still be too demanding for older less performant devices.
|
|
36
43
|
|
|
37
44
|
## React face capture module
|
|
@@ -66,25 +73,26 @@ new CopyPlugin([
|
|
|
66
73
|
|
|
67
74
|
### Props
|
|
68
75
|
|
|
69
|
-
| Property name
|
|
70
|
-
|
|
|
71
|
-
| captureMethod
|
|
72
|
-
|
|
|
73
|
-
|
|
|
74
|
-
|
|
|
75
|
-
|
|
|
76
|
-
|
|
|
77
|
-
|
|
|
78
|
-
|
|
|
79
|
-
|
|
|
80
|
-
|
|
|
81
|
-
|
|
|
82
|
-
|
|
|
83
|
-
|
|
|
84
|
-
| qualityType
|
|
85
|
-
| language
|
|
86
|
-
| a11yLiveRegionMode
|
|
87
|
-
| isConsentRequired
|
|
76
|
+
| Property name | Type | Default | Mand | Description |
|
|
77
|
+
| --------------------- | ---------------------------------------------- | ------------- | ---- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
78
|
+
| captureMethod | String `manual/auto` | `auto` | - | Capture method to take the photo: by clicking a button or auto-capture. |
|
|
79
|
+
| manualCaptureFallback | Boolean | `true` | - | In `auto` capture method, allow the use of `manual` capture mode as fallback. This would be triggered only when low performance conditions are detected, usually on very old devices. NOTE: If this option is turned off, some users might not be able to successfully submit an image. |
|
|
80
|
+
| countdownMode | String `only_desktop/only_mobile/never/always` | `never` | - | Indicates when the countdown will be used. Note: It's only used if captureMethod is set to `manual`. |
|
|
81
|
+
| secure | Boolean | false | - | If `true`, the face capture module will use the [secure mode](#secure-mode) |
|
|
82
|
+
| onSuccess | Function({ img, secure }) | - | Y | Callback called once the result (capture) is complete. The field `secure` is only returned in secure mode (See [secure mode section](#secure-mode)) |
|
|
83
|
+
| onError | Function | - | - | Callback called when there is an error. See Appendix for the list of error codes we currently support. |
|
|
84
|
+
| onReadyForCapture | Function | - | - | Callback called when the face capture module is ready to take images (Video feed and face scan are ready). |
|
|
85
|
+
| showOverlay | Boolean | `true` | - | Optional use of the face overlay. |
|
|
86
|
+
| resolutionType | String `hd/full_hd` | `hd` | - | Image resolution constraints passed to `getUserMedia`. |
|
|
87
|
+
| format | String | `jpeg` | - | Image format type. |
|
|
88
|
+
| CustomManualButton | Function | simple button | - | Custom UI of the manual capture button. It uses `onClick` and `disabled` as props. |
|
|
89
|
+
| CustomConsentButton | Function | simple button | - | Custom UI of the consent button. It uses `onClick` and `disabled` as props. |
|
|
90
|
+
| imageType | String `original/cropped` | `original` | - | imageType select if the image will be the original or it will be cropped in order to improve the timing response when processing the image in the API call. |
|
|
91
|
+
| qualityType | String `high/medium/low` | `high` | - | Sets the image quality of jpeg format images only. High (1) - Medium (0.96) - Low (0.90). |
|
|
92
|
+
| language | Language code (\*) | `en` | - | The language code to set the language of the feedback messages. |
|
|
93
|
+
| a11yLiveRegionMode | String `assertive/polite` | `polite` | - | Determines the [politeness setting of the live region](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions#live_regions) used to read out prompts for screen reader users |
|
|
94
|
+
| isConsentRequired | Boolean | `false` | - | Makes sure that the user gives consent to the tool to analyse their face. If it is `true`, a button will appear on the bottom section of the module, asking the user for their consent, and not analysing the user face until the consent is given. After this, the button disappears. |
|
|
95
|
+
| faceCaptureAssetsRootUrl | string | `assets/face-capture/` | - | Root url where the face detection assets are located. See [copy assets](#copy-assets) section for assets configuration. |
|
|
88
96
|
|
|
89
97
|
**(\*)**
|
|
90
98
|
Current languages supported:
|
|
@@ -99,7 +107,9 @@ Current languages supported:
|
|
|
99
107
|
- `et`: Estonian
|
|
100
108
|
- `fi`: Finnish
|
|
101
109
|
- `fr`: French
|
|
110
|
+
- `he`: Hebrew
|
|
102
111
|
- `hi`: Hindi
|
|
112
|
+
- `hy`: Armenian
|
|
103
113
|
- `id`: Bahasa
|
|
104
114
|
- `it`: Italian
|
|
105
115
|
- `ja`: Japanese
|
|
@@ -117,6 +127,7 @@ Current languages supported:
|
|
|
117
127
|
- `th`: Thai
|
|
118
128
|
- `tr`: Turkish
|
|
119
129
|
- `uk`: Ukranian
|
|
130
|
+
- `ur`: Urdu
|
|
120
131
|
- `vi`: Vietnamese
|
|
121
132
|
|
|
122
133
|
#### Language fallback
|
|
@@ -175,20 +186,7 @@ The flow for the secure mode is the following:
|
|
|
175
186
|
Where `<version>` is the current version of the FCM (It is embedded in the
|
|
176
187
|
module) and the `<token>` is the session token the first request returns.
|
|
177
188
|
|
|
178
|
-
|
|
179
|
-
sequenceDiagram
|
|
180
|
-
participant A as Browser (FCM)
|
|
181
|
-
participant B as Secure Module Server
|
|
182
|
-
participant C as Integrator back-end
|
|
183
|
-
participant D as Yoti Anti Spoofing Service
|
|
184
|
-
A->>B: Request for a session
|
|
185
|
-
B->>A: New session response
|
|
186
|
-
A->>B: Request for the secure capture module
|
|
187
|
-
B->>A: Secure capture module result
|
|
188
|
-
A->>A: Take picture
|
|
189
|
-
A->>C: Send capture result
|
|
190
|
-
C->>D: Propagate request to the Anti Spoofing service
|
|
191
|
-
```
|
|
189
|
+
|
|
192
190
|
|
|
193
191
|
##### Possible issues
|
|
194
192
|
|
|
@@ -236,6 +234,8 @@ Inside the page you want to have face capture, add Face capture scripts and styl
|
|
|
236
234
|
|
|
237
235
|
Our scripts will give you access to `Yoti.FaceCaptureModule.render` you can pass 2 parameters, first parameters are the props and are the same used in react integration and second parameter you need a html DOM reference so we know where we can render the UI.
|
|
238
236
|
|
|
237
|
+
In order to unmount the component, it is highly recommended to call the `Yoti.FaceCaptureModule.unmount` function instead of destroying the HTML element, as this could lead to some issues or misbehavior.
|
|
238
|
+
|
|
239
239
|
**index.html**
|
|
240
240
|
|
|
241
241
|
```html
|
package/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
.mtcvKOHbFdRFpAH7ZHwW{align-items:center;background-color:#229dff;border:none;border-radius:5px;color:#fff;cursor:pointer;display:block;display:flex;font-size:14px;font-weight:500;justify-content:center;letter-spacing:.5px;margin:auto;min-width:134px;outline:none;padding:12px 20px;text-transform:uppercase;transition:background-color .15s ease-out 0s;width:100%}.mtcvKOHbFdRFpAH7ZHwW.kYH4ilWb5sFtCcwqD29n{max-width:350px;width:45%}.mtcvKOHbFdRFpAH7ZHwW:hover{background-color:#007ee8}.mtcvKOHbFdRFpAH7ZHwW:disabled{background-color:#88caff}.GusgiqC_1nbmjyHkruu0 use{fill:currentColor}.dDcfK_agfQV9XSYSuuxR{align-items:center;bottom:-8px;box-sizing:border-box;display:inline-block;justify-content:center;padding:16px;position:absolute;text-align:center;width:100%}._XKP_3EMO0LKJr53EW21{height:auto;transform:scaleX(-1);width:100%}._cYL8AOtgycwZXRT1onC{min-height:300px}.bX5GJJw3AqsCwBDA6qWZ{visibility:hidden}.RxkomAqHmrdu47_oGii4{bottom:-8px;box-sizing:border-box;display:grid;font-size:40px;grid-template-columns:repeat(3,80px) 50px;justify-content:center;padding:16px;position:absolute;text-align:center;width:100%}.ZSTtG9h6K6_0_axlDNnV,.__OOQVMtxL3v8uCw9eKy,.hwSkw4zQBundKmrqIwqC{color:#333b40;font-family:sans-serif;font-size:40px;font-weight:700;height:50px;line-height:55px;text-align:center;width:51px}.__OOQVMtxL3v8uCw9eKy{opacity:.5}.Gf_S7QnzULbIZZZ7roY2,.OZI1jG8pdtaOfb2ZsB2n,.XOix2SeWtEFksSSmLt9v{fill:#333b40}.Gf_S7QnzULbIZZZ7roY2 use,.OZI1jG8pdtaOfb2ZsB2n use,.XOix2SeWtEFksSSmLt9v use{fill:inherit}.ZSTtG9h6K6_0_axlDNnV svg,.__OOQVMtxL3v8uCw9eKy svg,.hwSkw4zQBundKmrqIwqC svg{font-size:50px}.Gf_S7QnzULbIZZZ7roY2{opacity:.5}.aM6UBOeSFg8vwirw8BEs{position:absolute}.HPEPfcUpwWOVOJSPP9R_{box-sizing:border-box;color:#67717f;height:100%;left:0;position:absolute;right:0}.HPEPfcUpwWOVOJSPP9R_._0fft05LhDRetV8QdNSI{color:#39c48e}.HPEPfcUpwWOVOJSPP9R_.JHe4OqVjOOuBZXJn_axE{color:#ffba37}.xsnSbKRs6MZbpP2odJGk{box-sizing:border-box;position:absolute;width:100%}.xsnSbKRs6MZbpP2odJGk.lSsJ_kvBTJOO0shULKLn{height:43.5%;top:28.3%}.xsnSbKRs6MZbpP2odJGk._6X0Zl0a0b8R2wCqGS_K{height:71.7%;top:11.5%}@keyframes TgYAVlLOGfJ_hl3TBdkC{0%{transform:rotate(0)}to{transform:rotate(1turn)}}.X_Bq5FImnGbO6TLe3Len{align-items:center;display:flex;height:100%;justify-content:center;line-height:0;text-align:center}.WPX6_jcjLpB6aH420ZCd{animation:TgYAVlLOGfJ_hl3TBdkC 1.5s infinite}.bPwt8l_jKvlB2llQ7azY{height:35.71px;width:35.71px}.bPwt8l_jKvlB2llQ7azY use{fill:#333b40}.Ds2gos19dHtdm4Aer1pq{display:flex;height:100%;justify-content:center;position:absolute;top:0;width:100%}.x_r8eQXclQHy5Jjno7pU{display:block;height:100%;margin:auto;position:absolute}.IpX4dJbHat9i3luoCwef{align-items:start;background-color:#fff;border-radius:.3em;box-shadow:0 8px 15px #333b401a;box-sizing:border-box;color:#333b40;display:flex;font-family:sans-serif;font-size:16px;font-size:var(--message-font-size);font-weight:900;justify-content:start;left:50%;padding:.4em 0;position:absolute;text-align:center}.a_0VmnisbKCGWfubHrmj{margin-bottom:50px;top:4.6%;transform:translate(-50%);width:90%}.CqNtyAmFAcDIeu8mRGPD{top:5.5%;transform:translate(-50%);width:51.25%}.rlF15FcuMGotbEHYe5KW{align-items:start;font-size:calc(var(--message-font-size) + 3px)}._CvVxyqwMB2D7fkKx_NZ{display:flex;justify-content:center;order:1;width:14%}._znJxLRvhRnuCU0KBY3_{order:2;width:72%}._2_U2DYHedfGUyvS1oS5{display:flex;flex-direction:column;overflow:hidden;position:relative}.mteIzegCA0cNMXt96BYN{position:relative}.Va8swWS5S29Uvou7UNnc{height:100%;position:absolute;width:100%}
|
package/index.d.ts
ADDED
|
@@ -0,0 +1,181 @@
|
|
|
1
|
+
declare module '@getyoti/react-face-capture' {
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Error codes used by the Face Capture.
|
|
6
|
+
*/
|
|
7
|
+
export enum ERROR_CODE {
|
|
8
|
+
NO_CAMERA_PERMISSION = 'NO_CAMERA_PERMISSION',
|
|
9
|
+
NO_CAMERA = 'NO_CAMERA',
|
|
10
|
+
UNSUPPORTED_BROWSER = 'UNSUPPORTED_BROWSER',
|
|
11
|
+
OVERCONSTRAINED = 'OVERCONSTRAINED',
|
|
12
|
+
GENERIC_CAMERA_ERROR = 'GENERIC_CAMERA_ERROR',
|
|
13
|
+
FACE_DETECTION_INIT_ERROR = 'FACE_DETECTION_INIT_ERROR',
|
|
14
|
+
CAPTURE_LOAD_ERROR = 'CAPTURE_LOAD_ERROR',
|
|
15
|
+
INTERNAL_ERROR = 'INTERNAL_ERROR',
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
/**
|
|
19
|
+
* Capture modes supported by the Face Capture.
|
|
20
|
+
*/
|
|
21
|
+
export enum CAPTURE_METHOD {
|
|
22
|
+
MANUAL = 'manual',
|
|
23
|
+
AUTO = 'auto',
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* Image formats supported by the Face Capture.
|
|
28
|
+
*/
|
|
29
|
+
export enum FORMAT_TYPE {
|
|
30
|
+
PNG = 'png',
|
|
31
|
+
JPEG = 'jpeg',
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* Image types supported by the Face Capture.
|
|
36
|
+
*/
|
|
37
|
+
export enum IMAGE_TYPE {
|
|
38
|
+
ORIGINAL = 'original',
|
|
39
|
+
CROPPED = 'cropped',
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
/**
|
|
43
|
+
* Quality types supported by the Face Capture for the JPEG encoding.
|
|
44
|
+
*/
|
|
45
|
+
export enum QUALITY_TYPE {
|
|
46
|
+
HIGH = 'high',
|
|
47
|
+
MEDIUM = 'medium',
|
|
48
|
+
LOW = 'low',
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
/**
|
|
52
|
+
* Scenarios in which the countdown will be used.
|
|
53
|
+
*/
|
|
54
|
+
export enum COUNTDOWN_MODES {
|
|
55
|
+
ALWAYS = 'always',
|
|
56
|
+
ONLY_MOBILE = 'only_mobile',
|
|
57
|
+
ONLY_DESKTOP = 'only_desktop',
|
|
58
|
+
NEVER = 'never',
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
/**
|
|
62
|
+
* Politeness setting of the live region supported by the Face Capture.
|
|
63
|
+
*/
|
|
64
|
+
export enum A11Y_LIVE_REGION_MODE {
|
|
65
|
+
ASSERTIVE = 'assertive',
|
|
66
|
+
POLITE = 'polite',
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
/**
|
|
70
|
+
* Image resolutions supported by the Face Capture.
|
|
71
|
+
*/
|
|
72
|
+
export enum RESOLUTION_TYPE {
|
|
73
|
+
HD = 'hd',
|
|
74
|
+
FULL_HD = 'full_hd',
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
/**
|
|
78
|
+
* Languages supported by the Face Capture.
|
|
79
|
+
*/
|
|
80
|
+
export enum LANGUAGE_CODE {
|
|
81
|
+
AR = 'ar',
|
|
82
|
+
CS = 'cs',
|
|
83
|
+
DA = 'da',
|
|
84
|
+
DE = 'de',
|
|
85
|
+
EN = 'en',
|
|
86
|
+
ES = 'es',
|
|
87
|
+
ES_419 = 'es-419',
|
|
88
|
+
ET = 'et',
|
|
89
|
+
FI = 'fi',
|
|
90
|
+
FR = 'fr',
|
|
91
|
+
HE = 'he',
|
|
92
|
+
HI = 'hi',
|
|
93
|
+
HY = 'hy',
|
|
94
|
+
ID = 'id',
|
|
95
|
+
IT = 'it',
|
|
96
|
+
JA = 'ja',
|
|
97
|
+
KO = 'ko',
|
|
98
|
+
LT = 'lt',
|
|
99
|
+
LV = 'lv',
|
|
100
|
+
MS = 'ms',
|
|
101
|
+
NB = 'nb',
|
|
102
|
+
NL = 'nl',
|
|
103
|
+
PL = 'pl',
|
|
104
|
+
PT = 'pt',
|
|
105
|
+
RO = 'ro',
|
|
106
|
+
RU = 'ru',
|
|
107
|
+
SV = 'sv',
|
|
108
|
+
TH = 'th',
|
|
109
|
+
TR = 'tr',
|
|
110
|
+
UK = 'uk',
|
|
111
|
+
UR = 'ur',
|
|
112
|
+
VI = 'vi',
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* Secure information the Face Capture will provide as result when it takes a picture (onSuccess callback). Only when the secure prop is set to true.
|
|
117
|
+
*/
|
|
118
|
+
export interface Secure {
|
|
119
|
+
version: string;
|
|
120
|
+
token: string;
|
|
121
|
+
signature: string;
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
/**
|
|
125
|
+
* Result entity the FCM will return on the onSuccess callback.
|
|
126
|
+
*/
|
|
127
|
+
export interface FCMResult {
|
|
128
|
+
img: string;
|
|
129
|
+
secure?: Secure;
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
/**
|
|
133
|
+
* Face Capture properties.
|
|
134
|
+
*/
|
|
135
|
+
export interface FaceCaptureProps {
|
|
136
|
+
/** Root url where assets for the face detection are located. */
|
|
137
|
+
faceCaptureAssetsRootUrl?: string;
|
|
138
|
+
/** Capture method to take the photo: by clicking a button or auto-capture. (default:auto) */
|
|
139
|
+
captureMethod?: CAPTURE_METHOD;
|
|
140
|
+
/** If true, the face capture module will use the secure mode. (default:false) */
|
|
141
|
+
secure?: boolean;
|
|
142
|
+
/** Callback called once the result (capture) is complete. */
|
|
143
|
+
onSuccess: (e: FCMResult) => void;
|
|
144
|
+
/** Callback called when there is an error. */
|
|
145
|
+
onError?: (e: ERROR_CODE) => void;
|
|
146
|
+
/** Callback called when the face capture module is ready to take images. */
|
|
147
|
+
onReadyForCapture?: () => void;
|
|
148
|
+
/** Optional use of the face overlay (default: true) */
|
|
149
|
+
showOverlay?: boolean;
|
|
150
|
+
/** Image resolution constraints passed to getUserMedia. (default:HD) */
|
|
151
|
+
resolutionType?: RESOLUTION_TYPE;
|
|
152
|
+
/** Image format type. (default:jpeg) */
|
|
153
|
+
format?: FORMAT_TYPE;
|
|
154
|
+
/** Custom UI of the manual capture button. It uses onClick and disabled as props */
|
|
155
|
+
CustomManualButton?: (props: any) => JSX.Element;
|
|
156
|
+
/** Custom UI of the consent button. It uses onClick and disabled as props */
|
|
157
|
+
CustomConsentButton?: (props: any) => JSX.Element;
|
|
158
|
+
/** Indicates when the countdown will be used. Note: It's only used if captureMethod is set to manual. (default:never) */
|
|
159
|
+
countdownMode?: COUNTDOWN_MODES;
|
|
160
|
+
/** imageType select if the image will be the original or it will be cropped in order to improve the timing
|
|
161
|
+
response when processing the image in the API call. (default:original) */
|
|
162
|
+
imageType?: IMAGE_TYPE;
|
|
163
|
+
/** Sets the image quality of jpeg format images only. High (1) - Medium (0.96) - Low (0.90). (default:high) */
|
|
164
|
+
qualityType?: QUALITY_TYPE;
|
|
165
|
+
/** The language code to set the language of the feedback messages. (default:en) */
|
|
166
|
+
language?: LANGUAGE_CODE;
|
|
167
|
+
/** Determines the politeness setting of the live region used to read out prompts for screen reader users. (default:polite) */
|
|
168
|
+
a11yLiveRegionMode?: A11Y_LIVE_REGION_MODE;
|
|
169
|
+
/** isConsentRequired Adds a step to click a button to ensure the user gives consent to the tool to start the face capture process. (default:false) */
|
|
170
|
+
isConsentRequired?: boolean;
|
|
171
|
+
/** Indicates if the face capture will use the manual capture method because of slow performance. (default:true) */
|
|
172
|
+
manualCaptureFallback?: boolean;
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
/**
|
|
176
|
+
* Module to capture a face and return the output image.
|
|
177
|
+
*/
|
|
178
|
+
const FaceCapture: React.FC<FaceCaptureProps>;
|
|
179
|
+
|
|
180
|
+
export default FaceCapture;
|
|
181
|
+
}
|