import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostBinding, Input, Output, ViewChild } from '@angular/core';
import { PageHeaderPosition } from './components/layout-header/layout-header-entity';
import { LayoutMediaType } from './layout.entity';
import { BehaviorSubject, fromEvent, Subject } from 'rxjs';
import { debounceTime, distinctUntilChanged, takeUntil } from 'rxjs/operators';
import { SCROLL_OFFSET_FOR_PAGE_TITLE } from './layout-config';
import { isNullOrUndefined } from '@ironsource/fusion-ui/utils';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "./components/layout-header/layout-header.component";
import * as i3 from "@ironsource/fusion-ui/components/sidebar/v2";
import * as i4 from "@ironsource/fusion-ui/components/dynamic-components/v1";
const _c0 = ["mainContent"];
const _c1 = ["mediaSize"];
function LayoutComponent_ng_container_11_div_4_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementStart(0, "div", 13);
    i0.ɵɵelement(1, "fusion-dynamic-components", 14);
    i0.ɵɵelementEnd();
} if (rf & 2) {
    const pageHeaderTitle_r3 = i0.ɵɵnextContext().ngIf;
    i0.ɵɵadvance();
    i0.ɵɵproperty("configuration", pageHeaderTitle_r3 == null ? null : pageHeaderTitle_r3.content);
} }
function LayoutComponent_ng_container_11_Template(rf, ctx) { if (rf & 1) {
    i0.ɵɵelementContainerStart(0);
    i0.ɵɵelementStart(1, "div", 10)(2, "div", 11);
    i0.ɵɵtext(3);
    i0.ɵɵelementEnd();
    i0.ɵɵtemplate(4, LayoutComponent_ng_container_11_div_4_Template, 2, 1, "div", 12);
    i0.ɵɵelementEnd();
    i0.ɵɵelementContainerEnd();
} if (rf & 2) {
    const pageHeaderTitle_r3 = ctx.ngIf;
    const ctx_r1 = i0.ɵɵnextContext();
    i0.ɵɵadvance(3);
    i0.ɵɵtextInterpolate(pageHeaderTitle_r3 == null ? null : pageHeaderTitle_r3.text);
    i0.ɵɵadvance();
    i0.ɵɵproperty("ngIf", ctx_r1.showPageHeaderContent(!!(pageHeaderTitle_r3 == null ? null : pageHeaderTitle_r3.content)));
} }
const _c2 = ["*"];
export class LayoutComponent {
    set configuration(value) {
        this.sidebarConfiguration = {
            ...this.sidebarConfiguration,
            menuItems: value?.sidebarMenuItems ?? [],
            user: value?.user,
            pathNameNormalizeRegex: value?.pathNameNormalizeRegex,
            logoClickable: value?.logoClickable
        };
        this.setHeaderBehaviour(value?.headerConfiguration?.title);
        this.headerConfiguration = { ...value?.headerConfiguration, ...{ user: value?.user } };
    }
    set sidebarDynamicContent(value) {
        this.sidebarConfiguration = { ...this.sidebarConfiguration, sidebarDynamicContent: value };
    }
    get forceModeClass() {
        return this.forceScreenMode ? `fu-force-${this.forceScreenMode}` : null;
    }
    constructor(cdRef) {
        this.cdRef = cdRef;
        this.menuSidebarItemClicked = new EventEmitter();
        this.menuHeaderItemClicked = new EventEmitter();
        this.routeNavigationEnded = new EventEmitter();
        this.userLogout = new EventEmitter();
        this.logoClicked = new EventEmitter();
        this.sidebarConfiguration = {};
        this.pageHeaderTitle$ = new BehaviorSubject(null);
        this.pageHeaderBehaviourType$ = new BehaviorSubject('none');
        this.pageHeaderPositionEnum = PageHeaderPosition;
        this.pageHeaderPosition$ = new BehaviorSubject(PageHeaderPosition.OnTopPageContent);
        this.sidebarClosedHovered$ = new BehaviorSubject(false);
        this.onDestroy$ = new Subject();
    }
    ngOnInit() {
        this.initResizeListener();
        this.initScrollListener();
    }
    ngOnDestroy() {
        this.onDestroy$.next();
        this.onDestroy$.complete();
    }
    /**
     * Here will checked initial media-type (Desktop, Tablet, Mobile).
     * in case media-type not desktop will set sidebar closed (collapsed).
     */
    ngAfterViewInit() {
        // get current media-type size
        this.currentMediaSizeType = this.getMediaType();
        // for init in tablet and mobile - set sidebar close
        if (this.currentMediaSizeType !== LayoutMediaType.Desktop) {
            this.forceSidebarStateChange(false);
        }
    }
    /**
     * Emitted from header. Occur by click on 'hamburger' icon
     */
    onSidebarStateChanged() {
        this.sidebarOpen = !this.sidebarOpen;
        if (this.currentMediaSizeType !== LayoutMediaType.Desktop) {
            // for tablet and mobile set closed-hovered
            this.sidebarClosedHovered$.next(this.sidebarOpen);
        }
    }
    /**
     * Emitted from header. Occur by menu item in header menu clicked
     * - menuItem
     */
    onHeaderMenuItemClicked(menuItem) {
        this.menuHeaderItemClicked.emit(menuItem);
    }
    /**
     * Emitted from side-bar. Occur by menu item in side-bar clicked
     * - menuItem
     */
    onSidebarMenuItemClicked(menuItem) {
        this.menuSidebarItemClicked.emit(menuItem);
    }
    /**
     * Emitted from side-bar. Occur when sidebar closed (collapsed) and mouse over it.
     * - isHovered: mouse on sidebar - true
     */
    onSidebarClosedHovered(isHovered) {
        this.sidebarClosedHovered$.next(isHovered);
    }
    /**
     * Occur when user clicked on main content overlay. (relevant for mobile media-type only)
     */
    onMobileOverlayClicked() {
        this.sidebarOpen = !this.sidebarOpen;
        this.sidebarClosedHovered$.next(this.sidebarOpen);
    }
    /**
     * Emitted from side-bar. Occur when user click logout icon. (rendered in sidebar for mobile media-type only)
     * - user
     */
    onLogoutIconClicked(user) {
        this.userLogout.emit(user);
    }
    /**
     * Emitted from side-bar. Occur when user clicked on logo
     */
    onLogoClicked() {
        this.logoClicked.emit();
    }
    /**
     * Emitted from side-bar. Occur when route navigation ended (side-bar has observer for it)
     */
    onNavigationEnded() {
        this.mainContentScrollTop();
        // close sidebar (menu) for tablet and mobile
        if (this.currentMediaSizeType !== LayoutMediaType.Desktop && !this.forceScreenMode) {
            this.sidebarOpen = !this.sidebarOpen;
            this.sidebarClosedHovered$.next(this.sidebarOpen);
        }
        // emit event to consumer
        this.routeNavigationEnded.emit();
    }
    /**
     * Make scroll top for the main content
     * - offset (optional, default - 0)
     */
    mainContentScrollTop(offset = 0) {
        if (this.mainContent) {
            this.mainContent.nativeElement.scrollTop = offset;
        }
    }
    showPageHeaderContent(hasContent) {
        return (hasContent &&
            (this.pageHeaderPosition$.getValue() !== PageHeaderPosition.OnLayoutHeader ||
                this.pageHeaderBehaviourType$.getValue() === 'fixed'));
    }
    /**
     * Subscribe on window resize event for media-type size check.
     */
    initResizeListener() {
        fromEvent(window, 'resize')
            .pipe(takeUntil(this.onDestroy$), debounceTime(100), distinctUntilChanged())
            .subscribe(() => {
            const prevMediaSizeType = this.currentMediaSizeType;
            this.currentMediaSizeType = this.getMediaType();
            // on media size type changed by resize
            if (prevMediaSizeType !== this.currentMediaSizeType) {
                // in case sidebar was not collapsed and new mediasize tablet or mobile - close sidebar
                if (this.sidebarOpen && this.currentMediaSizeType !== LayoutMediaType.Desktop) {
                    this.sidebarClosedHovered$.next(true);
                }
                else if (this.sidebarOpen && this.currentMediaSizeType === LayoutMediaType.Desktop) {
                    this.sidebarClosedHovered$.next(false);
                }
            }
        });
    }
    /**
     * Scroll on main content listener used for page header behaviour
     */
    initScrollListener() {
        fromEvent(this.mainContent.nativeElement, 'scroll')
            .pipe(takeUntil(this.onDestroy$))
            .subscribe(($event) => {
            const scrollPosition = $event.target.scrollTop;
            this.pageHeaderPosition$.next(scrollPosition >= SCROLL_OFFSET_FOR_PAGE_TITLE ? PageHeaderPosition.OnLayoutHeader : PageHeaderPosition.OnTopPageContent);
        });
    }
    setHeaderBehaviour(value) {
        if (!!value && value.text && value.type && value.type !== 'static') {
            this.pageHeaderTitle$.next({
                text: value?.text,
                content: value?.content,
                type: value?.type
            });
            this.pageHeaderBehaviourType$.next(value?.type);
        }
        else {
            this.pageHeaderTitle$.next(null);
            this.pageHeaderBehaviourType$.next(value?.text ? 'static' : 'none');
        }
    }
    /**
     * For detection media size (supported: desktop, tablet, mobile)
     * used hidden DOM element for it
     */
    getMediaType() {
        // FU-89: force screen mode used for "emulation" screen size
        if (!isNullOrUndefined(this.forceScreenMode)) {
            return this.getForcedMediaType();
        }
        const content = window.getComputedStyle(this.mediaSizeDetector.nativeElement).content;
        // check if found media size detector content
        if (content) {
            // get enum value or return default (Desktop)
            return LayoutMediaType[content.replace(/\"/g, '')] ?? LayoutMediaType.Desktop;
        }
        return LayoutMediaType.Desktop;
    }
    getForcedMediaType() {
        switch (this.forceScreenMode) {
            case 'desktop':
                return LayoutMediaType.Desktop;
            case 'tablet':
                return LayoutMediaType.Tablet;
            case 'mobile':
                return LayoutMediaType.Mobile;
        }
        return null;
    }
    /**
     * For media-size tablet and mobile
     * - isClosed
     */
    forceSidebarStateChange(isClosed) {
        this.sidebarOpen = isClosed;
        this.cdRef.detectChanges();
    }
    static { this.ɵfac = function LayoutComponent_Factory(t) { return new (t || LayoutComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); }; }
    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LayoutComponent, selectors: [["fusion-layout"]], viewQuery: function LayoutComponent_Query(rf, ctx) { if (rf & 1) {
            i0.ɵɵviewQuery(_c0, 7);
            i0.ɵɵviewQuery(_c1, 7);
        } if (rf & 2) {
            let _t;
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.mainContent = _t.first);
            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.mediaSizeDetector = _t.first);
        } }, hostVars: 2, hostBindings: function LayoutComponent_HostBindings(rf, ctx) { if (rf & 2) {
            i0.ɵɵclassMap(ctx.forceModeClass);
        } }, inputs: { configuration: "configuration", sidebarDynamicContent: "sidebarDynamicContent", forceScreenMode: "forceScreenMode" }, outputs: { menuSidebarItemClicked: "menuSidebarItemClicked", menuHeaderItemClicked: "menuHeaderItemClicked", routeNavigationEnded: "routeNavigationEnded", userLogout: "userLogout", logoClicked: "logoClicked" }, ngContentSelectors: _c2, decls: 18, vars: 30, consts: [[1, "fu-sidebar-holder"], [3, "configuration", "saveSidebarState", "sidebarOpen", "sidebarOpenChange", "logoClicked", "sidebarClosedHovered", "sidebarMenuItemClicked", "navigationEnded", "logoutIconClicked"], [1, "fu-header-holder"], [3, "configuration", "sidebarOpen", "showPageHeaderContent", "sidebarToggleIconClicked", "layoutHeaderMenuItemClicked"], ["id", "fu-layout-main-view", 1, "fu-content-holder"], ["mainContent", ""], [4, "ngIf"], [1, "fu-layout-mobile-overlay", 3, "click"], [1, "fu-screen-size-detection"], ["mediaSize", ""], [1, "fu-layout-page-header"], [1, "fu-layout-page-header-title"], ["class", "fu-layout-page-header-content", 4, "ngIf"], [1, "fu-layout-page-header-content"], [3, "configuration"]], template: function LayoutComponent_Template(rf, ctx) { if (rf & 1) {
            i0.ɵɵprojectionDef();
            i0.ɵɵelementStart(0, "div");
            i0.ɵɵpipe(1, "async");
            i0.ɵɵpipe(2, "async");
            i0.ɵɵelementStart(3, "div", 0)(4, "fusion-sidebar", 1);
            i0.ɵɵtwoWayListener("sidebarOpenChange", function LayoutComponent_Template_fusion_sidebar_sidebarOpenChange_4_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.sidebarOpen, $event) || (ctx.sidebarOpen = $event); return $event; });
            i0.ɵɵlistener("logoClicked", function LayoutComponent_Template_fusion_sidebar_logoClicked_4_listener() { return ctx.onLogoClicked(); })("sidebarClosedHovered", function LayoutComponent_Template_fusion_sidebar_sidebarClosedHovered_4_listener($event) { return ctx.onSidebarClosedHovered($event); })("sidebarMenuItemClicked", function LayoutComponent_Template_fusion_sidebar_sidebarMenuItemClicked_4_listener($event) { return ctx.onSidebarMenuItemClicked($event); })("navigationEnded", function LayoutComponent_Template_fusion_sidebar_navigationEnded_4_listener() { return ctx.onNavigationEnded(); })("logoutIconClicked", function LayoutComponent_Template_fusion_sidebar_logoutIconClicked_4_listener($event) { return ctx.onLogoutIconClicked($event); });
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(5, "div", 2);
            i0.ɵɵpipe(6, "async");
            i0.ɵɵelementStart(7, "fusion-layout-header", 3);
            i0.ɵɵlistener("sidebarToggleIconClicked", function LayoutComponent_Template_fusion_layout_header_sidebarToggleIconClicked_7_listener() { return ctx.onSidebarStateChanged(); })("layoutHeaderMenuItemClicked", function LayoutComponent_Template_fusion_layout_header_layoutHeaderMenuItemClicked_7_listener($event) { return ctx.onHeaderMenuItemClicked($event); });
            i0.ɵɵpipe(8, "async");
            i0.ɵɵelementEnd()();
            i0.ɵɵelementStart(9, "div", 4, 5);
            i0.ɵɵtemplate(11, LayoutComponent_ng_container_11_Template, 5, 2, "ng-container", 6);
            i0.ɵɵpipe(12, "async");
            i0.ɵɵprojection(13);
            i0.ɵɵelementEnd();
            i0.ɵɵelementStart(14, "div", 7);
            i0.ɵɵlistener("click", function LayoutComponent_Template_div_click_14_listener() { return ctx.onMobileOverlayClicked(); });
            i0.ɵɵpipe(15, "async");
            i0.ɵɵelementEnd();
            i0.ɵɵelement(16, "div", 8, 9);
            i0.ɵɵelementEnd();
        } if (rf & 2) {
            i0.ɵɵclassMapInterpolate1("fu-layout fu-layout-page-header-behaviour-type_", i0.ɵɵpipeBind1(1, 18, ctx.pageHeaderBehaviourType$), "");
            i0.ɵɵclassProp("fu-layout-page-header-header", i0.ɵɵpipeBind1(2, 20, ctx.pageHeaderPosition$) === ctx.pageHeaderPositionEnum.OnLayoutHeader);
            i0.ɵɵadvance(4);
            i0.ɵɵproperty("configuration", ctx.sidebarConfiguration)("saveSidebarState", !ctx.forceScreenMode);
            i0.ɵɵtwoWayProperty("sidebarOpen", ctx.sidebarOpen);
            i0.ɵɵadvance();
            i0.ɵɵclassProp("fu-layout-sidebar-closed", !ctx.sidebarOpen)("fu-sidebar-closed-hovered", i0.ɵɵpipeBind1(6, 22, ctx.sidebarClosedHovered$));
            i0.ɵɵadvance(2);
            i0.ɵɵproperty("configuration", ctx.headerConfiguration)("sidebarOpen", ctx.sidebarOpen)("showPageHeaderContent", i0.ɵɵpipeBind1(8, 24, ctx.pageHeaderPosition$) === ctx.pageHeaderPositionEnum.OnLayoutHeader);
            i0.ɵɵadvance(4);
            i0.ɵɵproperty("ngIf", i0.ɵɵpipeBind1(12, 26, ctx.pageHeaderTitle$));
            i0.ɵɵadvance(3);
            i0.ɵɵclassProp("fu-sidebar-closed-hovered", i0.ɵɵpipeBind1(15, 28, ctx.sidebarClosedHovered$));
        } }, dependencies: [i1.NgIf, i2.LayoutHeaderComponent, i3.SidebarComponent, i4.DynamicComponentsComponent, i1.AsyncPipe], styles: ["\n\n\n[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]   .fu-layout-page-header-title[_ngcontent-%COMP%]{font-size:60px;font-family:NHaasGroteskDSPro-75Bd,sans-serif}[_nghost-%COMP%]   *[_ngcontent-%COMP%]{box-sizing:border-box}[_nghost-%COMP%]{margin:0;padding:0;vertical-align:initial;text-align:initial}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]{display:grid;grid-template-columns:min-content 1fr;grid-template-rows:var(--layout-header-height, 64px) auto;width:100vw;height:100vh}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-sidebar-holder[_ngcontent-%COMP%]{grid-row:span 2}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-header-holder[_ngcontent-%COMP%]{height:var(--layout-header-height, 64px);transition:padding-left .3s ease-out}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-header-holder.fu-sidebar-closed-hovered[_ngcontent-%COMP%]{padding-left:calc(var(--layout-sidebar-width, 220px) - var(--layout-sidebar-closed-width, 72px))}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]{height:calc(100vh - var(--layout-header-height, 64px) - 1px);margin-top:1px;overflow-y:auto}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]{height:var(--layout-page-header-height, 72px);margin:var(--layout-page-header-margin, 0 30px);display:flex;align-items:center;transition:opacity .3s ease-out}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]   .fu-layout-page-header-title[_ngcontent-%COMP%]{color:var(--layout-page-header-title-color, var(--fu-dark-500, #0d148c));line-height:1;white-space:nowrap}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]   .fu-layout-page-header-content[_ngcontent-%COMP%]{flex-grow:1}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-layout-mobile-overlay[_ngcontent-%COMP%]{display:none}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-screen-size-detection[_ngcontent-%COMP%]{content:\"Desktop\"}[_nghost-%COMP%]   .fu-layout.fu-layout-page-header-behaviour-type_fixed[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]   .fu-layout-page-header-content[_ngcontent-%COMP%]{position:fixed;z-index:1010;right:40px}[_nghost-%COMP%]   .fu-layout.fu-layout-page-header-header[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]{opacity:0}[_nghost-%COMP%]   .fu-layout.fu-layout-page-header-behaviour-type_fixed.fu-layout-page-header-header[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]{opacity:1}[_nghost-%COMP%]   .fu-layout.fu-layout-page-header-behaviour-type_fixed.fu-layout-page-header-header[_ngcontent-%COMP%]   .fu-content-holder[_ngcontent-%COMP%]   .fu-layout-page-header[_ngcontent-%COMP%]   .fu-layout-page-header-title[_ngcontent-%COMP%]{opacity:0}", "\n\n\n@media (min-width: 768px) and (max-width: 1279.98px){[_nghost-%COMP%]:not(.fu-force-desktop)   .fu-layout[_ngcontent-%COMP%]   .fu-header-holder.fu-sidebar-closed-hovered[_ngcontent-%COMP%]{padding-left:var(--layout-sidebar-width, 220px)}[_nghost-%COMP%]:not(.fu-force-desktop)   .fu-layout[_ngcontent-%COMP%]   .fu-sidebar-holder[_ngcontent-%COMP%]{display:block;width:0px}[_nghost-%COMP%]:not(.fu-force-desktop)   .fu-layout[_ngcontent-%COMP%]   .fu-screen-size-detection[_ngcontent-%COMP%]{content:\"Tablet\"}}", "\n\n\n@media (max-width: 767.98px){[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-header-holder.fu-sidebar-closed-hovered[_ngcontent-%COMP%]{padding-left:inherit}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-sidebar-holder[_ngcontent-%COMP%]{display:block;width:0px}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-layout-mobile-overlay[_ngcontent-%COMP%]{display:none;position:fixed;inset:0;background-color:#000;opacity:.5;overflow-x:auto;z-index:3008}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-layout-mobile-overlay.fu-sidebar-closed-hovered[_ngcontent-%COMP%]{display:inherit}[_nghost-%COMP%]   .fu-layout[_ngcontent-%COMP%]   .fu-screen-size-detection[_ngcontent-%COMP%]{content:\"Mobile\"}}", "\n\n\n.fu-light-theme[_nghost-%COMP%]{--layout-sidebar-border-right: solid 1px var(--fu-light-300, #e5e7e9);--layout-sidebar-backgroung-color: var(--fu-white, #ffffff);--layout-sidebar-delimiters-border: solid 1px var(--fu-light-300, #e5e7e9);--layout-sidebar-userdata-delimiters-border: solid 1px var(--fu-light-300, #e5e7e9);--layout-sidebar-user-data-color: var(--fu-dark-500, #0d148c);--layout-sidebar-user-logout-icon-color: rgba(13,10,140,.5);--layout-header-rigth-panel-border-right: none;--sidebar-menu-item-color: var(--fu-dark-500, #0d148c);--sidebar-menu-link-item-color: var(--fu-primary-500, #3083ff);--sidebar-menu-item-hover-background-color: var(--fu-light-100, #f7f8f9);--sidebar-menu-item-icon-arrow-color: rgb(13, 20, 140, .5);--sidebar-menu-item-link-icon-color: rgb(13, 20, 140, .5);--sidebar-menu-item-open-color: var(--fu-primary-500, #3083ff);--sidebar-menu-item-open-background-color: var(--fu-white, #ffffff);--sidebar-menu-mobile-background-color: var(--fu-white, #ffffff);--sidebar-menu-item-selected-border-color: var(--fu-primary-300, #96c0ff);--sidebar-menu-sub-item-title-opacity: 1;--sidebar-menu-sub-item-title-color: var(--fu-light-700, #a9afb4);--sidebar-menu-sub-menu-item-color: var(--fu-light-900, #7b838c);--sidebar-menu-subitem-hover-background-color: var(--fu-light-100, #f7f8f9);--sidebar-menu-subitem-selected-color: var(--fu-primary-500, #3083ff);--sidebar-menu-subitem-selected-background-color: var(--fu-primary-100, #e2eeff);--sidebar-menu-subitem-mobile-border-top: solid 1px var(--fu-light-300, #e5e7e9);--sidebar-menu-item-mobile-selected-color: var(--fu-dark-500, #0d148c);--sidebar-menu-mobile-selected-background-color: var(--fu-primary-100, #e2eeff)}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LayoutComponent, [{
        type: Component,
        args: [{ selector: 'fusion-layout', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n    class=\"fu-layout fu-layout-page-header-behaviour-type_{{ pageHeaderBehaviourType$ | async }}\"\n    [class.fu-layout-page-header-header]=\"(pageHeaderPosition$ | async) === pageHeaderPositionEnum.OnLayoutHeader\"\n>\n    <!--sidebar with logo and menu-->\n    <div class=\"fu-sidebar-holder\">\n        <fusion-sidebar\n            [configuration]=\"sidebarConfiguration\"\n            [saveSidebarState]=\"!forceScreenMode\"\n            [(sidebarOpen)]=\"sidebarOpen\"\n            (logoClicked)=\"onLogoClicked()\"\n            (sidebarClosedHovered)=\"onSidebarClosedHovered($event)\"\n            (sidebarMenuItemClicked)=\"onSidebarMenuItemClicked($event)\"\n            (navigationEnded)=\"onNavigationEnded()\"\n            (logoutIconClicked)=\"onLogoutIconClicked($event)\"\n        ></fusion-sidebar>\n    </div>\n    <!--sidebar with logo and menu-->\n    <!--header-->\n    <div\n        class=\"fu-header-holder\"\n        [class.fu-layout-sidebar-closed]=\"!sidebarOpen\"\n        [class.fu-sidebar-closed-hovered]=\"sidebarClosedHovered$ | async\"\n    >\n        <fusion-layout-header\n            [configuration]=\"headerConfiguration\"\n            [sidebarOpen]=\"sidebarOpen\"\n            [showPageHeaderContent]=\"(pageHeaderPosition$ | async) === pageHeaderPositionEnum.OnLayoutHeader\"\n            (sidebarToggleIconClicked)=\"onSidebarStateChanged()\"\n            (layoutHeaderMenuItemClicked)=\"onHeaderMenuItemClicked($event)\"\n        ></fusion-layout-header>\n    </div>\n    <!--header-->\n    <!--content-->\n    <div class=\"fu-content-holder\" id=\"fu-layout-main-view\" #mainContent>\n        <ng-container *ngIf=\"pageHeaderTitle$ | async as pageHeaderTitle\">\n            <div class=\"fu-layout-page-header\">\n                <div class=\"fu-layout-page-header-title\">{{ pageHeaderTitle?.text }}</div>\n                <div *ngIf=\"showPageHeaderContent(!!pageHeaderTitle?.content)\" class=\"fu-layout-page-header-content\">\n                    <fusion-dynamic-components [configuration]=\"pageHeaderTitle?.content\"></fusion-dynamic-components>\n                </div>\n            </div>\n        </ng-container>\n        <ng-content></ng-content>\n    </div>\n    <!--content-->\n    <!--mobile overlay-->\n    <div\n        class=\"fu-layout-mobile-overlay\"\n        [class.fu-sidebar-closed-hovered]=\"sidebarClosedHovered$ | async\"\n        (click)=\"onMobileOverlayClicked()\"\n    ></div>\n    <!--media size detection-->\n    <div class=\"fu-screen-size-detection\" #mediaSize></div>\n</div>\n", styles: ["/*!\n * Created on 2020.12.6 By Andy Kononenko (andyk@ironsrc.com)\n */:host .fu-layout .fu-content-holder .fu-layout-page-header .fu-layout-page-header-title{font-size:60px;font-family:NHaasGroteskDSPro-75Bd,sans-serif}:host *{box-sizing:border-box}:host{margin:0;padding:0;vertical-align:initial;text-align:initial}:host .fu-layout{display:grid;grid-template-columns:min-content 1fr;grid-template-rows:var(--layout-header-height, 64px) auto;width:100vw;height:100vh}:host .fu-layout .fu-sidebar-holder{grid-row:span 2}:host .fu-layout .fu-header-holder{height:var(--layout-header-height, 64px);transition:padding-left .3s ease-out}:host .fu-layout .fu-header-holder.fu-sidebar-closed-hovered{padding-left:calc(var(--layout-sidebar-width, 220px) - var(--layout-sidebar-closed-width, 72px))}:host .fu-layout .fu-content-holder{height:calc(100vh - var(--layout-header-height, 64px) - 1px);margin-top:1px;overflow-y:auto}:host .fu-layout .fu-content-holder .fu-layout-page-header{height:var(--layout-page-header-height, 72px);margin:var(--layout-page-header-margin, 0 30px);display:flex;align-items:center;transition:opacity .3s ease-out}:host .fu-layout .fu-content-holder .fu-layout-page-header .fu-layout-page-header-title{color:var(--layout-page-header-title-color, var(--fu-dark-500, #0d148c));line-height:1;white-space:nowrap}:host .fu-layout .fu-content-holder .fu-layout-page-header .fu-layout-page-header-content{flex-grow:1}:host .fu-layout .fu-layout-mobile-overlay{display:none}:host .fu-layout .fu-screen-size-detection{content:\"Desktop\"}:host .fu-layout.fu-layout-page-header-behaviour-type_fixed .fu-content-holder .fu-layout-page-header .fu-layout-page-header-content{position:fixed;z-index:1010;right:40px}:host .fu-layout.fu-layout-page-header-header .fu-content-holder .fu-layout-page-header{opacity:0}:host .fu-layout.fu-layout-page-header-behaviour-type_fixed.fu-layout-page-header-header .fu-content-holder .fu-layout-page-header{opacity:1}:host .fu-layout.fu-layout-page-header-behaviour-type_fixed.fu-layout-page-header-header .fu-content-holder .fu-layout-page-header .fu-layout-page-header-title{opacity:0}\n", "/*!\n * Created on 2020.12.6 By Andy Kononenko (andyk@ironsrc.com)\n */@media (min-width: 768px) and (max-width: 1279.98px){:host:not(.fu-force-desktop) .fu-layout .fu-header-holder.fu-sidebar-closed-hovered{padding-left:var(--layout-sidebar-width, 220px)}:host:not(.fu-force-desktop) .fu-layout .fu-sidebar-holder{display:block;width:0px}:host:not(.fu-force-desktop) .fu-layout .fu-screen-size-detection{content:\"Tablet\"}}\n", "/*!\n * Created on 2020.12.6 By Andy Kononenko (andyk@ironsrc.com)\n */@media (max-width: 767.98px){:host .fu-layout .fu-header-holder.fu-sidebar-closed-hovered{padding-left:inherit}:host .fu-layout .fu-sidebar-holder{display:block;width:0px}:host .fu-layout .fu-layout-mobile-overlay{display:none;position:fixed;inset:0;background-color:#000;opacity:.5;overflow-x:auto;z-index:3008}:host .fu-layout .fu-layout-mobile-overlay.fu-sidebar-closed-hovered{display:inherit}:host .fu-layout .fu-screen-size-detection{content:\"Mobile\"}}\n", "/*!\n * Created on 2020.12.6 By Andy Kononenko (andyk@ironsrc.com)\n */:host.fu-light-theme{--layout-sidebar-border-right: solid 1px var(--fu-light-300, #e5e7e9);--layout-sidebar-backgroung-color: var(--fu-white, #ffffff);--layout-sidebar-delimiters-border: solid 1px var(--fu-light-300, #e5e7e9);--layout-sidebar-userdata-delimiters-border: solid 1px var(--fu-light-300, #e5e7e9);--layout-sidebar-user-data-color: var(--fu-dark-500, #0d148c);--layout-sidebar-user-logout-icon-color: rgba(13,10,140,.5);--layout-header-rigth-panel-border-right: none;--sidebar-menu-item-color: var(--fu-dark-500, #0d148c);--sidebar-menu-link-item-color: var(--fu-primary-500, #3083ff);--sidebar-menu-item-hover-background-color: var(--fu-light-100, #f7f8f9);--sidebar-menu-item-icon-arrow-color: rgb(13, 20, 140, .5);--sidebar-menu-item-link-icon-color: rgb(13, 20, 140, .5);--sidebar-menu-item-open-color: var(--fu-primary-500, #3083ff);--sidebar-menu-item-open-background-color: var(--fu-white, #ffffff);--sidebar-menu-mobile-background-color: var(--fu-white, #ffffff);--sidebar-menu-item-selected-border-color: var(--fu-primary-300, #96c0ff);--sidebar-menu-sub-item-title-opacity: 1;--sidebar-menu-sub-item-title-color: var(--fu-light-700, #a9afb4);--sidebar-menu-sub-menu-item-color: var(--fu-light-900, #7b838c);--sidebar-menu-subitem-hover-background-color: var(--fu-light-100, #f7f8f9);--sidebar-menu-subitem-selected-color: var(--fu-primary-500, #3083ff);--sidebar-menu-subitem-selected-background-color: var(--fu-primary-100, #e2eeff);--sidebar-menu-subitem-mobile-border-top: solid 1px var(--fu-light-300, #e5e7e9);--sidebar-menu-item-mobile-selected-color: var(--fu-dark-500, #0d148c);--sidebar-menu-mobile-selected-background-color: var(--fu-primary-100, #e2eeff)}\n"] }]
    }], () => [{ type: i0.ChangeDetectorRef }], { configuration: [{
            type: Input
        }], sidebarDynamicContent: [{
            type: Input
        }], forceScreenMode: [{
            type: Input
        }], menuSidebarItemClicked: [{
            type: Output
        }], menuHeaderItemClicked: [{
            type: Output
        }], routeNavigationEnded: [{
            type: Output
        }], userLogout: [{
            type: Output
        }], logoClicked: [{
            type: Output
        }], mainContent: [{
            type: ViewChild,
            args: ['mainContent', { static: true }]
        }], mediaSizeDetector: [{
            type: ViewChild,
            args: ['mediaSize', { static: true }]
        }], forceModeClass: [{
            type: HostBinding,
            args: ['class']
        }] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LayoutComponent, { className: "LayoutComponent", filePath: "layout.component.ts", lineNumber: 40 }); })();
//# sourceMappingURL=data:application/json;base64, 