Guide to migrate V1 to V2¶

Description¶

The following table compares the configuration variables from previous XpressID version with the current one:

Note that the following configuration variables are only those that fit the new ones. To check all configuration variables for the current XpressID Web, see the configuration documentation.

Content type¶

The Content-Type value has been modified. The updated version exclusively accepts the "application/json" value. Kindly revise and modify your token request to align with this modification.

Iframe integration¶

The iframe integration has changed. Please update the URL in the iframe to load the content correctly. You can verify the iframe integration here.

The new URL for the iframe in the WORK environment is: https://xpressid-web-work.eu.veri-das.com/v2/?access_token=YOUR_ACCESS_TOKEN

The events received from the iFrame have also changed. Please check the Receiving events from the iFrame to see the new events.

Setup Configuration Components¶

Loading¶

Old configuration parameters	Old default value	Old configuration parameters	New default value
iframeLoaderColor	#3C8DBC	setup.loading.progressIndicator.color	#00051A
iframeLoaderBackgroundColor	#717171	setup.loading.progressIndicator.backgroundColor	#00D44
iframeLoaderText	Loading Cargando	setup.loading.text	Loading Cargando
iframeLoaderTextColor	#FFFFFF	setup.loading.textColor	#FFFFFF
iframeBackgroundColor	#2E2E2E	setup.loading.backgroundColor	#000D44

QR¶

Old configuration parameters	Old default value	Old configuration parameters	New default value
iframeQrTitle	We need to verify your identity Necesitamos verificar tu identidad	flowSetup.options.qr.setup.title.text	We encourage you to use yout smarthphone Le animamos a usar su smartphone
iframeQrTitleLine1	For a seamless experience, we recommend that you complete the process from your mobile phone Para que la experiencia sea perfecta, te recomendamos que realices el proceso desde tu móvil	flowSetup.options.qr.setup.subtitle.text	For a seamless experience, we recommend you to complete the process from your mobile phone. You can do this by scanning the QR code below. Para una experiencia óptima, le recomendamos que realice el proceso desde su smartphone. Puede hacerlo escaneando el código QR que se muestra a continuación.
iframeQrTitleLine2	flowSetup.options.qr.setup.subtitle.text	For a seamless experience, we recommend you to complete the process from your mobile phone. You can do this by scanning the QR code below. Para una experiencia óptima, le recomendamos que realice el proceso desde su smartphone. Puede hacerlo escaneando el código QR que se muestra a continuación.
iframeButtonQrOnboarding	Continue on desktop Continuar en escritorio	flowSetup.options.qr.setup.buttons.continue.text	Continue on desktop Continuar en escritorio
iframeTextColorQr	#ffffff	flowSetup.options.qr.setup.title.textColor flowsetup.options.qr.setup.subtitle.textColor	#000D44
iframeQrButtonBackgroundColor	#ffffff	flowSetup.options.qr.setup.buttons.continue.backgroundColor	#ffffff
iframeQrButtonTextColor	#1a5db0	flowSetup.options.qr.setup.buttons.continue.textColor	#000D44
iframeQrInitialColor	does not apply (*)
iframeQrEndColor	does not apply (*)

Document¶

Autoclassification selector¶

Old configuration parameters	Default Value (V1)	New configuration parameters	Default Value (V2)
iframeAutoClassificationSelectorInitialColor	-	does not apply (*)	-
iframeAutoClassificationSelectorEndColor	-	does not apply (*)	-
iframeAutoClassificationSelectorTitleText	Choose one of these two options Elige una de estas dos opciones	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.title.text	Choose one of these options Elige una de estas opciones
iframeAutoClassificationBackgroundColor	#FFFFFF	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.backgroundColor	#FFFFFF
iframeAutoClassificationMainColor	#1269CE	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.title.textColor	#00051A
	#1269CE	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.optionChooser.buttons.textColor	#00051A
	#1269CE	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.optionChooser.buttons.borderColor	#000D44
	#1269CE	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.optionChooser.buttons.iconColor	#000D44
	#1269CE	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.optionChooser.buttons.secondaryTextColor	#737999
iframeAutoClassificationSecondaryColor	#333333	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.optionChooser.buttons.textColor	#00051A
	#333333	flowSetup.options.document.captures.[0-2].autoclassificationSelector.setup.optionChooser.buttons.secondaryTextColor	#737999

Document & country selector¶

Old configuration parameters	Old default value	Old configuration parameters	New default value
iframeSeldocTitleText	DOCUMENT SELECTION SELECCIÓN DEL DOCUMENTO	flowSetup.options.document.captures.[0-2].documentSelector.setup.title.text	Choose your document’s country & document type Elige tu país y tipo de documento
iframeSeldocSelectCountryText	What country is your ID from? ¿De qué país es tu documento?	flowSetup.options.document.captures.[0-2].documentSelector.setup.countryChooser.title.text	What country does your document belong to? ¿A qué país pertenece tu documento?
iframeSeldocSelectDocumentTypeText	What kind of ID is it? ¿Qué documento vas a leer?	flowSetup.options.document.captures.[0-2].documentSelector.setup.documentChooser.title.text	What kind of ID is it? ¿Qué tipo de ID es?
iframeSeldocLoadingText	does not apply (*)
iframeSeldocBackgroundColor	#ffffff	flowSetup.options.document.captures.[0-2].documentSelector.setup.backgroundColor	#FFFFFF
iframeSeldocMainColor	#1a5db0	flowSetup.options.document.captures.[0-2].documentSelector.setup.title.textColor flowSetup.options.document.captures.[0-2].documentSelector.setup.countryChooser.picker.borderColor flowSetup.options.document.captures.[0-2].documentSelector.setup.documentChooser.buttons.textColor flowSetup.options.document.captures.[0-2].documentSelector.setup.documentChooser.buttons.borderColor	#000D44
iframeSeldocSecondaryColor	#000000	flowSetup.options.document.captures.[0-2].documentSelector.setup.countryChooser.title.textColor flowSetup.options.document.captures.[0-2].documentSelector.setup.countryChooser.picker.textColor flowSetup.options.document.captures.[0-2].documentSelector.setup.optionChooser.title.textColor	#EE686A
iframeSeldocInitialColor	does not apply (*)
iframeSeldocEndColor	does not apply (*)
iframeImageBackground		flowSetup.options.document.captures.[0-2].documentSelector.setup.logo. media

Document Capture¶

The following new configurations start with the following prefix: flowSetup.options.document.captures.[0-2].setup

Old configuration parameters	Old default values parameters	New configuration parameters	New default values
blurDetectorActive	-	does not apply (*)	-
borderColorCenteringAidDefault	-	does not apply (*)	-
borderColorCenteringAidDetecting	-	does not apply (*)	-
borderColorCenteringAidDetectingSuccess	#FFFFFF	`vd-document::part(capture_glowing_outline_container_success) { border-color: #9dff97 }`	#53A335
borderColorCenteringAidDetecting	#00FF00	`vd-document::part(capture_glowing_outline_container_detection) { border-color: #ff3700 }`	#ffffff
borderColorCenteringAidInactive	#717171	`vd-document::part(capture_glowing_outline_container) { border-color: #000000 }`	#FFFFFF
outerGlowCenteringAidDefault	#000000	`vd-document::part(capture_glowing_outline_container) { box-shadow: 0 0 0 9999px rgba(242, 2, 255, 0.4) }`	`{box-shadow: 0 0 0 9999px rgba(200, 200, 255, 0.4)}`
outerGlowCenteringAidDetecting	#001C00	`vd-document::part(capture_glowing_outline_container_detection) { box-shadow: 0 0 0 9999px rgba(255, 3, 3, 0.4) }`	`{box-shadow: 0 0 0 9999px rgba(200, 200, 255, 0.4)}`
borderThickness	6	`vd-document::part(capture_glowing_outline_container) { border-width: 12px }` `vd-document::part(capture_glowing_outline_container_nodetection) { border-width: 12px }` `vd-document::part(capture_glowing_outline_container_success) { border-width: 12px }` `vd-document::part(capture_glowing_outline_container_detection) { border-width: 12px }` `vd-document::part(capture_glowing_outline_container_tooFar) { border-width: 12px }`	6
buttonBackgroundColorDark	-	does not apply (*)	-
buttonBackgroundColorDarkRepeat	-	does not apply (*)	-
buttonBackgroundColorLight	-	does not apply (*)	-
buttonBackgroundColorLightRepeat	-	does not apply (*)	-
closeButton	false	generic.common.ui.buttons.close.show	false
confirmationColorTick	#737373	`vd-document::part(capture_success_tick_circle) { fill: #d0c331 }`	none
confirmationDialogBackgroundColor	#4D4B4E	`vd-document::part(review_image_container) { background-color: #b2ff7b }`	#FFFFFF
confirmationDialogTextColor	#FFFFFF	`vd-document::part(review_image_message_text) { color: #ff2d2d }`	#000D44
customConfirmationImageTick	-	does not apply (*)	-
detectionMessageBorderRadius	16px	`vd-document::part(capture_display_message) { border-radius: 32px }` `vd-document::part(rotate_device_display_message) { border-radius: 32px }`	16px
detectionMessageFontFamily	Poppins	`vd-document::part(capture_display_message_text) { font-family: cursive }` `vd-document::part(rotate_device_display_message_text) { font-family: cursive }`	PublicSans
detectionMessageFontWeight	normal	`vd-document::part(capture_display_message_text) { font-weight: 900 }` `vd-document::part(rotate_device_display_message_text) { font-weight: 900 }`	normal
detectionMessageLineHeight	normal	`vd-document::part(capture_display_message_text) { line-height: 2.5 }` `vd-document::part(rotate_device_display_message_text) { line-height: 2.5 }`	normal
detectionTimeout	300000	sdkDocument.views.capture.detectionTimeout	300000
displayErrors	-	does not apply (*)	-
errorActionButtonBackgroundColor	-	does not apply (*)	-
errorActionButtonTextColor	-	does not apply (*)	-
errorActionButtonPadding	-	does not apply (*)	-
errorDisplayBackgroundColor	-	does not apply (*)	-
errorDisplayHeaderBackgroundColor	-	does not apply (*)	-
errorDisplayHeaderTextColor	-	does not apply (*)	-
errorDisplayHeaderTitle	-	does not apply (*)	-
errorDisplayTextColor	-	does not apply (*)	-
errorDisplayUserActionShow	-	does not apply (*)	-
fontSize	-	does not apply (*)	-
infoAlertSingleSidedDocument	-	does not apply (*)	-
infoAlertTwoSidedDocument	-	does not apply (*)	-
infoAlertShow	-	does not apply (*)	-
infoAlertShowDocument	-	does not apply (*)	-
infoModalShow	true	sdkDocument.views.instructions.active	true
infoReviewBlurImageText	does not apply (*)	-	-
infoReviewImageText	Check if the photo is readable and focused Compruebe que la foto es legible y está bien enfocada	sdkDocument.views.reviewImage.card.title	Make sure there are no glares, that the data isn't covered, and that it's read correctly Asegúrese de que no hay brillos, de que los datos no están tapados y se leen correctamente
infoReviewImageTextDocument	Check if the photo is readable and focused Compruebe que la foto es legible y está bien enfocada	sdkDocument.views.reviewImage.card.title	Make sure the document is well-focused and legible Compruebe que el documento está bien enfocado y es legible
infoUserImagesPath	-	sdkDocument.pathAssets	assets
isInfoModalShow	-	does not apply (*)	-
loadingSpinnerColor	-	does not apply (*)	-
logEventsToConsole	false	generic.common.behavior.web.logEvents	true
manualCaptureEnableDelay	3000	sdkDocument.views.capture.manualCapture.manualCaptureButtonDelay	20000
message_alive_bold	-	does not apply (*)	-
restartingErrorText	The process could not be completed. Please repeat the validation. No se ha podido completar el proceso. Por favor, repita la validación.	sdkDocument.views.feedback.errors.validation.card.title	The process could not be completed. Please, try again No se ha podido completar el proceso. Por favor, inténtelo de nuevo
reviewImage	true	sdkDocument.views.reviewImage.active	true
sdkBackgroundColorInactive	#2E2E2E	`vd-selfie::part(instructions_slide) {background-color: #ca6200;}`	#3995ec
setLandscapeDeviceMessage	-	does not apply (*)	-
setMessageDisplayHeight	15%	`vd-document::part(capture_display_message) { height: 200px }` `vd-document::part(rotate_device_message) { height: 200px }`	auto
setMessageDisplayMargin	-	does not apply (*)	-
setMessageDisplayOpacity	1	`vd-document::part(capture_display_message) { opacity: 0.5 }` `vd-selfie::part(rotate_device_message) { opacity: 0.5 }`	1
setMessageDisplayPadding	5px	`vd-document::part(capture_display_message) { padding: 5% }` `vd-selfie::part(rotate_device_message) { padding: 5% }`	calc(var(--main-sdk-height) * 0.02)
setMessageDisplayPosition	auto	`vd-document::part(capture_display_message) { position: absolute }` `vd-selfie::part(rotate_device_message) { position: absolute }`	absolute
setMessageDisplayWidth	90%	`vd-document::part(capture_display_message) { width: 100px }` `vd-selfie::part(rotate_device_message) { width: 100px }`	calc(var(--main-sdk-width) * 0.8);
setPortraitDeviceMessage	-	does not apply (*)	-
showLogo	false	generic.common.ui.logo.show	true
showSpinner	-	does not apply (*)	-
targetSelector	-	does not apply (*)	-
videoErrorConstraint	-	does not apply (*)	-
videoErrorConstraintActionLabel	-	does not apply (*)	-
videoErrorDefault	Sorry, there was an error starting the camera Lo sentimos, se ha producido un error iniciando la cámara	sdkDocument.views.feedback.errors.videoErrorDefault.card.title	Sorry, there has been an error when initiating the camera Lo sentimos, se ha producido un error al iniciar la cámara
videoErrorExternalInput	-	does not apply (*)	-
videoErrorNotFound	Please check that you do not have any software simulating the camera Por favor, compruebe que no tiene ningún software simulando la cámara	sdkDocument.views.feedback.errors.videoErrorNotFound.card.title	Please check that your device has a camera Por favor, compruebe que su dispositivo dispone de cámara
videoErrorPermission	Please allow the page to access the camera Por favor, permita a la página acceso a la cámara	sdkDocument.views.feedback.errors.videoErrorPermission.card.title	Please, make sure to allow the page access to the camera and microphone Por favor, asegúrese de permitir a la página acceso a la cámara y micrófono
videoErrorPermissionActionLabel	-	does not apply (*)	-
videoErrorUnavailable	-	does not apply (*)	-
videoErrorUnavailableActionLabel	-	does not apply (*)	-
webrtcUnsupportedText	-	does not apply (*)	-
manualCaptureText	CLICK HERE to capture Haga CLICK AQUÍ para capturar	sdkDocument.views.capture.manualCapture.obverse.card.title and sdkDocument.views.capture.manualCapture.reverse.card.title	Tap to capture the FRONT side of the document Pulse para capturar la parte DELANTERA
manualCaptureTextMobile	-	does not apply (*)	-
obverseNotFoundText	-	does not apply (*)
reverseNotFoundText	-	does not apply (*)
passportNotFoundText	-	does not apply (*)	-
passportMRZError	-	does not apply (*)	-
confirmationDialogLinkTextColor	-	does not apply (*)	-
confirmationDialogButtonPadding	-	does not apply (*)	-
confirmationDialogButtonTextColor	-	does not apply (*)	-
confirmationDialogLinkTextColor	-	does not apply (*)	-
confirmationDialogButtonBackgroundColor	-	does not apply (*)	-
repeatButtonColor	-	does not apply (*)	-
repeatText	REPEAT REPETIR	sdkDocument.views.reviewImage.card.buttons.repeat.text	Repeat Repetir
confirmationRepeatButtonTextColor	#26BAB8	`vd-document::part(review_image_message_buttons_repeat) { color: #ffffff }`	#000D44
confirmationRepeatButtonBackgroundColor	transparent	`vd-document::part(review_image_message_buttons_repeat) { background: #52c923 }`	#D3EBFC
confirmationRepeatButtonPadding	0px	`vd-document::part(review_image_message_buttons_repeat) { padding: 20px }`	calc(var(--main-sdk-height) * 0.04)
continueButtonColor	-	does not apply (*)	-
continueText	CONTINUE CONTINUAR	sdkDocument.views.reviewImage.card.buttons.continue.text	Continue Continuar
confirmationCaptureButtonTextColor	#FFFFFF	`vd-document::part(review_image_message_buttons_continue) { color: #c41492 }`	#FFFFFF
confirmationCaptureButtonBackgroundColor	#26BAB8	`vd-document::part(review_image_message_buttons_continue) { background: #ccff12 }`	#000D44
confirmationCaptureButtonPadding	2% 5%	`vd-document::part(review_image_message_buttons_continue) { padding: 20px }`	calc(var(--main-sdk-height) * 0.04)
detectionMessageBackgroundColor	#6f6b6b	`vd-document::part(capture_display_message) { background-color: #b300ff }` `vd-document::part(rotate_device_display_message) { background-color: #00f7ff }`	#f2f2f2
detectionMessageTextColor	#1A5EB0	`vd-document::part(capture_display_message_text) { color: #8f7c00 }` `vd-document::part(rotate_device_display_message_text) { color: #8f7c00 }`	#000D44
detectionMessageBackgroundColorDocument	#6f6b6b	`vd-document::part(capture_display_message) { background-color: #b300ff }` `vd-document::part(rotate_device_display_message) { background-color: #00f7ff }`	#f2f2f2
detectionMessageTextColorDocument	#1A5EB0	`vd-document::part(capture_display_message_text) { color: #8f7c00 }` `vd-document::part(rotate_device_display_message_text) { color: #8f7c00 }`	#000D44
infoUserSliderButtonText	START COMENZAR	sdkDocument.views.instructions.buttons.startProcess.text	Start Comenzar
infoUserDocumentTitle	1. CENTER your document in the frame 2. Make sure your image DOES NOT show glare or shadow 3. The photo will be captured AUTOMATICALLY 1. CENTRE su documento en el marco, 2. Asegúrese de que su documento NO muestra brillos o sombras., 3. La fotografía se capturará de forma AUTOMÁTICA	sdkDocument.views.instructions.card.subtitle.documents	["Frame your document within the grid and the capture will be done automatically"] ["Frame your document within the grid and the capture will be done automatically"]
infoUserDocumentMedia	helpIconDocumentCenter	sdkDocument.views.instructions.card.media.documents	[ "/images/document1.svg", "/images/document2.svg" ]
infoUserDocumentBackgroundColorTop	#26BAB8	`vd-document::part(instructions_slide_box) { background: #7b98ff }`	#FFFFFF
infoUserDocumentBackgroundColor	#E4F6F6	`vd-document::part(instructions_slide_box) { background: #7b98ff }`	#FFFFFF
infoUserDocumentTextColor	#0E4645	`vd-document::part(instructions_slide_box_subtitle) { color: #89ff4a }`	#000D44
infoUserDocumentBorderColor	-	does not apply (*)	-
infoUserDocumentFontSize	-	does not apply (*)	-
infoUserDocumentBackgroundColorButton	#26BAB8	`vd-document::part(instructions_slide_button) { background: #ff39ee }`	#000D44
infoUserDocumentTextColorButton	#051717	`vd-document::part(instructions_slide_button) { color: #40ff00 }`	#FFFFFF
infoUserDocumentPaddingButton	2% 10%	`vd-document::part(instructions_slide_button) { padding: 20px }`	calc(var(--main-sdk-height) * 0.02)
firstArrow	-	does not apply (*)	-
secondArrow	-	does not apply (*)	-
thirdArrow	-	does not apply (*)	-
fourthArrow	-	does not apply (*)	-
fifthArrow	-	does not apply (*)	-
loadingSpinnerScreenBackgroundColor	-	does not apply (*)	-
permissionRefused	-	sdkDocument.views.feedback.errors.videoErrorPermission.card.title	-
permissionRefusedTitle	-	sdkDocument.views.feedback.errors.videoErrorPermission.card.header	-
tooFarText	Too Far Demasiado lejos	sdkDocument.views.capture.tooFar.obverse.card.title and sdkDocument.views.capture.tooFar.reverse.card.title	Zoom in the document Acerque el documento
tooCloseText	-	does not apply (*)	-

Selfie Capture¶

The following new configurations start with the following prefix: flowSetup.options.selfie.setup

Old configuration parameters	Old default values parameters	New configuration	New default values
aliveChallenge	-	sdkSelfie.views.capture.head.token	-
borderColorCenteringAidDefault	does not apply (*)	-	-
borderColorCenteringAidDetectingSuccess	#FFFFFF	`vd-selfie::part(capture_glowing_outline_container_success) {background-color: transparent; border-width: 15px; border-color: #53A335; border-style: solid; border-radius: 50%;}`	background-color: transparent; border-width: 4px; border-color: #53A335; border-style: solid; border-radius: 50%;
borderColorCenteringAidFaceDetecting	#3B9DD6	`vd-selfie::part(capture_glowing_outline_container_detection) {background-color: transparent;border-width: 15px;border-radius: 20%;border-color: var(--color-alert-detection);border-style: solid;}`	background-color: transparent;border-width: 4px;border-radius: 20%;border-color: var(--color-alert-detection);border-style: solid;
borderColorCenteringAidInactive	#717171	`vd-selfie::part(capture_glowing_outline_container) {background-color: transparent; border-width: 15px; border-radius: 20%; border-color: #ffffff; border-style: solid;}`	background-color: transparent; border-width: 4px; border-radius: 20%; border-color: #ffffff; border-style: solid;
borderThickness	6	`vd-selfie::part(capture_glowing_outline_container_success) {border-width: 10px;}` vd-selfie::part(capture_glowing_outline_container_detection) {`border-width: 10px;`} vd-selfie::part(capture_glowing_outline_container) {`border-width: 10px;`}	border-width: 4px;
buttonBackgroundColorDark	does not apply (*)
buttonBackgroundColorDarkRepeat	does not apply (*)
buttonBackgroundColorLight	does not apply (*)
buttonBackgroundColorLightRepeat	does not apply (*)
center_face	Center your face Centra su cara	sdkSelfie.views.capture.guidance.notCentered.card.title	Recenter your face within the oval Vuelva a centrar su cara en el óvalo
closeButton	false	generic.common.ui.buttons.close.show	false
confirmationColorTick	#737373	`vd-selfie::part(capture_success_tick_circle) {fill: #d0c331;}`	stroke: #53A335; fill: none;
confirmationDialogBackgroundColor	#4D4B4E	`vd-selfie::part(review_image_container) {background-color: #a83297;}` `vd-selfie::part(review_image) {background-color: #a83297;}` `vd-selfie::part(review_image_message) {background-color: #a83297;}`	#FFFFFF
confirmationDialogTextColor	#FFFFFF	`vd-selfie::part(review_image_message_text) {color: #a83297;}` `vd-selfie::part(review_image_img_container) {border-color: #a83297;}`	color: #000D44 border-color: #F2F2F2
continueButtonColor	#FFFFFF	`vd-selfie::part(review_image_message_buttons_continue) {color: #2d5aed;}`	#FFFFFF
continueText	CONTINUE CONTINUAR	sdkSelfie.views.reviewImage.card.buttons.continue.text	Continue Continuar
customConfirmationImageTick	does not apply (*)	-	-
customOval	does not apply (*)	-	-
customOvalBorderRadius	51% 49% 49% 51% / 33% 32% 68% 67%	`vd-selfie::part(capture_glowing_outline_container_success) {border-radius: 100%;}` `vd-selfie::part(capture_glowing_outline_container_detection) {border-radius: 100%;}` `vd-selfie::part(capture_glowing_outline_container) {border-radius: 100%;}`	50%
detectionMessageBackgroundColorSelfie	#FFFFFF	`vd-selfie::part(capture_display_message) {background-color: #32a832}` `vd-selfie::part(capture_glowing_outline_top_div) {background-color: #32a850}`	#FFFFFF
detectionMessageBorderRadius	16px	`vd-selfie::part(capture_display_message) {border-radius: 40px;}`	16px
detectionMessageFontFamily	does not apply (*)	-	-
detectionMessageFontWeight	normal	`vd-selfie::part(capture_display_message) {font-weight: 900;}`	400
detectionMessageLineHeight	normal	`vd-selfie::part(capture_display_message) {line-height: 0%;}`	1.5
detectionMessageTextColorSelfie	#1A5EB0	`vd-selfie::part(capture_display_message_text) {color: #a83297}` `vd-selfie::part(capture_glowing_outline_top_message) {color: #a83297}`	#000D44
detectionTimeout	300000	sdkSelfie.views.capture.detectionTimeout	300000
detectionMessageFontWeight	normal	`vd-document::part(capture_display_message_text) { font-weight: 900 }` `vd-document::part(rotate_device_display_message_text) { font-weight: 900 }`	normal
detectedDocumentOutlineColor	does not apply (*)	-	-
displayErrors	does not apply (*)	-	-
errorActionButtonBackgroundColor	transparent	-	-
errorActionButtonTextColor	#FFFFFF	-	-
errorDisplayBackgroundColor	#4D4B4E	-	-
errorDisplayHeaderBackgroundColor	#4D4B4E	-	-
errorDisplayHeaderTextColor	#FFFFFF	-	-
errorDisplayHeaderTitle	does not apply (*)	sdkSelfie.views.feedback.errors.videoErrorPermission.card.title	Please, make sure to allow the page access to the camera and microphone Por favor, asegúrese de permitir a la página acceso a la cámara y micrófono
errorDisplayTextColor	does not apply (*)	-	-
errorDisplayUserActionShow	does not apply (*)	-	-
fitYourFace	Now, place your face inside the frame and hold steady while we take a photo Ahora, encaja tu cara en el marco y mantente estable mientras tomamos una foto	sdkSelfie.views.capture.guidance.selfie.card.title	`Fit your face into the frame and look to the camera <br>` Centre su cara en el marco, y mire hacia la cámara
fontSize	does not apply (*)	-	-
infoAlertShow	does not apply (*)	-	-
infoAlertShowSelfie	does not apply (*)	-	-
infoAlertShowSelfieAlive	does not apply (*)	-	-
infoModalShow	true	sdkSelfie.views.instructions.active	true
infoReviewImageText	Check if the photo is readable and focused Comprueba que la foto es legible y está bien enfocada	sdkSelfie.views.reviewImage.card.title	Make sure the face appears good and has a natural expression Asegúrese de que la cara se ve bien y tiene una expresión natural
infoReviewImageTextSelfieAlive	Check if the photo is readable and focused Comprueba que la foto es legible y está bien enfocada	sdkSelfie.views.reviewImage.card.title	Make sure the face appears good and has a natural expression Asegúrese de que la cara se ve bien y tiene una expresión natural
infoReviewImageTextSelfie	Check if the photo is readable and focused Comprueba que la foto es legible y está bien enfocada	sdkSelfie.views.reviewImage.card.title	Make sure the face appears good and has a natural expression Asegúrese de que la cara se ve bien y tiene una expresión natural
infoUserSelfieTitle	'A photo of your face will be captured AUTOMATICALLY' 'Se capturará AUTOMATICAMENTE una foto de su cara'	sdkSelfie.views.instructions.card.title.selfie	["Position yourself in front of the camera"] ["Posiciónese frente a la cámara"]
infoUserSelfieMedia	helpIconSmile	sdkSelfie.views.instructions.card.media.selfie	"/images/alive01.png"
infoUserSelfieBackgroundColorTop	does not apply (*)	-	-
infoUserSelfieBackgroundColor	#FFFFFF	colorNeutral00	#FFFFFF
infoUserSelfieTextColor	#0e4645	`vd-selfie::part(instructions_slide_box_title) {color: #000D44;}`	#000D44
infoUserSelfieBackgroundColorButton	#26BAB8	`vd-selfie::part(instructions_slide_button) {background: #26f058;}`	#FFFFFF
infoUserSelfieTextColorButton	#051717	`vd-selfie::part(instructions_slide_button) {color: #26f058;}`	#000D44
infoAlertPhotoSelfie	does not apply (*)	-	-
infoUserAliveBackgroundColor	#FFFFFF	-	-
infoUserAliveButtonText	START THE PROCESS COMENZAR EL PROCESO	sdkSelfie.views.instructions.buttons.startProcess.text	Start Comenzar
infoUserAliveColorButton	linear-gradient(to right, #005db4, #009edd 100%)	`vd-selfie::part(instructions_slide_button) {background: #26f058;}`	-
infoUserAliveHeader	does not apply (*)	-	-
infoUserAliveHeaderColor	does not apply (*)	-	-
infoUserAliveMedia	['slide03']	sdkSelfie.views.instructions.card.media	["alive01.png", "alive02.png"]
infoUserAliveNextButtonColor	#1a5eb0	`vd-selfie::part(instructions_slide_button_next) {color: #26f058;}`	-
infoUserAliveNextButtonText	Next Siguiente	sdkSelfie.views.instructions.card.buttons.next.text	Next Siguiente
infoUserAlivePrevButtonColor	#1a5eb0	`vd-selfie::part(instructions_slide_button_prev) {color: #26f058;}`	-
infoUserAlivePrevButtonText	Previous Anterior	sdkSelfie.views.instructions.card.buttons.previous.text	Previous Anterior
infoUserAliveSubTitle	['1. Fit your face into the frame and wait the countdown. 2. Move your head slightly in one direction. 3. When the screen tells you that you have done it correctly, look back at the center. 4. The process will be repeated 2 times.'] ['1. Encaja la cara en el marco y espera a la cuenta atrás. 2. Mueva la cabeza ligeramente en la dirección que te indiquen las flechas. 3. Cuando la pantalla te indique que lo has hecho correctamente, vuelve a mirar al centro. 4. Repite el proceso 2 veces.']	sdkSelfie.views.instructions.card.subtitle.head	["Make sure you are not wearing sunglasses, hats, or other items that cover your face", "Fit the face in the frame and move your head slightly in the directions indicated by the arrow."] [ "Asegúrese de no llevar gafas de sol, gorras u otros elementos que tapen su cara", "Encaje la cara en el marco y mueva la cabeza ligeramente en las direcciones que le vaya indicando la flecha"]
infoUserAliveSubTitleColor	#868686	`vd-selfie::part(instructions_slide_box_subtitle) {color: #26f058;}`	#000D44
infoUserAliveTitle	['Follow the motion instructions'] ['Sigue las instrucciones de movimiento']	sdkSelfie.views.instructions.card.title.head	["Position yourself in front of the camera", "Follow the instructions"] ["Posiciónese frente a la cámara", "Siga las instrucciones"]
infoUserAliveTitleColor	#1a5eb0	`vd-selfie::part(instructions_slide_box_title) {color: #26f058;}`	#000D44
isInfoModalShow	does not apply (*)	-	-
loadingSpinnerColor	does not apply (*)	-	-
logEventsToConsole	false	generic.common.behavior.web.logEvents	false
message_alive_bold	does not apply (*)	-	-
message_alive_light	Move your head Mueva la cabeza	sdkSelfie.views.capture.head.card.title.movement	Head movements Movimientos de cabeza
message_finish_challenge	does not apply (*)	-	-
message_middle_center	Great! Look back at the center ¡Bien! Vuelve al centro	sdkSelfie.views.capture.head.card.title.back	Great! Look back to the center ¡Bien! Vuelva a mirar al centro
not_move	does not apply (*)	-	-
outerGlowCenteringAidDefault	#000000	`vd-selfie::part(capture_glowing_outline_container) {border-color: #ffffff}`	#ffffff
outerGlowCenteringAidDetecting	#001C00	`vd-selfie::part(capture_glowing_outline_container_detection) {border-color: #257CD0}`	#257CD0
repeatButtonColor	#1A5EB0	-	-
repeatText	REPEAT QUIERO REPETIR	sdkSelfie.views.reviewImage.card.buttons.repeat.text	Repeat Repetir
restartingErrorText	The process could not be completed. Please repeat the validation. No se ha podido completar el proceso. Por favor, repita la validación.	sdkSelfie.views.feedback.errors.validation.card.title	The process could not be completed. Please, try again No se ha podido completar el proceso. Por favor, inténtelo de nuevo
reviewImage	true	sdkSelfie.views.reviewImage.active	false
sdkBackgroundColorInactive	#2E2E2E	`vd-selfie::part(instructions_slide) {background-color: #ca6200;}`	#FFFFFF
setLandscapeDeviceMessage	does not apply (*)
setMessageDisplayHeight	15%	`vd-selfie::part(capture_display_message) {height: 200px;}` `vd-selfie::part(capture_display_message) {height: 200px;}`	auto
setMessageDisplayMargin	does not apply (*)	-	-
setMessageDisplayOpacity	1	`vd-selfie::part(capture_display_message) {opacity: 0.5;}`	1
setMessageDisplayPadding	5px	`vd-selfie::part(capture_display_message) {padding: 5%;}`	-
setMessageDisplayPosition	auto	`vd-selfie::part(capture_display_message) {position: absolute;}`	auto
setMessageDisplayWidth	90%	`vd-selfie::part(capture_display_message) {width: 100px;}`	auto
setPortraitDeviceMessage	Please, hold the device in portrait mode Por favor, ponga el dispositivo vertical	sdkSelfie.views.deviceRotated.card.title	To continue, put the phone in the correct orientation Para continuar, coloque el teléfono en orientación correcta
showLogo	false	generic.common.ui.logo.show	false
showSpinner	does not apply (*)	-	-
smileRequestSerious	does not apply ()()	-	-
smileRequestSmile	does not apply ()()	-	-
stepChallenge	does not apply (*)	-	-
stepOfChallenge	does not apply (*)	-	-
stepsChallengeColor	does not apply (*)	-	-
targetSelector	does not apply (*)	-	-
videoErrorConstraint	does not apply (*)	-	-
videoErrorConstraintActionLabel	does not apply (*)	-	-
videoErrorDefault	Sorry, there was an error starting the camera Lo sentimos, se ha producido un error iniciando la cámara	sdkSelfie.views.feedback.errors.videoErrorDefault.card.title	- Sorry, there was an error starting the camera Lo sentimos, se ha producido un error iniciando la cámara
videoErrorExternalInput	does not apply (*)	-	-
videoErrorNotFound	Please check that you do not have any software simulating the camera Por favor, compruebe que no tiene ningún software simulando la cámara	sdkSelfie.views.feedback.errors.videoErrorNotFound.card.title	Please check that you do not have any software simulating the camera Por favor, compruebe que no tiene ningún software simulando la cámara
videoErrorPermission	Please allow the page to access the camera Por favor, permita a la página acceso a la cámara	sdkSelfie.views.feedback.errors.videoErrorPermission.card.title	Please, make sure to allow the page access to the camera and microphone Por favor, asegúrese de permitir a la página acceso a la cámara y micrófono
videoErrorPermissionActionLabel	does not apply (*)	-	-
videoErrorUnavailable	does not apply (*)	-	-
videoErrorUnavailableActionLabel	does not apply (*)	-	-
webrtcUnsupportedText	does not apply (*)	-	-
enableEnviromentCamera	false	sdkSelfie.views.capture.selectCamera	front

Video Capture¶

The following new configurations start with the following prefix: flowSetup.options.video.setup

Old configuration parameters	Old default values parameters	New configuration	New default values
borderColorCenteringAidDetecting	-	does not apply (*)	-
borderColorCenteringAidInactive	#717171	`vd-video::part(capture_glowing_outline_container) {border: 30px solid #a830cc;}`	#FFFFFF
borderThickness	6	`vd-video::part(capture_glowing_outline_container_success) {border: 30px solid #a830cc;}` `vd-video::part(capture_glowing_outline_container_detection) {border: 30px solid #a830cc;}` `vd-video::part(capture_glowing_outline_container) {border: 30px solid #a830cc;}`	border-width: 4px;
closeButton	false	generic.common.ui.buttons.close.show	false
infoFaceRecording	Please say your first and last name Diga su NOMBRE y APELLIDOS	sdkVideo.views.capture.guidance.nameAndSurname.card.title	ES: Diga su nombre y apellidos en voz alta EN: Say your first and last name out loud
infoFaceRecordingRandomNumber	-	does not apply (*)	-
infoReverseRecording	And now the BACK Y ahora la parte TRASERA	sdkVideo.views.capture.guidance.preCapture.reverse.card.title	ES: Muestre la parte TRASERA del documento en la CÁMARA FRONTAL EN: Show the BACK of the document to the FRONT CAMERA
infoObverseRecording	Please show the FRONT of the document Muestre la parte DELANTERA del documento	sdkVideo.views.capture.guidance.preCapture.obverse.card.title	ES: Muestre la parte DELANTERA del documento dentro del recuadro en la CÁMARA FRONTAL EN: Show the FRONT of the document to the FRONT CAMERA
confirmationColorTick	#737373	`vd-video::part(capture_success_tick_circle) {stroke: #a8329d; fill: none;}`	stroke: #53A335; fill: none;
customConfirmationImageTick	-	does not apply (*)	-
detectionTimeout	300000	sdkVideo.views.capture.detectionTimeout	120000
continueText	-	does not apply (*)	-
displayErrors	-	does not apply (*)	-
errorActionButtonBackgroundColor	-	does not apply (*)	-
errorActionButtonTextColor	-	does not apply (*)	-
errorDisplayBackgroundColor	-	does not apply (*)	-
errorDisplayTextColor	-	does not apply (*)	-
errorDisplayUserActionShow	-	does not apply (*)	-
errorDisplayIconColor	-	does not apply (*)	-
fontSize	-	does not apply (*)	-
infoAlertShow	-	does not apply (*)	-
infoAlertShowVideo	-	does not apply (*)	-
infoModalShow	true	sdkVideo.views.instructions.active	false
isInfoModalShow	-	does not apply (*)	-
infoAlertVideoSelfie	-	does not apply (*)	-
logEventsToConsole	false	generic.common.behavior.web.logEvents	false
sdkBackgroundColorInactive	#2E2E2E	vd-video::part(instructions_slide)	#FFFFFF
dataSaveMode	-	does not apply (*)	-
setLandscapeDeviceMessage	-	does not apply (*)	-
setPortraitDeviceMessage	Please, hold the device in portrait mode Por favor, ponga el dispositivo vertical	sdkVideo.views.deviceRotated.card.title	To continue, put the phone in VERTICAL orientation Para continuar, coloque el teléfono en orientación VERTICAL
showLogo	false	generic.common.ui.logo.show	true
customLogo	""	generic.common.ui.logo.media	/images/veridasLogo.png
targetSelector	-	does not apply (*)	-
videoErrorConstraint	-	does not apply (*)	-
videoErrorConstraintActionLabel	-	does not apply (*)	-
videoErrorDefault	Sorry, there was an error starting the camera Lo sentimos, se ha producido un error iniciando la cámara	does not apply (*)	-
videoErrorExternalInput	-	does not apply (*)	-
videoErrorNotFound	Please check that you do not have any software simulating the camera Por favor, compruebe que no tiene ningún software simulando la cámara	does not apply (*)	-
videoErrorPermission	Please allow the page to access the camera Por favor, permita a la página acceso a la cámara	sdkVideo.views.feedback.errors.videoErrorPermission.card.title	Please, make sure to allow the page access to the camera and microphone Por favor, asegúrese de permitir a la página acceso a la cámara y micrófono
videoErrorPermissionActionLabel	-	does not apply (*)	-
videoErrorUnavailable	-	does not apply (*)	-
videoErrorUnavailableActionLabel	-	does not apply (*)	-
webrtcUnsupportedText	-	does not apply (*)	-
detectionMessageBackgroundColor	#737373	`vd-video::part(capture_display_message) { background-color: #b300ff }`	#FFFFFF
detectionMessageTextColor	#FFFFFF	`vd-video::part(capture_display_message_text) { color: #8f7c00 }`	#000D44
detectionMessageBackgroundColorVideo	#737373	`vd-video::part(capture_display_message) { background-color: #b300ff }`	#FFFFFF
detectionMessageTextColorVideo	#FFFFFF	`vd-video::part(capture_display_message_text) { color: #8f7c00 }`	#000D44
infoUserSliderButtonText	START COMENZAR	sdkVideo.views.instructions.buttons.startProcess.text	Start Comenzar
forceAlternativeVideoRecorder	false	sdkVideo.views.capture.alternativeVideoRecorder	false
infoUserVideoMedia	helpIconDocumentCenter	sdkVideo.views.instructions.card.media.video	[ "/images/document1.svg", "/images/document2.svg" ]
infoUserVideoBackgroundColor	#E4F6F6	`vd-video::part(instructions_slide_box) { background: #7b98ff }`	#FFFFFF
infoUserVideoBackgroundColorTop	#26BAB8	`vd-video::part(instructions_slide_box) { background: #7b98ff }`	#FFFFFF
infoUserVideoBackgroundColorButton	#26BAB8	`vd-video::part(instructions_slide_button) { background: #ff39ee }`	#000D44
infoUserVideoTextColor	#0E4645	`vd-video::part(instructions_slide_box_subtitle) { color: #89ff4a }`	#424242
infoUserVideoFontSize	-	does not apply (*)	-
infoUserVideoTextColorButton	#051717	`vd-video::part(instructions_slide_button) { color: #40ff00 }`	#FFFFFF
infoUserVideoPaddingButton	2% 10%	`vd-video::part(instructions_slide_button) { padding: 20px }`	auto
infoUserButtonTextColor	-	does not apply (*)	-
infoUserButtonBackgroundColor	-	does not apply (*)	-
infoUserVideoTitle	1. Please say your NAME and SURNAME when prompted 2. Show the FRONT part of your document 3. Show the BACK of your document 1. Diga su NOMBRE y APELLIDOS cuando se le solicite 2. Muestra la parte DELANTERA de su documento 3. Muestra la parte TRASERA de su documento	sdkVideo.views.instructions.card.subtitle.video	ES: [1. Centre su cara en el marco, mire hacia la cámara y no sonría. 2. Diga su nombre y apellidos en voz alta cuando se indique en pantalla, Muestre el documento a cámara, primero la parte delantera y luego la parte trasera, como se indica en pantalla,] EN: [1. Center your face within the frame and do not smile. 2. Say your first and last name out loud when prompted on screen, Show the document to the camera, first the front and then the back, as indicated on the screen,]
videoErrorExternalInputLabel	Retry Reintenta	does not apply (*)	-
customOval	-	does not apply (*)	-
customOvalBorderRadius	51% 49% 49% 51% / 33% 32% 68% 67%	`vd-video::part(capture_glowing_outline_container_detection) {border-radius: 2px}` `vd-video::part(capture_glowing_outline_container) {border-radius: 2px}` `vd-video::part(capture_glowing_outline_container_faceNotCentered) {border-radius: 2px}`	20%
errorBoxBackgroundColor	-	does not apply (*)	-
errorBoxTextColor	-	does not apply (*)	-
errorBoxTitle	-	does not apply (*)	-
errorBoxButtonColor	-	does not apply (*)	-
errorBoxButtonText	-	does not apply (*)	-
errorBoxButtonTextColor	-	does not apply (*)	-
obverseDocumentErrorBoxSubTitle	-	does not apply (*)	-
reverseDocumentErrorBoxSubTitle	-	does not apply (*)	-
resetVideoBoxSubTitle	-	does not apply (*)	-
recordingTimeStates	-	does not apply (*)	-
smartRecordingTimeStates	-	does not apply (*)	-
saveVideoToLocal	-	does not apply (*)	-
faceDetectionTime	-	does not apply (*)	-
faceWarningDelayTime	-	does not apply (*)	-
videoRecordingMaxTime	-	does not apply (*)	-
faceErrorBoxSubTitle	-	does not apply (*)	-
obverseDocumentWarningDelayTime	-	does not apply (*)	-
reverseDocumentWarningDelayTime	-	does not apply (*)	-
videoToken	-	does not apply (*)	-
enableVideoToken	-	does not apply (*)	-
ovalFaceDetectionColor	#00FF00	`vd-video::part(capture_glowing_outline_container_detection) {border-color: #f2f2f2}` `vd-video::part(capture_glowing_outline_container) {border-color: #f2f2f2}` `vd-video::part(capture_glowing_outline_container_faceNotCentered) {border-color: #f2f2f2}`	`#257CD0` `#ffffff` `#f2f2f2`
confirmationDialogBackgroundColor	-	does not apply (*)	-
confirmationDialogTextColor	-	does not apply (*)	-
confirmationDialogButtonPadding	-	does not apply (*)	-
confirmationDialogLinkTextColor	-	does not apply (*)	-
confirmationDialogButtonBackgroundColor	-	does not apply (*)	-
detectionStageCustomLogo	-	does not apply (*)	-
backgroundColorEffectMessage	-	does not apply (*)	-

Esign¶

The following new configurations start with the following prefix: flowSetup.options.esign.setup

Old configuration parameters	Old default values parameters	New configuration	New default values
iframeEsignWidth	-	does not apply (*)	-
iframeEsignHeight	-	does not apply (*)	-
iframeEsignMainColor	#1a5db0	backgroundColor	#FFFFFF
iframeEsignTitleText	Sign here Firme aquí	title.text	Sign here Firme aquí
iframeEsignSignInputDefaultText	Name or initials* Nombre o iniciales*	textInput.placeHolder.text	Name or initials Nombre o iniciales
iframeEsignTermsAndConditionsAcceptText	Accept terms & conditions Aceptar términos y condiciones	checkbox.text	Accept terms & conditions Aceptar términos y condiciones
iframeEsignSignButtonText	Sign Firmar	buttons.sign.text	Sign Firmar
iframeEsignRefuseButtonText	Refuse Rechazar	buttons.refuse.text	Refuse Rechazar
iframeEsignTermsAndConditionsText	-	modal.title.text, modal.description.text	-
iframeEsignAcceptPopupButtonText	Accept Aceptar	modal.buttons.accept.text	Accept Aceptar
iframeEsignClosePopupButtonText	Close Cerrar	modal.buttons.close.text	Close Cerrar
iframeEsignInitialColor	-	does not apply (*)	-
iframeEsignEndColor	-	does not apply (*)	-

Success¶

Old configuration parameters	Old default values parameters	New configuration	New default values
iframeCheckText	The process has finished successfully. El proceso ha finalizado correctamente.	setup.success.text	The process has been successfully completed El proceso se ha completado con éxito
iframeCheckTextColor	#595959	setup.success.textColor	#000D44
iframeCheckBorderColor	#595959	setup.success.iconColor	#000D44
iframeCheckTickColor	#595959	setup.success.iconColor	#000D44
iframeLoadFinal	true	setup.success.show	true

Old configuration parameters	Old default values parameters	New configuration	New default values
iframeErrorDocumentAnversoText	The analysis of the obverse of the document has failed. Please repeat the process El análisis del anverso del documento ha fallado. Por favor, repita el proceso	setup.errorModal.document.obverse.message	An error has occurred, try again later. Ha ocurrido un error, inténtalo más tarde.
iframeErrorDocumentReverseText	The analysis of the reverse of the document has failed. Please repeat the process El análisis del reverso del documento ha fallado. Por favor, repita el proceso	setup.errorModal.document.reverse.message	An error has occurred, try again later. Ha ocurrido un error, inténtalo más tarde.
iframeErrorSelfieText	The face analysis has failed. Please repeat the process El análisis de la cara ha fallado. Por favor, repita el proceso	setup.errorModal.selfie.message	An error has occurred, try again later. Ha ocurrido un error, inténtalo más tarde.
iframeErrorVideoText	The video analysis has failed. Please repeat the process El análisis del video ha fallado. Por favor, repita el proceso	setup.errorModal.video.message	An error has occurred, try again later. Ha ocurrido un error, inténtalo más tarde.
iframeErrorConnectionText	There has been a problem with the connection. Please repeat the process Ha habido un problema con la conexión. Por favor, repita el proceso	setup.errorModal.connection.message	An error has occurred, try again later. Ha ocurrido un error, inténtalo más tarde.
iframeShowErrorAlert	true	setup.errorModal.show	true

(*) does not apply. It means that the element no longer exists or has been remapped to another property that encompasses multiple elements. For example, color elements have been moved to themes.

DEPRECATED¶

iframeErrorBrowserNotSupported, iframeInitialColor, iframeEndColor

Example¶

XpressID v1¶

Document capture¶

{
    "documentType": "ES2_ID",
    "flowId": "document",
    "configData": {
      "iframeLoaderColor": "#FF7777",
      "iframeLoaderBackgroundColor": "#FFFFFF",
      "iframeLoaderTextColor": "#FFFFFF",
      "iframeBackgroundColor": "#000D44",
      "iframeErrorDocumentAnversoText": "The front of the document is not valid",
      "iframeErrorDocumentReverseText": "The back of the document is not valid",
      "iframeCheckText": "Process completed successfully",
      "iframeCheckTextColor": "#000D44",
      "iframeCheckBorderColor": "#078B3C",
      "iframeCheckTickColor": "#078B3C",
      "continueText": "Continue",
      "repeatText": "Repeat",
      "infoReviewImageTextDocument": "Check that all data in the document is clearly readable and that there are no glares"
    }
}

Document Selector + document capture + selfie passive capture¶

{
    "documentType": "ES2_ID",
    "flowId": "seldoc_document_selfie",
    "configData": {
      "iframeLoaderColor": "#FF7777",
      "iframeLoaderBackgroundColor": "#FFFFFF",
      "iframeLoaderTextColor": "#FFFFFF",
      "iframeBackgroundColor": "#000D44",
      "iframeErrorDocumentAnversoText": "The front of the document is not valid",
      "iframeErrorDocumentReverseText": "The back of the document is not valid",
      "iframeErrorSelfieText": "The selfie is not valid",
      "iframeCheckText": "Process completed successfully",
      "iframeCheckTextColor": "#000D44",
      "iframeCheckBorderColor": "#078B3C",
      "iframeCheckTickColor": "#078B3C",
      "iframeQrTitle": "Scan the QR code",
      "iframeButtonQrOnboarding": "Continue",
      "iframeQrButtonBackgroundColor": "#FF7777",
      "iframeSeldocTitleText": "Document selector",
      "iframeSeldocSelectCountryText": "Select your country",
      "iframeSeldocMainColor": "#000D44",
      "continueText": "Continue",
      "repeatText": "Repeat",
      "infoReviewImageTextDocument": "Check that all data in the document is clearly readable and that there are no glares"
    },
    "mobileQrRedirect": "https://yourDomain.com",
    "mobileQrParams": {
        "sessionid": "1672632",
        "language": "es"
    }
}

Document capture + selfie active capture¶

{
    "documentType": "ES2_ID",
    "flowId": "document_selfiealive",
    "configData": {
      "iframeLoaderColor": "#FF7777",
      "iframeLoaderBackgroundColor": "#FFFFFF",
      "iframeLoaderTextColor": "#FFFFFF",
      "iframeBackgroundColor": "#000D44",
      "iframeErrorDocumentAnversoText": "The front of the document is not valid",
      "iframeErrorDocumentReverseText": "The back of the document is not valid",
      "iframeCheckText": "Process completed successfully",
      "iframeCheckTextColor": "#000D44",
      "iframeCheckBorderColor": "#078B3C",
      "iframeCheckTickColor": "#078B3C",
      "continueText": "Continue",
      "repeatText": "Repeat",
      "infoReviewImageTextDocument": "Check that all data in the document is clearly readable and that there are no glares",
      "message_finish_challenge": "Great!",
      "infoUserAliveNextButtonText": "Next",
    }
}

XpressID v2¶

Document capture¶

{
    "platform": "web",
    "operationMode": "idv",
    "flowSetup": {
        "stages": ["document"],
        "core": {
            "confirmProcess": true
        },
        "options": {
            "document": {
                "captures": [
                    {
                        "documentTypes": ["ES2_ID"],
                        "setup": {
                            "sdkDocument": {
                                "views": {
                                    "reviewImage": {
                                        "card": {
                                            "title": "Check that all data in the document is clearly readable and that there are no glares",
                                            "buttons": {
                                                "continue": {
                                                    "text": "Continue"
                                                },
                                                "repeat": {
                                                    "text": "Repeat"
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }

                ]
            }
        }
    },
    "setup": {
        "success": {
            "text": "Process completed successfully",
            "textColor": "#000D44",
            "iconColor": "#078B3C"
        },
        "errorModal": {
            "document": {
                "obverse": {
                    "message": "The front of the document is not valid"
                },
                "reverse": {
                    "message": "The back of the document is not valid"
                }
            }
        },
        "loading": {
            "progressIndicator": {
                "color": "#FF7777",
                "backgroundColor": "#FFFFFF"
            },
            "textColor": "#000D44",
            "backgroundColor": "#000D44"
        }
    }
}

Document selector + document capture + selfie passive capture¶

{
    "platform": "web",
    "operationMode": "idv",
    "flowSetup": {
        "stages": ["qr","document","selfie"],
        "core": {
            "confirmProcess": true
        },
        "options": {
            "document": {
                "captures": [
                    {
                        "documentTypes": ["SelectedByUser"],
                        "setup": {
                            "sdkDocument": {
                                "views": {
                                    "reviewImage": {
                                        "card": {
                                            "title": "Check that all data in the document is clearly readable and that there are no glares",
                                            "buttons": {
                                                "continue": {
                                                    "text": "Continue"
                                                },
                                                "repeat": {
                                                    "text": "Repeat"
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        },
                        "documentSelector": {
                            "setup": {
                                "title": {
                                    "text": "Document selector",
                                    "textColor": "#000D44"
                                },
                                "countryChooser": {
                                    "title" : {
                                        "text" : "Select your country"
                                    },
                                    "picker": {
                                        "borderColor": "#000D44"
                                    }
                                },
                                "documentChooser": {
                                    "buttons": {
                                        "textColor": "#000D44",
                                        "borderColor": "#000D44"
                                    }
                                }
                            }
                        }
                    }

                ]
            },
            "selfie": {
                "liveness": "passive",
                "setup": {
                    "sdkSelfie": {
                        "views": {
                            "reviewImage": {
                                "card": {
                                    "buttons": {
                                        "continue": {
                                            "text": "Continue"
                                        },
                                        "repeat": {
                                            "text": "Repeat"
                                        }
                                    }
                                }
                            }
                        }
                    }
                }

            },
            "qr": {
                "redirectionUrl": "https://yourDomain.com/?sessionid=1672632&language=es",
                "setup": {
                    "title": {
                        "text": "Scan the QR code"
                    },
                    "buttons": {
                        "continue": {
                            "text": "Continue",
                            "backgroundColor": "#FF7777"
                        }
                    }
                }
            }
        }
    },
    "setup": {
        "success": {
            "text": "Process completed successfully",
            "textColor": "#000D44",
            "iconColor": "#078B3C"
        },
        "errorModal": {
            "document": {
                "obverse": {
                    "message": "The front of the document is not valid"
                },
                "reverse": {
                    "message": "The back of the document is not valid"
                }
            },
            "selfie": {
                "message": "The selfie is not valid"
            }
        },
        "loading": {
            "progressIndicator": {
                "color": "#FF7777",
                "backgroundColor": "#FFFFFF"
            },
            "textColor": "#000D44",
            "backgroundColor": "#000D44"
        }
    }
}

Document capture + selfie active capture¶

{
    "platform": "web",
    "operationMode": "idv",
    "flowSetup": {
        "stages": ["document","selfie"],
        "core": {
            "confirmProcess": true
        },
        "options": {
            "document": {
                "captures": [
                    {
                        "documentTypes": ["ES2_ID"],
                        "setup": {
                            "sdkDocument": {
                                "views": {
                                    "reviewImage": {
                                        "card": {
                                            "title": "Check that all data in the document is clearly readable and that there are no glares",
                                            "buttons": {
                                                "continue": {
                                                    "text": "Continue"
                                                },
                                                "repeat": {
                                                    "text": "Repeat"
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }

                ]
            },
            "selfie": {
                "liveness": "active",
                "challengeLength": 2,
                "setup": {
                    "sdkSelfie": {
                        "views": {
                            "reviewImage": {
                                "card": {
                                    "buttons": {
                                        "continue": {
                                            "text": "Continue"
                                        },
                                        "repeat": {
                                            "text": "Repeat"
                                        }
                                    }
                                }
                            },
                            "instructions": {
                                "card": {
                                    "buttons": {
                                        "previous": {
                                            "text": "Next"
                                        }
                                    }
                                }
                            },
                            "capture": {
                                "head": {
                                    "card": {
                                        "title": {
                                            "finish": "Great!"
                                        }
                                    }
                                }
                            }
                        }
                    }
                }

            }
        }
    },
    "setup": {
        "success": {
            "text": "Process completed successfully",
            "textColor": "#000D44",
            "iconColor": "#078B3C"
        },
        "errorModal": {
            "document": {
                "obverse": {
                    "message": "The front of the document is not valid"
                },
                "reverse": {
                    "message": "The back of the document is not valid"
                }
            }
        },
        "loading": {
            "progressIndicator": {
                "color": "#FF7777",
                "backgroundColor": "#FFFFFF"
            },
            "textColor": "#000D44",
            "backgroundColor": "#000D44"
        }
    }
}

Guide to migrate V1 to V2¶

Description¶

Content type¶

Iframe integration¶

Setup Configuration Components¶

Loading¶

QR¶

Document¶

Autoclassification selector¶

Document & country selector¶

Document Capture¶

Selfie Capture¶

Video Capture¶

Esign¶

Success¶

Error Modal¶

DEPRECATED¶

Example¶

XpressID v1¶

Document capture¶

Document Selector + document capture + selfie passive capture¶

Document capture + selfie active capture¶

XpressID v2¶

Document capture¶

Document selector + document capture + selfie passive capture¶

Document capture + selfie active capture¶