import { Host, h } from "@stencil/core";
import { cls, tinyMDtoHTML } from "../../utils/helpers";
import { Lang } from "../../services/lang";
export class XDialog {
    constructor() {
        this.type = undefined;
        this.header = undefined;
        this.message = undefined;
        this.buttonCloseText = Lang.get('alert.close');
        this.buttonConfirmYesText = Lang.get('alert.confirm-yes');
        this.buttonConfirmNoText = Lang.get('alert.confirm-no');
        this.buttonConfirmLoading = undefined;
        this.buttonConfirmResult = undefined;
        this.interval = undefined;
        this.intervalActive = undefined;
    }
    componentDidLoad() {
        this.intervalActive = Boolean(this.interval);
        const buttonProgress = this.el.querySelector(".button--interval-progress");
        if (this.interval && buttonProgress) {
            buttonProgress.style.transitionDuration = `${this.interval}s`;
        }
        setTimeout((() => {
            this.startIntervalCount();
        }).bind(this), 10);
    }
    startIntervalCount() {
        if (this.interval) {
            this.el.querySelector(".button--interval-progress").classList.add("button--has-interval");
            this.intervalActive = true;
            window.setTimeout(() => {
                this.closeEvent.emit();
                this.intervalActive = false;
            }, this.interval * 1000);
        }
    }
    /**
     * Render component
     */
    render() {
        return h(Host, { key: 'f6732d93ba58452a74564dd14881e51b389d8288', class: cls(`dialog-${this.type}`, { 'alert-interval-progress': this.interval }) }, h("div", { key: '860726eb1ce47de78555900b4b84049e1de5d627' }, this.header && h("h4", { key: 'b019cd2edfee9e282b458792277e928bf2dd4bd4' }, tinyMDtoHTML(this.header)), this.message && h("p", { key: 'be539348cc2e50cdb2965633dd7490749709df60' }, tinyMDtoHTML(this.message)), this.type == 'confirm' && h("div", { key: '2bfd2e2f3b19078edff7cbafd06799cce8f6c1e4', class: "buttons" }, h("x-button", { key: 'ac42c24e9ae262d0b16b80984213dfa4706968f4', block: true, loading: this.buttonConfirmLoading && this.buttonConfirmResult, disabled: this.buttonConfirmLoading, onClick: () => this.confirmEvent.emit() }, this.buttonConfirmYesText), h("x-button", { key: '940121c86ef8966c795fd5fdde7a8b256f1355e3', block: true, loading: this.buttonConfirmLoading && !this.buttonConfirmResult, disabled: this.buttonConfirmLoading, onClick: () => this.refuseEvent.emit() }, this.buttonConfirmNoText)), this.type != 'confirm' && h("x-button", { key: 'f584d0718a38cafe5907268263d053f141a51b6a', color: "primary", loading: this.intervalActive, onClick: () => this.closeEvent.emit() }, this.buttonCloseText, h("span", { key: '8df4d1171b6904fa8150e8f02d5a33edf974af26', class: { 'button--interval-progress': Boolean(this.interval) } }))));
    }
    static get is() { return "x-dialog"; }
    static get originalStyleUrls() {
        return {
            "$": ["./style.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["style.css"]
        };
    }
    static get assetsDirs() { return ["../../resources/images"]; }
    static get properties() {
        return {
            "type": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "DialogType",
                    "resolved": "\"confirm\" | \"danger\" | \"default\" | \"error\" | \"exception\" | \"failure\" | \"forbidden\" | \"invalid\" | \"missing\" | \"no-result\" | \"payment\" | \"success\" | \"unknown\"",
                    "references": {
                        "DialogType": {
                            "location": "local",
                            "path": "/opt/atlassian/pipelines/agent/build/src/components/x-dialog/component.tsx",
                            "id": "src/components/x-dialog/component.tsx::DialogType"
                        }
                    }
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element style type"
                },
                "attribute": "type",
                "reflect": false
            },
            "header": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element header text"
                },
                "attribute": "header",
                "reflect": false
            },
            "message": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element message text"
                },
                "attribute": "message",
                "reflect": false
            },
            "buttonCloseText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": "Element confirmation close button text"
                },
                "attribute": "button-close-text",
                "reflect": false,
                "defaultValue": "Lang.get('alert.close')"
            },
            "buttonConfirmYesText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "button-confirm-yes-text",
                "reflect": false,
                "defaultValue": "Lang.get('alert.confirm-yes')"
            },
            "buttonConfirmNoText": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "button-confirm-no-text",
                "reflect": false,
                "defaultValue": "Lang.get('alert.confirm-no')"
            },
            "buttonConfirmLoading": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "button-confirm-loading",
                "reflect": false
            },
            "buttonConfirmResult": {
                "type": "boolean",
                "mutable": false,
                "complexType": {
                    "original": "boolean",
                    "resolved": "boolean",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "button-confirm-result",
                "reflect": false
            },
            "interval": {
                "type": "number",
                "mutable": false,
                "complexType": {
                    "original": "number",
                    "resolved": "number",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "attribute": "interval",
                "reflect": false
            }
        };
    }
    static get states() {
        return {
            "intervalActive": {}
        };
    }
    static get events() {
        return [{
                "method": "closeEvent",
                "name": "close",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }, {
                "method": "confirmEvent",
                "name": "confirm",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }, {
                "method": "refuseEvent",
                "name": "refuse",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [],
                    "text": ""
                },
                "complexType": {
                    "original": "any",
                    "resolved": "any",
                    "references": {}
                }
            }];
    }
    static get elementRef() { return "el"; }
}
