@bytexbyte/berifyme-react-sdk 1.0.16 → 1.0.19

package/dist/components/OnBoarding/incode/index.js

@@ -34,24 +34,22 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
         if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
     }
 };
-import React from "react";
-import { useEffect, useRef, useState } from "react";
-import Steps from "./Steps";
-import { UserConsent } from "./UserConsent";
-import { FrontId } from "./FrontId";
-import { BackId } from "./BackId";
-import { ProcessId } from "./ProcessId";
-import { Selfie } from "./Selfie";
-import { ProcessFace } from "./ProcessFace";
-import { FinishOnboarding } from "./FinishOnboarding";
-import SelectType from "./SelectType";
-import { Passport } from "./Passport";
 import { Box, CircularProgress } from "@mui/material";
-import TryAgain from "../../TryAgain";
+import React, { useEffect, useRef, useState } from "react";
 import berifymeApi, { ActionType } from "../../../api/api";
 import { createAuthenticationLog, updateAuthenticationLog } from "../../AuthenticationLogs";
 import { createDeveloperLog } from "../../createDeveloperLog";
+import { BackId } from "./BackId";
+import { FinishOnboarding } from "./FinishOnboarding";
+import { FrontId } from "./FrontId";
+import { Passport } from "./Passport";
+import { ProcessFace } from "./ProcessFace";
 import { ProcessGlobalWatchlist } from "./processGlobalWatchlist";
+import { ProcessId } from "./ProcessId";
+import SelectType from "./SelectType";
+import { Selfie } from "./Selfie";
+import Steps from "./Steps";
+import { UserConsent } from "./UserConsent";
 function startOnboardingSession(_a) {
     return __awaiter(this, arguments, void 0, function (_b) {
         var res;
@@ -67,20 +65,18 @@ function startOnboardingSession(_a) {
     });
 }
 var IncodeOnBoarding = function (_a) {
-    var user = _a.user, setUser = _a.setUser, goToAllSet = _a.goToAllSet, token = _a.token;
+    var user = _a.user, setUser = _a.setUser, goToAllSet = _a.goToAllSet, token = _a.token, setError = _a.setError, onGoBack = _a.onGoBack;
     var _b = useState(0), step = _b[0], setStep = _b[1]; // Store the current step
-    var _c = useState(""), error = _c[0], setError = _c[1];
-    var _d = useState(null), session = _d[0], setSession = _d[1]; // Stores the Session
+    var _c = useState(null), session = _c[0], setSession = _c[1]; // Stores the Session
     var isLoaded = useRef(false);
     function finishIncodeOnboarding(id, token, sessionToken) {
         return __awaiter(this, void 0, void 0, function () {
-            var incodeRes;
-            var _a;
-            return __generator(this, function (_b) {
-                switch (_b.label) {
+            var incodeRes, returnBoolean;
+            return __generator(this, function (_a) {
+                switch (_a.label) {
                     case 0: return [4 /*yield*/, berifymeApi.incode.getIncodeFinish({ token: token })];
                     case 1:
-                        _b.sent();
+                        _a.sent();
                         createDeveloperLog({
                             userId: user === null || user === void 0 ? void 0 : user.id,
                             userDataJson: user,
@@ -90,21 +86,24 @@ var IncodeOnBoarding = function (_a) {
                         });
                         return [4 /*yield*/, berifymeApi.incode.getIncodeApprove({ id: id, token: token, sessionToken: sessionToken })];
                     case 2:
-                        incodeRes = _b.sent();
+                        incodeRes = _a.sent();
                         if (incodeRes.error || !incodeRes.user) {
-                            setError((_a = incodeRes.error) !== null && _a !== void 0 ? _a : '');
-                            return [2 /*return*/, false];
+                            setError('');
+                            returnBoolean = false;
+                        }
+                        else {
+                            setUser(incodeRes.user);
+                            returnBoolean = true;
                         }
-                        setUser(incodeRes.user);
                         createDeveloperLog({
                             userId: user === null || user === void 0 ? void 0 : user.id,
                             userDataJson: user,
                             source: 'FRONTEND',
                             action: 'incode getIncodeApprove',
                             sessionToken: token,
-                            firstDetail: "incode user: ".concat(incodeRes.user, ", error: ").concat(incodeRes.error)
+                            firstDetail: "incode user: ".concat(incodeRes === null || incodeRes === void 0 ? void 0 : incodeRes.user, ", error: ").concat(incodeRes === null || incodeRes === void 0 ? void 0 : incodeRes.error)
                         });
-                        return [2 /*return*/, true];
+                        return [2 /*return*/, returnBoolean];
                 }
             });
         });
@@ -189,7 +188,7 @@ var IncodeOnBoarding = function (_a) {
                             });
                         }
                         else
-                            setError('Please try again.');
+                            setError('');
                         _a.label = 2;
                     case 2: return [2 /*return*/];
                 }
@@ -197,10 +196,16 @@ var IncodeOnBoarding = function (_a) {
         });
     }
     function handleError(e) {
-        setError(e.type);
+        createDeveloperLog({
+            userId: user === null || user === void 0 ? void 0 : user.id,
+            userDataJson: user,
+            source: 'FRONTEND',
+            action: 'incode handleError',
+            sessionToken: token,
+            firstDetail: "error: ".concat(e.type)
+        });
+        setError('');
     }
-    if (error)
-        return (React.createElement(TryAgain, { message: "Authentication Failed, Please Try Again." }));
     if (!session)
         return (React.createElement(Box, { sx: {
                 display: 'flex',
@@ -212,7 +217,7 @@ var IncodeOnBoarding = function (_a) {
             React.createElement(CircularProgress, null)));
     return (React.createElement(React.Fragment, null, user.id && React.createElement(Steps, { currentStep: step },
         React.createElement(UserConsent, { session: session, onSuccess: goNext }),
-        React.createElement(SelectType, { goToID: goNext, goToPassport: function () { goTo(4); } }),
+        React.createElement(SelectType, { goToID: goNext, goToPassport: function () { goTo(4); }, onCloseButtonClick: onGoBack }),
         React.createElement(FrontId, { session: session, onError: handleError, onSuccess: goNext }),
         React.createElement(BackId, { session: session, onError: handleError, onSuccess: function () { goTo(5); } }),
         React.createElement(Passport, { session: session, onError: handleError, onSuccess: goNext }),

package/dist/components/OnBoarding/vender/grid/authIdGrid.js

@@ -87,7 +87,7 @@ var AuthIdGrid = function (_a) {
                     });
                 }); } },
                 React.createElement(Stack, { width: 1, spacing: 1, px: 2, py: 2, bgcolor: theme.palette.grey[100], borderRadius: 6, alignItems: 'center' },
-                    React.createElement("img", { width: 36, height: 36, src: "https://staging.berify.me/berify-title.webp", alt: "berify-title.webp" }),
+                    React.createElement("img", { width: 36, height: 36, src: "https://idv.berify.me/berify-title.webp", alt: "berify-title.webp" }),
                     React.createElement(Typography, { variant: 'h5', fontWeight: 700, color: 'black' }, "Berify.me"),
                     React.createElement(Typography, { variant: 'body2', color: theme.palette.info.light, fontStyle: 'italic' }, "avg. 26s completion"))))));
 };

package/dist/components/OnBoarding/vender/grid/clearGrid.js

@@ -7,7 +7,7 @@ var ClearGrid = function (_a) {
         React.createElement(Grid, { item: true, xs: 6 },
             React.createElement(Button, { fullWidth: true, onClick: function () { setPageStatus(2.1); } },
                 React.createElement(Stack, { width: 1, spacing: 1, px: 2, py: 2, bgcolor: theme.palette.grey[100], borderRadius: 6, alignItems: 'center' },
-                    React.createElement("img", { width: 36, height: 36, src: "https://staging.berify.me/clearme.svg", alt: "clearme.svg" }),
+                    React.createElement("img", { width: 36, height: 36, src: "https://idv.berify.me/clearme.svg", alt: "clearme.svg" }),
                     React.createElement(Typography, { variant: 'h5', fontWeight: 700, color: 'black' }, "CLEAR"),
                     React.createElement(Typography, { variant: 'body2', color: theme.palette.info.light, fontStyle: 'italic' }, "avg. 60s completion"))))));
 };

package/dist/components/OnBoarding/vender/grid/incodeGrid.js

@@ -7,7 +7,7 @@ var IncodeGrid = function (_a) {
         React.createElement(Grid, { item: true, xs: 6 },
             React.createElement(Button, { fullWidth: true, onClick: function () { setPageStatus(2.2); } },
                 React.createElement(Stack, { width: 1, spacing: 1, px: 2, py: 2, bgcolor: theme.palette.grey[100], borderRadius: 6, alignItems: 'center' },
-                    React.createElement("img", { width: 36, height: 36, src: "https://staging.berify.me/incode.svg", alt: "incode.svg" }),
+                    React.createElement("img", { width: 36, height: 36, src: "https://idv.berify.me/incode.svg", alt: "incode.svg" }),
                     React.createElement(Typography, { variant: 'h5', fontWeight: 700, color: 'black' }, "Incode"),
                     React.createElement(Typography, { variant: 'body2', color: theme.palette.info.light, fontStyle: 'italic' }, "avg. 30s completion"))))));
 };

package/dist/components/OnBoarding/vender/grid/sumsubGrid.js

@@ -7,7 +7,7 @@ var SumsubGrid = function (_a) {
         React.createElement(Grid, { item: true, xs: 6 },
             React.createElement(Button, { fullWidth: true, onClick: function () { setPageStatus(2.3); } },
                 React.createElement(Stack, { width: 1, spacing: 1, px: 2, py: 2, bgcolor: theme.palette.grey[100], borderRadius: 6, alignItems: 'center' },
-                    React.createElement("img", { width: 28, height: 28, src: "/sumsub.svg", alt: "scan" }),
+                    React.createElement("img", { width: 28, height: 28, src: "https://idv.berify.me/sumsub.svg", alt: "scan" }),
                     React.createElement(Typography, { variant: 'h5', fontWeight: 700, color: 'black' }, "Sumsub"),
                     React.createElement(Typography, { variant: 'body2', color: theme.palette.info.light, fontStyle: 'italic' }, "avg. 30s completion"))))));
 };

package/dist/components/OnBoarding/vender/grid/veriffGrid.js

@@ -7,7 +7,7 @@ var VeriffGrid = function (_a) {
         React.createElement(Grid, { item: true, xs: 6 },
             React.createElement(Button, { fullWidth: true, onClick: function () { setPageStatus(2.4); } },
                 React.createElement(Stack, { width: 1, spacing: 1, px: 2, py: 2, bgcolor: theme.palette.grey[100], borderRadius: 6, alignItems: 'center' },
-                    React.createElement("img", { width: 28, height: 28, src: "/veriff.svg", alt: "scan" }),
+                    React.createElement("img", { width: 28, height: 28, src: "https://idv.berify.me/veriff.svg", alt: "scan" }),
                     React.createElement(Typography, { variant: 'h5', fontWeight: 700, color: 'black' }, "Veriff"),
                     React.createElement(Typography, { variant: 'body2', color: theme.palette.info.light, fontStyle: 'italic' }, "avg. 30s completion"))))));
 };

package/dist/components/OnBoarding/vender/grid/yotiGrid.js

@@ -7,7 +7,7 @@ var YotiGrid = function (_a) {
         React.createElement(Grid, { item: true, xs: 6 },
             React.createElement(Button, { fullWidth: true, onClick: function () { setPageStatus(2.5); } },
                 React.createElement(Stack, { width: 1, spacing: 1, px: 2, py: 2, bgcolor: theme.palette.grey[100], borderRadius: 6, alignItems: 'center' },
-                    React.createElement("img", { width: 28, height: 28, src: "/yoti.svg", alt: "scan" }),
+                    React.createElement("img", { width: 28, height: 28, src: "https://idv.berify.me/yoti.svg", alt: "scan" }),
                     React.createElement(Typography, { variant: 'h5', fontWeight: 700, color: 'black' }, "Yoti"),
                     React.createElement(Typography, { variant: 'body2', color: theme.palette.info.light, fontStyle: 'italic' }, "avg. 30s completion"))))));
 };

package/dist/components/QrcodeExpired.js

@@ -6,7 +6,7 @@ var QrcodeExpired = function () {
     return (React.createElement(React.Fragment, null,
         React.createElement(Stack, { height: 1, spacing: 4, justifyContent: 'space-between', py: 4, overflow: 'auto' },
             React.createElement(Stack, { spacing: 2, textAlign: 'center', alignItems: 'center' },
-                React.createElement("img", { width: 60, height: 60, src: "https://staging.berify.me/errorIcon.png", alt: "berify" }),
+                React.createElement("img", { width: 60, height: 60, src: "https://idv.berify.me/errorIcon.png", alt: "berify" }),
                 React.createElement(Typography, { variant: "h2", fontWeight: 700 }, "QR Code Expired"),
                 React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "The QR code is only active for 5 minutes."),
                 React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "Return to the original sign up window to request for a new QR code.")),

package/dist/components/SendSns/index.js

@@ -42,6 +42,7 @@ import { useState } from 'react';
 import PhoneInput from 'react-phone-input-2';
 import './style.css';
 import berifymeApi, { ActionType } from '../../api/api';
+import { PageStatus } from '../../enum';
 import theme from "../theme";
 import { createAuthenticationLog } from '../AuthenticationLogs';
 import { createDeveloperLog } from '../createDeveloperLog';
@@ -93,7 +94,7 @@ var SendSns = function (_a) {
                 case 1:
                     getVender = _f.sent();
                     if (getVender.error) {
-                        setError((_a = getVender.error) !== null && _a !== void 0 ? _a : 'Oops! Something went wrong...');
+                        setError((_a = getVender.error) !== null && _a !== void 0 ? _a : 'Something went wrong, but we’re working on it. Please try again later or contact support for assistance.');
                         setIsLoading(false);
                         createDeveloperLog({
                             source: 'FRONTEND',
@@ -129,7 +130,7 @@ var SendSns = function (_a) {
                         })];
                 case 2:
                     webauthnLogin = _f.sent();
-                    if (!webauthnLogin.success) return [3 /*break*/, 5];
+                    if (!webauthnLogin.success) return [3 /*break*/, 6];
                     createDeveloperLog({
                         userId: (_d = webauthnLogin.user.id) !== null && _d !== void 0 ? _d : '',
                         source: 'FRONTEND',
@@ -138,10 +139,13 @@ var SendSns = function (_a) {
                         userDataJson: webauthnLogin.user,
                     });
                     setUser(webauthnLogin.user);
+                    return [4 /*yield*/, berifymeApi.wallet.getWallet({ phoneNumber: processedInputValue })];
+                case 3:
+                    _f.sent();
                     deviceId = localStorage.getItem('deviceId');
-                    if (!(deviceId && token)) return [3 /*break*/, 4];
+                    if (!(deviceId && token)) return [3 /*break*/, 5];
                     return [4 /*yield*/, berifymeApi.user.checkDeviceId({ phoneNumber: processedInputValue, deviceId: deviceId, token: token })];
-                case 3:
+                case 4:
                     deviceUser = _f.sent();
                     if (deviceUser.user) {
                         createDeveloperLog({
@@ -161,7 +165,7 @@ var SendSns = function (_a) {
                         });
                         setUser(deviceUser.user);
                         setModalHeight('60vh');
-                        setPageStatus(10);
+                        setPageStatus(PageStatus.AllSet);
                         setIsLoading(false);
                         createDeveloperLog({
                             userId: webauthnLogin.user.id,
@@ -181,8 +185,8 @@ var SendSns = function (_a) {
                         firstDetail: deviceUser.error,
                         secondDetail: "deviceId: ".concat(deviceId),
                     });
-                    _f.label = 4;
-                case 4:
+                    _f.label = 5;
+                case 5:
                     // const blockchainToken = await berifymeApi.blockchain.getNFTToken({ phoneNumber: processedInputValue });
                     // if (blockchainToken && blockchainToken.nfts.length > 0 && token) {
                     //   const blockchainTokenId = blockchainToken.nfts[0].tokenId;
@@ -202,30 +206,33 @@ var SendSns = function (_a) {
                     //   }
                     // }
                     if (getVender.vender === 'authid') {
-                        setLogin(3);
+                        setLogin(PageStatus.AuthidLogin);
                         setModalHeight('50vh');
                         setFullName(getVender.fullName);
                     }
                     else if (getVender.vender === 'clear') {
-                        setLogin(4);
+                        setLogin(PageStatus.ClearLogin);
                         setModalHeight('50vh');
                         setFullName(getVender.fullName);
                     }
                     else if (getVender.vender === 'incode') {
-                        setLogin(5);
-                        setModalHeight('50vh');
-                        setFullName(getVender.fullName);
-                    }
-                    else if (getVender.vender === 'sumsub') {
-                        setLogin(8);
-                        setModalHeight('50vh');
-                        setFullName(getVender.fullName);
-                    }
-                    else if (getVender.vender === 'veriff') {
-                        setLogin(9);
+                        setLogin(PageStatus.IncodeLogin);
                         setModalHeight('50vh');
                         setFullName(getVender.fullName);
                     }
+                    // else if (getVender.vender === 'sumsub') {
+                    //   setLogin(PageStatus.SumsubLogin);
+                    //   setModalHeight('50vh');
+                    //   setFullName(getVender.fullName);
+                    // } else if (getVender.vender === 'veriff') {
+                    //   setLogin(PageStatus.VeriffLogin);
+                    //   setModalHeight('50vh');
+                    //   setFullName(getVender.fullName);
+                    // } else if (getVender.vender === 'yoti') {
+                    //   setLogin(PageStatus.YotiLogin);
+                    //   setModalHeight('50vh');
+                    //   setFullName(getVender.fullName);
+                    // }
                     else {
                         setPageStatus(1.1);
                         // const res = await berifymeApi.auth.sendPhoneNumberCode({phoneNumber: processedInputValue, token});
@@ -242,17 +249,17 @@ var SendSns = function (_a) {
                         secondDetail: 'webauthn success'
                     });
                     return [2 /*return*/];
-                case 5:
+                case 6:
                     createDeveloperLog({
                         source: 'FRONTEND',
                         action: 'webauthnLogin failed',
                         sessionToken: token,
                     });
-                    _f.label = 6;
-                case 6:
-                    if (!(getVender.vender === null)) return [3 /*break*/, 8];
-                    return [4 /*yield*/, berifymeApi.auth.sendPhoneNumberCode({ phoneNumber: processedInputValue, token: token })];
+                    _f.label = 7;
                 case 7:
+                    if (!(getVender.vender === null)) return [3 /*break*/, 9];
+                    return [4 /*yield*/, berifymeApi.auth.sendPhoneNumberCode({ phoneNumber: processedInputValue, token: token })];
+                case 8:
                     res = _f.sent();
                     if (res.success) {
                         setPageStatus(1);
@@ -271,9 +278,9 @@ var SendSns = function (_a) {
                             firstDetail: res.error,
                         });
                     }
-                    return [3 /*break*/, 10];
-                case 8: return [4 /*yield*/, berifymeApi.auth.sendPhoneNumberCode({ phoneNumber: processedInputValue, token: token })];
-                case 9:
+                    return [3 /*break*/, 11];
+                case 9: return [4 /*yield*/, berifymeApi.auth.sendPhoneNumberCode({ phoneNumber: processedInputValue, token: token })];
+                case 10:
                     res = _f.sent();
                     if (res.success) {
                         setModalHeight('50vh');
@@ -293,8 +300,8 @@ var SendSns = function (_a) {
                             firstDetail: res.error,
                         });
                     }
-                    _f.label = 10;
-                case 10:
+                    _f.label = 11;
+                case 11:
                     setIsLoading(false);
                     createDeveloperLog({
                         source: 'FRONTEND',
@@ -312,10 +319,9 @@ var SendSns = function (_a) {
             React.createElement(Stack, { height: 1, spacing: 4, justifyContent: 'space-between', py: 8 },
                 React.createElement(Stack, { spacing: 2, textAlign: 'center', alignItems: 'center' },
                     React.createElement(Typography, { variant: "h1" }, "\uD83D\uDC4B"),
-                    React.createElement(Typography, { variant: "h2", fontWeight: 700 },
-                        "Welcome back,",
-                        React.createElement("br", null)),
-                    React.createElement(Typography, { variant: "h2", fontWeight: 700 }, fullName),
+                    React.createElement(Stack, null,
+                        React.createElement(Typography, { variant: "h2", fontWeight: 700 }, "Welcome back,"),
+                        React.createElement(Typography, { variant: "h2", fontWeight: 700 }, fullName)),
                     React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "Take a selfie to verify your identity.")),
                 React.createElement(Stack, { alignItems: 'center' },
                     React.createElement(Button, { variant: "contained", onClick: function () { setPageStatus(login); }, sx: { minWidth: 160 } }, "Take my selfie")),

package/dist/components/SessionInterrupted.js

@@ -6,7 +6,7 @@ var SessionInterrupted = function () {
     return (React.createElement(React.Fragment, null,
         React.createElement(Stack, { height: 1, spacing: 4, justifyContent: 'space-between', py: 4, overflow: 'auto' },
             React.createElement(Stack, { spacing: 2, textAlign: 'center', alignItems: 'center' },
-                React.createElement("img", { width: 60, height: 60, src: "https://staging.berify.me/warningIcon.png", alt: "berify" }),
+                React.createElement("img", { width: 60, height: 60, src: "https://idv.berify.me/warningIcon.png", alt: "berify" }),
                 React.createElement(Typography, { variant: "h2", fontWeight: 700 }, "Session Interrupted"),
                 React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "The sign-up window on your desktop browser was closed."),
                 React.createElement(Typography, { variant: "body1", color: theme.palette.text.secondary }, "Please restart the process on your desktop browser to try again.")),

package/dist/components/SnapMatch/ExceptionView.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { Button, Container, Stack, Typography } from "@mui/material";
+import WarningAmberRoundedIcon from "@mui/icons-material/WarningAmberRounded";
+import { getSnapMatchResultTranslations } from "./translations";
+var ExceptionView = function (_a) {
+    var lang = _a.lang, message = _a.message, onBack = _a.onBack, _b = _a.returnLoading, returnLoading = _b === void 0 ? false : _b, _c = _a.autoRedirectSeconds, autoRedirectSeconds = _c === void 0 ? 0 : _c, _d = _a.countdown, countdown = _d === void 0 ? 0 : _d;
+    var t = getSnapMatchResultTranslations(lang);
+    var handleBack = function () {
+        if (onBack)
+            onBack();
+        else
+            window.location.reload();
+    };
+    return (React.createElement(Container, { maxWidth: "sm", sx: { px: 3 } },
+        React.createElement(Stack, { height: "100vh", width: 1, maxHeight: 900, justifyContent: "center", alignItems: "center", spacing: 4 },
+            React.createElement(WarningAmberRoundedIcon, { sx: { fontSize: 64, color: "warning.main" }, "aria-hidden": true }),
+            React.createElement(Typography, { variant: "h3", fontWeight: 700, textAlign: "center", sx: { whiteSpace: "pre-line" } }, t.exceptionTitle),
+            React.createElement(Typography, { variant: "body1", color: "text.secondary", textAlign: "center", sx: { whiteSpace: "pre-line" } }, message !== null && message !== void 0 ? message : t.exceptionDescription),
+            autoRedirectSeconds > 0 && (React.createElement(Typography, { variant: "body2", color: "text.secondary", sx: { whiteSpace: "pre-line" } }, countdown > 0 ? t.countdownReturn(countdown) : t.redirecting)),
+            React.createElement(Button, { variant: "contained", color: "warning", onClick: handleBack, disabled: returnLoading, fullWidth: true, sx: { whiteSpace: "pre-line" } }, returnLoading ? t.redirecting : t.backToVerification))));
+};
+export default ExceptionView;

package/dist/components/SnapMatch/LangSelector.js

@@ -0,0 +1,26 @@
+import React from "react";
+import { Box, Button, Typography } from "@mui/material";
+import TranslateIcon from "@mui/icons-material/Translate";
+export var LANG_OPTIONS = [
+    { value: "en", label: "English" },
+    { value: "zh-TW", label: "繁體中文" },
+];
+function LangSelector(_a) {
+    var _b, _c;
+    var lang = _a.lang, onLangChange = _a.onLangChange;
+    var nextLang = lang === "en" ? "zh-TW" : "en";
+    var currentLabel = (_c = (_b = LANG_OPTIONS.find(function (o) { return o.value === lang; })) === null || _b === void 0 ? void 0 : _b.label) !== null && _c !== void 0 ? _c : lang;
+    return (React.createElement(Box, { sx: {
+            position: "fixed",
+            top: 16,
+            right: 16,
+            zIndex: 2147483647,
+            pointerEvents: "auto",
+        } },
+        React.createElement(Button, { variant: "outlined", size: "small", onClick: function () { return onLangChange(nextLang); }, startIcon: React.createElement(TranslateIcon, null), sx: {
+                bgcolor: "background.paper",
+                "&:hover": { bgcolor: "action.hover" },
+            } },
+            React.createElement(Typography, { variant: "body2" }, currentLabel))));
+}
+export default LangSelector;

package/dist/components/SnapMatch/SnapMatchStep.js

@@ -0,0 +1,122 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __generator = (this && this.__generator) || function (thisArg, body) {
+    var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
+    return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
+    function verb(n) { return function (v) { return step([n, v]); }; }
+    function step(op) {
+        if (f) throw new TypeError("Generator is already executing.");
+        while (g && (g = 0, op[0] && (_ = 0)), _) try {
+            if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
+            if (y = 0, t) op = [op[0] & 2, t.value];
+            switch (op[0]) {
+                case 0: case 1: t = op; break;
+                case 4: _.label++; return { value: op[1], done: false };
+                case 5: _.label++; y = op[1]; op = [0]; continue;
+                case 7: op = _.ops.pop(); _.trys.pop(); continue;
+                default:
+                    if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
+                    if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
+                    if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
+                    if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
+                    if (t[2]) _.ops.pop();
+                    _.trys.pop(); continue;
+            }
+            op = body.call(thisArg, _);
+        } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
+        if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
+    }
+};
+import React, { useEffect, useRef } from "react";
+import { Box, CircularProgress } from "@mui/material";
+import { createIncodeLogin } from "../../vender/incode/incode";
+/** 清空容器前先停止所有 video 的 MediaStream，正確釋放相機，避免 reload 後新頁面無法取得相機或卡在權限 */
+function stopAllMediaStreamsInContainer(container) {
+    try {
+        container.querySelectorAll("video").forEach(function (el) {
+            var src = el.srcObject;
+            if (src && typeof src.getTracks === "function") {
+                src.getTracks().forEach(function (track) { return track.stop(); });
+            }
+        });
+    }
+    catch (_a) {
+        // ignore
+    }
+}
+/**
+ * 直接開啟 Incode SnapMatch（1:N）驗證步驟。
+ * 與 Frontend SnapMatchStep 對齊：僅依 lang 建立實例並轉發結果，父層負責 getUserByIncodeId 與 step。
+ * 以 key={`${lang}-${loginKey}`} 渲染可強制語系切換/返回時完整重掛載，避免 Incode 翻譯 cache。
+ */
+var SnapMatchStep = function (_a) {
+    var lang = _a.lang, loginKey = _a.loginKey, onSuccess = _a.onSuccess, onError = _a.onError;
+    var containerRef = useRef(null);
+    var loginKeyRef = useRef(loginKey);
+    loginKeyRef.current = loginKey;
+    useEffect(function () {
+        var container = containerRef.current;
+        if (!container)
+            return;
+        var cancelled = false;
+        var currentKey = loginKeyRef.current;
+        // 延遲再掛載，讓上一輪 cleanup（清空容器、釋放相機）完成，避免 Incode 全域 i18n/狀態殘留導致翻譯錯亂
+        var delayMs = 120;
+        var t = setTimeout(function () {
+            if (cancelled)
+                return;
+            void createIncodeLogin(lang).then(function (instance) {
+                var _a;
+                if (cancelled || !containerRef.current)
+                    return;
+                instance.renderLogin(container, {
+                    onSuccess: function (response) { return __awaiter(void 0, void 0, void 0, function () {
+                        return __generator(this, function (_a) {
+                            if (cancelled)
+                                return [2 /*return*/];
+                            onSuccess({
+                                customerId: response.customerId,
+                                interviewId: response.interviewId,
+                                token: response.token,
+                                transactionId: response.transactionId,
+                            }, { loginKey: currentKey });
+                            return [2 /*return*/];
+                        });
+                    }); },
+                    onError: function () {
+                        if (cancelled)
+                            return;
+                        onError();
+                    },
+                    stopAtError: true,
+                    timeout: 1000 * 60 * 60 * 24,
+                });
+                if ((_a = instance.i18n) === null || _a === void 0 ? void 0 : _a.changeLanguage) {
+                    setTimeout(function () {
+                        var _a, _b;
+                        if (cancelled)
+                            return;
+                        void ((_b = (_a = instance.i18n) === null || _a === void 0 ? void 0 : _a.changeLanguage) === null || _b === void 0 ? void 0 : _b.call(_a, "en"));
+                    }, 200);
+                }
+            });
+        }, delayMs);
+        return function () {
+            cancelled = true;
+            clearTimeout(t);
+            stopAllMediaStreamsInContainer(container);
+            container.innerHTML = "";
+        };
+    }, [lang, loginKey, onSuccess, onError]);
+    return (React.createElement("div", { ref: containerRef, style: { width: "100%", height: "100%", minHeight: "100vh" } },
+        React.createElement(Box, { sx: { display: "flex", justifyContent: "center", alignItems: "center", height: "100vh", background: "#FFFFFF" } },
+            React.createElement(CircularProgress, null))));
+};
+export default SnapMatchStep;

package/dist/components/SnapMatch/SuccessView.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { Button, Stack, Typography } from "@mui/material";
+import VerifiedRoundedIcon from "@mui/icons-material/VerifiedRounded";
+import Layout from "../Layout";
+import { getSnapMatchResultTranslations } from "./translations";
+import theme from "../theme";
+var SuccessView = function (_a) {
+    var lang = _a.lang, fullName = _a.fullName, onContinue = _a.onContinue, _b = _a.returnLoading, returnLoading = _b === void 0 ? false : _b, _c = _a.autoRedirectSeconds, autoRedirectSeconds = _c === void 0 ? 3 : _c, _d = _a.countdown, countdown = _d === void 0 ? 0 : _d;
+    var t = getSnapMatchResultTranslations(lang);
+    return (React.createElement(Layout, null,
+        React.createElement(Stack, { height: 1, width: 1, maxHeight: 900, justifyContent: "center", alignItems: "center", spacing: 4, py: 4 },
+            React.createElement(VerifiedRoundedIcon, { color: "success", sx: { fontSize: 64 } }),
+            React.createElement(Typography, { variant: "h1", textAlign: "center", sx: { whiteSpace: "pre-line" } },
+                fullName ? "\uD83C\uDF89 ".concat(fullName) : "🎉",
+                React.createElement("br", null),
+                React.createElement("br", null),
+                t.successTitle),
+            React.createElement(Typography, { variant: "body1", color: theme.palette.info.light, textAlign: "center", sx: { whiteSpace: "pre-line" } }, t.successDescription),
+            autoRedirectSeconds > 0 && (React.createElement(Typography, { variant: "body2", color: theme.palette.info.light, sx: { whiteSpace: "pre-line" } }, countdown > 0 ? t.countdownReturn(countdown) : t.redirecting)),
+            React.createElement(Button, { variant: "contained", color: "primary", onClick: function () { return (onContinue ? onContinue() : window.close()); }, disabled: returnLoading, fullWidth: true, sx: { whiteSpace: "pre-line" } }, returnLoading ? t.redirecting : t.nextPerson))));
+};
+export default SuccessView;

package/dist/components/SnapMatch/TryAgainView.js

@@ -0,0 +1,19 @@
+import React from "react";
+import { Button, Container, Stack, Typography } from "@mui/material";
+import { getSnapMatchResultTranslations } from "./translations";
+var TryAgainView = function (_a) {
+    var lang = _a.lang, message = _a.message, onRetry = _a.onRetry, _b = _a.retryLoading, retryLoading = _b === void 0 ? false : _b, _c = _a.autoRedirectSeconds, autoRedirectSeconds = _c === void 0 ? 0 : _c, _d = _a.countdown, countdown = _d === void 0 ? 0 : _d;
+    var t = getSnapMatchResultTranslations(lang);
+    var handleContinue = function () {
+        if (onRetry)
+            onRetry();
+        else
+            window.location.reload();
+    };
+    return (React.createElement(Container, { maxWidth: "sm", sx: { px: 3 } },
+        React.createElement(Stack, { height: "100vh", width: 1, maxHeight: 900, justifyContent: "center", alignItems: "center", spacing: 4 },
+            React.createElement(Typography, { variant: "h3", fontWeight: 700, textAlign: "center", sx: { whiteSpace: "pre-line" } }, message !== null && message !== void 0 ? message : t.failureDefault),
+            autoRedirectSeconds > 0 && (React.createElement(Typography, { variant: "body2", color: "text.secondary", sx: { whiteSpace: "pre-line" } }, countdown > 0 ? t.countdownReturn(countdown) : t.redirecting)),
+            React.createElement(Button, { variant: "contained", color: "primary", onClick: handleContinue, disabled: retryLoading, sx: { whiteSpace: "pre-line" } }, retryLoading ? t.redirecting : t.retry))));
+};
+export default TryAgainView;