var __classPrivateFieldGet = (this && this.__classPrivateFieldGet) || function (receiver, privateMap) {
    if (!privateMap.has(receiver)) {
        throw new TypeError("attempted to get private field on non-instance");
    }
    return privateMap.get(receiver);
};
var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (receiver, privateMap, value) {
    if (!privateMap.has(receiver)) {
        throw new TypeError("attempted to set private field on non-instance");
    }
    privateMap.set(receiver, value);
    return value;
};
var _messageTimer, _setColorShade;
import { library as iconLibrary } from '@fortawesome/fontawesome-svg-core';
import { h, Host } from "@stencil/core";
import { getColorShade, setColorShade } from '../../utils/color';
import { throttle } from '../../utils/throttle';
import { UUID } from '../../utils/uuid';
export class Root {
    constructor() {
        this._fab = false;
        this._messageQueue = [];
        _messageTimer.set(this, 0);
        _setColorShade.set(this, throttle(setColorShade, 200, { ensureLast: true }));
        this.handleSlotChange = () => {
            this._fab = !!this.el.querySelector('bce-fab:not([inline]');
        };
    }
    async accent(name, colors, mix) {
        return colors
            ? __classPrivateFieldGet(this, _setColorShade).call(this, this.el, name, colors, mix)
            : getColorShade(this.el, name);
    }
    alert(title, message, options = {}) {
        const dialog = document.createElement('bce-dialog');
        dialog.active = true;
        dialog.required = options.required == undefined ? true : options.required;
        dialog.innerHTML = `
      <h3>${title}</h3>
      <p>${message}</p>
    `;
        const action = document.createElement('bce-button');
        action.design = 'outline';
        action.slot = 'action';
        action.type = 'submit';
        action.innerText = options.ok || 'Ok';
        if (options.ok !== false)
            dialog.appendChild(action);
        return this.execute(dialog, res => {
            dialog.addEventListener('submit', () => res());
            dialog.addEventListener('backdrop', () => res());
            dialog.addEventListener('close', () => res());
        }, { display: true });
    }
    confirm(title, message, options = {}) {
        const dialog = document.createElement('bce-dialog');
        dialog.active = true;
        dialog.required = options.required == undefined ? true : options.required;
        dialog.innerHTML = `<h3>${title}</h3><p>${message}</p>`;
        const action2 = document.createElement('bce-button');
        action2.slot = 'action';
        action2.design = 'text';
        action2.innerText = options.cancel || 'Cancel';
        dialog.appendChild(action2);
        const action1 = document.createElement('bce-button');
        action1.slot = 'action';
        action1.design = 'outline';
        action1.innerText = options.ok || 'Ok';
        if (options.ok !== false)
            dialog.appendChild(action1);
        return this.execute(dialog, res => {
            dialog.addEventListener('backdrop', () => res(false));
            action1.addEventListener('click', () => res(true));
            action2.addEventListener('click', () => res(false));
        }, { display: true });
    }
    execute(el, exec, options = {}) {
        const defaults = { display: false };
        options = Object.assign({}, defaults, options);
        if (!options.display)
            el.style.display = 'none';
        const result = new Promise((res, rej) => {
            const execution = exec(res, rej);
            if (execution)
                res(execution);
        });
        this.el.appendChild(el);
        result.then(() => this.el.removeChild(el));
        return result;
    }
    async success(text, options = {}) {
        return this.message(text, Object.assign({ color: 'success', duration: 2 }, options));
    }
    async error(text, options = {}) {
        return this.message(text, Object.assign({ color: 'error', duration: 5 }, options));
    }
    async warning(text, options = {}) {
        return this.message(text, Object.assign({ color: 'warning', duration: 2 }, options));
    }
    async info(text, options = {}) {
        return this.message(text, Object.assign({ color: 'info', duration: 2 }, options));
    }
    async message(text, options = {}) {
        if (!text)
            return;
        // Messages have a minimum duration of 1 second and a maximum of 10 seconds
        let duration = options.duration || 2;
        duration = duration < 1 ? 1 : duration;
        duration = duration > 10 ? 10 : duration;
        const color = options.color;
        this._messageQueue = [...this._messageQueue, { text, color, duration }];
        this.messageCheck();
    }
    async addIcon(...definitions) {
        iconLibrary.add(...definitions);
    }
    messageCheck() {
        // Skip if there is no message or already displaying a message
        const [message] = this._messageQueue;
        if (!message || !!__classPrivateFieldGet(this, _messageTimer))
            return;
        // Remove message after specified duration
        __classPrivateFieldSet(this, _messageTimer, window.setTimeout(() => this.messageTimeout(), message.duration * 1000));
    }
    messageTimeout() {
        // Remove current message from queue
        this._messageQueue = this._messageQueue.slice(1);
        // Clear timer & check remaining queue
        __classPrivateFieldSet(this, _messageTimer, 0);
        this.messageCheck();
    }
    componentWillLoad() {
        this.handleSlotChange();
        if (!this.el.id)
            this.el.id = UUID.v4();
    }
    componentDidLoad() {
        const slot = this.el.shadowRoot.querySelector('slot');
        slot === null || slot === void 0 ? void 0 : slot.addEventListener('slotchange', this.handleSlotChange);
    }
    renderMessage() {
        const [message] = this._messageQueue;
        if (!message)
            return;
        return (h("bce-message", { key: __classPrivateFieldGet(this, _messageTimer), color: message.color, fab: this._fab }, message.text));
    }
    render() {
        return (h(Host, null,
            h("slot", null),
            this.renderMessage()));
    }
    static get is() { return "bce-root"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() { return {
        "$": ["bce-root.scss"]
    }; }
    static get styleUrls() { return {
        "$": ["bce-root.css"]
    }; }
    static get properties() { return {
        "mode": {
            "type": "string",
            "mutable": false,
            "complexType": {
                "original": "'default' | 'bucket'",
                "resolved": "\"bucket\" | \"default\"",
                "references": {}
            },
            "required": false,
            "optional": true,
            "docs": {
                "tags": [],
                "text": ""
            },
            "attribute": "mode",
            "reflect": true
        }
    }; }
    static get states() { return {
        "_fab": {},
        "_messageQueue": {}
    }; }
    static get methods() { return {
        "accent": {
            "complexType": {
                "signature": "(name: string, colors?: string, mix?: string) => Promise<string | void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    }
                },
                "return": "Promise<string | void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "alert": {
            "complexType": {
                "signature": "(title: string, message: string, options?: AlertOptions) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "AlertOptions": {
                        "location": "local"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "confirm": {
            "complexType": {
                "signature": "(title: string, message: string, options?: ConfirmOptions) => Promise<boolean>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "ConfirmOptions": {
                        "location": "local"
                    }
                },
                "return": "Promise<boolean>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "execute": {
            "complexType": {
                "signature": "<T>(el: HTMLElement, exec: Executor<T>, options?: ExecuteOptions) => Promise<T>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "T": {
                        "location": "global"
                    },
                    "HTMLElement": {
                        "location": "global"
                    },
                    "Executor": {
                        "location": "local"
                    },
                    "ExecuteOptions": {
                        "location": "local"
                    }
                },
                "return": "Promise<T>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "success": {
            "complexType": {
                "signature": "(text: string, options?: Partial<MessageOptions>) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "Partial": {
                        "location": "global"
                    },
                    "MessageOptions": {
                        "location": "import",
                        "path": "../../models/message-options"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "error": {
            "complexType": {
                "signature": "(text: string, options?: Partial<MessageOptions>) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "Partial": {
                        "location": "global"
                    },
                    "MessageOptions": {
                        "location": "import",
                        "path": "../../models/message-options"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "warning": {
            "complexType": {
                "signature": "(text: string, options?: Partial<MessageOptions>) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "Partial": {
                        "location": "global"
                    },
                    "MessageOptions": {
                        "location": "import",
                        "path": "../../models/message-options"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "info": {
            "complexType": {
                "signature": "(text: string, options?: Partial<MessageOptions>) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "Partial": {
                        "location": "global"
                    },
                    "MessageOptions": {
                        "location": "import",
                        "path": "../../models/message-options"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "message": {
            "complexType": {
                "signature": "(text: string, options?: Partial<MessageOptions>) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }, {
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "Partial": {
                        "location": "global"
                    },
                    "MessageOptions": {
                        "location": "import",
                        "path": "../../models/message-options"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        },
        "addIcon": {
            "complexType": {
                "signature": "(...definitions: (IconDefinition | IconPack)[]) => Promise<void>",
                "parameters": [{
                        "tags": [],
                        "text": ""
                    }],
                "references": {
                    "Promise": {
                        "location": "global"
                    },
                    "IconDefinition": {
                        "location": "import",
                        "path": "@fortawesome/fontawesome-svg-core"
                    },
                    "IconPack": {
                        "location": "import",
                        "path": "@fortawesome/fontawesome-svg-core"
                    }
                },
                "return": "Promise<void>"
            },
            "docs": {
                "text": "",
                "tags": []
            }
        }
    }; }
    static get elementRef() { return "el"; }
}
_messageTimer = new WeakMap(), _setColorShade = new WeakMap();
