@incodetech/prizma-core-screens 0.2.7 → 0.2.14
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/dist/BiometricConsentScreen.d.ts +95 -0
- package/dist/BiometricConsentScreen.js +91 -0
- package/dist/BiometricConsentStrings.d.ts +84 -0
- package/dist/BiometricConsentStrings.js +31 -0
- package/dist/CaptureScreen.d.ts +13 -0
- package/dist/CaptureScreen.js +2 -2
- package/dist/DemoScreensLayout.css +16 -0
- package/dist/DemoScreensRedirectScreen.d.ts +6 -1
- package/dist/DemoScreensRedirectScreen.js +3 -2
- package/dist/DemoScreensStrings.d.ts +5 -0
- package/dist/DigitalIdDeviceWalletsDocumentSelectionScreen.d.ts +34 -0
- package/dist/DigitalIdDeviceWalletsDocumentSelectionScreen.js +47 -0
- package/dist/DigitalIdDeviceWalletsResultScreen.d.ts +28 -0
- package/dist/DigitalIdDeviceWalletsResultScreen.js +23 -0
- package/dist/DigitalIdDeviceWalletsStrings.d.ts +55 -0
- package/dist/DigitalIdDeviceWalletsStrings.js +19 -0
- package/dist/DigitalIdProvidersDocumentSelectionScreen.d.ts +31 -0
- package/dist/DigitalIdProvidersDocumentSelectionScreen.js +37 -0
- package/dist/DigitalIdProvidersErrorScreen.d.ts +33 -0
- package/dist/DigitalIdProvidersErrorScreen.js +33 -0
- package/dist/DigitalIdProvidersLayout.css +59 -0
- package/dist/DigitalIdProvidersRedirectScreen.d.ts +24 -0
- package/dist/DigitalIdProvidersRedirectScreen.js +18 -0
- package/dist/DigitalIdProvidersStrings.d.ts +72 -0
- package/dist/DigitalIdProvidersStrings.js +15 -0
- package/dist/DigitalIdUploadErrorScreen.d.ts +31 -0
- package/dist/DigitalIdUploadErrorScreen.js +26 -0
- package/dist/DigitalIdUploadFileTooLargeScreen.d.ts +27 -0
- package/dist/DigitalIdUploadFileTooLargeScreen.js +21 -0
- package/dist/DigitalIdUploadReviewScreen.d.ts +57 -0
- package/dist/DigitalIdUploadReviewScreen.js +44 -0
- package/dist/DigitalIdUploadStrings.d.ts +64 -0
- package/dist/DigitalIdUploadStrings.js +19 -0
- package/dist/DigitalIdUploadTutorialScreen.d.ts +28 -0
- package/dist/DigitalIdUploadTutorialScreen.js +23 -0
- package/dist/DocumentCaptureIllustration.d.ts +1 -1
- package/dist/EkybCountryScreen.d.ts +6 -6
- package/dist/EkybCountryScreen.js +20 -7
- package/dist/EkybStrings.d.ts +6 -1
- package/dist/ErrorScreensScreen.d.ts +5 -2
- package/dist/ErrorScreensScreen.js +15 -4
- package/dist/ErrorScreensStrings.d.ts +17 -2
- package/dist/ErrorScreensStrings.js +18 -10
- package/dist/FaceCaptureCapturingScreen.d.ts +63 -0
- package/dist/FaceCaptureCapturingScreen.js +62 -2
- package/dist/FaceCaptureLayout.css +69 -4
- package/dist/FaceCaptureStrings.d.ts +23 -0
- package/dist/FormScreen.css +14 -0
- package/dist/FormScreen.d.ts +28 -0
- package/dist/FormScreen.js +3 -2
- package/dist/IdCaptureLayout.css +165 -2
- package/dist/IdCaptureStageScreen.d.ts +47 -0
- package/dist/IdCaptureStageScreen.js +39 -3
- package/dist/IdCaptureStrings.d.ts +19 -0
- package/dist/ListScreen.d.ts +19 -0
- package/dist/ListScreen.js +7 -2
- package/dist/LoaderScreen.d.ts +7 -5
- package/dist/LoaderScreen.js +7 -5
- package/dist/LoadersStrings.d.ts +18 -5
- package/dist/OcrReviewErrorScreen.d.ts +30 -0
- package/dist/OcrReviewErrorScreen.js +24 -0
- package/dist/OcrReviewLayout.css +24 -0
- package/dist/OcrReviewLoadingScreen.d.ts +25 -0
- package/dist/OcrReviewLoadingScreen.js +19 -0
- package/dist/OcrReviewScreen.d.ts +76 -0
- package/dist/OcrReviewScreen.js +65 -0
- package/dist/OcrReviewStrings.d.ts +47 -0
- package/dist/OcrReviewStrings.js +17 -0
- package/dist/OcrReviewSuccessScreen.d.ts +30 -0
- package/dist/OcrReviewSuccessScreen.js +24 -0
- package/dist/PermissionsAllowScreen.d.ts +8 -11
- package/dist/PermissionsAllowScreen.js +8 -11
- package/dist/PermissionsAskScreen.d.ts +41 -0
- package/dist/PermissionsAskScreen.js +43 -0
- package/dist/PermissionsBrowserStepsScreen.d.ts +9 -2
- package/dist/PermissionsBrowserStepsScreen.js +12 -3
- package/dist/PermissionsLayout.css +47 -0
- package/dist/PermissionsStrings.d.ts +20 -9
- package/dist/PermissionsStrings.js +10 -4
- package/dist/PhoneInputOtpScreen.d.ts +8 -0
- package/dist/PhoneInputOtpScreen.js +26 -19
- package/dist/PhoneInputStrings.d.ts +11 -3
- package/dist/PhoneInputVerifyScreen.js +21 -5
- package/dist/QualifiedSignatureDocumentScreen.d.ts +8 -5
- package/dist/QualifiedSignatureDocumentScreen.js +9 -6
- package/dist/QualifiedSignatureResultScreen.d.ts +16 -13
- package/dist/QualifiedSignatureResultScreen.js +17 -18
- package/dist/QualifiedSignatureStrings.d.ts +11 -4
- package/dist/ResultScreen.d.ts +8 -0
- package/dist/ResultScreen.js +14 -3
- package/dist/ReusabilityCredentialSelectionScreen.d.ts +95 -0
- package/dist/ReusabilityCredentialSelectionScreen.js +94 -0
- package/dist/ReusabilityLayout.css +241 -0
- package/dist/ReusabilityPrivacyPolicyScreen.d.ts +55 -0
- package/dist/ReusabilityPrivacyPolicyScreen.js +44 -0
- package/dist/ReusabilityStrings.d.ts +85 -0
- package/dist/ReusabilityStrings.js +37 -0
- package/dist/ReviewScreen.d.ts +38 -12
- package/dist/ReviewScreen.js +41 -8
- package/dist/ScreenLayout.css +382 -6
- package/dist/VideoSelfieErrorScreen.js +1 -1
- package/dist/VideoSelfieIdCaptureScreen.js +1 -1
- package/dist/VideoSelfieLayout.css +304 -2
- package/dist/VideoSelfieSelfieCaptureScreen.js +1 -1
- package/dist/VideoSelfieSpeakScreen.js +1 -1
- package/dist/VideoSelfieStrings.d.ts +4 -1
- package/dist/VideoSelfieTurnHeadScreen.js +14 -11
- package/dist/VideoSelfieTutorialScreen.d.ts +9 -0
- package/dist/VideoSelfieTutorialScreen.js +10 -1
- package/dist/VideoSelfieWaveScreen.js +1 -1
- package/dist/ViewfinderScreen.css +36 -0
- package/dist/flows.d.ts +8 -0
- package/dist/flows.js +17 -0
- package/dist/index.d.ts +23 -0
- package/dist/index.js +17 -0
- package/dist/styles.css +4 -0
- package/package.json +94 -3
- package/samples/video-selfie-camera-wide.jpg +0 -0
- package/samples/video-selfie-room-wide.jpg +0 -0
- package/src/BiometricConsentScreen.tsx +192 -0
- package/src/BiometricConsentStrings.ts +119 -0
- package/src/CaptureScreen.tsx +17 -0
- package/src/DemoScreensLayout.css +16 -0
- package/src/DemoScreensRedirectScreen.tsx +14 -6
- package/src/DemoScreensStrings.ts +5 -0
- package/src/DigitalIdDeviceWalletsDocumentSelectionScreen.tsx +108 -0
- package/src/DigitalIdDeviceWalletsResultScreen.tsx +76 -0
- package/src/DigitalIdDeviceWalletsStrings.ts +80 -0
- package/src/DigitalIdProvidersDocumentSelectionScreen.tsx +112 -0
- package/src/DigitalIdProvidersErrorScreen.tsx +104 -0
- package/src/DigitalIdProvidersLayout.css +59 -0
- package/src/DigitalIdProvidersRedirectScreen.tsx +65 -0
- package/src/DigitalIdProvidersStrings.ts +98 -0
- package/src/DigitalIdUploadErrorScreen.tsx +83 -0
- package/src/DigitalIdUploadFileTooLargeScreen.tsx +67 -0
- package/src/DigitalIdUploadReviewScreen.tsx +119 -0
- package/src/DigitalIdUploadStrings.ts +88 -0
- package/src/DigitalIdUploadTutorialScreen.tsx +59 -0
- package/src/DocumentCaptureIllustration.tsx +1 -1
- package/src/EkybCountryScreen.tsx +23 -6
- package/src/EkybStrings.ts +6 -1
- package/src/ErrorScreensScreen.tsx +15 -4
- package/src/ErrorScreensStrings.ts +37 -12
- package/src/FaceCaptureCapturingScreen.tsx +102 -13
- package/src/FaceCaptureLayout.css +69 -4
- package/src/FaceCaptureStrings.ts +24 -0
- package/src/FormScreen.css +14 -0
- package/src/FormScreen.tsx +34 -0
- package/src/IdCaptureLayout.css +165 -2
- package/src/IdCaptureStageScreen.tsx +75 -0
- package/src/IdCaptureStrings.ts +19 -0
- package/src/ListScreen.tsx +48 -9
- package/src/LoaderScreen.tsx +7 -5
- package/src/LoadersStrings.ts +18 -5
- package/src/OcrReviewErrorScreen.tsx +53 -0
- package/src/OcrReviewLayout.css +24 -0
- package/src/OcrReviewLoadingScreen.tsx +48 -0
- package/src/OcrReviewScreen.tsx +190 -0
- package/src/OcrReviewStrings.ts +69 -0
- package/src/OcrReviewSuccessScreen.tsx +52 -0
- package/src/PermissionsAllowScreen.tsx +9 -10
- package/src/PermissionsAskScreen.tsx +105 -0
- package/src/PermissionsBrowserStepsScreen.tsx +11 -3
- package/src/PermissionsLayout.css +47 -0
- package/src/PermissionsStrings.ts +42 -12
- package/src/PhoneInputOtpScreen.tsx +23 -3
- package/src/PhoneInputStrings.ts +11 -3
- package/src/PhoneInputVerifyScreen.tsx +24 -4
- package/src/QualifiedSignatureDocumentScreen.tsx +9 -7
- package/src/QualifiedSignatureResultScreen.tsx +28 -26
- package/src/QualifiedSignatureStrings.ts +11 -4
- package/src/ResultScreen.tsx +33 -2
- package/src/ReusabilityCredentialSelectionScreen.tsx +246 -0
- package/src/ReusabilityLayout.css +241 -0
- package/src/ReusabilityPrivacyPolicyScreen.tsx +109 -0
- package/src/ReusabilityStrings.ts +127 -0
- package/src/ReviewScreen.tsx +96 -27
- package/src/ScreenLayout.css +382 -6
- package/src/VideoSelfieErrorScreen.tsx +1 -1
- package/src/VideoSelfieIdCaptureScreen.tsx +9 -1
- package/src/VideoSelfieLayout.css +304 -2
- package/src/VideoSelfieSelfieCaptureScreen.tsx +9 -1
- package/src/VideoSelfieSpeakScreen.tsx +9 -1
- package/src/VideoSelfieStrings.ts +4 -2
- package/src/VideoSelfieTurnHeadScreen.tsx +25 -14
- package/src/VideoSelfieTutorialScreen.tsx +11 -0
- package/src/VideoSelfieWaveScreen.tsx +9 -1
- package/src/ViewfinderScreen.css +36 -0
- package/src/flows.ts +25 -0
- package/src/index.ts +116 -3
- package/src/styles.css +4 -0
package/dist/index.d.ts
CHANGED
|
@@ -33,6 +33,18 @@ export { DocumentCaptureConfirmImageScreen, type DocumentCaptureConfirmImageScre
|
|
|
33
33
|
export { DocumentCaptureConfirmUploadScreen, type DocumentCaptureConfirmUploadScreenProps, } from './DocumentCaptureConfirmUploadScreen';
|
|
34
34
|
export { DocumentCaptureGenericErrorScreen, type DocumentCaptureGenericErrorScreenProps, } from './DocumentCaptureGenericErrorScreen';
|
|
35
35
|
export { DocumentCaptureNoConnectionScreen, type DocumentCaptureNoConnectionScreenProps, } from './DocumentCaptureNoConnectionScreen';
|
|
36
|
+
export { type DigitalIdUploadStrings, type DigitalIdUploadConfirmStage, } from './DigitalIdUploadStrings';
|
|
37
|
+
export { DigitalIdUploadTutorialScreen, type DigitalIdUploadTutorialScreenProps, } from './DigitalIdUploadTutorialScreen';
|
|
38
|
+
export { DigitalIdUploadReviewScreen, type DigitalIdUploadReviewScreenProps, } from './DigitalIdUploadReviewScreen';
|
|
39
|
+
export { DigitalIdUploadErrorScreen, type DigitalIdUploadErrorScreenProps, } from './DigitalIdUploadErrorScreen';
|
|
40
|
+
export { DigitalIdUploadFileTooLargeScreen, type DigitalIdUploadFileTooLargeScreenProps, } from './DigitalIdUploadFileTooLargeScreen';
|
|
41
|
+
export { type DigitalIdDeviceWalletsStrings, type DigitalIdDeviceWalletsPlatformWallet, type DigitalIdDeviceWalletsResultState, type DigitalIdDeviceWalletsOption, } from './DigitalIdDeviceWalletsStrings';
|
|
42
|
+
export { DigitalIdDeviceWalletsDocumentSelectionScreen, type DigitalIdDeviceWalletsDocumentSelectionScreenProps, } from './DigitalIdDeviceWalletsDocumentSelectionScreen';
|
|
43
|
+
export { DigitalIdDeviceWalletsResultScreen, type DigitalIdDeviceWalletsResultScreenProps, } from './DigitalIdDeviceWalletsResultScreen';
|
|
44
|
+
export { type DigitalIdProvidersStrings, type DigitalIdProvidersErrorState, type DigitalIdProvidersOption, type DigitalIdProvidersSelection, } from './DigitalIdProvidersStrings';
|
|
45
|
+
export { DigitalIdProvidersDocumentSelectionScreen, type DigitalIdProvidersDocumentSelectionScreenProps, } from './DigitalIdProvidersDocumentSelectionScreen';
|
|
46
|
+
export { DigitalIdProvidersRedirectScreen, type DigitalIdProvidersRedirectScreenProps, } from './DigitalIdProvidersRedirectScreen';
|
|
47
|
+
export { DigitalIdProvidersErrorScreen, type DigitalIdProvidersErrorScreenProps, } from './DigitalIdProvidersErrorScreen';
|
|
36
48
|
export { type IdCaptureStrings, type IdCaptureDocumentType, type IdCaptureSide, type IdCaptureStageState, type IdCaptureFeedbackKind, type IdCaptureFeedbackCopy, type IdCaptureListRow, } from './IdCaptureStrings';
|
|
37
49
|
export { IdCaptureDocumentSelectionScreen, type IdCaptureDocumentSelectionScreenProps, } from './IdCaptureDocumentSelectionScreen';
|
|
38
50
|
export { IdCaptureAgeVerificationScreen, type IdCaptureAgeVerificationScreenProps, } from './IdCaptureAgeVerificationScreen';
|
|
@@ -89,6 +101,11 @@ export { FormsLongFormScreen, type FormsLongFormScreenProps } from './FormsLongF
|
|
|
89
101
|
export { FormsSuccessScreen, type FormsSuccessScreenProps } from './FormsSuccessScreen';
|
|
90
102
|
export { type DataSharingConsentState, type DataSharingConsentItemStrings, type DataSharingConsentStrings, } from './DataSharingConsentStrings';
|
|
91
103
|
export { DataSharingConsentConsentScreen, type DataSharingConsentConsentScreenProps } from './DataSharingConsentConsentScreen';
|
|
104
|
+
export { type BiometricConsentState, type BiometricConsentStrings, } from './BiometricConsentStrings';
|
|
105
|
+
export { BiometricConsentScreen, type BiometricConsentScreenProps } from './BiometricConsentScreen';
|
|
106
|
+
export { type ReusabilityDocumentType, type ReusableCredential, type ReusabilityStrings, } from './ReusabilityStrings';
|
|
107
|
+
export { ReusabilityCredentialSelectionScreen, REUSABILITY_SCAN_NEW, type ReusabilitySelection, type ReusabilityCredentialSelectionScreenProps, } from './ReusabilityCredentialSelectionScreen';
|
|
108
|
+
export { ReusabilityPrivacyPolicyScreen, type ReusabilityPrivacyPolicyScreenProps } from './ReusabilityPrivacyPolicyScreen';
|
|
92
109
|
export { type EkycDetailsState, type EkycLicenseState, type EkycLicenseStateOption, type EkycDetailsValues, type EkycLicenseValues, type EkycStrings, type EkycCountryValues, } from './EkycStrings';
|
|
93
110
|
export { EKYC_COUNTRY_CATALOG, ekycCountryVariant, type EkycCountryVariant, type EkycCountryStep, type EkycField, type EkycFieldKey, type EkycFieldKind, } from './EkycCountryCatalog';
|
|
94
111
|
export { EkycCountryFormScreen, type EkycCountryFormScreenProps } from './EkycCountryFormScreen';
|
|
@@ -135,7 +152,13 @@ export { NfcSuccessScreen, type NfcSuccessScreenProps } from './NfcSuccessScreen
|
|
|
135
152
|
export { NfcSymbolScreen, type NfcSymbolScreenProps } from './NfcSymbolScreen';
|
|
136
153
|
export { NfcTryAgainScreen, type NfcTryAgainStep, type NfcTryAgainScreenProps, } from './NfcTryAgainScreen';
|
|
137
154
|
export { NfcTutorialScreen, type NfcTutorialScreenProps } from './NfcTutorialScreen';
|
|
155
|
+
export { type OcrReviewState, type OcrReviewStrings, } from './OcrReviewStrings';
|
|
156
|
+
export { OcrReviewScreen, type OcrReviewScreenProps } from './OcrReviewScreen';
|
|
157
|
+
export { OcrReviewLoadingScreen, type OcrReviewLoadingScreenProps } from './OcrReviewLoadingScreen';
|
|
158
|
+
export { OcrReviewSuccessScreen, type OcrReviewSuccessScreenProps } from './OcrReviewSuccessScreen';
|
|
159
|
+
export { OcrReviewErrorScreen, type OcrReviewErrorScreenProps } from './OcrReviewErrorScreen';
|
|
138
160
|
export { type PermissionsStrings, type PermissionsCapability, type PermissionsReasonRow, type PermissionsBrowser, type PermissionsStepKind, type PermissionsStep, type PermissionsBrowserSteps, } from './PermissionsStrings';
|
|
161
|
+
export { PermissionsAskScreen, type PermissionsAskScreenProps, } from './PermissionsAskScreen';
|
|
139
162
|
export { PermissionsRequiredScreen, type PermissionsRequiredScreenProps, } from './PermissionsRequiredScreen';
|
|
140
163
|
export { PermissionsAllowScreen, type PermissionsAllowScreenProps, } from './PermissionsAllowScreen';
|
|
141
164
|
export { PermissionsBrowserStepsScreen, type PermissionsBrowserStepsScreenProps, } from './PermissionsBrowserStepsScreen';
|
package/dist/index.js
CHANGED
|
@@ -35,6 +35,15 @@ export { DocumentCaptureConfirmImageScreen, } from './DocumentCaptureConfirmImag
|
|
|
35
35
|
export { DocumentCaptureConfirmUploadScreen, } from './DocumentCaptureConfirmUploadScreen';
|
|
36
36
|
export { DocumentCaptureGenericErrorScreen, } from './DocumentCaptureGenericErrorScreen';
|
|
37
37
|
export { DocumentCaptureNoConnectionScreen, } from './DocumentCaptureNoConnectionScreen';
|
|
38
|
+
export { DigitalIdUploadTutorialScreen, } from './DigitalIdUploadTutorialScreen';
|
|
39
|
+
export { DigitalIdUploadReviewScreen, } from './DigitalIdUploadReviewScreen';
|
|
40
|
+
export { DigitalIdUploadErrorScreen, } from './DigitalIdUploadErrorScreen';
|
|
41
|
+
export { DigitalIdUploadFileTooLargeScreen, } from './DigitalIdUploadFileTooLargeScreen';
|
|
42
|
+
export { DigitalIdDeviceWalletsDocumentSelectionScreen, } from './DigitalIdDeviceWalletsDocumentSelectionScreen';
|
|
43
|
+
export { DigitalIdDeviceWalletsResultScreen, } from './DigitalIdDeviceWalletsResultScreen';
|
|
44
|
+
export { DigitalIdProvidersDocumentSelectionScreen, } from './DigitalIdProvidersDocumentSelectionScreen';
|
|
45
|
+
export { DigitalIdProvidersRedirectScreen, } from './DigitalIdProvidersRedirectScreen';
|
|
46
|
+
export { DigitalIdProvidersErrorScreen, } from './DigitalIdProvidersErrorScreen';
|
|
38
47
|
export { IdCaptureDocumentSelectionScreen, } from './IdCaptureDocumentSelectionScreen';
|
|
39
48
|
export { IdCaptureAgeVerificationScreen, } from './IdCaptureAgeVerificationScreen';
|
|
40
49
|
export { IdCaptureTutorialScreen, } from './IdCaptureTutorialScreen';
|
|
@@ -82,6 +91,9 @@ export { FormsFieldScreen } from './FormsFieldScreen';
|
|
|
82
91
|
export { FormsLongFormScreen } from './FormsLongFormScreen';
|
|
83
92
|
export { FormsSuccessScreen } from './FormsSuccessScreen';
|
|
84
93
|
export { DataSharingConsentConsentScreen } from './DataSharingConsentConsentScreen';
|
|
94
|
+
export { BiometricConsentScreen } from './BiometricConsentScreen';
|
|
95
|
+
export { ReusabilityCredentialSelectionScreen, REUSABILITY_SCAN_NEW, } from './ReusabilityCredentialSelectionScreen';
|
|
96
|
+
export { ReusabilityPrivacyPolicyScreen } from './ReusabilityPrivacyPolicyScreen';
|
|
85
97
|
export { EKYC_COUNTRY_CATALOG, ekycCountryVariant, } from './EkycCountryCatalog';
|
|
86
98
|
export { EkycCountryFormScreen } from './EkycCountryFormScreen';
|
|
87
99
|
export { EkycDetailsScreen } from './EkycDetailsScreen';
|
|
@@ -123,6 +135,11 @@ export { NfcSuccessScreen } from './NfcSuccessScreen';
|
|
|
123
135
|
export { NfcSymbolScreen } from './NfcSymbolScreen';
|
|
124
136
|
export { NfcTryAgainScreen, } from './NfcTryAgainScreen';
|
|
125
137
|
export { NfcTutorialScreen } from './NfcTutorialScreen';
|
|
138
|
+
export { OcrReviewScreen } from './OcrReviewScreen';
|
|
139
|
+
export { OcrReviewLoadingScreen } from './OcrReviewLoadingScreen';
|
|
140
|
+
export { OcrReviewSuccessScreen } from './OcrReviewSuccessScreen';
|
|
141
|
+
export { OcrReviewErrorScreen } from './OcrReviewErrorScreen';
|
|
142
|
+
export { PermissionsAskScreen, } from './PermissionsAskScreen';
|
|
126
143
|
export { PermissionsRequiredScreen, } from './PermissionsRequiredScreen';
|
|
127
144
|
export { PermissionsAllowScreen, } from './PermissionsAllowScreen';
|
|
128
145
|
export { PermissionsBrowserStepsScreen, } from './PermissionsBrowserStepsScreen';
|
package/dist/styles.css
CHANGED
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
@import './CurpLayout.css';
|
|
17
17
|
@import './DataSharingConsentLayout.css';
|
|
18
18
|
@import './DemoScreensLayout.css';
|
|
19
|
+
@import './DigitalIdProvidersLayout.css';
|
|
19
20
|
@import './DocumentCaptureLayout.css';
|
|
20
21
|
@import './EkycLayout.css';
|
|
21
22
|
@import './ElectronicSignatureLayout.css';
|
|
@@ -25,8 +26,11 @@
|
|
|
25
26
|
@import './FormsLayout.css';
|
|
26
27
|
@import './IdCaptureLayout.css';
|
|
27
28
|
@import './NfcLayout.css';
|
|
29
|
+
@import './OcrReviewLayout.css';
|
|
30
|
+
@import './PermissionsLayout.css';
|
|
28
31
|
@import './PhoneInputLayout.css';
|
|
29
32
|
@import './QualifiedSignatureLayout.css';
|
|
33
|
+
@import './ReusabilityLayout.css';
|
|
30
34
|
@import './ScreenLayout.css';
|
|
31
35
|
@import './ScreenNav.css';
|
|
32
36
|
@import './ScreenShell.css';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@incodetech/prizma-core-screens",
|
|
3
|
-
"version": "0.2.
|
|
3
|
+
"version": "0.2.14",
|
|
4
4
|
"description": "Prizma Design System — SDK module screens: composed, responsive, brand-themeable React screens built from @incodetech/prizma-core-web.",
|
|
5
5
|
"license": "UNLICENSED",
|
|
6
6
|
"type": "module",
|
|
@@ -15,6 +15,11 @@
|
|
|
15
15
|
"types": "./dist/index.d.ts",
|
|
16
16
|
"import": "./dist/index.js"
|
|
17
17
|
},
|
|
18
|
+
"./biometric-consent-screen": {
|
|
19
|
+
"source": "./src/BiometricConsentScreen.tsx",
|
|
20
|
+
"types": "./dist/BiometricConsentScreen.d.ts",
|
|
21
|
+
"import": "./dist/BiometricConsentScreen.js"
|
|
22
|
+
},
|
|
18
23
|
"./capture-overlay": {
|
|
19
24
|
"source": "./src/CaptureOverlay.tsx",
|
|
20
25
|
"types": "./dist/CaptureOverlay.d.ts",
|
|
@@ -115,6 +120,51 @@
|
|
|
115
120
|
"types": "./dist/DemoScreensTermsScreen.d.ts",
|
|
116
121
|
"import": "./dist/DemoScreensTermsScreen.js"
|
|
117
122
|
},
|
|
123
|
+
"./digital-id-device-wallets-document-selection-screen": {
|
|
124
|
+
"source": "./src/DigitalIdDeviceWalletsDocumentSelectionScreen.tsx",
|
|
125
|
+
"types": "./dist/DigitalIdDeviceWalletsDocumentSelectionScreen.d.ts",
|
|
126
|
+
"import": "./dist/DigitalIdDeviceWalletsDocumentSelectionScreen.js"
|
|
127
|
+
},
|
|
128
|
+
"./digital-id-device-wallets-result-screen": {
|
|
129
|
+
"source": "./src/DigitalIdDeviceWalletsResultScreen.tsx",
|
|
130
|
+
"types": "./dist/DigitalIdDeviceWalletsResultScreen.d.ts",
|
|
131
|
+
"import": "./dist/DigitalIdDeviceWalletsResultScreen.js"
|
|
132
|
+
},
|
|
133
|
+
"./digital-id-providers-document-selection-screen": {
|
|
134
|
+
"source": "./src/DigitalIdProvidersDocumentSelectionScreen.tsx",
|
|
135
|
+
"types": "./dist/DigitalIdProvidersDocumentSelectionScreen.d.ts",
|
|
136
|
+
"import": "./dist/DigitalIdProvidersDocumentSelectionScreen.js"
|
|
137
|
+
},
|
|
138
|
+
"./digital-id-providers-error-screen": {
|
|
139
|
+
"source": "./src/DigitalIdProvidersErrorScreen.tsx",
|
|
140
|
+
"types": "./dist/DigitalIdProvidersErrorScreen.d.ts",
|
|
141
|
+
"import": "./dist/DigitalIdProvidersErrorScreen.js"
|
|
142
|
+
},
|
|
143
|
+
"./digital-id-providers-redirect-screen": {
|
|
144
|
+
"source": "./src/DigitalIdProvidersRedirectScreen.tsx",
|
|
145
|
+
"types": "./dist/DigitalIdProvidersRedirectScreen.d.ts",
|
|
146
|
+
"import": "./dist/DigitalIdProvidersRedirectScreen.js"
|
|
147
|
+
},
|
|
148
|
+
"./digital-id-upload-error-screen": {
|
|
149
|
+
"source": "./src/DigitalIdUploadErrorScreen.tsx",
|
|
150
|
+
"types": "./dist/DigitalIdUploadErrorScreen.d.ts",
|
|
151
|
+
"import": "./dist/DigitalIdUploadErrorScreen.js"
|
|
152
|
+
},
|
|
153
|
+
"./digital-id-upload-file-too-large-screen": {
|
|
154
|
+
"source": "./src/DigitalIdUploadFileTooLargeScreen.tsx",
|
|
155
|
+
"types": "./dist/DigitalIdUploadFileTooLargeScreen.d.ts",
|
|
156
|
+
"import": "./dist/DigitalIdUploadFileTooLargeScreen.js"
|
|
157
|
+
},
|
|
158
|
+
"./digital-id-upload-review-screen": {
|
|
159
|
+
"source": "./src/DigitalIdUploadReviewScreen.tsx",
|
|
160
|
+
"types": "./dist/DigitalIdUploadReviewScreen.d.ts",
|
|
161
|
+
"import": "./dist/DigitalIdUploadReviewScreen.js"
|
|
162
|
+
},
|
|
163
|
+
"./digital-id-upload-tutorial-screen": {
|
|
164
|
+
"source": "./src/DigitalIdUploadTutorialScreen.tsx",
|
|
165
|
+
"types": "./dist/DigitalIdUploadTutorialScreen.d.ts",
|
|
166
|
+
"import": "./dist/DigitalIdUploadTutorialScreen.js"
|
|
167
|
+
},
|
|
118
168
|
"./document-capture-capture-screen": {
|
|
119
169
|
"source": "./src/DocumentCaptureCaptureScreen.tsx",
|
|
120
170
|
"types": "./dist/DocumentCaptureCaptureScreen.d.ts",
|
|
@@ -495,11 +545,36 @@
|
|
|
495
545
|
"types": "./dist/NfcTutorialScreen.d.ts",
|
|
496
546
|
"import": "./dist/NfcTutorialScreen.js"
|
|
497
547
|
},
|
|
548
|
+
"./ocr-review-error-screen": {
|
|
549
|
+
"source": "./src/OcrReviewErrorScreen.tsx",
|
|
550
|
+
"types": "./dist/OcrReviewErrorScreen.d.ts",
|
|
551
|
+
"import": "./dist/OcrReviewErrorScreen.js"
|
|
552
|
+
},
|
|
553
|
+
"./ocr-review-loading-screen": {
|
|
554
|
+
"source": "./src/OcrReviewLoadingScreen.tsx",
|
|
555
|
+
"types": "./dist/OcrReviewLoadingScreen.d.ts",
|
|
556
|
+
"import": "./dist/OcrReviewLoadingScreen.js"
|
|
557
|
+
},
|
|
558
|
+
"./ocr-review-screen": {
|
|
559
|
+
"source": "./src/OcrReviewScreen.tsx",
|
|
560
|
+
"types": "./dist/OcrReviewScreen.d.ts",
|
|
561
|
+
"import": "./dist/OcrReviewScreen.js"
|
|
562
|
+
},
|
|
563
|
+
"./ocr-review-success-screen": {
|
|
564
|
+
"source": "./src/OcrReviewSuccessScreen.tsx",
|
|
565
|
+
"types": "./dist/OcrReviewSuccessScreen.d.ts",
|
|
566
|
+
"import": "./dist/OcrReviewSuccessScreen.js"
|
|
567
|
+
},
|
|
498
568
|
"./permissions-allow-screen": {
|
|
499
569
|
"source": "./src/PermissionsAllowScreen.tsx",
|
|
500
570
|
"types": "./dist/PermissionsAllowScreen.d.ts",
|
|
501
571
|
"import": "./dist/PermissionsAllowScreen.js"
|
|
502
572
|
},
|
|
573
|
+
"./permissions-ask-screen": {
|
|
574
|
+
"source": "./src/PermissionsAskScreen.tsx",
|
|
575
|
+
"types": "./dist/PermissionsAskScreen.d.ts",
|
|
576
|
+
"import": "./dist/PermissionsAskScreen.js"
|
|
577
|
+
},
|
|
503
578
|
"./permissions-browser-steps-screen": {
|
|
504
579
|
"source": "./src/PermissionsBrowserStepsScreen.tsx",
|
|
505
580
|
"types": "./dist/PermissionsBrowserStepsScreen.d.ts",
|
|
@@ -575,6 +650,16 @@
|
|
|
575
650
|
"types": "./dist/ResultScreen.d.ts",
|
|
576
651
|
"import": "./dist/ResultScreen.js"
|
|
577
652
|
},
|
|
653
|
+
"./reusability-credential-selection-screen": {
|
|
654
|
+
"source": "./src/ReusabilityCredentialSelectionScreen.tsx",
|
|
655
|
+
"types": "./dist/ReusabilityCredentialSelectionScreen.d.ts",
|
|
656
|
+
"import": "./dist/ReusabilityCredentialSelectionScreen.js"
|
|
657
|
+
},
|
|
658
|
+
"./reusability-privacy-policy-screen": {
|
|
659
|
+
"source": "./src/ReusabilityPrivacyPolicyScreen.tsx",
|
|
660
|
+
"types": "./dist/ReusabilityPrivacyPolicyScreen.d.ts",
|
|
661
|
+
"import": "./dist/ReusabilityPrivacyPolicyScreen.js"
|
|
662
|
+
},
|
|
578
663
|
"./review-screen": {
|
|
579
664
|
"source": "./src/ReviewScreen.tsx",
|
|
580
665
|
"types": "./dist/ReviewScreen.d.ts",
|
|
@@ -695,6 +780,7 @@
|
|
|
695
780
|
"./curp-layout.css": "./dist/CurpLayout.css",
|
|
696
781
|
"./data-sharing-consent-layout.css": "./dist/DataSharingConsentLayout.css",
|
|
697
782
|
"./demo-screens-layout.css": "./dist/DemoScreensLayout.css",
|
|
783
|
+
"./digital-id-providers-layout.css": "./dist/DigitalIdProvidersLayout.css",
|
|
698
784
|
"./document-capture-layout.css": "./dist/DocumentCaptureLayout.css",
|
|
699
785
|
"./ekyc-layout.css": "./dist/EkycLayout.css",
|
|
700
786
|
"./electronic-signature-layout.css": "./dist/ElectronicSignatureLayout.css",
|
|
@@ -704,8 +790,11 @@
|
|
|
704
790
|
"./forms-layout.css": "./dist/FormsLayout.css",
|
|
705
791
|
"./id-capture-layout.css": "./dist/IdCaptureLayout.css",
|
|
706
792
|
"./nfc-layout.css": "./dist/NfcLayout.css",
|
|
793
|
+
"./ocr-review-layout.css": "./dist/OcrReviewLayout.css",
|
|
794
|
+
"./permissions-layout.css": "./dist/PermissionsLayout.css",
|
|
707
795
|
"./phone-input-layout.css": "./dist/PhoneInputLayout.css",
|
|
708
796
|
"./qualified-signature-layout.css": "./dist/QualifiedSignatureLayout.css",
|
|
797
|
+
"./reusability-layout.css": "./dist/ReusabilityLayout.css",
|
|
709
798
|
"./screen-layout.css": "./dist/ScreenLayout.css",
|
|
710
799
|
"./screen-nav.css": "./dist/ScreenNav.css",
|
|
711
800
|
"./screen-shell.css": "./dist/ScreenShell.css",
|
|
@@ -730,7 +819,9 @@
|
|
|
730
819
|
"./samples/selfie-hat.png": "./samples/selfie-hat.png",
|
|
731
820
|
"./samples/selfie-mask.png": "./samples/selfie-mask.png",
|
|
732
821
|
"./samples/selfie.png": "./samples/selfie.png",
|
|
822
|
+
"./samples/video-selfie-camera-wide.jpg": "./samples/video-selfie-camera-wide.jpg",
|
|
733
823
|
"./samples/video-selfie-camera.png": "./samples/video-selfie-camera.png",
|
|
824
|
+
"./samples/video-selfie-room-wide.jpg": "./samples/video-selfie-room-wide.jpg",
|
|
734
825
|
"./samples/video-selfie-room.png": "./samples/video-selfie-room.png",
|
|
735
826
|
"./package.json": "./package.json"
|
|
736
827
|
},
|
|
@@ -750,8 +841,8 @@
|
|
|
750
841
|
},
|
|
751
842
|
"dependencies": {
|
|
752
843
|
"@incodetech/prizma-core-icons": "^0.4.0",
|
|
753
|
-
"@incodetech/prizma-core-tokens": "^0.
|
|
754
|
-
"@incodetech/prizma-core-web": "^0.
|
|
844
|
+
"@incodetech/prizma-core-tokens": "^0.16.0",
|
|
845
|
+
"@incodetech/prizma-core-web": "^0.16.0"
|
|
755
846
|
},
|
|
756
847
|
"devDependencies": {
|
|
757
848
|
"@types/react": "^18.3.12",
|
|
Binary file
|
|
Binary file
|
|
@@ -0,0 +1,192 @@
|
|
|
1
|
+
import React, { forwardRef } from 'react';
|
|
2
|
+
import { PrizmaCheckbox } from '@incodetech/prizma-core-web/checkbox';
|
|
3
|
+
import { PrizmaModalContent } from '@incodetech/prizma-core-web/modal';
|
|
4
|
+
import { PrizmaFormScreen, type PrizmaFormScreenProps } from './FormScreen';
|
|
5
|
+
import type { PrizmaScreenActionHandler, PrizmaScreenOverrides } from './types';
|
|
6
|
+
import type { BiometricConsentState, BiometricConsentStrings } from './BiometricConsentStrings';
|
|
7
|
+
import './ScreenLayout.css';
|
|
8
|
+
|
|
9
|
+
export interface BiometricConsentScreenProps
|
|
10
|
+
extends Omit<
|
|
11
|
+
PrizmaFormScreenProps,
|
|
12
|
+
| 'title'
|
|
13
|
+
| 'subtitle'
|
|
14
|
+
| 'ctaLabel'
|
|
15
|
+
| 'ctaDisabled'
|
|
16
|
+
| 'verifiedLabel'
|
|
17
|
+
| 'children'
|
|
18
|
+
| 'navLabel'
|
|
19
|
+
| 'linkLabel'
|
|
20
|
+
| 'linkDisabled'
|
|
21
|
+
| 'linkContent'
|
|
22
|
+
| 'overlay'
|
|
23
|
+
// The column shape is the section's, not a host's.
|
|
24
|
+
| 'fieldsOffset'
|
|
25
|
+
| 'fieldsGap'
|
|
26
|
+
| 'fieldsAlign'
|
|
27
|
+
| 'scrollFields'
|
|
28
|
+
> {
|
|
29
|
+
/** Module copy — this screen reads the `consent` and `quit` slices. */
|
|
30
|
+
strings: BiometricConsentStrings;
|
|
31
|
+
/** Which of the two section states to render. Default `default`. */
|
|
32
|
+
state?: BiometricConsentState;
|
|
33
|
+
/**
|
|
34
|
+
* Cancel was pressed: present the quit confirmation over the consent. The
|
|
35
|
+
* consent underneath keeps its `state` — the box is whatever the person had.
|
|
36
|
+
* Its two answers: the confirm emits `cta` (the session ends), the dismiss
|
|
37
|
+
* emits `secondary` (back to the consent). DEVIATIONS #BC-7.
|
|
38
|
+
*/
|
|
39
|
+
quitConfirm?: boolean;
|
|
40
|
+
/**
|
|
41
|
+
* The box was ticked or unticked. A REAL change event from Core's own
|
|
42
|
+
* `<input type="checkbox">` — the card is a `<label>`, so tapping the copy
|
|
43
|
+
* toggles it too, which is the behaviour the request named ("tapping the body
|
|
44
|
+
* also toggles the checkbox"). The screen stays controlled by `state`; this
|
|
45
|
+
* only reports the press so a host (or the Core Lab prototype) can move the
|
|
46
|
+
* state itself. The sibling consent screen forwards no such handler and its
|
|
47
|
+
* prototype had to listen on a wrapper instead — this closes that gap for this
|
|
48
|
+
* module.
|
|
49
|
+
*/
|
|
50
|
+
onConsentChange?: (checked: boolean) => void;
|
|
51
|
+
screenId?: string;
|
|
52
|
+
overrides?: PrizmaScreenOverrides;
|
|
53
|
+
onAction?: PrizmaScreenActionHandler;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Biometric Consent — the mandatory biometric-processing consent, built on the
|
|
58
|
+
* Form archetype (GUIDELINES.md §6-E, `PrizmaFormScreen`).
|
|
59
|
+
*
|
|
60
|
+
* ONE screen for the whole `biometricConsent` section (2001:16315): the two
|
|
61
|
+
* state frames (`empty` 2001:16361, `checked` 2001:16372) share an identical
|
|
62
|
+
* skeleton — nav → Title (H2 + H5) → one consent card → Continue → Cancel →
|
|
63
|
+
* tag — and differ ONLY in whether the box is ticked and the CTA released.
|
|
64
|
+
* Plus the quit confirmation (`quitConfirm`), a Core sheet or dialog presented
|
|
65
|
+
* over either state when Cancel is pressed.
|
|
66
|
+
*
|
|
67
|
+
* WHY ARCHETYPE E. The same reason the sibling consent screen gives: a
|
|
68
|
+
* `PrizmaCheckbox` is a real `<input type="checkbox">` that joins the form, and
|
|
69
|
+
* the gated CTA is the whole point of a consent screen — `PrizmaListScreen` has
|
|
70
|
+
* no `ctaDisabled` slot. E also carries the one tertiary action under the
|
|
71
|
+
* primary (`linkLabel`), which is exactly where the frame draws Cancel.
|
|
72
|
+
*
|
|
73
|
+
* THE CARD SITS AT THE BOTTOM OF THE COLUMN, NOT UNDER THE TITLE. The frame's
|
|
74
|
+
* middle (2001:15150) is a `justify-between` column: the Title block at the top,
|
|
75
|
+
* the consent card flush against the CTA band with the frame's Spacing/16
|
|
76
|
+
* between them, and everything in between left empty. That is the opposite of
|
|
77
|
+
* every other Form consumer, whose stack hangs off the title, so the screen
|
|
78
|
+
* SELECTS it through the archetype's `fieldsAlign="end"` slot rather than
|
|
79
|
+
* declaring a layout of its own — the value lives once, in `FormScreen.css`.
|
|
80
|
+
* DEVIATIONS #BC-1.
|
|
81
|
+
*
|
|
82
|
+
* Five things are deliberate:
|
|
83
|
+
*
|
|
84
|
+
* 1. The consent card is Core's `PrizmaCheckbox size="L"` — the component IS
|
|
85
|
+
* the tinted container Figma draws (padding, radius, `Surface/Brand/50`,
|
|
86
|
+
* the 28×28 box, the Size-S body). Its `segments` carry the inline
|
|
87
|
+
* "Incode's Privacy Policy" link, which opens the document without toggling
|
|
88
|
+
* the box. Nothing about the card is composed here.
|
|
89
|
+
* 2. The box is CONTROLLED by `state`, like every other spec state in this
|
|
90
|
+
* package, and the real change event is forwarded through `onConsentChange`
|
|
91
|
+
* so a host can drive it. `disabled` is NOT used — the frame draws the card
|
|
92
|
+
* on the live surface in both states (#PI-6: never borrow a semantic state
|
|
93
|
+
* to make something inert).
|
|
94
|
+
* 3. The CTA is gated by `ctaDisabled`, Core's own
|
|
95
|
+
* `button/primary/surface|text/disabled` treatment, until the box is ticked
|
|
96
|
+
* — the behaviour the requesting engineer asked for and the two sibling
|
|
97
|
+
* consents already ship. The frame paints Continue blue in both states;
|
|
98
|
+
* recorded, not resolved silently (DEVIATIONS #BC-2).
|
|
99
|
+
* 4. Cancel is the archetype's `tertiary-link` button and emits `secondary`.
|
|
100
|
+
* The frame draws it as the Button group's "Tertiary CTA" slot in body-800
|
|
101
|
+
* ink with no underline on the ES/PT copies and in brand blue on the EN one
|
|
102
|
+
* — Core ships one L tertiary (underlined, `button/tertiary/text/default`)
|
|
103
|
+
* and the component wins (DEVIATIONS #BC-4).
|
|
104
|
+
* 5. The quit confirmation rides archetype E's `overlay` slot: the screen owns
|
|
105
|
+
* the scrim and the placement (the foundation's `__sheet-scrim` /
|
|
106
|
+
* `__modal-panel` recipes), Core owns the card — `PrizmaModalContent`,
|
|
107
|
+
* the `default` variant exactly as the design system documents it: close
|
|
108
|
+
* icon, title, optional subtitle, and its own `vertical-v1` Button Group
|
|
109
|
+
* (Quit over Cancel). Placed the way Core's presenter places a modal —
|
|
110
|
+
* pinned to the bottom of the frame with a Spacing/12 margin, never
|
|
111
|
+
* centred — on EVERY platform. The owner ruled out a bottom sheet on the
|
|
112
|
+
* phone, then a centred card (Camila, 2026-10-13): "use the default modal
|
|
113
|
+
* … so we try with an existing component". The close icon dismisses, the
|
|
114
|
+
* same as Cancel. Nothing is drawn behind it that the consent did not
|
|
115
|
+
* already draw. DEVIATIONS #BC-7, #BC-8.
|
|
116
|
+
*/
|
|
117
|
+
export const BiometricConsentScreen = forwardRef<HTMLDivElement, BiometricConsentScreenProps>(
|
|
118
|
+
(
|
|
119
|
+
{
|
|
120
|
+
strings,
|
|
121
|
+
state = 'default',
|
|
122
|
+
quitConfirm = false,
|
|
123
|
+
onConsentChange,
|
|
124
|
+
screenId = quitConfirm ? 'biometric-consent-quit' : `biometric-consent-${state}`,
|
|
125
|
+
overrides,
|
|
126
|
+
onAction,
|
|
127
|
+
...shell
|
|
128
|
+
},
|
|
129
|
+
ref,
|
|
130
|
+
) => {
|
|
131
|
+
const accepted = state === 'accepted';
|
|
132
|
+
|
|
133
|
+
const quit = quitConfirm ? (
|
|
134
|
+
<>
|
|
135
|
+
<div className="prizma-screen-layout__sheet-scrim" aria-hidden="true" />
|
|
136
|
+
<div className="prizma-screen-layout__modal-panel">
|
|
137
|
+
<PrizmaModalContent
|
|
138
|
+
variant="default"
|
|
139
|
+
title={strings.quit.title}
|
|
140
|
+
subtitle={strings.quit.subtitle}
|
|
141
|
+
closeLabel={strings.quit.closeLabel}
|
|
142
|
+
onClose={() => onAction?.({ type: 'secondary', screenId })}
|
|
143
|
+
buttonGroupProps={{
|
|
144
|
+
primaryLabel: strings.quit.confirmLabel,
|
|
145
|
+
secondaryLabel: strings.quit.dismissLabel,
|
|
146
|
+
onPrimaryClick: () => onAction?.({ type: 'cta', screenId }),
|
|
147
|
+
onSecondaryClick: () => onAction?.({ type: 'secondary', screenId }),
|
|
148
|
+
}}
|
|
149
|
+
/>
|
|
150
|
+
</div>
|
|
151
|
+
</>
|
|
152
|
+
) : undefined;
|
|
153
|
+
|
|
154
|
+
return (
|
|
155
|
+
<PrizmaFormScreen
|
|
156
|
+
ref={ref}
|
|
157
|
+
title={strings.consent.title}
|
|
158
|
+
subtitle={strings.consent.subtitle}
|
|
159
|
+
/* The card hangs off the CTA band, not the title — the frame's
|
|
160
|
+
justify-between middle. Selected from the archetype, not declared. */
|
|
161
|
+
fieldsAlign="end"
|
|
162
|
+
ctaLabel={strings.consent.ctaLabel}
|
|
163
|
+
/* "Continue" stays inert until the box is ticked. */
|
|
164
|
+
ctaDisabled={!accepted}
|
|
165
|
+
linkLabel={strings.consent.cancelLabel}
|
|
166
|
+
verifiedLabel={strings.verifiedLabel}
|
|
167
|
+
navLabel={strings.navLabel}
|
|
168
|
+
screenId={screenId}
|
|
169
|
+
overrides={overrides}
|
|
170
|
+
/* With the sheet up, the consent's own buttons are under the scrim and
|
|
171
|
+
must not report: the sheet's two answers are the only actions. */
|
|
172
|
+
onAction={quitConfirm ? undefined : onAction}
|
|
173
|
+
overlay={quit}
|
|
174
|
+
{...shell}
|
|
175
|
+
>
|
|
176
|
+
<PrizmaCheckbox
|
|
177
|
+
size="L"
|
|
178
|
+
checked={accepted}
|
|
179
|
+
/* Mandatory for a11y (`aria-required`); the L container never paints
|
|
180
|
+
a `*` and the frame draws none. */
|
|
181
|
+
required
|
|
182
|
+
aria-label={strings.consent.ariaLabel}
|
|
183
|
+
segments={strings.consent.body}
|
|
184
|
+
onCheckedChange={quitConfirm ? undefined : onConsentChange}
|
|
185
|
+
/>
|
|
186
|
+
</PrizmaFormScreen>
|
|
187
|
+
);
|
|
188
|
+
},
|
|
189
|
+
);
|
|
190
|
+
BiometricConsentScreen.displayName = 'BiometricConsentScreen';
|
|
191
|
+
|
|
192
|
+
export default BiometricConsentScreen;
|
|
@@ -0,0 +1,119 @@
|
|
|
1
|
+
// Biometric Consent — copy contract.
|
|
2
|
+
//
|
|
3
|
+
// The mandatory biometric consent the BACKEND decides to show — at the start of
|
|
4
|
+
// a flow, or right after ID capture — when the session comes from a protected
|
|
5
|
+
// geography (Illinois BIPA and the handful of states like it), or when the state
|
|
6
|
+
// on the captured ID says so. It is NOT the User Consent / Data Sharing Consent
|
|
7
|
+
// module: it is the flow builder's "Required biometric consent" setting, it uses
|
|
8
|
+
// its own endpoint, and declining it is a hard stop. Uros Milivojevic
|
|
9
|
+
// (#uxp-design, 2026-09-01): "Compared to User Consent it has a Cancel button
|
|
10
|
+
// next to Continue, a subtitle, and a long consent body loaded from the BE with
|
|
11
|
+
// tappable links (tapping the body also toggles the checkbox)."
|
|
12
|
+
//
|
|
13
|
+
// Figma: `Biometric Consent Screen` (vXvIMQF5DSJgkQHhFAQcWC), section
|
|
14
|
+
// `biometricConsent` (2001:16315). ONE screen, drawn across:
|
|
15
|
+
// · 2001:16361 `biometricConsent.empty` the master — box unticked
|
|
16
|
+
// · 2001:16372 `biometricConsent.checked` the box ticked
|
|
17
|
+
// · `🔧 Behavior`, `🖤 Dark mode`, `🇪🇸 ES`, `🇵🇹 PT` and the six device
|
|
18
|
+
// sections are the same two states re-presented: dark is token-driven
|
|
19
|
+
// (`[data-prizma-theme='dark']`), the locales are the host's locale pack,
|
|
20
|
+
// and the widths are excluded by the no-per-width-variants rule (DEVIATIONS
|
|
21
|
+
// #17).
|
|
22
|
+
//
|
|
23
|
+
// The screen is: nav → Title (H2 + H5 subtitle) → one consent card pinned to
|
|
24
|
+
// the BOTTOM of the column → Continue → Cancel → tag. No disclosure paragraph —
|
|
25
|
+
// unlike the consent screen the two sibling modules share, the legal body here
|
|
26
|
+
// lives INSIDE the card, and the backend supplies it.
|
|
27
|
+
//
|
|
28
|
+
// No hardcoded English anywhere in a screen: every visible string arrives here,
|
|
29
|
+
// so the host's locale pack drives the module (the Figma file ships ES + PT
|
|
30
|
+
// columns beside the EN one).
|
|
31
|
+
|
|
32
|
+
import type { PrizmaConsentSegment } from '@incodetech/prizma-core-web/checkbox';
|
|
33
|
+
|
|
34
|
+
/**
|
|
35
|
+
* The two states the section draws. Both share ONE layout — nav → Title →
|
|
36
|
+
* (space) → consent card → Continue → Cancel → tag — and differ only in whether
|
|
37
|
+
* the box is ticked and, with it, whether Continue is released:
|
|
38
|
+
*
|
|
39
|
+
* - `default` — `biometricConsent.empty` (2001:16361): the box unticked.
|
|
40
|
+
* Continue is DISABLED. The frame paints it brand blue; the
|
|
41
|
+
* requesting engineer asked for it greyed until the box is
|
|
42
|
+
* ticked, "like in Data Sharing Consent" (Uros, #uxp-design
|
|
43
|
+
* 2026-09-02), which is also what the two sibling consent
|
|
44
|
+
* screens do. DEVIATIONS #BC-2 — flip `ctaDisabled` in the
|
|
45
|
+
* screen if the frame is the final word.
|
|
46
|
+
* - `accepted` — `biometricConsent.checked` (2001:16372): the box ticked,
|
|
47
|
+
* Continue released to brand blue.
|
|
48
|
+
*
|
|
49
|
+
* There is NO refusal state. With Continue gated, "pressed with nothing ticked"
|
|
50
|
+
* cannot happen, and the file draws no such frame — the sibling modules' added
|
|
51
|
+
* `rejected` state is deliberately not copied here (DEVIATIONS #BC-3).
|
|
52
|
+
*
|
|
53
|
+
* The quit confirmation is NOT a third state: it is a dialog presented over
|
|
54
|
+
* either state (`quitConfirm` on the screen), because what is underneath — the
|
|
55
|
+
* box empty or ticked — is whatever the person had before they pressed Cancel.
|
|
56
|
+
*/
|
|
57
|
+
export type BiometricConsentState = 'default' | 'accepted';
|
|
58
|
+
|
|
59
|
+
export interface BiometricConsentStrings {
|
|
60
|
+
/** "verified by" attribution in the footer tag. */
|
|
61
|
+
verifiedLabel: string;
|
|
62
|
+
/** Accessible name for the logo nav row. */
|
|
63
|
+
navLabel?: string;
|
|
64
|
+
|
|
65
|
+
/** The `biometricConsent` section. */
|
|
66
|
+
consent: {
|
|
67
|
+
/** H2 ("Request for Biometric Processing"). Centered, per the section. */
|
|
68
|
+
title: string;
|
|
69
|
+
/** H5 under the title ("Your verification is powered by Incode…"). The
|
|
70
|
+
* section draws one on every frame. */
|
|
71
|
+
subtitle: string;
|
|
72
|
+
/**
|
|
73
|
+
* The consent card's copy, as ordered segments: a plain string renders as
|
|
74
|
+
* body copy, an object renders as an inline `<a>` that opens the document
|
|
75
|
+
* WITHOUT toggling the box. Core's own `PrizmaConsentSegment` contract — the
|
|
76
|
+
* multi-link path on `PrizmaCheckbox size="L"` — so a consent citing two
|
|
77
|
+
* documents stays expressible (#PI-10: each link is separately actionable).
|
|
78
|
+
* In production this body arrives from the backend.
|
|
79
|
+
*/
|
|
80
|
+
body: PrizmaConsentSegment[];
|
|
81
|
+
/** Accessible name for the box — the card copy is a paragraph, too long to
|
|
82
|
+
* serve as one. */
|
|
83
|
+
ariaLabel?: string;
|
|
84
|
+
/** Primary CTA ("Continue"). Disabled until the box is ticked. */
|
|
85
|
+
ctaLabel: string;
|
|
86
|
+
/** The tertiary action under Continue ("Cancel"). Declining is a hard stop:
|
|
87
|
+
* the session cannot process the person's biometrics without this consent. */
|
|
88
|
+
cancelLabel: string;
|
|
89
|
+
};
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* The confirmation presented when Cancel is pressed, before the session ends.
|
|
93
|
+
*
|
|
94
|
+
* NOT IN THE FIGMA FILE, and not in the shipped Web SDK either — today
|
|
95
|
+
* `manager.cancel()` ends the session the moment Cancel is tapped. Added at
|
|
96
|
+
* the owner's request (Camila, 2026-10-13): Cancel is irreversible here, the
|
|
97
|
+
* person cannot be verified without the consent, and a mis-tap on the
|
|
98
|
+
* tertiary under Continue should not cost them the session. It is Core's
|
|
99
|
+
* Modal, `default` variant, on EVERY platform — the existing component as
|
|
100
|
+
* the design system documents it, close icon and all, pinned to the bottom
|
|
101
|
+
* of the frame the way Core's presenter places it; not a bottom sheet and
|
|
102
|
+
* not a centred card (owner calls, same day). The copy is the
|
|
103
|
+
* SDK's own close dialog (`page.close.confirmQuit` / `page.close.confirm` /
|
|
104
|
+
* `page.close.cancel`), so nothing is invented. DEVIATIONS #BC-7.
|
|
105
|
+
*/
|
|
106
|
+
quit: {
|
|
107
|
+
/** Dialog title ("Are you sure you want to quit?"). */
|
|
108
|
+
title: string;
|
|
109
|
+
/** Optional supporting line. The SDK's close dialog carries none. */
|
|
110
|
+
subtitle?: string;
|
|
111
|
+
/** The destructive confirmation ("Quit") — primary, on top. */
|
|
112
|
+
confirmLabel: string;
|
|
113
|
+
/** Dismiss and stay on the consent ("Cancel") — secondary, below it. */
|
|
114
|
+
dismissLabel: string;
|
|
115
|
+
/** Accessible name of the card's close icon ("Close"), which also
|
|
116
|
+
* dismisses. Core's Default modal always draws the icon. */
|
|
117
|
+
closeLabel: string;
|
|
118
|
+
};
|
|
119
|
+
}
|
package/src/CaptureScreen.tsx
CHANGED
|
@@ -39,6 +39,19 @@ export interface PrizmaCaptureScreenProps
|
|
|
39
39
|
manualFeedbackText?: string;
|
|
40
40
|
/** Per-state status copy (uploading / success / error / warning). */
|
|
41
41
|
statusLabels?: Partial<Record<PrizmaSelfieCaptureState, string>>;
|
|
42
|
+
/**
|
|
43
|
+
* A notice band above the footer — a Snackbar the module raises over the live
|
|
44
|
+
* feed without taking the camera away (Face Capture's "Need more time?" offer
|
|
45
|
+
* is the first consumer).
|
|
46
|
+
*
|
|
47
|
+
* ANCHORED, like the footer and the control strip, and for the same reason:
|
|
48
|
+
* the owner's rule is that anchored chrome sits at the same position on every
|
|
49
|
+
* screen (2026-08-18). Flowing it would push Core's ring up, and the ring
|
|
50
|
+
* offset is the one thing this archetype is forbidden to touch
|
|
51
|
+
* (DEVIATIONS #12). It rides the empty band under the instruction line, which
|
|
52
|
+
* is where the module Figma puts it.
|
|
53
|
+
*/
|
|
54
|
+
notice?: ReactNode;
|
|
42
55
|
/** "verified by" attribution copy for the footer tag. */
|
|
43
56
|
verifiedLabel: string;
|
|
44
57
|
navLabel?: string;
|
|
@@ -72,6 +85,7 @@ export const PrizmaCaptureScreen = forwardRef<HTMLDivElement, PrizmaCaptureScree
|
|
|
72
85
|
isManual,
|
|
73
86
|
manualFeedbackText,
|
|
74
87
|
statusLabels,
|
|
88
|
+
notice,
|
|
75
89
|
verifiedLabel,
|
|
76
90
|
navLabel,
|
|
77
91
|
screenId,
|
|
@@ -107,6 +121,9 @@ export const PrizmaCaptureScreen = forwardRef<HTMLDivElement, PrizmaCaptureScree
|
|
|
107
121
|
manualFeedbackText={manualFeedbackText}
|
|
108
122
|
statusLabels={statusLabels}
|
|
109
123
|
/>
|
|
124
|
+
{notice ? (
|
|
125
|
+
<div className="prizma-screen-layout__capture-notice">{notice}</div>
|
|
126
|
+
) : null}
|
|
110
127
|
{showFooter ? (
|
|
111
128
|
<div className="prizma-screen-layout__footer prizma-screen-layout__footer--pinned">
|
|
112
129
|
<PrizmaTag label={verifiedLabel} />
|
|
@@ -389,6 +389,22 @@
|
|
|
389
389
|
background: var(--prizma-surface-neutral-50);
|
|
390
390
|
align-items: center;
|
|
391
391
|
justify-content: center;
|
|
392
|
+
/* The card hugs its content and is taller than a short window: on the Duo
|
|
393
|
+
* open full screen (626) unsafe centring put 90px of it above the page and
|
|
394
|
+
* 90 below, heading cut off (sweep 2026-10-20). `safe` starts the card at
|
|
395
|
+
* the top of the page when it does not fit, and does nothing when it does
|
|
396
|
+
* (#F-37, same mechanism). The plain `center` is the fallback. */
|
|
397
|
+
justify-content: safe center;
|
|
398
|
+
}
|
|
399
|
+
|
|
400
|
+
/* …and under 720 the page scrolls, as a desktop page does when the window is
|
|
401
|
+
* shorter than its content. The shell is `overflow: hidden` for the screens
|
|
402
|
+
* that pin chrome to its edges; this page pins nothing, the tag rides in the
|
|
403
|
+
* card's band. */
|
|
404
|
+
@container pcs-screen (max-height: 720px) {
|
|
405
|
+
.prizma-screen-shell.demo-screens-redirect {
|
|
406
|
+
overflow-y: auto;
|
|
407
|
+
}
|
|
392
408
|
}
|
|
393
409
|
|
|
394
410
|
.demo-screens-redirect__card {
|