idmission-web-sdk 2.3.111 → 2.3.113

package/dist/sdk2.umd.development.js

@@ -211,7 +211,7 @@
     return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
   };
 
-  var webSdkVersion = '2.3.111';
+  var webSdkVersion = '2.3.113';
 
   function getPlatform() {
     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
@@ -24155,7 +24155,7 @@
     return ((_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.backgroundPosition) ? "background-position: ".concat((_b = props.theme.signatureCapture) === null || _b === void 0 ? void 0 : _b.backgroundPosition, ";") : "";
   });
   var SignatureCanvasContainer$1 = styled.div(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n  position: absolute;\n  top: 25%;\n  left: 15%;\n  width: 70%;\n  height: 50%;\n\n  @media (max-width: 800px) {\n    top: 15%;\n    left: 2%;\n    width: 96%;\n    height: 70%;\n  }\n"], ["\n  position: absolute;\n  top: 25%;\n  left: 15%;\n  width: 70%;\n  height: 50%;\n\n  @media (max-width: 800px) {\n    top: 15%;\n    left: 2%;\n    width: 96%;\n    height: 70%;\n  }\n"])));
-  var SignaturePad = styled.div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n  position: relative;\n  background: ", ";\n  border: ", ";\n  border-radius: ", ";\n  flex-grow: 1;\n  z-index: 100;\n  height: 100%;\n\n  &.empty {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n\n  &.head-tracking-unsatisfied {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n"], ["\n  position: relative;\n  background: ", ";\n  border: ", ";\n  border-radius: ", ";\n  flex-grow: 1;\n  z-index: 100;\n  height: 100%;\n\n  &.empty {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n\n  &.head-tracking-unsatisfied {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n"])), function (props) {
+  var SignaturePad = styled.div(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background: ", ";\n  border: ", ";\n  border-radius: ", ";\n  flex-grow: 1;\n  z-index: 100;\n  height: 100%;\n\n  &.empty {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n\n  &.head-tracking-unsatisfied {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n"], ["\n  position: relative;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  background: ", ";\n  border: ", ";\n  border-radius: ", ";\n  flex-grow: 1;\n  z-index: 100;\n  height: 100%;\n\n  &.empty {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n\n  &.head-tracking-unsatisfied {\n    background: ", ";\n    border: ", ";\n    color: ", ";\n  }\n"])), function (props) {
     var _a, _b, _c;
     return (_c = (_b = (_a = props.theme.signatureCapture) === null || _a === void 0 ? void 0 : _a.canvas) === null || _b === void 0 ? void 0 : _b.background) !== null && _c !== void 0 ? _c : 'rgba(255, 255, 255, 0.5)';
   }, function (props) {
@@ -24591,16 +24591,34 @@
         signaturePad: signaturePad
       });
     }, []);
+    // We discovered that react-signature-canvas clears the canvas when the width and height are changed.
+    // On some devices, the width and height appear to be occilating, so we lock them to the first observed width and height.
+    // Consequently, the signature canvas is also locked to the first observed width and height, so resize behavior can be a little bit weird.
+    var _j = React.useState(undefined),
+      lockedWidth = _j[0],
+      setLockedWidth = _j[1];
+    var _k = React.useState(undefined),
+      lockedHeight = _k[0],
+      setLockedHeight = _k[1];
+    React.useEffect(function () {
+      if (!width || width < 10 || !height || height < 10) return;
+      setLockedWidth(function (lockedWidth) {
+        return lockedWidth !== null && lockedWidth !== void 0 ? lockedWidth : width;
+      });
+      setLockedHeight(function (lockedHeight) {
+        return lockedHeight !== null && lockedHeight !== void 0 ? lockedHeight : height;
+      });
+    }, [width, height]);
     var canvasProps = React.useMemo(function () {
       return {
-        width: width,
-        height: height,
+        width: lockedWidth,
+        height: lockedHeight,
         className: classNames.signatureCanvas
       };
-    }, [classNames.signatureCanvas, height, width]);
-    var _j = React.useState(false),
-      emptyContentDismissed = _j[0],
-      setEmptyContentDismissed = _j[1];
+    }, [classNames.signatureCanvas, lockedHeight, lockedWidth]);
+    var _l = React.useState(false),
+      emptyContentDismissed = _l[0],
+      setEmptyContentDismissed = _l[1];
     React.useEffect(function () {
       if (signaturePadEmpty) setEmptyContentDismissed(false);
     }, [signaturePadEmpty]);
@@ -24916,6 +24934,9 @@
   var assetSelectorOpts$1 = [{
     value: 'signatureVideo',
     label: 'Signature Video'
+  }, {
+    value: 'signatureImage',
+    label: 'Signature Image'
   }, {
     value: 'selfieImage',
     label: 'Selfie Image'
@@ -24975,6 +24996,9 @@
       controls: true,
       preload: "metadata",
       autoPlay: true
+    })), displayedAsset === 'signatureImage' && ctx.signatureData && ( /*#__PURE__*/React.createElement("img", {
+      src: "data:image/jpeg;base64,".concat(ctx.signatureData.fileContent),
+      alt: ""
     })), displayedAsset === 'selfieImage' && ctx.selfieImage && ( /*#__PURE__*/React.createElement("img", {
       src: ctx.selfieImage,
       alt: ""