import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-CUAGH_8P.js';
import { verifySigner } from '@verdocs/js-sdk';
import { D as DefaultEndpoint } from './p-C_Xku1v2.js';
import { V as VerdocsToast } from './p-CyvDgtoV.js';
import { d as defineCustomElement$4 } from './p-CwklHveG.js';
import { d as defineCustomElement$3 } from './p-CO3KQG1e.js';
import { d as defineCustomElement$2 } from './p-BCKfiFng.js';
import { d as defineCustomElement$1 } from './p-764zY_TM.js';

const verdocsOtpDialogCss = "verdocs-otp-dialog{font-family:\"Inter\", \"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-otp-dialog div{-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-otp-dialog .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;width:100%;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between}verdocs-otp-dialog .heading .title{font-size:20px;font-weight:500}verdocs-otp-dialog .step{margin-left:6px;color:#666}verdocs-otp-dialog .help-box{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding:0;-ms-flex-align:center;align-items:center;color:black;margin-bottom:20px}verdocs-otp-dialog .help-details{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:0;font-size:14px;gap:5px}verdocs-otp-dialog .help-title{font-weight:600;margin-bottom:4px}verdocs-otp-dialog .help-text{font-weight:400}verdocs-otp-dialog .buttons{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:end;justify-content:flex-end;width:100%}verdocs-otp-dialog .buttons verdocs-button{margin-left:16px}";

const VerdocsOtpDialog = /*@__PURE__*/ proxyCustomElement(class VerdocsOtpDialog extends H {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.exit = createEvent(this, "exit");
        this.next = createEvent(this, "next");
        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 style() { return verdocsOtpDialogCss; }
}, [256, "verdocs-otp-dialog", {
        "endpoint": [1040],
        "method": [1],
        "resendDisabled": [32],
        "response": [32]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["verdocs-otp-dialog", "verdocs-button", "verdocs-dialog", "verdocs-help-icon", "verdocs-text-input"];
    components.forEach(tagName => { switch (tagName) {
        case "verdocs-otp-dialog":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, VerdocsOtpDialog);
            }
            break;
        case "verdocs-button":
            if (!customElements.get(tagName)) {
                defineCustomElement$4();
            }
            break;
        case "verdocs-dialog":
            if (!customElements.get(tagName)) {
                defineCustomElement$3();
            }
            break;
        case "verdocs-help-icon":
            if (!customElements.get(tagName)) {
                defineCustomElement$2();
            }
            break;
        case "verdocs-text-input":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}

export { VerdocsOtpDialog as V, defineCustomElement as d };
//# sourceMappingURL=p-BbYxvvmR.js.map

//# sourceMappingURL=p-BbYxvvmR.js.map