import { h, Host } from "@stencil/core";
import { verifySigner } from "@verdocs/js-sdk";
import { DefaultEndpoint } from "../../../utils/Environment";
import { VerdocsToast } from "../../../utils/Toast";
/**
 * Prompt the user to confirm their identity with a one time code via email/SMS.
 */
export class VerdocsOtpDialog {
    constructor() {
        this.resendTimeout = null;
        /**
         * The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used.
         */
        this.endpoint = DefaultEndpoint;
        /**
         * The type of dialog to display. Three modes are supported.
         */
        this.method = 'email';
        this.resendDisabled = true;
        this.response = '';
    }
    componentDidLoad() {
        this.startResendTimeout();
        // Give the parent time to finish what it's doing.
        setTimeout(() => {
            verifySigner(this.endpoint, { auth_method: this.method, code: '', resend: true })
                .then(r => {
                console.log('Resend result', r);
                this.response = '';
            })
                .catch(e => console.log('Error resending code', e));
        }, 1000);
    }
    disconnectedCallback() {
        if (this.resendTimeout) {
            clearTimeout(this.resendTimeout);
            this.resendTimeout = null;
        }
    }
    handleCancel() {
        this.exit.emit();
    }
    startResendTimeout() {
        this.resendDisabled = true;
        if (this.resendTimeout) {
            clearTimeout(this.resendTimeout);
        }
        this.resendTimeout = setTimeout(() => {
            this.resendDisabled = false;
        }, 30000);
    }
    handleResend() {
        this.startResendTimeout();
        verifySigner(this.endpoint, { auth_method: this.method, code: '', resend: true })
            .then(r => {
            console.log('Resend result', r);
            this.response = '';
            VerdocsToast('A new code has been sent.');
        })
            .catch(e => console.log('Error resending code', e));
    }
    handleSubmit() {
        this.startResendTimeout();
        verifySigner(this.endpoint, { auth_method: this.method, code: this.response })
            .then(response => {
            console.log('Verification completed', response);
            this.next.emit({ response });
            VerdocsToast('Thank you. Your verification was successful.');
        })
            .catch(e => {
            VerdocsToast('Invalid verification code. Please try again.');
            console.log('Invalid code', e);
        });
        this.response = '';
    }
    render() {
        return (h(Host, { key: '54d72aa1d9f97e045b89d4a7ddebb52734e2b0a7' }, h("verdocs-dialog", { key: '3ef501fd26f54b1c76d8b4e74c2235848484576f', persistent: true, onExit: () => this.handleCancel() }, h("div", { key: 'b2ae8bda06649f568e00481362f2aae6887b2dc4', slot: "heading", class: "heading" }, h("div", { key: 'e3b78ecd8382ea2c307de1e9e67eed7bd4010017', class: "title" }, "Verification Required")), h("div", { key: '518995d5586fa2699ad3782a79000acef722a87f', slot: "content", class: "content" }, h("div", { key: '9cd3d4f720369e55ab90d500c2dca6f538342873', class: "help-box" }, h("div", { key: '9d5931a95c0448af4a9bb72c881663405afd2c46', class: "help-details" }, h("div", { key: '582bda9aa5a54c8bdfced88f3bb74551426b6b71', class: "help-text" }, "Please check your messages for a one-time code. If you did not receive it, be sure to check your Spam/Junk folder."))), h("verdocs-text-input", { key: 'e98ed964b42aac526b8e49360546d47daacf51bf', id: "verdocs-otp-input", value: this.response, onClick: e => e.stopPropagation(), placeholder: "Enter your one-time code...", onInput: (e) => (this.response = e.target.value) })), h("div", { key: '38434e47378a5c1b410f3b01e39c7d5dac0cba9f', slot: "footer", class: "buttons footer" }, h("verdocs-button", { key: '0b0b3ed47757dcbb4287f55f0f5058a5b0bbb954', label: "Cancel", variant: "outline", onClick: () => this.handleCancel() }), h("verdocs-button", { key: 'd6c830134f9c987e39e27b5831c87f1670ed4af0', label: 'Resend', onClick: () => this.handleResend(), disabled: this.resendDisabled }), h("verdocs-button", { key: '99f2076dcc4534105b7a529dcbaaf84a8390bc3b', label: 'Submit', onClick: () => this.handleSubmit(), disabled: !this.response })))));
    }
    static get is() { return "verdocs-otp-dialog"; }
    static get originalStyleUrls() {
        return {
            "$": ["verdocs-otp-dialog.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["verdocs-otp-dialog.css"]
        };
    }
    static get properties() {
        return {
            "endpoint": {
                "type": "unknown",
                "mutable": true,
                "complexType": {
                    "original": "VerdocsEndpoint",
                    "resolved": "VerdocsEndpoint",
                    "references": {
                        "VerdocsEndpoint": {
                            "location": "import",
                            "path": "@verdocs/js-sdk",
                            "id": "node_modules::VerdocsEndpoint"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The endpoint to use to communicate with Verdocs. If not set, the default endpoint will be used."
                },
                "getter": false,
                "setter": false,
                "defaultValue": "DefaultEndpoint"
            },
            "method": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "'email' | 'sms'",
                    "resolved": "\"email\" | \"sms\"",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "The type of dialog to display. Three modes are supported."
                },
                "getter": false,
                "setter": false,
                "reflect": false,
                "attribute": "method",
                "defaultValue": "'email'"
            }
        };
    }
    static get states() {
        return {
            "resendDisabled": {},
            "response": {}
        };
    }
    static get events() {
        return [{
                "method": "exit",
                "name": "exit",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Event fired when the step is cancelled. This is called exit to avoid conflicts with the JS-reserved \"cancel\" event name."
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }, {
                "method": "next",
                "name": "next",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": "Event fired when the process has completed successfully."
                },
                "complexType": {
                    "original": "{response: ISignerTokenResponse}",
                    "resolved": "{ response: ISignerTokenResponse; }",
                    "references": {
                        "ISignerTokenResponse": {
                            "location": "import",
                            "path": "@verdocs/js-sdk",
                            "id": "node_modules::ISignerTokenResponse"
                        }
                    }
                }
            }];
    }
}
//# sourceMappingURL=verdocs-otp-dialog.js.map
