@verdocs/web-sdk 5.0.40 → 5.0.42

package/dist/components/verdocs-field-textbox.js

@@ -1,4 +1,4 @@
-import { V as VerdocsFieldTextbox$1, d as defineCustomElement$1 } from './p-a4c3e93a.js';
+import { V as VerdocsFieldTextbox$1, d as defineCustomElement$1 } from './p-0e454650.js';
 
 const VerdocsFieldTextbox = VerdocsFieldTextbox$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-field-timestamp.js

@@ -1,4 +1,4 @@
-import { V as VerdocsFieldTimestamp$1, d as defineCustomElement$1 } from './p-4f0db584.js';
+import { V as VerdocsFieldTimestamp$1, d as defineCustomElement$1 } from './p-df227cfc.js';
 
 const VerdocsFieldTimestamp = VerdocsFieldTimestamp$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-multiselect.js

@@ -1,4 +1,4 @@
-import { V as VerdocsMultiselect$1, d as defineCustomElement$1 } from './p-c6d1cdb7.js';
+import { V as VerdocsMultiselect$1, d as defineCustomElement$1 } from './p-a50f7982.js';
 
 const VerdocsMultiselect = VerdocsMultiselect$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-organization-card.js

@@ -1,5 +1,5 @@
 import { p as proxyCustomElement, H, h, d as Host } from './p-1f51246d.js';
-import { d as defineCustomElement$2 } from './p-afd663f1.js';
+import { d as defineCustomElement$2 } from './p-ca16a8ac.js';
 import { f as format } from './p-12bab948.js';
 
 const verdocsOrganizationCardCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-organization-card{font-family:\"Inter\", \"Barlow\", sans-serif;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;border:1px solid #cccccc;background:#ffffff;border-radius:8px;padding:7px 15px}verdocs-organization-card .icon{-ms-flex:0;flex:0;height:24px;width:24px;margin:0 14px 0 0}verdocs-organization-card .icon svg{fill:#aeb4bf;height:24px;width:24px}verdocs-organization-card .content{margin-top:2px}.verdocs-org-card-popup{font-family:\"Inter\", \"Barlow\", sans-serif;background:#ffffff;border-radius:10px;width:326px;padding:20px 40px 0 40px;-ms-flex-direction:column;flex-direction:column;-ms-flex-wrap:nowrap;flex-wrap:nowrap;border:1px solid #cccccc}.verdocs-org-card-popup .popup-header-with-logo{display:-ms-flexbox;display:flex;-ms-flex:0;flex:0;gap:20px;-ms-flex-direction:column;flex-direction:column;margin:0 0 20px 0;font-size:21px;line-height:16px;color:#4c56cb}.verdocs-org-card-popup .popup-header-with-logo img{max-width:300px;max-height:50px}.verdocs-org-card-popup .popup-header{display:-ms-flexbox;display:flex;-ms-flex:0;flex:0;gap:20px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:end;align-items:flex-end;margin:0 0 20px 0;font-size:21px;line-height:16px;color:#4c56cb}.verdocs-org-card-popup .popup-body{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;font-size:14px;text-transform:uppercase}.verdocs-org-card-popup .status{-webkit-transform:scale(1.5);transform:scale(1.5);width:24px;height:24px}.verdocs-org-card-popup .field{margin:0 0 20px 0}.verdocs-org-card-popup .field strong{color:#7b7b9a;display:block;margin:0 0 5px 0}.verdocs-org-card-popup .field a{color:#654dcb;text-transform:uppercase}";

package/dist/components/verdocs-portal.js

@@ -1,4 +1,4 @@
-import { V as VerdocsPortal$1, d as defineCustomElement$1 } from './p-afd663f1.js';
+import { V as VerdocsPortal$1, d as defineCustomElement$1 } from './p-ca16a8ac.js';
 
 const VerdocsPortal = VerdocsPortal$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-preview.js

@@ -1,4 +1,4 @@
-import { V as VerdocsPreview$1, d as defineCustomElement$1 } from './p-e378a0ae.js';
+import { V as VerdocsPreview$1, d as defineCustomElement$1 } from './p-4a04090c.js';
 
 const VerdocsPreview = VerdocsPreview$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-send.js

@@ -1,4 +1,4 @@
-import { V as VerdocsSend$1, d as defineCustomElement$1 } from './p-fd4e0e9b.js';
+import { V as VerdocsSend$1, d as defineCustomElement$1 } from './p-4a4bf38c.js';
 
 const VerdocsSend = VerdocsSend$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/verdocs-sign.js

@@ -1,19 +1,19 @@
 import { p as proxyCustomElement, H, c as createEvent, h, d as Host, F as Fragment } from './p-1f51246d.js';
-import { VerdocsEndpoint, startSigningSession, getKbaStep, envelopeRecipientAgree, envelopeRecipientDecline, updateEnvelopeField, createSignature, updateEnvelopeFieldSignature, createInitials, updateEnvelopeFieldInitials, isValidPhone, isValidEmail, sortFields, envelopeRecipientSubmit, getEnvelope, uploadEnvelopeFieldAttachment, deleteEnvelopeFieldAttachment, formatFullName, fullNameToInitials, submitKbaPin, submitKbaIdentity, submitKbaChallengeResponse, integerSequence } from '@verdocs/js-sdk';
+import { VerdocsEndpoint, startSigningSession, envelopeRecipientAgree, envelopeRecipientDecline, updateEnvelopeField, createSignature, updateEnvelopeFieldSignature, createInitials, updateEnvelopeFieldInitials, isValidPhone, isValidEmail, sortFields, envelopeRecipientSubmit, getEnvelope, uploadEnvelopeFieldAttachment, deleteEnvelopeFieldAttachment, formatFullName, fullNameToInitials, authenticateSigner, integerSequence } from '@verdocs/js-sdk';
 import { a as saveAttachment, u as updateDocumentFieldValue, r as renderDocumentField, g as getFieldId } from './p-af5ecc92.js';
 import { V as VerdocsToast } from './p-04c07b7b.js';
 import { S as SDKError } from './p-fd97809c.js';
-import { S as Store } from './p-78d650ca.js';
+import { S as Store } from './p-33300e3a.js';
 import { d as defineCustomElement$b } from './p-f5ccf125.js';
-import { d as defineCustomElement$a } from './p-f007234d.js';
-import { d as defineCustomElement$9 } from './p-4c08e92a.js';
+import { d as defineCustomElement$a } from './p-96774726.js';
+import { d as defineCustomElement$9 } from './p-d89157e9.js';
 import { d as defineCustomElement$8 } from './p-0a102a9c.js';
 import { d as defineCustomElement$7 } from './p-321e2d4e.js';
 import { d as defineCustomElement$6 } from './p-f7dc9e74.js';
 import { d as defineCustomElement$5 } from './p-081465e0.js';
-import { d as defineCustomElement$4 } from './p-afd663f1.js';
+import { d as defineCustomElement$4 } from './p-ca16a8ac.js';
 import { d as defineCustomElement$3 } from './p-61a2c23a.js';
-import { d as defineCustomElement$2 } from './p-ab71430d.js';
+import { d as defineCustomElement$2 } from './p-581128fe.js';
 
 const verdocsSignCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-sign{display:-ms-flexbox;display:flex;overflow:hidden;position:relative;min-height:600px;-ms-flex-direction:column;flex-direction:column;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:\"Inter\", -apple-system, \"Segoe UI\", \"Roboto\", \"Helvetica Neue\", sans-serif}verdocs-sign div{display:block;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-sign input{vertical-align:top}verdocs-sign>.document{-ms-flex:1;flex:1;width:100%;height:100%;-ms-flex-item-align:center;align-self:center;display:-ms-flexbox;display:flex;padding:15px;row-gap:15px;max-width:1200px;min-height:200px;position:relative;overflow-y:scroll;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;-ms-flex-direction:column;flex-direction:column}verdocs-sign>.document .inner{width:100%;max-width:1028px}verdocs-sign .cover{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:5000;position:absolute;padding-top:100px;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;background:rgba(0, 0, 0, 0.5)}verdocs-sign .agree{-ms-flex:0;flex:0;width:600px;display:-ms-flexbox;display:flex;max-width:90%;padding:30px 15px;-ms-flex-direction:column;flex-direction:column;background-color:#ffffff}verdocs-sign .agree .header{-ms-flex:0 0 56px;flex:0 0 56px}verdocs-sign .agree li{margin:0.5em 0}verdocs-sign verdocs-ok-dialog .background-overlay{-ms-flex-align:start;align-items:flex-start;padding-top:100px}verdocs-sign .loading-indicator{top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;z-index:10000;position:fixed;background-color:rgba(0, 0, 0, 0.7)}verdocs-sign .fatal-error{position:absolute;z-index:100;top:0;left:0;right:0;bottom:0;background-color:#4a4a4a;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}verdocs-sign .fatal-error .placeholder{position:absolute;opacity:0.1;z-index:-1;top:0;left:0;right:0;bottom:0;width:612px;height:792px;-webkit-box-shadow:0 0 10px 5px rgba(0, 0, 0, 0.0588235294);box-shadow:0 0 10px 5px rgba(0, 0, 0, 0.0588235294);margin-top:15px}verdocs-sign .fatal-error .message{max-width:50%;width:50%;font-size:16px;background:white;border-radius:5px;-webkit-box-shadow:3px 3px 9px -1px rgba(0, 0, 0, 0.2470588235);box-shadow:3px 3px 9px -1px rgba(0, 0, 0, 0.2470588235)}verdocs-sign .fatal-error .header{color:white;font-size:18px;font-weight:500;padding:5px 10px;margin:0 0 10px 0;background:#4c56cb}verdocs-sign .fatal-error p{margin:1rem;font-size:14px;font-weight:400;padding:0 10px}@media print{verdocs-sign .header{display:none}}#verdocs-sign-header{color:#fff;width:100%;display:-ms-flexbox;display:flex;z-index:1000;-ms-flex:0 0 46px;flex:0 0 46px;font-size:12px;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-webkit-transition:all 0.25s;transition:all 0.25s;background-color:#33354c;-webkit-box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12);box-shadow:0 4px 4px 0 rgba(0, 0, 0, 0.24), 0 0 4px 0 rgba(0, 0, 0, 0.12)}#verdocs-sign-header .inner{width:100%;display:-ms-flexbox;display:flex;margin:0 auto;padding:0 12px;max-width:1200px;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row}#verdocs-sign-header .logo{width:80px;display:none;margin:-6px 0 0 0}#verdocs-sign-header .title{font-size:18px;font-weight:500;overflow:hidden;white-space:nowrap;padding:0 10px 0 0;text-overflow:ellipsis}.spinner-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:1000;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;background:rgba(0, 0, 0, 0.4980392157);-ms-flex-pack:center;justify-content:center}";
 const VerdocsSignStyle0 = verdocsSignCss;
@@ -80,7 +80,10 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         this.showFinishLater = false;
         this.agreed = false;
         this.documentsSingularPlural = 'document';
-        this.kbaStep = '';
+        // TODO
+        // @State() authStep: TRecipientAuthMethod | null = null;
+        this.authStep = null;
+        this.authDetails = null;
         this.kbaQuestions = [];
         this.showSpinner = false;
         this.kbaChoices = [];
@@ -130,13 +133,26 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             if (this.recipientIndex > -1) {
                 this.recipient = this.sortedRecipients[this.recipientIndex];
                 this.agreed = this.recipient.agreed;
+                this.submitted = this.recipient.status === 'submitted';
+                this.authStep = this.recipient.auth_step;
+                if (this.authStep) {
+                    console.log('[SIGN] Authentication required', this.authStep);
+                }
+                const auth_method_states = (this.recipient.auth_method_states || {});
+                if (Object.values(auth_method_states).includes('failed')) {
+                    this.fatalErrorHeader = 'Recipient Verification Failed';
+                    this.fatalErrorMessage = 'We were unable to verify your identity. The sender has been notified.';
+                    this.isDone = true;
+                }
+                // TODO
+                //               this.kbaQuestions = (r as any).questions?.question || [];
+                //               this.kbaChoices = [];
             }
             else {
                 console.warn('[SIGN] Could not find our recipient record', this.roleId, this.sortedRecipients);
             }
             // TODO: Envelope "complete" | "declined" | "canceled"
             // TODO: Recipient "canceled"
-            this.submitted = this.recipient.status === 'submitted';
             this.isDone = this.submitted;
             this.showDone = this.submitted;
             if (this.envelope.status === 'canceled') {
@@ -152,24 +168,6 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
             }
             this.checkRecipientFields();
             (_d = this.envelopeLoaded) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, envelope: this.envelope });
-            if (!this.isDone) {
-                getKbaStep(this.endpoint, this.envelopeId, this.roleId)
-                    .then(r => {
-                    var _a;
-                    console.log('[SIGN] KBA Step', r);
-                    this.kbaStep = r.kba_step;
-                    if (this.kbaStep === 'failed') {
-                        this.fatalErrorHeader = 'Identity Verification Failed';
-                        this.fatalErrorMessage = 'We were unable to verify your identity. The sender has been notified.';
-                        this.isDone = true;
-                    }
-                    else {
-                        this.kbaQuestions = ((_a = r.questions) === null || _a === void 0 ? void 0 : _a.question) || [];
-                        this.kbaChoices = [];
-                    }
-                })
-                    .catch(e => console.log('Error getting KBA step', e));
-            }
         }
         catch (e) {
             console.log('[SIGN] Error with signing session', e);
@@ -588,6 +586,27 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         });
         this.checkRecipientFields();
     }
+    handleAuthenticateSigner(params) {
+        console.log('[SIGN] Submitting authentication step', params);
+        authenticateSigner(this.endpoint, params)
+            .then(r => {
+            console.log('[SIGN] Authentication successful', r);
+            this.authStep = r.auth_step;
+            this.authDetails = r.auth_details;
+        })
+            .catch(e => {
+            var _a, _b, _c, _d, _e;
+            console.log('[SIGN] Error submitting authentication step', e);
+            if ((_c = (_b = (_a = e.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.error) === null || _c === void 0 ? void 0 : _c.includes('failed')) {
+                this.fatalErrorHeader = 'Recipient Verification Failed';
+                this.fatalErrorMessage = 'We were unable to verify your identity. The sender has been notified.';
+                this.isDone = true;
+            }
+            else {
+                VerdocsToast(((_e = (_d = e.response) === null || _d === void 0 ? void 0 : _d.data) === null || _e === void 0 ? void 0 : _e.error) || 'Unable to verify your identity. Please try again.', { style: 'error' });
+            }
+        });
+    }
     render() {
         if (this.showLoadError) {
             return (h(Host, null, h("verdocs-ok-dialog", { heading: "Unable to Start Signing", message: `Sorry, your invite code is invalid or has expired. Please check your email for an updated invitation, or contact the sender.`, buttonLabel: "OK", onNext: () => {
@@ -611,86 +630,91 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         if (!this.agreed) {
             return (h(Host, { class: "agreed" }, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name))), h("div", { class: "document", style: { paddingTop: '15px' } }, h("img", { src: "https://public-assets.verdocs.com/loading-placeholder.png", style: { width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px' }, alt: "Placeholder page" })), h("div", { class: "cover" }, h("div", { class: "agree" }, h("verdocs-checkbox", { name: "agree", label: "By checking this box, you:", onInput: () => this.handleClickAgree() }), h("ul", null, h("li", null, "Agree to use electronic records and signatures, and confirm you have read the", ' ', h("a", { href: "https://verdocs.com/en/electronic-record-signature-disclosure/", target: "_blank" }, "Electronic Record and Signatures Disclosure"), "."), h("li", null, "Agree to Verdocs'", ' ', h("a", { href: "https://verdocs.com/en/eula", target: "_blank" }, "End User License Agreement"), ' ', "and confirm you have read Verdocs'", ' ', h("a", { href: "https://verdocs.com/en/privacy-policy/", target: "_blank" }, "Privacy Policy"), "."))))));
         }
-        if (this.kbaStep === 'pin') {
-            return (h(Host, { class: "kba" }, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name))), h("div", { class: "document", style: { paddingTop: '15px' } }, h("img", { src: "https://public-assets.verdocs.com/loading-placeholder.png", style: { width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px' }, alt: "Placeholder page" })), h("div", { class: "cover" }, h("div", { class: "kba" }, h("verdocs-kba-dialog", { mode: "text", step: 1, steps: 1, helptitle: "Document is protected by a PIN code", helptext: "Please enter your PIN code to proceed. If you do not have one, please contact the sender.", label: "PIN Code", onNext: async (e) => {
-                    submitKbaPin(this.endpoint, this.envelopeId, this.roleId, e.detail)
-                        .then(r => {
-                        console.log('[SIGN] PIN code submission result', r);
-                        if (r.kba_step === 'complete') {
-                            this.kbaStep = '';
-                        }
-                    })
-                        .catch(e => {
-                        var _a, _b, _c, _d;
-                        console.log('[SIGN] Error submitting PIN', e);
-                        if (((_b = (_a = e.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.error) === 'Rejecting PIN submission, too many attempts') {
-                            this.fatalErrorHeader = 'PIN Verification Failed';
-                            this.fatalErrorMessage = 'Too many failed attempts. The sender has been notified.';
-                            this.isDone = true;
-                        }
-                        else {
-                            VerdocsToast(((_d = (_c = e.response) === null || _c === void 0 ? void 0 : _c.data) === null || _d === void 0 ? void 0 : _d.error) || 'Unable to verify PIN code. Please try again.', { style: 'error' });
-                        }
-                    });
-                } })))));
+        if (this.authStep === 'passcode') {
+            return (h(Host, { class: "kba" }, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name))), h("div", { class: "document", style: { paddingTop: '15px' } }, h("img", { src: "https://public-assets.verdocs.com/loading-placeholder.png", style: { width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px' }, alt: "Placeholder page" })), h("div", { class: "cover" }, h("div", { class: "kba" }, h("verdocs-kba-dialog", { mode: "text", step: 1, steps: 1, helptitle: "Document is protected by a Passcode", helptext: "Please enter your Passcode to proceed. If you do not have one, please contact the sender.", label: "Passcode", onNext: e => this.handleAuthenticateSigner({ auth_method: 'passcode', code: e.detail }) })))));
         }
-        if (this.kbaStep === 'identity') {
+        if (this.authStep === 'kba') {
             return (h(Host, { class: "kba" }, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name))), h("div", { class: "document", style: { paddingTop: '15px' } }, h("img", { src: "https://public-assets.verdocs.com/loading-placeholder.png", style: { width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px' }, alt: "Placeholder page" })), h("div", { class: "cover" }, h("div", { class: "kba" }, h("verdocs-kba-dialog", { mode: "identity", helptitle: "Document requires identity verification", helptext: "Please complete your contact details to proceed.", recipient: this.recipient, onNext: async (e) => {
                     const recipDetails = e.detail;
-                    submitKbaIdentity(this.endpoint, this.envelopeId, this.roleId, {
-                        firstName: recipDetails.first_name,
-                        lastName: recipDetails.last_name,
+                    this.handleAuthenticateSigner({
+                        auth_method: 'kba',
+                        first_name: recipDetails.first_name,
+                        last_name: recipDetails.last_name,
                         address: recipDetails.address,
                         city: recipDetails.city,
                         state: recipDetails.state,
                         zip: recipDetails.zip,
-                        ssnLast4: recipDetails.ssn_last_4,
-                    })
-                        .then(r => {
-                        console.log('[SIGN] Identity submission result', r);
-                        this.kbaStep = r.kba_step;
-                    })
-                        .catch(e => {
-                        var _a, _b;
-                        console.log('[SIGN] Error submitting identity', e);
-                        VerdocsToast(((_b = (_a = e.response) === null || _a === void 0 ? void 0 : _a.data) === null || _b === void 0 ? void 0 : _b.error) || 'Unable to verify identity.', { style: 'error' });
+                        ssn_last_4: recipDetails.ssn_last_4,
+                        dob: recipDetails.dob,
                     });
                 } })))));
         }
-        if (this.kbaStep === 'challenge') {
-            const questionNumber = this.kbaChoices.length;
-            const kbaQuestion = this.kbaQuestions[questionNumber];
-            return (h(Host, { class: "kba" }, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name))), h("div", { class: "document", style: { paddingTop: '15px' } }, h("img", { src: "https://public-assets.verdocs.com/loading-placeholder.png", style: { width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px' }, alt: "Placeholder page" })), h("div", { class: "cover" }, h("div", { class: "kba" }, this.kbaChoices.length >= this.kbaQuestions.length ? (h("verdocs-spinner", null)) : (h("verdocs-kba-dialog", { mode: "choice", helptitle: "Your identity requires additional verification", helptext: (kbaQuestion === null || kbaQuestion === void 0 ? void 0 : kbaQuestion.prompt) || 'Please select one of the options below.', choices: (kbaQuestion === null || kbaQuestion === void 0 ? void 0 : kbaQuestion.answer) || ['Skip Question'], step: questionNumber + 1, steps: this.kbaQuestions.length, onNext: async (e) => {
-                    var _a, _b, _c;
-                    const answer = e.detail;
-                    this.kbaChoices = [...this.kbaChoices, answer];
-                    if (this.kbaChoices.length >= this.kbaQuestions.length) {
-                        const responses = this.kbaQuestions.map((q, i) => ({ type: q.type, answer: this.kbaChoices[i] }));
-                        console.log('Submitting KBA responses', this.kbaChoices, responses);
-                        try {
-                            const response = await submitKbaChallengeResponse(this.endpoint, this.envelopeId, this.roleId, responses);
-                            console.log('KBA challenge response', response);
-                            this.kbaStep = response.kba_step;
-                            if (this.kbaStep === 'failed') {
-                                this.fatalErrorHeader = 'Identity Verification Failed';
-                                this.fatalErrorMessage = 'We were unable to verify your identity. The sender has been notified.';
-                                this.isDone = true;
-                            }
-                            else {
-                                this.kbaQuestions = ((_a = response.questions) === null || _a === void 0 ? void 0 : _a.question) || [];
-                                this.kbaChoices = [];
-                            }
-                        }
-                        catch (e) {
-                            console.log('Error submitting KBA challenge', e);
-                            this.kbaStep = '';
-                            this.fatalErrorHeader = 'Unable to Verify Identity';
-                            this.fatalErrorMessage = ((_c = (_b = e.response) === null || _b === void 0 ? void 0 : _b.data) === null || _c === void 0 ? void 0 : _c.error) || 'Please try again later.';
-                            this.isDone = true;
-                        }
-                    }
-                } }))))));
-        }
+        // if (this.kbaStep === 'challenge') {
+        //   const questionNumber = this.kbaChoices.length;
+        //   const kbaQuestion = this.kbaQuestions[questionNumber];
+        //   return (
+        //     <Host class="kba">
+        //       <div id="verdocs-sign-header">
+        //         <div class="inner">
+        //           <img src="https://verdocs.com/assets/white-logo.svg" alt="Verdocs Logo" class="logo" />
+        //           <div class="title">{this.envelope.name}</div>
+        //         </div>
+        //       </div>
+        //
+        //       <div class="document" style={{paddingTop: '15px'}}>
+        //         <img
+        //           src="https://public-assets.verdocs.com/loading-placeholder.png"
+        //           style={{width: '612px', height: '792px', boxShadow: '0 0 10px 5px #0000000f', marginTop: '15px'}}
+        //           alt="Placeholder page"
+        //         />
+        //       </div>
+        //
+        //       <div class="cover">
+        //         <div class="kba">
+        //           {this.kbaChoices.length >= this.kbaQuestions.length ? (
+        //             <verdocs-spinner />
+        //           ) : (
+        //             <verdocs-kba-dialog
+        //               mode="choice"
+        //               helptitle="Your identity requires additional verification"
+        //               helptext={kbaQuestion?.prompt || 'Please select one of the options below.'}
+        //               choices={kbaQuestion?.answer || ['Skip Question']}
+        //               step={questionNumber + 1}
+        //               steps={this.kbaQuestions.length}
+        //               onNext={async (e: any) => {
+        //                 const answer = e.detail as string;
+        //                 this.kbaChoices = [...this.kbaChoices, answer];
+        //                 if (this.kbaChoices.length >= this.kbaQuestions.length) {
+        //                   const responses = this.kbaQuestions.map((q, i) => ({type: q.type, answer: this.kbaChoices[i]}));
+        //                   console.log('Submitting KBA responses', this.kbaChoices, responses);
+        //                   try {
+        //                     const response = await submitKbaChallengeResponse(this.endpoint, this.envelopeId, this.roleId, responses);
+        //                     console.log('KBA challenge response', response);
+        //                     this.kbaStep = response.kba_step;
+        //                     if (this.kbaStep === 'failed') {
+        //                       this.fatalErrorHeader = 'Identity Verification Failed';
+        //                       this.fatalErrorMessage = 'We were unable to verify your identity. The sender has been notified.';
+        //                       this.isDone = true;
+        //                     } else {
+        //                       this.kbaQuestions = (response as any).questions?.question || [];
+        //                       this.kbaChoices = [];
+        //                     }
+        //                   } catch (e) {
+        //                     console.log('Error submitting KBA challenge', e);
+        //                     this.kbaStep = '';
+        //                     this.fatalErrorHeader = 'Unable to Verify Identity';
+        //                     this.fatalErrorMessage = e.response?.data?.error || 'Please try again later.';
+        //                     this.isDone = true;
+        //                   }
+        //                 }
+        //               }}
+        //             />
+        //           )}
+        //         </div>
+        //       </div>
+        //     </Host>
+        //   );
+        // }
         return (h(Host, null, h("div", { id: "verdocs-sign-header" }, h("div", { class: "inner" }, h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), h("div", { class: "title" }, this.envelope.name), h("div", { style: { flex: '1' } }), !this.finishLater && h("verdocs-button", { size: "xsmall", label: this.nextButtonLabel, disabled: !this.agreed, onClick: () => this.handleNext() }), h("div", { style: { marginLeft: '10px' } }), h("verdocs-dropdown", { options: !this.isDone && !this.finishLater ? inProgressMenuOptions : doneMenuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), h("div", { class: "document", style: { paddingTop: '15px' } }, (this.envelope.documents || []).map(envelopeDocument => {
             const pageNumbers = integerSequence(1, envelopeDocument.pages);
             return (h(Fragment, null, pageNumbers.map(pageNumber => {
@@ -739,7 +763,8 @@ const VerdocsSign$1 = /*@__PURE__*/ proxyCustomElement(class VerdocsSign extends
         "showFinishLater": [32],
         "agreed": [32],
         "documentsSingularPlural": [32],
-        "kbaStep": [32],
+        "authStep": [32],
+        "authDetails": [32],
         "kbaQuestions": [32],
         "showSpinner": [32],
         "kbaChoices": [32],