@smileid/web-components 10.0.6 → 11.0.1

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.
Files changed (142) hide show
  1. package/README.md +15 -15
  2. package/dist/README.md +15 -0
  3. package/dist/components/README.md +14 -0
  4. package/dist/components/document/src/README.md +111 -0
  5. package/dist/components/document/src/document-capture/README.md +90 -0
  6. package/dist/components/document/src/document-capture-instructions/README.md +56 -0
  7. package/dist/components/document/src/document-capture-review/README.md +79 -0
  8. package/dist/components/selfie/README.md +225 -0
  9. package/dist/components/smart-camera-web/src/README.md +207 -0
  10. package/dist/domain/camera/src/README.md +38 -0
  11. package/dist/domain/file-upload/README.md +35 -0
  12. package/dist/esm/{DocumentCaptureScreens-BjATTDqu.js → DocumentCaptureScreens-DmH2JZDA.js} +3 -3
  13. package/dist/esm/DocumentCaptureScreens-DmH2JZDA.js.map +1 -0
  14. package/dist/esm/EndUserConsent-D4fd1ovG.js.map +1 -1
  15. package/dist/esm/Navigation-CTjK6tLU.js.map +1 -1
  16. package/dist/esm/PoweredBySmileId-CxbaihMu.js.map +1 -1
  17. package/dist/esm/SelfieCaptureScreens-DbdN2zNk.js +7901 -0
  18. package/dist/esm/SelfieCaptureScreens-DbdN2zNk.js.map +1 -0
  19. package/dist/esm/SignaturePad-C7MtmT8m.js.map +1 -1
  20. package/dist/esm/TotpConsent-CQU5jQi4.js.map +1 -1
  21. package/dist/esm/combobox.js.map +1 -1
  22. package/dist/esm/document.js +1 -1
  23. package/dist/esm/main.js +2 -2
  24. package/dist/esm/{package-CZlW6BZn.js → package-bgeQiff6.js} +2 -2
  25. package/dist/esm/package-bgeQiff6.js.map +1 -0
  26. package/dist/esm/selfie.js +1 -1
  27. package/dist/esm/smart-camera-web.js +3 -3
  28. package/dist/esm/smart-camera-web.js.map +1 -1
  29. package/dist/esm/styles-BOEZtbuc.js.map +1 -1
  30. package/dist/package-lock.json +4948 -0
  31. package/dist/package.json +59 -0
  32. package/dist/smart-camera-web.js +72 -98
  33. package/dist/smart-camera-web.js.gz +0 -0
  34. package/dist/smart-camera-web.js.map +1 -1
  35. package/dist/src/components/combobox/src/index.js +2 -0
  36. package/dist/src/components/combobox/src/index.js.map +7 -0
  37. package/dist/src/components/document/src/index.js +2 -0
  38. package/dist/src/components/document/src/index.js.map +7 -0
  39. package/dist/src/components/end-user-consent/src/index.js +14 -0
  40. package/dist/src/components/end-user-consent/src/index.js.map +7 -0
  41. package/dist/src/components/selfie/src/index.js +2 -0
  42. package/dist/src/components/selfie/src/index.js.map +7 -0
  43. package/dist/src/components/signature-pad/src/index.js +10 -0
  44. package/dist/src/components/signature-pad/src/index.js.map +7 -0
  45. package/dist/src/components/smart-camera-web/src/SmartCameraWeb.js +2 -0
  46. package/dist/src/components/smart-camera-web/src/SmartCameraWeb.js.map +7 -0
  47. package/dist/src/components/totp-consent/src/index.js +14 -0
  48. package/dist/src/components/totp-consent/src/index.js.map +7 -0
  49. package/dist/src/index.js.map +7 -0
  50. package/dist/styles/README.md +3 -0
  51. package/dist/types/combobox.d.ts +19 -19
  52. package/dist/types/document.d.ts +19 -19
  53. package/dist/types/end-user-consent.d.ts +19 -19
  54. package/dist/types/main.d.ts +24 -20
  55. package/dist/types/navigation.d.ts +19 -19
  56. package/dist/types/selfie.d.ts +19 -19
  57. package/dist/types/signature-pad.d.ts +19 -19
  58. package/dist/types/smart-camera-web.d.ts +19 -19
  59. package/dist/types/totp-consent.d.ts +19 -19
  60. package/lib/components/README.md +14 -14
  61. package/lib/components/attribution/PoweredBySmileId.js +42 -42
  62. package/lib/components/camera-permission/CameraPermission.js +139 -139
  63. package/lib/components/camera-permission/CameraPermission.stories.js +27 -27
  64. package/lib/components/combobox/src/Combobox.js +589 -589
  65. package/lib/components/combobox/src/index.js +1 -1
  66. package/lib/components/document/src/DocumentCaptureScreens.js +410 -409
  67. package/lib/components/document/src/DocumentCaptureScreens.stories.js +57 -57
  68. package/lib/components/document/src/README.md +111 -111
  69. package/lib/components/document/src/document-capture/DocumentCapture.js +760 -760
  70. package/lib/components/document/src/document-capture/DocumentCapture.stories.js +78 -78
  71. package/lib/components/document/src/document-capture/README.md +90 -90
  72. package/lib/components/document/src/document-capture/index.js +3 -3
  73. package/lib/components/document/src/document-capture-instructions/DocumentCaptureInstructions.js +545 -545
  74. package/lib/components/document/src/document-capture-instructions/DocumentCaptureInstructions.stories.js +24 -24
  75. package/lib/components/document/src/document-capture-instructions/README.md +56 -56
  76. package/lib/components/document/src/document-capture-instructions/index.js +3 -3
  77. package/lib/components/document/src/document-capture-review/DocumentCaptureReview.js +360 -360
  78. package/lib/components/document/src/document-capture-review/DocumentCaptureReview.stories.js +24 -24
  79. package/lib/components/document/src/document-capture-review/README.md +79 -79
  80. package/lib/components/document/src/document-capture-review/index.js +3 -3
  81. package/lib/components/document/src/index.js +3 -3
  82. package/lib/components/end-user-consent/src/EndUserConsent.js +795 -795
  83. package/lib/components/end-user-consent/src/EndUserConsent.stories.js +29 -29
  84. package/lib/components/end-user-consent/src/index.js +4 -4
  85. package/lib/components/navigation/src/Navigation.js +171 -171
  86. package/lib/components/navigation/src/Navigation.stories.js +24 -24
  87. package/lib/components/navigation/src/index.js +3 -3
  88. package/lib/components/selfie/README.md +225 -225
  89. package/lib/components/selfie/src/SelfieCaptureScreens.js +420 -431
  90. package/lib/components/selfie/src/SelfieCaptureScreens.stories.js +29 -29
  91. package/lib/components/selfie/src/index.js +3 -3
  92. package/lib/components/selfie/src/selfie-capture/SelfieCapture.js +1099 -1084
  93. package/lib/components/selfie/src/selfie-capture/SelfieCapture.stories.js +36 -36
  94. package/lib/components/selfie/src/selfie-capture/index.js +3 -3
  95. package/lib/components/selfie/src/selfie-capture-instructions/SelfieCaptureInstructions.js +689 -689
  96. package/lib/components/selfie/src/selfie-capture-instructions/SelfieCaptureInstructions.stories.js +23 -23
  97. package/lib/components/selfie/src/selfie-capture-instructions/index.js +3 -3
  98. package/lib/components/selfie/src/selfie-capture-review/SelfieCaptureReview.js +209 -209
  99. package/lib/components/selfie/src/selfie-capture-review/SelfieCaptureReview.stories.js +24 -24
  100. package/lib/components/selfie/src/selfie-capture-review/index.js +3 -3
  101. package/lib/components/selfie/src/selfie-capture-wrapper/SelfieCaptureWrapper.tsx +256 -239
  102. package/lib/components/selfie/src/selfie-capture-wrapper/index.ts +1 -1
  103. package/lib/components/selfie/src/smartselfie-capture/OvalProgress.tsx +81 -81
  104. package/lib/components/selfie/src/smartselfie-capture/SmartSelfieCapture.tsx +265 -283
  105. package/lib/components/selfie/src/smartselfie-capture/components/AlertDisplay.tsx +34 -34
  106. package/lib/components/selfie/src/smartselfie-capture/components/CameraPreview.tsx +97 -97
  107. package/lib/components/selfie/src/smartselfie-capture/components/CaptureControls.tsx +78 -76
  108. package/lib/components/selfie/src/smartselfie-capture/components/index.ts +3 -3
  109. package/lib/components/selfie/src/smartselfie-capture/constants.ts +23 -23
  110. package/lib/components/selfie/src/smartselfie-capture/hooks/index.ts +2 -2
  111. package/lib/components/selfie/src/smartselfie-capture/hooks/useCamera.ts +238 -238
  112. package/lib/components/selfie/src/smartselfie-capture/hooks/useFaceCapture.ts +618 -617
  113. package/lib/components/selfie/src/smartselfie-capture/index.ts +1 -1
  114. package/lib/components/selfie/src/smartselfie-capture/utils/alertMessages.ts +13 -13
  115. package/lib/components/selfie/src/smartselfie-capture/utils/canvas.ts +105 -105
  116. package/lib/components/selfie/src/smartselfie-capture/utils/faceDetection.ts +129 -129
  117. package/lib/components/selfie/src/smartselfie-capture/utils/imageCapture.ts +64 -64
  118. package/lib/components/selfie/src/smartselfie-capture/utils/index.ts +4 -4
  119. package/lib/components/selfie/src/smartselfie-capture/utils/mediapipeManager.ts +77 -77
  120. package/lib/components/signature-pad/package-lock.json +3009 -3009
  121. package/lib/components/signature-pad/package.json +30 -30
  122. package/lib/components/signature-pad/src/SignaturePad.js +484 -484
  123. package/lib/components/signature-pad/src/SignaturePad.stories.js +32 -32
  124. package/lib/components/signature-pad/src/index.js +3 -3
  125. package/lib/components/smart-camera-web/src/README.md +206 -206
  126. package/lib/components/smart-camera-web/src/SmartCameraWeb.js +305 -305
  127. package/lib/components/smart-camera-web/src/SmartCameraWeb.stories.js +57 -57
  128. package/lib/components/totp-consent/src/TotpConsent.js +949 -949
  129. package/lib/components/totp-consent/src/index.js +4 -4
  130. package/lib/domain/camera/src/README.md +38 -38
  131. package/lib/domain/camera/src/SmartCamera.js +109 -109
  132. package/lib/domain/constants/src/Constants.js +27 -27
  133. package/lib/domain/file-upload/README.md +35 -35
  134. package/lib/domain/file-upload/src/SmartFileUpload.js +65 -65
  135. package/lib/styles/README.md +3 -3
  136. package/lib/styles/src/styles.js +372 -372
  137. package/lib/styles/src/typography.js +52 -52
  138. package/package.json +111 -112
  139. package/dist/esm/DocumentCaptureScreens-BjATTDqu.js.map +0 -1
  140. package/dist/esm/SelfieCaptureScreens-UUzZzl1A.js +0 -11361
  141. package/dist/esm/SelfieCaptureScreens-UUzZzl1A.js.map +0 -1
  142. package/dist/esm/package-CZlW6BZn.js.map +0 -1
@@ -1,57 +1,57 @@
1
- import './index';
2
-
3
- const meta = {
4
- args: {
5
- 'hide-attribution': false,
6
- 'theme-color': '#001096',
7
- },
8
- argTypes: {
9
- 'hide-attribution': { control: 'boolean' },
10
- 'theme-color': { control: 'color' },
11
- },
12
- component: 'document-capture-screens',
13
- };
14
-
15
- export default meta;
16
-
17
- export const DocumentCapture = {
18
- render: (args) => `
19
- <document-capture-screens theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
20
- </document-capture-screens>
21
- `,
22
- };
23
-
24
- export const DocumentCaptureHiddenInstructions = {
25
- render: (args) => `
26
- <document-capture-screens hide-instructions theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
27
- </document-capture-screens>
28
- `,
29
- };
30
-
31
- export const DocumentCaptureHideBackOfId = {
32
- render: (args) => `
33
- <document-capture-screens hide-back-of-id theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
34
- </document-capture-screens>
35
- `,
36
- };
37
-
38
- export const DocumentCaptureAllowAttributes = {
39
- render: (args) => `
40
- <document-capture-screens document-capture-screens-modes='camera,upload' theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
41
- </document-capture-screens>
42
- `,
43
- };
44
-
45
- export const DocumentCaptureHideInstructionNBackOfId = {
46
- render: (args) => `
47
- <document-capture-screens hide-back-of-id hide-instructions theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
48
- </document-capture-screens>
49
- `,
50
- };
51
-
52
- export const DocumentCapturePortraitMode = {
53
- render: () => `
54
- <document-capture-screens hide-back-of-id hide-instructions document-type="GREEN_BOOK">
55
- </document-capture-screens>
56
- `,
57
- };
1
+ import './index';
2
+
3
+ const meta = {
4
+ args: {
5
+ 'hide-attribution': false,
6
+ 'theme-color': '#001096',
7
+ },
8
+ argTypes: {
9
+ 'hide-attribution': { control: 'boolean' },
10
+ 'theme-color': { control: 'color' },
11
+ },
12
+ component: 'document-capture-screens',
13
+ };
14
+
15
+ export default meta;
16
+
17
+ export const DocumentCapture = {
18
+ render: (args) => `
19
+ <document-capture-screens theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
20
+ </document-capture-screens>
21
+ `,
22
+ };
23
+
24
+ export const DocumentCaptureHiddenInstructions = {
25
+ render: (args) => `
26
+ <document-capture-screens hide-instructions theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
27
+ </document-capture-screens>
28
+ `,
29
+ };
30
+
31
+ export const DocumentCaptureHideBackOfId = {
32
+ render: (args) => `
33
+ <document-capture-screens hide-back-of-id theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
34
+ </document-capture-screens>
35
+ `,
36
+ };
37
+
38
+ export const DocumentCaptureAllowAttributes = {
39
+ render: (args) => `
40
+ <document-capture-screens document-capture-screens-modes='camera,upload' theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
41
+ </document-capture-screens>
42
+ `,
43
+ };
44
+
45
+ export const DocumentCaptureHideInstructionNBackOfId = {
46
+ render: (args) => `
47
+ <document-capture-screens hide-back-of-id hide-instructions theme-color='${args['theme-color']}' ${args['hide-attribution'] ? 'hide-attribution' : ''}>
48
+ </document-capture-screens>
49
+ `,
50
+ };
51
+
52
+ export const DocumentCapturePortraitMode = {
53
+ render: () => `
54
+ <document-capture-screens hide-back-of-id hide-instructions document-type="GREEN_BOOK">
55
+ </document-capture-screens>
56
+ `,
57
+ };
@@ -1,111 +1,111 @@
1
- # DocumentCapture Web Component
2
-
3
- ## Overview
4
-
5
- The `DocumentCaptureScreens` is a bespoke web component designed for capturing document images using a camera. It leverages the `SmartCamera` module for camera interaction and permission management.
6
- This component contains the flow for capturing both front and the back of id documents.
7
-
8
- ### Importing the Component
9
-
10
- To utilize the `DocumentCaptureScreens` component within your project, import it into your JavaScript file as follows:
11
-
12
- ```js
13
- import '@smileid/components/document-capture';
14
- ```
15
-
16
- ### Using the Component
17
-
18
- The DocumentCapture component can be embedded in your HTML similarly to any standard HTML element:
19
-
20
- ```html
21
- <document-capture-screens></document-capture-screens>
22
- ```
23
-
24
- ### Attributes
25
-
26
- Customize the component's behavior with the following attributes:
27
-
28
- #### `hide-instructions`
29
-
30
- Omits the capture instructions. This attribute is boolean and does not require a value.
31
-
32
- ```html
33
- <document-capture-screens hide-instructions></document-capture-screens>
34
- ```
35
-
36
- #### `hide-back-of-id`
37
-
38
- Excludes the option to capture the ID's back side. This attribute is boolean.
39
-
40
- ```html
41
- <document-capture-screens hide-back-of-id></document-capture-screens>
42
- ```
43
-
44
- #### `show-navigation`
45
-
46
- Displays navigation controls for the capture process. This attribute is boolean.
47
-
48
- ```html
49
- <document-capture-screens show-navigation></document-capture-screens>
50
- ```
51
-
52
- #### `document-capture-modes`
53
-
54
- Specifies the capture modes, accepting `camera`, `upload`, or both. Value required.
55
-
56
- ```html
57
- <document-capture-screens
58
- document-capture-modes="camera,upload"
59
- ></document-capture-screens>
60
- ```
61
-
62
- ### Permissions
63
-
64
- Camera permissions are essential for functionality. The component requests permissions automatically. Upon granting, `data-camera-ready` is set to true, and `data-camera-error` is removed. Denied permissions result in `data-camera-error` being set with an error message.
65
-
66
- For manual permission handling, appropriately set `data-camera-ready` and `data-camera-error`.
67
-
68
- ### Error Handling
69
-
70
- Errors during permission requests or document capture are managed by the component, setting `data-camera-error` with the respective error message.
71
-
72
- ### Event Handlers
73
-
74
- Capture events emit `document-capture-screens.publish`, providing captured images and metadata:
75
-
76
- ```json
77
- {
78
- "detail": {
79
- "images": [{ "image": "base64-encoded image", "image_type_id": "" }],
80
- "meta": {
81
- "version": "library version"
82
- }
83
- }
84
- }
85
- ```
86
-
87
- To handle this event:
88
-
89
- ```js
90
- document
91
- .querySelector('document-capture-screens')
92
- .addEventListener('document-capture-screens.publish', function (event) {
93
- console.log(event.detail);
94
- });
95
- ```
96
-
97
- ### Dependencies
98
-
99
- `DocumentCaptureScreens` relies on the following modules:
100
-
101
- - [document-capture-instructions](./document-capture-instructions/README.md)
102
- - [document-capture](./document-capture/README.md)
103
- - [document-capture-review](./document-capture-review/README.md)
104
- - [SmartCamera](../../../domain/camera/src/README.md)
105
- - [FileUpload](../../../domain/file-upload/README.md)
106
-
107
- These dependencies are automatically imported with the component.
108
-
109
- ### Compatibility
110
-
111
- Designed for modern browsers supporting custom web components, with specific enhancements for multi-camera Samsung devices to prevent blurry image edges. Report compatibility issues with other devices to our support team.
1
+ # DocumentCapture Web Component
2
+
3
+ ## Overview
4
+
5
+ The `DocumentCaptureScreens` is a bespoke web component designed for capturing document images using a camera. It leverages the `SmartCamera` module for camera interaction and permission management.
6
+ This component contains the flow for capturing both front and the back of id documents.
7
+
8
+ ### Importing the Component
9
+
10
+ To utilize the `DocumentCaptureScreens` component within your project, import it into your JavaScript file as follows:
11
+
12
+ ```js
13
+ import '@smileid/components/document-capture';
14
+ ```
15
+
16
+ ### Using the Component
17
+
18
+ The DocumentCapture component can be embedded in your HTML similarly to any standard HTML element:
19
+
20
+ ```html
21
+ <document-capture-screens></document-capture-screens>
22
+ ```
23
+
24
+ ### Attributes
25
+
26
+ Customize the component's behavior with the following attributes:
27
+
28
+ #### `hide-instructions`
29
+
30
+ Omits the capture instructions. This attribute is boolean and does not require a value.
31
+
32
+ ```html
33
+ <document-capture-screens hide-instructions></document-capture-screens>
34
+ ```
35
+
36
+ #### `hide-back-of-id`
37
+
38
+ Excludes the option to capture the ID's back side. This attribute is boolean.
39
+
40
+ ```html
41
+ <document-capture-screens hide-back-of-id></document-capture-screens>
42
+ ```
43
+
44
+ #### `show-navigation`
45
+
46
+ Displays navigation controls for the capture process. This attribute is boolean.
47
+
48
+ ```html
49
+ <document-capture-screens show-navigation></document-capture-screens>
50
+ ```
51
+
52
+ #### `document-capture-modes`
53
+
54
+ Specifies the capture modes, accepting `camera`, `upload`, or both. Value required.
55
+
56
+ ```html
57
+ <document-capture-screens
58
+ document-capture-modes="camera,upload"
59
+ ></document-capture-screens>
60
+ ```
61
+
62
+ ### Permissions
63
+
64
+ Camera permissions are essential for functionality. The component requests permissions automatically. Upon granting, `data-camera-ready` is set to true, and `data-camera-error` is removed. Denied permissions result in `data-camera-error` being set with an error message.
65
+
66
+ For manual permission handling, appropriately set `data-camera-ready` and `data-camera-error`.
67
+
68
+ ### Error Handling
69
+
70
+ Errors during permission requests or document capture are managed by the component, setting `data-camera-error` with the respective error message.
71
+
72
+ ### Event Handlers
73
+
74
+ Capture events emit `document-capture-screens.publish`, providing captured images and metadata:
75
+
76
+ ```json
77
+ {
78
+ "detail": {
79
+ "images": [{ "image": "base64-encoded image", "image_type_id": "" }],
80
+ "meta": {
81
+ "version": "library version"
82
+ }
83
+ }
84
+ }
85
+ ```
86
+
87
+ To handle this event:
88
+
89
+ ```js
90
+ document
91
+ .querySelector('document-capture-screens')
92
+ .addEventListener('document-capture-screens.publish', function (event) {
93
+ console.log(event.detail);
94
+ });
95
+ ```
96
+
97
+ ### Dependencies
98
+
99
+ `DocumentCaptureScreens` relies on the following modules:
100
+
101
+ - [document-capture-instructions](./document-capture-instructions/README.md)
102
+ - [document-capture](./document-capture/README.md)
103
+ - [document-capture-review](./document-capture-review/README.md)
104
+ - [SmartCamera](../../../domain/camera/src/README.md)
105
+ - [FileUpload](../../../domain/file-upload/README.md)
106
+
107
+ These dependencies are automatically imported with the component.
108
+
109
+ ### Compatibility
110
+
111
+ Designed for modern browsers supporting custom web components, with specific enhancements for multi-camera Samsung devices to prevent blurry image edges. Report compatibility issues with other devices to our support team.