/**
 * @license MIT
 * author: Cube Dev Team
 * @cube-dev/ui-kit v0.98.7
 * Released under the MIT license.
 */

import { jsx as _jsx } from "react/jsx-runtime";
import { createRef } from 'react';
import { createRoot } from 'react-dom/client';
import { CSSTransition, TransitionGroup } from 'react-transition-group';
import { Notification, } from '../components/overlays/Notification/Notification';
let ID = 0;
/**
 * @deprecated consider using `useNotificationsApi` instead
 */
export const notification = {
    root: null,
    defaultOptions: {
        duration: 5000,
    },
    items: [],
    init() {
        if (this.root)
            return;
        this.root = document.createElement('div');
        this.root.classList.add('cube-notification-container');
        document.body.appendChild(this.root);
        this._render([]);
    },
    render() {
        this.init();
        this._render();
    },
    _render(items) {
        if (!items) {
            items = this.items;
        }
        if (!this.root)
            return;
        const root = createRoot(this.root);
        root.render(_jsx(TransitionGroup, { className: "cube-notifications", children: items.map((item) => {
                const nodeRef = createRef();
                return (_jsx(CSSTransition, { nodeRef: nodeRef, timeout: 400, classNames: "cube-notification", children: _jsx("div", { ref: nodeRef, children: _jsx(Notification, { type: item.type, onClose: () => this.close(item.id), children: item.message }) }) }, item.id));
            }) }));
    },
    show(type, message, options = {}) {
        options = Object.assign({}, this.defaultOptions, options);
        const id = ++ID;
        this.items.push({ id, type, message });
        this.render();
        setTimeout(() => {
            this.close(id);
        }, options.duration);
    },
    close(id) {
        this.items = this.items.filter((item) => item.id !== id);
        this.render();
    },
    success(message, options) {
        this.show('success', message, options);
    },
    danger(message, options) {
        this.show('danger', message, options);
    },
    info(message, options) {
        this.show('note', message, options);
    },
};

        