import * as i0 from '@angular/core';
import { InjectionToken, input, booleanAttribute, Component, inject, ElementRef, PLATFORM_ID, forwardRef, computed, EventEmitter, Injectable } from '@angular/core';
import { Router, NavigationStart } from '@angular/router';
import { filter } from 'rxjs';
import { isPlatformServer } from '@angular/common';
import * as i1 from '@angular/cdk/scrolling';
import { CdkScrollable } from '@angular/cdk/scrolling';
import { signalStore, withState, withMethods, patchState } from '@ngrx/signals';

const LAYOUT = new InjectionToken('LAYOUT');
const LAYOUT_CONTENT = new InjectionToken('LAYOUT_CONTENT');

let nextId = 0;
class Layout {
    layoutId = input(`layout-${nextId++}`, ...(ngDevMode ? [{ debugName: "layoutId" }] : /* istanbul ignore next */ []));
    root = input(false, { ...(ngDevMode ? { debugName: "root" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Layout, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: Layout, isStandalone: true, selector: "ngs-layout", inputs: { layoutId: { classPropertyName: "layoutId", publicName: "layoutId", isSignal: true, isRequired: false, transformFunction: null }, root: { classPropertyName: "root", publicName: "root", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.is-root": "root()" }, classAttribute: "ngs-layout" }, providers: [
            {
                provide: LAYOUT,
                useExisting: Layout
            }
        ], exportAs: ["ngsLayout"], ngImport: i0, template: "<ng-content select=\"ngs-layout-topbar\"/>\n<ng-content select=\"ngs-layout-header\"/>\n<div class=\"body\">\n  <ng-content select=\"ngs-layout-sidebar\"/>\n  <div class=\"content\">\n    <ng-content/>\n  </div>\n  <ng-content select=\"ngs-layout-aside\"/>\n</div>\n<ng-content select=\"ngs-layout-footer\"/>\n", styles: [":host{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host.is-root{width:100dvw;height:100dvh}:host .body{display:flex;flex-grow:1;overflow:hidden;height:100%}:host .content{display:flex;flex-grow:1;flex-direction:column;overflow:hidden;position:relative}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: Layout, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout', exportAs: 'ngsLayout', standalone: true, providers: [
                        {
                            provide: LAYOUT,
                            useExisting: Layout
                        }
                    ], host: {
                        'class': 'ngs-layout',
                        '[class.is-root]': 'root()'
                    }, template: "<ng-content select=\"ngs-layout-topbar\"/>\n<ng-content select=\"ngs-layout-header\"/>\n<div class=\"body\">\n  <ng-content select=\"ngs-layout-sidebar\"/>\n  <div class=\"content\">\n    <ng-content/>\n  </div>\n  <ng-content select=\"ngs-layout-aside\"/>\n</div>\n<ng-content select=\"ngs-layout-footer\"/>\n", styles: [":host{display:flex;flex-direction:column;width:100%;height:100%;overflow:hidden}:host.is-root{width:100dvw;height:100dvh}:host .body{display:flex;flex-grow:1;overflow:hidden;height:100%}:host .content{display:flex;flex-grow:1;flex-direction:column;overflow:hidden;position:relative}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], propDecorators: { layoutId: [{ type: i0.Input, args: [{ isSignal: true, alias: "layoutId", required: false }] }], root: [{ type: i0.Input, args: [{ isSignal: true, alias: "root", required: false }] }] } });

class LayoutHeader {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: LayoutHeader, isStandalone: true, selector: "ngs-layout-header", host: { classAttribute: "ngs-layout-header" }, exportAs: ["ngsLayoutHeader"], ngImport: i0, template: "<ng-content />\n", styles: [":host{display:block;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutHeader, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout-header', exportAs: 'ngsLayoutHeader', host: {
                        'class': 'ngs-layout-header',
                    }, template: "<ng-content />\n", styles: [":host{display:block;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class LayoutContent {
    _router = inject(Router);
    _elementRef = inject(ElementRef);
    _platformId = inject(PLATFORM_ID);
    scrollable = inject(CdkScrollable);
    autoscrollToTop = input(true, { ...(ngDevMode ? { debugName: "autoscrollToTop" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
    scrollContainer() {
        return this._elementRef.nativeElement;
    }
    ngOnInit() {
        // Scroll a page to top if url changed
        this._router.events
            .pipe(filter(event => event instanceof NavigationStart))
            .subscribe(() => {
            if (!this.autoscrollToTop()) {
                return;
            }
            if (isPlatformServer(this._platformId)) {
                return;
            }
            this._elementRef.nativeElement.scrollTo({
                top: 0,
                left: 0
            });
        });
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutContent, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.4", type: LayoutContent, isStandalone: true, selector: "ngs-layout-content", inputs: { autoscrollToTop: { classPropertyName: "autoscrollToTop", publicName: "autoscrollToTop", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "ngs-layout-content ngs-scroll-lg" }, providers: [
            {
                provide: LAYOUT_CONTENT,
                useExisting: forwardRef(() => LayoutContent)
            }
        ], exportAs: ["ngsLayoutContent"], hostDirectives: [{ directive: i1.CdkScrollable }], ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;position:relative;overflow:hidden;flex-grow:1}:host:has(:not(.ngs-layout-content)){overflow:auto}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutContent, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout-content', exportAs: 'ngsLayoutContent', hostDirectives: [
                        CdkScrollable
                    ], providers: [
                        {
                            provide: LAYOUT_CONTENT,
                            useExisting: forwardRef(() => LayoutContent)
                        }
                    ], host: {
                        'class': 'ngs-layout-content ngs-scroll-lg'
                    }, template: "<ng-content/>\n", styles: [":host{display:block;position:relative;overflow:hidden;flex-grow:1}:host:has(:not(.ngs-layout-content)){overflow:auto}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }], propDecorators: { autoscrollToTop: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoscrollToTop", required: false }] }] } });

class LayoutFooter {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutFooter, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: LayoutFooter, isStandalone: true, selector: "ngs-layout-footer", host: { classAttribute: "ngs-layout-footer" }, exportAs: ["ngsLayoutFooter"], ngImport: i0, template: "<ng-content />\n", styles: [":host{display:block;grid-area:footer;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutFooter, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout-footer', exportAs: 'ngsLayoutFooter', host: {
                        'class': 'ngs-layout-footer',
                    }, template: "<ng-content />\n", styles: [":host{display:block;grid-area:footer;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class LayoutTopbar {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutTopbar, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: LayoutTopbar, isStandalone: true, selector: "ngs-layout-topbar", host: { classAttribute: "ngs-layout-topbar" }, exportAs: ["ngsLayoutTopbar"], ngImport: i0, template: "<ng-content />\n", styles: [":host{display:block;grid-area:topbar;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutTopbar, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout-topbar', exportAs: 'ngsLayoutTopbar', host: {
                        'class': 'ngs-layout-topbar'
                    }, template: "<ng-content />\n", styles: [":host{display:block;grid-area:topbar;flex:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

const initialState = {
    root: true
};
const LayoutSidebarStore = signalStore({ providedIn: 'root' }, withState(initialState), withMethods((store) => ({
    showSidebarVisibility(layoutId, isShown) {
        patchState(store, {
            [layoutId]: isShown
        });
    }
})));

class LayoutSidebar {
    _parent = inject(LAYOUT);
    _layoutSidebarStore = inject(LayoutSidebarStore);
    _isShown = computed(() => {
        if (this._parent.layoutId() in this._layoutSidebarStore) {
            return this._layoutSidebarStore[this._parent.layoutId()]();
        }
        return true;
    }, ...(ngDevMode ? [{ debugName: "_isShown" }] : /* istanbul ignore next */ []));
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutSidebar, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: LayoutSidebar, isStandalone: true, selector: "ngs-layout-sidebar", host: { properties: { "class.is-hidden": "!_isShown()" }, classAttribute: "ngs-layout-sidebar" }, exportAs: ["ngsLayoutSidebar"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;z-index:101}:host:has(.ngs-sidebar.compact){z-index:102}:host.is-hidden{display:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutSidebar, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout-sidebar', exportAs: 'ngsLayoutSidebar', host: {
                        'class': 'ngs-layout-sidebar',
                        '[class.is-hidden]': '!_isShown()'
                    }, template: "<ng-content/>\n", styles: [":host{display:block;z-index:101}:host:has(.ngs-sidebar.compact){z-index:102}:host.is-hidden{display:none}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class LayoutAside {
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutAside, deps: [], target: i0.ɵɵFactoryTarget.Component });
    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.4", type: LayoutAside, isStandalone: true, selector: "ngs-layout-aside", host: { classAttribute: "ngs-layout-aside" }, exportAs: ["ngsLayoutAside"], ngImport: i0, template: "<ng-content/>\n", styles: [":host{display:block;height:100%;flex:none;width:var(--ngs-layout-aside-width)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutAside, decorators: [{
            type: Component,
            args: [{ selector: 'ngs-layout-aside', exportAs: 'ngsLayoutAside', host: {
                        'class': 'ngs-layout-aside',
                    }, template: "<ng-content/>\n", styles: [":host{display:block;height:100%;flex:none;width:var(--ngs-layout-aside-width)}\n/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */\n"] }]
        }] });

class LayoutApiService {
    _layoutSidebarStore = inject(LayoutSidebarStore);
    sidebarVisibility = new EventEmitter();
    hideSidebar(layoutId) {
        this._layoutSidebarStore.showSidebarVisibility(layoutId, false);
        this.sidebarVisibility.emit({
            layoutId,
            shown: false
        });
    }
    showSidebar(layoutId) {
        this._layoutSidebarStore.showSidebarVisibility(layoutId, true);
        this.sidebarVisibility.emit({
            layoutId,
            shown: true
        });
    }
    toggleSidebar(layoutId) {
        this.isSidebarShown(layoutId) ? this.hideSidebar(layoutId) : this.showSidebar(layoutId);
    }
    isSidebarShown(layoutId) {
        return this._layoutSidebarStore[layoutId]();
    }
    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutApiService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutApiService, providedIn: 'root' });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.4", ngImport: i0, type: LayoutApiService, decorators: [{
            type: Injectable,
            args: [{
                    providedIn: 'root'
                }]
        }] });

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

export { LAYOUT, LAYOUT_CONTENT, Layout, LayoutApiService, LayoutAside, LayoutContent, LayoutFooter, LayoutHeader, LayoutSidebar, LayoutSidebarStore, LayoutTopbar };
//# sourceMappingURL=ngstarter-ui-components-layout.mjs.map
