'use strict';

var index = require('./index-Be9PlTB7.js');

const verdocsOkDialogCss = "@-webkit-keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}@keyframes verdocs-field-pulse{0%{background-color:rgba(0, 0, 0, 0.35)}50%{background-color:rgba(0, 0, 0, 0)}100%{background-color:rgba(0, 0, 0, 0.35)}}verdocs-ok-dialog{font-family:\"Inter\", \"Barlow\", sans-serif;-webkit-box-sizing:border-box;box-sizing:border-box}verdocs-ok-dialog.closed{display:none}verdocs-ok-dialog .background-overlay{position:fixed;z-index:10000;top:0;left:0;right:0;bottom:0;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:rgba(0, 0, 0, 0.4980392157)}verdocs-ok-dialog .dialog{max-width:60%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;border-radius:4px;overflow:hidden;-webkit-box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4);box-shadow:3px 3px 5px 1px rgba(40, 40, 40, 0.4)}verdocs-ok-dialog .heading{display:-ms-flexbox;display:flex;font-size:16px;-ms-flex-direction:row;flex-direction:row;padding:8px 16px;font-weight:bold;color:#ffffff;background:#46497d}verdocs-ok-dialog .content{font-size:16px;background:#ffffff;padding:20px}verdocs-ok-dialog .buttons{display:-ms-flexbox;display:flex;margin:30px 0 0 0;padding:0 20px;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}verdocs-ok-dialog .buttons verdocs-button{margin-left:16px}";

const VerdocsOkDialog = class {
    constructor(hostRef) {
        index.registerInstance(this, hostRef);
        this.next = index.createEvent(this, "next");
        this.exit = index.createEvent(this, "exit");
        /**
         * The title of the dialog. "title" is a reserved word, so we use heading.
         */
        this.heading = '';
        /**
         * The message content to display.
         */
        this.message = '';
        /**
         * Override the "OK" button's label
         */
        this.buttonLabel = 'OK';
        /**
         * If set, a cancel button will also be displayed. Note that the dialog is always cancelable by clicking the background
         * overlay to dismiss it.
         */
        this.showCancel = false;
        this.closed = false;
    }
    handleOk() {
        this.next.emit();
    }
    handleCancel() {
        this.exit.emit();
    }
    // We need a separate event handler for clicking the background because it can receive events "through" other child components
    handleDismiss(e) {
        this.closed = true;
        if (e.target.className === 'background-overlay') {
            e.preventDefault();
            this.exit.emit();
        }
    }
    render() {
        return (index.h(index.Host, { key: 'a53ec883d89c75014091071d45b629f14fb8a14f', class: this.closed ? 'closed' : '' }, index.h("div", { key: 'eeba1a34d586227ddbdbccb2ce6a273bf516a2ed', class: "background-overlay", onClick: e => this.handleDismiss(e) }, index.h("div", { key: 'd803f8cda0d55045eb85d13c98e359ded7fddf24', class: "dialog" }, index.h("div", { key: 'cd12ec9dd5c8e1e496ad1410a87fa866c7cd3143', class: "heading" }, this.heading), index.h("div", { key: '9256bbda5d99136202bd36847bf488c8b29de936', class: "content" }, index.h("div", { key: '3ffeaaf5cda9073ed5775acbe9bb44f2aca14fa2', class: "message", innerHTML: this.message }), index.h("div", { key: '0914a64b1de3f12de80cdb8536315eb3dd804fa1', class: "buttons" }, this.showCancel ? index.h("verdocs-button", { label: "CANCEL", variant: "outline", onClick: () => this.handleCancel() }) : index.h("div", { style: { display: 'none' } }), index.h("verdocs-button", { key: '6cffacc69dad4bfe86b324a6b15b684a8233557e', label: this.buttonLabel, onClick: () => this.handleOk() })))))));
    }
};
VerdocsOkDialog.style = verdocsOkDialogCss;

exports.verdocs_ok_dialog = VerdocsOkDialog;
//# sourceMappingURL=verdocs-ok-dialog.entry.cjs.js.map

//# sourceMappingURL=verdocs-ok-dialog.cjs.entry.js.map