import * as i0 from '@angular/core';
import { inject, Renderer2, ElementRef, input, numberAttribute, effect, afterNextRender, Component } from '@angular/core';
import { signalStore, withState, withMethods, patchState, getState } from '@ngrx/signals';
import { filter } from 'rxjs';
import { Router, NavigationEnd } from '@angular/router';

const initialState = {
    visible: true
};
const SplashScreenStore = signalStore({ providedIn: 'root' }, withState(initialState), withMethods((store) => ({
    show() {
        patchState(store, {
            visible: true
        });
    },
    hide() {
        patchState(store, {
            visible: false
        });
    }
})));

class SplashScreen {
    _store = inject(SplashScreenStore);
    _renderer = inject(Renderer2);
    _elementRef = inject(ElementRef);
    _router = inject(Router);
    animationDuration = input(500, { ...(ngDevMode ? { debugName: "animationDuration" } : /* istanbul ignore next */ {}), transform: numberAttribute }); // in milliseconds
    hideDelay = input(1000, { ...(ngDevMode ? { debugName: "hideDelay" } : /* istanbul ignore next */ {}), transform: numberAttribute }); // in milliseconds
    constructor() {
        const initialState = getState(this._store);
        effect(() => {
            const currentState = getState(this._store);
            if (initialState.visible === currentState.visible) {
                return;
            }
            if (currentState.visible) {
                this._show();
            }
            else {
                this._hide();
            }
        });
        afterNextRender(() => {
            const hideOnNavigationEnd = () => {
                setTimeout(() => {
                    this._hide();
                }, this.hideDelay());
            };
            if (this._router.navigated) {
                hideOnNavigationEnd();
                return;
            }
            const subscription = this._router.events
                .pipe(filter(event => event instanceof NavigationEnd))
                .subscribe(() => {
                subscription.unsubscribe();
                hideOnNavigationEnd();
            });
        });
    }
    ngOnInit() {
        this._renderer.setProperty(this._elementRef.nativeElement, '--ngs-splash-screen-hide-animation-duration', (this.animationDuration() / 1000) + 's');
    }
    _show() {
        const loaderEl = this._elementRef.nativeElement;
        this._renderer.setStyle(loaderEl, 'visibility', 'visible');
        this._renderer.setStyle(loaderEl, 'zIndex', '9999999');
    }
    _hide() {
        const loaderEl = this._elementRef.nativeElement;
        this._renderer.addClass(loaderEl, 'hide');
        setTimeout(() => {
            this._renderer.setStyle(loaderEl, 'visibility', 'hidden');
            this._renderer.setStyle(loaderEl, 'zIndex', '-9999999');
        }, this.animationDuration());
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SplashScreen, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: SplashScreen, isStandalone: true, selector: "ngs-splash-screen", inputs: { animationDuration: { classPropertyName: "animationDuration", publicName: "animationDuration", isSignal: true, isRequired: false, transformFunction: null }, hideDelay: { classPropertyName: "hideDelay", publicName: "hideDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngs-splash-screen" }, exportAs: ["ngsSplashScreen"], ngImport: i0, template: "<div>\n  <ng-content select=\"ngs-logo\"/>\n  <ng-content/>\n</div>\n", styles: [":host{--ngs-splash-screen-bg: var(--ngs-color-background);-webkit-user-select:none;user-select:none;position:fixed;inset:0;z-index:9999999;display:flex;align-items:center;justify-content:center;flex-direction:column;visibility:visible;background:var(--ngs-splash-screen-bg);--ngs-splash-screen-hide-animation-duration: .5s}:host.hide{opacity:0;transition:opacity var(--ngs-splash-screen-hide-animation-duration) ease-in-out}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: SplashScreen, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-splash-screen', exportAs: 'ngsSplashScreen', imports: [], host: {
                        'class': 'ngs-splash-screen',
                    }, template: "<div>\n  <ng-content select=\"ngs-logo\"/>\n  <ng-content/>\n</div>\n", styles: [":host{--ngs-splash-screen-bg: var(--ngs-color-background);-webkit-user-select:none;user-select:none;position:fixed;inset:0;z-index:9999999;display:flex;align-items:center;justify-content:center;flex-direction:column;visibility:visible;background:var(--ngs-splash-screen-bg);--ngs-splash-screen-hide-animation-duration: .5s}:host.hide{opacity:0;transition:opacity var(--ngs-splash-screen-hide-animation-duration) ease-in-out}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], ctorParameters: () => [], propDecorators: { animationDuration: [{ type: i0.Input, args: [{ isSignal: true, alias: "animationDuration", required: false }] }], hideDelay: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideDelay", required: false }] }] } });

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

export { SplashScreen, SplashScreenStore };
//# sourceMappingURL=ngstarter-ui-components-splash-screen.mjs.map
