import * as i1 from '@angular/cdk/overlay';
import { CdkScrollable } from '@angular/cdk/overlay';
import * as i0 from '@angular/core';
import { InjectionToken, Directive, inject, TemplateRef, forwardRef, Component, ChangeDetectionStrategy, ViewEncapsulation, Inject, Injectable, Optional, Injector, ViewContainerRef, ViewChild, NgModule } from '@angular/core';
import { ComponentPortal } from '@angular/cdk/portal';
import { BehaviorSubject, merge, timer, filter as filter$1, shareReplay } from 'rxjs';
import * as i2 from '@angular/cdk/a11y';
import { NgTemplateOutlet, NgClass } from '@angular/common';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import * as i3 from '@koobiq/components/core';
import { KbqReadStateDirective, ThemePalette } from '@koobiq/components/core';
import * as i4 from '@koobiq/components/icon';
import { KbqIconModule } from '@koobiq/components/icon';
import * as i5 from '@koobiq/components/title';
import { KbqTitleModule } from '@koobiq/components/title';
import { filter } from 'rxjs/operators';
import { trigger, state, style, transition, animate } from '@angular/animations';

const kbqToastAnimations = {
    toastState: trigger('state', [
        state('void', style({ transform: 'translateX(100%)', opacity: 0 })),
        transition('* => visible', animate('150ms ease-out', style({ transform: 'translateX(0%)', opacity: 1 }))),
        transition('* => void', animate('300ms ease-in', style({ transform: 'translateX(50%)', opacity: 0, height: 0 })))
    ])
};
const toastState = kbqToastAnimations.toastState;

var KbqToastStyle;
(function (KbqToastStyle) {
    KbqToastStyle["Contrast"] = "contrast";
    KbqToastStyle["Success"] = "success";
    KbqToastStyle["Warning"] = "warning";
    KbqToastStyle["Error"] = "error";
})(KbqToastStyle || (KbqToastStyle = {}));
var KbqToastPosition;
(function (KbqToastPosition) {
    KbqToastPosition["TOP_RIGHT"] = "top-right";
    KbqToastPosition["TOP_LEFT"] = "top-left";
    KbqToastPosition["TOP_CENTER"] = "top-center";
    KbqToastPosition["BOTTOM_RIGHT"] = "bottom-right";
    KbqToastPosition["BOTTOM_LEFT"] = "bottom-left";
    KbqToastPosition["BOTTOM_CENTER"] = "bottom-center";
    KbqToastPosition["CENTER"] = "center";
})(KbqToastPosition || (KbqToastPosition = {}));
class KbqToastData {
}
const defaultToastConfig = {
    position: KbqToastPosition.TOP_RIGHT,
    duration: 5000,
    delay: 2000,
    onTop: false,
    indent: {
        vertical: 0,
        horizontal: 0
    }
};
const KBQ_TOAST_CONFIG = new InjectionToken('kbq-toast-config', {
    factory: () => defaultToastConfig
});
/** Utility provider for `KBQ_TOAST_CONFIG`. */
const kbqToastConfigurationProvider = (configuration) => ({
    provide: KBQ_TOAST_CONFIG,
    useValue: { ...defaultToastConfig, ...configuration }
});

class KbqToastCloseButton {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastCloseButton, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.14", type: KbqToastCloseButton, isStandalone: true, selector: "[kbq-toast-close-button]", host: { classAttribute: "kbq-toast__close-button" }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastCloseButton, decorators: [{
            type: Directive,
            args: [{
                    standalone: true,
                    selector: '[kbq-toast-close-button]',
                    host: {
                        class: 'kbq-toast__close-button'
                    }
                }]
        }] });
let id = 0;
class KbqToastComponent {
    get toastStyle() {
        return {
            [`kbq-toast_${this.data.style}`]: true
        };
    }
    get isFocusedOrHovered() {
        return this.hovered.getValue() || this.focused.getValue();
    }
    constructor(data, service, elementRef, focusMonitor) {
        this.data = data;
        this.service = service;
        this.elementRef = elementRef;
        this.focusMonitor = focusMonitor;
        this.readStateDirective = inject(KbqReadStateDirective, { host: true });
        this.themePalette = ThemePalette;
        this.animationState = 'void';
        this.hovered = new BehaviorSubject(false);
        this.focused = new BehaviorSubject(false);
        this.id = id++;
        this.$implicit = this;
        this.data.style = this.data.style || KbqToastStyle.Contrast;
        this.data.icon = this.data.icon !== undefined ? this.data.icon : true;
        this.data.iconClass = this.data.iconClass || undefined;
        this.data.closeButton = this.data.closeButton !== undefined ? this.data.closeButton : true;
        this.animationState = 'visible';
        this.runFocusMonitor();
        this.hovered.subscribe(this.service.hovered);
        this.focused.subscribe(this.service.focused);
        merge(this.hovered, this.focused)
            .pipe(filter((value) => value), takeUntilDestroyed())
            .subscribe(() => {
            if (this.ttl === 0) {
                return;
            }
            this.ttl = this.ttl < this.delay ? this.delay : this.ttl;
        });
        this.readStateDirective.read
            .pipe(filter((value) => value), takeUntilDestroyed())
            .subscribe(() => this.service.read.next(this.data));
    }
    ngOnDestroy() {
        this.stopFocusMonitor();
        this.hovered.next(false);
        this.focused.next(false);
    }
    close() {
        this.service.read.next(this.data);
        this.service.hide(this.id);
    }
    isTemplateRef(value) {
        return value instanceof TemplateRef;
    }
    onAnimation($event) {
        this.service.animation.next($event);
    }
    runFocusMonitor() {
        this.focusMonitor
            .monitor(this.elementRef.nativeElement, true)
            .subscribe((origin) => this.focused.next(!!origin));
    }
    stopFocusMonitor() {
        this.focusMonitor.stopMonitoring(this.elementRef.nativeElement);
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastComponent, deps: [{ token: KbqToastData }, { token: forwardRef(() => KbqToastService) }, { token: i0.ElementRef }, { token: i2.FocusMonitor }], target: i0.ɵɵFactoryTarget.Component }); }
    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.14", type: KbqToastComponent, isStandalone: true, selector: "kbq-toast", host: { listeners: { "@state.start": "onAnimation($event)", "@state.done": "onAnimation($event)", "mouseenter": "hovered.next(true)", "mouseleave": "hovered.next(false)", "keydown.esc": "close()" }, properties: { "class": "toastStyle", "class.kbq-toast_dismissible": "data.closeButton", "@state": "animationState" }, classAttribute: "kbq-toast" }, hostDirectives: [{ directive: i3.KbqReadStateDirective }], ngImport: i0, template: "@if (data.icon) {\n    <div class=\"kbq-toast__icon-container layout-row layout-align-start-start\">\n        @if (data.icon === true) {\n            @switch (data.style) {\n                @case ('contrast') {\n                    <i\n                        kbq-icon=\"kbq-info-circle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n                @case ('success') {\n                    <i\n                        kbq-icon=\"kbq-check-circle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n                @case ('warning') {\n                    <i\n                        kbq-icon=\"kbq-exclamation-triangle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n                @case ('error') {\n                    <i\n                        kbq-icon=\"kbq-exclamation-triangle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n            }\n        }\n        @if (isTemplateRef(data.icon)) {\n            <ng-container [ngTemplateOutlet]=\"$any(data.icon)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n        }\n    </div>\n}\n\n<div class=\"kbq-toast__container\">\n    @if (data.title) {\n        <div\n            kbq-title\n            class=\"kbq-toast__title\"\n            [class.kbq-toast__title_only-text]=\"!isTemplateRef(data.title)\"\n            [class.kbq-toast__title_with-content]=\"data.caption || data.content\"\n        >\n            @if (isTemplateRef(data.title)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.title)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            @if (!isTemplateRef(data.title)) {\n                <p>{{ data.title }}</p>\n            }\n        </div>\n    }\n\n    @if (data.caption) {\n        <div\n            kbq-title\n            [class.kbq-toast__text]=\"data.title\"\n            [class.kbq-toast__text_only-text]=\"!isTemplateRef(data.caption)\"\n            [class.kbq-toast__title]=\"!data.title\"\n        >\n            @if (isTemplateRef(data.caption)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.caption)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            <!-- prettier-ignore -->\n            @if (!isTemplateRef(data.caption)) {{{ data.caption }}}\n        </div>\n    }\n\n    @if (data.content) {\n        <div class=\"kbq-toast__content\" [class.kbq-toast__content_only-text]=\"!isTemplateRef(data.content)\">\n            @if (isTemplateRef(data.content)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.content)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            <!-- prettier-ignore -->\n            @if (!isTemplateRef(data.content)) {{{ data.content }}}\n        </div>\n    }\n\n    @if (data.actions) {\n        <div class=\"kbq-toast__actions\">\n            @if (isTemplateRef(data.actions)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.actions)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            @if (!isTemplateRef(data.actions)) {\n                {{ data.actions }}\n            }\n        </div>\n    }\n</div>\n\n@if (data.closeButton) {\n    <div>\n        @if (data.closeButton === true) {\n            <i kbq-icon-button=\"kbq-xmark-s_16\" kbq-toast-close-button (click)=\"close()\"></i>\n        }\n        @if (isTemplateRef(data.closeButton)) {\n            <ng-container [ngTemplateOutlet]=\"$any(data.closeButton)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n        }\n    </div>\n}\n", styles: [".kbq-toast{display:flex;box-sizing:border-box;width:var(--kbq-toast-size-container-width);height:auto;border-radius:var(--kbq-toast-size-container-border-radius);padding-left:var(--kbq-toast-size-container-padding-left);padding-right:var(--kbq-toast-size-container-padding-right)}.kbq-toast__icon-container{flex-shrink:0;width:var(--kbq-toast-size-icon-width);max-width:var(--kbq-toast-size-icon-width);height:var(--kbq-toast-size-icon-height);max-height:var(--kbq-toast-size-icon-height);border-radius:var(--kbq-toast-size-container-border-radius);margin-right:var(--kbq-toast-size-icon-margin-right);padding-top:calc(var(--kbq-toast-size-content-padding-top) + (var(--kbq-typography-text-normal-line-height) - var(--kbq-toast-size-icon-height)) / 2)}.kbq-toast__container{display:flex;flex-direction:column;flex:1;padding-top:var(--kbq-toast-size-content-padding-top);padding-right:var(--kbq-size-s);padding-bottom:var(--kbq-toast-size-content-padding-bottom);overflow:hidden}.kbq-toast__title{overflow:hidden;text-overflow:ellipsis}.kbq-toast__title>p{margin:0;overflow:hidden;text-overflow:ellipsis}.kbq-toast__title.kbq-toast__title_only-text{white-space:pre-wrap}.kbq-toast__title_with-content{padding-bottom:var(--kbq-toast-size-caption-padding-bottom)}.kbq-toast__text{display:flex;flex:1;align-items:center}.kbq-toast__text.kbq-toast__text_only-text{white-space:pre-wrap}.kbq-toast__content{display:flex;flex-direction:column}.kbq-toast__content.kbq-toast__content_only-text{white-space:pre-wrap}.kbq-toast__actions{display:flex;padding-top:var(--kbq-toast-size-button-stack-padding-top);gap:var(--kbq-toast-size-button-stack-content-gap-horizontal)}.kbq-toast__close-button{margin-top:calc(var(--kbq-toast-size-content-padding-top) - (var(--kbq-icon-button-size-small-vertical-padding) * 2 + 16px - var(--kbq-typography-text-normal-line-height)) / 2);margin-right:var(--kbq-toast-size-close-button-margin-right)}.kbq-toast__close-button.kbq-icon-button{--kbq-icon-button-size-normal-horizontal-padding: 4px;--kbq-icon-button-size-normal-vertical-padding: 4px}.kbq-toast.kbq-toast_contrast{box-shadow:var(--kbq-toast-contrast-container-shadow);background:var(--kbq-toast-contrast-container-background)}.kbq-toast.kbq-toast_contrast .kbq-toast__title{color:var(--kbq-toast-contrast-container-title)}.kbq-toast.kbq-toast_contrast .kbq-toast__text{color:var(--kbq-toast-contrast-container-text)}.kbq-toast.kbq-toast_success{box-shadow:var(--kbq-toast-success-container-shadow);background:var(--kbq-toast-success-container-background)}.kbq-toast.kbq-toast_success .kbq-toast__title{color:var(--kbq-toast-success-container-title)}.kbq-toast.kbq-toast_success .kbq-toast__text{color:var(--kbq-toast-success-container-text)}.kbq-toast.kbq-toast_warning{box-shadow:var(--kbq-toast-warning-container-shadow);background:var(--kbq-toast-warning-container-background)}.kbq-toast.kbq-toast_warning .kbq-toast__title{color:var(--kbq-toast-warning-container-title)}.kbq-toast.kbq-toast_warning .kbq-toast__text{color:var(--kbq-toast-warning-container-text)}.kbq-toast.kbq-toast_error{box-shadow:var(--kbq-toast-error-container-shadow);background:var(--kbq-toast-error-container-background)}.kbq-toast.kbq-toast_error .kbq-toast__title{color:var(--kbq-toast-error-container-title)}.kbq-toast.kbq-toast_error .kbq-toast__text{color:var(--kbq-toast-error-container-text)}.kbq-toast,.kbq-toast__title{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n", ":where(.kbq-toast-container){--kbq-toast-stack-size-margin-top: var(--kbq-size-m);--kbq-toast-stack-size-margin-right: var(--kbq-size-m);--kbq-toast-stack-size-margin-vertical: var(--kbq-size-m);--kbq-toast-stack-size-margin-horizontal: var(--kbq-size-m);--kbq-toast-stack-size-gap: var(--kbq-size-s);--kbq-toast-size-container-width: 360px;--kbq-toast-size-container-border-radius: var(--kbq-size-s);--kbq-toast-size-container-padding-left: var(--kbq-size-m);--kbq-toast-size-container-padding-right: var(--kbq-size-s);--kbq-toast-size-content-padding-top: var(--kbq-size-l);--kbq-toast-size-content-padding-bottom: var(--kbq-size-l);--kbq-toast-size-caption-padding-bottom: var(--kbq-size-xxs);--kbq-toast-size-icon-width: var(--kbq-size-l);--kbq-toast-size-icon-height: var(--kbq-size-l);--kbq-toast-size-icon-margin-right: var(--kbq-size-s);--kbq-toast-size-icon-border-radius: 50%;--kbq-toast-size-close-button-margin-top: var(--kbq-size-m);--kbq-toast-size-close-button-margin-right: var(--kbq-size-xxs);--kbq-toast-size-button-stack-padding-top: var(--kbq-size-s);--kbq-toast-size-button-stack-content-gap-horizontal: var(--kbq-size-m);--kbq-toast-contrast-container-background: var(--kbq-background-card);--kbq-toast-contrast-container-title: var(--kbq-foreground-contrast);--kbq-toast-contrast-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-contrast-container-shadow: var(--kbq-shadow-popup);--kbq-toast-error-container-background: var(--kbq-background-card);--kbq-toast-error-container-title: var(--kbq-foreground-contrast);--kbq-toast-error-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-error-container-shadow: var(--kbq-shadow-popup);--kbq-toast-warning-container-background: var(--kbq-background-card);--kbq-toast-warning-container-title: var(--kbq-foreground-contrast);--kbq-toast-warning-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-warning-container-shadow: var(--kbq-shadow-popup);--kbq-toast-success-container-background: var(--kbq-background-card);--kbq-toast-success-container-title: var(--kbq-foreground-contrast);--kbq-toast-success-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-success-container-shadow: var(--kbq-shadow-popup)}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: KbqIconModule }, { kind: "component", type: i4.KbqIcon, selector: "[kbq-icon]", inputs: ["small", "autoColor", "kbq-icon"] }, { kind: "component", type: i4.KbqIconButton, selector: "[kbq-icon-button]", inputs: ["small", "kbq-icon-button", "tabindex", "disabled"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: KbqTitleModule }, { kind: "directive", type: i5.KbqTitleDirective, selector: "[kbq-title]", exportAs: ["kbqTitle"] }, { kind: "directive", type: KbqToastCloseButton, selector: "[kbq-toast-close-button]" }], animations: [kbqToastAnimations.toastState], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastComponent, decorators: [{
            type: Component,
            args: [{ standalone: true, imports: [
                        NgTemplateOutlet,
                        KbqIconModule,
                        NgClass,
                        KbqTitleModule,
                        KbqToastCloseButton
                    ], selector: 'kbq-toast', host: {
                        class: 'kbq-toast',
                        '[class]': 'toastStyle',
                        '[class.kbq-toast_dismissible]': 'data.closeButton',
                        '[@state]': 'animationState',
                        '(@state.start)': 'onAnimation($event)',
                        '(@state.done)': 'onAnimation($event)',
                        '(mouseenter)': 'hovered.next(true)',
                        '(mouseleave)': 'hovered.next(false)',
                        '(keydown.esc)': 'close()'
                    }, animations: [kbqToastAnimations.toastState], hostDirectives: [KbqReadStateDirective], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "@if (data.icon) {\n    <div class=\"kbq-toast__icon-container layout-row layout-align-start-start\">\n        @if (data.icon === true) {\n            @switch (data.style) {\n                @case ('contrast') {\n                    <i\n                        kbq-icon=\"kbq-info-circle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n                @case ('success') {\n                    <i\n                        kbq-icon=\"kbq-check-circle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n                @case ('warning') {\n                    <i\n                        kbq-icon=\"kbq-exclamation-triangle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n                @case ('error') {\n                    <i\n                        kbq-icon=\"kbq-exclamation-triangle_16\"\n                        class=\"kbq-toast__icon\"\n                        [color]=\"$any(data.style)\"\n                        [ngClass]=\"data.iconClass\"\n                    ></i>\n                }\n            }\n        }\n        @if (isTemplateRef(data.icon)) {\n            <ng-container [ngTemplateOutlet]=\"$any(data.icon)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n        }\n    </div>\n}\n\n<div class=\"kbq-toast__container\">\n    @if (data.title) {\n        <div\n            kbq-title\n            class=\"kbq-toast__title\"\n            [class.kbq-toast__title_only-text]=\"!isTemplateRef(data.title)\"\n            [class.kbq-toast__title_with-content]=\"data.caption || data.content\"\n        >\n            @if (isTemplateRef(data.title)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.title)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            @if (!isTemplateRef(data.title)) {\n                <p>{{ data.title }}</p>\n            }\n        </div>\n    }\n\n    @if (data.caption) {\n        <div\n            kbq-title\n            [class.kbq-toast__text]=\"data.title\"\n            [class.kbq-toast__text_only-text]=\"!isTemplateRef(data.caption)\"\n            [class.kbq-toast__title]=\"!data.title\"\n        >\n            @if (isTemplateRef(data.caption)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.caption)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            <!-- prettier-ignore -->\n            @if (!isTemplateRef(data.caption)) {{{ data.caption }}}\n        </div>\n    }\n\n    @if (data.content) {\n        <div class=\"kbq-toast__content\" [class.kbq-toast__content_only-text]=\"!isTemplateRef(data.content)\">\n            @if (isTemplateRef(data.content)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.content)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            <!-- prettier-ignore -->\n            @if (!isTemplateRef(data.content)) {{{ data.content }}}\n        </div>\n    }\n\n    @if (data.actions) {\n        <div class=\"kbq-toast__actions\">\n            @if (isTemplateRef(data.actions)) {\n                <ng-container [ngTemplateOutlet]=\"$any(data.actions)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n            }\n            @if (!isTemplateRef(data.actions)) {\n                {{ data.actions }}\n            }\n        </div>\n    }\n</div>\n\n@if (data.closeButton) {\n    <div>\n        @if (data.closeButton === true) {\n            <i kbq-icon-button=\"kbq-xmark-s_16\" kbq-toast-close-button (click)=\"close()\"></i>\n        }\n        @if (isTemplateRef(data.closeButton)) {\n            <ng-container [ngTemplateOutlet]=\"$any(data.closeButton)\" [ngTemplateOutletContext]=\"{ $implicit }\" />\n        }\n    </div>\n}\n", styles: [".kbq-toast{display:flex;box-sizing:border-box;width:var(--kbq-toast-size-container-width);height:auto;border-radius:var(--kbq-toast-size-container-border-radius);padding-left:var(--kbq-toast-size-container-padding-left);padding-right:var(--kbq-toast-size-container-padding-right)}.kbq-toast__icon-container{flex-shrink:0;width:var(--kbq-toast-size-icon-width);max-width:var(--kbq-toast-size-icon-width);height:var(--kbq-toast-size-icon-height);max-height:var(--kbq-toast-size-icon-height);border-radius:var(--kbq-toast-size-container-border-radius);margin-right:var(--kbq-toast-size-icon-margin-right);padding-top:calc(var(--kbq-toast-size-content-padding-top) + (var(--kbq-typography-text-normal-line-height) - var(--kbq-toast-size-icon-height)) / 2)}.kbq-toast__container{display:flex;flex-direction:column;flex:1;padding-top:var(--kbq-toast-size-content-padding-top);padding-right:var(--kbq-size-s);padding-bottom:var(--kbq-toast-size-content-padding-bottom);overflow:hidden}.kbq-toast__title{overflow:hidden;text-overflow:ellipsis}.kbq-toast__title>p{margin:0;overflow:hidden;text-overflow:ellipsis}.kbq-toast__title.kbq-toast__title_only-text{white-space:pre-wrap}.kbq-toast__title_with-content{padding-bottom:var(--kbq-toast-size-caption-padding-bottom)}.kbq-toast__text{display:flex;flex:1;align-items:center}.kbq-toast__text.kbq-toast__text_only-text{white-space:pre-wrap}.kbq-toast__content{display:flex;flex-direction:column}.kbq-toast__content.kbq-toast__content_only-text{white-space:pre-wrap}.kbq-toast__actions{display:flex;padding-top:var(--kbq-toast-size-button-stack-padding-top);gap:var(--kbq-toast-size-button-stack-content-gap-horizontal)}.kbq-toast__close-button{margin-top:calc(var(--kbq-toast-size-content-padding-top) - (var(--kbq-icon-button-size-small-vertical-padding) * 2 + 16px - var(--kbq-typography-text-normal-line-height)) / 2);margin-right:var(--kbq-toast-size-close-button-margin-right)}.kbq-toast__close-button.kbq-icon-button{--kbq-icon-button-size-normal-horizontal-padding: 4px;--kbq-icon-button-size-normal-vertical-padding: 4px}.kbq-toast.kbq-toast_contrast{box-shadow:var(--kbq-toast-contrast-container-shadow);background:var(--kbq-toast-contrast-container-background)}.kbq-toast.kbq-toast_contrast .kbq-toast__title{color:var(--kbq-toast-contrast-container-title)}.kbq-toast.kbq-toast_contrast .kbq-toast__text{color:var(--kbq-toast-contrast-container-text)}.kbq-toast.kbq-toast_success{box-shadow:var(--kbq-toast-success-container-shadow);background:var(--kbq-toast-success-container-background)}.kbq-toast.kbq-toast_success .kbq-toast__title{color:var(--kbq-toast-success-container-title)}.kbq-toast.kbq-toast_success .kbq-toast__text{color:var(--kbq-toast-success-container-text)}.kbq-toast.kbq-toast_warning{box-shadow:var(--kbq-toast-warning-container-shadow);background:var(--kbq-toast-warning-container-background)}.kbq-toast.kbq-toast_warning .kbq-toast__title{color:var(--kbq-toast-warning-container-title)}.kbq-toast.kbq-toast_warning .kbq-toast__text{color:var(--kbq-toast-warning-container-text)}.kbq-toast.kbq-toast_error{box-shadow:var(--kbq-toast-error-container-shadow);background:var(--kbq-toast-error-container-background)}.kbq-toast.kbq-toast_error .kbq-toast__title{color:var(--kbq-toast-error-container-title)}.kbq-toast.kbq-toast_error .kbq-toast__text{color:var(--kbq-toast-error-container-text)}.kbq-toast,.kbq-toast__title{font-size:var(--kbq-typography-text-normal-font-size);font-style:var(--kbq-typography-text-normal-font-style);font-weight:var(--kbq-typography-text-normal-font-weight);line-height:var(--kbq-typography-text-normal-line-height);font-family:var(--kbq-typography-text-normal-font-family);text-transform:var(--kbq-typography-text-normal-text-transform);font-feature-settings:var(--kbq-typography-text-normal-font-feature-settings);letter-spacing:var(--kbq-typography-text-normal-letter-spacing)}\n", ":where(.kbq-toast-container){--kbq-toast-stack-size-margin-top: var(--kbq-size-m);--kbq-toast-stack-size-margin-right: var(--kbq-size-m);--kbq-toast-stack-size-margin-vertical: var(--kbq-size-m);--kbq-toast-stack-size-margin-horizontal: var(--kbq-size-m);--kbq-toast-stack-size-gap: var(--kbq-size-s);--kbq-toast-size-container-width: 360px;--kbq-toast-size-container-border-radius: var(--kbq-size-s);--kbq-toast-size-container-padding-left: var(--kbq-size-m);--kbq-toast-size-container-padding-right: var(--kbq-size-s);--kbq-toast-size-content-padding-top: var(--kbq-size-l);--kbq-toast-size-content-padding-bottom: var(--kbq-size-l);--kbq-toast-size-caption-padding-bottom: var(--kbq-size-xxs);--kbq-toast-size-icon-width: var(--kbq-size-l);--kbq-toast-size-icon-height: var(--kbq-size-l);--kbq-toast-size-icon-margin-right: var(--kbq-size-s);--kbq-toast-size-icon-border-radius: 50%;--kbq-toast-size-close-button-margin-top: var(--kbq-size-m);--kbq-toast-size-close-button-margin-right: var(--kbq-size-xxs);--kbq-toast-size-button-stack-padding-top: var(--kbq-size-s);--kbq-toast-size-button-stack-content-gap-horizontal: var(--kbq-size-m);--kbq-toast-contrast-container-background: var(--kbq-background-card);--kbq-toast-contrast-container-title: var(--kbq-foreground-contrast);--kbq-toast-contrast-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-contrast-container-shadow: var(--kbq-shadow-popup);--kbq-toast-error-container-background: var(--kbq-background-card);--kbq-toast-error-container-title: var(--kbq-foreground-contrast);--kbq-toast-error-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-error-container-shadow: var(--kbq-shadow-popup);--kbq-toast-warning-container-background: var(--kbq-background-card);--kbq-toast-warning-container-title: var(--kbq-foreground-contrast);--kbq-toast-warning-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-warning-container-shadow: var(--kbq-shadow-popup);--kbq-toast-success-container-background: var(--kbq-background-card);--kbq-toast-success-container-title: var(--kbq-foreground-contrast);--kbq-toast-success-container-text: var(--kbq-foreground-contrast-secondary);--kbq-toast-success-container-shadow: var(--kbq-shadow-popup)}\n"] }]
        }], ctorParameters: () => [{ type: KbqToastData }, { type: KbqToastService, decorators: [{
                    type: Inject,
                    args: [forwardRef(() => KbqToastService)]
                }] }, { type: i0.ElementRef }, { type: i2.FocusMonitor }] });

const KBQ_TOAST_FACTORY = new InjectionToken('KBQ_TOAST_FACTORY', {
    factory: () => KbqToastComponent
});
const CHECK_INTERVAL = 500;
let templateId = 0;
class KbqToastService {
    get toasts() {
        return Object.values(this.toastsDict).filter((item) => !item.hostView.destroyed);
    }
    get templates() {
        return Object.values(this.templatesDict);
    }
    constructor(overlay, injector, overlayContainer, ngZone, toastFactory, toastConfig) {
        this.overlay = overlay;
        this.injector = injector;
        this.overlayContainer = overlayContainer;
        this.ngZone = ngZone;
        this.toastFactory = toastFactory;
        this.toastConfig = toastConfig;
        this.read = new BehaviorSubject(null);
        this.hovered = new BehaviorSubject(false);
        this.focused = new BehaviorSubject(false);
        this.animation = new BehaviorSubject(null);
        this.timer = timer(CHECK_INTERVAL, CHECK_INTERVAL).pipe(filter$1(() => this.toasts.length > 0 && !this.hovered.getValue() && !this.focused.getValue()), 
        // eslint-disable-next-line rxjs/no-ignored-replay-buffer
        shareReplay());
        this.toastsDict = {};
        this.templatesDict = {};
        this.processToasts = () => {
            for (const toast of this.toasts.filter((item) => item.instance.ttl > 0)) {
                toast.instance.ttl -= CHECK_INTERVAL;
                if (toast.instance.ttl <= 0) {
                    this.ngZone.run(() => {
                        this.hide(toast.instance.id);
                        this.updateTTLAfterDelete();
                    });
                    break;
                }
            }
        };
        this.ngZone.runOutsideAngular(() => {
            this.timerSubscription = this.timer.subscribe(this.processToasts);
        });
    }
    ngOnDestroy() {
        this.timerSubscription.unsubscribe();
    }
    show(data, duration = this.toastConfig.duration, onTop = this.toastConfig.onTop) {
        this.prepareContainer();
        const componentRef = this.containerInstance.createToast(data, this.toastFactory, onTop);
        this.toastsDict[componentRef.instance.id] = componentRef;
        componentRef.instance.ttl = duration;
        componentRef.instance.delay = this.toastConfig.delay;
        return { ref: componentRef, id: componentRef.instance.id };
    }
    showTemplate(data, template, duration = this.toastConfig.duration, onTop = this.toastConfig.onTop) {
        this.prepareContainer();
        const viewRef = this.containerInstance.createTemplate(data, template, onTop);
        this.templatesDict[templateId] = viewRef;
        this.addRemoveTimer(templateId, duration);
        templateId++;
        return { ref: viewRef, id: templateId };
    }
    hide(id) {
        const componentRef = this.toastsDict[id];
        if (!componentRef) {
            return;
        }
        this.containerInstance.remove(componentRef.hostView);
        delete this.toastsDict[id];
        this.detachOverlay();
    }
    hideTemplate(id) {
        const viewRef = this.templatesDict[id];
        if (!viewRef) {
            return;
        }
        this.containerInstance.remove(viewRef);
        delete this.templatesDict[id];
        this.detachOverlay();
    }
    detachOverlay() {
        if (this.toasts.length !== 0) {
            return;
        }
        this.overlayRef.detach();
    }
    updateTTLAfterDelete() {
        this.toasts
            .filter((item) => item.instance.ttl > 0)
            .forEach((item) => (item.instance.ttl = this.toastConfig.delay));
    }
    addRemoveTimer(id, duration) {
        setTimeout(() => this.hideTemplate(id), duration);
    }
    prepareContainer() {
        this.createOverlay();
        this.portal = this.portal || new ComponentPortal(KbqToastContainerComponent, null, this.injector);
        if (!this.overlayRef.hasAttached()) {
            this.containerInstance = this.overlayRef.attach(this.portal).instance;
            this.containerInstance
                .getElementRef()
                .nativeElement.classList.add(`kbq-toast-container-${this.toastConfig.position}`);
        }
        this.toTop();
    }
    toTop() {
        const overlays = this.overlayContainer.getContainerElement().childNodes;
        if (overlays.length > 1) {
            overlays[overlays.length - 1].after(this.overlayRef.hostElement);
        }
    }
    createOverlay() {
        if (this.overlayRef) {
            return this.overlayRef;
        }
        const positionStrategy = this.getPositionStrategy(this.toastConfig.position);
        this.overlayRef = this.overlay.create({ positionStrategy });
        this.overlayRef.hostElement.classList.add('kbq-toast-overlay');
    }
    getPositionStrategy(position) {
        switch (position) {
            case KbqToastPosition.CENTER:
                return this.getCenter();
            case KbqToastPosition.BOTTOM_CENTER:
                return this.getBottomCenter();
            case KbqToastPosition.BOTTOM_LEFT:
                return this.getBottomLeft();
            case KbqToastPosition.BOTTOM_RIGHT:
                return this.getBottomRight();
            case KbqToastPosition.TOP_CENTER:
                return this.getTopCenter();
            case KbqToastPosition.TOP_LEFT:
                return this.getTopLeft();
            case KbqToastPosition.TOP_RIGHT:
                return this.getTopRight();
            default:
                return this.getTopCenter();
        }
    }
    getTopCenter() {
        return this.getGlobalOverlayPosition().top(`${this.toastConfig.indent.vertical}px`).centerHorizontally();
    }
    getTopLeft() {
        return this.getGlobalOverlayPosition()
            .top(`${this.toastConfig.indent.vertical}px`)
            .left(`${this.toastConfig.indent.horizontal}px`);
    }
    getTopRight() {
        return this.getGlobalOverlayPosition()
            .top(`${this.toastConfig.indent.vertical}px`)
            .right(`${this.toastConfig.indent.horizontal}px`);
    }
    getBottomCenter() {
        return this.getGlobalOverlayPosition().bottom(`${this.toastConfig.indent.vertical}px`).centerHorizontally();
    }
    getBottomLeft() {
        return this.getGlobalOverlayPosition()
            .bottom(`${this.toastConfig.indent.vertical}px`)
            .left(`${this.toastConfig.indent.horizontal}px`);
    }
    getBottomRight() {
        return this.getGlobalOverlayPosition()
            .bottom(`${this.toastConfig.indent.vertical}px`)
            .right(`${this.toastConfig.indent.horizontal}px`);
    }
    getCenter() {
        return this.getGlobalOverlayPosition().centerVertically().centerHorizontally();
    }
    getGlobalOverlayPosition() {
        return this.overlay.position().global();
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastService, deps: [{ token: i1.Overlay }, { token: i0.Injector }, { token: i1.OverlayContainer }, { token: i0.NgZone }, { token: KBQ_TOAST_FACTORY }, { token: KBQ_TOAST_CONFIG, optional: true }], target: i0.ɵɵFactoryTarget.Injectable }); }
    /** @nocollapse */ static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastService, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastService, decorators: [{
            type: Injectable,
            args: [{ providedIn: 'root' }]
        }], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.Injector }, { type: i1.OverlayContainer }, { type: i0.NgZone }, { type: undefined, decorators: [{
                    type: Inject,
                    args: [KBQ_TOAST_FACTORY]
                }] }, { type: undefined, decorators: [{
                    type: Optional
                }, {
                    type: Inject,
                    args: [KBQ_TOAST_CONFIG]
                }] }] });

class KbqToastContainerComponent extends CdkScrollable {
    constructor(injector, changeDetectorRef, service, elementRef, scrollDispatcher, ngZone) {
        super(elementRef, scrollDispatcher, ngZone);
        this.injector = injector;
        this.changeDetectorRef = changeDetectorRef;
        this.service = service;
        this.dispatchScrollEvent = () => {
            this.elementRef.nativeElement.dispatchEvent(new CustomEvent('scroll'));
        };
        this.service.animation.subscribe(this.dispatchScrollEvent);
    }
    createToast(data, componentType, onTop) {
        const injector = this.getInjector(data);
        const index = onTop ? 0 : undefined;
        this.changeDetectorRef.markForCheck();
        return this.viewContainer.createComponent(componentType, { injector, index });
    }
    createTemplate(data, template, onTop) {
        const index = onTop ? 0 : undefined;
        return this.viewContainer.createEmbeddedView(template, { $implicit: data }, index);
    }
    remove(viewRef) {
        const index = this.viewContainer.indexOf(viewRef);
        if (index < 0) {
            return;
        }
        this.viewContainer.remove(index);
    }
    getInjector(data) {
        return Injector.create({
            providers: [{ provide: KbqToastData, useValue: data }],
            parent: this.injector
        });
    }
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastContainerComponent, deps: [{ token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: forwardRef(() => KbqToastService) }, { token: i0.ElementRef }, { token: i1.ScrollDispatcher }, { token: i0.NgZone }], target: i0.ɵɵFactoryTarget.Component }); }
    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.14", type: KbqToastContainerComponent, isStandalone: true, selector: "kbq-toast-container", host: { classAttribute: "kbq-toast-container" }, viewQueries: [{ propertyName: "viewContainer", first: true, predicate: ["container"], descendants: true, read: ViewContainerRef, static: true }], usesInheritance: true, ngImport: i0, template: '<ng-container #container />', isInline: true, styles: [".kbq-toast-container{display:flex;flex-direction:column;align-items:flex-end;gap:var(--kbq-toast-stack-size-gap)}.kbq-toast-container.kbq-toast-container-top-right{margin-top:var(--kbq-toast-stack-size-margin-vertical);margin-right:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-top-left{margin-top:var(--kbq-toast-stack-size-margin-vertical);margin-left:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-top-center{margin-top:var(--kbq-toast-stack-size-margin-vertical)}.kbq-toast-container.kbq-toast-container-bottom-right{margin-bottom:var(--kbq-toast-stack-size-margin-vertical);margin-right:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-bottom-left{margin-bottom:var(--kbq-toast-stack-size-margin-vertical);margin-left:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-bottom-center{margin-bottom:var(--kbq-toast-stack-size-margin-vertical)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastContainerComponent, decorators: [{
            type: Component,
            args: [{ standalone: true, selector: 'kbq-toast-container', template: '<ng-container #container />', host: {
                        class: 'kbq-toast-container'
                    }, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, styles: [".kbq-toast-container{display:flex;flex-direction:column;align-items:flex-end;gap:var(--kbq-toast-stack-size-gap)}.kbq-toast-container.kbq-toast-container-top-right{margin-top:var(--kbq-toast-stack-size-margin-vertical);margin-right:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-top-left{margin-top:var(--kbq-toast-stack-size-margin-vertical);margin-left:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-top-center{margin-top:var(--kbq-toast-stack-size-margin-vertical)}.kbq-toast-container.kbq-toast-container-bottom-right{margin-bottom:var(--kbq-toast-stack-size-margin-vertical);margin-right:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-bottom-left{margin-bottom:var(--kbq-toast-stack-size-margin-vertical);margin-left:var(--kbq-toast-stack-size-margin-horizontal)}.kbq-toast-container.kbq-toast-container-bottom-center{margin-bottom:var(--kbq-toast-stack-size-margin-vertical)}\n"] }]
        }], ctorParameters: () => [{ type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: KbqToastService, decorators: [{
                    type: Inject,
                    args: [forwardRef(() => KbqToastService)]
                }] }, { type: i0.ElementRef }, { type: i1.ScrollDispatcher }, { type: i0.NgZone }], propDecorators: { viewContainer: [{
                type: ViewChild,
                args: ['container', { static: true, read: ViewContainerRef }]
            }] } });

const COMPONENTS = [
    KbqToastComponent,
    KbqToastCloseButton,
    KbqToastContainerComponent
];
class KbqToastModule {
    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "18.2.14", ngImport: i0, type: KbqToastModule, imports: [KbqToastComponent,
            KbqToastCloseButton,
            KbqToastContainerComponent], exports: [KbqToastComponent,
            KbqToastCloseButton,
            KbqToastContainerComponent] }); }
    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastModule, imports: [KbqToastComponent] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.14", ngImport: i0, type: KbqToastModule, decorators: [{
            type: NgModule,
            args: [{
                    imports: COMPONENTS,
                    exports: COMPONENTS
                }]
        }] });

/**
 * Generated bundle index. Do not edit.
 */

export { KBQ_TOAST_CONFIG, KBQ_TOAST_FACTORY, KbqToastCloseButton, KbqToastComponent, KbqToastContainerComponent, KbqToastData, KbqToastModule, KbqToastPosition, KbqToastService, KbqToastStyle, defaultToastConfig, kbqToastConfigurationProvider };
//# sourceMappingURL=koobiq-components-toast.mjs.map
