/*!
 * KoliBri - The accessible HTML-Standard
 */
import { h, Host } from "@stencil/core";
import { translate } from "../../i18n";
import { createUniqueId } from "../../utils/dev.utils";
import { KolButtonTag } from "../../core/component-names";
import { KolToastItemFc } from "../../functional-components";
import { Log } from "../../schema";
const TRANSITION_TIMEOUT = 300;
export class KolToastContainer {
    constructor() {
        this.state = {
            _toastStates: [],
        };
        this.translateToastCloseAll = translate('kol-toast-close-all');
        this.knownRenderFunctions = new Set();
    }
    componentWillLoad() {
        Log.warn('kol-toast-container is deprecated and will be removed in the next major version. Use kol-alert for inline notifications or kol-dialog for interactive messages instead. See https://github.com/public-ui/kolibri/issues/8372');
    }
    async enqueue(toast) {
        const newToastState = {
            toast: Object.assign(Object.assign({}, toast), { variant: 'card' }),
            status: 'adding',
            id: createUniqueId('toast'),
        };
        this.state = Object.assign(Object.assign({}, this.state), { _toastStates: [newToastState, ...this.state._toastStates] });
        setTimeout(() => {
            this.state = Object.assign(Object.assign({}, this.state), { _toastStates: this.state._toastStates.map((localToastState) => localToastState.id === newToastState.id && localToastState.status !== 'removing'
                    ? Object.assign(Object.assign({}, localToastState), { status: 'settled' }) : localToastState) });
        }, TRANSITION_TIMEOUT);
        return () => {
            this.handleClose(newToastState);
        };
    }
    handleClose(toastState) {
        const current = this.state._toastStates.find((t) => t.id === toastState.id);
        if (!current || current.status === 'removing') {
            return;
        }
        this.state = Object.assign(Object.assign({}, this.state), { _toastStates: this.state._toastStates.map((localToastState) => localToastState.id === toastState.id ? Object.assign(Object.assign({}, localToastState), { status: 'removing' }) : localToastState) });
        setTimeout(() => {
            var _a, _b;
            this.state = Object.assign(Object.assign({}, this.state), { _toastStates: this.state._toastStates.filter((localToastState) => localToastState.id !== toastState.id) });
            if (typeof toastState.toast.render === 'function') {
                this.knownRenderFunctions.delete(toastState.toast.render);
            }
            (_b = (_a = toastState.toast).onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
        }, TRANSITION_TIMEOUT);
    }
    async closeAll(immediate = false) {
        if (immediate) {
            this.state = Object.assign(Object.assign({}, this.state), { _toastStates: [] });
            this.knownRenderFunctions.clear();
        }
        else {
            const toastsToClose = [...this.state._toastStates];
            this.state = Object.assign(Object.assign({}, this.state), { _toastStates: toastsToClose.map((localToastState) => (Object.assign(Object.assign({}, localToastState), { status: 'removing' }))) });
            setTimeout(() => {
                this.state = Object.assign(Object.assign({}, this.state), { _toastStates: this.state._toastStates.filter((toastState) => toastsToClose.every((toastToClose) => toastToClose.id !== toastState.id)) });
                toastsToClose.forEach((toastState) => {
                    var _a, _b;
                    if (typeof toastState.toast.render === 'function') {
                        this.knownRenderFunctions.delete(toastState.toast.render);
                    }
                    (_b = (_a = toastState.toast).onClose) === null || _b === void 0 ? void 0 : _b.call(_a);
                });
            }, TRANSITION_TIMEOUT);
        }
    }
    handleToastRef(toastState, element) {
        if (element && typeof toastState.toast.render === 'function' && !this.knownRenderFunctions.has(toastState.toast.render)) {
            this.knownRenderFunctions.add(toastState.toast.render);
            toastState.toast.render(element, { close: () => this.handleClose(toastState) });
        }
    }
    render() {
        return (h(Host, { key: 'cf0e0e8cf3bc1561e28130d2deb7249d0c8f03b3', class: "kol-toast-container" }, this.state._toastStates.length > 1 && (h(KolButtonTag, { key: '7028da8c47841524c340a67e3eee6a55c0965b7d', _label: this.translateToastCloseAll, class: "kol-toast-container__button-close-all", _on: {
                onClick: () => {
                    void this.closeAll();
                },
            } })), this.state._toastStates.map((toastState) => (h(KolToastItemFc, { key: toastState.id, onClose: () => this.handleClose(toastState), ref: (element) => this.handleToastRef(toastState, element), toast: toastState.toast, status: toastState.status })))));
    }
    static get is() { return "kol-toast-container"; }
    static get encapsulation() { return "shadow"; }
    static get originalStyleUrls() {
        return {
            "default": ["./style.scss"]
        };
    }
    static get styleUrls() {
        return {
            "default": ["style.css"]
        };
    }
    static get states() {
        return {
            "state": {}
        };
    }
    static get methods() {
        return {
            "enqueue": {
                "complexType": {
                    "signature": "(toast: Toast) => Promise<() => void>",
                    "parameters": [{
                            "name": "toast",
                            "type": "{ description?: string | undefined; render?: ToastRenderFunction | undefined; label: string; type: \"default\" | \"info\" | \"success\" | \"warning\" | \"error\"; variant?: \"card\" | undefined; onClose?: (() => void) | undefined; }",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        },
                        "Toast": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::Toast"
                        },
                        "ToastState": {
                            "location": "import",
                            "path": "../../schema",
                            "id": "src/schema/index.ts::ToastState"
                        }
                    },
                    "return": "Promise<() => void>"
                },
                "docs": {
                    "text": "Adds a toast to the queue.",
                    "tags": []
                }
            },
            "closeAll": {
                "complexType": {
                    "signature": "(immediate?: boolean) => Promise<void>",
                    "parameters": [{
                            "name": "immediate",
                            "type": "boolean",
                            "docs": ""
                        }],
                    "references": {
                        "Promise": {
                            "location": "global",
                            "id": "global::Promise"
                        }
                    },
                    "return": "Promise<void>"
                },
                "docs": {
                    "text": "Closes all toasts.",
                    "tags": []
                }
            }
        };
    }
}
//# sourceMappingURL=shadow.js.map
