@codedoc/core/dist/es6/components/util/toast/index.js

Create beautiful modern documentation websites.

import { BehaviorSubject } from 'rxjs';
import { ToastStyle } from './style';
import { ToastSwipe } from './swipe';
import { Icon } from '../../misc';
export function Toast(options, renderer, content) {
    const classes = this.theme.classes(ToastStyle);
    const visible = new BehaviorSubject(false);
    const container$ = renderer.create("div", { class: classes.container, "data-visible": visible },
        renderer.create("div", { class: classes.toast },
            renderer.create("div", { class: classes.content }, content),
            renderer.create("div", { class: classes.actions },
                options.actions || '',
                renderer.create("button", { onclick: () => hide() },
                    renderer.create(Icon, null, "close")))));
    const show = () => visible.next(true);
    const hide = () => {
        visible.next(false);
        remove();
    };
    const remove = () => setTimeout(() => container$.remove(), 150);
    const swipe = new ToastSwipe(container$, remove);
    this.track({
        bind() {
            setTimeout(show, 10);
            if (!('backdropFilter' in container$.style) && !('-webkit-backdrop-filter' in container$.style)) {
                container$.classList.add('no-blur');
            }
            const timeout = options.timeout || 3000;
            if (timeout !== -1) {
                setTimeout(() => {
                    if (!swipe.active())
                        hide();
                }, timeout);
            }
        }
    });
    return container$;
}
//# sourceMappingURL=index.js.map