import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
import { F as FetchHelper } from './FetchHelper.js';
import { L as LocalStorageService } from './LocalStorageService.js';
import { d as defineCustomElement$1 } from './pn-qr-code-generator2.js';

class PnLevelUpService {
    _endpoint;
    _levelupAuthorizePath = `/api/levelup/level-up-authorize`;
    _levelupTokenGrantPath = `/api/levelup/level-up-token-grant`;
    levelupLocalStorageKey = 'levelup';
    fetchHelper = new FetchHelper('PnLevelUpService');
    _storage = new LocalStorageService();
    constructor(endpoint) {
        this._endpoint = this.formatEndpoint(endpoint);
    }
    newLevelupUser() {
        let threeMinutesInMilliseconds = 180000;
        this._storage.set(this.levelupLocalStorageKey, { expire: Date.now() + threeMinutesInMilliseconds });
    }
    async levelupAuthorize(system, defaultReturn) {
        if (!system) {
            return defaultReturn;
        }
        let model = {
            system: system
        };
        const fetchUrl = this._endpoint + this._levelupAuthorizePath;
        const data = (await this.fetchHelper.fetchJson(fetchUrl, this.getRequestInit(model), false));
        return this.handleResponse(data, defaultReturn);
    }
    async levelupTokenGrant(id, loopSeconds, defaultReturn) {
        if (!id) {
            return defaultReturn;
        }
        let model = {
            id: id,
            loopSeconds: loopSeconds
        };
        const fetchUrl = this._endpoint + this._levelupTokenGrantPath;
        const data = (await this.fetchHelper.fetchJson(fetchUrl, this.getRequestInit(model), false));
        return this.handleResponse(data, defaultReturn);
    }
    formatEndpoint(endpoint) {
        return endpoint.lastIndexOf('/') === endpoint.length - 1 ? endpoint.substring(0, endpoint.length - 1) : endpoint;
    }
    handleResponse(data, defaultReturn, checkForArray = false) {
        if (!data) {
            return defaultReturn;
        }
        let parsedData = JSON.parse(data);
        if (!parsedData || checkForArray && !Array.isArray(parsedData)) {
            return defaultReturn;
        }
        return parsedData;
    }
    getRequestInit(model, method = 'POST', mode = 'cors', contentTypes = 'application/json') {
        return {
            mode: mode,
            method: method,
            headers: {
                'Content-Type': contentTypes,
                'CustomValidateAntiForgeryToken': "0111000001101110011000110110000101110100"
            },
            body: JSON.stringify(model)
        };
    }
}

const pnLevelUpModalCss = "pn-button-dropdown .pn-button-dropdown>pn-button>.pn-button{min-height:initial}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}@media screen and (max-width: 767px){.sr-only-mobile{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0}}pn-level-up-modal .pn-modal-header{z-index:0}pn-level-up-modal .pn-modal{max-width:63.1rem}@media screen and (max-width: 768px){pn-level-up-modal .pn-modal{height:100%;max-height:100%}}pn-level-up-modal .level-up-computer-modal .pn-modal-content .modal-content{justify-self:center;display:flex;flex-wrap:wrap;flex-direction:column;gap:2em;margin:2em;width:max-content;align-content:space-around}pn-level-up-modal .pn-modal-label{margin:2.2rem 0}@media screen and (max-width: 768px){pn-level-up-modal .pn-modal-label{justify-self:center}}@media screen and (max-width: 768px){pn-level-up-modal .level-up-phone-modal .pn-modal-content{height:100%;align-content:center;align-items:center}}pn-level-up-modal .level-up-phone-modal .pn-modal-content pn-spinner{justify-self:center}pn-level-up-modal .level-up-phone-modal .pn-modal-content .modal-content-container{display:flex;flex-direction:row;align-items:center;gap:1em}@media screen and (max-width: 768px){pn-level-up-modal .level-up-phone-modal .pn-modal-content .modal-content-container{flex-direction:column}}pn-level-up-modal .level-up-phone-modal .pn-modal-content .modal-content-list ol{font-size:1.8rem;line-height:1.6;margin-left:2rem;padding-left:2rem}pn-level-up-modal .level-up-phone-modal .pn-modal-content .modal-content-list li{margin-bottom:1rem}@media screen and (max-width: 768px){pn-level-up-modal .level-up-phone-modal .pn-modal-content .modal-content-list ol{font-size:1.6rem}}";
const PnLevelUpModalStyle0 = pnLevelUpModalCss;

const PnLevelUpModal = /*@__PURE__*/ proxyCustomElement(class PnLevelUpModal extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.modalToggle = createEvent(this, "modalToggle", 7);
        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 watchers() { return {
        "open": ["updateOpen"]
    }; }
    static get style() { return PnLevelUpModalStyle0; }
}, [0, "pn-level-up-modal", {
        "open": [516],
        "endpoint": [1],
        "instructionPhoneLineOne": [1, "instruction-phone-line-one"],
        "instructionPhoneLineTwo": [1, "instruction-phone-line-two"],
        "instructionPhoneLineThree": [1, "instruction-phone-line-three"],
        "headingText": [1, "heading-text"],
        "outdatedQRMessage": [1, "outdated-q-r-message"],
        "expiresInMessage": [1, "expires-in-message"],
        "system": [1],
        "qrAriaLabel": [1, "qr-aria-label"],
        "openModalToggle": [32],
        "isLoading": [32]
    }, undefined, {
        "open": ["updateOpen"]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["pn-level-up-modal", "pn-qr-code-generator"];
    components.forEach(tagName => { switch (tagName) {
        case "pn-level-up-modal":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, PnLevelUpModal);
            }
            break;
        case "pn-qr-code-generator":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}

export { PnLevelUpService as P, PnLevelUpModal as a, defineCustomElement as d };

//# sourceMappingURL=pn-level-up-modal2.js.map