idmission-web-sdk 1.0.59 → 1.0.61

package/dist/components/submission/Errors.d.ts

@@ -5,3 +5,8 @@ export declare class SubmissionError extends Error {
 }
 export declare class NetworkError extends Error {
 }
+export declare class TokenPublicKeyError extends Error {
+    err: Error;
+    host: string;
+    constructor(err: Error, host: string);
+}

package/dist/components/submission/SubmissionProvider.d.ts

@@ -1,5 +1,6 @@
 import { ReactElement } from 'react';
 import { CardData, LivenessCheckRequest, PersonalData, SubmissionAction, SubmissionEnvironment, SubmissionRequest, SubmissionResponse } from '../../contexts/SubmissionContext';
+export type TokenState = 'NOT_PARSED' | 'PARSING' | 'GOOD' | 'EXPIRED' | 'INVALID_FORMAT' | 'INVALID_SIGNATURE' | 'MISSING' | 'PUBLIC_KEY_LOAD_FAILED';
 export type SubmissionProviderProps = {
     action: SubmissionAction;
     children: ReactElement;

package/dist/components/submission/TokenExpiredErrorOverlay.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TokenExpiredErrorOverlay: () => React.JSX.Element;

package/dist/components/submission/TokenInvalidFormatErrorOverlay.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TokenInvalidFormatErrorOverlay: () => React.JSX.Element;

package/dist/components/submission/TokenInvalidSignatureErrorOverlay.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TokenInvalidSignatureErrorOverlay: () => React.JSX.Element;

package/dist/components/submission/TokenMissingErrorOverlay.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const TokenMissingErrorOverlay: () => React.JSX.Element;

package/dist/components/submission/TokenPublicKeyErrorOverlay.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { TokenPublicKeyError } from './Errors';
+export declare const TokenPublicKeyErrorOverlay: ({ error, }: {
+    error: TokenPublicKeyError | null;
+}) => React.JSX.Element;

package/dist/contexts/SubmissionContext.d.ts

@@ -181,6 +181,7 @@ export type SubmissionState = {
     retryLocationAccess: () => void;
 };
 export declare const SubmissionContext: import("react").Context<SubmissionState>;
+export declare function parseJwt(token: string): Record<string, unknown>;
 export declare function determineSubmissionHost(environment: SubmissionEnvironment, token?: string): string;
 export declare function determineSubmissionEndpoint(action: SubmissionAction, hasId: boolean, hasSelfie: boolean, hasToken: boolean): string;
 export declare function liveCheckEndpoint(hasToken: boolean): string;

package/dist/sdk2.cjs.development.js

@@ -7,6 +7,7 @@ var React = require('react');
 var ReactDOM = require('react-dom/client');
 var styled = require('styled-components');
 var reactI18next = require('react-i18next');
+var jsrsasign = require('jsrsasign');
 var tf = require('@tensorflow/tfjs');
 var useResizeObserver = require('use-resize-observer');
 var LanguageDetector = require('i18next-browser-languagedetector');
@@ -46,7 +47,7 @@ var LanguageDetector__default = /*#__PURE__*/_interopDefaultLegacy(LanguageDetec
 var i18n__default = /*#__PURE__*/_interopDefaultLegacy(i18n);
 var SignatureCanvas__default = /*#__PURE__*/_interopDefaultLegacy(SignatureCanvas);
 
-var webSdkVersion = '1.0.59';
+var webSdkVersion = '1.0.61';
 
 function getPlatform() {
   // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -418,6 +419,16 @@ var NetworkError = /** @class */function (_super) {
   }
   return NetworkError;
 }(Error);
+var TokenPublicKeyError = /** @class */function (_super) {
+  tslib.__extends(TokenPublicKeyError, _super);
+  function TokenPublicKeyError(err, host) {
+    var _this = _super.call(this, err.message) || this;
+    _this.err = err;
+    _this.host = host;
+    return _this;
+  }
+  return TokenPublicKeyError;
+}(Error);
 
 var SubmissionErrorOverlay = function SubmissionErrorOverlay(_a) {
   var error = _a.error,
@@ -482,6 +493,161 @@ var NetworkErrorContent = function NetworkErrorContent(_a) {
   }, retryText))));
 };
 
+var TokenMissingErrorOverlay = function TokenMissingErrorOverlay() {
+  return /*#__PURE__*/React__default['default'].createElement(OverlayContainer, null, /*#__PURE__*/React__default['default'].createElement(OverlayInner, {
+    style: {
+      justifyContent: 'center'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("h3", {
+    style: {
+      marginBottom: 8
+    }
+  }, "IDmission WebSDK failed to load"), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0
+    }
+  }, "Required property ", /*#__PURE__*/React__default['default'].createElement("code", null, "submissionToken"), " is missing."), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      lineHeight: '1.5rem'
+    }
+  }, "Please refer to the", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "https://www.npmjs.com/package/idmission-web-sdk#getting-started",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "Getting Started"), ' ', "section of the documentation for information on how to use your credentials to generate a valid", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "https://jwt.io",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "JSON Web Token"), ' ', "for your IDmission account. Every usage of the IDmission WebSDK must be authorized with a valid JWT from IDmission's servers.")));
+};
+
+var TokenInvalidFormatErrorOverlay = function TokenInvalidFormatErrorOverlay() {
+  return /*#__PURE__*/React__default['default'].createElement(OverlayContainer, null, /*#__PURE__*/React__default['default'].createElement(OverlayInner, {
+    style: {
+      justifyContent: 'center'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("h3", {
+    style: {
+      marginBottom: 8
+    }
+  }, "IDmission WebSDK failed to load"), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0
+    }
+  }, "Required property ", /*#__PURE__*/React__default['default'].createElement("code", null, "submissionToken"), " is invalid."), /*#__PURE__*/React__default['default'].createElement("p", null, "JSON Web Tokens consist of three parts separated by dots (", /*#__PURE__*/React__default['default'].createElement("code", null, "."), "), which are:"), /*#__PURE__*/React__default['default'].createElement("div", {
+    style: {
+      display: 'flex'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("ul", {
+    style: {
+      display: 'inline',
+      margin: '0 auto'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("li", null, "Header"), /*#__PURE__*/React__default['default'].createElement("li", null, "Payload"), /*#__PURE__*/React__default['default'].createElement("li", null, "Signature"))), /*#__PURE__*/React__default['default'].createElement("p", null, "Therefore, a JWT typically looks like the following:", ' ', /*#__PURE__*/React__default['default'].createElement("code", null, "xxxxx.yyyyy.zzzzz")), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      lineHeight: '1.5rem'
+    }
+  }, "Please refer to the", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "https://www.npmjs.com/package/idmission-web-sdk#getting-started",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "Getting Started"), ' ', "section of the documentation for information on how to use your credentials to generate a valid", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "https://jwt.io",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "JSON Web Token"), ' ', "for your IDmission account. Every usage of the IDmission WebSDK must be authorized with a valid JWT from IDmission's servers.")));
+};
+
+var TokenInvalidSignatureErrorOverlay = function TokenInvalidSignatureErrorOverlay() {
+  return /*#__PURE__*/React__default['default'].createElement(OverlayContainer, null, /*#__PURE__*/React__default['default'].createElement(OverlayInner, {
+    style: {
+      justifyContent: 'center'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("h3", {
+    style: {
+      marginBottom: 8
+    }
+  }, "IDmission WebSDK failed to load"), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0
+    }
+  }, "Required property ", /*#__PURE__*/React__default['default'].createElement("code", null, "submissionToken"), " could not be validated."), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0,
+      lineHeight: '1.5rem'
+    }
+  }, "The signature of your token could not be validated. Check your token generation routine, it's possible that some malicious behavior is at play. This can also happen if you attempt to manually modify your token before passing it to the IDmission WebSDK."), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0,
+      lineHeight: '1.5rem'
+    }
+  }, "If you believe you have reached this page in error, please contact us at ", /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "mailto:support@idmission.com"
+  }, "support@idmission.com"), ".")));
+};
+
+var TokenExpiredErrorOverlay = function TokenExpiredErrorOverlay() {
+  return /*#__PURE__*/React__default['default'].createElement(OverlayContainer, null, /*#__PURE__*/React__default['default'].createElement(OverlayInner, {
+    style: {
+      justifyContent: 'center'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("h3", {
+    style: {
+      marginBottom: 8
+    }
+  }, "IDmission WebSDK failed to load"), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0
+    }
+  }, "Required property ", /*#__PURE__*/React__default['default'].createElement("code", null, "submissionToken"), " is expired."), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0,
+      lineHeight: '1.5rem'
+    }
+  }, "Ensure you are generating a fresh token for each request to the IDmission WebSDK."), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      lineHeight: '1.5rem'
+    }
+  }, "Please refer to the", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "https://www.npmjs.com/package/idmission-web-sdk#getting-started",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "Getting Started"), ' ', "section of the documentation for information on how to use your credentials to generate a valid", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "https://jwt.io",
+    target: "_blank",
+    rel: "noreferrer"
+  }, "JSON Web Token"), ' ', "for your IDmission account. Every usage of the IDmission WebSDK must be authorized with a valid JWT from IDmission's servers.")));
+};
+
+var TokenPublicKeyErrorOverlay = function TokenPublicKeyErrorOverlay(_a) {
+  var error = _a.error;
+  return /*#__PURE__*/React__default['default'].createElement(OverlayContainer, null, /*#__PURE__*/React__default['default'].createElement(OverlayInner, {
+    style: {
+      justifyContent: 'center'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("h3", {
+    style: {
+      marginBottom: 8
+    }
+  }, "IDmission WebSDK failed to load"), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0
+    }
+  }, (error === null || error === void 0 ? void 0 : error.host) ? ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, "Failed to reach ", /*#__PURE__*/React__default['default'].createElement("code", null, error.host), ".")) : ( /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, "Failed to obtain public key for ", /*#__PURE__*/React__default['default'].createElement("code", null, "submissionToken"), "."))), (error === null || error === void 0 ? void 0 : error.message) && ( /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0,
+      lineHeight: '1.5rem'
+    }
+  }, /*#__PURE__*/React__default['default'].createElement("code", null, error.message))), /*#__PURE__*/React__default['default'].createElement("p", {
+    style: {
+      marginBottom: 0,
+      lineHeight: '1.5rem'
+    }
+  }, "Please ensure that IDmission's servers can be reached. If you believe you have reached this page in error, please contact us at", ' ', /*#__PURE__*/React__default['default'].createElement("a", {
+    href: "mailto:support@idmission.com"
+  }, "support@idmission.com"), ".")));
+};
+
 var SubmissionProvider = function SubmissionProvider(_a) {
   var action = _a.action,
     children = _a.children,
@@ -933,6 +1099,64 @@ var SubmissionProvider = function SubmissionProvider(_a) {
     setSubmissionStatus(SubmissionStatus.READY);
     retrySubmission();
   }, [retrySubmission]);
+  var _13 = React.useState('NOT_PARSED'),
+    tokenState = _13[0],
+    setTokenState = _13[1];
+  var _14 = React.useState(null),
+    tokenError = _14[0],
+    setTokenError = _14[1];
+  React.useEffect(function () {
+    (function () {
+      return tslib.__awaiter(void 0, void 0, void 0, function () {
+        var parsed, iss, publicKey, resp, e_3, valid, exp;
+        return tslib.__generator(this, function (_a) {
+          switch (_a.label) {
+            case 0:
+              setTokenState('PARSING');
+              if (!token) return [2 /*return*/, setTokenState('MISSING')];
+              try {
+                parsed = parseJwt(token);
+              } catch (e) {
+                console.error('error parsing token', e);
+                return [2 /*return*/, setTokenState('INVALID_FORMAT')];
+              }
+              iss = parsed.iss;
+              _a.label = 1;
+            case 1:
+              _a.trys.push([1, 3,, 4]);
+              return [4 /*yield*/, fetch(iss).then(function (r) {
+                return r.json();
+              })];
+            case 2:
+              resp = _a.sent();
+              publicKey = jsrsasign.KEYUTIL.getKey("-----BEGIN PUBLIC KEY-----\n".concat(resp.public_key, "\n-----END PUBLIC KEY-----"));
+              return [3 /*break*/, 4];
+            case 3:
+              e_3 = _a.sent();
+              console.error('error fetching public key', e_3);
+              setTokenError(new TokenPublicKeyError(e_3, iss));
+              return [2 /*return*/, setTokenState('PUBLIC_KEY_LOAD_FAILED')];
+            case 4:
+              valid = false;
+              try {
+                valid = jsrsasign.KJUR.jws.JWS.verifyJWT(token, publicKey, {
+                  alg: ['RS256']
+                });
+              } catch (e) {
+                console.error('error validating token', e);
+              }
+              if (!valid) return [2 /*return*/, setTokenState('INVALID_SIGNATURE')];
+              exp = parsed.exp;
+              if (Date.now() >= exp * 1000) {
+                return [2 /*return*/, setTokenState('EXPIRED')];
+              }
+              setTokenState('GOOD');
+              return [2 /*return*/];
+          }
+        });
+      });
+    })();
+  }, [token]);
   var value = {
     submit: submit,
     submissionStatus: submissionStatus,
@@ -963,6 +1187,23 @@ var SubmissionProvider = function SubmissionProvider(_a) {
     checkLiveness: checkLiveness,
     retryLocationAccess: retryLocationAccess
   };
+  if (tokenState === 'MISSING') {
+    return /*#__PURE__*/React__default['default'].createElement(TokenMissingErrorOverlay, null);
+  }
+  if (tokenState === 'INVALID_FORMAT') {
+    return /*#__PURE__*/React__default['default'].createElement(TokenInvalidFormatErrorOverlay, null);
+  }
+  if (tokenState === 'INVALID_SIGNATURE') {
+    return /*#__PURE__*/React__default['default'].createElement(TokenInvalidSignatureErrorOverlay, null);
+  }
+  if (tokenState === 'EXPIRED') {
+    return /*#__PURE__*/React__default['default'].createElement(TokenExpiredErrorOverlay, null);
+  }
+  if (tokenState === 'PUBLIC_KEY_LOAD_FAILED') {
+    return /*#__PURE__*/React__default['default'].createElement(TokenPublicKeyErrorOverlay, {
+      error: tokenError
+    });
+  }
   return /*#__PURE__*/React__default['default'].createElement(SubmissionContext.Provider, {
     value: value
   }, geolocationRequired && geolocationBlocked ? ( /*#__PURE__*/React__default['default'].createElement(GeolocationAccessDeniedOverlay, null)) : children, submissionError && ( /*#__PURE__*/React__default['default'].createElement(SubmissionErrorOverlay, {