@verdocs/web-sdk 5.0.41 → 5.0.43

package/dist/cjs/verdocs-sign.cjs.entry.js

@@ -76,7 +76,10 @@ const VerdocsSign = class {
         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 = [];
@@ -124,15 +127,29 @@ const VerdocsSign = class {
             }
             this.recipientIndex = this.roleNames.findIndex(roleName => roleName == this.roleId);
             if (this.recipientIndex > -1) {
+                console.log('[SIGN] Processing recipient', this.authStep);
                 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') {
@@ -148,24 +165,6 @@ const VerdocsSign = class {
             }
             this.checkRecipientFields();
             (_d = this.envelopeLoaded) === null || _d === void 0 ? void 0 : _d.emit({ endpoint: this.endpoint, envelope: this.envelope });
-            if (!this.isDone) {
-                jsSdk.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);
@@ -584,7 +583,29 @@ const VerdocsSign = class {
         });
         this.checkRecipientFields();
     }
+    handleAuthenticateSigner(params) {
+        console.log('[SIGN] Submitting authentication step', params);
+        jsSdk.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 {
+                Toast.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() {
+        console.log('[SIGN] Rendering', { authStep: this.authStep });
         if (this.showLoadError) {
             return (index.h(index.Host, null, index.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: () => {
                     window.location.reload();
@@ -607,86 +628,91 @@ const VerdocsSign = class {
         if (!this.agreed) {
             return (index.h(index.Host, { class: "agreed" }, index.h("div", { id: "verdocs-sign-header" }, index.h("div", { class: "inner" }, index.h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), index.h("div", { class: "title" }, this.envelope.name))), index.h("div", { class: "document", style: { paddingTop: '15px' } }, index.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" })), index.h("div", { class: "cover" }, index.h("div", { class: "agree" }, index.h("verdocs-checkbox", { name: "agree", label: "By checking this box, you:", onInput: () => this.handleClickAgree() }), index.h("ul", null, index.h("li", null, "Agree to use electronic records and signatures, and confirm you have read the", ' ', index.h("a", { href: "https://verdocs.com/en/electronic-record-signature-disclosure/", target: "_blank" }, "Electronic Record and Signatures Disclosure"), "."), index.h("li", null, "Agree to Verdocs'", ' ', index.h("a", { href: "https://verdocs.com/en/eula", target: "_blank" }, "End User License Agreement"), ' ', "and confirm you have read Verdocs'", ' ', index.h("a", { href: "https://verdocs.com/en/privacy-policy/", target: "_blank" }, "Privacy Policy"), "."))))));
         }
-        if (this.kbaStep === 'pin') {
-            return (index.h(index.Host, { class: "kba" }, index.h("div", { id: "verdocs-sign-header" }, index.h("div", { class: "inner" }, index.h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), index.h("div", { class: "title" }, this.envelope.name))), index.h("div", { class: "document", style: { paddingTop: '15px' } }, index.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" })), index.h("div", { class: "cover" }, index.h("div", { class: "kba" }, index.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) => {
-                    jsSdk.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 {
-                            Toast.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 (index.h(index.Host, { class: "kba" }, index.h("div", { id: "verdocs-sign-header" }, index.h("div", { class: "inner" }, index.h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), index.h("div", { class: "title" }, this.envelope.name))), index.h("div", { class: "document", style: { paddingTop: '15px' } }, index.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" })), index.h("div", { class: "cover" }, index.h("div", { class: "kba" }, index.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 (index.h(index.Host, { class: "kba" }, index.h("div", { id: "verdocs-sign-header" }, index.h("div", { class: "inner" }, index.h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), index.h("div", { class: "title" }, this.envelope.name))), index.h("div", { class: "document", style: { paddingTop: '15px' } }, index.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" })), index.h("div", { class: "cover" }, index.h("div", { class: "kba" }, index.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;
-                    jsSdk.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);
-                        Toast.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 (index.h(index.Host, { class: "kba" }, index.h("div", { id: "verdocs-sign-header" }, index.h("div", { class: "inner" }, index.h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), index.h("div", { class: "title" }, this.envelope.name))), index.h("div", { class: "document", style: { paddingTop: '15px' } }, index.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" })), index.h("div", { class: "cover" }, index.h("div", { class: "kba" }, this.kbaChoices.length >= this.kbaQuestions.length ? (index.h("verdocs-spinner", null)) : (index.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 jsSdk.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 (index.h(index.Host, null, index.h("div", { id: "verdocs-sign-header" }, index.h("div", { class: "inner" }, index.h("img", { src: "https://verdocs.com/assets/white-logo.svg", alt: "Verdocs Logo", class: "logo" }), index.h("div", { class: "title" }, this.envelope.name), index.h("div", { style: { flex: '1' } }), !this.finishLater && index.h("verdocs-button", { size: "xsmall", label: this.nextButtonLabel, disabled: !this.agreed, onClick: () => this.handleNext() }), index.h("div", { style: { marginLeft: '10px' } }), index.h("verdocs-dropdown", { options: !this.isDone && !this.finishLater ? inProgressMenuOptions : doneMenuOptions, onOptionSelected: e => this.handleOptionSelected(e) }))), index.h("div", { class: "document", style: { paddingTop: '15px' } }, (this.envelope.documents || []).map(envelopeDocument => {
             const pageNumbers = jsSdk.integerSequence(1, envelopeDocument.pages);
             return (index.h(index.Fragment, null, pageNumbers.map(pageNumber => {