import { ChangeDetectionStrategy, Component, ContentChild, TemplateRef, ViewEncapsulation, } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { PageContentDirective, PageHeaderDirective, PageSiderDirective, PageToolbarDirective, } from './helper-directives';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
function PageComponent_div_2_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainer(0);
} }
function PageComponent_div_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 6);
    i0.ɵɵtemplate(1, PageComponent_div_2_ng_container_1_Template, 1, 0, "ng-container", 5);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r0 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.pageHeader);
} }
function PageComponent_div_3_ng_container_2_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainer(0);
} }
function PageComponent_div_3_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 7)(1, "div", 8);
    i0.ɵɵtemplate(2, PageComponent_div_3_ng_container_2_Template, 1, 0, "ng-container", 5);
    i0.ɵɵelementEnd()();
} if (rf & 2) {
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(2);
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r1.pageSider);
} }
function PageComponent_div_5_ng_container_1_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainer(0);
} }
function PageComponent_div_5_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 9);
    i0.ɵɵtemplate(1, PageComponent_div_5_ng_container_1_Template, 1, 0, "ng-container", 5);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const ctx_r2 = i0.ɵɵnextContext();
    i0.ɵɵadvance(1);
    i0.ɵɵproperty("ngTemplateOutlet", ctx_r2.pageToolbar);
} }
function PageComponent_ng_container_6_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainer(0);
} }
export class PageComponent {
    constructor() {
        this.classes = new Set();
        this.classes$$ = new BehaviorSubject(this.classes);
        document.querySelector('.index-loading-spinner')?.remove();
    }
    addClass(cls) {
        cls.split(' ').forEach(cl => {
            this.classes.add(cl.trim());
        });
        this.classes$$.next(this.classes);
    }
    removeClass(cls) {
        cls.split(' ').forEach(cl => {
            this.classes.delete(cl.trim());
        });
        this.classes$$.next(this.classes);
    }
}
PageComponent.ɵfac = function PageComponent_Factory(t) { return new (t || PageComponent)(); };
PageComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: PageComponent, selectors: [["acl-page"]], contentQueries: function PageComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
        i0.ɵɵcontentQuery(dirIndex, PageHeaderDirective, 5, TemplateRef);
        i0.ɵɵcontentQuery(dirIndex, PageContentDirective, 5, TemplateRef);
        i0.ɵɵcontentQuery(dirIndex, PageSiderDirective, 5, TemplateRef);
        i0.ɵɵcontentQuery(dirIndex, PageToolbarDirective, 5, TemplateRef);
    } if (rf & 2) {
        let _t;
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.pageHeader = _t.first);
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.pageContent = _t.first);
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.pageSider = _t.first);
        i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.pageToolbar = _t.first);
    } }, decls: 7, vars: 13, consts: [[1, "acl-page", 3, "ngClass"], ["class", "acl-page__header", 4, "ngIf"], ["class", "acl-page__sider-wrapper tw-fixed tw-top-0 tw-left-0 tw-h-[100vh]", 4, "ngIf"], [1, "acl-page__content"], ["class", "acl-page__toolbar", 4, "ngIf"], [4, "ngTemplateOutlet"], [1, "acl-page__header"], [1, "acl-page__sider-wrapper", "tw-fixed", "tw-top-0", "tw-left-0", "tw-h-[100vh]"], [1, "acl-page__sider-wrapper-scroll", "tw-h-full", "tw-overflow-y-auto", "tw-overflow-x-hidden"], [1, "acl-page__toolbar"]], template: function PageComponent_Template(rf, ctx) { if (rf & 1) {
        i0.ɵɵelementStart(0, "div", 0);
        i0.ɵɵpipe(1, "async");
        i0.ɵɵtemplate(2, PageComponent_div_2_Template, 2, 1, "div", 1);
        i0.ɵɵtemplate(3, PageComponent_div_3_Template, 3, 1, "div", 2);
        i0.ɵɵelementStart(4, "div", 3);
        i0.ɵɵtemplate(5, PageComponent_div_5_Template, 2, 1, "div", 4);
        i0.ɵɵtemplate(6, PageComponent_ng_container_6_Template, 1, 0, "ng-container", 5);
        i0.ɵɵelementEnd()();
    } if (rf & 2) {
        i0.ɵɵclassProp("hasHeader", ctx.pageHeader)("hasSider", ctx.pageSider)("hasToolbar", ctx.pageToolbar);
        i0.ɵɵproperty("ngClass", i0.ɵɵpipeBind1(1, 11, ctx.classes$$));
        i0.ɵɵadvance(2);
        i0.ɵɵproperty("ngIf", ctx.pageHeader);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngIf", ctx.pageSider);
        i0.ɵɵadvance(2);
        i0.ɵɵproperty("ngIf", ctx.pageToolbar);
        i0.ɵɵadvance(1);
        i0.ɵɵproperty("ngTemplateOutlet", ctx.pageContent);
    } }, dependencies: [i1.NgClass, i1.NgIf, i1.NgTemplateOutlet, i1.AsyncPipe], styles: [".acl-page{min-height:100vh;background-color:rgb(var(--aui-color-main-bg))}.acl-page__header{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;justify-content:space-between;align-items:center;height:60px;padding:0 20px 0 16px;background-color:var(--acl-page-header-background-color)}:root .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.1)}html[aui-theme-mode=light] .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.1)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.75)}}html[aui-theme-mode=dark] .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.75)}.acl-page__sider-wrapper{padding:44px 6px 0 10px;z-index:500;background-color:var(--acl-nav-background-color)}.acl-page__sider-wrapper-scroll{padding:44px 10px 0;width:240px;scrollbar-width:none}.sidenav-collapse .acl-page__sider-wrapper-scroll{width:60px}.sidenav-ani .acl-page__sider-wrapper-scroll{transition:width padding;transition-duration:.3s;transition-timing-function:cubic-bezier(.38,0,.24,1)}.acl-page__sider-wrapper-scroll::-webkit-scrollbar{display:none}.acl-page__sider-wrapper acl-nav-skeleton>ul{width:220px;overflow:hidden}.sidenav-collapse .acl-page__sider-wrapper acl-nav-skeleton>ul{width:40px;transform:translate(-8px)}.acl-page__toolbar{display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 0 0 20px}.acl-page__content{min-height:100vh;position:relative;padding:20px;min-width:1200px}.acl-page.hasSider .acl-page__content{min-width:960px;padding-left:0;margin-left:260px}.sidenav-collapse.acl-page.hasSider .acl-page__content{margin-left:80px}.sidenav-ani.acl-page.hasSider .acl-page__content{transition:margin-left;transition-duration:.3s;transition-timing-function:cubic-bezier(.38,0,.24,1)}.acl-page.hasHeader .acl-page__content{padding-top:80px}.acl-page.hasHeader.hasToolbar .acl-page__content,.acl-page.hasHeader .acl-page__sider-wrapper{padding-top:60px}\n"], encapsulation: 2, changeDetection: 0 });
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(PageComponent, [{
        type: Component,
        args: [{ selector: 'acl-page', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, preserveWhitespaces: false, template: "<div\n  class=\"acl-page\"\n  [class.hasHeader]=\"pageHeader\"\n  [class.hasSider]=\"pageSider\"\n  [class.hasToolbar]=\"pageToolbar\"\n  [ngClass]=\"classes$$ | async\"\n>\n  <div\n    *ngIf=\"pageHeader\"\n    class=\"acl-page__header\"\n  >\n    <ng-container *ngTemplateOutlet=\"pageHeader\"></ng-container>\n  </div>\n\n  <div\n    *ngIf=\"pageSider\"\n    class=\"acl-page__sider-wrapper tw-fixed tw-top-0 tw-left-0 tw-h-[100vh]\"\n  >\n    <div\n      class=\"acl-page__sider-wrapper-scroll tw-h-full tw-overflow-y-auto tw-overflow-x-hidden\"\n    >\n      <ng-container *ngTemplateOutlet=\"pageSider\"></ng-container>\n    </div>\n  </div>\n\n  <div class=\"acl-page__content\">\n    <div\n      *ngIf=\"pageToolbar\"\n      class=\"acl-page__toolbar\"\n    >\n      <ng-container *ngTemplateOutlet=\"pageToolbar\"></ng-container>\n    </div>\n    <ng-container *ngTemplateOutlet=\"pageContent\"></ng-container>\n  </div>\n</div>\n", styles: [".acl-page{min-height:100vh;background-color:rgb(var(--aui-color-main-bg))}.acl-page__header{position:fixed;top:0;left:0;right:0;z-index:600;display:flex;justify-content:space-between;align-items:center;height:60px;padding:0 20px 0 16px;background-color:var(--acl-page-header-background-color)}:root .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.1)}html[aui-theme-mode=light] .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.1)}@media (prefers-color-scheme: dark){html[aui-theme-mode=system] .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.75)}}html[aui-theme-mode=dark] .acl-page__header{box-shadow:0 0 4px 0 rgba(var(--aui-color-origin-shadow),.75)}.acl-page__sider-wrapper{padding:44px 6px 0 10px;z-index:500;background-color:var(--acl-nav-background-color)}.acl-page__sider-wrapper-scroll{padding:44px 10px 0;width:240px;scrollbar-width:none}.sidenav-collapse .acl-page__sider-wrapper-scroll{width:60px}.sidenav-ani .acl-page__sider-wrapper-scroll{transition:width padding;transition-duration:.3s;transition-timing-function:cubic-bezier(.38,0,.24,1)}.acl-page__sider-wrapper-scroll::-webkit-scrollbar{display:none}.acl-page__sider-wrapper acl-nav-skeleton>ul{width:220px;overflow:hidden}.sidenav-collapse .acl-page__sider-wrapper acl-nav-skeleton>ul{width:40px;transform:translate(-8px)}.acl-page__toolbar{display:flex;justify-content:space-between;align-items:center;height:44px;padding:0 0 0 20px}.acl-page__content{min-height:100vh;position:relative;padding:20px;min-width:1200px}.acl-page.hasSider .acl-page__content{min-width:960px;padding-left:0;margin-left:260px}.sidenav-collapse.acl-page.hasSider .acl-page__content{margin-left:80px}.sidenav-ani.acl-page.hasSider .acl-page__content{transition:margin-left;transition-duration:.3s;transition-timing-function:cubic-bezier(.38,0,.24,1)}.acl-page.hasHeader .acl-page__content{padding-top:80px}.acl-page.hasHeader.hasToolbar .acl-page__content,.acl-page.hasHeader .acl-page__sider-wrapper{padding-top:60px}\n"] }]
    }], function () { return []; }, { pageHeader: [{
            type: ContentChild,
            args: [PageHeaderDirective, { read: TemplateRef }]
        }], pageContent: [{
            type: ContentChild,
            args: [PageContentDirective, { read: TemplateRef }]
        }], pageSider: [{
            type: ContentChild,
            args: [PageSiderDirective, { read: TemplateRef }]
        }], pageToolbar: [{
            type: ContentChild,
            args: [PageToolbarDirective, { read: TemplateRef }]
        }] }); })();
//# sourceMappingURL=data:application/json;base64, 