import { Host, h } from "@stencil/core";
import { PnLevelUpService } from "../pn-level-up.service";
export class PnLevelUpModal {
    constructor() {
        this.open = undefined;
        this.endpoint = undefined;
        this.instructionPhoneLineOne = undefined;
        this.instructionPhoneLineTwo = undefined;
        this.instructionPhoneLineThree = undefined;
        this.headingText = undefined;
        this.outdatedQRMessage = undefined;
        this.expiresInMessage = undefined;
        this.system = undefined;
        this.qrAriaLabel = undefined;
        this.openModalToggle = false;
        this.isLoading = true;
    }
    modalToggle;
    _bankIDUrl;
    _levelupService;
    _levelUpModal;
    componentWillLoad() {
        this._levelupService = new PnLevelUpService(this.endpoint);
        this.updateOpen();
    }
    updateBankIDUrl = async () => {
        this.isLoading = true;
        let authResponse = await this._levelupService.levelupAuthorize(this.system, null);
        this.isLoading = false;
        this._bankIDUrl = authResponse.url;
        await this._levelupService.levelupTokenGrant(authResponse.id, '30', null).then((response) => {
            if (response.code === 200) {
                this._levelupService.newLevelupUser();
            }
        });
    };
    updateOpen() {
        if (this.open === true) {
            this.handleOpen();
            this.openModalToggle = true;
            if (this._levelUpModal) {
                if (this._levelUpModal.open === true) {
                    this._levelUpModal.open = false;
                }
                this._levelUpModal.open = true;
            }
        }
        else {
            this.openModalToggle = false;
        }
    }
    handleOpen = async () => {
        await this.updateBankIDUrl();
    };
    render() {
        return (h(Host, { key: '76e1a218f3727ecb7c4ed3031431c9f2396e16f4' }, h("pn-modal", { key: '1070592e01333d07085da839772bd89e9bff6f55', ref: el => this._levelUpModal = el, open: this.open, class: "level-up-phone-modal", "allow-overflow": 'true', label: this.headingText, onModalToggle: (ev) => {
                const detail = ev.detail;
                const isOpen = typeof detail === 'boolean' ? detail : !!detail?.open;
                this.openModalToggle = isOpen;
            } }, this.isLoading ?
            (h("pn-spinner", { light: "false", size: "1.5" })) : (h("div", { class: "modal-content-container" }, h("div", { class: "modal-content-qr" }, this.openModalToggle && (h("pn-qr-code-generator", { url: this._bankIDUrl, "countdown-seconds": "30", "outdated-message": this.outdatedQRMessage, "expires-in-message": this.expiresInMessage, "update-code-every-second": true, "aria-label": this.qrAriaLabel }))), h("div", { class: "modal-content-list" }, h("ol", null, this.instructionPhoneLineOne && h("li", null, this.instructionPhoneLineOne), this.instructionPhoneLineTwo && h("li", null, this.instructionPhoneLineTwo), this.instructionPhoneLineThree && h("li", null, this.instructionPhoneLineThree))))))));
    }
    static get is() { return "pn-level-up-modal"; }
    static get originalStyleUrls() {
        return {
            "$": ["pn-level-up-modal.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["pn-level-up-modal.css"]
        };
    }
    static get properties() {
        return {
            "open": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "open",
                "reflect": true
            },
            "endpoint": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "endpoint",
                "reflect": false
            },
            "instructionPhoneLineOne": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "instruction-phone-line-one",
                "reflect": false
            },
            "instructionPhoneLineTwo": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "instruction-phone-line-two",
                "reflect": false
            },
            "instructionPhoneLineThree": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "instruction-phone-line-three",
                "reflect": false
            },
            "headingText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "heading-text",
                "reflect": false
            },
            "outdatedQRMessage": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "outdated-q-r-message",
                "reflect": false
            },
            "expiresInMessage": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "expires-in-message",
                "reflect": false
            },
            "system": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "DeviceType",
                    "resolved": "\"android\" | \"ios\" | \"web\"",
                    "references": {
                        "DeviceType": {
                            "location": "import",
                            "path": "../types",
                            "id": "src/components/widgets/pn-level-up/types.ts::DeviceType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "system",
                "reflect": false
            },
            "qrAriaLabel": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "qr-aria-label",
                "reflect": false
            }
        };
    }
    static get states() {
        return {
            "openModalToggle": {},
            "isLoading": {}
        };
    }
    static get events() {
        return [{
                "method": "modalToggle",
                "name": "modalToggle",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                }
            }];
    }
    static get watchers() {
        return [{
                "propName": "open",
                "methodName": "updateOpen"
            }];
    }
}
//# sourceMappingURL=pn-level-up-modal.js.map
